:root{
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --font: var(--font-sans);
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-pill:999px;
  --fs-12:12px; --fs-13:13px; --fs-14:14px; --fs-16:16px; --fs-20:20px; --fs-28:28px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px;
  --btn-h:40px; --topbar-h:56px; --sidebar-w:240px; --content-max:1120px;
}
/* dark = default */
:root,[data-theme=dark]{
  --bg:#020812;--surface:#06111F;--surface-2:#0B1A2E;--border:#14263F;
  --text:#EAF6FD;--text-2:#9FB3CC;--text-3:#6B83A3;
  --accent:#3B82F6;--accent-hover:#60A5FA;--accent-soft:#0B2547;--accent-text:#93C5FD;--on-accent:#FFFFFF;
  --ok:#22C55E;--warn:#F59E0B;--danger:#F87171;--ok-soft:#052E1A;--warn-soft:#3A2A06;--danger-soft:#3B0D12;
  --ok-text:#4ADE80;--warn-text:#FBBF24;--danger-text:#FCA5A5;
  --brand-grad:linear-gradient(180deg,#FFFFFF 0%,#EAF6FD 45%,#4A9CE7 100%);--brand-sub:#4A9CE7;
  --glow:radial-gradient(120% 60% at 50% 115%,rgba(59,130,246,.35) 0%,rgba(4,53,113,.25) 35%,transparent 70%);
  --shadow:0 0 0 1px var(--border);--ring:0 0 0 3px rgba(59,130,246,.45);
  --btn-glow:0 0 16px rgba(59,130,246,.35);
  --btn-bg:#2563EB;--btn-bg-hover:#1D4ED8; /* white text needs >=4.5:1; #3B82F6 is 3.7:1 */
  color-scheme:dark;
}
[data-theme=light]{
  --bg:#F5F8FC;--surface:#FFFFFF;--surface-2:#EEF3FA;--border:#DCE4EF;
  --text:#020812;--text-2:#3E5068;--text-3:#7A8BA3;
  --accent:#2563EB;--accent-hover:#1D4ED8;--accent-soft:#E6EFFE;--accent-text:#1D4ED8;--on-accent:#FFFFFF;
  --ok:#16A34A;--warn:#B45309;--danger:#DC2626;--ok-soft:#DCFCE7;--warn-soft:#FEF3C7;--danger-soft:#FEE2E2;
  --ok-text:#15803D;--warn-text:#92400E;--danger-text:#B91C1C;
  --brand-grad:linear-gradient(180deg,#0B1A2E 0%,#043571 55%,#2563EB 100%);--brand-sub:#2563EB;
  --glow:radial-gradient(120% 60% at 50% 115%,rgba(37,99,235,.12) 0%,transparent 65%);
  --shadow:0 1px 2px rgba(2,8,18,.06);--ring:0 0 0 3px rgba(37,99,235,.35);
  --btn-glow:none;
  --btn-bg:var(--accent);--btn-bg-hover:var(--accent-hover);
  color-scheme:light;
}
@media (max-width:767px){:root{--btn-h:44px}}