/* 设计令牌：改自 hoverprompt-stack（官网两套皮肤 × 明暗 × 强调色）。
   <html> 上三个属性：data-theme（light|dark，缺省跟随系统）、data-style（缺省=杂志风，classic=经典）、data-accent（coral|violet|teal|blue|amber|rose|ink）。
   颜色只走变量；浅色底用 color-mix 写法，明暗都能用。 */
@font-face{font-family:"Barlow Condensed";font-weight:500;font-display:swap;src:url(../fonts/BarlowCondensed-500.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(../fonts/BarlowCondensed-600.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(../fonts/BarlowCondensed-700.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:400;font-display:swap;src:url(../fonts/Barlow-400.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:500;font-display:swap;src:url(../fonts/Barlow-500.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:600;font-display:swap;src:url(../fonts/Barlow-600.woff2) format("woff2")}

/* ── 基础层：经典浅色 ── */
:root{
  --bg:#f6f5fb;--surface:#ffffffd9;--surface-solid:#fff;--surface-2:#f1effa;--text:#1b1a24;--muted:#6c6879;
  --line:#1b1a2414;--line-strong:#1b1a2426;--accent:#7c5cff;--accent-2:#14b8a6;--gold:#e0900a;--ink:#1b1a24;--ink-text:#fff;--danger:#e5484d;
  --lime:#c9b8ff;--lime-deep:#7c5cff;--lilac:#9a86ff;--frame:transparent;
  --display:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei UI",sans-serif;
  --body:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei UI",sans-serif;
  --mono:"Cascadia Mono","JetBrains Mono",Consolas,"Microsoft YaHei UI",monospace;
  --r-panel:22px;--r-card:16px;--r-ctl:12px;--pad-panel:22px;
  /* impeccable 打磨：字号阶梯、4px 间距节奏、指数缓出（只新增令牌，不改原有值） */
  --fs-xs:12px;--fs-sm:13px;--fs-md:15px;--fs-lg:17px;--fs-xl:22px;
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;
  --ease-out:cubic-bezier(.16,1,.3,1);--dur-fast:.14s;--dur:.22s;
  --st-done:var(--accent-2);--st-run:var(--gold);--st-fail:var(--danger);--st-unsure:var(--lilac);--st-pend:color-mix(in srgb,var(--muted) 70%,transparent);
  color-scheme:light;font:15px/1.6 var(--body);color:var(--text);
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#111017;--surface:#1c1a25d9;--surface-solid:#1c1a25;--surface-2:#252233;--text:#eeecf6;--muted:#a09bb3;--line:#ffffff12;--line-strong:#ffffff24;
  --gold:#f0b03a;--ink:#eeecf6;--ink-text:#15141c;color-scheme:dark}}
:root[data-theme=dark]{
  --bg:#111017;--surface:#1c1a25d9;--surface-solid:#1c1a25;--surface-2:#252233;--text:#eeecf6;--muted:#a09bb3;--line:#ffffff12;--line-strong:#ffffff24;
  --gold:#f0b03a;--ink:#eeecf6;--ink-text:#15141c;color-scheme:dark}
:root[data-theme=light]{color-scheme:light}

/* ── 杂志风（缺省皮肤）：番茄红外框 + 米白大圆角面板 + 荧光青柠硬阴影按钮 ── */
:root:not([data-style=classic]) body.app{
  --frame:#e2432f;--bg:#f5f2ea;--surface:#fffdf7;--surface-solid:#fffdf7;--surface-2:#eee7d9;--text:#3a2314;--muted:#7b604c;
  --line:#3a23141f;--line-strong:#3a231436;--accent:#e2432f;--accent-2:#1f8f7a;--gold:#c27a08;--lime:#c9ef2e;--lime-deep:#93b513;--lilac:#8f78f0;
  --ink:#3a2314;--ink-text:#fffdf7;
  --display:"Barlow Condensed","PingFang SC","Microsoft YaHei UI","Noto Sans SC",sans-serif;
  --body:"Barlow","PingFang SC","Microsoft YaHei UI","Noto Sans SC",sans-serif;
  --r-panel:30px;--r-card:20px;--r-ctl:14px;--pad-panel:26px;
  background:var(--frame);padding:10px}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-style=classic]) body.app{
  --frame:#a8301f;--bg:#1c1512;--surface:#261d18;--surface-solid:#261d18;--surface-2:#31261f;--text:#f4e9dc;--muted:#c3aa94;--line:#f4e9dc1c;--line-strong:#f4e9dc33;
  --accent:#ff6b4e;--accent-2:#3cc4ae;--gold:#f0b03a;--ink:#f4e9dc;--ink-text:#1c1512}}
:root[data-theme=dark]:not([data-style=classic]) body.app{
  --frame:#a8301f;--bg:#1c1512;--surface:#261d18;--surface-solid:#261d18;--surface-2:#31261f;--text:#f4e9dc;--muted:#c3aa94;--line:#f4e9dc1c;--line-strong:#f4e9dc33;
  --accent:#ff6b4e;--accent-2:#3cc4ae;--gold:#f0b03a;--ink:#f4e9dc;--ink-text:#1c1512}

/* ── 强调色：杂志风同时换外框 ── */
:root[data-accent=coral]{--accent:#e2432f}:root[data-accent=violet]{--accent:#6d4fd8}:root[data-accent=teal]{--accent:#0f8f80}
:root[data-accent=blue]{--accent:#2463d6}:root[data-accent=amber]{--accent:#c56d05}:root[data-accent=rose]{--accent:#d6336c}:root[data-accent=ink]{--accent:#2a2a2a}
:root[data-accent=coral]:not([data-style=classic]) body.app{--frame:#e2432f;--accent:#e2432f}
:root[data-accent=violet]:not([data-style=classic]) body.app{--frame:#6d4fd8;--accent:#6d4fd8}
:root[data-accent=teal]:not([data-style=classic]) body.app{--frame:#0f8f80;--accent:#0f8f80}
:root[data-accent=blue]:not([data-style=classic]) body.app{--frame:#2463d6;--accent:#2463d6}
:root[data-accent=amber]:not([data-style=classic]) body.app{--frame:#d97a06;--accent:#b86200}
:root[data-accent=rose]:not([data-style=classic]) body.app{--frame:#d6336c;--accent:#d6336c}
:root[data-accent=ink]:not([data-style=classic]) body.app{--frame:#2a2521;--accent:#2a2521}
@media (prefers-color-scheme:dark){:root[data-accent=ink]:not([data-theme=light]){--accent:#d9d3c8}:root[data-accent=ink]:not([data-theme=light]):not([data-style=classic]) body.app{--frame:#3a332d;--accent:#d9d3c8}}
:root[data-accent=ink][data-theme=dark]{--accent:#d9d3c8}:root[data-accent=ink][data-theme=dark]:not([data-style=classic]) body.app{--frame:#3a332d;--accent:#d9d3c8}

.swatch[data-accent=default]{--sw:conic-gradient(#e2432f 0 50%,#7c5cff 50%)}.swatch[data-accent=coral]{--sw:#e2432f}.swatch[data-accent=violet]{--sw:#6d4fd8}
.swatch[data-accent=teal]{--sw:#0f8f80}.swatch[data-accent=blue]{--sw:#2463d6}.swatch[data-accent=amber]{--sw:#d97a06}.swatch[data-accent=rose]{--sw:#d6336c}.swatch[data-accent=ink]{--sw:#2a2a2a}

/* 2026-10-29 样式全量修复：--st-* 在 :root 解析时取的是经典皮肤的 --accent-2/--gold，杂志风 body.app 覆盖后不生效 → 在 body.app 上重新声明，让状态色跟随皮肤与明暗；
   文字用强调/状态色时加 --*-text 变体（与正文色混合）以满足 4.5:1 对比度 */
body.app{
  --st-done:var(--accent-2);--st-run:var(--gold);--st-fail:var(--danger);--st-unsure:var(--lilac);--st-pend:color-mix(in srgb,var(--muted) 70%,transparent);
  --accent-text:color-mix(in srgb,var(--accent) 70%,var(--text));--danger-text:color-mix(in srgb,var(--danger) 78%,var(--text));
  --st-done-text:color-mix(in srgb,var(--st-done) 56%,var(--text));--st-run-text:color-mix(in srgb,var(--st-run) 58%,var(--text));--st-fail-text:color-mix(in srgb,var(--st-fail) 78%,var(--text));
}
