/* ═══════════════════════════════════════════════════════════════════════════
   tokens.css —— **唯一令牌文件**（契约 §2.1 设计基线 · 判据 A1）

   为什么要有这个文件
   ─────────────────────────────────────────────────────────────────────────
   landing.html 只加载 landing.css、应用页只加载 style.css。令牌若散落两处，
   落地页与工作台就**拿不到同一套令牌**（T1「三页共用一套令牌」直接不成立）。
   故：色值字面量**只允许出现在本文件**；其余 CSS 一律 `var(--…)` 引用。

   分层
   ─────────────────────────────────────────────────────────────────────────
   §1 语义令牌     —— 沿用 UI-019 / UI-018 既有名字与值（**值一字节未改**）
   §2 落地页深色令牌 —— 原在 landing.css，此处集中（landing.css 原 `:root` 已移除）
   §3 深色外壳令牌  —— P1 新增（顶栏 + 侧栏）
   §4 长尾色板     —— 从组件内联色值提炼；名字是**色板槽位**（`nn` 越小越浅），
                     不是 Tailwind 色阶，也不承诺语义。待后续期按语义归并。

   纪律
   ─────────────────────────────────────────────────────────────────────────
   - 组件层**不得**再出现 `#hex`（判据 A1：除本文件外 `src/**` 的 .css/.js/.html 计数 = 0）。
   - 本文件**首次**由 `_probe/_p1_tokens_build.mjs`（Pass A 迁移器）生成：它把原散在
     style.css / landing.css 两处 `:root` 的令牌搬来此处，并把组件层色值字面量换成 var()。
   - ★ 该迁移器是**一次性**的：它带幂等保护（`tokens.css 已存在即拒绝覆盖，退出码 2`），
     且它只懂"把 #hex 换成 var()"这一个动作，不认识后来新增的任何令牌。
     故**本文件此后是手工维护的真源**，不要再重跑那个脚本；新增令牌直接改这里。
     （原先此处写"重跑结果应逐位一致"，与脚本的实际自锁行为不符 —— 2026-09-28 更正。）
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ══ §1 语义令牌（原 style.css 两处 :root，原文搬运；圆角值按契约 §2.1 调整）══ */
  --bg: #f5f6f7;
  --card: #ffffff;
  --border: #dcdfe4;
  --text: #1f2329;
  --muted: #5c6672;
  --primary: #1e4e8c;
  --primary-soft: #eef3fa;
  /* 横幅整条染色（客户横幅 .bc-item + 编辑预览 .bc-canvas）：用明显浅级别色。
     原用 primary-soft(#eef3fa)/c-orange-01(#fff7ed)/c-green-02(#ecfdf5) 这类「近白」令牌，
     在浅色内容区（--card #fff）整条染上去视觉等于白块，用户反馈「正文下方变纯白」。
     改 100 档浅色（深字可读、实色徽标对比达标），让横幅真正「有颜色」。v1.152 起。 */
  --bc-banner-info: #dbeafe;
  --bc-banner-warn: #ffedd5;
  --bc-banner-success: #dcfce7;
  /* 横幅**正文默认前景色**。横幅是「浅色面」（上面三色都是浅底），它的前景必须自己定，
     不许继承页面正文 —— 2026-10-02 修「横幅文字变灰变淡变浅、几乎看不见」的根因：
     首页深色主题 `body.neon-home` 把 `--text` 重定向到 `--ntext`（近白 #e9eefc），
     而**没设文字色的横幅**（历史消息 / 后端未落色）正文就继承了近白 ——
     浅底(#dbeafe) + 近白字，对比度≈1.0，实测该字像素正是 #e9eefc，视觉上「整条横幅发灰发淡」。
     故单列一个**不随主题反相**的深色前景令牌，从根上断掉这条继承。
     判据：tests/verify_phase5_p02_broadcast.js 断言本令牌为深色（相对亮度 < 0.5）。 */
  --bc-banner-fg: #1f2329;
  /* ── 首页编辑器 · 取色器预设色板（板块式）────────────────────────────────
     用户 2026-10-02 要求：不要原生取色器（那套滑条 + RGB 数字框过于复杂），
     改为自定义取色器 —— 保留自由取色、删掉数字、面积更大、并且**多加板块**让可选范围更多。
     色值只在本文件写一份；`ui/color_picker.js` 只引用 `var(--cp-*)` 变量名并按需读取
     计算后的颜色 ⇒ **该模块内零 #hex 字面量**（判据 A1 因此仍只对本文件计数）。
     四个板块：灰阶 8 / 常用 12 / 浅色 8 / 深色 8。 */
  --cp-gray-1: #000000;
  --cp-gray-2: #3f3f46;
  --cp-gray-3: #71717a;
  --cp-gray-4: #a1a1aa;
  --cp-gray-5: #d4d4d8;
  --cp-gray-6: #e4e4e7;
  --cp-gray-7: #f4f4f5;
  --cp-gray-8: #ffffff;
  --cp-basic-1: #ef4444;
  --cp-basic-2: #f97316;
  --cp-basic-3: #eab308;
  --cp-basic-4: #22c55e;
  --cp-basic-5: #14b8a6;
  --cp-basic-6: #0ea5e9;
  --cp-basic-7: #3b82f6;
  --cp-basic-8: #6366f1;
  --cp-basic-9: #8b5cf6;
  --cp-basic-10: #d946ef;
  --cp-basic-11: #ec4899;
  --cp-basic-12: #a16207;
  --cp-light-1: #fee2e2;
  --cp-light-2: #ffedd5;
  --cp-light-3: #fef9c3;
  --cp-light-4: #dcfce7;
  --cp-light-5: #ccfbf1;
  --cp-light-6: #dbeafe;
  --cp-light-7: #ede9fe;
  --cp-light-8: #fce7f3;
  --cp-deep-1: #7f1d1d;
  --cp-deep-2: #7c2d12;
  --cp-deep-3: #713f12;
  --cp-deep-4: #14532d;
  --cp-deep-5: #134e4a;
  --cp-deep-6: #1e3a8a;
  --cp-deep-7: #4c1d95;
  --cp-deep-8: #831843;
  --ok: #15803d;
  --danger: #b42318;

  /* 语义色（含浅底，供徽标 / 提示 / 空状态统一取用） */
  --warn: #b45309;
  --warn-soft: #fdf6ec;
  --warn-text: #92400e;
  --ok-soft: #eef6f0;
  --danger-soft: #fbf0ef;
  --info: #1e4e8c;
  --info-soft: #eef3fa;

  /* 徽标三件套（文字 / 浅底 / 描边）—— UI-018 补。
     企业认证的状态徽标有 4 种状态，每种都要「可辨识但不重色」的三件套；
     原有令牌只有 *-soft（浅底）而无配套描边与强色文字，组件层只能写死颜色，
     会直接撞本层「颜色只能来自令牌」的纪律（verify_phase5_p04_ui_polish.js 就是抓这个的）。 */
  --warn-bg: #fbf0d9;
  --warn-border: #ecd9b0;
  --ok-bg: #eef6f0;
  --ok-border: #c2ddc9;
  --danger-bg: #f7e6e4;

  /* 字号阶梯 */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 14px;
  --fs-lg: 15px;
  --fs-title: 17px;

  /* 间距阶梯（4 的倍数，全站对齐用） */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;
  --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  /* 圆角 */
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-pill: 999px;

  /* 阴影（1 贴地 / 2 悬浮 / 3 遮罩） */
  --shadow-1: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow-2: 0 2px 8px rgba(16, 24, 40, .07);
  --shadow-3: 0 10px 28px rgba(16, 24, 40, .16);
  /* ★ v1.164 补登：以下三枚令牌**被引用却从未声明** ⇒ 引用处整条声明**静默失效**（不是"没有样式"，是"丢掉样式"）。
     实测（2026-10-02）：`--mask` 未声明时 `.hp-img-modal-mask` 的 background 等于无值
     ⇒ **图片选择弹层没有遮罩、浮在内容上**；`--border-strong` 让首页编辑器的块手柄边框回退成 currentColor（文字色）；
     `--shadow-lg` 让该弹层没有层次。三处引用全在 `style.css`（2692 / 2741 / 2756 / 2760 / 2762）。
     登记在 `docs/UI_OPTIMIZATION_LOG.md` UI-071 §六-2，本次补齐。**未改动任何既有令牌值。** */
  --border-strong: #c3c8d0;
  --mask: rgba(15, 23, 42, .45);
  --shadow-lg: 0 16px 40px rgba(16, 24, 40, .18);
  /* ★ v1.166：开关关闭态底色（`style.css` .dp-switch 用）。
     此前该处写的是 `var(--c-red-09, #e7ebf0)` —— **语义错误**：`--c-red-09` 是**鲜红 #e5484d**
     且已定义 ⇒ 那个 `#e7ebf0` 兜底**从不生效**，基础态其实是鲜红（只因 JS 恒带 `.on`/`.off`
     才没裸露出来）。现收敛为语义令牌，并把 A1 口径内最后一处 CSS 色值字面量收进本文件。 */
  --switch-off: #e7ebf0;

  /* 中性面与派生色（供表头 / 斑马纹 / 中性徽标 / 主色悬停统一取用，
     避免组件层里出现字面色——本层纪律：颜色只能来自令牌） */
  --surface-2: #f7f8fa;
  --surface-3: #fcfcfd;
  --neutral-soft: #eceef1;
  --primary-hover: #17457c;
  --danger-border: #dcb0ab;
  --on-primary: #fff;                        /* 主色底上的前景色（对比度已核） */

  /* 交互反馈统一参数 */
  --focus-ring: 0 0 0 3px rgba(37, 99, 235, .18);
  --dur: .16s;
  --ease: cubic-bezier(.4, 0, .2, 1);

  --ink: #e7eefb;
  --ink-2: #9db0d0;
  --ink-3: #6f83a3;
  --line: rgba(120, 170, 255, .16);
  --cyan: #38bdf8;
  --sky: #7dd3fc;
  --violet: #6366f1;
  --r: 14px;


  /* ── 补充基色：纯白（多个令牌都以它为值，单列一个基名好让组件层引用）── */
  --white: #ffffff;

  /* ── 深色外壳（P1 新增；契约 §2.1）────────────────────────────────────
     顶栏 + 侧栏共用。--shell-bg 必须是**实色**（A4 要拿它算对比度），
     微渐变另用 --shell-grad。 */
  --shell-bg: #16233a;
  --shell-bg-2: #0e1726;
  --shell-grad: linear-gradient(168deg, #0e1726 0%, #16233a 100%);
  --shell-fg: #e8eef7;
  --shell-fg-muted: #93a4bd;
  --shell-border: #26364f;
  --shell-hover: #1d2d47;
  --shell-active: #1e4e8c;
  --shell-active-2: #2f6fd0;
  --shell-active-grad: linear-gradient(90deg, #2f6fd0 0%, #1e4e8c 100%);
  --shell-accent-bar: #5b9bff;
  /* ── 深底专用语义色与光晕（P1 返工-1/2 新增）──────────────────────────────
     为什么必须新开三个而不是复用浅色版：浅底语义色是按**白底**调的音量，
     搬到深底上直接不达标 —— 实测 `--ok #15803d` on `--shell-bg` = **3.14:1**（A4 要 ≥4.5）。
     下列取值均已过 A4（读数见 verify_tokens_contrast 的 p1 组）。 */
  --shell-glow: rgba(47, 111, 208, .28);  /* 登录页顶部径向光晕 */
  --shell-ok: #4ade80;                     /* 深底上的「正常/已连接」 */
  --shell-danger: #f87171;                 /* 深底上的错误提示 */
  /* 深底「柔白」：侧栏非激活菜单项的文字。
     为什么不用 --shell-fg-muted(#93a4bd)：它的相对亮度只有 **0.364**，而返工令 v1.5
     §二-返工3 的 A10-2 明确要求「.side-link 文字色亮度 > 0.6（深底浅字）」——
     该阈值是为防「深底深字」设的，muted 档在深底上虽达 6.20:1 可读，但过不了这条线。
     故另开一档柔白（亮度 **0.665**，对 --shell-bg 对比度 10.71:1），
     层次仍是三层：柔白(常态) → 纯白(悬停/选中) + 渐变底 + 高亮条。 */
  --shell-fg-dim: #ccd6e4;

  /* ── 内容宽度（原 .page 写死 960px，1600 屏右侧空 640）──────────────── */
  --content-max: 1400px;
  /* 默认档：**无侧栏**页面（队列 / 设置 / 文章库 / 发布 / 详情…）用的宽度。
     契约 §2.1「1240~1440（**含侧栏**）」的 1400 是给带侧栏的主界面算的
     （侧栏 200 + gap 20 + 内容区）；无侧栏页面套 1400 会**改写既有版式**
     —— 队列页的"6+3 折行"是按 960 容器逐格算出来的，理由详见 style.css `.page` 处注释。 */
  --page-max: 960px;

  /* ══ §4 长尾色板（从组件内联色值提炼；nn 越小越浅）══ */
  /* amber */
  --c-amber-01    : #fffbea;
  --c-amber-02    : #fef7e0;
  --c-amber-03    : #fef9c3;
  --c-amber-04    : #f3d999;
  --c-amber-05    : #f0c040;

  /* blue */
  --c-blue-01     : #fafbfc;
  --c-blue-02     : #f5f6f8;
  --c-blue-03     : #f4f5f8;
  --c-blue-04     : #f1f5f9;
  --c-blue-05     : #f3f4f6;
  --c-blue-06     : #eef2ff;
  --c-blue-07     : #eaf3ff;
  --c-blue-08     : #eef0f3;
  --c-blue-09     : #dbeafe;
  --c-blue-10     : #e6e6ee;
  --c-blue-11     : #e2e6ee;
  --c-blue-12     : #e3e6ea;
  --c-blue-13     : #d3e6ff;
  --c-blue-14     : #bcd8ff;
  --c-blue-15     : #cbd2d9;
  --c-blue-16     : #a5b4fc;
  --c-blue-17     : #818cf8;
  --c-blue-18     : #4a7dff;
  --c-blue-19     : #3b6fd4;
  --c-blue-20     : #2563eb;
  --c-blue-21     : #0858b0;
  --c-blue-22     : #1f2430;
  --c-blue-23     : #0c1a33;
  --c-blue-24     : #04101f;
  --c-blue-25     : #060b17;
  --c-blue-26     : #04070f;
  --c-blue-27     : #04060c;

  /* gray */
  --c-gray-01     : #f1f2f4;
  --c-gray-02     : #eeeeee;
  --c-gray-03     : #e5e7eb;
  --c-gray-04     : #d8d8e0;
  --c-gray-05     : #5a5148;
  --c-gray-06     : #3d4350;
  --c-gray-07     : #2b2f36;
  --c-gray-08     : #222222;
  --c-gray-09     : #111111;
  --c-gray-10     : #000000;

  /* green */
  --c-green-01    : #f0fdf4;
  --c-green-02    : #ecfdf5;
  --c-green-03    : #dcfce7;
  --c-green-04    : #eef6ee;
  --c-green-05    : #e6f4ea;
  --c-green-06    : #bfe5c8;
  --c-green-07    : #b7e1c2;
  --c-green-08    : #047857;
  --c-green-09    : #137333;
  --c-green-10    : #1a6b3c;
  --c-green-11    : #166534;

  /* orange */
  --c-orange-01   : #fff7ed;
  --c-orange-02   : #fff1e6;
  --c-orange-03   : #f3efe9;
  --c-orange-04   : #ffedd5;
  --c-orange-05   : #ffd4b8;
  --c-orange-06   : #ddd2c2;
  --c-orange-07   : #d97706;
  --c-orange-08   : #ea580c;
  --c-orange-09   : #a15c07;
  --c-orange-10   : #a04a00;
  --c-orange-11   : #854d0e;

  /* red */
  --c-red-01      : #fef2f2;
  --c-red-02      : #fdecea;
  --c-red-03      : #fce8e6;
  --c-red-04      : #fee2e2;
  --c-red-05      : #fecaca;
  --c-red-06      : #f5c6c2;
  --c-red-07      : #f5c2bd;
  --c-red-08      : #f0b8b5;
  --c-red-09      : #e5484d;
  --c-red-10      : #d93025;
  --c-red-11      : #dc2626;
  --c-red-12      : #b91c1c;
  --c-red-13      : #b3261e;
  --c-red-14      : #a50e0e;
  --c-red-15      : #991b1b;
  --c-red-16      : #7f1d1d;

  /* teal */
  --c-teal-01     : #ccfbf1;
  --c-teal-02     : #67e8f9;
  --c-teal-03     : #0d9488;

  /* violet */
  --c-violet-01   : #f3e8ff;
  --c-violet-02   : #7c3aed;

  /* ══ §6 霓虹深色玻璃主题（首页优化 · 仅 `body.neon-home` 作用域启用）══
     颜色字面量集中在此（判据 A1：本文件是唯一允许写 #hex 的地方）。
     neon-home.css 只写 var(--…)；作用域内把 --bg/--card/--text 等语义令牌
     重定向到下列暗色玻璃值，从而全站组件随令牌自适应变暗，无需逐组件改。
     本段新增令牌不会被 A4 对比度套件扫到（它只查固定的 :root 白底组合），
     故不会让"默认浅色契约"变红；默认 :root 的浅色值一字未动。 */
  --nbg-900: #070b16;
  --nbg-800: #0b1120;
  --nbg-700: #0f1729;
  --nglass:       rgba(18, 26, 46, .55);
  --nglass-2:     rgba(26, 36, 62, .42);
  --nglass-brd:   rgba(94, 234, 255, .20);
  --nglass-brd-2: rgba(139, 92, 255, .22);
  --ntext:   #e9eefc;
  --nmuted:  #9fb0d4;
  --ncyan:   #34e3ff;
  --nviolet: #8b5cff;
  --nprimary:       #5b8bff;
  --nprimary-hover: #6f9bff;
  --non-primary:    #06101f;
  --ngrad:     linear-gradient(135deg, #34e3ff 0%, #5b8bff 50%, #8b5cff 100%);
  --ngrad-soft: linear-gradient(135deg, rgba(52,227,255,.16), rgba(139,92,255,.16));
  --nglow-c: rgba(52, 227, 255, .42);
  --nglow-v: rgba(139, 92, 255, .42);
  --nline:   rgba(120, 170, 255, .10);

  /* ── §6·b 信息栏 chips 强调色（仅文章详情 .ad-info 区分用）──
     长尾词=青 / 训练词=紫 / 转化词=金 / 最高密度=薄荷绿 / 元信息=钢蓝。 */
  --k-longtail: #34e3ff;
  --k-train:    #8b5cff;
  --k-convert:  #ffcf5c;
  --k-density:  #7ef0c0;
  --k-meta:     #9fb0d4;
}

/* ═══════════════════════════════════════════════════════════════════════════
   §5 减少动态效果（判据 A5：prefers-reduced-motion: reduce 下动效时长 = 0）

   为什么必须**同时**有两道（令牌层 + 组件层兜底，后者在 style.css 末尾）
   ─────────────────────────────────────────────────────────────────────────
   全站动效时长的大头走 `var(--dur)`（组件写 `transition: background var(--dur) var(--ease)`），
   故在**令牌层**归零，一次覆盖所有读令牌的地方 —— 这是根因，因为它才是"唯一真源"。
   但组件里仍有**硬编码时长**（.12s / .15s / .18s / .2s / .25s，用于进度条、卡片悬停等
   极短反馈），令牌层管不到它们。故 style.css 末尾另加一条通配兜底，二者互补：
     令牌层 = 修根因；通配层 = 防将来新增硬编码时长漏网。
   ═══════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur: 0s; /* 交互反馈统一参数归零：transition 由"立刻到位"取代"渐变" */
  }
}