refactor(c-2): C-2a-4a 旧蓝分流·跨面长尾第一批 18 文件

按 docs/beautification-plan.md C-2 三分法执行页面级旧蓝族分流：
- 主行动/选中态 -> $brand-primary 族：teacher 7 页按钮/tab/边框、
  gates 三处、report-detail、report-management、profile/index 渐变、
  member-home-detail 渐变、article-edit、coupons 背景、gate-lock 渐变
- 信息提示 -> $uni-info：ProfileMenu 链接、coupons 文字、
  gates/review-family/review-workbench 浅蓝底徽章（保蓝徽章 coherent）
- gate-lock 锁面板 on-dark accent 随品牌族：#8FC5E8 -> $brand-primary-light、
  rgba(143,197,232,0.5|0.7) -> rgba(251,146,60,0.5|0.7)
- JS/模板：FamilyRelationGraph home 槽 -> #F97316；
  DimensionArticles 渐变蓝槽 -> info 蓝 #0EA5E9->#38BDF8（防与既有橙槽撞色）；
  ProfileMenu 模板 switch -> #F97316
- 补 lang="scss" 17 处；reward-energy material 蓝徽章（#42A5F5）按范围纪律保留

验证：16 个 style 文件 C-2 视觉变更验证（before+预期替换==after 逐字节）全 PASS；
3 个 script 触及文件 node --check 通过；旧蓝族残留扫描 0（material 徽章为故意保留）

cfc-frontend/components/DimensionArticles.vue

@@ -62,7 +62,7 @@ var DIMENSION_MAP = {
 var defaultGradientColors = [
   'linear-gradient(135deg, #6366F1, #818CF8)',
   'linear-gradient(135deg, #8B5CF6, #A78BFA)',
-  'linear-gradient(135deg, #5B9BD5, #8FC5E8)',
+  'linear-gradient(135deg, #0EA5E9, #38BDF8)',
   'linear-gradient(135deg, #10B981, #34D399)',
   'linear-gradient(135deg, #F97316, #FB923C)'
 ]

cfc-frontend/components/FamilyRelationGraph.vue

@@ -115,7 +115,7 @@ export default {
         body: '#8D6E63',
         mind: '#FF6B35',
         action: '#4CAF50',
-        home: '#5B9BD5',
+        home: '#F97316',
         wisdom: '#FFD700'
       }
     }

cfc-frontend/components/gate-lock.vue

@@ -85,7 +85,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .gate-lock {
   margin: 20rpx 30rpx;
 }
