/* Design tokens — first stylesheet on every page; defines only new --* names. */
:root {
  /* ── 颜色：表面 ── */
  /* --paper --surface --ink 沿用 legacy 层的既有定义（值相同），此处不重复声明 */
  --surface-sunken: #f0eadd;     /* 输入框底、代码底 */

  /* ── 颜色：文字（实色，已算对比度，底色为 --paper） ── */
  --text-strong: #17130f;        /* 16.3:1 标题、数值 */
  --text: #362f28;               /* 11.6:1 正文 */
  --text-muted: #6c6257;         /*  5.3:1 次要说明（AA） */
  --text-faint: #8a7f73;         /*  3.5:1 仅占位符/禁用/装饰，不承载信息 */

  /* ── 颜色：线与填充（墨色 alpha 阶梯，替代手写灰） ── */
  /* 命名为 --rule-*：legacy 层已有不同值的 --line / --line-strong */
  --rule-faint: rgba(23, 19, 15, .06);
  --rule: rgba(23, 19, 15, .11);
  --rule-strong: rgba(23, 19, 15, .24);
  --fill-1: rgba(23, 19, 15, .03);   /* hover */
  --fill-2: rgba(23, 19, 15, .06);   /* 按下 / 分段控件轨道 */
  --fill-3: rgba(23, 19, 15, .10);

  /* ── 颜色：品牌信号 ── */
  /* --signal --signal-strong 沿用 legacy 层定义（值相同） */
  --signal-stronger: #a9340f;    /* 主按钮 hover/按下 */
  --signal-4: rgba(230, 83, 34, .04);
  --signal-8: rgba(230, 83, 34, .08);
  --signal-16: rgba(230, 83, 34, .16);
  --signal-24: rgba(230, 83, 34, .24);

  /* ── 颜色：语义（错误不再复用品牌橙） ── */
  --success: #285c4d;  --success-soft: #e8f2ec;   /* 6.8:1 */
  --warning: #8f4c10;  --warning-soft: #ffefd6;   /* 5.8:1 */
  --danger:  #b42318;  --danger-soft:  #fbe9e6;   /* 5.8:1 */
  /* info 用 --text，不引入蓝色 */

  /* ── 字体 ── */
  --font-sans: "IBM Plex Sans", "Avenir Next", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-display: "Newsreader", Georgia, serif;   /* 营销页标题 + 页面级 H1，保持现状 */

  /* ── 字阶：产品界面收敛到这 9 个字号（现状全站 252 种）。
        营销页：S0 先统计当前实际渲染字号，映射到最近的 token，
        映射后渲染差 > 1px 的保留为页面变量，不强行改观感 ── */
  --fs-display: clamp(44px, 3.4vw + 28px, 76px);  --lh-display: 1.02; /* 600, -0.025em, Newsreader */
  --fs-h1: 40px;  --lh-h1: 44px;   /* 500, -0.02em；≤640px 用 32/36 */
  --fs-h2: 32px;  --lh-h2: 38px;   /* 500, -0.015em；≤640px 用 26/32 */
  --fs-h3: 20px;  --lh-h3: 28px;   /* 600, -0.01em */
  --fs-lede: 18px; --lh-lede: 28px;
  --fs-body: 16px; --lh-body: 24px;
  --fs-sm: 14px;  --lh-sm: 20px;
  --fs-xs: 13px;  --lh-xs: 18px;
  --fs-label: 12px; --lh-label: 16px;  /* Plex Mono，大写，+0.06em */
  /* 数值一律 font-variant-numeric: tabular-nums；大数值用 --fs-h1/--fs-h2 + 500，无衬线 */

  /* ── 间距：4px 基准 ── */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px;
  --s-7: 32px; --s-8: 40px; --s-9: 48px; --s-10: 64px; --s-11: 96px; --s-12: 128px;
  --section-gap: clamp(64px, 8vw, 128px);

  /* ── 布局 ── */
  --container: 1120px;
  --gutter: clamp(16px, 4vw, 32px);
  --measure: 62ch;               /* 段落最大行宽 */

  /* ── 圆角：6 档（现状 43 种） ── */
  --r-0: 0;  --r-sm: 6px;  --r-md: 8px;  --r-lg: 12px;  --r-xl: 16px;  --r-pill: 999px;

  /* ── 阴影：3 级 + 主按钮（现状 117 种） ── */
  --shadow-1: 0 0 0 1px var(--rule);
  --shadow-2: 0 1px 2px rgba(45, 32, 20, .05), 0 0 0 1px var(--rule);
  --shadow-3: 0 24px 40px -20px rgba(45, 32, 20, .14), 0 8px 16px -8px rgba(45, 32, 20, .08), 0 0 0 1px var(--rule);
  --shadow-cta: inset 0 -4px 10px rgba(120, 30, 0, .22), 0 1px 2px rgba(200, 63, 20, .25);
  --focus-ring: 0 0 0 2px var(--paper), 0 0 0 4px var(--signal);  /* 非文本对比 3.3:1 */

  /* ── 动效：4 档时长 + 3 条曲线（现状 59 种时长） ── */
  --dur-1: 120ms;   /* hover、按下、颜色变化 */
  --dur-2: 200ms;   /* 状态切换、下拉、标签、所有退场 */
  --dur-3: 320ms;   /* 面板/对话框/toast 入场、区块入场 */
  --dur-4: 600ms;   /* 一次性强调：成功勾、数字滚动 */
  --ease-standard: cubic-bezier(.2, 0, 0, 1);
  --ease-enter: cubic-bezier(.22, 1, .36, 1);
  --ease-exit: cubic-bezier(.4, 0, 1, 1);

  /* ── 层级（现状 22 种 z-index） ── */
  --z-raised: 10; --z-sticky: 100; --z-dropdown: 200; --z-toast: 300; --z-dialog: 400; --z-skip: 500;
}
