瀏覽代碼

refactor(index-home): A-1 门面令牌化——首页 style 块硬编码色全量收敛(零观感变化)

pages/index-home/index.vue(首页 TabBar,原债务 423 / 141 硬编码色):
- <style> → <style lang="scss">,新增 33 个页面级局部调色板变量
  (品牌橙阶 6 / 文字阶 7 / 填充阶 3 / wisdom 4 / action 4 / violet 4 / Material 状态 5)
- 144 处 hex + 32 处 rgba 三元组 → 令牌:全局同值令牌 13 种直接映射
  ($brand-primary/$brand-primary-light/-dark/-deep/$dim-body/mind/wisdom/action/
   $app-surface/$app-bg/$app-border/$app-text-subtle/$uni-success),
  不同值由页面局部变量承载(保零观感变化)
- rgba(249,115,22,a)→rgba($brand-primary,a) 等 32 处;rgba(0,0,0,a) 黑影属通用保留

验证:
- dart-sass 编译 PASS
- 等价回归 PASS(scripts/equiv-regression.js,新增可复用工具):
  HEAD 版与新版拼接 uni.scss 编译,hex 大小写/3-6 位归一后逐字节相同
- style 块 hex 残留 33 = 调色板声明数(规则区 0);无死变量(词边界精确校验)
- transition:all 0

未动(既定纪律/归他批):script 区 30 处数据驱动色值(含旧蓝 #5B9BD5×3/#8FC5E8×3)
归 C-2 按角色分流;模板区内联样式 13 处归后续批次。
liaoxg 1 周之前
父節點
當前提交
38ef655341
共有 2 個文件被更改,包括 230 次插入 和 120 次删除
  1. 160 120
      cfc-frontend/pages/index-home/index.vue
  2. 70 0
      cfc-frontend/scripts/equiv-regression.js

+ 160 - 120
cfc-frontend/pages/index-home/index.vue

@@ -2016,10 +2016,50 @@ title: '添加家庭成员',
 }
 </script>
 
-<style>
+<style lang="scss">
+// ===== 页面级局部调色板(单页专有色阶;同值才映射全局令牌,约定见 uni.scss §14) =====
+// 品牌橙阶(orange-50~900 / amber-700)
+$c-brand-tint:    #FFF7ED;   // orange-50 极浅底
+$c-brand-tint-2:  #FFEDD5;   // orange-100
+$c-brand-tint-3:  #FED7AA;   // orange-200
+$c-brand-ink:     #7C2D12;   // orange-900 深文字
+$c-brand-ink-2:   #9A3412;   // orange-800
+$c-brand-ink-3:   #B45309;   // amber-700
+// 文字阶(页面既有灰阶)
+$c-text-strong:   #333;
+$c-text-body:     #666;
+$c-text-muted:    #999;
+$c-text-faint:    #888;
+$c-text-ghost:    #BBB;
+$c-text-slate:    #64748B;   // slate-500
+$c-ink-slate:     #334155;   // slate-700
+// 填充阶
+$c-fill:          #F0F0F0;
+$c-fill-2:        #F5F5F5;
+$c-fill-slate:    #F8FAFC;   // slate-50
+// 维度深/浅阶(wisdom indigo / action emerald / violet)
+$c-wisdom-tint:   #EFF4FF;
+$c-wisdom-ink:    #312E81;
+$c-wisdom-mid:    #4338CA;
+$c-wisdom-light:  #818CF8;
+$c-action-tint:   #ECFDF5;
+$c-action-ink:    #064E3B;
+$c-action-mid:    #047857;
+$c-action-light:  #34D399;
+$c-violet:        #8B5CF6;
+$c-violet-tint:   #F5F3FF;
+$c-violet-ink:    #4C1D95;
+$c-violet-mid:    #6D28D9;
+// Material 状态阶(页面既有观感,与 §13 tailwind 状态令牌不同值,故局部承载)
+$c-success-tint:  #E8F5E9;
+$c-success-ink:   #2E7D32;
+$c-info-tint:     #E3F2FD;
+$c-info-ink:      #1565C0;
+$c-warm-tint:     #FFF3E7;
+
 .discover-container {
   min-height: 100vh;
-  background: #f5f7fa;
+  background: $app-bg;
   padding-bottom: 100rpx;
 }
 