@@ -106,12 +106,12 @@ export default {
 .gate-name {
   font-size: 32rpx;
   font-weight: bold;
-  color: #8FC5E8;
+  color: $brand-primary-light;
   margin-bottom: 12rpx;
 }
 .gate-desc {
   font-size: 24rpx;
-  color: rgba(143,197,232,0.7);
+  color: rgba(251,146,60,0.7);
   margin-bottom: 20rpx;
   line-height: 1.5;
 }
@@ -123,7 +123,7 @@ export default {
 }
 .reward-text {
   font-size: 22rpx;
-  color: rgba(143,197,232,0.5);
+  color: rgba(251,146,60,0.5);
 }
 .reward-points, .reward-energy {
   font-size: 22rpx;
@@ -144,7 +144,7 @@ export default {
   line-height: 80rpx;
   font-size: 28rpx;
   color: #fff;
-  background: linear-gradient(135deg, #5B9BD5, #3A7CC2);
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-dark);
   border: none;
   border-radius: 40rpx;
   text-align: center;

cfc-frontend/pages/article-center/article-edit.vue

@@ -240,7 +240,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .edit-container { min-height: 100vh; background: #f5f7fa; }
 .edit-header {
   display: flex;
@@ -257,7 +257,7 @@ export default {
 
 .header-title { font-size: 32rpx; font-weight: bold; color: #333; }
 .header-right { }
-.history-text { font-size: 26rpx; color: #5B9BD5; }
+.history-text { font-size: 26rpx; color: $brand-primary; }
 .edit-form { padding: 20rpx 30rpx; }
 /* 封面 */
 .form-cover {
@@ -336,7 +336,7 @@ export default {
   border: 2rpx solid #eee;
   text-align: center;
 }
-.vis-option.active { border-color: #5B9BD5; background: #E8F4FD; }
+.vis-option.active { border-color: $brand-primary; background: $uni-primary-pale; }
 .vis-icon { font-size: 40rpx; display: block; margin-bottom: 8rpx; }
 .vis-text { font-size: 26rpx; font-weight: bold; color: #333; display: block; }
 .vis-desc { font-size: 20rpx; color: #999; display: block; margin-top: 4rpx; }

cfc-frontend/pages/home-pages/member-home-detail.vue

@@ -206,7 +206,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .detail-container {
   min-height: 100vh;
   background: #f5f7fa;
@@ -236,7 +236,7 @@ export default {
   width: 80rpx;
   height: 80rpx;
   border-radius: 40rpx;
-  background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-dark);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -270,7 +270,7 @@ export default {
 .score-value {
   font-size: 40rpx;
   font-weight: bold;
-  color: #5B9BD5;
+  color: $brand-primary;
 }
 .score-label {
   font-size: 22rpx;

cfc-frontend/pages/profile-extra/coupons.vue

@@ -279,7 +279,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .page {
   min-height: 100vh;
   background: #f5f5f5;
@@ -460,7 +460,7 @@ export default {
 
 .card-scope {
   font-size: 22rpx;
-  color: #5B9BD5;
+  color: $uni-info;
   background: #f0f7ff;
   display: inline-block;
   padding: 2rpx 12rpx;
@@ -500,7 +500,7 @@ export default {
   position: absolute;
   right: 24rpx;
   bottom: 20rpx;
-  background: #5B9BD5;
+  background: $brand-primary;
   color: #fff;
   font-size: 24rpx;
   padding: 10rpx 28rpx;

cfc-frontend/pages/profile-extra/gates.vue

@@ -159,7 +159,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .gates-page {
   padding: 20rpx 0;
   min-height: 100vh;
@@ -192,7 +192,7 @@ export default {
   opacity: 0.7;
 }
 .gate-card--current {
-  border: 2rpx solid #5B9BD5;
+  border: 2rpx solid $brand-primary;
 }
 .gate-status-icon {
   width: 60rpx;
@@ -233,14 +233,14 @@ export default {
   border-radius: 12rpx;
 }
 .reward-points { color: #B8860B; background: rgba(255,215,0,0.15); }
-.reward-energy { color: #3A7CC2; background: rgba(66,165,245,0.15); }
+.reward-energy { color: $uni-info; background: rgba(14,165,233,0.15); }
 .gate-action {
   flex-shrink: 0;
 }
 .action-btn {
   font-size: 24rpx;
   color: #fff;
-  background: #5B9BD5;
+  background: $brand-primary;
   padding: 8rpx 20rpx;
   border-radius: 20rpx;
 }
@@ -253,7 +253,7 @@ export default {
 }
 .action-done {
   font-size: 22rpx;
-  color: #5B9BD5;
+  color: $brand-primary;
 }
 .empty-state {
   text-align: center;

cfc-frontend/pages/profile/components/ProfileMenu.vue

@@ -81,7 +81,7 @@
         </view>
         <view class="menu-item menu-item-switch" v-if="role === 'parent'">
           <text>👁 对家庭成员可见</text>
-          <switch :checked="showToFamily === 1" @change="onShowToFamilyChange" color="#5B9BD5" />
+          <switch :checked="showToFamily === 1" @change="onShowToFamilyChange" color="#F97316" />
         </view>
         <view class="menu-item" @click="logout">
           <text>🚪 退出登录</text>
@@ -341,7 +341,7 @@ var res = await getReferralCode()
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .menu-list {
   margin: 30rpx;
 }
@@ -448,7 +448,7 @@ var res = await getReferralCode()
   font-weight: bold;
 }
 .intent-reselect-link {
-  color: #5B9BD5;
+  color: $uni-info;
   text-decoration: underline;
 }
 

cfc-frontend/pages/profile/index.vue

@@ -145,7 +145,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .container {
   min-height: 100vh;
   background: #f5f7fa;
@@ -185,7 +185,7 @@ export default {
   width: 60%;
   height: 80rpx;
   line-height: 80rpx;
-  background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
+  background: linear-gradient(135deg, $brand-primary, $brand-primary-dark);
   color: #fff;
   font-size: 30rpx;
   font-weight: bold;

cfc-frontend/pages/profile/report-detail.vue

@@ -146,7 +146,7 @@ var res = await getReferralCode()
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .container {
   min-height: 100vh;
   background: #f5f7fa;
@@ -204,7 +204,7 @@ var res = await getReferralCode()
 .score {
   font-size: 56rpx;
   font-weight: bold;
-  color: #5B9BD5;
+  color: $brand-primary;
 }
 
 .score-label {
@@ -243,7 +243,7 @@ var res = await getReferralCode()
 }
 
 .action-btn {
-  background: #5B9BD5;
+  background: $brand-primary;
   color: #fff;
   font-size: 28rpx;
   border-radius: 12rpx;

cfc-frontend/pages/profile/report-management.vue

@@ -141,7 +141,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .container {
   min-height: 100vh;
   background: #f5f7fa;
@@ -168,7 +168,7 @@ export default {
 }
 
 .tab-active {
-  background: #5B9BD5;
+  background: $brand-primary;
   color: #fff;
 }
 

cfc-frontend/pages/teacher/families.vue

@@ -95,7 +95,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .container {
   padding: 30rpx;
   background: #f5f5f5;
@@ -132,7 +132,7 @@ export default {
 }
 
 .family-card.entry {
-  border-left: 8rpx solid #4A9BD7;
+  border-left: 8rpx solid $brand-primary;
 }
 
 .family-meta {

cfc-frontend/pages/teacher/index.vue

@@ -22,7 +22,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .deprecated-container {
   display: flex;
   flex-direction: column;
@@ -49,7 +49,7 @@ export default {
   text-align: center;
 }
 .deprecated-btn {
-  background: #5B9BD5;
+  background: $brand-primary;
   color: #fff;
   font-size: 30rpx;
   font-weight: bold;

cfc-frontend/pages/teacher/plan-create.vue

@@ -77,7 +77,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .page {
   padding: 24rpx;
   background: #F5FAFE;
@@ -141,7 +141,7 @@ export default {
 
 .btn-primary {
   width: 100%;
-  background: #4A9BD7;
+  background: $brand-primary;
   color: #fff;
   font-size: 30rpx;
   font-weight: 600;

cfc-frontend/pages/teacher/plan-detail.vue

@@ -133,7 +133,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .page { padding: 24rpx; background: #F5FAFE; min-height: 100vh; }
 .card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; }
 .title { font-size: 32rpx; font-weight: 600; color: #1F2D3D; display: block; margin-bottom: 12rpx; }
@@ -142,7 +142,7 @@ export default {
 .editor { width: 100%; min-height: 400rpx; font-size: 28rpx; color: #1F2D3D; padding: 16rpx; background: #F7F9FC; border-radius: 12rpx; }
 .actions { display: flex; flex-direction: row; flex-wrap: wrap; }
 .btn { flex: 1; text-align: center; padding: 20rpx 0; border-radius: 12rpx; font-size: 28rpx; margin-right: 16rpx; margin-bottom: 16rpx; min-width: 40%; }
-.btn.ghost { background: #fff; color: #4A9BD7; border: 1rpx solid #4A9BD7; }
-.btn.ok { background: #4A9BD7; color: #fff; }
+.btn.ghost { background: #fff; color: $brand-primary; border: 1rpx solid $brand-primary; }
+.btn.ok { background: $brand-primary; color: #fff; }
 .btn.no { background: #F2F4F7; color: #5A6478; margin-right: 0; }
 </style>

cfc-frontend/pages/teacher/plan-list.vue

@@ -104,7 +104,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .page {
   min-height: 100vh;
   background: #F5FAFE;
@@ -135,7 +135,7 @@ export default {
 
 .btn-primary {
   width: 100%;
-  background: #4A9BD7;
+  background: $brand-primary;
   color: #fff;
   font-size: 30rpx;
   font-weight: 600;

cfc-frontend/pages/teacher/review-family.vue

@@ -172,22 +172,22 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .page { padding: 24rpx; background: #F5FAFE; min-height: 100vh; }
 .tabs { display: flex; flex-direction: row; background: #fff; border-radius: 12rpx; margin-bottom: 20rpx; }
 .tab { flex: 1; text-align: center; padding: 20rpx 0; font-size: 28rpx; color: #8A94A6; }
-.tab.active { color: #4A9BD7; font-weight: 600; }
+.tab.active { color: $brand-primary; font-weight: 600; }
 .card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; }
 .row { display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin-bottom: 12rpx; }
 .name { font-size: 30rpx; color: #1F2D3D; font-weight: 500; }
-.badge { font-size: 22rpx; color: #4A9BD7; background: #EAF4FC; padding: 4rpx 12rpx; border-radius: 8rpx; }
+.badge { font-size: 22rpx; color: $uni-info; background: #EAF4FC; padding: 4rpx 12rpx; border-radius: 8rpx; }
 .badge.grey { color: #8A94A6; background: #F2F4F7; }
 .meta { font-size: 24rpx; color: #8A94A6; }
 .member-bar { background: #fff; border-radius: 12rpx; padding: 20rpx 24rpx; margin-bottom: 20rpx; }
 .picker { font-size: 28rpx; color: #1F2D3D; }
 .actions { display: flex; flex-direction: row; margin-top: 16rpx; }
 .btn { flex: 1; text-align: center; padding: 16rpx 0; border-radius: 12rpx; font-size: 26rpx; margin-right: 16rpx; }
-.btn.ok { background: #4A9BD7; color: #fff; }
+.btn.ok { background: $brand-primary; color: #fff; }
 .btn.no { background: #F2F4F7; color: #5A6478; margin-right: 0; }
 .empty { text-align: center; color: #8A94A6; font-size: 28rpx; padding: 80rpx 0; }
 </style>

cfc-frontend/pages/teacher/review-workbench.vue

@@ -77,7 +77,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .page { padding: 24rpx; background: #F5FAFE; min-height: 100vh; }
 .header { padding: 24rpx 8rpx; }
 .title { font-size: 36rpx; font-weight: 600; color: #1F2D3D; display: block; }
@@ -85,7 +85,7 @@ export default {
 .card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; }
 .row { display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin-bottom: 12rpx; }
 .name { font-size: 30rpx; color: #1F2D3D; font-weight: 500; }
-.badge { font-size: 22rpx; color: #4A9BD7; background: #EAF4FC; padding: 4rpx 12rpx; border-radius: 8rpx; }
+.badge { font-size: 22rpx; color: $uni-info; background: #EAF4FC; padding: 4rpx 12rpx; border-radius: 8rpx; }
 .meta { font-size: 24rpx; color: #8A94A6; }
 .empty { text-align: center; color: #8A94A6; font-size: 28rpx; padding: 80rpx 0; }
 </style>