/* 由 design-system/build/build_tokens.py 自动生成，请勿手改。
   真源: design-system/tokens/*.tokens.json
   只含对外暴露的层（semantic / component）；primitives 不对外。
   :root 给浏览器，page 给微信小程序 WXSS 根节点。 */
:root,
page {
  /* 页面底色 #F1F3F5 */
  --color-bg-page: #F1F3F5;
  /* 卡片/内容区底色 */
  --color-bg-primary: #FFFFFF;
  /* 次级区块底 */
  --color-bg-secondary: #F6F6F6;
  /* 最浅区块底 */
  --color-bg-tertiary: #FBFBFB;
  /* 品牌色填充 */
  --color-bg-brand: #009538;
  /* 绿色区块底（规则帧 #60B67C） */
  --color-bg-brand-soft: #60B67C;
  /* ★ 可无限延长的纯色区域（规则帧明文 #86CF76）。首页弧形面板下方超出部分用的就是它。 */
  --color-bg-brand-extend: #86CF76;
  /* 顶部渐变起点 */
  --color-bg-nav-gradient-1: #45B76D;
  /* 顶部渐变中间（见 primitives 备注） */
  --color-bg-nav-gradient-2: #5FB67B;
  /* 顶部渐变终点/亮端 */
  --color-bg-nav-gradient-3: #93E598;
  /* 品牌色 10% 透明底（设计稿写 rgba(0,149,56,0.1)：快捷入口圆底、选中筛选标签底） */
  --color-bg-brand-alpha-10: #0095381A;
  /* banner CTA 渐变起点 */
  --color-bg-cta-gradient-1: #01B946;
  /* banner CTA 渐变终点（品牌绿） */
  --color-bg-cta-gradient-2: #009538;
  /* 产品教程页绿底（渐变实色档，兜底用；实际渲染用 1891:2115 的 SVG） */
  --color-bg-tutorial-page: #67BB7A;
  /* 缩略图占位底 #E6E6E6 */
  --color-bg-thumb: #E6E6E6;
  /* 免费预约页绿底（同族渐变，实色档兜底） */
  --color-bg-booking-page: #67BB7A;
  /* 「我的」页绿底（与产品教程页 1871 同族，实色档兜底；实际渲染用 1871:16592 的 SVG） */
  --color-bg-mine-page: #67BB7A;
  /* 主文字 #222222 */
  --color-text-primary: #222222;
  /* 次级文字（#222222 @80%，规则帧样例） */
  --color-text-secondary: #222222CC;
  /* 三级文字（#222222 @60%） */
  --color-text-tertiary: #22222299;
  /* 四级文字（#222222 @40%） */
  --color-text-quaternary: #22222266;
  /* 禁用/最弱（#222222 @30%） */
  --color-text-disabled: #2222224D;
  /* 深底上的文字 */
  --color-text-inverse: #FFFFFF;
  /* 品牌色文字（如「立即预约」） */
  --color-text-brand: #009538;
  /* 品牌深色文字（用户首页 Banner 装饰大字用的 #0F7B52） */
  --color-text-brand-strong: #0F7B52;
  /* ★ 用户设计稿新增：案例文案色 #323D36。与 text/primary(#222222) 并存两种深色（已确认保留两色） */
  --color-text-body-alt: #323D36;
  /* 50% 主文字；与禁用30%区分 */
  --color-text-placeholder: #22222280;
  /* 浅分割线 #D9D9D9 */
  --color-border-light: #D9D9D9;
  /* 常规描边 #BDBDBD */
  --color-border-default: #BDBDBD;
  /* 品牌色描边 */
  --color-border-brand: #009538;
  /* 错误描边 */
  --color-border-error: #E60012;
  --color-feedback-success: #139645;
  /* #F39800 */
  --color-feedback-warning: #F39800;
  /* #E60012 —— 必填标记/错误 */
  --color-feedback-error: #E60012;
  --color-surface-page: #F1F3F5;
  --color-surface-content: #FFFFFF;
  --color-surface-subtle: #F6F6F6;
  --color-surface-soft: #FBFBFB;
  --color-surface-brand: #009538;
  --color-surface-brand-subtle: #0095381A;
  --color-action-primary: #009538;
  --color-action-on-primary: #FFFFFF;
  --color-action-selected: #009538;
  --color-action-selected-bg: #0095381A;
  --color-action-disabled: #2222224D;
  /* 图标描边/填充主色；Figma VariableID:2020:11138，SHAPE_FILL/STROKE_COLOR */
  --color-icon-primary: #222222;
  /* VariableID:2026:2271 */
  --color-notification-notification-stop-1: rgba(202.00000315904617, 232.00000137090683, 208.0000028014183, 1);
  /* VariableID:2026:2273 */
  --color-notification-notification-stop-2: rgba(164.15398836135864, 237.36244082450867, 191.6071656346321, 1);
  /* VariableID:2026:2275 */
  --color-notification-notification-stop-3: rgba(50.81946864724159, 194.49688017368317, 105.39461016654968, 1);
  /* VariableID:2026:2277 */
  --color-notification-notification-stop-4: rgba(255, 255, 255, 0.47999998927116394);
  /* VariableID:2026:2279 */
  --color-notification-notification-stop-5: rgba(255, 255, 255, 0.3100000023841858);
  /* VariableID:2026:2281 */
  --color-notification-notification-stop-6: rgba(255, 255, 255, 0.41999998688697815);
  /* VariableID:2026:2283 */
  --color-notification-notification-stop-7: rgba(255, 255, 255, 0.8100000023841858);
  /* VariableID:2026:2285 */
  --color-notification-notification-stop-8: rgba(255, 214.2974352836609, 143.99301499128342, 1);
  /* VariableID:2026:2287 */
  --color-notification-notification-stop-9: rgba(255, 142.07791775465012, 21.368126794695854, 1);
  /* VariableID:2026:2289 */
  --color-notification-notification-stop-10: rgba(255, 255, 255, 0.8199999928474426);
  /* VariableID:2026:2291 */
  --color-notification-notification-stop-11: rgba(255, 255, 255, 0.5);
  /* VariableID:2026:2293 */
  --color-notification-notification-stop-12: rgba(0, 170.0000050663948, 255, 0.25);
  /* VariableID:2026:2295 */
  --color-notification-notification-stop-13: rgba(0, 170.0000050663948, 255, 0.6000000238418579);
  /* VariableID:2032:2277 */
  --color-points-points-stop-1: rgba(80.00000283122063, 173.00000488758087, 125.00000014901161, 1);
  /* VariableID:2032:2279 */
  --color-points-points-stop-2: rgba(140.05233764648438, 210.31944394111633, 116.62996888160706, 1);
  /* 角标/极小注释 */
  --typography-small-font-size: 10px;
  /* 10 + 8 */
  --typography-small-line-height: 18px;
  /* 小字 → 400 */
  --typography-small-font-weight: 400;
  /* 辅助说明 */
  --typography-caption-font-size: 12px;
  /* 12 + 8 */
  --typography-caption-line-height: 20px;
  /* 小字 → 400 */
  --typography-caption-font-weight: 400;
  /* 正文（1 期使用 54 次，主力） */
  --typography-body-font-size: 14px;
  /* 14 + 8 */
  --typography-body-line-height: 22px;
  /* 正文 → 400 */
  --typography-body-font-weight: 400;
  /* 小标题（规则帧样例） */
  --typography-subtitle-font-size: 16px;
  /* 16 + 8 ★ 规范举的例子 */
  --typography-subtitle-line-height: 24px;
  /* 小标题 → 500 */
  --typography-subtitle-font-weight: 500;
  /* 区块标题（规则帧样例） */
  --typography-title-font-size: 18px;
  /* 18 + 8 */
  --typography-title-line-height: 26px;
  /* ⚠️ 推定：标题类 → 500（你只点名了小标题与 Hero，此项待确认） */
  --typography-title-font-weight: 500;
  /* 大标题（规则帧样例原为 Light，按新规范不再用 300） */
  --typography-display-font-size: 24px;
  /* 24 + 8 */
  --typography-display-line-height: 32px;
  /* ⚠️ 推定：标题类 → 500（待确认） */
  --typography-display-font-weight: 500;
  /* 主视觉（规则帧样例） */
  --typography-hero-font-size: 32px;
  /* 32 + 8 */
  --typography-hero-line-height: 40px;
  /* ★ 仅主视觉 Hero → 600 */
  --typography-hero-font-weight: 600;
  /* 正文、小字 */
  --typography-weight-regular: 400;
  /* 小标题、区块标题、大标题 */
  --typography-weight-medium: 500;
  /* 仅主视觉 Hero */
  --typography-weight-semibold: 600;
  /* 规则帧明文「字体调用系统」。iOS/macOS 为 PingFang SC；Android 回退系统无衬线 */
  --typography-family-base: "PingFang SC";
  --typography-family-marketing: "Douyin Sans", "抖音美好体";
  --typography-family-benefit: "Kuaikan World", "快看世界体";
  --spacing-xxs: 2px;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  /* 1 期最高频间距（11 次） */
  --spacing-xl: 20px;
  --spacing-2xl: 24px;
  --spacing-3xl: 32px;
  --spacing-4xl: 40px;
  --spacing-none: 0px;
  --spacing-page-inset: 16px;
  --spacing-inline-tight: 4px;
  --spacing-inline-default: 8px;
  --spacing-inline-compact: 6px;
  --spacing-stack-compact: 8px;
  --spacing-stack-default: 12px;
  --spacing-stack-tight: 10px;
  --spacing-section-default: 24px;
  --radius-none: 0px;
  --radius-xs: 2px;
  /* 1 期 18 次 */
  --radius-sm: 4px;
  --radius-md: 8px;
  /* 1 期最高频（22 次） */
  --radius-lg: 10px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-3xl: 24px;
  /* 胶囊/圆形 */
  --radius-full: 999px;
  --radius-control-default: 8px;
  --radius-tag-default: 4px;
  --radius-card-default: 12px;
  --radius-panel-default: 16px;
  --radius-panel-detail: 20px;
  /* ★ 按下态（规则帧明文） */
  --opacity-pressed: 0.8;
  --opacity-secondary: 0.8;
  --opacity-tertiary: 0.6;
  --opacity-quaternary: 0.4;
  --opacity-disabled: 0.3;
  /* 遮罩 */
  --opacity-mask: 0.5;
  --border-width-default: 1px;
  --border-width-strong: 2px;
  /* 由 1 期 33.536px 还原 */
  --control-height-sm: 32px;
  /* 由 1 期 46.112px 还原（iOS Miniprogram Button） */
  --control-height-md: 44px;
  /* ⚠️ 推定值，1 期未直接观察到 */
  --control-height-lg: 52px;
  --control-padding-x-sm: 8px;
  --control-padding-x-md: 16px;
  --control-padding-x-lg: 20px;
  /* ★ 1 期设计基准。原稿 375pt = 750px @2x 设计稿；文件内部分帧被放大到 393（×1.048），已还原 */
  --layout-page-width: 375px;
  /* 由 1 期 852px 还原（×1.048），iPhone X 档 */
  --layout-page-height: 812px;
  --layout-page-max-width: 375px;
  /* iOS Home Indicator 区高 22（设计稿总高 1050 = 功能区 950 + TabBar 58 + 本区 22）。★ 底色为白（设计稿实测 1028..1050 全白），不是页面灰 */
  --layout-home-indicator: 22px;
  /* 手机屏幕圆角（★ 原型外壳用，非页面内容；用户要求比初版 40 小一些）。真机由设备决定；小程序里页面是全屏的，没有这个圆角。改这一个值即可调 */
  --layout-screen-radius: 24px;
  /* iOS 底部安全区（产品教程页设计稿 34）。⚠️ 与首页设计稿的 22 不同 —— 两页各按自己的设计稿 */
  --layout-safe-area-bottom: 34px;
  --elevation-action: 0 4px 5px rgba(47,189,102,0.24);
  --elevation-card: 0px 2px 4px rgba(27, 60, 37, 0.07);
  --elevation-marketing: 0px 2px 2px rgba(9, 110, 46, 0.2);
  --elevation-decorative-text: 0px 1px 4px rgba(13, 36, 18, 0.38);
  --elevation-icon-record: 0px 1px 2px rgba(66, 102, 82, 0.18);
  --elevation-illustration-record: 0px 3px 4px 0px rgba(36, 59, 45, 0.14);
  --elevation-none: none;
  /* 首页品牌主视觉 */
  --gradient-brand: linear-gradient(-54.034deg, #45B76D 10.346%, #5FB67B 50.286%, #93E598 92.48%);
  /* 附近门店/案例列表；107px后延展末色 */
  --gradient-surface-subtle: linear-gradient(180deg, #CAE8D0 0px, #F1F3F5 107px);
  /* Banner 预约按钮 */
  --gradient-action-banner: linear-gradient(94.0683deg, #01B946 5.6474%, #009538 85.193%);
  /* 案例详情主行动 */
  --gradient-action-detail: linear-gradient(90deg, #009538 0%, #3AB569 100%);
  /* 我的页商城入口 */
  --gradient-marketing: linear-gradient(-58.7933deg, #FF8F44 10.065%, #FFD792 93.129%);
  /* 教程背景，顶部两个透明节点；原页面继续使用SVG */
  --gradient-tutorial-atmosphere: linear-gradient(180deg, rgba(80,173,125,0) 0%, rgba(95,182,123,0) 23.0181%, #67BB7A 41.421%, #6EC079 50%, #7DC977 75%, #8CD275 100%);
  /* 我的页椭圆径向背景；需使用原SVG保持仿射形状 */
  --gradient-mine-atmosphere: url("../../assets/v2/mine/bg.svg");
  --button-primary-bg-default: #009538;
  --button-primary-bg-pressed: #0F7B52;
  --button-primary-bg-disabled: #D9D9D9;
  --button-primary-fg-default: #FFFFFF;
  --button-primary-fg-disabled: #646464;
  --button-primary-radius: 8px;
  --button-secondary-bg-default: #FFFFFF;
  --button-secondary-bg-pressed: #F1F3F5;
  --button-secondary-fg-default: #222222;
  --button-secondary-border: #BDBDBD;
  --button-secondary-radius: 8px;
  /* ★ 用户指定：白底 */
  --button-elevated-bg: #FFFFFF;
  /* ★ 用户指定：品牌绿色文字（= color/bg/brand 同一色 #009538） */
  --button-elevated-fg: #009538;
  /* 设计稿 drop-shadow-[0px_4px_5px_rgba(47,189,102,0.24)] */
  --button-elevated-shadow: 0 4px 5px rgba(47,189,102,0.24);
  --button-elevated-radius: 10px;
  /* 设计稿 h-[48px] */
  --button-elevated-height: 48px;
  /* ★ 用户指定 18px，即 title 档 */
  --button-elevated-font-size: 18px;
  /* ★ 用户指定 500 */
  --button-elevated-font-weight: 500;
  /* 免费预约页设计稿为 12（首页为 10）—— 不动既有 --button-elevated-radius，避免影响首页 */
  --button-elevated-radius-lg: 12px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-padding-y: 11px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width: 88px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-height: 46px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-121218: 90px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-height-d91c6d: 22px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-5cda01: 72px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-shadow: 0px 4px 5px 0px rgba(47.000001, 189.000004, 102.000002, 0.239999995);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-28bfb5: 104px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-background: rgba(29.0000002, 161.000006, 79.0000029, 1);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-foreground: rgba(226.000002, 243.000001, 232.000001, 1);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-b74a2b: 64px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-padding-y-990a8c: 13px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-da49ef: 112px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-height-ce2e76: 34px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-padding-y-bf2d33: 7px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-89a8f6: 66px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-height-f10cdc: 54px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-padding-y-17bd40: 14px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-min-width-7aff91: 114px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-background-07bc63: rgba(29.0000002, 161.000006, 78.000003, 1);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-default-foreground-5cef32: rgba(226.000002, 243.000001, 233.000001, 1);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-return-home-width: 351px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-view-all-border: rgba(188.821869, 188.821869, 188.821869, 1);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-outline32-padding-y: 5px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-outline36-height: 36px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-outline36-width: 102px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient36-background: linear-gradient(93.0760188deg, rgba(1.00000006, 185.000004, 70.0000034, 1) 5.64743506%, rgba(0, 149.000006, 56.0000005, 1) 85.1925777%);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient48-background: linear-gradient(270deg, rgba(19.4774679, 150.309583, 69.1733958, 1) -13.2963998%, rgba(57.8960683, 180.589885, 104.678599, 1) 115.373958%);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient48-width: 343px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-shadow48-background: linear-gradient(97.7183332deg, rgba(1.00000006, 185.000004, 70.0000034, 1) 5.64743506%, rgba(0, 149.000006, 56.0000005, 1) 85.1925777%);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-shadow48-shadow: 0px 2px 4px 0px rgba(9.28288003, 109.551154, 46.4684665, 0.200000003);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-surface-shadow56-height: 56px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-surface-shadow56-padding-y: 15px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-surface-shadow56-shadow: 0px 4px 10px 0px rgba(0, 149.000006, 56.0000005, 0.270000011);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-surface-shadow48-shadow: 0px 4px 10px 0px rgba(47.23457, 189.051894, 101.523249, 0.239999995);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-inverse48-background: rgba(255, 255, 255, 0.100000001);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-compact36-background: linear-gradient(94.0682666deg, rgba(1.00000006, 185.000004, 70.0000034, 1) 5.64743506%, rgba(0, 149.000006, 56.0000005, 1) 85.1925777%);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-compact36-width: 135px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-compact40-background: linear-gradient(95.6864202deg, rgba(1.00000006, 185.000004, 70.0000034, 1) 5.64743506%, rgba(0, 149.000006, 56.0000005, 1) 85.1925777%);
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-compact40-height: 40px;
  /* Figma Button 原生读回规格；组件内部使用。 */
  --button-native-values-gradient-compact40-width: 210px;
  /* 当前文字字号的相对单位；按钮行高按字号 + spacing.sm 自适应。 */
  --button-content-em: 1em;
  /* 宽高比，来自用户提供的 banner.png（750×800） */
  --banner-ratio: 750 / 800;
  /* 白色胶囊的纵向位置（旧稿 265/484，新稿图内已含文字，保留备用） */
  --banner-pill-top: 54.75%;
  /* 面板上移量：面板顶边在设计稿 y=269，Banner 1x 高 400 → 400-269=131 */
  --banner-panel-raise: 131px;
  /* 形状由图片提供，不再用圆角 */
  --panel-radius: 0px;
  /* 弧形图在 375 宽下的渲染高度（源图 750×1086 → 1x 375×543） */
  --panel-image-height: 543px;
  /* 纯色带向上多铺的量。弧形图最后一两行是半透明的，纯色带若从图片下沿才起铺，交界处会露出 1px 亮线（用户实测反馈「有缝隙」）。上移 8px 让图底压在纯色上，缝隙消失 */
  --panel-fill-overlap: 8px;
  /* 从 panel-arc.png 底部采样的颜色（非规范色，是素材自身的末端色）。用于在拼接处做过渡，避免素材末端色与规范色 #86CF76 之间出现可见色阶 */
  --panel-image-bottom-color: #7AC877;
  /* 拼接处的过渡长度：从素材末端色渐变到 #86CF76 的距离 */
  --panel-edge-fade: 32px;
  /* 内容起始位置：面板顶边 269 → 主功能 372，差 103，留出弧形区域的呼吸空间 */
  --panel-padding-top: 103px;
  /* 左右内边距 16px —— 设计稿功能区 left=16 / width=343（16+343+16=375）。用 12 会让卡片宽出 5px（实测 171 vs 设计 166） */
  --panel-padding-x: 16px;
  --panel-padding-bottom: 16px;
  /* 设计稿 gap-[var(--spacing-lg,16px)] */
  --panel-gap: 16px;
  /* 设计稿图标 36×36 */
  --scene-grid-icon-size: 36px;
  /* 五大场景一行 5 列（设计稿主功能 5 项等分） */
  --scene-grid-columns: repeat(5, minmax(0, 1fr));
  /* ★ 用户指定 ＃ffffff。设计稿里这几条标签本来就绑的是白色，之前实现错用了 text/primary */
  --scene-grid-label-color: #FFFFFF;
  /* 设计稿图标 48×48 */
  --entry-card-icon-size: 48px;
  /* ★ 用户指定：顶部 #ffffff 90% 不透明（0.90×255≈230=E6） */
  --entry-card-bg-from: #FFFFFFE6;
  /* ★ 用户指定：底部 #ffffff 60% 不透明（0.60×255=153=99） */
  --entry-card-bg-to: #FFFFFF99;
  /* 从上到下 */
  --entry-card-bg-angle: 180deg;
  /* 设计稿图标 30×30 */
  --tab-bar-icon-size: 30px;
  /* 设计稿 Tabar 高 58（不含 Home Indicator 34）。显式定高，因为悬浮按钮要按它算距离 */
  --tab-bar-height: 58px;
  /* 设计稿 tabbar py-3 */
  --tab-bar-padding-y: 3px;
  --tab-bar-item-width: 75px;
  --tab-bar-item-height: 52px;
  /* 未选中文字色（设计稿字面 #959d98） */
  --tab-bar-fg: #959D98;
  --tab-bar-fg-active: #009538;
  --tab-bar-bg: #FFFFFF;
  /* ★ 用户指定且设计稿实测一致：TabBar 左上/右上圆角 30（设计稿 y=970 处灰底缺口在 d=5 时退到 x≈14，反解 r≈30） */
  --tab-bar-radius-top: 30px;
  /* 未选中文字 #959D98 */
  --tab-bar-fg-inactive: #959D98;
  /* 58 + 安全区 34（产品教程页/免费预约页设计稿） */
  --tab-bar-area-height: 92px;
  /* 轻提示底 #222222 @90% */
  --tab-bar-toast-bg: #222222E6;
  /* 轻提示文字（白） */
  --tab-bar-toast-fg: #FFFFFF;
  --tab-bar-toast-radius: 8px;
  --tab-bar-toast-pad-x: 16px;
  --tab-bar-toast-pad-y: 10px;
  /* 距 TabBar 上沿 */
  --tab-bar-toast-offset: 16px;
  /* 高于 TabBar 区（10） */
  --tab-bar-toast-z: 20;
  /* 58 + Home Indicator 22（首页设计稿） */
  --tab-bar-area-height-home: 80px;
  /* 预约键素材画布 52×52（内含直径 48 的圆 + 投影出血） */
  --fab-size: 52px;
  /* ★ 用户指定：预约键右侧距页边距 16 */
  --fab-right: 16px;
  /* ★ 用户指定：预约键距 TabBar 上方 48 */
  --fab-gap: 48px;
  /* 浮层层级：要在页面内容之上，但不遮 TabBar */
  --fab-z: 10;
  /* 素材 notice-bell.svg 尺寸 30×30 */
  --notice-size: 30px;
  /* ★ 用户指定：距页面顶部 96 */
  --notice-top: 96px;
  /* ★ 用户指定：右侧距页边距 16 */
  --notice-right: 16px;
  --case-card-bg: #FFFFFF;
  /* 设计稿无边框（用户此前也要求去边框线） */
  --case-card-border: 0px;
  /* rounded-[var(--radius-xl,12px)] */
  --case-card-radius: 12px;
  /* 仅下内边距 8（左右由内容宽 166/148 决定） */
  --case-card-padding: 0px 0px 8px;
  /* 文案最多两行（设计稿 148×40 = 两行 @14/22），超出才省略 */
  --case-card-title-lines: 2;
  /* 封面比例 166:140 */
  --case-card-image-ratio: 166 / 140;
  /* 案例文案的第二种深色 #323D36（设计稿保留了两种色） */
  --case-card-fg-alt: #323D36;
  /* 设计稿写死 #009538 */
  --case-card-badge-bg: #009538;
  --case-card-badge-fg: #FFFFFF;
  /* ★ 用户指定：36×20 */
  --case-card-badge-width: 36px;
  --case-card-badge-height: 20px;
  /* ★ 设计稿 rounded-tl-[10px] */
  --case-card-badge-radius-tl: 10px;
  /* ★ 设计稿 rounded-tr-[2px] */
  --case-card-badge-radius-tr: 2px;
  /* ★ 设计稿 rounded-br-[10px] */
  --case-card-badge-radius-br: 10px;
  /* ★ 设计稿 rounded-bl-[2px] */
  --case-card-badge-radius-bl: 2px;
  /* 卡内 gap 7 */
  --case-card-gap: 7px;
  /* 图上圆角 rounded-t-[10px] */
  --case-card-image-radius: 10px;
  --case-card-title-width: 148px;
  --case-card-sub-width: 148px;
  --case-card-badge-pad-x: 8px;
  --case-card-badge-pad-y: 3px;
  /* 角标 left/top 6 */
  --case-card-badge-inset-x: 6px;
  --case-card-badge-inset-y: 6px;
  /* 角标文字 10px（设计稿写的字面值，非 token） */
  --case-card-badge-font-size: 10px;
  /* 1887:1174 高 189 */
  --nav-height: 189px;
  /* rounded-bl/br-[60px] */
  --nav-radius-bottom: 60px;
  /* 设计稿 -54.03381204465356deg，取 3 位小数 */
  --nav-gradient-angle: -54.034deg;
  /* 起点停靠位置 */
  --nav-gradient-stop-1: 10.346%;
  --nav-gradient-stop-2: 50.286%;
  --nav-gradient-stop-3: 92.48%;
  /* StatusBar 高 46 */
  --nav-statusbar-height: 46px;
  /* 胶囊在导航里的 top：设计稿 46.11 + (46.112−33.536)/2 */
  --nav-capsule-top: 52.398px;
  /* 微信胶囊 91.176×33.536 */
  --nav-capsule-w: 91.176px;
  --nav-capsule-h: 33.536px;
  --nav-capsule-right: 6.29px;
  /* 1887:1287 logo */
  --nav-logo-left: 17px;
  --nav-logo-top: 58px;
  /* ⚠️ 画框只 65 宽，里面图片 126.193 → 设计上就是裁切显示 */
  --nav-logo-width: 65px;
  --nav-logo-height: 24px;
  /* logo 图片实际宽 126.193，被 65 宽画框裁切 */
  --nav-logo-image-w: 126.193px;
  /* 1887:1210 bell */
  --nav-bell-left: 88px;
  --nav-bell-top: 58px;
  --nav-bell-size: 24px;
  --nav-center-title-x: 156px;
  --nav-center-time-tracking: -0.524px;
  /* 微信系统层模拟 SF Pro Text Semibold；不属于业务字重规范 */
  --nav-system-time-weight: 600;
  --nav-center-title-offset: 1px;
  --master-card-left: 16px;
  --master-card-top: 105px;
  /* = 页面宽 − 16×2 */
  --master-card-width: 343px;
  --master-card-height: 120px;
  /* 设计绑 var(--button-primary-radius,8px) */
  --master-card-radius: 8px;
  /* drop-shadow */
  --master-card-shadow: 0px 2px 4px rgba(27, 60, 37, 0.07);
  /* 「一站式空间解决方案」left 8 */
  --master-card-title-left: 8px;
  /* 标题垂直中心 top 23 → 高 22 → 起点 12 */
  --master-card-title-top: 12px;
  /* 五个入口行 top 46 */
  --master-card-row-top: 46px;
  /* 每项 68.6 宽（343/5） */
  --master-card-item-w: 68.6px;
  --master-card-item-h: 62px;
  /* 图标与文字间距 gap 6 */
  --master-card-item-gap: 6px;
  /* 图标框 36×36 且 overflow-clip */
  --master-card-icon-box: 36px;
  /* 设计稿给图标的投影。⚠️ 实际渲染不出来：图标 42–46px 装进 36px 且 overflow-clip 的框，投影落在 42~47px 全被裁掉。故 CSS 里不引用它（引用会让小于框的图标露出灰方框）。保留登记以免被当成遗漏 */
  --master-card-icon-shadow: 0px 1px 2px rgba(66, 102, 82, 0.18);
  /* 卡片超出 Navigation 的高度 105+120−189 */
  --master-card-overhang: 36px;
  /* 压在导航渐变之上 */
  --master-card-z: 1;
  --banner-square-size: 196px;
  /* rounded-[var(--radius-md,8px)] */
  --banner-square-radius: 8px;
  /* 与右侧四入口的间距：196+8+139=343 */
  --banner-square-gap: 8px;
  /* 31/196 */
  --banner-square-cta-left: 15.8163%;
  /* 146/196 */
  --banner-square-cta-top: 74.4898%;
  /* 135/196 */
  --banner-square-cta-width: 68.8776%;
  /* 36/196 */
  --banner-square-cta-height: 18.3673%;
  /* 设计 8px @196 → 8/196×100 */
  --banner-square-cta-radius: 4.0816cqw;
  /* 设计 16px @196 */
  --banner-square-cta-font-size: 8.1633cqw;
  /* 设计 24px @196 */
  --banner-square-cta-line-height: 12.2449cqw;
  /* 设计稿 94.06826658152588deg，取 4 位小数 */
  --banner-square-cta-angle: 94.0683deg;
  --banner-square-cta-stop-1: 5.6474%;
  --banner-square-cta-stop-2: 85.193%;
  /* drop-shadow（按设计稿固定 px，不随 banner 缩放） */
  --banner-square-cta-shadow: 0px 2px 2px rgba(9, 110, 46, 0.2);
  --banner-square-cta-fg: #FFFFFF;
  --quick-grid-width: 139px;
  --quick-grid-height: 196px;
  /* rounded-[8px] */
  --quick-grid-radius: 8px;
  /* 首项 left 12 */
  --quick-grid-pad-x: 12px;
  /* 首项 top 20 */
  --quick-grid-pad-y: 20px;
  /* 78−12−48 */
  --quick-grid-col-gap: 18px;
  /* 110−20−66 */
  --quick-grid-row-gap: 24px;
  --quick-grid-item-w: 48px;
  --quick-grid-item-h: 66px;
  /* 图标与文字 gap 6 */
  --quick-grid-item-gap: 6px;
  /* 圆形底 40×40，rounded-[1110px] = 全圆 */
  --quick-grid-disc: 40px;
  /* 图标 24×24 */
  --quick-grid-icon: 24px;
  --filter-tag-gap: 8px;
  /* rounded-[4px] */
  --filter-tag-radius: 4px;
  /* px-12 */
  --filter-tag-pad-x: 12px;
  /* py-4 */
  --filter-tag-pad-y: 4px;
  /* 标签高 30（文字行高 22 + 上下 4） */
  --filter-tag-min-height: 30px;
  /* 未选中：白底 */
  --filter-tag-bg: #FFFFFF;
  /* 未选中：文字（叠 70% 不透明度） */
  --filter-tag-fg: #222222;
  /* opacity-70 */
  --filter-tag-fg-opacity: 0.7;
  /* 选中：rgba(0,149,56,0.1) */
  --filter-tag-bg-active: #0095381A;
  /* 选中：1px 品牌描边 */
  --filter-tag-border-active: #009538;
  --filter-tag-fg-active: #009538;
  /* 5 个标签总宽 404 > 343 → 横向可滚 */
  --filter-tag-row-width: 404px;
  --booking-page-height: 812px;
  /* 照片 left，设计绝对 −185（= calc(50%−22.5) 再 −50% 宽） */
  --booking-photo-x: -49.3333cqw;
  /* 设计 −112 */
  --booking-photo-y: -29.8667cqw;
  /* 设计 700 */
  --booking-photo-w: 186.6667cqw;
  /* 设计 525 */
  --booking-photo-h: 140cqw;
  /* 设计绝对 −417.64 */
  --booking-ellipse-x: -111.3707cqw;
  /* 设计 59.24 */
  --booking-ellipse-y: 15.7973cqw;
  /* 设计 850.55 */
  --booking-ellipse-w: 226.8133cqw;
  /* 设计 765.86 */
  --booking-ellipse-h: 204.2293cqw;
  /* 顶部压暗层高，设计 195 */
  --booking-scrim-h: 52cqw;
  /* 设计 375（新版由 393 改为 375） */
  --booking-scrim-w: 100cqw;
  /* 渐变起点，alpha 0.5 */
  --booking-scrim-from: #274E35;
  /* 整层再 50% 不透明（设计 opacity-50） */
  --booking-scrim-opacity: 0.5;
  /* 起点 alpha */
  --booking-scrim-alpha: 0.5;
  /* 「预约立享：」left，设计绝对 257（新版 banner 帧是 375 宽，calc(50%+69.5)=257；旧版父层 393 时是 266） */
  --booking-eyebrow-left: 68.5333cqw;
  /* 设计 139 */
  --booking-eyebrow-top: 37.0667cqw;
  /* 设计 20px */
  --booking-eyebrow-size: 5.3333cqw;
  /* 「轻松 住新家」left，设计 31 */
  --booking-title-left: 8.2667cqw;
  /* 设计 198 */
  --booking-title-top: 52.8cqw;
  /* 设计 44px */
  --booking-title-size: 11.7333cqw;
  --booking-title-lh: 1.1;
  /* 主视觉文案投影（设计统一） */
  --booking-hero-shadow: 0px 1px 4px rgba(13, 36, 18, 0.38);
  /* ★ 抖音美好体，本机已装（~/Library/Fonts/DouyinSansBold.otf），可真实命中 */
  --booking-hero-font: "Douyin Sans", "抖音美好体";
  --booking-hero-fg: #FFFFFF;
  /* 设计 29 */
  --booking-badge-x: 7.7333cqw;
  /* 设计 116 */
  --booking-badge-y: 30.9333cqw;
  /* 设计 89 */
  --booking-badge-w: 23.7333cqw;
  /* 设计 29 */
  --booking-badge-h: 7.7333cqw;
  /* 只圆左上+右下（rounded-tl/br-[18px]） */
  --booking-badge-radius: 18px;
  /* 「坐享其成」left，设计 37 */
  --booking-badge-text-x: 9.8667cqw;
  /* 设计 132 */
  --booking-badge-text-y: 35.2cqw;
  /* 设计 18px */
  --booking-badge-text-size: 4.8cqw;
  /* 设计 263 */
  --booking-pill-x: 70.1333cqw;
  /* 设计 155 */
  --booking-pill1-y: 41.3333cqw;
  /* 设计 183 */
  --booking-pill2-y: 48.8cqw;
  /* 设计 211 */
  --booking-pill3-y: 56.2667cqw;
  /* 设计 91 */
  --booking-pill-w: 24.2667cqw;
  /* 设计 25 */
  --booking-pill-h: 6.6667cqw;
  /* 只圆左上+右下 */
  --booking-pill-radius: 10px;
  /* 「0元」底色块宽，设计 32 */
  --booking-pill-cap-w: 8.5333cqw;
  /* 「0元」中心，设计 278.88 */
  --booking-pill-price-x: 74.368cqw;
  /* 「上门基检」中心，设计 320.27 */
  --booking-pill-text-x: 85.4053cqw;
  /* 设计 161.737 */
  --booking-pill-text-1-y: 43.1299cqw;
  /* 设计 188.685 */
  --booking-pill-text-2-y: 50.316cqw;
  /* 设计 215.634 */
  --booking-pill-text-3-y: 57.5024cqw;
  /* 设计 14px */
  --booking-pill-text-size: 3.7333cqw;
  /* ★ 快看世界体（品牌字体，本机未装 → 回落规范字体） */
  --booking-pill-font: "Kuaikan World", "快看世界体";
  /* 左右内距 */
  --booking-card-x: 16px;
  --booking-card-y: 266px;
  /* 白卡底（设计 1868:11683 就是 #fff 圆角 16 的矩形，用 CSS 画可随宽度正确保持圆角） */
  --booking-card-bg: #FFFFFF;
  --booking-card-radius: 16px;
  /* 36−16 与 286−266 */
  --booking-card-pad: 20px;
  --booking-row-h: 40px;
  /* 6×40 + 5×12 = 300 ✓ */
  --booking-row-gap: 12px;
  --booking-row-radius: 8px;
  /* 设计用 --color-border-light */
  --booking-row-border: #D9D9D9;
  /* 图标行 left 11（左右对称；下拉箭头也在此内距内） */
  --booking-row-pad-x: 11px;
  --booking-row-icon: 24px;
  --booking-row-inner-gap: 8px;
  --booking-row-text-fill: #222222;
  /* 设计用 --color-text-disabled */
  --booking-row-text-ph: #2222224D;
  --booking-row-chevron-w: 22.803px;
  /* 内容区宽（303 − 11×2 − 2 边） */
  --booking-row-right-w: 279px;
  --booking-btn-x: 16px;
  --booking-btn-y: 622px;
  --booking-btn-w: 343px;
  --booking-rules-title-y: 718px;
  --booking-rules-body-y: 746px;
  /* 标题(718+20)↔正文(746) 之间 */
  --booking-rules-gap: 8px;
  /* 按钮下缘(670)↔规则标题(718) 之间 */
  --booking-rules-gap-y: 48px;
  --booking-rules-pad-x: 19px;
  --booking-rules-title-size: 14px;
  --booking-rules-body-size: 12px;
  --booking-rules-body-lh: 20px;
  /* 设计 opacity-60 */
  --booking-rules-opacity: 0.6;
  --booking-rules-fg: #222222;
  --booking-nav-h: 87.894px;
  /* 设计 backdrop-filter: blur(14.24px)（Figma 背景模糊 28.4876 的一半） */
  --booking-nav-blur: 14.24px;
  --booking-nav-back-x: 16.77px;
  /* 43.947 + 10.48 */
  --booking-nav-back-y: 54.427px;
  /* 热区，图标本身 9.43×17.816 */
  --booking-nav-back-box: 25.152px;
  --booking-nav-back-icon-w: 9.43px;
  --booking-nav-back-icon-h: 17.816px;
  --booking-nav-capsule-right: 6.29px;
  /* 46.112 + (46.112−33.536)/2 */
  --booking-nav-capsule-top: 52.4px;
  --booking-overlay-z: 10;
  --booking-canvas: 52px;
  /* ★ 圆底 SVG 的画布尺寸。素材 booking-disc.svg 自带 52×52 viewBox（圆 cx26 cy25 r24），设计稿用负 inset 把它撑回原始 52 —— 若按 48 渲染会把圆缩成 44.3，位置也偏 */
  --booking-disc: 52px;
  /* 圆底在画布中的 left（48 框左 2 再让 −4.17%×48≈−2） */
  --booking-disc-left: 0px;
  /* 圆底在画布中的 top（48 框上 2 再让 −2.08%×48≈−1） */
  --booking-disc-top: 1px;
  --booking-icon: 24px;
  /* 图标在画布中的 top 6 */
  --booking-icon-top: 6px;
  /* 「预约」在画布中的 top 26 */
  --booking-label-top: 26px;
  /* ★ 圆右缘距页右 16（画布 x=309，圆 311..359，375−359=16） */
  --booking-right: 16px;
  /* ★ 圆下缘距 TabBar 上沿 62（圆 860..908，TabBar 970） */
  --booking-gap: 62px;
  /* 48 圆在 52 画布内的内缩（圆心在画布 (26,25)，圆跨 2..50） */
  --booking-disc-inset: 2px;
  /* 浮层层级：在内容之上、TabBar 之上 */
  --booking-z: 10;
  /* 权益标签「0元」左侧色块 1868:11667 */
  --booking-pill-cap-bg: #329E66;
  /* 整组 left，设计 263 */
  --booking-pills-x: 70.1333cqw;
  /* 整组 top，设计 155 */
  --booking-pills-y: 41.3333cqw;
  /* 整组宽，设计 91 */
  --booking-pills-w: 24.2667cqw;
  /* 整组高，设计 81（三枚 25 + 间隙 3） */
  --booking-pills-h: 21.6cqw;
  /* 遮罩（Figma 1914:8847 bg-[rgba(0,0,0,0.6)]） */
  --booking-dialog-scrim: rgba(0, 0, 0, 0.6);
  /* 弹窗宽（页面 375 − 左右 40） */
  --booking-dialog-w: 295px;
  --booking-dialog-x: 40px;
  --booking-dialog-card-w: 295px;
  /* 白卡 + 底部尖角总高 */
  --booking-dialog-card-h: 241.219px;
  /* 弹窗框高（1914:8851） */
  --booking-dialog-box-h: 282px;
  /* 弹窗内容组相对弹窗顶的偏移（1915:8891 top 3） */
  --booking-dialog-group-y: 3px;
  /* 卡片相对弹窗框顶的偏移；页内绝对位置 = 265+37 = 302（实测上沿） */
  --booking-dialog-card-top: 37px;
  /* 顶部插画显示宽 */
  --booking-dialog-illus-w: 114px;
  /* 顶部插画显示高（框）；图本身 114×114 居中溢出 */
  --booking-dialog-illus-h: 96px;
  /* ★ Figma 节点上写着的阴影，但**设计稿自身渲染并没有它**（实测插画左右边缘与卡片底色完全一致，下缘 y370-371 的暗纹是图案内自带的）。故 CSS 不引用此 token —— 加圆角会形成圆环，不加圆角则阴影按方形框溢出成方块边 */
  --booking-dialog-illus-shadow: 0px 3px 4px 0px rgba(36, 59, 45, 0.14);
  /* 「提交成功」top（相对弹窗内容组） */
  --booking-dialog-title-y: 99px;
  /* 副标题 top */
  --booking-dialog-desc-y: 136px;
  /* 按钮行 top */
  --booking-dialog-actions-y: 190px;
  --booking-dialog-btn-w: 102px;
  --booking-dialog-btn-h: 36px;
  /* 两按钮间距 */
  --booking-dialog-btn-gap: 19px;
  /* 弹窗高于导航(10)与 TabBar(10) */
  --booking-dialog-z: 30;
  /* Figma 1914:8884 的渐变（93.076deg #01B946 5.65% → #009538 85.19%）。色值与 primitives/ctaGradient.{1,2} 相同，此处写字面量是因为别名不能嵌在函数里 */
  --booking-dialog-primary-bg: linear-gradient(93.076deg, #01B946, #009538);
  /* 插画是圆的（设计稿 PNG 本身就是圆形），半径 = 114/2 */
  --booking-dialog-illus-radius: 57px;
  /* 内容区左右内边距（375−343)/2 */
  --home-layout-content-padding-x: 16px;
  /* 主功能卡下沿 225 → banner 行 240 */
  --home-layout-gap-master-to-media: 15px;
  /* banner 行下沿 436 → 功能区 452 */
  --home-layout-gap-media-to-cases: 16px;
  /* 功能区下沿 950 → TabBar 区 970 */
  --home-layout-gap-cases-to-tabbar: 20px;
  /* banner 196 + 8 + 快捷网格 139 = 343 */
  --home-layout-media-gap: 8px;
  /* 功能区内部纵向 gap 12（标题→标签→网格） */
  --home-layout-card-gap: 12px;
  /* 案例网格横向 gap。设计稿卡片显式写 w-[166px]，而 166×2+12=344 > 343，Figma 实际把间距压到 11.5；取 11 让卡片正好 166（显式值优先于由 Figma 兜底算出的间距） */
  --home-layout-grid-gap: 11px;
  /* 1861:9407 高 812（内容可滚，TabBar 固定） */
  --tutorial-page-height: 812px;
  --tutorial-banner-h: 286px;
  /* banner 宽高比（用于随宽度等比缩放） */
  --tutorial-banner-aspect: 375 / 286;
  /* 蒙版高（banner 实际可见区） */
  --tutorial-banner-mask-h: 262px;
  /* 蒙版高 / banner 高 = 262/286 */
  --tutorial-banner-mask-ratio: 91.6084%;
  /* 照片 left，设计 -20px */
  --tutorial-banner-photo-x: -5.3333cqw;
  /* 照片宽，设计 394.875px */
  --tutorial-banner-photo-w: 105.3cqw;
  /* 照片高，设计 296.156px */
  --tutorial-banner-photo-h: 78.9749cqw;
  /* 椭圆1 left，设计 -75.372px */
  --tutorial-banner-p1-x: -20.0992cqw;
  /* 椭圆1 top，设计 187.76px */
  --tutorial-banner-p1-y: 50.0693cqw;
  /* 椭圆1 宽，设计 192.372px */
  --tutorial-banner-p1-w: 51.2992cqw;
  /* 椭圆1 高，设计 243.446px */
  --tutorial-banner-p1-h: 64.9189cqw;
  /* 椭圆2 left，设计 -257.634px */
  --tutorial-banner-p2-x: -68.7024cqw;
  /* 椭圆2 top，设计 229.202px */
  --tutorial-banner-p2-y: 61.1205cqw;
  /* 椭圆2 宽，设计 530.534px */
  --tutorial-banner-p2-w: 141.4757cqw;
  /* 椭圆2 高，设计 446.028px */
  --tutorial-banner-p2-h: 118.9408cqw;
  /* 设计 47px */
  --tutorial-title-left: 12.5333cqw;
  /* 设计 88.5px（相对页面宽 375） */
  --tutorial-title-top: 23.6cqw;
  /* 设计 90px */
  --tutorial-title-width: 24cqw;
  /* 设计 44px */
  --tutorial-title-size: 11.7333cqw;
  /* leading-[1.1] */
  --tutorial-title-lh: 1.1;
  /* text-shadow */
  --tutorial-title-shadow: 0px 1px 4px rgba(13, 36, 18, 0.38);
  --tutorial-title-fg: #FFFFFF;
  /* ★ 品牌字体（抖音 Sans Bold）。非系统字体，缺失时回落规范字体 —— 见 CSS 的字体栈 */
  --tutorial-title-font: "Douyin Sans", "抖音美好体";
  --tutorial-content-top: 204px;
  --tutorial-content-pad-x: 16px;
  /* 分组内 标题↔卡片 间距 */
  --tutorial-group-gap: 10px;
  /* 分组与分组之间（18xx 组2 top 388 = 组1 高 372 + 16） */
  --tutorial-group-gap-y: 16px;
  /* 分组标题为白字（设计绑 button-primary-fg-default = white），压在绿底上 */
  --tutorial-title-fg-group: #FFFFFF;
  /* 设计绑 --case-card-bg */
  --tutorial-card-bg: #FFFFFF;
  --tutorial-card-radius: 8px;
  --tutorial-card-pad-x: 12px;
  --tutorial-card-pad-y: 8px;
  --tutorial-card-gap: 8px;
  --tutorial-row-pad-y: 8px;
  /* 缩略图 ↔ 文字列 */
  --tutorial-row-gap: 8px;
  /* 行高 69 = 53 图 + 上下各 8 */
  --tutorial-row-h: 69px;
  --tutorial-thumb-w: 52px;
  --tutorial-thumb-h: 53px;
  --tutorial-thumb-radius: 4px;
  --tutorial-text-col-w: 128px;
  --tutorial-text-col-gap: 8px;
  --tutorial-divider-w: 317px;
  /* 分割线 1px #F1F3F5（设计给的 SVG 线就是这色） */
  --tutorial-divider-color: #F1F3F5;
  /* Navigation 高 96（title 行 44+48） */
  --tutorial-nav-h: 96px;
  /* 胶囊右距 = 包装 9.2 + 内 6.29（与首页的 6.29 不同） */
  --tutorial-capsule-right: 15.49px;
  /* 胶囊 top = 44 + (46.112−33.536)/2 */
  --tutorial-capsule-top: 50.288px;
  /* TabBar 区总高 92 = 58 + 安全区 34 */
  --tutorial-tabbar-area-h: 92px;
  /* 绿底 SVG 图层 */
  --tutorial-page-bg-z: 0;
  /* banner 层（设计稿里在白卡之下） */
  --tutorial-banner-z: 0;
  /* 内容层：必须高于 banner，否则 banner 的渐隐会糊在白卡上 */
  --tutorial-content-z: 1;
  /* 系统层与 TabBar 固定在内容之上 */
  --tutorial-overlay-z: 10;
  /* 绿底 SVG 资源（由页面描述注入；默认 none 以便样式中声明） */
  --tutorial-page-bg-image: none;
  /* 缩略图内图默认宽（各行可覆盖，设计里 53/45/48/36） */
  --tutorial-thumb-img-w: 53px;
  /* 缩略图内图默认高 */
  --tutorial-thumb-img-h: 53px;
  /* 副标题默认不透明；设计里「趣森活屋顶补漏防水」为 0.5 */
  --tutorial-sub-opacity: 1;
  --mine-page-height: 812px;
  /* 内容区左右内距 */
  --mine-content-x: 16px;
  /* 纹理层 left，设计绝对 −233.02 */
  --mine-tex-x: -233.02px;
  /* 设计 −200 */
  --mine-tex-y: -200.0px;
  /* 设计 843.893 */
  --mine-tex-w: 843.893px;
  /* 设计 672 */
  --mine-tex-h: 672.0px;
  /* 蒙版 position 233.969px */
  --mine-tex-mask-x: 233.969px;
  /* 蒙版 position 200px */
  --mine-tex-mask-y: 200.0px;
  /* 蒙版 size 374.046 */
  --mine-tex-mask-w: 374.046px;
  /* 蒙版 size 371 */
  --mine-tex-mask-h: 371.0px;
  /* 设计 22 */
  --mine-avatar-x: 22.0px;
  /* 设计 106 */
  --mine-avatar-y: 106.0px;
  /* 设计 75 */
  --mine-avatar-size: 75.0px;
  /* ★ 实测文字左边 x118（metadata 文本框 left 116，含 2px 左边距） */
  --mine-hello-x: 116.0px;
  /* 设计 111 */
  --mine-hello-y: 111.0px;
  /* ★ 设计 1871:16684 text-[24px] leading-[24px] Light；实测字高 20、字宽 57 */
  --mine-hello-size: 24.0px;
  /* ★ 实测文字上沿 y150（metadata top 145） */
  --mine-name-y: 141.0px;
  /* ★ 实测字宽 172px（x117..288）。24px 时我只有 130 宽、墨量少一半 → 实际 32px（规范里已有 32 这一档） */
  --mine-name-size: 32.0px;
  /* ★ 实测文字宽 171px（x117..288） */
  --mine-name-w: 172.0px;
  /* 会员卡 left 16 */
  --mine-member-x: 16.0px;
  /* 设计 236 */
  --mine-member-y: 236.0px;
  /* 设计 343 */
  --mine-member-w: 343.0px;
  /* 设计 183 */
  --mine-member-h: 183.0px;
  --mine-member-radius: 12px;
  /* 「我的积分」卡内 left 12（绝对 x=16+12=28）—— 值曾误写 9.6，描述与值不一致 */
  --mine-points-x: 12.0px;
  /* 卡内 top 13（绝对 y=236+13=249） */
  --mine-points-y: 13.0px;
  --mine-points-gap: 4.0px;
  /* 积分数字 opacity-80 */
  --mine-points-opacity: 0.8;
  --mine-points-arrow: 18px;
  /* 三个权益卡行 left 12 */
  --mine-rights-x: 12px;
  /* 设计 52（卡内） */
  --mine-rights-y: 52px;
  --mine-rights-gap: 6px;
  --mine-rights-w: 102px;
  --mine-rights-h: 110px;
  /* 设计给的圆角（非整数，照抄） */
  --mine-rights-radius: 10.821px;
  /* 卡内标题中心 top */
  --mine-rights-title-y: 20px;
  /* 卡内副标题中心 top */
  --mine-rights-sub-y: 44px;
  --mine-rights-title-size: 16px;
  --mine-rights-sub-size: 12px;
  /* ★ 设计稿 x=24 扫描实测白卡上沿 435（list 内 199 + 236）—— 值与描述曾不一致，值写成了 522 */
  --mine-func-y: 435.0px;
  /* 343 */
  --mine-func-w: 343.0px;
  /* Figma 1872:17139：40px 图标 + 4px 间距 + 22px 文案 + 上下各 8px */
  --mine-func-h: 82.0px;
  --mine-func-radius: 8px;
  --mine-func-pad-x: 36px;
  --mine-func-pad-y: 8px;
  /* row 用绝对定位逐项落位（设计稿是固定步进 114，非等分）→ gap 不参与 */
  --mine-func-gap: 0px;
  /* 40 圆底 / 28 图形 */
  --mine-func-icon-box: 40px;
  --mine-func-icon: 28px;
  /* 图标底 rgba(0,149,56,0.1) */
  --mine-func-icon-bg: #0095381A;
  /* 设计写的 1110px（超大圆角=圆形） */
  --mine-func-icon-radius: 1110px;
  --mine-func-text-gap: 4px;
  --mine-func-text-size: 14px;
  /* 功能行底部 517 + 16px 卡片间距 */
  --mine-two-col-y: 533.0px;
  /* ★ 每张独立白卡 165 宽（实测白色覆盖 x 16..180 / 194..358） */
  --mine-two-col-w: 165px;
  /* Figma 1872:17199：60px */
  --mine-two-col-h: 60.0px;
  /* 两列间 178−165（★ 两张独立白卡，中间 13px 露出绿底） */
  --mine-two-col-gap: 13px;
  --mine-two-col-text-x: 16px;
  --mine-two-col-text-y: 21px;
  --mine-two-col-text-size: 16px;
  --mine-two-col-icon: 48px;
  /* 列内图标 left */
  --mine-two-col-icon-x: 112px;
  --mine-two-col-icon-y: 6px;
  /* 双列卡片底部 593 + 16px 卡片间距 */
  --mine-fav-y: 609.0px;
  /* Figma 1872:17201：60px */
  --mine-fav-h: 60.0px;
  /* 「24」left（卡内 292） */
  --mine-fav-count-x: 309px;
  --mine-fav-count-y: 23px;
  /* 设计未给档位，按 body 14/22 */
  --mine-fav-count-size: 14px;
  --mine-fav-arrow: 18px;
  /* 设计 268.5 */
  --mine-mall-x: 268.5px;
  /* 设计 231 */
  --mine-mall-y: 231.0px;
  /* 矩形 92×36 */
  --mine-mall-w: 92px;
  --mine-mall-h: 36px;
  /* 设计 linear-gradient(-58.79deg, rgb(255,143,68) 10.065%, rgb(255,215,146) 93.129%) */
  --mine-mall-bg: linear-gradient(-58.7933deg, #FF8F44 10.065%, #FFD792 93.129%);
  /* 只圆左下+右上（rounded-bl/tr-[8px]） */
  --mine-mall-radius: 0 8px 0 8px;
  /* 1871:17041 文字 left 16.5 */
  --mine-mall-text-x: 16.5px;
  --mine-mall-arrow: 16px;
  /* 左上角小三角 4.5×5 */
  --mine-mall-corner: 4.5px;
  --mine-nav-h: 96px;
  --mine-nav-capsule-right: 6.29px;
  --mine-nav-capsule-top: 52.4px;
  /* 1871:16592 渐变层高（比页面高 40，被 overflow:clip 裁） */
  --mine-bg-h: 852px;
  /* 1872:17168 卡内 left 36 */
  --mine-func-item1-x: 36.0px;
  /* 1872:17169 卡内 left 150（步进 114） */
  --mine-func-item2-x: 150.0px;
  /* 1872:17170 卡内 left 264（步进 114） */
  --mine-func-item3-x: 264.0px;
  /* 卡内 top 8，对齐新版功能行内边距 */
  --mine-func-item-y: 8.0px;
  /* 前两项框宽 48（40 圆底居中 x4） */
  --mine-func-item-w1: 48.0px;
  /* 第三项框宽 40（圆底 x0） */
  --mine-func-item-w3: 40.0px;
  /* ★ 1871:17038 渐变矩形在组件内 left 4.5（不是贴边 0） */
  --mine-mall-bg-x: 4.5px;
  /* ★ 1871:16726 箭头 left 73.5（不是垂直居中） */
  --mine-mall-arrow-x: 73.5px;
  /* ★ 1871:16726 箭头 top 10 */
  --mine-mall-arrow-y: 10px;
  /* ★ 1871:17042 角标 4.5×5 */
  --mine-mall-corner-w: 4.5px;
  --mine-mall-corner-h: 5px;
  /* ★「我的」页「Three trees」实测字高 23px → 取 24。规范原无此档（10/12/14/16/18/32） */
  --typography-headline-font-size: 24px;
  /* 行高 = 字号 + 8 */
  --typography-headline-line-height: 32px;
  /* 设计是 Hero 级（600） */
  --typography-headline-font-weight: 600;
  --case-list-bg-w: 375px;
  --case-list-bg-h: 812px;
  /* 内容区起点 y=96 */
  --case-list-content-y: 96px;
  /* 1868:10978 left 16 */
  --case-list-catnav-x: 16px;
  /* 内容区内 y=0 → 绝对 96 */
  --case-list-catnav-y: 0px;
  --case-list-catnav-h: 36px;
  /* 1868:10978 gap 8（项宽 84 → 步进 92） */
  --case-list-catnav-gap: 8px;
  --case-list-catnav-item-w: 84px;
  /* rounded-[100px] */
  --case-list-catnav-radius: 100px;
  /* subtitle 16/24 */
  --case-list-catnav-size: 16px;
  --case-list-catnav-underline-w: 48px;
  --case-list-catnav-underline-h: 3px;
  /* 项内 left 18 */
  --case-list-catnav-underline-x: 18px;
  /* 项内 top 33 */
  --case-list-catnav-underline-y: 33px;
  /* 内容区内 y=52 → 绝对 148 */
  --case-list-tag-y: 52px;
  /* 1868:11092 gap 8 */
  --case-list-tag-gap: 8px;
  --case-list-tag-h: 30px;
  --case-list-tag-radius: 4px;
  --case-list-tag-pad-x: 12px;
  --case-list-tag-pad-y: 4px;
  /* body 14/22 */
  --case-list-tag-size: 14px;
  /* 1868:11082 选中底 rgba(0,149,56,0.15) + 1px 品牌绿边 */
  --case-list-tag-on-bg: rgba(0,149,56,0.15);
  /* var(--color-border-brand) */
  --case-list-tag-on-border: #009538;
  /* 内容区内 98 + 96 */
  --case-list-list-y: 194px;
  --case-list-list-h: 636px;
  --case-list-card-w: 166px;
  --case-list-card-h: 204px;
  /* ★ 16+166=182 → 193.5，列间距 11.5（不是 12） */
  --case-list-card-gap-x: 11.5px;
  /* 行间距 216-204 = 12 */
  --case-list-card-gap-y: 12px;
  /* rounded-xl 12 */
  --case-list-card-radius: 12px;
  /* pb-[8px] */
  --case-list-card-pad-b: 8px;
  --case-list-cover-w: 166px;
  --case-list-cover-h: 140px;
  /* 只圆上两角 */
  --case-list-cover-radius: 10px;
  --case-list-card-title-w: 148px;
  /* 卡内 y=147 */
  --case-list-card-title-y: 147px;
  /* 卡内 y=176 */
  --case-list-card-sub-y: 176px;
  --case-list-badge-x: 6px;
  --case-list-badge-y: 6px;
  --case-list-badge-h: 20px;
  --case-list-badge-pad-x: 8px;
  /* ★ 10px（规范最小 10/18 这档） */
  --case-list-badge-size: 10px;
  /* 精选标签 tl10 tr2 br10 bl2 —— 用户指定「左上/右上/左下/右下 = 10/2/2/10」 */
  --case-list-badge-radius: 10px 2px 10px 2px;
  /* 设计 leading-[normal]，10px 字实测 14 */
  --case-list-badge-line-height: 14px;
  /* 封面底到标题 7（1914:8280 gap-[7px]） */
  --case-list-card-title-offset: 7px;
  /* 标题底到副标题 7 */
  --case-list-card-sub-offset: 7px;
  /* 1868:10978 opacity-80 */
  --case-list-catnav-opacity: 0.8;
  /* 1868:11085 opacity-70 */
  --case-list-tag-opacity: 0.7;
  /* 1868:11093 gap-[16px]：分类导航底 36 → tag 顶 52 */
  --case-list-tag-offset: 16px;
  /* ★ 1861:9776 内帧 91.176×33.536（实例 104×48 @x261，帧内 left 6.54/top 7.232）；之前误写 87×32（沿用首页值） */
  --case-list-nav-capsule-w: 91.176px;
  --case-list-nav-capsule-h: 33.536px;
  /* ★ 375-(261+6.54)-91.176=16.284（内帧右缘到页右缘） */
  --case-list-nav-capsule-right: 16.284px;
  /* ★ title(y44,高48) + 帧内 top 7.232 = 51.232 */
  --case-list-nav-capsule-top: 51.232px;
  /* ★ 本页状态栏 44（1861:9777 iPhone X），不是 46 */
  --case-list-nav-statusbar-h: 44px;
  /* 1861:9772 Navigation 高 96 */
  --case-list-nav-h: 96px;
  /* ★ 1914:8283 文本框卡内 left 9（字形墨量起点实测 x30-16=14） */
  --case-list-card-text-x: 9px;
  /* ★ 左列起点 16（不用 justify-content:center，否则变成 15.75 且左右不对称） */
  --case-list-list-x: 16px;
  /* ★ 滚动容器底部留白 = TabBar 58 + 系统区 34；没有它第三行卡片会被固定的 TabBar 遮住 */
  --case-list-tabbar-reserved: 92px;
  /* 1868:10978 宽 343（375−16−16）；内容 360>343，第 4 项被裁 */
  --case-list-nav-w: 343px;
  /* ★ 定位层（分类导航/列表）层叠，必须高于 mzh-case__bg */
  --case-list-overlay-z: 10;
  /* 1868:11092 tag 行宽 330（236+94；与分类导航的 343 不同） */
  --case-list-tag-row-w: 330px;
  /* ★ 已废弃：上一轮误解「可滑动」时加的渲染像素视口。最终实现按用户参考图 = 初始裁一半（视口 343）+ 横滑露出；保留值仅作参考。 */
  --case-list-nav-viewport-w: 359px;
  /* ★ 一屏高（设计稿页高）。首页内容 1050 超出此高度 → 壳内滚动 */
  --layout-viewport-height: 812px;
  /* ★ 视口全高。视口比设计稿 812 矮时手机壳按此收缩，保证固定在壳底的 TabBar 完整可见（媒体查询条件值不能用 var，但属性值可以） */
  --layout-viewport-full: 100vh;
  /* ★ 滚动容器底部留白 = TabBar 58 + 系统区 22 + 上方间距 20 + 余量；让最后一条内容能滚到可见、不被固定 TabBar 盖住 */
  --home-tabbar-reserved: 238px;
  /* ★ TabBar 层叠：必须高于滚动内容 */
  --home-tabbar-z: 20;
  /* ★ 滚动容器层叠：必须高于导航（否则导航渐变把上提的主功能白卡染绿） */
  --home-scroll-z: 10;
  /* ★ 导航层叠：必须**显式**给低值。scroll 有 z-index 后，z-index:auto 的导航仍会压住它（实测 y105~180 被染绿） */
  --home-nav-z: 1;
  /* 设计稿页高 1672（长页，壳内滚动） */
  --case-detail-page-height: 1672px;
  /* 1868:11149 背景帧是 hidden，实际页面底色为白 */
  --case-detail-page-bg: #FFFFFF;
  /* ★ 1868:11223 是小数（48+211 溢出） */
  --case-detail-nav-height: 94.697px;
  /* 标准 iPhone X 状态栏 */
  --case-detail-nav-statusbar-h: 44px;
  /* 1868:11224 title 高 48 */
  --case-detail-nav-title-h: 48px;
  /* 1868:11225 返回键 24×24 @16,12 */
  --case-detail-nav-back-size: 24px;
  /* 1868:11227 小程序胶囊（与案例列表页同款） */
  --case-detail-nav-capsule-w: 87px;
  --case-detail-nav-capsule-h: 32px;
  /* ★ 261 + 87 = 348 → right 27 */
  --case-detail-nav-capsule-right: 27px;
  /* 旧值（相对整个nav），现改用标题栏内居中的页内 offset */
  --case-detail-nav-capsule-top: 50px;
  /* 紧接导航 */
  --case-detail-banner-y: 96px;
  /* ★ 显示 211；源图 375×316.265 上提 92（top:-92） */
  --case-detail-banner-h: 211px;
  --case-detail-banner-src-h: 316.265px;
  /* ★ 1868:11294 top:-92 —— 图比容器高 105.265，向上溢出 */
  --case-detail-banner-raise: 92px;
  --case-detail-mid-x: 16px;
  --case-detail-mid-y: 319px;
  --case-detail-mid-w: 343px;
  /* ★ 段间距（title→info→proc→shop→sim）统一 24，用户 2026-09-30 确认 */
  --case-detail-gap-section: 24px;
  --case-detail-title-y: 0px;
  /* 1868:11301 gap-8 */
  --case-detail-title-gap: 8px;
  /* ★ Title/Medium 18/26（规范最大档） */
  --case-detail-title-size: 18px;
  /* Body/Regular 14/22 #222 60% */
  --case-detail-sub-size: 14px;
  --case-detail-tag-h: 22px;
  --case-detail-tag-pad-x: 4px;
  --case-detail-tag-pad-y: 2px;
  --case-detail-tag-radius: 4px;
  --case-detail-tag-gap: 8px;
  /* ★ 详情页标签底 alpha 0.1（P05 筛选 tag 是 0.15） */
  --case-detail-tag-bg: rgba(0,149,56,0.1);
  /* mid 内绝对 y */
  --case-detail-info-y: 110px;
  --case-detail-info-h: 224px;
  --case-detail-info-title-h: 22px;
  /* ★ 区块标题行底 → 下方内容顶 = 8（设计稿 gap-sm）；原写 30 */
  --case-detail-info-grid-y: 8px;
  /* ★ 165.5（不是 165），gap 12 → 165.5×2+12 = 343 ✓ */
  --case-detail-info-cell-w: 165.5px;
  /* 前三行 64；末两行 42 */
  --case-detail-info-cell-h: 64px;
  --case-detail-info-cell-h-last: 42px;
  /* gap-x/y 12 */
  --case-detail-info-cell-gap: 12px;
  --case-detail-info-cell-radius: 8px;
  --case-detail-info-cell-px: 7px;
  --case-detail-info-cell-py: 10px;
  --case-detail-proc-y: 358px;
  --case-detail-proc-h: 166.33px;
  /* 1868:11381 右侧说明 12/20 #222 40% */
  --case-detail-proc-note-size: 12px;
  /* 1868:11381 卡内 right 对齐起点 */
  --case-detail-proc-note-x: 211px;
  /* ★ 三张各 106.333，gap 12 → 106.333×3+24 = 343 ✓ */
  --case-detail-proc-img-w: 106.333px;
  --case-detail-proc-img-h: 106.33px;
  --case-detail-proc-img-gap: 12px;
  --case-detail-proc-img-radius: 8px;
  /* ★ 图片占位底色 */
  --case-detail-proc-img-bg: #E3E3E3;
  /* 图与说明文字间距 */
  --case-detail-proc-cap-gap: 8px;
  --case-detail-shop-y: 548.33px;
  --case-detail-shop-h: 270px;
  /* ★ 两张各 114，间距 12（126-114） */
  --case-detail-shop-card-h: 114px;
  --case-detail-shop-card-gap: 12px;
  /* 门店图 90×90 圆角 8 */
  --case-detail-shop-thumb: 90px;
  /* 卡片内距 12 */
  --case-detail-shop-pad: 12px;
  /* ★ 90 + gap 8 = 98（文字块起点） */
  --case-detail-shop-info-x: 98px;
  --case-detail-shop-info-gap: 8px;
  /* ★ 1868:12217 评分组在 221 宽块内 left 173 */
  --case-detail-shop-score-x: 173px;
  --case-detail-star-size: 14px;
  --case-detail-sim-y: 842.33px;
  --case-detail-sim-h: 431px;
  --case-detail-sim-title-h: 22px;
  /* ★ 相似案例：标题行底 → 卡片顶 = 8（同 info-grid-y） */
  --case-detail-sim-list-y: 8px;
  /* ★ 相似案例两行间距 12（用户 2026-09-30 指定；设计稿原写 2.5） */
  --case-detail-sim-row-gap: 12px;
  /* ★ 第二列 x177.5（166 + 11.5 gap） */
  --case-detail-sim-col-x: 177.5px;
  /* ★ 相对 mid（页面 x339） */
  --case-detail-fav-x: 323px;
  --case-detail-fav-y: 3px;
  --case-detail-fav-size: 20px;
  --case-detail-btn-y: 1584px;
  --case-detail-btn-w: 343px;
  --case-detail-btn-h: 48px;
  /* ★ 用户指定 12（2026-09-30） */
  --case-detail-btn-radius: 12px;
  /* ★ 用户参考图实测：左 #139645(=品牌绿) → 右 #3AB569；上下同色 → 90deg 水平 */
  --case-detail-btn-bg: linear-gradient(90deg, #009538 0%, #3AB569 100%);
  /* ★ 滚动容器底部留白 = 按钮距壳底 40 + 按钮高 48 + 间距 40，让最后一条内容能滚到按钮上方、不被遮 */
  --case-detail-btn-reserved: 128px;
  /* ★ 按钮层叠：壳外固定，必须高于滚动内容 */
  --case-detail-cta-z: 20;
  /* ★ 用户提供的 back.svg 是 24×24（fill black 0.9），按原尺寸显示 */
  --case-detail-nav-back-icon: 24px;
  --case-detail-nav-back-x: 16px;
  --case-detail-nav-back-y: 12px;
  --case-detail-proc-img-src-w: 126px;
  --case-detail-proc-img-src-h: 106px;
  /* 水平/垂直居中 */
  --case-detail-center: 50%;
  /* translate 的负半值 */
  --case-detail-neg-half: -50%;
  /* banner 底(307) → mid 顶(319) */
  --case-detail-banner-gap: 12px;
  /* 区块标题行高 22 */
  --case-detail-sec-head-h: 22px;
  /* 1868:12217 星星与评分间距 4 */
  --case-detail-score-gap: 4px;
  /* ★ 按钮底距壳底 40（设计稿 y1584..1631、页高 1672 → 底距 40） */
  --case-detail-cta-bottom: 40px;
  /* 相似案例：标题行底 → 卡片顶 = 8 */
  --case-detail-sim-title-gap: 8px;
  /* ★ 推荐门店：标题行底(884) → 首卡顶(910) 实测间距 26，比其它段宽 */
  --case-detail-shop-list-y: 18px;
  /* ★ 灰底高 52 = 按钮底(772)→灰底顶(760) 间距 12 + 灰底顶(760)→壳底(812) 52 */
  --case-detail-cta-bar-h: 52px;
  /* ★ 灰底：与页面底色同色 #F1F3F5、**90% 透明度**（用户指定） */
  --case-detail-cta-bar-bg: rgba(241,243,245,0.9);
  /* ★ 白底容器内按钮的上偏移 = cta-bottom 40 */
  --case-detail-cta-offset: 40px;
  /* ★ 按钮上边缘 → 灰底上边缘 = 16（用户指定）。按钮不在容器内，该值仅作文档记录 */
  --case-detail-cta-bar-pad-top: 16px;
  /* ★ 灰底层叠 19：垫在按钮(20)之下、内容之上 */
  --case-detail-cta-bar-z: 19;
  /* ★ 胶囊在 48 高标题栏内垂直居中：(48-32)/2=8 */
  --case-detail-nav-capsule-offset: 8px;
  --store-bg-w: 375px;
  --store-bg-h: 812px;
  /* 1868:12075 高 96 */
  --store-top-h: 96px;
  /* ★ 1868:12080 iPhone X 状态栏 44（本页为深色图标） */
  --store-statusbar-h: 44px;
  /* title 1868:12076 高 48 */
  --store-title-row-h: 48px;
  /* 1868:12077 left 16 */
  --store-back-x: 16px;
  --store-back-box: 24px;
  /* ★ 绝对 y：title 行 y44 + (48-24)/2 = 56 */
  --store-back-y: 56px;
  /* 1868:12143 left 42 */
  --store-loc-x: 42px;
  --store-loc-size: 24px;
  /* 1868:12078 left 68（墨实测 x69） */
  --store-title-x: 68px;
  /* subtitle 16/24 Medium */
  --store-title-size: 16px;
  /* Label Color/Light/Primary */
  --store-title-color: #000000;
  /* dark/90 */
  --store-title-opacity: 0.9;
  /* ★ 本页 1868:12079 内帧 91.176×33.536（实例 104×48 @x261，帧内 right 6.29） */
  --store-capsule-w: 91.176px;
  --store-capsule-h: 33.536px;
  /* 375-(261+6.29)-91.176 = 16.534 → 实测与案例页同为 16.284 */
  --store-capsule-right: 16.284px;
  /* 48 高 title 行内垂直居中：44 + 7.232 */
  --store-capsule-top: 51.232px;
  /* 内容区 y0 → 绝对 96 */
  --store-nav-y: 96px;
  /* ★ 1868:12003 高 44（与案例页 36 不同）；项 36 高居中 → 项 y100 */
  --store-nav-row-h: 44px;
  /* 项 84×36（复用案例页 84×36 规格） */
  --store-nav-items-h: 36px;
  /* 1868:12002 px-[16px] */
  --store-nav-pad-x: 16px;
  /* 滚动视口 = 375-16-16；内容 84×4+8×3=360 → 第4项裁一半 */
  --store-nav-viewport-w: 343px;
  /* 定位层（顶部栏/分类行/列表）层叠高于背景 */
  --store-overlay-z: 10;
  --store-list-x: 16px;
  /* nav 底 140 + 16 */
  --store-list-y: 156px;
  --store-list-h: 618px;
  /* 319 内容 + 12×2 padding */
  --store-card-w: 343px;
  --store-card-h: 114px;
  /* 行距 126-114 */
  --store-card-gap-y: 12px;
  /* button-primary-radius */
  --store-card-radius: 8px;
  --store-card-pad: 12px;
  /* 缩略图与文字列 gap（1868:12149 gap-[12px]） */
  --store-card-col-gap: 12px;
  /* G1 内 gap（1868:12150 gap-[8px]） */
  --store-row-gap: 8px;
  --store-thumb-size: 90px;
  --store-thumb-radius: 8px;
  /* 图片占位底（同案例详情页） */
  --store-thumb-bg: #E3E3E3;
  --store-thumb-img-w: 111.6625px;
  --store-thumb-img-h: 89.33px;
  /* 1868:12152 x-10.75 */
  --store-thumb-img-x: -10.75px;
  --store-thumb-img-y: 0px;
  --store-body-w: 221px;
  /* 1868:12159 Star 14×14 */
  --store-star-size: 14px;
  /* 1868:12158 gap-[4px] */
  --store-rating-gap: 4px;
  --store-tag-h: 22px;
  --store-tag-pad-x: 4px;
  --store-tag-pad-y: 2px;
  /* radius-sm */
  --store-tag-radius: 4px;
  /* 1868:12208 gap-[8px] */
  --store-tag-gap: 8px;
  /* rgba(0,149,56,0.1)；实测底 (229,244,235) 与 10% 叠白一致 */
  --store-tag-bg: #0095381A;
  /* 1868:12077 内帧 9.43×17.816（图标本体 9.006×17） */
  --store-back-icon-w: 9.43px;
  --store-back-icon-h: 17.816px;
  /* 内帧 left calc(50%-0.52px)（设计就是略左偏） */
  --store-back-icon-dx: 0.52px;
  --store-detail-canvas-h: 1396px;
  --store-detail-header-h: 92px;
  --store-detail-header-title-x: 156px;
  --store-detail-banner-y: 92px;
  --store-detail-banner-h: 211px;
  --store-detail-banner-img-w: 385.75px;
  --store-detail-banner-img-h: 308.6px;
  --store-detail-banner-img-x: -5px;
  --store-detail-banner-img-y: -30px;
  --store-detail-mid-y: 287px;
  --store-detail-mid-h: 1109px;
  --store-detail-mid-radius: 20px;
  --store-detail-body-pad-t: 21px;
  --store-detail-rating-w: 70px;
  --store-detail-rating-h: 14px;
  --store-detail-address-h: 58px;
  --store-detail-address-text-w: 202px;
  --store-detail-address-gap: 69px;
  --store-detail-contact-icon: 30px;
  --store-detail-comments-h: 414px;
  --store-detail-sort-line-h: 17px;
  --store-detail-sort-divider-h: 10px;
  --store-detail-sort-divider-w: 1px;
  --store-detail-cases-h: 420px;
  --store-detail-case-overlay-w: 167px;
  --store-detail-case-overlay-x: -0.5px;
  --store-detail-case-overlay-y: 0.5px;
  --store-detail-review-h: 358px;
  --store-detail-review-author-h: 48px;
  --store-detail-review-avatar: 44px;
  --store-detail-review-author-y: 2px;
  --store-detail-review-name-w: 107px;
  --store-detail-review-date-x: 266px;
  --store-detail-review-date-w: 78px;
  --store-detail-review-date-gap: 8px;
  --store-detail-review-score-size: 13px;
  --store-detail-review-score-line: 18px;
  --store-detail-review-local-y: 52px;
  --store-detail-review-local-icon: 16px;
  --store-detail-review-local-gap: 5px;
  --store-detail-review-text-y: 82px;
  --store-detail-review-text-h: 44px;
  --store-detail-review-pics-y: 134px;
  --store-detail-review-pic: 110px;
  --store-detail-review-pic-img: 112px;
  --store-detail-review-pic-offset: -1px;
  --store-detail-review-reply-y: 254px;
  --store-detail-review-reply-w: 345px;
  --store-detail-review-reply-h: 68px;
  --store-detail-review-reply-text-w: 319px;
  --store-detail-review-footer-y: 338px;
  --store-detail-review-like-icon: 20px;
  --store-detail-review-like-count-w: 20px;
  --store-detail-sort-divider-color: #D9D9D9;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-h: 358px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-author-h: 48px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-author-y: 2px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-avatar: 44px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-name-w: 107px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-score-size: 13px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-score-line: 18px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-date-x: 266px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-date-w: 78px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-date-gap: 8px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-local-y: 52px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-local-gap: 5px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-local-icon: 16px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-text-y: 82px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-text-h: 44px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-pics-y: 134px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-pic: 110px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-pic-offset: -1px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-pic-img: 112px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-reply-y: 254px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-reply-w: 345px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-reply-h: 68px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-reply-text-w: 319px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-footer-y: 338px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-like-icon: 20px;
  /* 评价卡独立几何；保留原设计精度 */
  --review-card-like-count-w: 20px;
  /* 评价卡评分图形尺寸 */
  --review-card-rating-w: 70px;
  /* 评价卡评分图形尺寸 */
  --review-card-rating-h: 14px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-date-x: 255px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-date-w: 64px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-local-y: 56px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-text-y: 84px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-pics-y: 136px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-reply-w: 324px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-reply-text-w: 300px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-card-short-h: 274px;
  /* Figma 1869:13089 评价卡用户变体私有规格。 */
  --review-card-user-footer-short-y: 254px;
  /* 用户评价卡内容及照片条宽度；Figma VariableID:2020:2233 */
  --review-card-user-content-w: 319px;
  /* 评分分子组件星级图形宽度 */
  --rating-stars-width: 70px;
  /* 评分分子组件星级图形高度 */
  --rating-stars-height: 14px;
  /* 图片组分子组件默认图片边长 */
  --image-strip-item-size: 110px;
  --user-reviews-canvas-h: 1044px;
  --user-reviews-header-h: 96px;
  --user-reviews-banner-h: 108px;
  --user-reviews-banner-bg-y: 18px;
  --user-reviews-banner-bg-h: 90px;
  --user-reviews-bubble-x: 27.6177px;
  --user-reviews-bubble-y: 2.6484px;
  --user-reviews-bubble-w: 76.7646px;
  --user-reviews-bubble-h: 76.5084px;
  --user-reviews-star-small-x: 10.51px;
  --user-reviews-star-small-y: 75.575px;
  --user-reviews-star-small-box: 23.945px;
  --user-reviews-star-small-size: 18.197px;
  --user-reviews-star-large-x: 90px;
  --user-reviews-star-large-y: 48px;
  --user-reviews-star-large-size: 38px;
  --user-reviews-star-img-offset-x: -1.732px;
  --user-reviews-star-img-offset-y: -1.156px;
  --user-reviews-star-img-size: 21.23px;
  --user-reviews-star-large-img-x: -3.618px;
  --user-reviews-star-large-img-y: -2.413px;
  --user-reviews-star-large-img-size: 44.335px;
  --user-reviews-dot-x: 39.899px;
  --user-reviews-dot-y: 28.237px;
  --user-reviews-dot-size: 12.282px;
  --user-reviews-dot-gap: 7.676px;
  --user-reviews-metric-x: 142px;
  --user-reviews-metric-label-y: 32px;
  --user-reviews-metric-number-y: 60px;
  --user-reviews-rate-x: 251px;
  --user-reviews-rate-label-x: 254px;
  --user-reviews-rate-y: 49px;
  --user-reviews-rate-size: 32px;
  --user-reviews-rate-line: 40px;
  --user-reviews-divider-x: 230px;
  --user-reviews-divider-y: 41px;
  --user-reviews-divider-h: 44px;
  --user-reviews-radius-big: 50px;
  --user-reviews-title-x: 156px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-reply-w: 324px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-reply-text-w: 300px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-date-x: 255px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-date-w: 64px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-local-y: 56px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-text-y: 84px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-pics-y: 136px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-card-short-h: 274px;
  /* 兼容旧变量；评价卡规格由 ReviewCard 持有。 */
  --user-reviews-footer-short-y: 254px;
  --user-reviews-capsule-x: 267.534px;
  --user-reviews-capsule-y: 51.232px;
  --user-reviews-capsule-w: 91.176px;
  --user-reviews-capsule-h: 33.536px;
  --user-reviews-status-x: 289.759px;
  --user-reviews-status-y: 18.16px;
  --user-reviews-status-w: 69.861px;
  --user-reviews-status-h: 11.88px;
  --user-reviews-time-x: 26.36px;
  --user-reviews-time-y: 14.23px;
  --user-reviews-time-w: 56.592px;
  --user-reviews-time-h: 21.966px;
  --user-reviews-time-size: 16.47px;
  --user-reviews-banner-gradient: linear-gradient(270deg,#139645 13.296%,#3ab569 115.37%);
  --user-reviews-dot-bg: #BAFBC7;
  --user-reviews-dot-shadow: 0 2.9px 2.9px rgba(12,77,10,.35);
  --user-reviews-star-rotation: rotate(23.51deg);
  --user-reviews-muted-opacity: 0.7;
  --user-reviews-divider-bg: linear-gradient(180deg,transparent,rgba(255,255,255,.3),transparent);
  /* 通知卡采用通用Icon40；不重复定义尺寸值 */
  --notification-card-icon-size: 40px;
  --notification-card-text-w: 271px;
  --notification-card-width: 343px;
  --notification-card-service-height: 96px;
  --notification-card-compact-height: 76px;
  /* 复用Icon40 Source，Figma VariableID:2025:2272 */
  --icon-xl-size: 40px;
  --ledger-row-text-gap: 5px;
  --ledger-row-text-w: 122px;
  --ledger-row-width: 343px;
  --ledger-row-height: 49px;
  --points-page-hero-h: 102px;
  --points-page-panel-h: 614px;
  --points-page-art-x: 254px;
  --points-page-art-y: 2px;
  --points-page-art-crop: 92px;
  --points-page-art-size: 107px;
  --points-page-art-offset: -7px;
  --points-page-balance-y: 21px;
  --points-page-balance-size: 40px;
  --points-page-balance-line: 48px;
  --points-page-unit-x: 106px;
  --points-page-unit-y: 41px;
  --points-page-nav-back-y: 57px;
  --points-page-nav-capsule-x: 277.534px;
  --points-page-nav-capsule-y: 52.288px;
  --points-page-nav-status-x: 298.759px;
  --points-page-art-shadow: 0 2px 8px rgba(60,155,84,.64);
  --profile-page-card-x: 16px;
  --profile-page-card-y: 146px;
  --profile-page-card-w: 344px;
  --profile-page-card-h: 352px;
  --profile-page-panel-x: 1px;
  --profile-page-panel-y: 38px;
  --profile-page-panel-w: 343px;
  --profile-page-panel-h: 314px;
  --profile-page-fields-top: 65px;
  --profile-page-fields-w: 311px;
  --profile-page-avatar-x: 135px;
  --profile-page-avatar-size: 75.0px;
  --profile-page-camera-x: 186px;
  --profile-page-camera-y: 47px;
  /* VariableID:2039:2283 */
  --profile-page-bg: rgba(242.0, 247.0, 250.0, 1);
  /* VariableID:2039:2284 */
  --profile-card-width: 343px;
  /* VariableID:2039:2285 */
  --profile-card-height: 314px;
  /* VariableID:2039:2286 */
  --profile-form-width: 311px;
  /* VariableID:2039:2287 */
  --profile-form-height: 170px;
  /* VariableID:2039:2288 */
  --profile-row-height: 22px;
  /* VariableID:2039:2289 */
  --profile-row-gap: 174px;
  /* VariableID:2039:2290 */
  --profile-camera-action-size: 24px;
  /* VariableID:2039:2291 */
  --profile-camera-icon-size: 16px;
  /* VariableID:2039:2292 */
  --profile-avatar-stop-1: rgba(78.64504873752594, 200.42555004358292, 124.4148999452591, 1);
  /* VariableID:2039:2293 */
  --profile-avatar-stop-2: rgba(127.00000002980232, 202.00000315904617, 118.00000056624413, 1);
  /* VariableID:2039:2294 */
  --profile-avatar-figure: rgba(216.9894540309906, 243.5784512758255, 201.79574131965637, 1);
  /* VariableID:2039:2295 */
  --profile-mask-mid: rgba(127.5, 127.5, 127.5, 1);
  /* VariableID:2039:2296 */
  --profile-mask-transparent: rgba(0, 0, 0, 0);
  --warranty-card-width: 343px;
  --warranty-card-height: 210px;
  --warranty-card-text-x: 15px;
  --warranty-card-title-y: 14px;
  --warranty-card-number-y: 122px;
  --warranty-card-footer-y: 161px;
  --warranty-card-footer-h: 49px;
  --warranty-card-label-y: 165px;
  --warranty-card-date-y: 181px;
  --warranty-card-logo-x: 284px;
  --warranty-card-logo-y: 176px;
  --warranty-card-logo-w: 50px;
  --warranty-card-logo-h: 20px;
  --warranty-card-logo-image-w: 104.35px;
  --warranty-card-footer-opacity: 0.1;
  --warranty-card-date-opacity: 0.7;
  --warranty-card-logo-opacity: 0.76;
  --warranty-card-expired-label-opacity: 0.8;
  --warranty-card-footer-shadow: inset 1.133px -1.133px 2.267px 0 rgba(255,255,255,0.4);
  --warranty-page-list-top: 127px;
  --warranty-page-list-gap: 18px;
}