/*
  设计令牌 · v0.61.0（v0.69.0 起扩为**全站唯一真源**）
  ------------------------------------------------------------------
  为什么有这个文件：此前字号 / 圆角是「就近手调」的，一页里能渲染出 14 种字号
  （含 10.5px / 12.5px / 13.5px 这种半像素值）和 11 种圆角。对照现代 SaaS 后台
  同视口实测恒为 4 种字号 / 2 种圆角 —— 差距不在配色，在**没有标尺**。

  本文件就是那把标尺。规矩：
    · 字号只准用 --fs-* 六档，圆角只准用 --r-* 四档；
    · 新增样式**不许再写裸 px**（守卫 verify_v0610_tokens.py 会红）；
    · 档位值是贴着现状定的，不是照抄别人的 {12,14,16,24}，
      以免一次性把正文撑大、把固定列宽的表撑破。

  六档字号：xs 11 / sm 12 / md 13（正文基准）/ lg 14 / xl 18 / display 24
  四档圆角：sm 6 / md 12 / full 999（胶囊）/ circle 50%（头像，语义保留）

  ------------------------------------------------------------------
  v0.69.0：色板 / 间距 / 阴影 / 字体栈也收进来
  ------------------------------------------------------------------
  此前这四类散在 16 个页面各自的 :root 里，同一语义有 **4 套方言**：
    · admin / portal / exam   --text:#1f2329  --line:#E3E8F0  --bad:#A32D2D
    · report / room           --text:#111827  --line:#e5e7eb  --bad:#dc2626  --warn:#C98A0B
    · landing                 --ink/--body/--muted 自成一格（营销页，白底）
  这就是「看着不统一」的根：不是配色难看，是**同一件事有四个名字和四个值**。

  收敛口径：以 admin / portal / exam 那一套为准（页数最多、也是最近统一过的一
  套 —— 它自己就写着「与 admin 同套令牌」）。report / room / landing 向它靠拢。

  为什么要往这里收：Tailwind 的 @theme inline 直接绑这些变量，utility 编译出来
  就是 var(--brand) / var(--fs-md)，**单一真源仍然只在本文件**，而不是又多一套
  写死在构建产物里的数值（那才是真的双标尺）。
  ------------------------------------------------------------------
*/
:root{
  --fs-xs:11px;
  --fs-sm:12px;
  --fs-md:13px;
  --fs-lg:14px;
  --fs-xl:18px;
  --fs-display:24px;

  --r-sm:6px;
  --r-md:12px;
  --r-full:999px;
  --r-circle:50%;

  /* ---- 色板 ---- */
  --bg:#F3F6FA;
  --card:#fff;
  --line:#E3E8F0;
  --ink-line:#D5DCE5;
  --text:#1f2329;
  --muted:#8a9099;
  --brand:#185FA5;
  --brand-soft:#EAF2FB;
  --brand-dk:#134B82;
  --brand-line:#BFD5EC;
  --ok:#0F6E56;
  --ok-soft:#F0FAF6;
  --ok-line:#BFE3D2;
  --warn:#854F0B;
  --warn-soft:#FFF8E6;
  --warn-line:#F3E2B8;
  --bad:#A32D2D;
  --bad-soft:#FEF3F2;
  --bad-line:#F3C7C2;
  --navy:#0C2B4E;
  --navy-hover:#123A63;

  /* ---- 五档色阶（v0.72.0）----
     与 grader.ai_bands() 的四个阈值切出的**五档**一一对应：
       0–t1 / t1–t2 / t2–t3 / t3–t4 / t4–100（默认 0-20/20-40/40-60/60-80/80-100）。
     为什么单独列一组而不是复用 ok/warn/bad：那三组只有「好/警告/坏」三个语义，
     压不出五级；照参考图猜的四段色与 board.py 真切的五档对不上，档位区间会被读错。
     色阶顺序固定「红 → 橙 → 黄 → 浅绿 → 实绿」，末档用实色是为了让「80 分以上」
     在整条带子上**一眼跳出来**。 */
  --t1:#F3C7C2;
  --t2:#F0C9A0;
  --t3:#F3E2B8;
  --t4:#BFE3D2;
  --t5:#0F6E56;

  /* ---- 阴影 / 聚焦环 ---- */
  --shadow-1:0 1px 2px rgba(12,43,78,.05),0 4px 14px rgba(12,43,78,.06);
  --shadow-2:0 2px 6px rgba(12,43,78,.08),0 12px 32px rgba(12,43,78,.10);
  --ring:0 0 0 3px rgba(24,95,165,.14);

  /* ---- 间距基数（Tailwind 的 --spacing 绑它：p-1=4px、p-4=16px…）---- */
  --sp-base:4px;

  /* ---- 字体栈（变量名避开 Tailwind 的 --font-* 命名空间，否则 @theme 里
         `--font-sans: var(--font-sans)` 会自引用成环）---- */
  --ff-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;

  /* ---- 内容列左缘（v0.38.6 起由 admin 独有，随色板一并收编）---- */
  --rail:228px;
}
