/* ══════════════════════════════════════════════════════════════════
   暗色主题 · 石板底 + 紫金点缀（data-theme="dark" 挂控制台根 div）

   放在 public/ 并由 index.html 用原始 <link> 引入（不经 Vite/Tailwind 处理）：
   Tailwind v4 的 transform 会把「含其指令的文件」里 [data-theme] 选择器中 Tailwind color 变量的
   scoped override 当 dead code 剪掉；public 文件绕过该处理，override 完整保留，运行时按
   CSS 级联生效。只 override Tailwind 内置 color 色阶 → 组件无论用 neutral 工具类、
   还是 inline var(--color-sky-600)、还是任意值，都会一并翻暗。零组件改动。

   映射：表面/边框→neutral，文本→zinc/slate，语义&角色→红/绿/琥珀/天蓝/紫/橙/靛/青/石。
   不动 --color-white（text-white 的彩色徽标须保持白字）。首页/登录(.home-root)不受影响。
   ══════════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  /* 表面 / 边框（neutral）：50=面板 100=石板基底 200=轨道·发丝边 300=强边 */
  --color-neutral-50: #1a2238;
  --color-neutral-100: #0e1525;
  --color-neutral-200: #283149;
  --color-neutral-300: #3a4666;
  --color-neutral-400: #55618a;

  /* 文本（zinc / slate）：高位→亮、低位→暗 */
  --color-zinc-950: #f7f8fc;
  --color-zinc-900: #e6e9f2;
  --color-zinc-800: #d6dbe9;
  --color-zinc-700: #bcc3d8;
  --color-zinc-600: #a6afca;
  --color-zinc-500: #8b95b3;
  --color-zinc-400: #79829f;
  --color-zinc-300: #3a4666;
  --color-zinc-200: #2a3349;
  --color-zinc-100: #1e273e;
  --color-zinc-50: #19223a;
  --color-slate-900: #e6e9f2;
  --color-slate-700: #bcc3d8;
  --color-slate-600: #a6afca;
  --color-slate-500: #94a3b8;
  --color-slate-400: #8893ad;
  --color-slate-300: #51608a;
  --color-slate-200: #2a3349;

  /* 语义 & 角色：浅底(-50/100)调暗，主色(-400/500/600/700)提亮以适应暗底 */
  --color-red-50: #2a1518;
  --color-red-100: #3a1a20;
  --color-red-200: #4d232b;
  --color-red-300: #f0a0a0;
  --color-red-500: #f0556a;
  --color-red-600: #f26d7d;
  --color-red-700: #fca5a5;
  --color-emerald-50: #0d241c;
  --color-emerald-100: #103026;
  --color-emerald-500: #10b981;
  --color-emerald-600: #34d399;
  --color-emerald-700: #6ee7b7;
  --color-amber-50: #2a2210;
  --color-amber-100: #352a12;
  --color-amber-400: #fbbf24;
  --color-amber-500: #f59e0b;
  --color-amber-600: #fbbf24;
  --color-amber-700: #f1c768;
  --color-amber-800: #fde68a;
  --color-sky-50: #0d2330;
  --color-sky-100: #0f2c3d;
  --color-sky-200: #14384d;
  --color-sky-400: #38bdf8;
  --color-sky-500: #0ea5e9;
  --color-sky-600: #38bdf8;
  --color-sky-700: #7dd3fc;
  --color-violet-50: #1f1640;
  --color-violet-100: #2a1f4d;
  --color-violet-200: #34256a;
  --color-violet-300: #9a7bf0;
  --color-violet-400: #c4b5fd;
  --color-violet-500: #a855f7;
  --color-violet-600: #a855f7;
  --color-violet-700: #c4b5fd;
  --color-indigo-400: #a5b4fc;
  --color-indigo-600: #818cf8;
  --color-teal-600: #2dd4bf;
  --color-stone-400: #c4bdb5;
  --color-stone-500: #b3aaa3;
  --color-orange-50: #2a1a0d;
  --color-orange-400: #fb923c;
  --color-orange-500: #fb923c;
  --color-orange-600: #fdba74;
}

/* 类级 plain override：这些规则引用了不翻的自定义属性（--grid-line / 固定灰），直接改实属性。 */
[data-theme="dark"] .skeleton-shimmer { background: #222c44; }
[data-theme="dark"] .skeleton-shimmer::after {
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.06) 50%, transparent 100%);
}
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3a4666; background-clip: padding-box; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4c5a82; background-clip: padding-box; }
[data-theme="dark"] .bg-grid,
[data-theme="dark"] .assess-canvas {
  background-image:
    linear-gradient(to right, rgba(168, 133, 247, 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(168, 133, 247, 0.06) 1px, transparent 1px);
}
[data-theme="dark"] .assess-canvas::before {
  background:
    radial-gradient(115% 55% at 50% -8%, rgba(56, 189, 248, 0.1), transparent 62%),
    radial-gradient(85% 45% at 100% -4%, rgba(168, 85, 247, 0.1), transparent 60%);
}