@@ -2027,25 +2067,25 @@ title: '添加家庭成员',
 .hero-section {
   margin: 24rpx 30rpx 0;
   padding: 40rpx 32rpx;
-  background: linear-gradient(160deg, #FFF7ED 0%, #FED7AA 60%, rgba(249,115,22,0.15) 100%);
+  background: linear-gradient(160deg, $c-brand-tint 0%, $c-brand-tint-3 60%, rgba($brand-primary, 0.15) 100%);
   border-radius: 24rpx;
   text-align: center;
-  border: 1rpx solid rgba(249,115,22,0.12);
+  border: 1rpx solid rgba($brand-primary, 0.12);
 }
 
 .hero-logo {
   width: 100rpx;
   height: 100rpx;
   border-radius: 50rpx;
-  background: #fff;
-  box-shadow: 0 8rpx 24rpx rgba(249,115,22,0.18);
+  background: $app-surface;
+  box-shadow: 0 8rpx 24rpx rgba($brand-primary, 0.18);
 }
 
 .hero-name {
   display: block;
   font-size: 48rpx;
   font-weight: bold;
-  color: #7C2D12;
+  color: $c-brand-ink;
   margin-top: 16rpx;
   letter-spacing: 6rpx;
 }
@@ -2054,7 +2094,7 @@ title: '添加家庭成员',
   display: block;
   font-size: 28rpx;
   font-weight: 600;
-  color: #C2410C;
+  color: $brand-primary-deep;
   margin-top: 12rpx;
   letter-spacing: 2rpx;
 }
@@ -2062,7 +2102,7 @@ title: '添加家庭成员',
 .hero-slogan {
   display: block;
   font-size: 26rpx;
-  color: #9A3412;
+  color: $c-brand-ink-2;
   margin-top: 8rpx;
   font-weight: 500;
 }
@@ -2070,7 +2110,7 @@ title: '添加家庭成员',
 .hero-powered {
   display: block;
   font-size: 20rpx;
-  color: rgba(124,45,18,0.45);
+  color: rgba($c-brand-ink, 0.45);
   margin-top: 10rpx;
 }
 
@@ -2088,7 +2128,7 @@ title: '添加家庭成员',
   align-items: center;
   gap: 6rpx;
   padding: 12rpx 16rpx;
-  background: rgba(255,255,255,0.7);
+  background: rgba($app-surface, 0.7);
   border-radius: 16rpx;
 }
 
@@ -2098,7 +2138,7 @@ title: '添加家庭成员',
 
 .hero-dim-label {
   font-size: 20rpx;
-  color: #7C2D12;
+  color: $c-brand-ink;
   font-weight: 500;
   white-space: nowrap;
 }
@@ -2107,7 +2147,7 @@ title: '添加家庭成员',
 .hero-sub-slogan {
   display: block;
   font-size: 22rpx;
-  color: #EA580C;
+  color: $brand-primary-dark;
   margin-top: 18rpx;
   font-weight: 500;
 }
@@ -2118,14 +2158,14 @@ title: '添加家庭成员',
   width: 420rpx;
   height: 80rpx;
   line-height: 80rpx;
-  background: linear-gradient(135deg, #F97316, #FB923C);
-  color: #fff;
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
+  color: $app-surface;
   font-size: 28rpx;
   font-weight: bold;
   border-radius: 40rpx;
   text-align: center;
   border: none;
-  box-shadow: 0 8rpx 20rpx rgba(249,115,22,0.3);
+  box-shadow: 0 8rpx 20rpx rgba($brand-primary, 0.3);
 }
 .hero-cta-btn::after {
   border: none;
@@ -2139,7 +2179,7 @@ title: '添加家庭成员',
   display: block;
   font-size: 32rpx;
   font-weight: bold;
-  color: #333;
+  color: $c-text-strong;
   text-align: center;
   margin-bottom: 20rpx;
 }
@@ -2151,7 +2191,7 @@ title: '添加家庭成员',
 .value-prop-card {
   width: 48.5%;
   box-sizing: border-box;
-  background: #fff;
+  background: $app-surface;
   border-radius: 20rpx;
   padding: 22rpx;
   margin-bottom: 16rpx;
@@ -2175,11 +2215,11 @@ title: '添加家庭成员',
 .value-prop-name {
   font-size: 28rpx;
   font-weight: bold;
-  color: #333;
+  color: $c-text-strong;
 }
 .value-prop-desc {
   font-size: 22rpx;
-  color: #999;
+  color: $c-text-muted;
   margin-top: 8rpx;
   line-height: 1.5;
 }
@@ -2188,7 +2228,7 @@ title: '添加家庭成员',
 .how-it-works {
   margin: 32rpx 30rpx 0;
   padding: 32rpx 24rpx;
-  background: #fff;
+  background: $app-surface;
   border-radius: 24rpx;
   box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.04);
 }
