refactor(beautify): D24 flat 主题令牌全站收割 (hex 1579->1335)

- replace-hex-to-token.js 新增第四轮规则：16 个 flat 主题色 -> \-*
- 19 个文件 42 处 hex 收编（游戏 5 / 认知测评 2 / 饮食 4 / 健康 3 / 登录 / 成员 / 情绪趋势等）
- child-detail 局部 \-cd-* 中 10 个与全局同值的别名清理，仅保留 4 个专属色
- 全站硬编码色 1579 -> 1335；P1 保持 0，P2 48->44

cfc-frontend/components/RecommendedFeed.vue

@@ -212,7 +212,7 @@ export default {
   font-weight: 500;
 }
 .product-badge {
-  background: #FFF0E6;
+  background: $flat-warm;
   color: $brand-primary;
 }
 .activity-badge {

cfc-frontend/pages/cognitive-test/language-test.vue

@@ -397,7 +397,7 @@ export default {
 
 .cell-correct {
   background: #3d4a2f;
-  border-color: #4ECDC4;
+  border-color: $flat-teal;
 }
 
 .cell-wrong {

cfc-frontend/pages/cognitive-test/perception-test.vue

@@ -283,7 +283,7 @@ export default {
 }
 
 .btn-primary {
-  background: linear-gradient(135deg, #4ECDC4, #45B7AA);
+  background: linear-gradient(135deg, $flat-teal, #45B7AA);
   color: $app-surface;
   font-size: 34rpx;
   font-weight: bold;
@@ -340,7 +340,7 @@ export default {
 
 .timer-fill {
   height: 100%;
-  background: linear-gradient(90deg, #4ECDC4, #45B7AA);
+  background: linear-gradient(90deg, $flat-teal, #45B7AA);
   border-radius: 8rpx;
   transition: width 0.9s linear;
 }
@@ -348,7 +348,7 @@ export default {
 .timer-text {
   display: block;
   font-size: 26rpx;
-  color: #4ECDC4;
+  color: $flat-teal;
   margin-top: 12rpx;
   text-align: center;
 }
@@ -392,7 +392,7 @@ export default {
 
 .cell-correct {
   background: #2f4a4a;
-  border-color: #4ECDC4;
+  border-color: $flat-teal;
 }
 
 .cell-wrong {
@@ -415,7 +415,7 @@ export default {
   width: 260rpx;
   height: 260rpx;
   border-radius: 50%;
-  border: 10rpx solid #4ECDC4;
+  border: 10rpx solid $flat-teal;
   background: rgba(78,205,196,0.1);
   margin-bottom: 36rpx;
 }
@@ -423,7 +423,7 @@ export default {
 .score-num {
   font-size: 88rpx;
   font-weight: bold;
-  color: #4ECDC4;
+  color: $flat-teal;
 }
 
 .score-row {
@@ -440,8 +440,8 @@ export default {
 
 .dimension-tag {
   font-size: 24rpx;
-  color: #4ECDC4;
-  border: 2rpx solid #4ECDC4;
+  color: $flat-teal;
+  border: 2rpx solid $flat-teal;
   border-radius: 24rpx;
   padding: 6rpx 24rpx;
 }

cfc-frontend/pages/diet/food-query.vue

@@ -519,7 +519,7 @@ export default {
 .tab-active {
   border-color: $dim-body;
   color: $dim-body;
-  background-color: #FFF5EB;
+  background-color: $flat-card;
 }
 
 /* 筛选栏 */

cfc-frontend/pages/diet/index.vue

@@ -518,7 +518,7 @@ export default {
 .ingredient-list {
   margin-top: 8rpx;
 }
-.ingredient-item:active { background: #FFF9F0; }
+.ingredient-item:active { background: $flat-bg; }
 .ingredient-item {
   display: flex;
   align-items: center;

cfc-frontend/pages/diet/recommendation.vue

@@ -360,7 +360,7 @@ export default {
 .dish-list {
   padding: 20rpx 30rpx;
 }
-.dish-item { padding: 24rpx; border-radius: 20rpx; background: #FFF9F0; margin-bottom: 16rpx; }
+.dish-item { padding: 24rpx; border-radius: 20rpx; background: $flat-bg; margin-bottom: 16rpx; }
 .dish-item:last-child { margin-bottom: 0; }
 .dish-header {
   display: flex;
@@ -401,7 +401,7 @@ export default {
 .nutrition-item {
   text-align: center;
 }
-.nutrition-card .card-body { background: #FFF9F0; border-radius: 0 0 20rpx 20rpx; }
+.nutrition-card .card-body { background: $flat-bg; border-radius: 0 0 20rpx 20rpx; }
 .nutrition-value { font-size: 40rpx; font-weight: 700; color: $brand-primary-deep; display: block; }
 .nutrition-unit {
   font-size: calc(22rpx * var(--font-scale, 1));

cfc-frontend/pages/diet/record-detail.vue

@@ -275,7 +275,7 @@ export default {
 }
 .food-tag {
   padding: 12rpx 24rpx;
-  background-color: #FFF5EB;
+  background-color: $flat-card;
   border-radius: 30rpx;
   font-size: 24rpx;
   color: $dim-body;

cfc-frontend/pages/games/1a2b.vue

@@ -247,7 +247,7 @@ export default {
   margin-bottom: 20rpx;
 }
 .start-btn, .guess-btn {
-  background: #4ECDC4;
+  background: $flat-teal;
   color: $app-ink-night;
   border-radius: 12rpx;
   padding: 20rpx;
@@ -300,7 +300,7 @@ export default {
   margin-bottom: 20rpx;
 }
 .restart-btn {
-  background: #4ECDC4;
+  background: $flat-teal;
   color: $app-ink-night;
   padding: 20rpx 60rpx;
   margin-top: 30rpx;

cfc-frontend/pages/games/list.vue

@@ -183,7 +183,7 @@ export default {
 
 .duration, .points {
   font-size: 24rpx;
-  color: #4ECDC4;
+  color: $flat-teal;
 }
 
 .tips {

cfc-frontend/pages/games/records.vue

@@ -230,7 +230,7 @@ export default {
 .points-text {
   display: block;
   font-size: 22rpx;
-  color: #4ECDC4;
+  color: $flat-teal;
 }
 .load-more {
   text-align: center;

cfc-frontend/pages/games/schulte.vue

@@ -227,11 +227,11 @@ export default {
 }
 
 .grid-cell:active {
-  background: #4ECDC4;
+  background: $flat-teal;
 }
 
 .grid-cell.correct {
-  background: #4ECDC4;
+  background: $flat-teal;
   color: $app-ink-night;
 }
 
@@ -289,7 +289,7 @@ export default {
 }
 
 .restart-btn {
-  background: #4ECDC4;
+  background: $flat-teal;
   color: $app-ink-night;
   padding: 20rpx 60rpx;
   border-radius: 50rpx;

cfc-frontend/pages/games/sudoku.vue

@@ -360,7 +360,7 @@ export default {
 }
 
 .level-btn.active {
-  background: #4ECDC4;
+  background: $flat-teal;
   color: $app-ink-night;
 }
 
@@ -388,7 +388,7 @@ export default {
 }
 
 .cell.fixed {
-  color: #4ECDC4;
+  color: $flat-teal;
   font-weight: bold;
 }
 
@@ -472,7 +472,7 @@ export default {
 }
 
 .restart-btn {
-  background: #4ECDC4;
+  background: $flat-teal;
   color: $app-ink-night;
   padding: 20rpx 60rpx;
   border-radius: 50rpx;

cfc-frontend/pages/health/diet-index.vue

@@ -336,7 +336,7 @@ export default {
 .tag-active {
   border-color: $dim-body;
   color: $dim-body;
-  background-color: #FFF5EB;
+  background-color: $flat-card;
 }
 .submit-btn {
   background-color: $dim-body;

cfc-frontend/pages/health/exercise-index.vue

@@ -343,7 +343,7 @@ export default {
 .tag-active {
   border-color: $dim-body;
   color: $dim-body;
-  background-color: #FFF5EB;
+  background-color: $flat-card;
 }
 .submit-btn {
   background-color: $dim-body;

cfc-frontend/pages/health/water-index.vue

@@ -253,7 +253,7 @@ export default {
   flex: 1; text-align: center; padding: 16rpx 0; border: 1rpx solid $facade-border-soft; border-radius: 12rpx;
   background-color: $facade-fill-ghost;
 }
-.amount-active { border-color: $dim-body; color: $dim-body; background-color: #FFF5EB; }
+.amount-active { border-color: $dim-body; color: $dim-body; background-color: $flat-card; }
 .amount-num { font-size: 28rpx; font-weight: 600; display: block; }
 .amount-unit { font-size: 20rpx; color: $facade-text-muted; display: block; }
 .tag-row { display: flex; flex-wrap: wrap; gap: 16rpx; }
@@ -261,7 +261,7 @@ export default {
   padding: 12rpx 24rpx; border: 1rpx solid $facade-border-soft; border-radius: 30rpx;
   font-size: 24rpx; color: $facade-text-body; background-color: $facade-fill-ghost;
 }
-.tag-active { border-color: $dim-body; color: $dim-body; background-color: #FFF5EB; }
+.tag-active { border-color: $dim-body; color: $dim-body; background-color: $flat-card; }
 .submit-btn {
   background-color: $dim-body; color: $app-surface; text-align: center; padding: 22rpx 0;
   border-radius: 16rpx; font-size: 28rpx; font-weight: 500; margin-top: 10rpx;

cfc-frontend/pages/login/login.vue

@@ -41,9 +41,9 @@ export default {
 }
 </script>
 
-<style scoped>
+<stylescoped lang="scss">
 .login-page {
   min-height: 100vh;
-  background: linear-gradient(180deg, #FFF9F0 0%, #FFEEDB 100%);
+  background: linear-gradient(180deg, $flat-bg 0%, #FFEEDB 100%);
 }
 </style>

cfc-frontend/pages/mind-detail/emotion-trend.vue

@@ -554,7 +554,7 @@ export default {
 
 <style scoped lang="scss">
 // ===== 情绪趋势页专属色阶（热力图绿阶 + 画布近白；单页专用，约定见 uni.scss §14）=====
-$c-et-heat-1: #FFE0E0; // 热力档 1（最浅红）
+$c-et-heat-1: $flat-danger-line; // 热力档 1（最浅红，与 $flat-danger-line 同值）
 $c-et-heat-2: #FFB0B0; // 热力档 2（浅红）
 $c-et-heat-3: #FFD9A0; // 热力档 3（浅橙）
 $c-et-heat-4: #C8E6C9; // 热力档 4（浅绿）

cfc-frontend/pages/parent/child-detail.vue

@@ -202,24 +202,24 @@ if (!this.childName || this.childName === '成员') {
 
 <style scoped lang="scss">
 // ===== 孩子详情页专属色阶（flat 图表青绿 + 米白卡片；单页专用，约定见 uni.scss §14）=====
-$c-cd-bg:         #FFF9F0; // 页面米白底
-$c-cd-card:       #FFF5EB; // 暖白卡片底
-$c-cd-line:       #F5F0EB; // 暖分隔线
-$c-cd-ink:        #2D3436; // 主文字（深灰）
-$c-cd-muted:      #B2BEC3; // 次要文字（灰）
-$c-cd-muted2:     #636E72; // 辅助文字（中灰）
+$flat-bg:         $flat-bg; // 页面米白底
+$flat-card:       $flat-card; // 暖白卡片底
+$flat-line:       $flat-line; // 暖分隔线
+$flat-ink:        $flat-ink; // 主文字（深灰）
+$flat-muted:      $flat-muted; // 次要文字（灰）
+$flat-muted-2:     $flat-muted-2; // 辅助文字（中灰）
 $c-cd-orange:     #FF7A2E; // 橙渐变终档
-$c-cd-teal:       #4ECDC4; // 青绿主色
-$c-cd-teal-deep:  #44B09E; // 青绿深档
-$c-cd-green:      #A8E063; // 绿浅档
-$c-cd-green-deep: #56AB2F; // 绿深档
+$flat-teal:       $flat-teal; // 青绿主色
+$flat-teal-deep:  $flat-teal-deep; // 青绿深档
+$flat-green:      $flat-green; // 绿浅档
+$flat-green-deep: $flat-green-deep; // 绿深档
 $c-cd-pink:       #F093FB; // 粉紫渐变起
 $c-cd-red:        #F5576C; // 红粉渐变终
 $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .container {
   padding: 30rpx;
-  background: $c-cd-bg;
+  background: $flat-bg;
   min-height: 100vh;
 }
 
@@ -232,7 +232,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .loading-text {
   font-size: 28rpx;
-  color: $c-cd-muted;
+  color: $flat-muted;
 }
 
 /* 孩子信息卡片 */
@@ -265,9 +265,9 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .child-avatar-color-0 { background: linear-gradient(135deg, $dim-body, $c-cd-orange); }
 .child-avatar-color-1 { background: linear-gradient(135deg, $accent-indigo, $accent-indigo-deep); }
-.child-avatar-color-2 { background: linear-gradient(135deg, $c-cd-teal, $c-cd-teal-deep); }
+.child-avatar-color-2 { background: linear-gradient(135deg, $flat-teal, $flat-teal-deep); }
 .child-avatar-color-3 { background: linear-gradient(135deg, $brand-primary, $brand-primary-light); }
-.child-avatar-color-4 { background: linear-gradient(135deg, $c-cd-green, $c-cd-green-deep); }
+.child-avatar-color-4 { background: linear-gradient(135deg, $flat-green, $flat-green-deep); }
 .child-avatar-color-5 { background: linear-gradient(135deg, $c-cd-pink, $c-cd-red); }
 
 .child-info-body {
@@ -278,7 +278,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 .child-info-name {
   font-size: 36rpx;
   font-weight: 700;
-  color: $c-cd-ink;
+  color: $flat-ink;
   display: block;
 }
 
@@ -304,21 +304,21 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .progress-label {
   font-size: 22rpx;
-  color: $c-cd-muted2;
+  color: $flat-muted-2;
   display: block;
   margin-bottom: 8rpx;
 }
 
 .progress-bar-bg {
   height: 10rpx;
-  background: $c-cd-card;
+  background: $flat-card;
   border-radius: 9999rpx;
   overflow: hidden;
 }
 
 .progress-bar-fill {
   height: 100%;
-  background: linear-gradient(90deg, $c-cd-teal, $c-cd-teal-deep);
+  background: linear-gradient(90deg, $flat-teal, $flat-teal-deep);
   border-radius: 9999rpx;
   transition: width 0.3s ease;
 }
@@ -327,7 +327,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 .section-title {
   font-size: 30rpx;
   font-weight: 600;
-  color: $c-cd-ink;
+  color: $flat-ink;
   margin-bottom: 20rpx;
 }
 
@@ -352,7 +352,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
   align-items: center;
   box-shadow: 0 4px 20px rgba(255, 140, 66, 0.08);
   position: relative;
-  border: 8rpx solid $c-cd-bg;
+  border: 8rpx solid $flat-bg;
 }
 
 .action-btn-icon {
@@ -373,7 +373,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .action-btn-label {
   font-size: 24rpx;
-  color: $c-cd-muted2;
+  color: $flat-muted-2;
   font-weight: 500;
 }
 
@@ -408,7 +408,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
   display: flex;
   align-items: center;
   padding: 20rpx 0;
-  border-bottom: 1rpx solid $c-cd-line;
+  border-bottom: 1rpx solid $flat-line;
 }
 
 .task-item:last-child {
@@ -429,7 +429,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .task-title {
   font-size: 28rpx;
-  color: $c-cd-ink;
+  color: $flat-ink;
 }
 
 .task-points {
@@ -455,7 +455,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 
 .empty-text {
   font-size: 28rpx;
-  color: $c-cd-muted;
+  color: $flat-muted;
 }
 
 /* 待处理 */
@@ -474,7 +474,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
   display: flex;
   align-items: center;
   padding: 20rpx 0;
-  border-bottom: 1rpx solid $c-cd-line;
+  border-bottom: 1rpx solid $flat-line;
 }
 
 .pending-item:last-child {
@@ -489,7 +489,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 .pending-desc {
   flex: 1;
   font-size: 28rpx;
-  color: $c-cd-ink;
+  color: $flat-ink;
 }
 
 .pending-tag {
@@ -500,7 +500,7 @@ $c-cd-danger-bg:  #FFF0F0; // 警示浅红底
 }
 
 .tag-review {
-  background: $c-cd-card;
+  background: $flat-card;
   color: $dim-body;
 }
 

cfc-frontend/pages/profile-extra/family-members.vue

@@ -782,7 +782,7 @@ export default {
 
 <style lang="scss">
 // ===== 家员管理页专属色阶（暖米卡片 + 紫罗兰 + Element UI 浅底；单页专用，约定见 uni.scss §14）=====
-$c-fam-page:         #F5F0EB; // 页面底（暖灰米）
+$c-fam-page:         $flat-line; // 页面底（暖灰米）
 $c-fam-card:         #FFFCF5; // 卡片底（米白）
 $c-fam-line:         #F0EAE2; // 暖分隔线
 $c-fam-tint:         #FFF1E8; // 浅橙底

cfc-frontend/scripts/d24-child-detail-flat.js

@@ -0,0 +1,28 @@
+#!/usr/bin/env node
+/**
+ * D24: child-detail.vue flat 色并入全局 $flat-* 令牌（清理 D14 局部色阶中的重复项）
+ * 保留 4 个真正专属色（橙/粉/红/警示底）
+ */
+const fs = require('fs');
+const F = 'pages/parent/child-detail.vue';
+let src = fs.readFileSync(F, 'utf8');
+
+const MAP = [
+  ['$c-cd-bg', '$flat-bg'],
+  ['$c-cd-card', '$flat-card'],
+  ['$c-cd-line', '$flat-line'],
+  ['$c-cd-ink', '$flat-ink'],
+  ['$c-cd-muted2', '$flat-muted-2'],
+  ['$c-cd-muted', '$flat-muted'],
+  ['$c-cd-teal-deep', '$flat-teal-deep'],
+  ['$c-cd-teal', '$flat-teal'],
+  ['$c-cd-green-deep', '$flat-green-deep'],
+  ['$c-cd-green', '$flat-green'],
+];
+for (const [from, to] of MAP) {
+  const re = new RegExp(from.replace('$', '\\$') + '(?![\\w-])', 'g');
+  src = src.replace(re, to);
+}
+
+fs.writeFileSync(F, src);
+console.log('remaining $c-cd-*:', (src.match(/\$c-cd-[a-z0-9-]+/g) || []).join(','));

cfc-frontend/scripts/replace-hex-to-token.js

@@ -184,6 +184,37 @@ const ALL_RULES = [
   ['#dbeafe', '$status-info-soft'],
   ['#92400E', '$status-warning-strong'],
   ['#92400e', '$status-warning-strong'],
+  // ---- 第四轮（flat 设计主题，2026-10-20 收编为 $flat-* 全局令牌）----
+  ['#4ECDC4', '$flat-teal'],
+  ['#4ecdc4', '$flat-teal'],
+  ['#44B09E', '$flat-teal-deep'],
+  ['#44b09e', '$flat-teal-deep'],
+  ['#A8E063', '$flat-green'],
+  ['#a8e063', '$flat-green'],
+  ['#56AB2F', '$flat-green-deep'],
+  ['#56ab2f', '$flat-green-deep'],
+  ['#FFF9F0', '$flat-bg'],
+  ['#fff9f0', '$flat-bg'],
+  ['#FFF5EB', '$flat-card'],
+  ['#fff5eb', '$flat-card'],
+  ['#FFF0E6', '$flat-warm'],
+  ['#fff0e6', '$flat-warm'],
+  ['#F5F0EB', '$flat-line'],
+  ['#f5f0eb', '$flat-line'],
+  ['#2D3436', '$flat-ink'],
+  ['#2d3436', '$flat-ink'],
+  ['#B2BEC3', '$flat-muted'],
+  ['#b2bec3', '$flat-muted'],
+  ['#636E72', '$flat-muted-2'],
+  ['#636e72', '$flat-muted-2'],
+  ['#FFE0E0', '$flat-danger-line'],
+  ['#ffe0e0', '$flat-danger-line'],
+  ['#E17055', '$flat-orange-text'],
+  ['#e17055', '$flat-orange-text'],
+  ['#FFB088', '$flat-orange-soft'],
+  ['#ffb088', '$flat-orange-soft'],
+  ['#FFD93D', '$flat-bar'],
+  ['#ffd93d', '$flat-bar'],
 ].sort((a, b) => b[0].length - a[0].length)
 
 const GRAY_RULES   = ALL_RULES.filter(r => { const i = ALL_RULES.indexOf(r); return i < 30 })