/* ==========================================================================
   设计令牌 v4 —— 天蓝**只做焦点**（客户 2026-09-19 二次评审：v3「更丑了」）

   v3 把天蓝铺成了底色：页面底、每一张表头、徽标描边、所有分隔线上都是蓝。
   低饱和的蓝铺满全屏，结果是**满眼淡蓝却没有任何重点**，加上页底 #f5f9fc 与
   白卡只差 2% 明度，卡片浮不起来 —— 比 v2 的纯白更"糊"。两版都把蓝用错了地方。

   v4 的解法是**把蓝收进一个焦点**：
     概要卡   实心天蓝底 + 白字（全页唯一的强焦点，也是唯一的大面积蓝）
     其余一切 中性灰 —— 表头、行 hover、徽标、边框、分隔线全部去蓝
   蓝只剩四个落点：概要卡实底、分区标题下划线、主按钮、正文链接。

   三档主色（沿用 v3 的分档逻辑，白字压在 sky-500 上只有 2.8:1，按钮直接不合格）：
     primary        实心卡底 / 按钮底 / 下划线（白字 5.9:1 ✓ AA）
     primary-strong hover / 压在任何带底色元素上的文字（6.4–7.6:1 ✓）
     primary-bright 纯装饰：左色条、分组竖条（2.1:1，**永不作文字色**）
   实心卡内是**两层**文字：主文字纯白，参数标签天蓝淡色（on-primary-soft，5.2:1）。

   对比度由 `batteries/tests/test_frontend_tokens.py` 逐对计算守卫 —— 改任何 hex
   前先看那个文件，新增承载文字的令牌必须同时登记进 TEXT_PAIRS。
   断点：**640 / 900 / 1200 三档**（F13 不变）。CSS 变量不能用于 media query，
   本文件只作注释标注，style.css 内硬编码这三个值。
   ========================================================================== */

