/* ============================================================
   AI 讲台 · 设计令牌（tokens）
   来源分两部分：
   1) 色板 / 阴影 / 品牌渐变：与 design/ui-kit.html 的 :root / [data-theme="dark"] 逐字一致。
   2) 派生令牌：--on-*（压色前景，U-102）、--sp-* / --r-* / --fs-*（度量档位，
      U-103），为本仓库新增，ui-kit.html 尚未收录，需回灌后才能作为标准引用。
   禁止在此文件里写组件样式；组件见 app.css。
   【2026-10-24 三端令牌合并】--ink3 浅 #8A94A8(对白 3.05:1 ✗)→#64707F(5.04:1 ✓)、
   深 #78839A(4.53:1)→#8B96AC(5.80:1)；--wn-ink 浅 #A96800(on wn-soft 4.19:1 ✗)→#8A5F00(5.26:1 ✓)。取值规则：同一角色按主题各取「达标且对比度更高」
   的一侧（不是整体倒向某一端）；移动端 --m-* 同步到此值，合并后三端色板逐字一致。
   ============================================================ */
:root{
  --bg:#F5F7FC; --panel:#FFFFFF; --panel2:#FBFCFE; --panel3:#EEF1F8;
  --line:#E2E7F0; --line2:#EDF0F7;
  --ink:#141924; --ink2:#4C566B; --ink3:#64707F; --ink4:#AEB6C6;
  --fill:#EEF1F8; --fill-hover:#E1E6F0;
  --brand:#2B5CE6; --brand-hover:#1E46C4; --brand-ink:#1E46C4; --brand-soft:#EEF3FF; --brand-line:#CBD9FF; --on-brand:#fff;
  --ai:#7C56F2; --ai-ink:#6039E8; --ai-soft:#F3EFFF; --ai-line:#DCD1FF;
  --ok:#12A150; --ok-ink:#0B7C3C; --ok-soft:#E7F7EE; --ok-line:#BFEAD3;
  --wn:#E08B00; --wn-ink:#8A5F00; --wn-soft:#FFF6E5; --wn-line:#F6DDAE;
  --dg:#E0433F; --dg-ink:#B9312D; --dg-soft:#FDECEC; --dg-line:#F6C6C4;
  --sh-xs:0 1px 2px rgba(20,25,36,.05);
  --sh-sm:0 1px 3px rgba(20,25,36,.07),0 1px 2px rgba(20,25,36,.04);
  --sh-md:0 4px 14px rgba(20,25,36,.09);
  --sh-lg:0 14px 36px rgba(20,25,36,.12);
  --sh-xl:0 26px 64px rgba(20,25,36,.17);
  /* ---- 压色前景（U-102）---------------------------------------------
   * 用于「实色底上的文字/图标」。语义是「on X」，必须与 X 成对使用。
   * 取值原则：不硬套白，选对比度更高的一侧。--ok/--wn/--dg 都是中调实色，
   * 白字只有 2.67~4.16（不达 4.5），深墨 #05070C 可达 4.84~7.54，故取深墨。
   * --on-brand 保持白字：#2B5CE6 上白字 5.56 达标，且主按钮观感更好。
   * --on-ai 暂保持白字：见下方「渐变面」说明，属于结构性不可达，待设计定案。 */
  --on-ok:#05070C; --on-wn:#05070C; --on-dg:#05070C;
  /* ---- 视频舞台底色（V-405）--------------------------------------------
   * 视频舞台在深浅两套主题下都必须是深色：片源非 16:9 时 letterbox 会露出底色，
   * 若沿用 --ink，深色主题下 --ink 会翻成 #E9EDF5，露出的就是浅边，很刺眼。
   * 故单列一个不随主题翻转的令牌，[data-theme="dark"] 里刻意不覆盖。 */
  --stage:#141924;
  /* ---- 品牌渐变（U-203 / U-202 纳入令牌）------------------------------
   * 原分居 app.css:11 与 ui-kit.html 的内联字面量两处真源，现统一到此，
   * 组件只引用变量。四条渐变均不随主题翻转，故只有 :root 一套。
   * --grad-brand 与 --grad-ai 停靠色相同（仅角度不同）。 */
  --grad-brand:linear-gradient(135deg,#7C56F2,#2B5CE6);
  --grad-ai:linear-gradient(90deg,#7C56F2,#2B5CE6);
  --grad-av:linear-gradient(135deg,#C3D3FF,#8FADFF);
  --grad-av-p:linear-gradient(135deg,#DDD3FF,#9B7BFF);
  /* 渐变面固定前景（U-202）：--grad-* 不随主题翻转，故前景也不能借用会随主题
   * 塌成深墨的 --on-brand/--on-ai；这三项浅深同值，仅用于品牌 logo 与渐变头像。 */
  --on-grad:#FFFFFF;   /* .logo（on --grad-brand） */
  --on-av:#16359B;     /* .av（on --grad-av） */
  --on-av-p:#3B2585;   /* .av.p（on --grad-av-p） */
  /* 渐变面（--grad-ai = #7C56F2→#2B5CE6）已随 D-6 收窄最亮端：
   * 白字两端 4.70 / 5.56，最小 4.70 ≥4.5，故 --on-ai 继续用白。
   * 相关变更：--ai 浅色由 #7C5CFC 收到 #7C56F2（白字 4.38→4.70），
   * 使 .d-hero 这类「--ai→--brand」的面也能承载白字；
   * .d-hero 本身改为直接引用 --grad-ai，避免深色主题下取到调亮后的
   * --ai/#9B7BFF 而把白字压回 3.15。 */
  --on-ai:#FFFFFF;

  /* ---- 度量档位（U-103）---------------------------------------------
   * 本批只定义，替换留批 2。理由：tokens.css 此前只覆盖颜色与阴影，间距/圆角/
   * 字号全靠各组件直写，导致 app.css 出现 19 档字号（含 5 个 .5 级差）、16 档
   * 圆角，js/views 里 233 处内联 px —— 「零硬编码」在当前令牌体系下不可达。
   * 这里先把「唯一一套档位」立起来，等设计确认后再逐组件替换；本批不改任何
   * 现有样式引用，新增令牌引用数必须保持 0，零视觉风险。
   *
   * 间距：4 起跳的 8 档，覆盖 4/6/8/12/16/20/24/32（6 与 20 是为兼容既有
   * 卡片头 13px 高、按钮 padding 的常用值，保留但不鼓励新增）。
   * 圆角：6/10/14，对应「小控件 / 卡片内元素 / 卡片与面板」三档。
   * 字号：11/12/13/14/16/20，对应「徽标 / 辅助 / 正文小 / 正文 / 小标题 / 页面标题」。 */
  --sp-1:4px; --sp-2:6px; --sp-3:8px; --sp-4:12px;
  --sp-5:16px; --sp-6:20px; --sp-7:24px; --sp-8:32px;
  --r-sm:6px; --r-md:10px; --r-lg:14px;
  --fs-1:11px; --fs-2:12px; --fs-3:13px; --fs-4:14px; --fs-5:16px; --fs-6:20px;
}
[data-theme="dark"]{
  --bg:#0D121A; --panel:#151B26; --panel2:#1A212D; --panel3:#1F2734;
  --line:#2A323F; --line2:#212936;
  --ink:#E9EDF5; --ink2:#A3AEC2; --ink3:#8B96AC; --ink4:#5E6879;
  --fill:#222B3A; --fill-hover:#2C3646;
  --brand:#5C86FA; --brand-hover:#7B9EFF; --brand-ink:#A6BDFF; --brand-soft:#1A2550; --brand-line:#2C3F7D; --on-brand:#05070C;
  --ai:#9B7BFF; --ai-ink:#C0ABFF; --ai-soft:#221B3D; --ai-line:#3A2F66;
  --ok:#34C77B; --ok-ink:#7BE0A8; --ok-soft:#11291E; --ok-line:#1F4A34;
  --wn:#E5A02A; --wn-ink:#F0C47C; --wn-soft:#2A2114; --wn-line:#4A3A1C;
  --dg:#F0665F; --dg-ink:#F5A19C; --dg-soft:#301B1A; --dg-line:#542D2B;
  --sh-xs:0 1px 2px rgba(0,0,0,.4);
  --sh-sm:0 1px 3px rgba(0,0,0,.45),0 1px 2px rgba(0,0,0,.3);
  --sh-md:0 4px 14px rgba(0,0,0,.5);
  --sh-lg:0 14px 36px rgba(0,0,0,.55);
  --sh-xl:0 26px 64px rgba(0,0,0,.62);
  /* ---- 压色前景（U-102）---------------------------------------------
   * 深色主题把 --brand/--ok/--wn/--dg 整体调亮，白字在这里全部失效
   * （2.19~3.36），因此 --on-brand 也随之一并改为深墨；三个语义压色同上。
   * 深墨 #05070C 对 --brand 5.99 / --brand-hover 6.38 / --ok 9.11 /
   * --wn 8.91 / --dg 6.43，全部 ≥4.5。
   * --on-ai 仍为白字：--grad-ai 只有 :root 一套（不随主题变），深色下白字
   * 3.15~3.69 不达标，但换成深墨会让浅色侧跌到 3.62，两侧都不过，
   * 属渐变结构性不可达，一并等设计定案。 */
  --on-ok:#05070C; --on-wn:#05070C; --on-dg:#05070C; --on-ai:#FFFFFF;
}
