feat(ui): 统一应用主题色为天空蓝并优化渐变背景

将应用主色调从 '#BBF246' 更改为 '#87CEEB'（天空蓝），并更新所有相关组件和页面中的颜色引用。同时为多个页面添加统一的渐变背景，提升视觉效果和用户体验。新增压力分析模态框组件，并优化压力计组件的交互与显示逻辑。更新应用图标和启动图资源。

app/(tabs)/coach.tsx

@@ -17,7 +17,7 @@ import {
   Text,
   TextInput,
   TouchableOpacity,
-  View,
+  View
 } from 'react-native';
 import Markdown from 'react-native-markdown-display';
 import Animated, { FadeInDown, FadeInUp, Layout } from 'react-native-reanimated';
@@ -32,6 +32,7 @@ import { deleteConversation, getConversationDetail, listConversations, type AiCo
 import { loadAiCoachSessionCache, saveAiCoachSessionCache } from '@/services/aiCoachSession';
 import { api, getAuthToken, postTextStream } from '@/services/api';
 import dayjs from 'dayjs';
+import { LinearGradient } from 'expo-linear-gradient';
 import { ActionSheet } from '../../components/ui/ActionSheet';
 
 type Role = 'user' | 'assistant';
@@ -1121,7 +1122,7 @@ export default function CoachScreen() {
           style={[
             styles.bubble,
             {
-              backgroundColor: isUser ? theme.primary : 'rgba(187,242,70,0.16)',
+              backgroundColor: theme.card, // 16% opacity
               borderTopLeftRadius: isUser ? 16 : 6,
               borderTopRightRadius: isUser ? 6 : 16,
               maxWidth: isUser ? '82%' : '90%',
@@ -1347,7 +1348,7 @@ export default function CoachScreen() {
                         </View>
                       )}
                       {isSelected && isPending && (
-                        <ActivityIndicator size="small" color="#2D5016" />
+                        <ActivityIndicator size="small" color={Colors.light.accentGreenDark} />
                       )}
                       {isSelected && !isPending && (
                         <View style={styles.selectedBadge}>
@@ -1594,7 +1595,13 @@ export default function CoachScreen() {
   }
 
   return (
-    <View style={[styles.screen, { backgroundColor: theme.background }]}>
+    <View style={styles.screen}>
+      <LinearGradient
+        colors={[theme.backgroundGradientStart, theme.backgroundGradientEnd]}
+        style={styles.gradientBackground}
+        start={{ x: 0, y: 0 }}
+        end={{ x: 0, y: 1 }}
+      />
       {/* 顶部标题区域，显示教练名称、新建会话和历史按钮 */}
       <View
         style={[styles.header, { paddingTop: insets.top + 10 }]}
@@ -1608,14 +1615,14 @@ export default function CoachScreen() {
           <TouchableOpacity
             accessibilityRole="button"
             onPress={startNewConversation}
-            style={[styles.headerActionButton, { backgroundColor: 'rgba(187,242,70,0.2)' }]}
+            style={[styles.headerActionButton, { backgroundColor: `${Colors.light.accentGreen}33` }]} // 20% opacity
           >
             <Ionicons name="add-outline" size={18} color={theme.onPrimary} />
           </TouchableOpacity>
           <TouchableOpacity
             accessibilityRole="button"
             onPress={openHistory}
-            style={[styles.headerActionButton, { backgroundColor: 'rgba(187,242,70,0.2)' }]}
+            style={[styles.headerActionButton, { backgroundColor: `${Colors.light.accentGreen}33` }]} // 20% opacity
           >
             <Ionicons name="time-outline" size={18} color={theme.onPrimary} />
           </TouchableOpacity>
@@ -1680,7 +1687,7 @@ export default function CoachScreen() {
           contentContainerStyle={{ paddingHorizontal: 6, gap: 8 }}
         >
           {chips.map((c) => (
-            <TouchableOpacity key={c.key} style={[styles.chip, { borderColor: 'rgba(187,242,70,0.35)', backgroundColor: 'rgba(187,242,70,0.12)' }]} onPress={c.action}>
+            <TouchableOpacity key={c.key} style={[styles.chip, { borderColor: `${Colors.light.accentGreen}59`, backgroundColor: `${Colors.light.accentGreen}1F` }]} onPress={c.action}>
               <Text style={[styles.chipText, { color: '#192126' }]}>{c.label}</Text>
             </TouchableOpacity>
           ))}
@@ -1722,11 +1729,11 @@ export default function CoachScreen() {
           </ScrollView>
         )}
 
-        <View style={[styles.inputRow, { borderColor: 'rgba(187,242,70,0.35)', backgroundColor: 'rgba(187,242,70,0.08)' }]}>
+        <View style={[styles.inputRow, { borderColor: `${Colors.light.accentGreen}59`, backgroundColor: `${Colors.light.accentGreen}14` }]}>
           <TouchableOpacity
             accessibilityRole="button"
             onPress={pickImages}
-            style={[styles.mediaBtn, { backgroundColor: 'rgba(187,242,70,0.16)' }]}
+            style={[styles.mediaBtn, { backgroundColor: `${Colors.light.accentGreen}28` }]}
           >
             <Ionicons name="image-outline" size={18} color={'#192126'} />
           </TouchableOpacity>
@@ -1936,7 +1943,7 @@ const styles = StyleSheet.create({
     borderRadius: 8,
     alignItems: 'center',
     justifyContent: 'center',
-    backgroundColor: 'rgba(187,242,70,0.6)'
+    backgroundColor: `${Colors.light.accentGreen}99` // 60% opacity
   },
   dietOptionsContainer: {
     gap: 8,
@@ -1948,13 +1955,13 @@ const styles = StyleSheet.create({
     borderRadius: 12,
     backgroundColor: 'rgba(255,255,255,0.9)',
     borderWidth: 1,
-    borderColor: 'rgba(187,242,70,0.3)',
+    borderColor: `${Colors.light.accentGreen}4D`, // 30% opacity
   },
   dietOptionIconContainer: {
     width: 40,
     height: 40,
     borderRadius: 20,
-    backgroundColor: 'rgba(187,242,70,0.2)',
+    backgroundColor: `${Colors.light.accentGreen}33`, // 20% opacity
     alignItems: 'center',
     justifyContent: 'center',
     marginRight: 12,
@@ -2003,7 +2010,7 @@ const styles = StyleSheet.create({
     borderRadius: 10,
     alignItems: 'center',
     justifyContent: 'center',
-    backgroundColor: 'rgba(187,242,70,0.6)',
+    backgroundColor: `${Colors.light.accentGreen}99`, // 60% opacity
     alignSelf: 'flex-end',
   },
   // markdown 基础样式承载容器的字体尺寸保持与气泡一致
@@ -2316,17 +2323,17 @@ const styles = StyleSheet.create({
   choiceButton: {
     backgroundColor: 'rgba(255,255,255,0.9)',
     borderWidth: 1,
-    borderColor: 'rgba(187,242,70,0.3)',
+    borderColor: `${Colors.light.accentGreen}4D`, // 30% opacity
     borderRadius: 12,
     padding: 12,
   },
   choiceButtonRecommended: {
-    borderColor: 'rgba(187,242,70,0.6)',
-    backgroundColor: 'rgba(187,242,70,0.1)',
+    borderColor: `${Colors.light.accentGreen}99`, // 60% opacity
+    backgroundColor: `${Colors.light.accentGreen}1A`, // 10% opacity
   },
   choiceButtonSelected: {
-    borderColor: '#2D5016',
-    backgroundColor: 'rgba(187,242,70,0.2)',
+    borderColor: Colors.light.accentGreenDark,
+    backgroundColor: `${Colors.light.accentGreen}33`, // 20% opacity
     borderWidth: 2,
   },
   choiceButtonDisabled: {
@@ -2346,10 +2353,10 @@ const styles = StyleSheet.create({
     flex: 1,
   },
   choiceLabelRecommended: {
-    color: '#2D5016',
+    color: Colors.light.accentGreenDark,
   },
   choiceLabelSelected: {
-    color: '#2D5016',
+    color: Colors.light.accentGreenDark,
     fontWeight: '700',
   },
   choiceLabelDisabled: {
@@ -2361,7 +2368,7 @@ const styles = StyleSheet.create({
     gap: 8,
   },
   recommendedBadge: {
-    backgroundColor: 'rgba(187,242,70,0.8)',
+    backgroundColor: `${Colors.light.accentGreen}CC`, // 80% opacity
     borderRadius: 6,
     paddingHorizontal: 8,
     paddingVertical: 2,
@@ -2369,10 +2376,10 @@ const styles = StyleSheet.create({
   recommendedText: {
     fontSize: 12,
     fontWeight: '700',
-    color: '#2D5016',
+    color: Colors.light.accentGreenDark,
   },
   selectedBadge: {
-    backgroundColor: '#2D5016',
+    backgroundColor: Colors.light.accentGreenDark,
     borderRadius: 6,
     paddingHorizontal: 8,
     paddingVertical: 2,
@@ -2405,6 +2412,13 @@ const styles = StyleSheet.create({
     fontWeight: '600',
     color: '#FF4444',
   },
+  gradientBackground: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    top: 0,
+    bottom: 0,
+  },
 });
 
 const markdownStyles = {

app/(tabs)/personal.tsx

@@ -9,6 +9,7 @@ import { Ionicons } from '@expo/vector-icons';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import { useBottomTabBarHeight } from '@react-navigation/bottom-tabs';
 import { useFocusEffect } from '@react-navigation/native';
+import { LinearGradient } from 'expo-linear-gradient';
 import React, { useMemo, useState } from 'react';
 import { Alert, Image, Linking, SafeAreaView, ScrollView, StatusBar, StyleSheet, Switch, Text, TouchableOpacity, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
@@ -287,11 +288,17 @@ export default function PersonalScreen() {
   ];
 
   return (
-    <View style={[styles.container, { backgroundColor: theme === 'light' ? colorTokens.pageBackgroundEmphasis : colorTokens.background }]}>
+    <View style={styles.container}>
+      <LinearGradient
+        colors={[colors.backgroundGradientStart, colors.backgroundGradientEnd]}
+        style={styles.gradientBackground}
+        start={{ x: 0, y: 0 }}
+        end={{ x: 0, y: 1 }}
+      />
       <StatusBar barStyle={'dark-content'} backgroundColor="transparent" translucent />
-      <SafeAreaView style={[styles.safeArea, { backgroundColor: theme === 'light' ? colorTokens.pageBackgroundEmphasis : colorTokens.background }]}>
+      <SafeAreaView style={styles.safeArea}>
         <ScrollView
-          style={[styles.scrollView, { backgroundColor: theme === 'light' ? colorTokens.pageBackgroundEmphasis : colorTokens.background }]}
+          style={styles.scrollView}
           contentContainerStyle={{ paddingBottom: bottomPadding }}
           showsVerticalScrollIndicator={false}
         >
@@ -311,6 +318,13 @@ const styles = StyleSheet.create({
   container: {
     flex: 1,
   },
+  gradientBackground: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    top: 0,
+    bottom: 0,
+  },
   safeArea: {
     flex: 1,
   },

app/(tabs)/statistics.tsx

@@ -3,6 +3,7 @@ import { BMICard } from '@/components/BMICard';
 import { CircularRing } from '@/components/CircularRing';
 import { NutritionRadarCard } from '@/components/NutritionRadarCard';
 import { ProgressBar } from '@/components/ProgressBar';
+import { StressAnalysisModal } from '@/components/StressAnalysisModal';
 import { StressMeter } from '@/components/StressMeter';
 import { WeightHistoryCard } from '@/components/WeightHistoryCard';
 import { Colors } from '@/constants/Colors';
@@ -17,6 +18,7 @@ import { Ionicons } from '@expo/vector-icons';
 import { useBottomTabBarHeight } from '@react-navigation/bottom-tabs';
 import { useFocusEffect } from '@react-navigation/native';
 import dayjs from 'dayjs';
+import { LinearGradient } from 'expo-linear-gradient';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import {
   SafeAreaView,
@@ -85,6 +87,9 @@ export default function ExploreScreen() {
   const [nutritionSummary, setNutritionSummary] = useState<NutritionSummary | null>(null);
   const [isNutritionLoading, setIsNutritionLoading] = useState(false);
 
+  // 压力分析浮窗状态
+  const [showStressModal, setShowStressModal] = useState(false);
+
   // 记录最近一次请求的“日期键”，避免旧请求覆盖新结果
   const latestRequestKeyRef = useRef<string | null>(null);
 
@@ -110,7 +115,7 @@ export default function ExploreScreen() {
       } else {
         derivedDate = days[selectedIndex]?.date?.toDate() ?? new Date();
       }
-      
+
       const requestKey = getDateKey(derivedDate);
       latestRequestKeyRef.current = requestKey;
 
@@ -204,10 +209,28 @@ export default function ExploreScreen() {
     }
   };
 
+  // 处理压力卡片点击
+  const handleStressCardPress = () => {
+    setShowStressModal(true);
+  };
+
+  // 关闭压力分析浮窗
+  const handleCloseStressModal = () => {
+    setShowStressModal(false);
+  };
+
+  // 使用统一的渐变背景色
+  const backgroundGradientColors = [colorTokens.backgroundGradientStart, colorTokens.backgroundGradientEnd] as const;
 
   return (
-    <View style={[styles.container, { backgroundColor: theme === 'light' ? colorTokens.pageBackgroundEmphasis : colorTokens.background }]}>
-      <SafeAreaView style={[styles.safeArea, { backgroundColor: theme === 'light' ? colorTokens.pageBackgroundEmphasis : colorTokens.background }]}>
+    <View style={styles.container}>
+      <LinearGradient
+        colors={backgroundGradientColors}
+        style={styles.gradientBackground}
+        start={{ x: 0, y: 0 }}
+        end={{ x: 0, y: 1 }}
+      />
+      <SafeAreaView style={styles.safeArea}>
         <ScrollView
           style={styles.scrollView}
           contentContainerStyle={{ paddingBottom: bottomPadding }}
@@ -253,12 +276,13 @@ export default function ExploreScreen() {
           <View style={styles.masonryContainer}>
             {/* 左列 */}
             <View style={styles.masonryColumn}>
-              <StressMeter 
-                value={hrvValue} 
+              <StressMeter
+                value={hrvValue}
                 updateTime={hrvUpdateTime}
                 style={styles.masonryCard}
+                onPress={handleStressCardPress}
               />
-              
+
               <View style={[styles.masonryCard, styles.caloriesCard]}>
                 <Text style={styles.cardTitleSecondary}>消耗卡路里</Text>
                 {activeCalories != null ? (
@@ -306,20 +330,20 @@ export default function ExploreScreen() {
                 weight={userProfile?.weight ? parseFloat(userProfile.weight) : undefined}
                 height={userProfile?.height ? parseFloat(userProfile.height) : undefined}
                 style={styles.masonryCardNoBg}
-                compact={true}
+              // compact={true}
               />
 
               <View style={[styles.masonryCard, styles.trainingCard]}>
                 <Text style={styles.cardTitleSecondary}>训练时间</Text>
                 <View style={styles.trainingContent}>
-                                      <CircularRing
-                      size={120}
-                      strokeWidth={12}
-                      trackColor="#E2D9FD"
-                      progressColor="#8B74F3"
-                      progress={trainingProgress}
-                      resetToken={animToken}
-                    />
+                  <CircularRing
+                    size={120}
+                    strokeWidth={12}
+                    trackColor="#E2D9FD"
+                    progressColor="#8B74F3"
+                    progress={trainingProgress}
+                    resetToken={animToken}
+                  />
                 </View>
               </View>
 
@@ -347,16 +371,32 @@ export default function ExploreScreen() {
 
         </ScrollView>
       </SafeAreaView>
+
+      {/* 压力分析浮窗 */}
+      <StressAnalysisModal
+        visible={showStressModal}
+        onClose={handleCloseStressModal}
+        hrvValue={hrvValue}
+        updateTime={hrvUpdateTime}
+      />
     </View>
   );
 }
 
 const primary = Colors.light.primary;
+const lightColors = Colors.light;
+const darkColors = Colors.dark;
 
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    backgroundColor: '#F6F7F8',
+  },
+  gradientBackground: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    top: 0,
+    bottom: 0,
   },
   safeArea: {
     flex: 1,
@@ -388,10 +428,10 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
   },
   dayPillNormal: {
-    backgroundColor: '#C8F852',
+    backgroundColor: lightColors.datePickerNormal,
   },
   dayPillSelected: {
-    backgroundColor: '#192126',
+    backgroundColor: lightColors.datePickerSelected,
   },
   dayLabel: {
     fontSize: 16,
@@ -414,7 +454,7 @@ const styles = StyleSheet.create({
     width: 8,
     height: 8,
     borderRadius: 4,
-    backgroundColor: '#192126',
+    backgroundColor: lightColors.datePickerSelected,
     marginTop: 10,
     marginBottom: 4,
     alignSelf: 'center',

app/ai-posture-assessment.tsx

@@ -341,7 +341,7 @@ function UploadTile({
       >
         {uploading ? (
           <View style={[styles.placeholder, { backgroundColor: '#f5f5f5' }]}>
-            <ActivityIndicator size="large" color="#BBF246" />
+            <ActivityIndicator size="large" color={Colors.light.accentGreen} />
             <Text style={styles.placeholderTitle}>上传中...</Text>
           </View>
         ) : value ? (
@@ -349,7 +349,7 @@ function UploadTile({
         ) : (
           <View style={styles.placeholder}>
             <View style={styles.plusBadge}>
-              <Ionicons name="camera" size={16} color="#BBF246" />
+              <Ionicons name="camera" size={16} color={Colors.light.accentGreen} />
             </View>
             <Text style={styles.placeholderTitle}>拍摄或选择照片</Text>
             <Text style={styles.placeholderDesc}>点击拍摄，长按从相册选择</Text>
@@ -415,7 +415,7 @@ const styles = StyleSheet.create({
     paddingHorizontal: 14,
     height: 40,
     borderRadius: 12,
-    backgroundColor: '#BBF246',
+    backgroundColor: Colors.light.accentGreen,
   },
   permPrimaryText: {
     color: '#192126',
@@ -518,7 +518,7 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
     backgroundColor: '#FFFFFF',
     borderWidth: 2,
-    borderColor: '#BBF246',
+    borderColor: Colors.light.accentGreen,
   },
   placeholderTitle: {
     color: '#192126',

app/ai-posture-processing.tsx

@@ -166,7 +166,7 @@ const styles = StyleSheet.create({
     borderRadius: INNER_RING_SIZE / 2,
     borderWidth: 2,
     borderColor: 'rgba(187,242,70,0.65)',
-    shadowColor: '#BBF246',
+    shadowColor: Colors.light.accentGreen,
     shadowOffset: { width: 0, height: 0 },
     shadowOpacity: 0.35,
     shadowRadius: 24,
@@ -207,8 +207,8 @@ const styles = StyleSheet.create({
     width: 14,
     height: 14,
     borderRadius: 7,
-    backgroundColor: '#BBF246',
-    shadowColor: '#BBF246',
+    backgroundColor: Colors.light.accentGreen,
+    shadowColor: Colors.light.accentGreen,
     shadowOffset: { width: 0, height: 0 },
     shadowOpacity: 0.4,
     shadowRadius: 16,

app/challenge/day.tsx

@@ -1,4 +1,5 @@
 import { HeaderBar } from '@/components/ui/HeaderBar';
+import { Colors } from '@/constants/Colors';
 import { useAppDispatch, useAppSelector } from '@/hooks/redux';
 import { completeDay, setCustom } from '@/store/challengeSlice';
 import type { Exercise, ExerciseCustomConfig } from '@/utils/pilatesPlan';
@@ -158,7 +159,7 @@ const styles = StyleSheet.create({
   counterValue: { minWidth: 40, textAlign: 'center', fontWeight: '700', color: '#111827' },
   setPill: { paddingHorizontal: 10, paddingVertical: 6, borderRadius: 999 },
   setPillTodo: { backgroundColor: '#F3F4F6' },
-  setPillDone: { backgroundColor: '#BBF246' },
+  setPillDone: { backgroundColor: Colors.light.accentGreen },
   setPillText: { fontSize: 12, fontWeight: '700' },
   setPillTextTodo: { color: '#6B7280' },
   setPillTextDone: { color: '#192126' },
@@ -167,7 +168,7 @@ const styles = StyleSheet.create({
   tipsBox: { marginTop: 10, backgroundColor: '#F9FAFB', borderRadius: 8, padding: 10 },
   tipText: { fontSize: 12, color: '#6B7280', lineHeight: 18 },
   bottomBar: { position: 'absolute', left: 0, right: 0, bottom: 0, padding: 20, backgroundColor: 'transparent' },
-  finishBtn: { backgroundColor: '#BBF246', paddingVertical: 14, borderRadius: 999, alignItems: 'center' },
+  finishBtn: { backgroundColor: Colors.light.accentGreen, paddingVertical: 14, borderRadius: 999, alignItems: 'center' },
   finishBtnText: { color: '#192126', fontWeight: '800', fontSize: 16 },
 });
 

app/challenge/index.tsx

@@ -1,4 +1,5 @@
 import { HeaderBar } from '@/components/ui/HeaderBar';
+import { Colors } from '@/constants/Colors';
 import { useAppDispatch, useAppSelector } from '@/hooks/redux';
 import { useAuthGuard } from '@/hooks/useAuthGuard';
 import { initChallenge } from '@/store/challengeSlice';
@@ -113,7 +114,7 @@ const styles = StyleSheet.create({
   },
   summaryLeft: { flexDirection: 'row', alignItems: 'center' },
   progressPill: { width: 120, height: 10, borderRadius: 999, backgroundColor: '#E5E7EB', overflow: 'hidden' },
-  progressFill: { height: '100%', backgroundColor: '#BBF246' },
+  progressFill: { height: '100%', backgroundColor: Colors.light.accentGreen },
   progressText: { marginLeft: 12, fontWeight: '700', color: '#111827' },
   summaryRight: {},
   summaryItem: { fontSize: 12, color: '#6B7280' },
@@ -133,7 +134,7 @@ const styles = StyleSheet.create({
   dayNumberLocked: { color: '#9CA3AF' },
   dayMinutes: { marginTop: 4, fontSize: 12, color: '#6B7280' },
   bottomBar: { padding: 20 },
-  startButton: { backgroundColor: '#BBF246', paddingVertical: 14, borderRadius: 999, alignItems: 'center' },
+  startButton: { backgroundColor: Colors.light.accentGreen, paddingVertical: 14, borderRadius: 999, alignItems: 'center' },
   startButtonText: { color: '#192126', fontWeight: '800', fontSize: 16 },
 });
 

app/training-plan.tsx

@@ -178,7 +178,7 @@ function PlanCard({ plan, onPress, onDelete, onActivate, onSchedule, isActive, i
           </Pressable>
           <Pressable style={[styles.metricItem, isActive && styles.metricActive]} onPress={onActivate} hitSlop={8}>
             <Ionicons name={isActive ? 'checkmark-done-circle-outline' : 'flash-outline'} size={22} color="#E6EEF2" />
-            <Text style={[styles.metricText, { color: isActive ? '#BBF246' : '#E6EEF2' }]}>{isActive ? '已激活' : '激活'}</Text>
+            <Text style={[styles.metricText, { color: isActive ? Colors.light.accentGreen : '#E6EEF2' }]}>{isActive ? '已激活' : '激活'}</Text>
           </Pressable>
           <Pressable style={styles.metricItem} onPress={() => {
             Alert.alert('确认删除', '确定要删除这个训练计划吗？此操作无法撤销。', [