/* ============================================================================
   Apex Toolkit 落地页 v2 · 设计令牌
   Hallmark · genre: editorial · theme: Grid（单一信号色：群青）
   本文件是该版本的颜色 / 字体 / 空间 / 动效唯一来源；
   页面 CSS 与 HTML 只能引用这里的具名令牌，不得内联裸值。
   ========================================================================== */

/* ── 字体本地化（2026-09-17）：原 Google Fonts 外链的本地替代 ────────────
   两个 woff2 是整页字符集的可变字体子集（wght 100–900），单文件覆盖全站字重。
   注意 font-weight 必须写区间 "100 900"——写单值会让其余字重被浏览器合成加粗。
   文案改动后字符集变化，需用 _font-lab/regenerate-fonts.mjs 重新生成子集。 */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../assets/fonts/archivo-latin-var.woff2") format("woff2");
}

@font-face {
  font-family: "Noto Sans SC";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../assets/fonts/noto-sans-sc-subset.woff2") format("woff2");
}

:root {
  /* ── 表面（冷调近白，hue 255；从不是纯白）───────────────── */
  --color-paper:        oklch(99%   0.003 255);
  --color-paper-2:      oklch(97.2% 0.004 255);
  --color-paper-3:      oklch(94.5% 0.005 255);

  /* ── 线条（发丝线是这套系统的深度语言）──────────────────── */
  --color-rule:         oklch(88%   0.005 255);
  --color-rule-strong:  oklch(62%   0.008 255);

  /* ── 文字（冷调近黑，从不是纯黑）───────────────────────── */
  --color-ink:          oklch(16%   0.010 255);
  --color-ink-2:        oklch(26%   0.009 255);
  --color-muted:        oklch(44%   0.008 255);

  /* ── 信号色（全页唯一强调色，selected once：群青）────────── */
  --color-accent:       oklch(45%   0.19  264);
  --color-accent-ink:   oklch(98.5% 0.003 255);   /* 群青面上的字与线 */
  --color-focus:        oklch(45%   0.19  264);   /* 焦点环 = 所选信号色 */

  /* ── 字体（单一家族：Archivo；中文由同一栈承接）──────────── */
  --font-display: "Archivo", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-body:    "Archivo", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-label:   "Archivo", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  --display-weight: 800;

  /* ── 字阶（1.25 比例；单页五档封顶）────────────────────── */
  --text-display:   clamp(40px, 7.2vw, 96px);   /* 首屏巨字 / 海报时刻 */
  --text-display-s: clamp(28px, 4vw, 56px);     /* 章节标题 */
  --text-h3:        20px;                        /* 条目与小标题 */
  --text-body:      16px;
  --text-sm:        12.5px;                      /* 小字与 caps 标签共用 */

  /* ── 字距（大写标签放，显示字号收）──────────────────────── */
  --tracking-display: -0.02em;
  --tracking-label:    0.08em;

  /* ── 空间（4pt 刻度，按角色命名）────────────────────────── */
  --space-3xs: 2px;   --space-2xs: 4px;   --space-xs:  8px;
  --space-sm:  12px;  --space-md:  16px;  --space-lg:  24px;
  --space-xl:  40px;  --space-2xl: 64px;  --space-3xl: 96px;  --space-4xl: 144px;

  /* ── 版心 ───────────────────────────────────────────────── */
  --shell: 1240px;
  --gutter: clamp(20px, 4vw, 40px);

  /* ── 动效（三档时长 + 三条缓动；hover 是唯一剧场）────────── */
  --dur-micro:   120ms;
  --dur-short:   200ms;
  --dur-long:    420ms;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ── 层级（六层具名，禁止即兴数值）──────────────────────── */
  --z-base:     1;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;
}

/* 系统降低动效偏好：过渡整体归零 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-micro: 0ms;
    --dur-short: 0ms;
    --dur-long:  0ms;
  }
}