@@ -2196,7 +2236,7 @@ title: '添加家庭成员',
   display: block;
   font-size: 32rpx;
   font-weight: bold;
-  color: #333;
+  color: $c-text-strong;
   text-align: center;
   margin-bottom: 28rpx;
 }
@@ -2217,29 +2257,29 @@ title: '添加家庭成员',
   height: 48rpx;
   line-height: 48rpx;
   border-radius: 50%;
-  background: linear-gradient(135deg, #F97316, #FB923C);
-  color: #fff;
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
+  color: $app-surface;
   font-size: 26rpx;
   font-weight: bold;
   text-align: center;
-  box-shadow: 0 4rpx 12rpx rgba(249,115,22,0.3);
+  box-shadow: 0 4rpx 12rpx rgba($brand-primary, 0.3);
 }
 .step-name {
   font-size: 24rpx;
-  color: #333;
+  color: $c-text-strong;
   font-weight: 500;
   margin-top: 12rpx;
   text-align: center;
 }
 .step-sub {
   font-size: 20rpx;
-  color: #999;
+  color: $c-text-muted;
   margin-top: 4rpx;
   text-align: center;
 }
 .step-arrow {
   font-size: 28rpx;
-  color: #F97316;
+  color: $brand-primary;
   line-height: 1;
   align-self: center;
   padding: 0 6rpx;
@@ -2249,13 +2289,13 @@ title: '添加家庭成员',
 .brand-strap {
   margin: 16rpx 30rpx 0;
   padding: 20rpx 28rpx;
-  background: linear-gradient(135deg, #FFF7ED, rgba(249,115,22,0.10));
+  background: linear-gradient(135deg, $c-brand-tint, rgba($brand-primary, 0.10));
   border-radius: 16rpx;
-  border-left: 4rpx solid #F97316;
+  border-left: 4rpx solid $brand-primary;
 }
 .brand-strap-text {
   font-size: 26rpx;
-  color: #9A3412;
+  color: $c-brand-ink-2;
   font-weight: 500;
 }
 
@@ -2264,7 +2304,7 @@ title: '添加家庭成员',
   display: flex;
   align-items: center;
   margin: 20rpx 30rpx 0;
-  background: linear-gradient(135deg, #F97316, #FB923C);
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
   border-radius: 20rpx;
   padding: 24rpx 30rpx;
 }
@@ -2272,7 +2312,7 @@ title: '添加家庭成员',
   width: 64rpx;
   height: 64rpx;
   border-radius: 50%;
-  background: rgba(255,255,255,0.2);
+  background: rgba($app-surface, 0.2);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -2291,11 +2331,11 @@ title: '添加家庭成员',
 .member-entry-title {
   font-size: 30rpx;
   font-weight: bold;
-  color: #fff;
+  color: $app-surface;
 }
 .member-entry-desc {
   font-size: 22rpx;
-  color: rgba(255,255,255,0.85);
+  color: rgba($app-surface, 0.85);
   margin-top: 4rpx;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -2304,13 +2344,13 @@ title: '添加家庭成员',
 .member-entry-btn {
   margin-left: 16rpx;
   padding: 10rpx 24rpx;
-  background: #fff;
+  background: $app-surface;
   border-radius: 30rpx;
   flex-shrink: 0;
 }
 .member-entry-btn-text {
   font-size: 24rpx;
-  color: #F97316;
+  color: $brand-primary;
   font-weight: bold;
 }
 
@@ -2324,7 +2364,7 @@ title: '添加家庭成员',
 .loading-text,
 .empty-text {
   font-size: 26rpx;
-  color: #999;
+  color: $c-text-muted;
 }
 
 /* ===== 五维全景幸福矩阵 ===== */
@@ -2340,21 +2380,21 @@ title: '添加家庭成员',
   width: 100%;
   height: 88rpx;
   line-height: 88rpx;
-  background: linear-gradient(135deg, #F97316, #FB923C);
-  color: #fff;
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
+  color: $app-surface;
   font-size: 32rpx;
   font-weight: bold;
   border-radius: 44rpx;
   text-align: center;
   border: none;
-  box-shadow: 0 8rpx 24rpx rgba(249,115,22,0.3);
+  box-shadow: 0 8rpx 24rpx rgba($brand-primary, 0.3);
 }
 .login-btn::after {
   border: none;
 }
 .login-footer-text {
   font-size: 22rpx;
-  color: #F97316;
+  color: $brand-primary;
   margin-top: 16rpx;
   font-weight: 500;
 }
@@ -2394,11 +2434,11 @@ title: '添加家庭成员',
 .section-title {
   font-size: 30rpx;
   font-weight: bold;
-  color: #333;
+  color: $c-text-strong;
 }
 .section-more {
   font-size: 24rpx;
-  color: #F97316;
+  color: $brand-primary;
 }
 .empty-state {
   display: flex;
@@ -2407,7 +2447,7 @@ title: '添加家庭成员',
 }
 .empty-text {
   font-size: 26rpx;
-  color: #999;
+  color: $c-text-muted;
 }
 
 /* ===== 活动列表 ===== */
@@ -2417,7 +2457,7 @@ title: '添加家庭成员',
   gap: 16rpx;
 }
 .activity-card {
-  background: #fff;
+  background: $app-surface;
   border-radius: 16rpx;
   overflow: hidden;
   display: flex;
@@ -2431,7 +2471,7 @@ title: '添加家庭成员',
   width: 200rpx;
   height: 160rpx;
   flex-shrink: 0;
-  background: #f0f0f0;
+  background: $c-fill;
 }
 .activity-info {
   flex: 1;
@@ -2443,7 +2483,7 @@ title: '添加家庭成员',
 .activity-name {
   font-size: 28rpx;
   font-weight: bold;
-  color: #333;
+  color: $c-text-strong;
   margin-bottom: 8rpx;
 }
 .line-clamp-1 {
@@ -2458,7 +2498,7 @@ title: '添加家庭成员',
 }
 .activity-time {
   font-size: 22rpx;
-  color: #999;
+  color: $c-text-muted;
 }
 .activity-bottom {
   display: flex;
@@ -2469,24 +2509,24 @@ title: '添加家庭成员',
   font-size: 20rpx;
   padding: 2rpx 10rpx;
   border-radius: 8rpx;
-  background: #E8F5E9;
-  color: #2E7D32;
+  background: $c-success-tint;
+  color: $c-success-ink;
 }
 .activity-status.status-upcoming {
-  background: #E3F2FD;
-  color: #1565C0;
+  background: $c-info-tint;
+  color: $c-info-ink;
 }
 .activity-status.status-ended {
-  background: #F5F5F5;
-  color: #999;
+  background: $c-fill-2;
+  color: $c-text-muted;
 }
 .activity-fee {
   font-size: 24rpx;
-  color: #F97316;
+  color: $brand-primary;
   font-weight: bold;
 }
 .activity-fee.fee-free {
-  color: #4CAF50;
+  color: $uni-success;
 }
 
 /* ===== 文章列表 ===== */
@@ -2496,7 +2536,7 @@ title: '添加家庭成员',
   gap: 16rpx;
 }
 .article-card {
-  background: #fff;
+  background: $app-surface;
   border-radius: 16rpx;
   padding: 24rpx;
   box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
@@ -2512,20 +2552,20 @@ title: '添加家庭成员',
 }
 .article-category-text {
   font-size: 20rpx;
-  color: #fff;
+  color: $app-surface;
 }
 .article-title {
   display: block;
   font-size: 28rpx;
   font-weight: bold;
-  color: #333;
+  color: $c-text-strong;
   margin-bottom: 8rpx;
   line-height: 1.4;
 }
 .article-summary {
   display: block;
   font-size: 24rpx;
-  color: #888;
+  color: $c-text-faint;
   line-height: 1.5;
   margin-bottom: 12rpx;
   overflow: hidden;
@@ -2549,11 +2589,11 @@ title: '添加家庭成员',
 }
 .meta-text {
   font-size: 22rpx;
-  color: #999;
+  color: $c-text-muted;
 }
 .article-date {
   font-size: 22rpx;
-  color: #bbb;
+  color: $c-text-ghost;
 }
 
 /* ===== Splash Loading Overlay(冷启动蒙板,来自 merge splash.vue) ===== */
@@ -2564,7 +2604,7 @@ title: '添加家庭成员',
   display: flex;
   align-items: center;
   justify-content: center;
-  background: linear-gradient(160deg, #FFF7ED 0%, #FFEDD5 50%, #FED7AA 100%);
+  background: linear-gradient(160deg, $c-brand-tint 0%, $c-brand-tint-2 50%, $c-brand-tint-3 100%);
   overflow: hidden;
   opacity: 1;
   transition: opacity 0.4s ease;
@@ -2583,19 +2623,19 @@ title: '添加家庭成员',
 }
 .bg-circle-1 {
   width: 400rpx; height: 400rpx;
-  background: #FF8C42;
+  background: $dim-body;
   top: -100rpx; right: -80rpx;
   animation: splash-float-1 4s ease-in-out infinite;
 }
 .bg-circle-2 {
   width: 280rpx; height: 280rpx;
-  background: #FF6B9D;
+  background: $dim-mind;
   bottom: 80rpx; left: -60rpx;
   animation: splash-float-2 5s ease-in-out infinite;
 }
 .bg-circle-3 {
   width: 180rpx; height: 180rpx;
-  background: #6366F1;
+  background: $dim-wisdom;
   top: 50%; right: -40rpx;
   animation: splash-float-3 6s ease-in-out infinite;
 }
@@ -2628,34 +2668,34 @@ title: '添加家庭成员',
 .splash-logo-wrap {
   width: 160rpx; height: 160rpx;
   border-radius: 40rpx;
-  background: rgba(255,255,255,0.95);
+  background: rgba($app-surface, 0.95);
   display: flex; align-items: center; justify-content: center;
   margin-bottom: 16rpx;
-  box-shadow: 0 8rpx 32rpx rgba(249,115,22,0.25);
+  box-shadow: 0 8rpx 32rpx rgba($brand-primary, 0.25);
   animation: splash-logo-pulse 2.5s ease-in-out infinite;
 }
 @keyframes splash-logo-pulse {
-  0%, 100% { box-shadow: 0 8rpx 32rpx rgba(249,115,22,0.25); }
-  50% { box-shadow: 0 8rpx 48rpx rgba(249,115,22,0.45); }
+  0%, 100% { box-shadow: 0 8rpx 32rpx rgba($brand-primary, 0.25); }
+  50% { box-shadow: 0 8rpx 48rpx rgba($brand-primary, 0.45); }
 }
 .splash-logo-img { width: 100rpx; height: 100rpx; }
 
 /* ---- brand ---- */
 .splash-brand-name {
   font-size: 64rpx; font-weight: 800;
-  color: #7C2D12;
+  color: $c-brand-ink;
   letter-spacing: 10rpx;
   margin-bottom: 2rpx;
 }
 .splash-brand-en {
   font-size: 20rpx;
-  color: rgba(124,45,18,0.5);
+  color: rgba($c-brand-ink, 0.5);
   letter-spacing: 6rpx;
   margin-bottom: 30rpx;
 }
 .splash-tagline {
   font-size: 26rpx;
-  color: rgba(124,45,18,0.7);
+  color: rgba($c-brand-ink, 0.7);
   letter-spacing: 4rpx;
   margin-top: 24rpx;
 }
@@ -2678,7 +2718,7 @@ title: '添加家庭成员',
 .splash-dim-icon { font-size: 36rpx; line-height: 1; }
 .splash-dim-label {
   font-size: 22rpx; font-weight: 500;
-  color: rgba(124,45,18,0.75);
+  color: rgba($c-brand-ink, 0.75);
   line-height: 1;
 }
 
@@ -2706,7 +2746,7 @@ title: '添加家庭成员',
 .splash-overlay-dot {
   width: 14rpx; height: 14rpx;
   border-radius: 50%;
-  background: rgba(249,115,22,0.6);
+  background: rgba($brand-primary, 0.6);
   animation: splash-dot-bounce 1.4s ease-in-out infinite both;
 }
 .splash-overlay-dot:nth-child(1) { animation-delay: -0.32s; }
@@ -2725,16 +2765,16 @@ title: '添加家庭成员',
 /* ===== ① 了解区 — 自测大卡(引导"从了解开始") ===== */
 .self-test-card {
   margin: 20rpx 30rpx 16rpx;
-  background: linear-gradient(135deg, #F97316, #FB923C);
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
   border-radius: 20rpx;
   padding: 24rpx 28rpx;
 }
 .self-test-head { display: flex; align-items: center; }
 .self-test-icon { font-size: 40rpx; margin-right: 16rpx; }
 .self-test-info { flex: 1; }
-.self-test-title { font-size: 28rpx; font-weight: bold; color: #fff; display: block; }
-.self-test-sub { font-size: 22rpx; color: rgba(255,255,255,0.8); display: block; margin-top: 4rpx; }
-.self-test-arrow { font-size: 36rpx; color: rgba(255,255,255,0.7); }
+.self-test-title { font-size: 28rpx; font-weight: bold; color: $app-surface; display: block; }
+.self-test-sub { font-size: 22rpx; color: rgba($app-surface, 0.8); display: block; margin-top: 4rpx; }
+.self-test-arrow { font-size: 36rpx; color: rgba($app-surface, 0.7); }
 
 /* ===== ①.b 行动引导条 — Next Best Action ===== */
 .guide-bar {
@@ -2771,35 +2811,35 @@ title: '添加家庭成员',
 .guide-bar-btn-text { }
 
 /* 颜色主题 — 低饱和背景 + 深色文字,不抢自测卡风头 */
-.guide-bar-orange { background: #FFF3E7; border: 1rpx solid rgba(249,115,22,0.18); }
-.guide-bar-orange .guide-bar-icon-wrap { background: rgba(249,115,22,0.14); }
-.guide-bar-orange .guide-bar-title { color: #9A3412; }
-.guide-bar-orange .guide-bar-sub { color: #B45309; }
-.guide-bar-orange .guide-bar-btn { background: linear-gradient(135deg, #F97316, #FB923C); color: #fff; }
-
-.guide-bar-blue { background: #EFF4FF; border: 1rpx solid rgba(99,102,241,0.18); }
-.guide-bar-blue .guide-bar-icon-wrap { background: rgba(99,102,241,0.12); }
-.guide-bar-blue .guide-bar-title { color: #312E81; }
-.guide-bar-blue .guide-bar-sub { color: #4338CA; }
-.guide-bar-blue .guide-bar-btn { background: linear-gradient(135deg, #6366F1, #818CF8); color: #fff; }
-
-.guide-bar-green { background: #ECFDF5; border: 1rpx solid rgba(16,185,129,0.18); }
-.guide-bar-green .guide-bar-icon-wrap { background: rgba(16,185,129,0.12); }
-.guide-bar-green .guide-bar-title { color: #064E3B; }
-.guide-bar-green .guide-bar-sub { color: #047857; }
-.guide-bar-green .guide-bar-btn { background: linear-gradient(135deg, #10B981, #34D399); color: #fff; }
-
-.guide-bar-purple { background: #F5F3FF; border: 1rpx solid rgba(139,92,246,0.18); }
-.guide-bar-purple .guide-bar-icon-wrap { background: rgba(139,92,246,0.12); }
-.guide-bar-purple .guide-bar-title { color: #4C1D95; }
-.guide-bar-purple .guide-bar-sub { color: #6D28D9; }
-.guide-bar-purple .guide-bar-btn { background: linear-gradient(135deg, #F97316, #FB923C); color: #fff; }
-
-.guide-bar-gray { background: #F8FAFC; border: 1rpx solid rgba(100,116,139,0.15); }
-.guide-bar-gray .guide-bar-icon-wrap { background: rgba(100,116,139,0.10); }
-.guide-bar-gray .guide-bar-title { color: #334155; }
-.guide-bar-gray .guide-bar-sub { color: #64748B; }
-.guide-bar-gray .guide-bar-btn { background: linear-gradient(135deg, #94A3B8, #CBD5E1); color: #fff; }
+.guide-bar-orange { background: $c-warm-tint; border: 1rpx solid rgba($brand-primary, 0.18); }
+.guide-bar-orange .guide-bar-icon-wrap { background: rgba($brand-primary, 0.14); }
+.guide-bar-orange .guide-bar-title { color: $c-brand-ink-2; }
+.guide-bar-orange .guide-bar-sub { color: $c-brand-ink-3; }
+.guide-bar-orange .guide-bar-btn { background: linear-gradient(135deg, $brand-primary, $brand-primary-light); color: $app-surface; }
+
+.guide-bar-blue { background: $c-wisdom-tint; border: 1rpx solid rgba($dim-wisdom, 0.18); }
+.guide-bar-blue .guide-bar-icon-wrap { background: rgba($dim-wisdom, 0.12); }
+.guide-bar-blue .guide-bar-title { color: $c-wisdom-ink; }
+.guide-bar-blue .guide-bar-sub { color: $c-wisdom-mid; }
+.guide-bar-blue .guide-bar-btn { background: linear-gradient(135deg, $dim-wisdom, $c-wisdom-light); color: $app-surface; }
+
+.guide-bar-green { background: $c-action-tint; border: 1rpx solid rgba($dim-action, 0.18); }
+.guide-bar-green .guide-bar-icon-wrap { background: rgba($dim-action, 0.12); }
+.guide-bar-green .guide-bar-title { color: $c-action-ink; }
+.guide-bar-green .guide-bar-sub { color: $c-action-mid; }
+.guide-bar-green .guide-bar-btn { background: linear-gradient(135deg, $dim-action, $c-action-light); color: $app-surface; }
+
+.guide-bar-purple { background: $c-violet-tint; border: 1rpx solid rgba($c-violet, 0.18); }
+.guide-bar-purple .guide-bar-icon-wrap { background: rgba($c-violet, 0.12); }
+.guide-bar-purple .guide-bar-title { color: $c-violet-ink; }
+.guide-bar-purple .guide-bar-sub { color: $c-violet-mid; }
+.guide-bar-purple .guide-bar-btn { background: linear-gradient(135deg, $brand-primary, $brand-primary-light); color: $app-surface; }
+
+.guide-bar-gray { background: $c-fill-slate; border: 1rpx solid rgba($c-text-slate, 0.15); }
+.guide-bar-gray .guide-bar-icon-wrap { background: rgba($c-text-slate, 0.10); }
+.guide-bar-gray .guide-bar-title { color: $c-ink-slate; }
+.guide-bar-gray .guide-bar-sub { color: $c-text-slate; }
+.guide-bar-gray .guide-bar-btn { background: linear-gradient(135deg, $app-text-subtle, $app-border); color: $app-surface; }
 
 /* ===== 快捷功能入口(单排,6个横向排列) ===== */
 .quick-bar {
@@ -2807,7 +2847,7 @@ title: '添加家庭成员',
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  background: #fff;
+  background: $app-surface;
   border-radius: 20rpx;
   padding: 20rpx 10rpx;
 }
@@ -2835,7 +2875,7 @@ title: '添加家庭成员',
 
 .quick-item .quick-label {
   font-size: 26rpx;
-  color: #666;
+  color: $c-text-body;
 }
 
 /* ===== 我的任务快捷列表 ===== */
@@ -2850,7 +2890,7 @@ title: '添加家庭成员',
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
-  background: #fff;
+  background: $app-surface;
   border-radius: 16rpx;
   padding: 18rpx 24rpx;
   box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.04);
@@ -2865,14 +2905,14 @@ title: '添加家庭成员',
 
 .task-quick-title {
   font-size: 26rpx;
-  color: #333;
+  color: $c-text-strong;
   font-weight: 500;
   line-height: 1.4;
 }
 
 .task-quick-meta {
   font-size: 22rpx;
-  color: #F97316;
+  color: $brand-primary;
   margin-top: 4rpx;
   font-weight: bold;
 }
@@ -2880,8 +2920,8 @@ title: '添加家庭成员',
 .btn-quick-complete {
   margin-left: 16rpx;
   padding: 8rpx 24rpx;
-  background: linear-gradient(135deg, #F97316, #FB923C);
-  color: #fff;
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
+  color: $app-surface;
   font-size: 24rpx;
   font-weight: bold;
   border-radius: 20rpx;
@@ -2909,13 +2949,13 @@ title: '添加家庭成员',
 }
 .challenge-empty-text {
   font-size: 26rpx;
-  color: #999;
+  color: $c-text-muted;
   margin-bottom: 20rpx;
 }
 .challenge-add-btn {
   padding: 10rpx 32rpx;
-  background: linear-gradient(135deg, #F97316, #FB923C);
-  color: #fff;
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
+  color: $app-surface;
   font-size: 24rpx;
   font-weight: bold;
   border-radius: 24rpx;
@@ -2926,5 +2966,5 @@ title: '添加家庭成员',
 .challenge-add-btn::after {
   border: none;
 }
-.self-test-badge { display: inline-block; align-self: flex-start; margin-top: 8rpx; font-size: 20rpx; color: #F97316; background: rgba(249,115,22,0.1); padding: 4rpx 14rpx; border-radius: 999rpx; }
+.self-test-badge { display: inline-block; align-self: flex-start; margin-top: 8rpx; font-size: 20rpx; color: $brand-primary; background: rgba($brand-primary, 0.1); padding: 4rpx 14rpx; border-radius: 999rpx; }
 </style>

+ 70 - 0
cfc-frontend/scripts/equiv-regression.js

@@ -0,0 +1,70 @@
+#!/usr/bin/env node
+/* 等价回归验证(UniForge verify 工具)
+ * 用法:node scripts/equiv-regression.js <页面路径(相对 cfc-frontend)>
+ * 例:node scripts/equiv-regression.js pages/index-home/index.vue
+ *
+ * 原理:uni-app 将 uni.scss prepend 到每个页面 style。
+ * 取 HEAD 版与工作区版分别拼接 uni.scss 编译,hex 大小写/3-6 位归一后逐字节比对。
+ * 全部令牌同值映射时,产物应完全相同 → 证明零观感变化。
+ */
+const { execSync } = require('child_process')
+const fs = require('fs')
+const path = require('path')
+
+const PAGE = process.argv[2]
+if (!PAGE) {
+  console.error('用法: node scripts/equiv-regression.js <页面路径>')
+  process.exit(2)
+}
+
+const ROOT = path.resolve(__dirname, '..')
+const REPO = path.resolve(ROOT, '..')
+const REL = path.relative(REPO, path.join(ROOT, PAGE)).split(path.sep).join('/')
+const TMP = path.join(ROOT, '.tmp_equiv')
+fs.mkdirSync(TMP, { recursive: true })
+
+function extractStyle(src) {
+  const m = src.match(/<style[^>]*>([\s\S]*?)<\/style>/)
+  if (!m) throw new Error('未找到 style 块: ' + PAGE)
+  return m[1]
+}
+
+const uniScss = fs.readFileSync(path.join(ROOT, 'uni.scss'), 'utf8')
+const afterVue = fs.readFileSync(path.join(ROOT, PAGE), 'utf8')
+const beforeVue = execSync(`git -C "${REPO}" show HEAD:${REL}`, { encoding: 'utf8', maxBuffer: 1e8 })
+
+fs.writeFileSync(path.join(TMP, 'after.scss'), uniScss + '\n' + extractStyle(afterVue))
+fs.writeFileSync(path.join(TMP, 'before.scss'), uniScss + '\n' + extractStyle(beforeVue))
+
+const sass = path.join(ROOT, 'node_modules/.bin/sass.cmd')
+execSync(`"${sass}" --no-source-map "${TMP}/after.scss" "${TMP}/after.out.css"`, { stdio: 'pipe' })
+execSync(`"${sass}" --no-source-map "${TMP}/before.scss" "${TMP}/before.out.css"`, { stdio: 'pipe' })
+
+function norm(s) {
+  return s
+    .replace(/#([0-9a-fA-F]{3,8})\b/g, (m) => {
+      let h = m.slice(1).toUpperCase()
+      if (h.length === 3) h = h.split('').map((c) => c + c).join('')
+      return '#' + h
+    })
+    .split('\n').map((l) => l.trim()).filter(Boolean).join('\n')
+}
+
+const before = norm(fs.readFileSync(path.join(TMP, 'before.out.css'), 'utf8'))
+const after = norm(fs.readFileSync(path.join(TMP, 'after.out.css'), 'utf8'))
+
+if (before === after) {
+  console.log(`等价回归 PASS(${PAGE}):编译产物归一后逐字节相同,零观感变化`)
+} else {
+  const bl = before.split('\n'), al = after.split('\n')
+  console.log(`等价回归 DIFF(${PAGE}):before ${bl.length} 行 / after ${al.length} 行`)
+  let shown = 0
+  for (let i = 0; i < Math.max(bl.length, al.length) && shown < 40; i++) {
+    if (bl[i] !== al[i]) {
+      console.log(`L${i + 1}\n  before: ${bl[i]}\n  after:  ${al[i]}`)
+      shown++
+    }
+  }
+  if (shown >= 40) console.log('...(仅显示前 40 处差异)')
+  process.exit(1)
+}