Merge U4: 小程序 30rpx 间距令牌归并（$uni-space-page / $uni-space-lg）

合并 feature/ui-token-30rpx：
- U4 分支基于早期 cfclub，与当前 cfclub（含 U1/U2/U3 令牌改动）在大量公共样式行冲突（92 文件）；
  采用「取 cfclub 基线 + 叠加 U4 的 30rpx→令牌映射」策略，避免 92 文件逐个人工解冲：
  · git merge -X ours 记录合并链并化解全部冲突到当前 cfclub
  · 程序化映射：padding 左/右位 30rpx→$uni-space-page、上/下位→$uni-space-lg；
    margin/gap 30rpx→$uni-space-lg（内部间距默认档）；单值 padding:30rpx→$uni-space-page
- 仅作用于 <style> 块与样式文件；模板内联 style / <script> 不动（SCSS 令牌在内联样式不解析）
- 已知残留：cfc-frontend/pages/wealth/index.vue 第 838-893 行 CSS 游离在 <style> 块之外
  （该异常在 cfclub 基线 4035dcc63 已存在，非本次引入，超出合并范围，已单独标注）

cfc-frontend/components/ContentSharePoster.vue

@@ -794,7 +794,7 @@ export default {
   display: flex;
   flex-direction: column;
   width: 620rpx;
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 .poster-btn {
   height: 80rpx;

cfc-frontend/components/DimensionActivities.vue

@@ -280,7 +280,7 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 30rpx 0;
+  padding: $uni-space-lg 0;
 }
 .empty-icon {
   font-size: calc(64rpx * var(--font-scale, 1));

cfc-frontend/components/DimensionIntroCard.vue

@@ -68,7 +68,7 @@ export default {
 
 <style lang="scss">
 .dim-intro-card {
-  margin: 16rpx 30rpx 0;
+  margin: 16rpx $uni-space-lg 0;
   padding: 24rpx 28rpx;
   border-radius: 16rpx;
   box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.04);

cfc-frontend/components/DimensionPageSkeleton.vue

@@ -62,7 +62,7 @@ export default {
   display: flex;
   flex-direction: column;
   gap: 24rpx;
-  padding: 24rpx 30rpx 0;
+  padding: 24rpx $uni-space-page 0;
 }
 
 .dim-skeleton-strap {

cfc-frontend/components/DimensionVisitorCard.vue

@@ -102,7 +102,7 @@ export default {
 
 <style scoped lang="scss">
 .dvc {
-  margin: 12rpx 30rpx 0;
+  margin: 12rpx $uni-space-lg 0;
 }
 
 .dvc-card {

cfc-frontend/components/FamilyEnergyBar.vue

@@ -168,7 +168,7 @@ export default {
 
 <style scoped lang="scss">
 .family-energy-bar {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 28rpx 24rpx;

cfc-frontend/components/FamilyFeed.vue

@@ -228,7 +228,7 @@ export default {
 
 <style lang="scss">
 .family-feed {
-  margin: 12rpx 30rpx 0;
+  margin: 12rpx $uni-space-lg 0;
   background: $app-surface;
   border-radius: 16rpx;
   padding: 10rpx 16rpx;

cfc-frontend/components/LoginGuideCard.vue

@@ -36,7 +36,7 @@ export default {
 
 <style scoped lang="scss">
 .login-guide-card {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: linear-gradient(135deg, $uni-primary-pale, #FFE4D6);
   border-radius: 24rpx;
   padding: 40rpx 32rpx;

cfc-frontend/components/MemberSelector.vue

@@ -585,7 +585,7 @@ export default {
    ================================================================ */
 .family-member-strip {
   margin: 16rpx 0;
-  padding: 0 30rpx;
+  padding: 0 $uni-space-page;
 }
 .strip-scroll {
   width: 100%;
@@ -637,7 +637,7 @@ export default {
 .action-item {
   display: flex;
   align-items: center;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   border-bottom: 1rpx solid $facade-fill-gray-50;
 }
 .action-item:active {
@@ -670,7 +670,7 @@ export default {
 /* 空状态 */
 .family-strip-empty {
   margin: 16rpx 0;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   background: $app-surface;
   border-radius: 24rpx;
   display: flex;
@@ -697,7 +697,7 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   border-bottom: 1rpx solid $facade-fill-gray-100;
 }
 .action-avatar {
@@ -713,7 +713,7 @@ export default {
 }
 /* 关系现状 */
 .action-scores {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
 }
 .score-row {
   display: flex;
@@ -750,7 +750,7 @@ export default {
 .action-divider {
   height: 1rpx;
   background: $facade-fill-gray-100;
-  margin: 0 30rpx;
+  margin: 0 $uni-space-lg;
 }
 
 /* ================================================================
@@ -766,7 +766,7 @@ $tab-dims: (
 );
 
 .member-tabs {
-  padding: 8rpx 30rpx 4rpx;
+  padding: 8rpx $uni-space-page 4rpx;
 }
 .tabs-scroll {
   width: 100%;
@@ -932,7 +932,7 @@ $tab-dims: (
    minimal 变体（轻量 chip 条，替代各页面内联 member-bar）
    ================================================================ */
 .member-minimal {
-  padding: 16rpx 30rpx 8rpx;
+  padding: 16rpx $uni-space-page 8rpx;
   background: $app-surface;
   border-bottom: 1rpx solid $facade-fill;
 }

cfc-frontend/components/PageBanner.vue

@@ -90,7 +90,7 @@ export default {
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   min-height: 100rpx;
   border-radius: 0;
   margin: 0;

cfc-frontend/components/ProfileBadges.vue

@@ -113,7 +113,7 @@ export default {
 
 <style scoped lang="scss">
 .section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .section-header {
   display: flex;

cfc-frontend/components/ProfileGrowth.vue

@@ -84,7 +84,7 @@ export default {
 
 <style scoped lang="scss">
 .section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .section-header {
   display: flex;
@@ -105,7 +105,7 @@ export default {
 .report-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   display: flex;
   align-items: center;
   box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);

cfc-frontend/components/RadarChart.vue

@@ -851,7 +851,7 @@ export default {
 
 <style scoped lang="scss">
 .radar-chart-wrap {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);

cfc-frontend/components/RelatedContent.vue

@@ -307,10 +307,10 @@ export default {
 
 <style scoped lang="scss">
 .related-content {
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 .related-loading-wrap {
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   display: flex;
   justify-content: center;
 }
@@ -322,7 +322,7 @@ export default {
   background: $app-surface;
   border-radius: 16rpx;
   padding: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .related-header {
   display: flex;

cfc-frontend/components/address-picker.vue

@@ -421,7 +421,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 30rpx 30rpx 20rpx;
+  padding: $uni-space-lg $uni-space-page 20rpx;
   border-bottom: 1px solid $facade-hairline-2;
 }
 
@@ -446,7 +446,7 @@ export default {
 .picker-breadcrumb {
   display: flex;
   align-items: center;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   background: $facade-fill-ghost;
   border-bottom: 1px solid $facade-hairline-2;
   flex-wrap: wrap;

cfc-frontend/components/gate-lock.vue

@@ -87,12 +87,12 @@ export default {
 
 <style scoped lang="scss">
 .gate-lock {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .lock-card {
   background: linear-gradient(135deg, $facade-ink-navy, $accent-navy);
   border-radius: 24rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   display: flex;
   flex-direction: column;
   align-items: center;

cfc-frontend/components/wuxing-sandbox.vue

@@ -667,7 +667,7 @@ export default {
 容器
 ============================================================ */
 .wuxing-sandbox {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   padding: 20rpx 24rpx 24rpx;
   background: linear-gradient(135deg, $facade-ink-navy, $accent-navy, $app-ink-night-2);
   border-radius: 24rpx;

cfc-frontend/pages/achievement/index.vue

@@ -140,9 +140,9 @@ export default {
 }
 .badge-section, .goals-section {
   background: $app-surface;
-  margin: 0 30rpx 20rpx;
+  margin: 0 $uni-space-lg 20rpx;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
 }
 .section-title {
   font-size: calc(30rpx * var(--font-scale, 1));

cfc-frontend/pages/action-detail/components/DimensionSubDims.vue

@@ -63,7 +63,7 @@ export default {
 
 <style scoped lang="scss">
 .dim-subdims {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: rgba(255, 255, 255, 0.95);
   border-radius: 24rpx;
   padding: 28rpx 24rpx;

cfc-frontend/pages/action-detail/contact-detail.vue

@@ -263,7 +263,7 @@ export default {
 }
 .detail-header {
   background: linear-gradient(135deg, $accent-indigo, $accent-indigo-deep);
-  padding: 60rpx 30rpx 40rpx;
+  padding: 60rpx $uni-space-page 40rpx;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -273,7 +273,7 @@ export default {
   width: 100%;
   display: flex;
   justify-content: space-between;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .back-btn, .edit-btn {
   font-size: calc(28rpx * var(--font-scale, 1));
@@ -303,7 +303,7 @@ export default {
   background: $app-surface;
   margin: 20rpx;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
 }
 .section-title {
   font-size: calc(28rpx * var(--font-scale, 1));
@@ -377,7 +377,7 @@ export default {
 }
 .interaction-date { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; }
 .interaction-desc { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-deep; }
-.interaction-empty { text-align: center; padding: 30rpx; color: $facade-text-muted; font-size: calc(26rpx * var(--font-scale, 1)); }
+.interaction-empty { text-align: center; padding: $uni-space-page; color: $facade-text-muted; font-size: calc(26rpx * var(--font-scale, 1)); }
 .btn-interaction {
   width: 100%;
   padding: 24rpx;

cfc-frontend/pages/action-detail/index.vue

@@ -895,7 +895,7 @@ $c-tint-mint: $c-tint-mint-wash;
 
 /* 品牌定位语 */
 .brand-strap {
-  margin: 24rpx 30rpx 0;
+  margin: 24rpx $uni-space-lg 0;
   padding: 28rpx 32rpx;
   background: linear-gradient(135deg, $dim-action 0%, $c-action-light 50%, $c-action-lighter 100%);
   border-radius: 24rpx;
@@ -934,7 +934,7 @@ $c-tint-mint: $c-tint-mint-wash;
 
 /* 每月引导语 */
 .monthly-guidance {
-  margin: 20rpx 30rpx 0;
+  margin: 20rpx $uni-space-lg 0;
   padding: 24rpx 28rpx;
   background: linear-gradient(135deg, $app-surface 0%, $dim-action-tint 100%);
   border-radius: 24rpx;
@@ -953,7 +953,7 @@ $c-tint-mint: $c-tint-mint-wash;
 
 /* ===== 通用区块 ===== */
 .section {
-  margin: 24rpx 30rpx 0;
+  margin: 24rpx $uni-space-lg 0;
   position: relative;
 }
 .section::before {
@@ -1205,7 +1205,7 @@ $c-tint-mint: $c-tint-mint-wash;
 
 /* 功能入口网格 */
 .func-section {
-  margin: 24rpx 30rpx 0;
+  margin: 24rpx $uni-space-lg 0;
 }
 .func-grid {
   display: flex;
@@ -1255,7 +1255,7 @@ $c-tint-mint: $c-tint-mint-wash;
 
 /* 维度画像样式 */
 .dimension-portrait-section {
-  margin: 24rpx 30rpx;
+  margin: 24rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 32rpx 24rpx;

cfc-frontend/pages/action-detail/interaction-log.vue

@@ -418,7 +418,7 @@ export default {
   padding: 24rpx;
 }
 .page-header {
-  padding: 20rpx 0 30rpx;
+  padding: 20rpx 0 $uni-space-lg;
 }
 .page-title {
   font-size: calc(36rpx * var(--font-scale, 1));

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

@@ -240,7 +240,7 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 24rpx;
@@ -302,7 +302,7 @@ export default {
 
 /* 品牌定位语 */
 .brand-strap {
-  margin: 16rpx 30rpx 0;
+  margin: 16rpx $uni-space-lg 0;
   padding: 20rpx 28rpx;
   background: linear-gradient(135deg, $dim-action-tint, rgba(16,185,129,0.12));
   border-radius: 16rpx;
@@ -316,7 +316,7 @@ export default {
 
 /* 每月引导语 */
 .monthly-guidance {
-  margin: 16rpx 30rpx 0;
+  margin: 16rpx $uni-space-lg 0;
   padding: 20rpx 28rpx;
   background: linear-gradient(135deg, $dim-action-tint, rgba(16,185,129,0.08));
   border-radius: 16rpx;

cfc-frontend/pages/action-detail/octopus-add-effect.vue

@@ -222,7 +222,7 @@ export default {
   padding: 24rpx;
 }
 .page-header {
-  padding: 20rpx 0 30rpx;
+  padding: 20rpx 0 $uni-space-lg;
 }
 .page-title {
   font-size: calc(36rpx * var(--font-scale, 1));

cfc-frontend/pages/action-detail/octopus-add-key-person.vue

@@ -170,7 +170,7 @@ export default {
   padding: 24rpx;
 }
 .page-header {
-  padding: 20rpx 0 30rpx;
+  padding: 20rpx 0 $uni-space-lg;
 }
 .page-title {
   font-size: calc(36rpx * var(--font-scale, 1));

cfc-frontend/pages/action-detail/octopus-effects-list.vue

@@ -113,7 +113,7 @@ export default {
   padding-bottom: 120rpx;
 }
 .page-header {
-  padding: 20rpx 0 30rpx;
+  padding: 20rpx 0 $uni-space-lg;
 }
 .page-title {
   font-size: calc(36rpx * var(--font-scale, 1));

cfc-frontend/pages/action-detail/pearl-add-resource.vue

@@ -148,7 +148,7 @@ export default {
   padding: 24rpx;
 }
 .page-header {
-  padding: 20rpx 0 30rpx;
+  padding: 20rpx 0 $uni-space-lg;
 }
 .page-title {
   font-size: calc(36rpx * var(--font-scale, 1));

cfc-frontend/pages/action-detail/relationship-questionnaire.vue

@@ -189,7 +189,7 @@ export default {
   padding: 24rpx;
 }
 .page-header {
-  padding: 20rpx 0 30rpx;
+  padding: 20rpx 0 $uni-space-lg;
 }
 .page-title {
   font-size: calc(36rpx * var(--font-scale, 1));
@@ -215,7 +215,7 @@ export default {
   font-size: calc(28rpx * var(--font-scale, 1));
   color: $facade-text-muted;
   display: block;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .btn-generate, .btn-submit {
   background: $brand-primary;
@@ -324,13 +324,13 @@ export default {
   color: $facade-text-strong;
   display: block;
   text-align: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .result-scores {
   display: flex;
   flex-direction: column;
   gap: 20rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .result-score-item {
   display: flex;

cfc-frontend/pages/activity/activity-detail/activity-detail.vue

@@ -1130,7 +1130,7 @@ export default {
 
 /* 信息区 */
 .info-section {
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .activity-tags {
   display: flex;
@@ -1206,7 +1206,7 @@ export default {
 
 /* 报名情况 */
 .roster-section {
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
   background: $app-surface;
   border-radius: 16rpx;
   padding: 24rpx;
@@ -1308,7 +1308,7 @@ export default {
 
 /* 活动介绍 */
 .desc-section {
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
   background: $app-surface;
   border-radius: 16rpx;
   padding: 24rpx;
@@ -1329,8 +1329,8 @@ export default {
 /* 付费不退费说明 */
 .refund-notice {
   margin-top: 20rpx;
-  margin-left: 30rpx;
-  margin-right: 30rpx;
+  margin-left: $uni-space-lg;
+  margin-right: $uni-space-lg;
   margin-bottom: 10rpx;
   background: $status-danger-tint-2;
   border: 2rpx solid $danger-line;
@@ -1358,7 +1358,7 @@ export default {
   right: 0;
   bottom: 0;
   background: $app-surface;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
   display: flex;
   flex-direction: row;
@@ -1490,7 +1490,7 @@ export default {
 
 /* 活动评价 */
 .feedback-section {
-  padding: 30rpx;
+  padding: $uni-space-page;
   margin: 20rpx;
   background: $app-surface;
   border-radius: 16rpx;
@@ -1527,7 +1527,7 @@ export default {
 }
 .feedback-modal-title {
   font-size: calc(34rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong;
-  text-align: center; margin-bottom: 30rpx;
+  text-align: center; margin-bottom: $uni-space-lg;
 }
 .rating-row {
   display: flex; justify-content: space-between; align-items: center;
@@ -1543,7 +1543,7 @@ export default {
   padding: 16rpx; font-size: calc(26rpx * var(--font-scale, 1)); box-sizing: border-box;
 }
 .feedback-modal-actions {
-  display: flex; justify-content: space-between; margin-top: 30rpx;
+  display: flex; justify-content: space-between; margin-top: $uni-space-lg;
 }
 .feedback-cancel-btn {
   flex: 1; background: $facade-fill-2; color: $facade-text-body; border: none;
@@ -1587,7 +1587,7 @@ export default {
   color: $facade-text-strong;
   text-align: center;
   display: block;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .reg-section-label {
   font-size: calc(28rpx * var(--font-scale, 1));

cfc-frontend/pages/activity/index.vue

@@ -1252,7 +1252,7 @@ uni.showToast({ title: '请先选择家庭成员身份', icon: 'none' })
 
 .load-more-tip {
   text-align: center;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .load-more-text {

cfc-frontend/pages/ai/chat.vue

@@ -977,7 +977,7 @@ export default {
   background: $facade-fill-2;
 }
 .quota-bar-wrapper {
-  padding: 16rpx 30rpx;
+  padding: 16rpx $uni-space-page;
   background: $app-surface;
   border-top: 1rpx solid $facade-fill-2;
 }

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

@@ -451,12 +451,12 @@ export default {
 .loading-text { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-muted; }
 .error-wrap { display: flex; flex-direction: column; align-items: center; padding-top: 300rpx; }
 .error-icon { font-size: calc(100rpx * var(--font-scale, 1)); margin-bottom: 24rpx; }
-.error-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: 30rpx; }
+.error-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: $uni-space-lg; }
 .retry-btn { width: 240rpx; height: 72rpx; line-height: 72rpx; background: $brand-primary; color: $app-surface; font-size: calc(28rpx * var(--font-scale, 1)); border-radius: 24rpx; text-align: center; border: none; }
 .content-scroll { height: calc(100vh - 120rpx); }
 .detail-cover { width: 100%; display: block; }
-.detail-title { display: block; font-size: calc(36rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; line-height: 1.4; padding: 30rpx 30rpx 0; }
-.detail-meta { display: flex; align-items: center; padding: 16rpx 30rpx 0; font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; flex-wrap: wrap; }
+.detail-title { display: block; font-size: calc(36rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; line-height: 1.4; padding: $uni-space-lg $uni-space-page 0; }
+.detail-meta { display: flex; align-items: center; padding: 16rpx $uni-space-page 0; font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; flex-wrap: wrap; }
 .meta-author { color: $uni-info; }
 .meta-sep { margin: 0 12rpx; color: $facade-border-soft; }
 .reading-time-badge { margin-left: auto; font-size: calc(20rpx * var(--font-scale, 1)); color: $uni-info; background: rgba(14, 165, 233, 0.08); padding: 4rpx 12rpx; border-radius: 24rpx; white-space: nowrap; }
@@ -465,24 +465,24 @@ export default {
   font-size: calc(20rpx * var(--font-scale, 1));
   color: $facade-text-ghost-light;
 }
-.detail-category-row { padding: 16rpx 30rpx 0; }
+.detail-category-row { padding: 16rpx $uni-space-page 0; }
 .detail-category { display: inline-block; font-size: calc(20rpx * var(--font-scale, 1)); color: $uni-info; background: rgba(14, 165, 233, 0.1); padding: 4rpx 16rpx; border-radius: 8rpx; }
-.detail-dimensions { padding: 16rpx 30rpx 0; display: flex; gap: 12rpx; }
+.detail-dimensions { padding: 16rpx $uni-space-page 0; display: flex; gap: 12rpx; }
 .dim-bar-item { flex: 1; }
 .dim-bar { height: 8rpx; border-radius: 8rpx; }
 .dim-label { font-size: calc(18rpx * var(--font-scale, 1)); color: $facade-text-muted; text-align: center; display: block; margin-top: 4rpx; }
-.detail-summary { padding: 20rpx 30rpx; }
+.detail-summary { padding: 20rpx $uni-space-page; }
 .detail-summary-text { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-faint; line-height: 1.7; display: block; border-left: 4rpx solid $brand-primary; padding-left: 20rpx; }
-.divider { height: 1rpx; background: $facade-hairline-2; margin: 24rpx 30rpx; }
-.detail-body { padding: 0 30rpx; font-size: calc(32rpx * var(--font-scale, 1)); color: $facade-text-deep-2; line-height: 1.8; }
+.divider { height: 1rpx; background: $facade-hairline-2; margin: 24rpx $uni-space-lg; }
+.detail-body { padding: 0 $uni-space-page; font-size: calc(32rpx * var(--font-scale, 1)); color: $facade-text-deep-2; line-height: 1.8; }
 
-.detail-footer { position: fixed; bottom: 0; left: 0; right: 0; background: $app-surface; padding: 20rpx 30rpx; display: flex; align-items: center; gap: 16rpx; box-shadow: 0 -2rpx 10rpx rgba(0,0,0,0.06); z-index: 10; }
-.share-btn { height: 72rpx; padding: 0 30rpx; background: linear-gradient(135deg, $brand-primary, $brand-primary-light); border-radius: 24rpx; display: flex; align-items: center; justify-content: center; border: none; }
+.detail-footer { position: fixed; bottom: 0; left: 0; right: 0; background: $app-surface; padding: 20rpx $uni-space-page; display: flex; align-items: center; gap: 16rpx; box-shadow: 0 -2rpx 10rpx rgba(0,0,0,0.06); z-index: 10; }
+.share-btn { height: 72rpx; padding: 0 $uni-space-page; background: linear-gradient(135deg, $brand-primary, $brand-primary-light); border-radius: 24rpx; display: flex; align-items: center; justify-content: center; border: none; }
 .share-btn::after { border: none; }
 .share-btn-icon { font-size: calc(30rpx * var(--font-scale, 1)); margin-right: 8rpx; }
 .share-btn-text { font-size: calc(26rpx * var(--font-scale, 1)); color: $app-surface; font-weight: 600; }
 
-.listen-btn { height: 72rpx; padding: 0 30rpx; background: rgba(14, 165, 233, 0.1); border: 2rpx solid $uni-info; border-radius: 24rpx; display: flex; align-items: center; justify-content: center; }
+.listen-btn { height: 72rpx; padding: 0 $uni-space-page; background: rgba(14, 165, 233, 0.1); border: 2rpx solid $uni-info; border-radius: 24rpx; display: flex; align-items: center; justify-content: center; }
 .listen-btn.playing { background: rgba(14, 165, 233, 0.2); }
 .listen-btn-icon { font-size: calc(30rpx * var(--font-scale, 1)); margin-right: 8rpx; }
 .listen-btn-text { font-size: calc(26rpx * var(--font-scale, 1)); color: $uni-info; font-weight: 600; }

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

@@ -251,7 +251,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 80rpx 30rpx 20rpx;
+  padding: 80rpx $uni-space-page 20rpx;
   background: $app-surface;
   position: sticky;
   top: 0;
@@ -263,7 +263,7 @@ export default {
 .header-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; }
 .header-right { }
 .history-text { font-size: calc(26rpx * var(--font-scale, 1)); color: $brand-primary; }
-.edit-form { padding: 20rpx 30rpx; }
+.edit-form { padding: 20rpx $uni-space-page; }
 /* 封面 */
 .form-cover {
   width: 100%;

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

@@ -617,7 +617,7 @@ onLoad(options) {
 .ac-loading-more,
 .ac-no-more {
   text-align: center;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .ac-loading-text {
   font-size: calc(24rpx * var(--font-scale, 1));

cfc-frontend/pages/article-center/my-posts.vue

@@ -138,7 +138,7 @@ export default {
 .loading-wrap, .empty-wrap { display: flex; flex-direction: column; align-items: center; padding-top: 200rpx; }
 .loading-text { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-muted; }
 .empty-icon { font-size: calc(100rpx * var(--font-scale, 1)); margin-bottom: 24rpx; }
-.empty-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: 30rpx; }
+.empty-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: $uni-space-lg; }
 .write-btn { width: 240rpx; height: 72rpx; line-height: 72rpx; background: $brand-primary; color: $app-surface; font-size: calc(28rpx * var(--font-scale, 1)); border-radius: 24rpx; border: none; }
 .write-btn::after { border: none; }
 .post-list { padding: 20rpx 24rpx; }
@@ -161,6 +161,6 @@ export default {
 .status-rejected { color: $status-danger; background: rgba(239,68,68,0.1); }
 .status-draft { color: $facade-text-muted; background: rgba(153,153,153,0.1); }
 .post-reason { font-size: calc(20rpx * var(--font-scale, 1)); color: $status-danger; margin-top: 6rpx; display: block; }
-.loading-more, .no-more { text-align: center; padding: 30rpx; }
+.loading-more, .no-more { text-align: center; padding: $uni-space-page; }
 .no-more-text { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-ghost; }
 </style>

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

@@ -162,7 +162,7 @@ export default {
 
 /* ===== 详情卡片 ===== */
 .detail-card {
-  margin: 30rpx;
+  margin: $uni-space-lg;
   background: $app-surface;
   border-radius: 16rpx;
   padding: 32rpx 28rpx;

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

@@ -129,7 +129,7 @@ export default {
 
 /* ===== 方案列表 ===== */
 .plan-list {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .plan-card {
   background: $app-surface;

cfc-frontend/pages/assessment/apply.vue

@@ -353,7 +353,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
@@ -379,8 +379,8 @@ export default {
 .section {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
-  margin-bottom: 30rpx;
+  padding: $uni-space-lg;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-title {

cfc-frontend/pages/assessment/execution.vue

@@ -260,7 +260,7 @@ export default {
   border-radius: 24rpx;
   padding: 60rpx 40rpx;
   text-align: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
 }
 
@@ -271,7 +271,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: 0 auto 30rpx;
+  margin: 0 auto $uni-space-lg;
   position: relative;
 }
 
@@ -365,7 +365,7 @@ export default {
   background: white;
   border-radius: 24rpx;
   padding: 40rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .timeline-item {
@@ -397,7 +397,7 @@ export default {
   height: 30rpx;
   border-radius: 50%;
   background: $facade-hairline;
-  margin-right: 30rpx;
+  margin-right: $uni-space-lg;
   flex-shrink: 0;
   z-index: 1;
   display: flex;
@@ -539,7 +539,7 @@ export default {
   background: white;
   border-radius: 24rpx;
   padding: 40rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-title {
@@ -574,7 +574,7 @@ export default {
 .btn-primary, .btn-secondary, .btn-outline {
   border-radius: 24rpx;
   font-size: calc(32rpx * var(--font-scale, 1));
-  padding: 30rpx;
+  padding: $uni-space-page;
   text-align: center;
 }
 

cfc-frontend/pages/assessment/purchase.vue

@@ -357,7 +357,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
@@ -383,8 +383,8 @@ export default {
 .section {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
-  margin-bottom: 30rpx;
+  padding: $uni-space-lg;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-title {

cfc-frontend/pages/assessment/quota.vue

@@ -101,13 +101,13 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
 .header {
   text-align: center;
-  padding: 40rpx 0 30rpx;
+  padding: 40rpx 0 $uni-space-lg;
 }
 .title {
   font-size: calc(44rpx * var(--font-scale, 1));

cfc-frontend/pages/assessment/rating.vue

@@ -236,13 +236,13 @@ export default {
   background: white;
   border-radius: 24rpx;
   padding: 40rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-header {
   display: flex;
   align-items: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-icon {
@@ -289,7 +289,7 @@ export default {
 .rating-stars {
   display: flex;
   align-items: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .star-label {
@@ -350,7 +350,7 @@ export default {
 .btn-primary, .btn-outline {
   border-radius: 24rpx;
   font-size: calc(32rpx * var(--font-scale, 1));
-  padding: 30rpx;
+  padding: $uni-space-page;
   text-align: center;
 }
 

cfc-frontend/pages/assessment/results.vue

@@ -233,7 +233,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
@@ -261,7 +261,7 @@ export default {
   background: $app-surface;
   border-radius: 24rpx;
   padding: 10rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .tab-item {
@@ -281,8 +281,8 @@ export default {
 .section {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
-  margin-bottom: 30rpx;
+  padding: $uni-space-lg;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-title {
@@ -407,7 +407,7 @@ export default {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .modal-title {
@@ -423,11 +423,11 @@ export default {
 }
 
 .report-detail {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .detail-section {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .detail-title {

cfc-frontend/pages/assessment/upload-report.vue

@@ -114,13 +114,13 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
 .header {
   text-align: center;
-  padding: 40rpx 0 30rpx;
+  padding: 40rpx 0 $uni-space-lg;
 }
 .title {
   font-size: calc(44rpx * var(--font-scale, 1));
@@ -136,7 +136,7 @@ export default {
 .section {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   margin-bottom: 24rpx;
 }
 .section-title {
@@ -214,7 +214,7 @@ export default {
   color: $app-surface;
   border-radius: 24rpx;
   font-size: calc(30rpx * var(--font-scale, 1));
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 .btn-submit[disabled] {
   opacity: 0.5;

cfc-frontend/pages/body-detail/checkin.vue

@@ -295,7 +295,7 @@ $c-tint-amber-edge: #FFECB3;  // 能量提示渐变终点（amber-100；与全
 
 /* ===== 能量提示 ===== */
 .energy-tip {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: linear-gradient(135deg, $mat-amber-tint, $c-tint-amber-edge);
   border-radius: 16rpx;
   padding: 16rpx 24rpx;
@@ -314,7 +314,7 @@ $c-tint-amber-edge: #FFECB3;  // 能量提示渐变终点（amber-100；与全
 
 /* ===== 表单 ===== */
 .form-section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 24rpx;
@@ -427,7 +427,7 @@ $c-tint-amber-edge: #FFECB3;  // 能量提示渐变终点（amber-100；与全
 
 /* ===== 历史记录 ===== */
 .history-section {
-  margin: 30rpx 30rpx 0;
+  margin: $uni-space-xl $uni-space-lg 0;
 }
 .section-title {
   font-size: calc(30rpx * var(--font-scale, 1));

cfc-frontend/pages/body-detail/dimension-detail.vue

@@ -399,9 +399,9 @@ export default {
 }
 .dd-section {
   background: $app-surface;
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
 }
 .dd-section-title {
@@ -511,7 +511,7 @@ export default {
 .dd-actions {
   display: flex;
   gap: 20rpx;
-  margin: 40rpx 30rpx;
+  margin: 40rpx $uni-space-lg;
 }
 .dd-btn {
   flex: 1;

cfc-frontend/pages/body-detail/dimension-questionnaire.vue

@@ -446,7 +446,7 @@ export default {
 .qd-container {
   min-height: 100vh;
   background: $uni-primary-pale;
-  padding: 20rpx 30rpx 100rpx;
+  padding: 20rpx $uni-space-page 100rpx;
 }
 .qd-loading {
   display: flex;
@@ -467,7 +467,7 @@ export default {
 }
 .qd-header {
   text-align: center;
-  padding: 30rpx 0;
+  padding: $uni-space-lg 0;
 }
 .qd-title {
   font-size: calc(36rpx * var(--font-scale, 1));
@@ -489,7 +489,7 @@ export default {
   width: 45%;
   background: $app-surface;
   border-radius: 16rpx;
-  padding: 30rpx 20rpx;
+  padding: $uni-space-lg 20rpx;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -543,7 +543,7 @@ export default {
 .qd-question-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   margin: 20rpx 0;
   box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
 }
@@ -554,7 +554,7 @@ export default {
   line-height: 1.5;
 }
 .qd-options {
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 .qd-option {
   display: flex;
@@ -649,6 +649,6 @@ export default {
   color: $facade-text-faint;
   margin-top: 20rpx;
   line-height: 1.6;
-  padding: 0 30rpx;
+  padding: 0 $uni-space-page;
 }
 </style>

cfc-frontend/pages/body-detail/health-dimensions.vue

@@ -351,7 +351,7 @@ export default {
 }
 .hd-header {
   background: linear-gradient(135deg, $dim-body, $mind-accent);
-  padding: 40rpx 30rpx 30rpx;
+  padding: 40rpx $uni-space-page $uni-space-lg;
   color: $app-surface;
 }
 .hd-title {
@@ -368,7 +368,7 @@ export default {
 .hd-health-index {
   display: flex;
   justify-content: center;
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $app-surface;
 }
 .index-circle {
@@ -395,13 +395,13 @@ export default {
 .radar-section {
   background: $app-surface;
   margin-top: 20rpx;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .radar-title {
   font-size: calc(32rpx * var(--font-scale, 1));
   font-weight: bold;
   color: $facade-text-strong;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   text-align: center;
 }
 .radar-wrap {
@@ -413,7 +413,7 @@ export default {
   height: 440rpx;
 }
 .dimension-list {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
 }
 .dim-card {
   background: $app-surface;
@@ -486,7 +486,7 @@ export default {
   color: $facade-text-muted;
 }
 .hd-empty {
-  padding: 100rpx 30rpx;
+  padding: 100rpx $uni-space-page;
   text-align: center;
 }
 .empty-tip {
@@ -501,7 +501,7 @@ export default {
   display: block;
 }
 .loading-wrap {
-  padding: 80rpx 30rpx;
+  padding: 80rpx $uni-space-page;
   text-align: center;
 }
 .loading-text {
@@ -549,7 +549,7 @@ export default {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 30rpx;
+  padding: $uni-space-page;
   border-bottom: 1px solid $facade-fill;
 }
 .modal-title {
@@ -563,10 +563,10 @@ export default {
   line-height: 1;
 }
 .modal-body {
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .form-item {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .form-label {
   font-size: calc(28rpx * var(--font-scale, 1));
@@ -592,7 +592,7 @@ export default {
 }
 .modal-footer {
   display: flex;
-  padding: 0 30rpx;
+  padding: 0 $uni-space-page;
   gap: 20rpx;
 }
 .btn-cancel {

cfc-frontend/pages/body-detail/health-report.vue

@@ -536,9 +536,9 @@ export default {
 /* ===== 报告头部 ===== */
 .report-header {
   background: linear-gradient(135deg, $mat-blue-tint, $mat-blue-light);
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   border-radius: 24rpx;
-  padding: 30rpx 24rpx;
+  padding: $uni-space-lg 24rpx;
 }
 .report-type-tag {
   display: inline-block;
@@ -613,7 +613,7 @@ export default {
 
 /* ===== 指标明细 ===== */
 .section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .section-title {
   display: flex;
@@ -631,7 +631,7 @@ export default {
   margin-left: 12rpx;
 }
 .category-group {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .category-header {
   display: flex;
@@ -750,7 +750,7 @@ export default {
 }
 
 .score-dashboard {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 24rpx;

cfc-frontend/pages/body-detail/index.vue

@@ -1178,7 +1178,7 @@ $c-tint-warm: #FFF5EE;
 
 /* ─── 月引导语 ─── */
 .dimension-portrait-section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 28rpx 24rpx;

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

@@ -200,7 +200,7 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
   background: $app-surface;
   border-radius: 24rpx;
   padding: 24rpx;

cfc-frontend/pages/butler/apply.vue

@@ -111,7 +111,7 @@ export default {
 
 <style lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }

cfc-frontend/pages/child/rewards.vue

@@ -141,9 +141,9 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.container { padding: 30rpx; padding-bottom: 120rpx; }
+.container { padding: $uni-space-lg; padding-bottom: 120rpx; }
 .exit-switch { background: $facade-fill-2; padding: 20rpx; border-radius: 8rpx; margin-bottom: 20rpx; text-align: center; color: $facade-text-body; font-size: calc(28rpx * var(--font-scale, 1)); }
-.reward-item { background: $app-surface; border-radius: 16rpx; padding: 30rpx; margin-bottom: 20rpx; }
+.reward-item { background: $app-surface; border-radius: 16rpx; padding: $uni-space-lg; margin-bottom: 20rpx; }
 .reward-title { font-size: calc(30rpx * var(--font-scale, 1)); color: $facade-text-strong; margin-bottom: 15rpx; }
 .reward-progress { width: 100%; }
 .progress-text { font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; display: block; margin-top: 8rpx; }
@@ -151,11 +151,11 @@ export default {
 .empty { text-align: center; color: $facade-text-muted; padding: 100rpx; }
 .modal-mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; }
 .modal { background: $app-surface; border-radius: 24rpx; padding: 40rpx; width: 80%; }
-.modal-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; margin-bottom: 30rpx; text-align: center; }
+.modal-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; margin-bottom: $uni-space-lg; text-align: center; }
 .form-item { margin-bottom: 20rpx; }
 .form-label { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-strong; margin-bottom: 10rpx; }
 .required { color: $brand-primary; }
 .form-tip { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; padding: 20rpx; background: $facade-fill-2; border-radius: 8rpx; margin-bottom: 20rpx; }
-.modal-btns { display: flex; gap: 20rpx; margin-top: 30rpx; }
+.modal-btns { display: flex; gap: 20rpx; margin-top: $uni-space-lg; }
 .modal-btns button { flex: 1; }
 </style>

cfc-frontend/pages/cognitive-hall.vue

@@ -183,7 +183,7 @@ $c-ink-night:    $app-ink-night;   // 深夜蓝黑（本页深色文字）
 }
 
 .header {
-  padding: 40rpx 30rpx 30rpx;
+  padding: 40rpx $uni-space-page $uni-space-lg;
   background: linear-gradient(135deg, $dim-wisdom 0%, $facade-violet 100%);
   color: $app-surface;
 }
@@ -202,13 +202,13 @@ $c-ink-night:    $app-ink-night;   // 深夜蓝黑（本页深色文字）
 }
 
 .member-selector {
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   background: $app-surface;
   margin: 20rpx 0;
 .member-selector .member-minimal { margin-top: 16rpx; }
   border-radius: 16rpx;
-  margin-left: 30rpx;
-  margin-right: 30rpx;
+  margin-left: $uni-space-lg;
+  margin-right: $uni-space-lg;
 }
 
 .selector-label {
@@ -218,7 +218,7 @@ $c-ink-night:    $app-ink-night;   // 深夜蓝黑（本页深色文字）
 
 
 .game-list {
-  padding: 0 30rpx;
+  padding: 0 $uni-space-page;
 }
 
 .game-card {
@@ -306,7 +306,7 @@ $c-ink-night:    $app-ink-night;   // 深夜蓝黑（本页深色文字）
 }
 
 .action-row {
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .btn {

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

@@ -315,7 +315,7 @@ export default {
   width: 100%;
   background: rgba(255, 255, 255, 0.06);
   border-radius: 24rpx;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   margin-bottom: 60rpx;
   box-sizing: border-box;
 }
@@ -371,7 +371,7 @@ export default {
 .question-card {
   background: rgba(255, 255, 255, 0.06);
   border-radius: 24rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   box-sizing: border-box;
 }
 .q-text {
@@ -431,7 +431,7 @@ export default {
   align-items: center;
   justify-content: center;
   box-shadow: 0 8rpx 40rpx rgba(255, 215, 0, 0.35);
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .score-value {
   font-size: calc(80rpx * var(--font-scale, 1));
@@ -448,7 +448,7 @@ export default {
   width: 100%;
   background: rgba(255, 255, 255, 0.06);
   border-radius: 24rpx;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   margin-bottom: 60rpx;
   box-sizing: border-box;
 }

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

@@ -339,7 +339,7 @@ export default {
 }
 
 .ghost-btn {
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
   width: 480rpx;
   height: 96rpx;
   line-height: 96rpx;
@@ -378,7 +378,7 @@ export default {
   font-size: calc(48rpx * var(--font-scale, 1));
   font-weight: bold;
   color: $app-surface;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .intro-desc {
   font-size: calc(30rpx * var(--font-scale, 1));

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

@@ -322,7 +322,7 @@ export default {
   width: 100%;
   background: rgba(255, 255, 255, 0.06);
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   margin-bottom: 80rpx;
   box-sizing: border-box;
 }
@@ -417,7 +417,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   box-sizing: border-box;
 }
 .option-selected {
@@ -475,7 +475,7 @@ export default {
 .score-detail {
   font-size: calc(28rpx * var(--font-scale, 1));
   color: rgba(255, 255, 255, 0.8);
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .dimension-tag {
   padding: 10rpx 32rpx;
@@ -497,7 +497,7 @@ export default {
   border-radius: 24rpx;
   font-size: calc(32rpx * var(--font-scale, 1));
   text-align: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   padding: 0;
 }
 .btn::after {

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

@@ -396,7 +396,7 @@ export default {
   font-size: calc(32rpx * var(--font-scale, 1));
   border-radius: 24rpx;
   border: 2rpx solid $brand-primary;
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 
 .btn-secondary::after {
@@ -409,7 +409,7 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 
 .round-text {
@@ -486,7 +486,7 @@ export default {
   background: $game-ink;
   border: 2rpx solid transparent;
   border-radius: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .choice-cell:active {

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

@@ -465,7 +465,7 @@ export default {
 .member-bar {
   display: flex;
   overflow-x: auto;
-  padding: 16rpx 30rpx 8rpx;
+  padding: 16rpx $uni-space-page 8rpx;
   background: $app-surface;
   border-bottom: 1rpx solid $facade-fill;
   gap: 16rpx;
@@ -488,7 +488,7 @@ export default {
 /* 模式切换（排序） */
 .mode-bar {
   display: flex;
-  padding: 16rpx 30rpx;
+  padding: 16rpx $uni-space-page;
   background: $app-surface;
   border-bottom: 1rpx solid $facade-fill;
   gap: 20rpx;
@@ -510,7 +510,7 @@ export default {
 /* 搜索栏 */
 .search-bar {
   display: flex;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   background-color: $app-surface;
 }
 .search-input {
@@ -534,7 +534,7 @@ export default {
   flex: 1;
   min-height: 0;
   overflow: hidden;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   box-sizing: border-box;
 }
 

cfc-frontend/pages/diet/meal-config.vue

@@ -216,14 +216,14 @@ export default {
   overflow: hidden;
 }
 .content {
-  padding: 30rpx;
+  padding: $uni-space-page;
   box-sizing: border-box;
   width: 100%;
   overflow: hidden;
 }
 .date-tabs {
   display: flex; background: $uni-border-color-light; border-radius: 999rpx;
-  padding: 6rpx; margin-bottom: 30rpx;
+  padding: 6rpx; margin-bottom: $uni-space-lg;
 }
 .tab-item {
   flex: 1; text-align: center; padding: 18rpx 0;
@@ -238,14 +238,14 @@ export default {
 .meal-section {
   background-color: $app-surface;
   border-radius: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   overflow: hidden;
   box-shadow: 0 4rpx 16rpx rgba(249, 115, 22, 0.08);
 }
 .meal-header {
   display: flex;
   align-items: center;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   border-bottom: 1rpx solid $uni-border-color-light;
 }
 .meal-icon-wrap { width: 72rpx; height: 72rpx; border-radius: 24rpx; display: flex; align-items: center; justify-content: center; margin-right: 16rpx; }
@@ -262,7 +262,7 @@ export default {
   display: flex;
   flex-wrap: wrap;
   gap: 20rpx;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
 }
 .member-item {
   box-sizing: border-box; position: relative;
@@ -337,8 +337,8 @@ export default {
   background-color: $app-surface;
   border: 2rpx dashed $brand-primary;
   border-radius: 24rpx;
-  padding: 24rpx 30rpx;
-  margin-bottom: 30rpx;
+  padding: 24rpx $uni-space-page;
+  margin-bottom: $uni-space-lg;
   transition: background-color 0.2s ease;
 }
 .add-member-entry:active {
@@ -362,8 +362,8 @@ export default {
 .tip-card { 
   background: $tint-sky-blue; 
   border-radius: 16rpx; 
-  padding: 24rpx 30rpx; 
-  margin-bottom: 30rpx; 
+  padding: 24rpx $uni-space-page; 
+  margin-bottom: $uni-space-lg; 
 }
 .tip-text { 
   font-size: calc(24rpx * var(--font-scale, 1)); 
@@ -371,7 +371,7 @@ export default {
   line-height: 1.6; 
 }
 .save-area {
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
 }
 .save-btn {
   background: linear-gradient(135deg, $brand-primary, $brand-primary-dark);

cfc-frontend/pages/diet/preferences.vue

@@ -399,7 +399,7 @@ $c-dp-footer-line: #FFE9D4; // 底部操作条描边
 }
 
 /* ===== 进度条 ===== */
-.progress-bar { padding: 30rpx 32rpx 10rpx; }
+.progress-bar { padding: $uni-space-lg 32rpx 10rpx; }
 .progress-track {
   height: 12rpx; background: $c-dp-track; border-radius: 8rpx; overflow: hidden;
 }
@@ -412,7 +412,7 @@ $c-dp-footer-line: #FFE9D4; // 底部操作条描边
 .progress-label-active { color: $dim-body; font-weight: 600; }
 
 /* ===== 内容 ===== */
-.content { flex: 1; padding: 10rpx 32rpx 30rpx; box-sizing: border-box; }
+.content { flex: 1; padding: 10rpx 32rpx $uni-space-lg; box-sizing: border-box; }
 .step-head { display: flex; align-items: center; margin: 20rpx 0 24rpx; }
 .step-icon { font-size: calc(52rpx * var(--font-scale, 1)); margin-right: 20rpx; }
 .step-head-text { display: flex; flex-direction: column; }
@@ -460,7 +460,7 @@ $c-dp-footer-line: #FFE9D4; // 底部操作条描边
 
 /* ===== 底栏 ===== */
 .footer-bar {
-  display: flex; padding: 20rpx 32rpx 30rpx; background: $c-dp-footer;
+  display: flex; padding: 20rpx 32rpx $uni-space-lg; background: $c-dp-footer;
   border-top: 2rpx solid $c-dp-footer-line;
 }
 .footer-btn {

cfc-frontend/pages/diet/recommendation.vue

@@ -268,7 +268,7 @@ export default {
 }
 .content {
   flex: 1;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .empty-state { display: flex; flex-direction: column; align-items: center; padding: 120rpx 40rpx; }
 .empty-icon-wrap {
@@ -291,14 +291,14 @@ export default {
   display: flex;
   background-color: $app-surface;
   border-radius: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
   overflow: hidden;
 }
 .card-accent { width: 8rpx; background: linear-gradient(180deg, $dim-body, $dim-body-light); flex-shrink: 0; }
 .card-body {
   flex: 1;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .card-title {
   font-size: calc(30rpx * var(--font-scale, 1));
@@ -334,11 +334,11 @@ export default {
 .meal-section {
   background-color: $app-surface;
   border-radius: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   overflow: hidden;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
 }
-.meal-header { display: flex; align-items: center; padding: 24rpx 30rpx; border-bottom: 1rpx solid #FDE8D0; }
+.meal-header { display: flex; align-items: center; padding: 24rpx $uni-space-page; border-bottom: 1rpx solid #FDE8D0; }
 .meal-icon-wrap { width: 64rpx; height: 64rpx; border-radius: 24rpx; display: flex; align-items: center; justify-content: center; margin-right: 16rpx; }
 .meal-icon-breakfast { background: linear-gradient(135deg, $dim-body-light, #FFD48A); }
 .meal-icon-lunch     { background: linear-gradient(135deg, $status-warning, $accent-amber-light); }
@@ -358,7 +358,7 @@ export default {
   color: $facade-text-muted;
 }
 .dish-list {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
 }
 .dish-item { padding: 24rpx; border-radius: 24rpx; background: $flat-bg; margin-bottom: 16rpx; }
 .dish-item:last-child { margin-bottom: 0; }
@@ -414,7 +414,7 @@ export default {
   margin-top: 4rpx;
 }
 .action-area {
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
 }
 .btn-row {
   display: flex;

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

@@ -197,10 +197,10 @@ export default {
 }
 .content {
   flex: 1;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .photo-section {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   border-radius: 24rpx;
   overflow: hidden;
 }
@@ -213,7 +213,7 @@ export default {
   display: flex;
   background-color: $app-surface;
   border-radius: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
   overflow: hidden;
 }
@@ -227,7 +227,7 @@ export default {
 }
 .card-body {
   flex: 1;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .card-title {
   font-size: calc(28rpx * var(--font-scale, 1));
@@ -300,7 +300,7 @@ export default {
 .action-area {
   display: flex;
   gap: 20rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
 }
 .btn-secondary {
   flex: 1;

cfc-frontend/pages/discover-detail/product-detail/product-detail.vue

@@ -853,7 +853,7 @@ export default {
 }
 .info-section {
   background: $app-surface;
-  padding: 30rpx;
+  padding: $uni-space-page;
   margin-bottom: 20rpx;
 }
 .name-row {
@@ -1003,7 +1003,7 @@ export default {
 .desc-section,
 .intro-section {
   background: $app-surface;
-  padding: 30rpx;
+  padding: $uni-space-page;
   margin-bottom: 20rpx;
 }
 .section-title {
@@ -1032,7 +1032,7 @@ export default {
 /* SKU 选择器 */
 .sku-section {
   background: $app-surface;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   margin-bottom: 20rpx;
 }
 .spec-group {
@@ -1113,7 +1113,7 @@ export default {
 /* 积分兑换优惠券 */
 .coupon-exchange-section {
   background: $app-surface;
-  padding: 30rpx;
+  padding: $uni-space-page;
   margin-bottom: 20rpx;
 }
 .coupon-item {
@@ -1175,7 +1175,7 @@ export default {
   border-top: 1rpx solid $facade-hairline-2;
   display: flex;
   align-items: center;
-  padding: 0 30rpx;
+  padding: 0 $uni-space-page;
   justify-content: space-between;
   z-index: 100;
 }

cfc-frontend/pages/discover/components/CircleDetail.vue

@@ -126,7 +126,7 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 40rpx 30rpx 20rpx;
+  padding: 40rpx $uni-space-page 20rpx;
   border-bottom: 1rpx solid $facade-fill;
 }
 .circle-modal-icon-wrap {
@@ -155,7 +155,7 @@ export default {
 .circle-modal-body {
   flex: 1;
   overflow-y: auto;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
 }
 .circle-modal-section {
   margin-bottom: 20rpx;
@@ -175,7 +175,7 @@ export default {
   color: $facade-text-ghost;
 }
 .circle-modal-footer {
-  padding: 20rpx 30rpx 30rpx;
+  padding: 20rpx $uni-space-page $uni-space-lg;
   border-top: 1rpx solid $facade-fill;
 }
 .circle-btn {

cfc-frontend/pages/discover/index.vue

@@ -253,7 +253,7 @@ export default {
 
 /* ===== 推荐 ===== */
 .recommend-section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .section-header {
   display: flex;
@@ -403,14 +403,14 @@ export default {
 
 /* ===== 家庭会员推荐卡片 ===== */
 .member-card {
-  margin: 20rpx 30rpx 0;
+  margin: 20rpx $uni-space-lg 0;
 }
 .member-card-bg {
   display: flex;
   align-items: center;
   background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
   border-radius: 24rpx;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
 }
 .member-card-icon {
   font-size: calc(48rpx * var(--font-scale, 1));
@@ -446,7 +446,7 @@ export default {
 
 /* ===== 推荐文章 ===== */
 .article-section {
-  margin: 20rpx 30rpx 0;
+  margin: 20rpx $uni-space-lg 0;
 }
 .article-list {
   display: flex;
@@ -504,7 +504,7 @@ export default {
 
 /* ===== 为何选择 ===== */
 .why-section {
-  margin: 30rpx;
+  margin: $uni-space-lg;
 }
 .feature-grid {
   display: flex;
@@ -543,7 +543,7 @@ export default {
 
 /* ===== 底部登录 ===== */
 .login-footer {
-  margin: 40rpx 30rpx;
+  margin: 40rpx $uni-space-lg;
   display: flex;
   flex-direction: column;
   align-items: center;

cfc-frontend/pages/energy/detail.vue

@@ -186,7 +186,7 @@ export default {
 
 /* ---- 流水 ---- */
 .logs-section {
-  padding: 30rpx 30rpx 0;
+  padding: $uni-space-lg $uni-space-page 0;
 }
 .section-header { margin-bottom: 20rpx; }
 .section-title { font-size: calc(28rpx * var(--font-scale, 1)); font-weight: bold; color: #8FC5E8; }

cfc-frontend/pages/energy/index.vue

@@ -440,8 +440,8 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
   height: 88rpx;
   padding-top: env(safe-area-inset-top);
   position: relative;
-  padding-left: 30rpx;
-  padding-right: 30rpx;
+  padding-left: $uni-space-page;
+  padding-right: $uni-space-page;
 }
 .nav-back {
   width: 60rpx;
@@ -518,8 +518,8 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
 }
 /* ===== 总览卡 ===== */
 .overview-card {
-  margin: 20rpx 30rpx;
-  padding: 30rpx;
+  margin: 20rpx $uni-space-lg;
+  padding: $uni-space-page;
   background: rgba(255,255,255,0.06);
   border-radius: 24rpx;
   border: 1rpx solid rgba(255,255,255,0.1);
@@ -527,7 +527,7 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
 .overview-header {
   display: flex;
   align-items: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .overview-avatar {
   width: 80rpx;
@@ -596,7 +596,7 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
 }
 /* ===== 雷达图 ===== */
 .section {
-  margin: 20rpx 30rpx;
+  margin: 20rpx $uni-space-lg;
 }
 .section-header {
   display: flex;
@@ -631,7 +631,7 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
 .compare-item {
   display: flex;
   align-items: center;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   border-bottom: 1rpx solid rgba(255,255,255,0.06);
   background: rgba(255,255,255,0.02);
 }
@@ -698,7 +698,7 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
   width: 100%;
   background: $c-energy-deep-2;
   border-radius: 24rpx 24rpx 0 0;
-  padding: 20rpx 30rpx 60rpx;
+  padding: 20rpx $uni-space-page 60rpx;
   max-height: 70vh;
   overflow-y: auto;
 }
@@ -717,7 +717,7 @@ $c-energy-deep-2: #1A2744; // 导航渐变终 / 卡片底（藏蓝）
   border-bottom: 1rpx solid rgba(255,255,255,0.06);
 }
 .picker-item:last-child { border-bottom: none; }
-.picker-item.active { background: rgba(102,126,234,0.1); margin: 0 -30rpx; padding-left: 30rpx; padding-right: 30rpx; border-radius: 16rpx; }
+.picker-item.active { background: rgba(102,126,234,0.1); margin: 0 -$uni-space-lg; padding-left: $uni-space-page; padding-right: $uni-space-page; border-radius: 16rpx; }
 .picker-icon { font-size: calc(36rpx * var(--font-scale, 1)); margin-right: 20rpx; }
 .picker-avatar {
   width: 64rpx;

cfc-frontend/pages/family/add-member.vue

@@ -369,10 +369,10 @@ this.submitting = false
 </script>
 
 <style scoped lang="scss">
-.container { padding: 30rpx; }
-.form-container { background: $app-surface; border-radius: 24rpx; padding: 30rpx; }
-.page-title { font-size: calc(34rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; margin-bottom: 30rpx; }
-.form-item { margin-bottom: 30rpx; }
+.container { padding: $uni-space-lg; }
+.form-container { background: $app-surface; border-radius: 24rpx; padding: $uni-space-lg; }
+.page-title { font-size: calc(34rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; margin-bottom: $uni-space-lg; }
+.form-item { margin-bottom: $uni-space-lg; }
 .form-item.required .label { font-weight: bold; }
 .admin-row { display: flex; align-items: center; justify-content: space-between; }
 .admin-row-text { font-size: calc(30rpx * var(--font-scale, 1)); color: $facade-text-strong; }

cfc-frontend/pages/family/address-edit.vue

@@ -122,7 +122,7 @@ export default {
   font-size: calc(36rpx * var(--font-scale, 1));
   font-weight: bold;
   color: $facade-text-strong;
-  padding: 30rpx 0;
+  padding: $uni-space-lg 0;
 }
 
 .form-section {

cfc-frontend/pages/family/manual-score-entry.vue

@@ -105,31 +105,31 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.mse-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx 30rpx 120rpx; box-sizing: border-box }
+.mse-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx $uni-space-page 120rpx; box-sizing: border-box }
 .mse-loading { display: flex; justify-content: center; align-items: center; height: 50vh }
 .mse-loading-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted }
-.mse-hero { text-align: center; padding: 40rpx 0 20rpx }
-.mse-hero-title { font-size: calc(36rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; display: block; margin-bottom: 8rpx }
+.mse-hero { text-align: center; padding: 40rpx 0 20rpx}
+.mse-hero-title { font-size: calc(36rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; display: block; margin-bottom: 8rpx}
 .mse-hero-desc { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; display: block }
 .mse-section { background: $app-surface; border-radius: 24rpx; padding: 24rpx; margin-bottom: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05) }
 .mse-section-title { font-size: calc(28rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; margin-bottom: 20rpx; display: block }
-.mse-member-list { display: flex; overflow-x: auto; gap: 20rpx; padding-bottom: 10rpx }
+.mse-member-list { display: flex; overflow-x: auto; gap: 20rpx; padding-bottom: 10rpx}
 .mse-member-item { flex: 0 0 140rpx; display: flex; flex-direction: column; align-items: center; border: 4rpx solid transparent; border-radius: 24rpx; padding: 16rpx 10rpx; transition: border-color .2s }
 .mse-member-item.active { border-color: $brand-primary }
-.mse-member-avatar { width: 80rpx; height: 80rpx; border-radius: 50%; margin-bottom: 12rpx }
+.mse-member-avatar { width: 80rpx; height: 80rpx; border-radius: 50%; margin-bottom: 12rpx}
 .mse-member-name { font-size: calc(26rpx * var(--font-scale, 1)); font-weight: 500; color: $facade-text-strong; text-align: center; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
 .mse-member-role { font-size: calc(20rpx * var(--font-scale, 1)); padding: 2rpx 10rpx; border-radius: 8rpx; display: inline-block }
 .role-parent { background: $uni-primary-pale; color: $mat-orange-strong }
 .role-child { background: $mat-green-tint; color: $mat-green-strong }
 .role-teacher { background: $accent-indigo-tint; color: $dim-wisdom-ink }
 .mse-member-check { margin-top: 8rpx; font-size: calc(24rpx * var(--font-scale, 1)); color: $brand-primary }
-.mse-slider-item { margin-bottom: 28rpx }
-.mse-slider-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8rpx }
-.mse-slider-dot { width: 16rpx; height: 16rpx; border-radius: 50%; margin-right: 10rpx }
+.mse-slider-item { margin-bottom: 28rpx}
+.mse-slider-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8rpx}
+.mse-slider-dot { width: 16rpx; height: 16rpx; border-radius: 50%; margin-right: 10rpx}
 .mse-slider-label { font-size: calc(28rpx * var(--font-scale, 1)); font-weight: 500; flex: 1 }
 .mse-slider-value { font-size: calc(28rpx * var(--font-scale, 1)); font-weight: 700; color: $facade-text-strong }
 .mse-slider { width: 100% }
-.mse-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx 30rpx; background: $app-surface; border-top: 1rpx solid $facade-fill; box-sizing: border-box }
+.mse-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx $uni-space-page; background: $app-surface; border-top: 1rpx solid $facade-fill; box-sizing: border-box }
 .mse-btn { width: 100%; height: 88rpx; line-height: 88rpx; font-size: calc(30rpx * var(--font-scale, 1)); border-radius: 24rpx; border: none; text-align: center }
 .mse-btn-primary { background: linear-gradient(135deg, $brand-primary, $dim-body); color: $app-surface; font-weight: 600 }
 </style>

cfc-frontend/pages/family/mbti-entry.vue

@@ -74,25 +74,25 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.mbe-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx 30rpx 120rpx; box-sizing: border-box }
+.mbe-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx $uni-space-page 120rpx; box-sizing: border-box }
 .mbe-loading { display: flex; justify-content: center; align-items: center; height: 50vh }
 .mbe-loading-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted }
-.mbe-hero { text-align: center; padding: 40rpx 0 10rpx }
-.mbe-hero-title { font-size: calc(36rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; display: block; margin-bottom: 8rpx }
+.mbe-hero { text-align: center; padding: 40rpx 0 10rpx}
+.mbe-hero-title { font-size: calc(36rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; display: block; margin-bottom: 8rpx}
 .mbe-hero-desc { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; display: block }
 .mbe-section { background: $app-surface; border-radius: 24rpx; padding: 24rpx; margin-bottom: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05) }
 .mbe-section-title { font-size: calc(28rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; margin-bottom: 20rpx; display: block }
-.mbe-member-list { display: flex; overflow-x: auto; gap: 20rpx; padding-bottom: 10rpx }
+.mbe-member-list { display: flex; overflow-x: auto; gap: 20rpx; padding-bottom: 10rpx}
 .mbe-member-item { flex: 0 0 140rpx; display: flex; flex-direction: column; align-items: center; border: 4rpx solid transparent; border-radius: 24rpx; padding: 16rpx 10rpx; transition: border-color .2s }
 .mbe-member-item.active { border-color: $dim-wisdom }
-.mbe-member-avatar { width: 80rpx; height: 80rpx; border-radius: 50%; margin-bottom: 12rpx }
+.mbe-member-avatar { width: 80rpx; height: 80rpx; border-radius: 50%; margin-bottom: 12rpx}
 .mbe-member-name { font-size: calc(26rpx * var(--font-scale, 1)); font-weight: 500; color: $facade-text-strong; text-align: center; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
 .mbe-member-role { font-size: calc(20rpx * var(--font-scale, 1)); padding: 2rpx 10rpx; border-radius: 8rpx; display: inline-block }
 .role-parent { background: $uni-primary-pale; color: $mat-orange-strong }
 .role-child { background: $mat-green-tint; color: $mat-green-strong }
 .role-teacher { background: $accent-indigo-tint; color: $dim-wisdom-ink }
 .mbe-member-check { margin-top: 8rpx; font-size: calc(24rpx * var(--font-scale, 1)); color: $dim-wisdom }
-.mbe-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx 30rpx; background: $app-surface; border-top: 1rpx solid $facade-fill; box-sizing: border-box }
+.mbe-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx $uni-space-page; background: $app-surface; border-top: 1rpx solid $facade-fill; box-sizing: border-box }
 .mbe-btn { width: 100%; height: 88rpx; line-height: 88rpx; font-size: calc(30rpx * var(--font-scale, 1)); border-radius: 24rpx; border: none; text-align: center }
 .mbe-btn-primary { background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); color: $app-surface; font-weight: 600 }
 .mbe-tip { display: block; text-align: center; margin-top: 16rpx; font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted }

cfc-frontend/pages/family/mbti-profile.vue

@@ -99,25 +99,25 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.mbp-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx 30rpx 120rpx; box-sizing: border-box }
-.mbp-header { text-align: center; padding: 20rpx 0 10rpx }
+.mbp-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx $uni-space-page 120rpx; box-sizing: border-box }
+.mbp-header { text-align: center; padding: 20rpx 0 10rpx}
 .mbp-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; display: block }
-.mbp-subtitle { font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; display: block; margin-top: 4rpx }
-.mbp-grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16rpx }
+.mbp-subtitle { font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; display: block; margin-top: 4rpx}
+.mbp-grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16rpx}
 .mbp-card { width: 48%; background: $app-surface; border-radius: 24rpx; padding: 20rpx 10rpx; display: flex; flex-direction: column; align-items: center; border: 2rpx solid transparent; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05); transition: border-color .2s }
 .mbp-card:active { transform: scale(0.98) }
 .mbp-card-active { border-color: $dim-wisdom }
-.mbp-card-code { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 700; color: $dim-wisdom; margin-bottom: 4rpx }
-.mbp-card-name { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-strong; margin-bottom: 8rpx }
+.mbp-card-code { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 700; color: $dim-wisdom; margin-bottom: 4rpx}
+.mbp-card-name { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-strong; margin-bottom: 8rpx}
 .mbp-card-tag { font-size: calc(20rpx * var(--font-scale, 1)); color: $app-surface; padding: 2rpx 10rpx; border-radius: 8rpx }
 .mbp-drawer { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 100; display: flex; align-items: flex-end }
 .mbp-drawer-content { width: 100%; max-height: 80vh; background: $app-surface; border-radius: 24rpx 24rpx 0 0; display: flex; flex-direction: column }
-.mbp-drawer-header { padding: 30rpx 20rpx; background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); color: $app-surface; display: flex; flex-direction: column; align-items: center }
+.mbp-drawer-header { padding: $uni-space-lg 20rpx; background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); color: $app-surface; display: flex; flex-direction: column; align-items: center }
 .mbp-drawer-code { font-size: calc(60rpx * var(--font-scale, 1)); font-weight: 700; letter-spacing: 8rpx }
-.mbp-drawer-name { font-size: calc(28rpx * var(--font-scale, 1)); opacity: 0.9; margin-top: 4rpx }
-.mbp-drawer-body { flex: 1; overflow-y: auto; padding: 20rpx }
-.mbp-drawer-section { margin-bottom: 24rpx }
-.mbp-drawer-label { display: block; font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; font-weight: 600; margin-bottom: 8rpx }
+.mbp-drawer-name { font-size: calc(28rpx * var(--font-scale, 1)); opacity: 0.9; margin-top: 4rpx}
+.mbp-drawer-body { flex: 1; overflow-y: auto; padding: 20rpx}
+.mbp-drawer-section { margin-bottom: 24rpx}
+.mbp-drawer-label { display: block; font-size: calc(22rpx * var(--font-scale, 1)); color: $facade-text-muted; font-weight: 600; margin-bottom: 8rpx}
 .mbp-drawer-value { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-strong; line-height: 1.6 }
 .mbp-energy-mini { display: flex; flex-direction: column; gap: 8rpx; margin-top: 8rpx; padding: 16rpx; background: $facade-fill-blue-ghost; border-radius: 16rpx }
 .mbp-energy-dim { font-size: calc(24rpx * var(--font-scale, 1)); font-weight: 600 }

cfc-frontend/pages/family/mbti-result.vue

@@ -164,29 +164,29 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.mbr-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx 30rpx 120rpx; box-sizing: border-box }
+.mbr-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding: 24rpx $uni-space-page 120rpx; box-sizing: border-box }
 .mbr-loading { display: flex; justify-content: center; align-items: center; height: 50vh }
-.mbr-hero { border-radius: 24rpx; padding: 40rpx 30rpx; margin-bottom: 24rpx; background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); box-shadow: 0 6rpx 20rpx rgba(99,102,241,0.25) }
+.mbr-hero { border-radius: 24rpx; padding: 40rpx $uni-space-page; margin-bottom: 24rpx; background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); box-shadow: 0 6rpx 20rpx rgba(99,102,241,0.25) }
 .mbr-hero-inner { display: flex; flex-direction: column; align-items: center }
 .mbr-type-code { font-size: calc(88rpx * var(--font-scale, 1)); font-weight: 700; color: $app-surface; letter-spacing: 8rpx }
-.mbr-type-name { font-size: calc(32rpx * var(--font-scale, 1)); color: rgba(255,255,255,0.9); margin-top: 8rpx }
+.mbr-type-name { font-size: calc(32rpx * var(--font-scale, 1)); color: rgba(255,255,255,0.9); margin-top: 8rpx}
 .mbr-type-desc { font-size: calc(24rpx * var(--font-scale, 1)); color: rgba(255,255,255,0.8); margin-top: 16rpx; text-align: center; max-width: 600rpx }
-.mbr-section { background: $app-surface; border-radius: 24rpx; padding: 30rpx 26rpx; margin-bottom: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05) }
-.mbr-section-title { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; margin-bottom: 20rpx }
+.mbr-section { background: $app-surface; border-radius: 24rpx; padding: $uni-space-lg 26rpx; margin-bottom: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05) }
+.mbr-section-title { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 600; color: $facade-text-strong; margin-bottom: 20rpx}
 .mbr-canvas-wrap { display: flex; justify-content: center }
 .mbr-canvas { width: 340px; height: 340px }
 .mbr-profile-list { display: flex; flex-direction: column }
 .mbr-profile-item { padding: 20rpx 0; border-top: 1rpx solid $facade-fill }
 .mbr-profile-item:first-child { border-top: none }
-.mbr-profile-label { display: block; font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: 8rpx }
+.mbr-profile-label { display: block; font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: 8rpx}
 .mbr-profile-value { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-strong; line-height: 1.5 }
-.mbr-energy-list { display: flex; flex-direction: column; gap: 16rpx }
+.mbr-energy-list { display: flex; flex-direction: column; gap: 16rpx}
 .mbr-energy-item { padding: 20rpx; background: $facade-fill-blue-ghost; border-radius: 16rpx }
-.mbr-energy-head { display: flex; align-items: center; margin-bottom: 8rpx }
-.mbr-energy-dot { width: 16rpx; height: 16rpx; border-radius: 50%; margin-right: 10rpx }
+.mbr-energy-head { display: flex; align-items: center; margin-bottom: 8rpx}
+.mbr-energy-dot { width: 16rpx; height: 16rpx; border-radius: 50%; margin-right: 10rpx}
 .mbr-energy-label { font-size: calc(26rpx * var(--font-scale, 1)); font-weight: 600 }
 .mbr-energy-text { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-deep; line-height: 1.5 }
-.mbr-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx 30rpx; background: $app-surface; border-top: 1rpx solid $facade-fill; display: flex; gap: 20rpx; box-sizing: border-box }
+.mbr-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx $uni-space-page; background: $app-surface; border-top: 1rpx solid $facade-fill; display: flex; gap: 20rpx; box-sizing: border-box }
 .mbr-btn { flex: 1; height: 88rpx; line-height: 88rpx; font-size: calc(30rpx * var(--font-scale, 1)); border-radius: 24rpx; border: none; text-align: center }
 .mbr-btn-primary { background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); color: $app-surface; font-weight: 600 }
 .mbr-btn-outline { background: $app-surface; color: $dim-wisdom; border: 2rpx solid $dim-wisdom }

cfc-frontend/pages/family/mbti-test.vue

@@ -108,22 +108,22 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.mbt-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding-bottom: 180rpx }
-.mbt-header { padding: 20rpx 30rpx; text-align: right }
+.mbt-page { min-height: 100vh; background: $facade-fill-blue-ghost; padding-bottom: 180rpx}
+.mbt-header { padding: 20rpx $uni-space-page; text-align: right }
 .mbt-progress-text { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted }
-.mbt-progress-bar { height: 6rpx; background: $accent-indigo-tint; margin: 0 30rpx; border-radius: 8rpx; overflow: hidden }
+.mbt-progress-bar { height: 6rpx; background: $accent-indigo-tint; margin: 0 $uni-space-lg; border-radius: 8rpx; overflow: hidden }
 .mbt-progress-fill { height: 100%; background: $dim-wisdom; transition: width .3s }
-.mbt-loading { display: flex; justify-content: center; padding: 100rpx 0 }
-.mbt-card { background: $app-surface; margin: 20rpx 30rpx; border-radius: 24rpx; padding: 30rpx 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05) }
-.mbt-dim-tag { display: inline-block; font-size: calc(22rpx * var(--font-scale, 1)); color: $app-surface; padding: 4rpx 16rpx; border-radius: 16rpx; margin-bottom: 16rpx }
-.mbt-q-text { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 500; color: $facade-text-strong; line-height: 1.5; margin-bottom: 24rpx }
-.mbt-opts { display: flex; flex-direction: column; gap: 16rpx }
+.mbt-loading { display: flex; justify-content: center; padding: 100rpx 0}
+.mbt-card { background: $app-surface; margin: 20rpx $uni-space-lg; border-radius: 24rpx; padding: $uni-space-lg 24rpx; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.05) }
+.mbt-dim-tag { display: inline-block; font-size: calc(22rpx * var(--font-scale, 1)); color: $app-surface; padding: 4rpx 16rpx; border-radius: 16rpx; margin-bottom: 16rpx}
+.mbt-q-text { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 500; color: $facade-text-strong; line-height: 1.5; margin-bottom: 24rpx}
+.mbt-opts { display: flex; flex-direction: column; gap: 16rpx}
 .mbt-opt { flex: 1; padding: 24rpx; border: 2rpx solid $facade-fill; border-radius: 16rpx; display: flex; align-items: center; justify-content: space-between; transition: border-color .2s, background .2s }
 .mbt-opt-sel { border-color: $dim-wisdom; background: $dim-wisdom-tint-3 }
 .mbt-opt-label { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-strong; line-height: 1.4 }
 .mbt-opt-radio { width: 24rpx; height: 24rpx; border: 2rpx solid $app-border-strong; border-radius: 50%; flex-shrink: 0 }
 .mbt-opt-radio.on { background: $dim-wisdom; border-color: $dim-wisdom }
-.mbt-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx 30rpx; background: $app-surface; border-top: 1rpx solid $facade-fill; display: flex; gap: 20rpx; box-sizing: border-box }
+.mbt-footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx $uni-space-page; background: $app-surface; border-top: 1rpx solid $facade-fill; display: flex; gap: 20rpx; box-sizing: border-box }
 .mbt-btn { flex: 1; height: 88rpx; line-height: 88rpx; font-size: calc(30rpx * var(--font-scale, 1)); border-radius: 24rpx; border: none; text-align: center }
 .mbt-btn-prev { background: $app-surface; color: $dim-wisdom; border: 2rpx solid $dim-wisdom }
 .mbt-btn-next { background: linear-gradient(135deg, $dim-wisdom, $dim-wisdom-light); color: $app-surface; font-weight: 600 }

cfc-frontend/pages/family/self-check-ai.vue

@@ -244,13 +244,13 @@ export default {
 .sc-page {
   min-height: 100vh;
   background: $facade-fill-blue-ghost;
-  padding: 24rpx 30rpx 120rpx;
+  padding: 24rpx $uni-space-page 120rpx;
   box-sizing: border-box;
 }
 
 /* Hero */
 .sc-hero {
-  padding: 30rpx 10rpx 20rpx;
+  padding: $uni-space-lg 10rpx 20rpx;
 }
 .sc-hero-badge {
   display: inline-block;
@@ -388,7 +388,7 @@ export default {
   height: 10rpx;
   background: $facade-gray-200;
   border-radius: 8rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   overflow: hidden;
 }
 .sc-progress-fill {
@@ -400,7 +400,7 @@ export default {
 
 /* Section */
 .sc-section {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .sc-section-header {
   display: flex;
@@ -513,7 +513,7 @@ export default {
   left: 0;
   right: 0;
   background: $app-surface;
-  padding: 24rpx 30rpx;
+  padding: 24rpx $uni-space-page;
   padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
   box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.08);
 }

cfc-frontend/pages/family/self-check-entry.vue

@@ -188,7 +188,7 @@ export default {
 .sce-page {
   min-height: 100vh;
   background: $facade-fill-blue-ghost;
-  padding: 24rpx 30rpx 120rpx;
+  padding: 24rpx $uni-space-page 120rpx;
   box-sizing: border-box;
 }
 .sce-loading {
@@ -204,7 +204,7 @@ export default {
 .sce-hero {
   background: linear-gradient(135deg, $brand-primary, $dim-body);
   border-radius: 24rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   margin-bottom: 24rpx;
   box-shadow: 0 6rpx 20rpx rgba(249, 114, 22, 0.25);
 }
@@ -242,7 +242,7 @@ export default {
 .sce-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx 26rpx;
+  padding: $uni-space-lg 26rpx;
   margin-bottom: 24rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
 }
@@ -354,7 +354,7 @@ export default {
 .sce-trend {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx 26rpx;
+  padding: $uni-space-lg 26rpx;
   margin-bottom: 24rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
 }

cfc-frontend/pages/family/self-check-result.vue

@@ -329,7 +329,7 @@ export default {
 .scr-page {
   min-height: 100vh;
   background: $facade-fill-blue-ghost;
-  padding: 24rpx 30rpx 120rpx;
+  padding: 24rpx $uni-space-page 120rpx;
   box-sizing: border-box;
 }
 .scr-loading {
@@ -347,7 +347,7 @@ export default {
 .scr-hero {
   background: linear-gradient(135deg, $brand-primary, $dim-body);
   border-radius: 24rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
   margin-bottom: 24rpx;
   box-shadow: 0 6rpx 20rpx rgba(249, 114, 22, 0.25);
 }
@@ -398,7 +398,7 @@ export default {
 .scr-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx 26rpx;
+  padding: $uni-space-lg 26rpx;
   margin-bottom: 24rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
 }
@@ -496,7 +496,7 @@ export default {
 .scr-guide {
   background: $uni-primary-pale;
   border-radius: 24rpx;
-  padding: 30rpx 26rpx;
+  padding: $uni-space-lg 26rpx;
   margin-bottom: 24rpx;
   box-shadow: 0 2rpx 12rpx rgba(249, 114, 22, 0.08);
 }
@@ -730,7 +730,7 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 30rpx 0;
+  padding: $uni-space-lg 0;
 }
 .scr-all-healthy-icon {
   font-size: calc(72rpx * var(--font-scale, 1));

cfc-frontend/pages/family/self-check.vue

@@ -210,11 +210,11 @@ export default {
 .sc-page {
   min-height: 100vh;
   background: $facade-fill-blue-ghost;
-  padding: 24rpx 30rpx 120rpx;
+  padding: 24rpx $uni-space-page 120rpx;
   box-sizing: border-box;
 }
 .sc-hero {
-  padding: 30rpx 10rpx 20rpx;
+  padding: $uni-space-lg 10rpx 20rpx;
 }
 .sc-hero-title {
   display: block;
@@ -302,7 +302,7 @@ export default {
   height: 10rpx;
   background: $facade-fill-4;
   border-radius: 8rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   overflow: hidden;
 }
 .sc-progress-fill {
@@ -314,7 +314,7 @@ export default {
 
 /* 维度分组 */
 .sc-section {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .sc-section-header {
   display: flex;
@@ -352,7 +352,7 @@ export default {
 .sc-question {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx 26rpx 26rpx;
+  padding: $uni-space-lg 26rpx 26rpx;
   margin-bottom: 16rpx;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
 }

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

@@ -207,7 +207,7 @@ export default {
 .game-container {
   min-height: 100vh;
   background: linear-gradient(135deg, $app-ink-night 0%, $app-ink-night-2 100%);
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .game-header {
   text-align: center;
@@ -225,9 +225,9 @@ export default {
 }
 .instructions {
   background: rgba(255,255,255,0.1);
-  padding: 30rpx;
+  padding: $uni-space-page;
   border-radius: 16rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .info-text {
   color: $text-ghost-soft;
@@ -236,7 +236,7 @@ export default {
   margin-bottom: 10rpx;
 }
 .input-area {
-  margin: 30rpx 0;
+  margin: $uni-space-lg 0;
 }
 .guess-input {
   background: rgba(255,255,255,0.1);
@@ -258,7 +258,7 @@ export default {
   background: rgba(255,255,255,0.05);
   padding: 20rpx;
   border-radius: 16rpx;
-  margin: 30rpx 0;
+  margin: $uni-space-lg 0;
 }
 .history-title {
   color: $facade-text-faint;
@@ -293,7 +293,7 @@ export default {
   font-size: calc(48rpx * var(--font-scale, 1));
   color: $accent-yellow-light;
   display: block;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .result-info, .result-score {
   color: $app-surface;
@@ -305,6 +305,6 @@ export default {
   background: $flat-teal;
   color: $app-ink-night;
   padding: 20rpx 60rpx;
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 </style>

cfc-frontend/pages/games/list.vue

@@ -86,7 +86,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: linear-gradient(135deg, $app-ink-night 0%, $app-ink-night-2 100%);
   min-height: 100vh;
 }
@@ -134,13 +134,13 @@ export default {
 .game-list {
   display: flex;
   flex-direction: column;
-  gap: 30rpx;
+  gap: $uni-space-lg;
 }
 
 .game-card {
   background: linear-gradient(135deg, $game-ink 0%, #1a1a3a 100%);
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   display: flex;
   align-items: center;
   box-shadow: 0 8rpx 16rpx rgba(0,0,0,0.3);
@@ -156,7 +156,7 @@ export default {
   justify-content: center;
   background: rgba(255,255,255,0.1);
   border-radius: 24rpx;
-  margin-right: 30rpx;
+  margin-right: $uni-space-lg;
 }
 
 .game-info {
@@ -180,7 +180,7 @@ export default {
 
 .game-meta {
   display: flex;
-  gap: 30rpx;
+  gap: $uni-space-lg;
 }
 
 .duration, .points {

cfc-frontend/pages/games/records.vue

@@ -141,7 +141,7 @@ export default {
 .header {
   display: flex;
   align-items: center;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   background: $app-surface;
   border-bottom: 1rpx solid $facade-fill;
 }
@@ -157,7 +157,7 @@ export default {
 }
 .filter-bar {
   display: flex;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   gap: 16rpx;
   background: $app-surface;
 }
@@ -174,7 +174,7 @@ export default {
 }
 .loading-state, .empty-state {
   text-align: center;
-  padding: 120rpx 30rpx;
+  padding: 120rpx $uni-space-page;
 }
 .empty-text {
   display: block;
@@ -188,7 +188,7 @@ export default {
   color: $facade-text-ghost;
 }
 .record-list {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
 }
 .record-card {
   display: flex;
@@ -236,7 +236,7 @@ export default {
 }
 .load-more {
   text-align: center;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .load-text {
   font-size: calc(26rpx * var(--font-scale, 1));

cfc-frontend/pages/games/schulte.vue

@@ -184,7 +184,7 @@ export default {
 .game-container {
   min-height: 100vh;
   background: linear-gradient(135deg, $app-ink-night 0%, $app-ink-night-2 100%);
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .game-header {
@@ -280,7 +280,7 @@ export default {
   display: block;
   font-size: calc(48rpx * var(--font-scale, 1));
   color: $accent-yellow-light;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .result-score {
@@ -296,6 +296,6 @@ export default {
   padding: 20rpx 60rpx;
   border-radius: 24rpx;
   border: none;
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 </style>

cfc-frontend/pages/games/stats.vue

@@ -151,7 +151,7 @@ export default {
 .header {
   display: flex;
   align-items: center;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   background: $app-surface;
   border-bottom: 1rpx solid $facade-fill;
 }
@@ -167,12 +167,12 @@ export default {
 }
 .loading-state {
   text-align: center;
-  padding: 120rpx 30rpx;
+  padding: 120rpx $uni-space-page;
   font-size: calc(28rpx * var(--font-scale, 1));
   color: $facade-text-muted;
 }
 .overview-section {
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 .overview-card {
   display: flex;
@@ -197,7 +197,7 @@ export default {
   color: rgba(255,255,255,0.8);
 }
 .section {
-  margin: 0 30rpx 30rpx;
+  margin: 0 $uni-space-lg $uni-space-xl;
 }
 .section-title {
   display: block;
@@ -263,7 +263,7 @@ export default {
 .lb-item {
   display: flex;
   align-items: center;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   border-bottom: 1rpx solid $facade-fill;
 }
 .lb-item:last-child {
@@ -290,7 +290,7 @@ export default {
 }
 .no-data {
   text-align: center;
-  padding: 60rpx 30rpx;
+  padding: 60rpx $uni-space-page;
   font-size: calc(26rpx * var(--font-scale, 1));
   color: $facade-text-muted;
   background: $app-surface;

cfc-frontend/pages/games/sudoku.vue

@@ -325,12 +325,12 @@ export default {
 .game-container {
   min-height: 100vh;
   background: linear-gradient(135deg, $app-ink-night 0%, $app-ink-night-2 100%);
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .game-header {
   text-align: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .game-title {
@@ -350,7 +350,7 @@ export default {
   display: flex;
   justify-content: center;
   gap: 20rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .level-btn {
@@ -463,7 +463,7 @@ export default {
   display: block;
   font-size: calc(48rpx * var(--font-scale, 1));
   color: $accent-yellow-light;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .result-score {
@@ -479,6 +479,6 @@ export default {
   padding: 20rpx 60rpx;
   border-radius: 24rpx;
   border: none;
-  margin-top: 30rpx;
+  margin-top: $uni-space-lg;
 }
 </style>

cfc-frontend/pages/growth/assessment-result.vue

@@ -102,7 +102,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
@@ -134,7 +134,7 @@ export default {
 .score-card, .section-card, .meta-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   margin-bottom: 20rpx;
 }
 .card-title {

cfc-frontend/pages/growth/caution-detail.vue

@@ -262,7 +262,7 @@ export default {
   display: flex;
   align-items: center;
   gap: 12rpx;
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   background: #FFF3CD;
   border-bottom: 1rpx solid #FFECB5;
 }
@@ -271,7 +271,7 @@ export default {
 
 
 .content {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   height: calc(100vh - 160rpx);
 }
 

cfc-frontend/pages/growth/create.vue

@@ -247,13 +247,13 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
 .header {
   text-align: center;
-  padding: 40rpx 0 30rpx;
+  padding: 40rpx 0 $uni-space-lg;
 }
 .title {
   font-size: calc(40rpx * var(--font-scale, 1));
@@ -269,7 +269,7 @@ export default {
 .source-type-section {
   display: flex;
   gap: 16rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .source-card {
   flex: 1;
@@ -303,10 +303,10 @@ export default {
 .form {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
 }
 .form-item {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .form-row {
   display: flex;
@@ -379,13 +379,13 @@ export default {
 .redirect-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 40rpx 30rpx;
+  padding: 40rpx $uni-space-page;
 }
 .redirect-desc {
   font-size: calc(28rpx * var(--font-scale, 1));
   color: $facade-text-body;
   line-height: 1.6;
   display: block;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 </style>

cfc-frontend/pages/growth/detail.vue

@@ -277,7 +277,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
@@ -290,7 +290,7 @@ export default {
 .header-card {
   background: linear-gradient(135deg, $accent-indigo 0%, $accent-indigo-deep 100%);
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   margin-bottom: 20rpx;
 }
 .header-top {
@@ -338,7 +338,7 @@ export default {
 .info-card, .section-card {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
   margin-bottom: 20rpx;
 }
 .card-title {
@@ -463,7 +463,7 @@ export default {
   -webkit-box-orient: vertical;
 }
 .footer-actions {
-  padding: 30rpx 0;
+  padding: $uni-space-lg 0;
 }
 .btn-supplement {
   width: 100%;

cfc-frontend/pages/growth/sleep-checkin.vue

@@ -692,7 +692,7 @@ $c-rose-400:      #FB7185; // 差质量徽章渐变起点（rose-400，全局 da
   color: $uni-text-color;
 }
 .card-hint { font-size: calc(22rpx * var(--font-scale, 1)); color: $app-text-subtle; }
-.card-body { padding: 4rpx 28rpx 30rpx; }
+.card-body { padding: 4rpx 28rpx $uni-space-lg; }
 
 /* ===== 睡眠质量 ===== */
 .quality-head {

cfc-frontend/pages/growth/supplement.vue

@@ -182,13 +182,13 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
 .header {
   text-align: center;
-  padding: 40rpx 0 30rpx;
+  padding: 40rpx 0 $uni-space-lg;
 }
 .title {
   font-size: calc(40rpx * var(--font-scale, 1));
@@ -204,10 +204,10 @@ export default {
 .form {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
 }
 .form-item {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .label {
   font-size: calc(28rpx * var(--font-scale, 1));
@@ -278,7 +278,7 @@ export default {
   background: $dim-wisdom-tint-5;
   border-radius: 16rpx;
   padding: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .preview-row {
   display: flex;

cfc-frontend/pages/growth/upload.vue

@@ -294,13 +294,13 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
 .header {
   text-align: center;
-  padding: 40rpx 0 30rpx;
+  padding: 40rpx 0 $uni-space-lg;
 }
 .title {
   font-size: calc(40rpx * var(--font-scale, 1));
@@ -316,10 +316,10 @@ export default {
 .form {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
+  padding: $uni-space-lg;
 }
 .form-item {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .label {
   font-size: calc(28rpx * var(--font-scale, 1));
@@ -394,7 +394,7 @@ export default {
   background: $dim-wisdom-tint-5;
   border-radius: 16rpx;
   padding: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 .preview-row {
   display: flex;
@@ -451,7 +451,7 @@ export default {
   background: $tint-sky-soft;
   border-radius: 16rpx;
   padding: 24rpx;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
   border: 2rpx solid $tint-sky-line;
 }
 .purchase-header {

cfc-frontend/pages/guide/activities/detail.vue

@@ -346,7 +346,7 @@ export default {
 
 /* ===== 编辑表单 ===== */
 .edit-section {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
 }
 
 .form-card {
@@ -502,7 +502,7 @@ export default {
 
 .detail-card {
   background: $app-surface;
-  margin: -40rpx 30rpx 0;
+  margin: -40rpx $uni-space-lg 0;
   border-radius: 24rpx;
   padding: 32rpx;
   box-shadow: 0 8rpx 32rpx rgba(0,0,0,0.08);

cfc-frontend/pages/guide/activities/index.vue

@@ -238,7 +238,7 @@ export default {
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $app-surface;
 }
 
@@ -265,7 +265,7 @@ export default {
 
 .filter-bar {
   background: $app-surface;
-  padding: 0 30rpx 20rpx;
+  padding: 0 $uni-space-page 20rpx;
   border-bottom: 1rpx solid $facade-fill;
 }
 
@@ -301,7 +301,7 @@ export default {
 }
 
 .activity-list {
-  padding: 20rpx 30rpx;
+  padding: 20rpx $uni-space-page;
   display: flex;
   flex-direction: column;
   gap: 20rpx;

cfc-frontend/pages/guide/bind/invite.vue

@@ -222,14 +222,14 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.container { min-height: 100vh; background: $facade-fill-2; padding: 30rpx; }
+.container { min-height: 100vh; background: $facade-fill-2; padding: $uni-space-page; }
 
 .invite-card, .bound-card {
   background: $app-surface;
   border-radius: 16rpx;
-  padding: 60rpx 30rpx;
+  padding: 60rpx $uni-space-page;
   text-align: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .guide-avatar {
@@ -249,8 +249,8 @@ export default {
 .invite-desc { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-body; display: block; margin-bottom: 20rpx; }
 .expire-text { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-muted; }
 
-.bind-form { background: $app-surface; border-radius: 16rpx; padding: 30rpx; }
-.form-item { margin-bottom: 30rpx; }
+.bind-form { background: $app-surface; border-radius: 16rpx; padding: $uni-space-page; }
+.form-item { margin-bottom: $uni-space-lg; }
 .label { display: block; font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-strong; margin-bottom: 16rpx; }
 .input, .picker { padding: 20rpx; background: $facade-fill-2; border-radius: 16rpx; font-size: calc(28rpx * var(--font-scale, 1)); }
 .btn-confirm { background: $mat-green; color: $app-surface; border-radius: 24rpx; margin-top: 40rpx; }
@@ -260,14 +260,14 @@ export default {
 .success-desc { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-body; display: block; margin-bottom: 40rpx; }
 .btn-go { background: $mat-green; color: $app-surface; border-radius: 24rpx; }
 
-.share-section { background: $app-surface; border-radius: 16rpx; padding: 30rpx; margin-top: 30rpx; }
+.share-section { background: $app-surface; border-radius: 16rpx; padding: $uni-space-page; margin-top: $uni-space-lg; }
 .section-title { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: bold; display: block; margin-bottom: 20rpx; }
 .invite-url { background: $facade-fill-2; padding: 20rpx; border-radius: 8rpx; margin-bottom: 20rpx; font-size: calc(24rpx * var(--font-scale, 1)); word-break: break-all; }
 .btn-copy, .btn-qrcode { background: $mat-green; color: $app-surface; margin-bottom: 20rpx; }
 
 .qr-popup { background: $app-surface; border-radius: 16rpx; padding: 40rpx; text-align: center; width: 500rpx; }
-.qr-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; display: block; margin-bottom: 30rpx; }
+.qr-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; display: block; margin-bottom: $uni-space-lg; }
 .qr-image { width: 300rpx; height: 300rpx; margin-bottom: 20rpx; }
-.qr-desc { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-body; display: block; margin-bottom: 30rpx; }
+.qr-desc { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-body; display: block; margin-bottom: $uni-space-lg; }
 .close-btn { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-muted; }
 </style>

cfc-frontend/pages/guide/hierarchy/index.vue

@@ -142,7 +142,7 @@ export default {
 
 <style scoped lang="scss">
 .container {
-  padding: 30rpx;
+  padding: $uni-space-page;
   background: $facade-fill-page;
   min-height: 100vh;
 }
@@ -168,8 +168,8 @@ export default {
 .section {
   background: $app-surface;
   border-radius: 24rpx;
-  padding: 30rpx;
-  margin-bottom: 30rpx;
+  padding: $uni-space-lg;
+  margin-bottom: $uni-space-lg;
 }
 
 .section-title {

cfc-frontend/pages/guide/packages/create.vue

@@ -123,17 +123,17 @@ export default {
 .container {
   min-height: 100vh;
   background: $facade-fill-2;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .form {
   background: $app-surface;
   border-radius: 16rpx;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .form-item {
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .label {

cfc-frontend/pages/guide/packages/detail.vue

@@ -209,16 +209,16 @@ export default {
 
 <style scoped lang="scss">
 .container { min-height: 100vh; background: $facade-fill-2; }
-.package-info { background: $app-surface; padding: 30rpx; margin-bottom: 20rpx; }
+.package-info { background: $app-surface; padding: $uni-space-page; margin-bottom: 20rpx; }
 .info-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16rpx; }
 .name { font-size: calc(34rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; }
 .status { font-size: calc(24rpx * var(--font-scale, 1)); padding: 8rpx 16rpx; border-radius: 24rpx; background: $facade-fill; color: $facade-text-body; }
-.info-row { display: flex; gap: 30rpx; font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-body; margin-bottom: 16rpx; }
+.info-row { display: flex; gap: $uni-space-lg; font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-body; margin-bottom: 16rpx; }
 .info-desc { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-muted; margin-bottom: 16rpx; }
 .share-code { display: flex; justify-content: space-between; font-size: calc(26rpx * var(--font-scale, 1)); color: $mat-green; }
 .copy { color: $mat-green; }
 
-.section { background: $app-surface; padding: 30rpx; }
+.section { background: $app-surface; padding: $uni-space-page; }
 .section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20rpx; }
 .section-title { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: bold; }
 .btn-add { background: $mat-green; color: $app-surface; font-size: calc(24rpx * var(--font-scale, 1)); padding: 12rpx 24rpx; border-radius: 24rpx; }
@@ -234,8 +234,8 @@ export default {
 .action-delete { color: $mat-red; font-size: calc(26rpx * var(--font-scale, 1)); }
 .empty-items { text-align: center; padding: 40rpx; color: $facade-text-muted; }
 
-.popup-content { background: $app-surface; border-radius: 24rpx 24rpx 0 0; padding: 30rpx; max-height: 80vh; overflow-y: auto; }
-.popup-header { display: flex; justify-content: space-between; font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; margin-bottom: 30rpx; }
+.popup-content { background: $app-surface; border-radius: 24rpx 24rpx 0 0; padding: $uni-space-page; max-height: 80vh; overflow-y: auto; }
+.popup-header { display: flex; justify-content: space-between; font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; margin-bottom: $uni-space-lg; }
 .close { font-size: calc(48rpx * var(--font-scale, 1)); color: $facade-text-muted; }
 .popup-form .form-item { margin-bottom: 24rpx; }
 .popup-form .label { display: block; font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-strong; margin-bottom: 12rpx; }

cfc-frontend/pages/guide/packages/index.vue

@@ -121,14 +121,14 @@ export default {
 .container {
   min-height: 100vh;
   background: $facade-fill-2;
-  padding: 30rpx;
+  padding: $uni-space-page;
 }
 
 .header {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-bottom: 30rpx;
+  margin-bottom: $uni-space-lg;
 }
 
 .title {
@@ -141,7 +141,7 @@ export default {
   background: $mat-green;
   color: $app-surface;
   font-size: calc(28rpx * var(--font-scale, 1));
-  padding: 16rpx 30rpx;
+  padding: 16rpx $uni-space-page;
   border-radius: 24rpx;
 }
 
@@ -154,7 +154,7 @@ export default {
 .package-card {
   background: $app-surface;
   border-radius: 16rpx;
-  padding: 30rpx;
+  padding: $uni-space-page;
   box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.05);
 }
 
@@ -185,7 +185,7 @@ export default {
 
 .package-info {
   display: flex;
-  gap: 30rpx;
+  gap: $uni-space-lg;
   margin-bottom: 16rpx;
 }
 

cfc-frontend/pages/guide/packages/share.vue

@@ -175,25 +175,25 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.container { min-height: 100vh; background: $facade-fill-2; padding: 30rpx; }
+.container { min-height: 100vh; background: $facade-fill-2; padding: $uni-space-page; }
 
-.package-card { background: $app-surface; border-radius: 16rpx; overflow: hidden; margin-bottom: 30rpx; }
+.package-card { background: $app-surface; border-radius: 16rpx; overflow: hidden; margin-bottom: $uni-space-lg; }
 .cover { width: 100%; height: 300rpx; }
-.package-info { padding: 30rpx; }
+.package-info { padding: $uni-space-page; }
 .name { font-size: calc(34rpx * var(--font-scale, 1)); font-weight: bold; color: $facade-text-strong; display: block; margin-bottom: 10rpx; }
 .desc { font-size: calc(26rpx * var(--font-scale, 1)); color: $facade-text-body; display: block; margin-bottom: 20rpx; }
 .meta { display: flex; align-items: center; gap: 20rpx; font-size: calc(26rpx * var(--font-scale, 1)); }
 .price { font-size: calc(34rpx * var(--font-scale, 1)); color: $mat-red; font-weight: bold; }
 
-.share-options { background: $app-surface; border-radius: 16rpx; padding: 30rpx; }
+.share-options { background: $app-surface; border-radius: 16rpx; padding: $uni-space-page; }
 .section-title { font-size: calc(30rpx * var(--font-scale, 1)); font-weight: bold; display: block; margin-bottom: 20rpx; }
 
-.option-item { display: flex; align-items: center; padding: 30rpx 0; border-bottom: 1rpx solid $facade-fill; }
+.option-item { display: flex; align-items: center; padding: $uni-space-lg 0; border-bottom: 1rpx solid $facade-fill; }
 .option-item:last-child { border-bottom: none; }
 .option-icon { font-size: calc(40rpx * var(--font-scale, 1)); margin-right: 20rpx; }
 .option-text { font-size: calc(28rpx * var(--font-scale, 1)); color: $facade-text-strong; }
 
-.poster-popup { background: $app-surface; border-radius: 16rpx; padding: 30rpx; width: 600rpx; }
+.poster-popup { background: $app-surface; border-radius: 16rpx; padding: $uni-space-page; width: 600rpx; }
 .poster-title { font-size: calc(32rpx * var(--font-scale, 1)); font-weight: bold; display: block; text-align: center; margin-bottom: 20rpx; }
 .poster-canvas { width: 600rpx; height: 900rpx; background: $facade-fill-2; margin: 0 auto; }
 .poster-actions { display: flex; gap: 20rpx; margin-top: 20rpx; }