/* ------------------------------------------------------------------
   Design tokens — ported from the Aspis-bio Agora theme
   (account/shared/agora.css) as plain CSS: "Navy glass" dark by default,
   "Porcelain glass" light when the OS asks for it. Spacing/radius follow
   their scales (4/6/10/14/18/24/32 · 6/10/16/22/pill); type is
   system-only — the page's CSP (server.ts) allows no external fonts or
   CDN assets, so the display/body/mono stacks fall back to system faces.
   ------------------------------------------------------------------ */
:root {
  color-scheme: dark;
  --shell: #07101c;
  --shell-elev: #0b1727;
  --surface: #181d27;
  --panel: rgba(255, 255, 255, 0.07);
  --panel-bright: rgba(255, 255, 255, 0.12);
  --line: rgba(255, 255, 255, 0.17);
  --line-soft: rgba(255, 255, 255, 0.08);
  --ink: #f7f3ed;
  --muted: #a8b0bc;
  --accent: #f07a3f;
  --accent-soft: rgba(240, 122, 63, 0.16);
  --compute: #5fd2bd;
  --compute-soft: rgba(95, 210, 189, 0.14);
  --good: #22c55e;
  --good-soft: rgba(34, 197, 94, 0.16);
  --warn: #f59e0b;
  --warn-soft: rgba(245, 158, 11, 0.16);
  --amber: #f5c542;
  --bad: #ef4444;
  --bad-soft: rgba(239, 68, 68, 0.16);
  --track: rgba(255, 255, 255, 0.12);
  --on-accent: #0d1118;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  --s1: 4px; --s2: 6px; --s3: 10px; --s4: 14px; --s5: 18px; --s6: 24px; --s7: 32px;
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-pill: 999px;
  --display: Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  --sans: -apple-system, "Segoe UI Variable", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Mono", "Cascadia Code", Consolas, "SF Mono", monospace;
  /* Agora sidebar tokens */
  --side-bg: rgba(8, 10, 14, 0.64);
  --side-bg-2: rgba(255, 255, 255, 0.1);
  --side-text: #f4eee6;
  --side-text-soft: #a8b0bc;
  --side-line: rgba(255, 255, 255, 0.12);
  --side-active-bg: rgba(240, 122, 63, 0.18);
  --side-active-bar: var(--accent);
  --side-w: 252px;
}
@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --shell: #e8eee7;
    --shell-elev: #f2f7f1;
    --surface: #f2f7f1;
    --panel: rgba(20, 25, 35, 0.03);
    --panel-bright: rgba(20, 25, 35, 0.06);
    --line: rgba(20, 25, 35, 0.12);
    --line-soft: rgba(20, 25, 35, 0.07);
    --ink: #1b1f26;
    --muted: #5d6571;
    --accent: #2e5e55;
    --accent-soft: rgba(46, 94, 85, 0.10);
    --compute: #0f8f7a;
    --compute-soft: rgba(15, 143, 122, 0.10);
    --good: #16a34a;
    --good-soft: rgba(22, 163, 74, 0.10);
    --warn: #d97706;
    --warn-soft: rgba(217, 119, 6, 0.10);
    --amber: #7a4f06;
    --bad: #dc2626;
    --bad-soft: rgba(220, 38, 38, 0.10);
    --track: rgba(20, 25, 35, 0.08);
    --on-accent: #ffffff;
    --shadow: 0 10px 30px rgba(20, 25, 35, 0.10);
    --side-bg: rgba(232, 238, 231, 0.72);
    --side-bg-2: rgba(20, 25, 35, 0.05);
    --side-text: #1b1f26;
    --side-text-soft: #5d6571;
    --side-line: rgba(20, 25, 35, 0.12);
    --side-active-bg: rgba(46, 94, 85, 0.14);
  }
}
