:root{
  /* 品牌 —— 三个强调色家族；900 档只用于需要 AA 对比度的文字 */
  --brand:        #1BAE9D;
  --brand-700:    #159183;
  --brand-900:    #0E7A6D;
  --brand-050:    #E9F7F5;
  --cta:          #ED6D1B;
  --cta-700:      #D65F13;
  --cta-900:      #C4550F;
  --sale:         #C4301C;

  /* 中性 */
  --ink:          #16202E;
  --ink-2:        #47566B;
  --ink-3:        #667180;
  --line:         #E4E8EC;
  --line-2:       #F0F3F5;
  --bg:           #FFFFFF;
  --bg-soft:      #F6F8F9;

  /* 地与图（阶段 20）——页面是「地」，内容是「图」
     白底页面上再去掉描边只会变成一堆挨着的文字块；
     底色一压下去，白面板本身就是分区，不再需要画框。
     注意：--ink-3 压在 --surface-page 上只有 4.24:1，
     所以底色上只允许 --ink / --ink-2 / --brand-900。 */
  --surface-page: #F1F4F6;

  /* 线条分级（阶段 19）——一个信息块只允许一层边界
     --line       实体边界：可点击卡片、输入控件、选中态容器
     --line-soft  弱分隔：表格行、列表分隔、区块内部的分组线
     纯容器不画边框，靠留白与标题分区 */
  --line-soft:    #EDF1F4;

  /* 版式 —— 阶段 20 把四个挨在一起的字号拉开成有跳跃的字阶 */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-display: 36px;
  --fs-stat:    40px;
  --fs-h2:      26px;
  --fs-h3:      17px;
  --fs-body:    15px;
  --fs-small:   13px;
  --fs-micro:   11px;
  --container: min(1600px, calc(100vw - 96px));
  --gap: 24px;

  /* 圆角分级：控件 < 卡片 < 大面积媒体 */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  /* 间距节奏 —— 阶段 22 起是强制的：所有 margin / padding / gap
     必须是 4 的倍数，小控件内部允许 2 的倍数半档（2 / 6 / 10 / 14 / 18 / 22）。
     1 / 3 / 5 / 7 / 9 / 26 / 38 / 42 / 58 这类随手数字不再允许。 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;

  /* 区块纵向节奏，随断点收敛 */
  --section-pad: 64px;
  --hero-gap: 40px;
  --panel-pad: 28px;
  --panel-gap: 16px;

  --shadow-1: 0 1px 2px rgba(22,32,46,.06), 0 1px 3px rgba(22,32,46,.04);
  --shadow-2: 0 6px 20px rgba(22,32,46,.08);
  --shadow-bar: 0 -6px 20px rgba(22,32,46,.10);
}