:root {
  /* --- 品牌：天蓝（**只用在焦点位**，结构色一律走下面的 neutral） ---------- */
  --color-primary: #0369a1;         /* sky-700 概要卡实底 / 按钮底 / 标题下划线（白字 5.93:1 ✓ AA） */
  --color-primary-strong: #075985;  /* sky-800 hover / 压在任何带底色元素上的文字（7.6:1） */
  --color-primary-bright: #38bdf8;  /* sky-400 **仅装饰**：概要卡左色条 / 分组竖条（2.1:1） */
  --color-on-primary: #ffffff;      /* 实心天蓝底上的主文字 */
  --color-on-primary-soft: #e0f2fe; /* 实心天蓝底上的次级文字（概要卡参数标签）5.2:1 ✓ */
  --color-on-primary-glass: rgba(255, 255, 255, .14);  /* 实心卡内的玻璃块底（图片格） */
  --color-on-primary-rule: rgba(255, 255, 255, .30);   /* 实心卡内的分隔线 / 描边 */

  /* --- 结构：中性灰（v4 新增 —— C 案的支点） ------------------------------
     这组令牌是「天蓝不要再当底色用」的落点。v3 把天蓝铺在页底 + 每张表头 + 徽标边
     + 所有分隔线上，低饱和的蓝铺满全屏 = 满眼淡蓝却没有任何重点。C 案把**结构性**
     的表面全部收回中性灰，把天蓝让给唯一一个强焦点（概要卡实底）。
     改动任何一格都会同时移动「表头 / 行 hover / 悬停态 / 目录当前项」四处。 */
  --color-neutral-soft: #e8edf3;    /* 表格表头底 / 目录当前项底 */
  --color-neutral-faint: #f2f5f9;   /* 行 hover 底（比卡片沉、比页底略亮） */

  /* --- 文本（对比度按 --color-bg / --color-surface 计） ------------------- */
  --color-ink: #0f172a;        /* slate-900 主文本       16.9:1 */
  --color-ink-soft: #475569;   /* slate-600 次级文本      6.7:1 */
  --color-ink-muted: #64748b;  /* slate-500 仅 ≥14px 辅助 4.8:1 */

  /* --- 链接（统一走 strong 档：链接常压在有底色的行/卡片上） -------------- */
  --color-link: #075985;          /* 7.6:1 on 白 / 6.9:1 on 行 hover 底 */
  --color-link-visited: #475569;  /* 区分已访问 */
  --color-link-hover: #0c4a6e;    /* sky-900 9.5:1 */

  /* --- 面 ----------------------------------------------------------------- */
  --color-bg: #f2f5f9;              /* 页面底：中性偏冷灰，与白卡的明度差才够卡片浮起 */
  --color-surface: #ffffff;         /* 卡片底 */
  --color-surface-subtle: #f8fafc;  /* 交替行 / 提示卡底 */
  --color-surface-raised: #ffffff;  /* 浮层 */
  --color-border: #dde4ec;          /* 卡片描边（比 v3 的 #e2e8f0 略沉，配合中性底） */
  --color-border-strong: #c3cedb;   /* hover 态边框 */

  /* --- 语义：警示（三重编码 — 颜色 + 图标 + 文字徽标，绝不只用颜色） ------ */
  --color-warn-text: #92400e;      /* on --color-warn-bg   ~7:1 */
  --color-warn-bg: #fef3c7;
  --color-warn-border: #fcd34d;
  --color-warn-rail: #b45309;      /* 卡片左侧 4px 竖条 */
  --color-caution-text: #44403c;   /* on --color-caution-bg  ~9:1 */
  --color-caution-bg: #f5f5f4;
  --color-caution-border: #d6d3d1;
  --color-caution-rail: #78716c;
  /* 信息语义**让位给品牌蓝**：v2 的 #0c4a6e/#e0f2fe 与今天蓝主色完全同色，
     留着会让「这是品牌色还是信息态」无法区分。改用中性 slate —— 下架提示、
     状态类徽标本来就该是"归档"语气，不该抢品牌色。 */
  --color-info-text: #334155;      /* on --color-info-bg  9.5:1 */
  --color-info-bg: #f1f5f9;
  --color-info-border: #cbd5e1;
  --color-info-rail: #64748b;

  /* --- 状态 --------------------------------------------------------------- */
  --color-danger: #b91c1c;
  --color-success: #15803d;

  /* --- 高度：两级，克制使用（卡片常驻 / 浮层只在真浮层） ------------------ */
  --shadow-card: 0 1px 3px rgba(15, 23, 42, .08), 0 4px 12px rgba(15, 23, 42, .05);
  --shadow-overlay: 0 12px 32px rgba(15, 23, 42, .16);

  /* --- 字体（D7：系统 CJK 零下载 + 自托管拉丁子集预留） ------------------- */
  --font-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
               "Noto Sans SC", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Mono",
               Consolas, "Courier New", monospace;

  /* --- 字号刻度（正文移动端下限 16px，禁止更小） -------------------------- */
  --text-xs: 0.75rem;    /* 12 — 徽标 / 脚注 / 参数标签 */
  --text-sm: 0.875rem;   /* 14 — 辅助说明 / 目录项 */
  --text-base: 1rem;     /* 16 — 正文 */
  --text-lg: 1.125rem;   /* 18 — 强调正文 / 概要卡参数值 */
  --text-xl: 1.375rem;   /* 22 — 分区标题 h2 */
  --text-2xl: 1.75rem;   /* 28 — 概要卡型号（窄屏） */
  --text-3xl: 2.125rem;  /* 34 — 概要卡型号（≥900px） */
  --text-4xl: 2.5rem;    /* 40 — h1 列表页（仅 ≥900px） */

  /* 行高：正文 1.65 / 标题 1.25 / 等宽数据 1.4 */
  --leading-body: 1.65;
  --leading-heading: 1.25;
  --leading-data: 1.4;

  /* --- 间距（4px 基） ----------------------------------------------------- */
  --space-1: 0.25rem;  /*  4 */
  --space-2: 0.5rem;   /*  8 */
  --space-3: 0.75rem;  /* 12 */
  --space-4: 1rem;     /* 16 */
  --space-5: 1.25rem;  /* 20 */
  --space-6: 1.5rem;   /* 24 */
  --space-8: 2rem;     /* 32 */
  --space-10: 2.5rem;  /* 40 */
  --space-12: 3rem;    /* 48 */
  --space-16: 4rem;    /* 64 */

  /* --- 圆角 / 边界 -------------------------------------------------------- */
  --radius-sm: 6px;      /* 控件、徽标、提示卡 */
  --radius: 10px;        /* 卡片 */
  --radius-lg: 14px;     /* 浮层 */
  --border: 1px solid var(--color-border);

  /* --- 布局 --------------------------------------------------------------- */
  --max-width: 1120px;
  --measure: 68ch;       /* 长文行宽上限（D5） */
  --toc-w: 15rem;        /* 详情页左栏目录宽（≥900px）；详情页容器宽度由它派生 */

  /* --- 动效（F14：仅 hover/focus 的颜色与边框过渡） ----------------------- */
  --dur-fast: 120ms;
  --dur-base: 180ms;
  --ease-out: cubic-bezier(.2, .8, .2, 1);

  /* --- 层级（集中定义，避免样式表里散落魔法数） --------------------------- */
  --z-header: 10;
  --z-overlay: 20;
}

/* 断点标注（media query 内不可引用变量，仅供人读；style.css 同步硬编码）：
   --bp-sm:  640px   输入框与按钮并排 / 概要卡参数 3 列 / kv 两列 / 表格转回真表格
   --bp-md:  900px   页内目录转左侧固定悬停轨道 / 概要卡参数 5 列 / 厂商两组并排
   --bp-lg: 1200px   内容达到 --max-width，双侧留白（由 --max-width: 1120px 实现，
                     不是 media query —— 见 style.css 文件头） */
