/* ============================================================
   L1 · 原始值层 —— 暖光阅读(claude)
   ------------------------------------------------------------
   这一层只写「原始值」:色值、字体、圆角、阴影、曲线。
   变量一律带 --t- 前缀,组件层禁止直接引用,只能经 tokens.css 的语义层。

   本文件的值逐个取自改造前的 tokens.css,一个不改 ——
   它是「三层令牌改造前后视觉必须一致」的比对基准。

   加一个新主题 = 复制本文件改值 + index.html 加一行 link + 注册表加一行,
   组件 CSS 与任何 JS 都不需要动。
   ============================================================ */

/* ---------- 结构无关:字体 / 字号 / 字重 / 字距 / 行高 / 圆角 / 动效 ---------- */
[data-theme-name='claude'] {
  /* 标题用衬线(claude 的 Copernicus/Tiempos 无授权,用系统衬线兜底) */
  --t-font-display: 'Songti SC', 'Source Han Serif SC', 'Noto Serif CJK SC', Georgia, 'Times New Roman', serif;
  --t-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --t-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;

  /* 字号阶梯(整数,8 点栅格友好) */
  --t-fs-display: 32px;
  --t-fs-h1: 26px;
  --t-fs-h2: 21px;
  --t-fs-h3: 18px;
  --t-fs-body: 15px;
  --t-fs-sm: 14px;
  --t-fs-xs: 13px;
  --t-fs-xxs: 12px;

  /* 字重档位。改造前组件里直接写 500/600 字面量,这里给出语义位,
     组件层迁移到 var() 之后主题就能整体调节字重(如 posthog 需要 800) */
  --t-fw-body: 400;
  --t-fw-mid: 500;
  --t-fw-strong: 600;

  /* 字距。claude 不做负字距,给 0 保持原样 */
  --t-track-display: 0;
  --t-track-title: 0;
  --t-track-body: 0;

  --t-lh-tight: 1.2;
  --t-lh-snug: 1.4;
  --t-lh-body: 1.6;
  --t-lh-loose: 1.75;

  --t-r-xs: 4px;
  --t-r-sm: 6px;
  --t-r-md: 10px;
  --t-r: 8px;
  --t-r-lg: 12px;
  --t-r-xl: 16px;
  --t-r-pill: 9999px;

  --t-dur-fast: 120ms;
  --t-dur: 180ms;
  --t-dur-slow: 280ms;
  --t-ease: cubic-bezier(.4, 0, .2, 1);
  --t-ease-out: cubic-bezier(.16, 1, .3, 1);
  --t-ease-spring: cubic-bezier(.34, 1.4, .64, 1);

  /* 按压缩放。改造前没有这个机制,给 1 表示不缩放,视觉与改造前一致 */
  --t-press: 1;

  /* 磨砂玻璃。claude 不做磨砂:alpha=1 时 glass-surface 退化为实色,
     blur 给 none,等于关闭 —— 与改造前一致 */
  --t-glass-blur: none;
  --t-glass-alpha: 1;

  /* 主题可微调的几个尺度(与字号强相关,所以归主题而非布局) */
  --t-sidebar-w: 264px;
  --t-btn-weight: 500;
  --t-nav-radius: var(--t-r);
}

