/* ZetaMinds design tokens. Source of truth: the ZetaMinds design system on Claude.
   Dark is the default (home, tools, social). Add data-theme="light" on <html> for articles. */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,600;1,6..72,600&family=Public+Sans:wght@400;600&family=IBM+Plex+Mono:wght@500&display=swap');

:root {
  --ground: #0B1220;
  --panel: #131C2E;
  --panel-raised: #1A2540;
  --line: #22304A;
  --ink: #E8ECF4;
  --ink-muted: #B8C2D4;
  --ink-subtle: #9AA6BC;
  --accent: #FF6B4A;
  --accent-hover: #FF8E73;
  --on-accent: #0B1220;
  --data: #6EA8FF;
  --gain: var(--data);
  --loss: var(--accent);
  --focus: #6EA8FF;
  --chart-1: #6EA8FF;
  --chart-2: #FF6B4A;
  --chart-3: #2FD3C0;
  --chart-4: #FFB020;
  --chart-5: #B79CFF;
  --chart-bench: #9AA6BC;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 999px;
  --font-serif: Newsreader, Georgia, 'Times New Roman', serif;
  --font-sans: 'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace;
  color-scheme: dark;
}
[data-theme="light"] {
  --ground: #F7F7F4;
  --panel: #FFFFFF;
  --panel-raised: #F0F1F4;
  --line: #E3E5EA;
  --ink: #0F1F3D;
  --ink-muted: #3F4A61;
  --ink-subtle: #5B6478;
  --accent: #C63A22;
  --accent-hover: #9E2C18;
  --on-accent: #FFFFFF;
  --data: #1F5FBF;
  --focus: #1F5FBF;
  --chart-1: #1F5FBF;
  --chart-2: #C63A22;
  --chart-3: #0E7C70;
  --chart-4: #A86A00;
  --chart-5: #6B4FD8;
  --chart-bench: #5B6478;
  color-scheme: light;
}

body { background: var(--ground); color: var(--ink); font: 400 16px/24px var(--font-sans); margin: 0; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

.zm-display-xl { font: 600 64px/66px var(--font-serif); letter-spacing: -1px; }
.zm-display-l { font: 600 48px/52px var(--font-serif); letter-spacing: -0.8px; }
.zm-heading { font: 600 32px/38px var(--font-serif); letter-spacing: -0.4px; }
.zm-title { font: 600 22px/28px var(--font-serif); }
.zm-body-l { font: 400 18px/28px var(--font-sans); }
.zm-body { font: 400 16px/24px var(--font-sans); }
.zm-body-strong { font: 600 16px/24px var(--font-sans); }
.zm-small { font: 400 14px/20px var(--font-sans); }
.zm-label { font: 500 12px/16px var(--font-mono); letter-spacing: 1.6px; text-transform: uppercase; font-variant-numeric: tabular-nums; }
.zm-number { font: 500 16px/24px var(--font-mono); font-variant-numeric: tabular-nums; }
.zm-number-l { font: 500 32px/36px var(--font-mono); font-variant-numeric: tabular-nums; }
