/* ==========================================================================
   tokens.css — 结构令牌（三套界面共用）
   --------------------------------------------------------------------------
   只放"骨架"：间距、字阶、字体、动效时长、层级、类别色驱动变量。
   配色、圆角、阴影、密度由各版本在自己的 CSS 里覆盖到 [data-view="vN"] 上。

   语义变量清单（每套界面必须提供，kit.css 依赖它们）：
     --paper --surface --surface-2 --surface-3
     --ink --ink-2 --ink-3 --ink-invert
     --line --line-strong
     --accent --accent-hover --accent-soft --accent-line --accent-ink
     --band-bg --band-ink --band-ink-2     深墨标题块（任何方案下都保持深底浅字）
     --ok --warn --danger
     --shadow-1 --shadow-2 --shadow-3
     --r-xs --r-sm --r-md --r-lg           圆角骨架（版本可覆盖）
   ========================================================================== */

:root {
  color-scheme: light;

  /* ---------- 字体族 ---------- */
  --ff-display: "Archivo Black", "Impact", "Arial Black", sans-serif;
  --ff-sans: "IBM Plex Sans", "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC",
             "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  --ff-mono: "IBM Plex Mono", "SFMono-Regular", "Consolas", "Menlo", monospace;

  /* ---------- 字阶（≈1.25 模块化比例） ---------- */
  --fs-3xs: 10.5px;
  --fs-2xs: 11.5px;
  --fs-xs:  12.5px;
  --fs-sm:  13.5px;
  --fs-md:  15px;
  --fs-lg:  18px;
  --fs-xl:  22px;
  --fs-2xl: 28px;
  --fs-3xl: 38px;
  --fs-4xl: clamp(44px, 5.5vw, 72px);
  --fs-5xl: clamp(56px, 9vw, 140px);

  --lh-tight: 1.1;
  --lh-body:  1.7;
  --tr-tight: -0.03em;
  --tr-cn:    0.02em;

  /* ---------- 间距梯度 ---------- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px;  --sp-6: 32px;  --sp-7: 48px;  --sp-8: 64px;  --sp-9: 96px;

  /* ---------- 动效骨架 ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.22, 1.35, 0.36, 1);
  --dur-fast: 160ms;
  --dur-base: 320ms;
  --dur-slow: 640ms;
  --lift: 2px;
  --enter-y: 16px;
  --stagger: 40ms;

  /* ---------- 圆角骨架 ---------- */
  --r-xs: 2px; --r-sm: 4px; --r-md: 7px; --r-lg: 14px; --r-full: 999px;

  /* ---------- 层级 ---------- */
  --z-sticky: 20;
  --z-panel: 40;
  --z-overlay: 60;
  --z-modal: 80;
  --z-toast: 90;

  /* ---------- 类别色：色相 × 明度 × 彩度 ----------
     组件只引用 --cat；各版本改明度/彩度即可整体调校，21 个分类的相对关系不变 */
  --cat-l: 0.520;
  --cat-c: 0.135;
  --cat-mix: 12%;
  --cat-fallback: oklch(0.520 0.075 60);

  /* ---------- 默认配色（启动页用；各版本会覆盖） ---------- */
  --paper:      oklch(0.972 0.006 82);
  --surface:    oklch(0.993 0.003 82);
  --surface-2:  oklch(0.952 0.008 82);
  --surface-3:  oklch(0.925 0.010 80);
  --ink:        oklch(0.235 0.018 60);
  --ink-2:      oklch(0.400 0.014 62);
  --ink-3:      oklch(0.520 0.012 65);
  --ink-invert: oklch(0.985 0.006 82);
  --line:        oklch(0.885 0.012 80);
  --line-strong: oklch(0.800 0.014 78);
  --accent:       oklch(0.530 0.190 30);
  --accent-hover: oklch(0.470 0.185 30);
  --accent-soft:  oklch(0.930 0.042 30);
  --accent-line:  oklch(0.760 0.120 30);
  --accent-ink:   oklch(0.985 0.006 82);
  --band-bg:    oklch(0.175 0.012 60);
  --band-ink:   oklch(0.972 0.006 82);
  --band-ink-2: oklch(0.775 0.010 78);
  --ok:     oklch(0.520 0.130 150);
  --warn:   oklch(0.600 0.140 75);
  --danger: oklch(0.530 0.190 30);
  --shadow-1: 0 2px 6px oklch(0.35 0.03 60 / 0.08);
  --shadow-2: 0 8px 24px oklch(0.35 0.03 60 / 0.12);
  --shadow-3: 0 24px 56px oklch(0.30 0.03 60 / 0.18);
}

/* 类别色作用域：任何需要类别色的元素都要带 .cat-h，并在行内给出 --cat-h */
.cat-h {
  --cat: oklch(var(--cat-l) var(--cat-c) var(--cat-h, 30));
  --cat-soft: color-mix(in oklab, var(--cat) var(--cat-mix), var(--surface));
}
.cat-h--neutral { --cat: var(--ink-3); --cat-soft: var(--surface-2); }