/* ---------- 日间 ---------- */
[data-theme-name='claude'][data-theme='light'] {
  --t-primary: #cc785c;
  --t-primary-hover: #d98a70;
  --t-primary-active: #a9583e;
  --t-primary-soft: #f6e9e2;
  --t-on-primary: #ffffff;
  --t-focus: rgba(204, 120, 92, .32);

  --t-canvas: #faf9f5;
  --t-surface-1: #ffffff;
  --t-surface-2: #f5f0e8;
  --t-surface-3: #efe9de;
  --t-surface-4: #e8e0d2;
  /* 磨砂层底色的 RGB 三元组,供 rgb(R G B / alpha) 用 */
  --t-glass-rgb: 250 249 245;

  /* 反色块:代码块、深色卡片 */
  --t-invert: #181715;
  --t-invert-2: #1f1e1b;
  --t-on-invert: #faf9f5;
  --t-on-invert-soft: #a09d96;

  --t-ink: #141413;
  --t-ink-body: #3d3d3a;
  --t-ink-muted: #6c6a64;
  --t-ink-subtle: #8e8b82;

  --t-hairline: #e6dfd8;
  --t-hairline-soft: #ebe6df;
  --t-hairline-strong: #d8cfc4;

  --t-ok: #5db872;
  --t-ok-soft: #e8f5ea;
  --t-warn: #d4a017;
  --t-warn-soft: #fbf2dc;
  --t-danger: #c64545;
  --t-danger-soft: #fbe9e9;
  --t-info: #5db8a6;
  --t-info-soft: #e6f4f1;

  --t-scrim: rgba(20, 20, 19, .38);

  /* claude 的哲学是色块优先、阴影极少,所以整体很轻 */
  --t-shadow-0: none;
  --t-shadow-1: 0 1px 3px rgba(20, 20, 19, .08);
  --t-shadow-2: 0 6px 20px rgba(20, 20, 19, .10);
  --t-shadow-3: 0 16px 44px rgba(20, 20, 19, .16);

  /* 角色扮演文本渲染 */
  --t-rp-speech: #a9583e;
  --t-rp-inner: #8e8b82;
  --t-rp-action: #6c6a64;
  --t-rp-system-bg: #f5f0e8;
  --t-rp-system-fg: #6c6a64;
  --t-rp-think-bg: #f5f0e8;

  /* 标签气泡:8 组稳定配色(按标签文本哈希取色) */
  --t-tag1: #f6e9e2; --t-tag1f: #a9583e;
  --t-tag2: #e6f4f1; --t-tag2f: #2f7f70;
  --t-tag3: #eae6f6; --t-tag3f: #5d4a9c;
  --t-tag4: #fbf2dc; --t-tag4f: #8a6a12;
  --t-tag5: #e8f0f8; --t-tag5f: #35618f;
  --t-tag6: #f8e8f0; --t-tag6f: #94427a;
  --t-tag7: #e9f2e6; --t-tag7f: #4a7a3c;
  --t-tag8: #f0ece6; --t-tag8f: #6c6a64;
}

/* ---------- 夜间(同一主题的暗调,不是另一套设计) ---------- */
[data-theme-name='claude'][data-theme='dark'] {
  /* 深底上把珊瑚提亮一档,保证可读性 */
  --t-primary: #e0906f;
  --t-primary-hover: #eda483;
  --t-primary-active: #c4744f;
  --t-primary-soft: #3a2a22;
  --t-on-primary: #1a1512;
  --t-focus: rgba(224, 144, 111, .36);

  --t-canvas: #16150f;
  --t-surface-1: #1f1e1b;
  --t-surface-2: #252320;
  --t-surface-3: #2d2a26;
  --t-surface-4: #35312c;
  --t-glass-rgb: 31 30 27;

  --t-invert: #0f0e0c;
  --t-invert-2: #171613;
  --t-on-invert: #f3efe7;
  --t-on-invert-soft: #8e8b82;

  --t-ink: #f3efe7;
  --t-ink-body: #ddd7cc;
  --t-ink-muted: #a8a29a;
  --t-ink-subtle: #837d75;

  --t-hairline: #332f2a;
  --t-hairline-soft: #2a2723;
  --t-hairline-strong: #443f38;

  --t-ok: #74c98a;
  --t-ok-soft: #25332a;
  --t-warn: #e0b53f;
  --t-warn-soft: #372f1c;
  --t-danger: #e07070;
  --t-danger-soft: #3a2424;
  --t-info: #74c9b8;
  --t-info-soft: #1f322f;

  --t-scrim: rgba(0, 0, 0, .58);

  /* 深色背景上阴影几乎不可见,改用极轻阴影 + 依赖 surface 阶梯表达层级 */
  --t-shadow-0: none;
  --t-shadow-1: 0 1px 2px rgba(0, 0, 0, .40);
  --t-shadow-2: 0 6px 18px rgba(0, 0, 0, .46);
  --t-shadow-3: 0 16px 40px rgba(0, 0, 0, .56);

  --t-rp-speech: #eda483;
  --t-rp-inner: #948d84;
  --t-rp-action: #a8a29a;
  --t-rp-system-bg: #252320;
  --t-rp-system-fg: #a8a29a;
  --t-rp-think-bg: #252320;

  --t-tag1: #3d2a22; --t-tag1f: #e8ac91;
  --t-tag2: #1f322f; --t-tag2f: #8ad5c5;
  --t-tag3: #2b2540; --t-tag3f: #b3a4e8;
  --t-tag4: #383018; --t-tag4f: #e3c86a;
  --t-tag5: #1f2c3a; --t-tag5f: #93c2ea;
  --t-tag6: #382432; --t-tag6f: #e099c7;
  --t-tag7: #26331f; --t-tag7f: #a6d194;
  --t-tag8: #2e2b27; --t-tag8f: #bdb6ab;
}