:root {
  /* Brand */
  --brand-red: #E8302A;
  --brand-yellow: #F5C842;
  --brand-green: #2DB84B;
  --brand-black: #0A0A0A;
  --brand-circuit: #1E9448;

  /* Core aliases */
  --color-bg: #080c08;
  --color-surface: #0f1510;
  --color-surface-2: #16201a;
  --color-surface-3: #1c2b20;
  --color-text: #f0f4f0;
  --color-muted: #7a907a;
  --color-border: rgba(245, 200, 66, 0.14);
  --color-border-strong: rgba(245, 200, 66, 0.3);
  --color-accent: #F5C842;
  --color-accent-hover: #ffd84f;
  --color-accent-dim: #c9a030;
  --color-accent-soft: rgba(245, 200, 66, 0.1);
  --color-success: #2DB84B;
  --color-danger: #ff4d4d;
  --color-overlay: rgba(8, 12, 8, 0.78);

  /* Legacy compatibility */
  --bg: var(--color-bg);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface-2);
  --surface-3: var(--color-surface-3);
  --text: var(--color-text);
  --muted: var(--color-muted);
  --border: var(--color-border);
  --border-s: var(--color-border-strong);
  --accent: var(--color-accent);
  --accent-h: var(--color-accent-hover);
  --accent-dim: var(--color-accent-dim);
  --accent-bg: var(--color-accent-soft);
  --red: var(--brand-red);
  --green-b: var(--brand-green);

  /* Typography */
  --font-display: "Archivo Black", sans-serif;
  --font-heading: "Outfit", "Archivo", sans-serif;
  --font-body: "Outfit", "Inter", sans-serif;
  --font-mono: "JetBrains Mono", monospace;
  --f-display: var(--font-display);
  --f-heading: var(--font-heading);
  --f-body: var(--font-body);
  --f-mono: var(--font-mono);

  /* Sizing */
  --radius-xs: 0.375rem;
  --radius-sm: 0.5rem;
  --radius-md: 0.875rem;
  --radius-lg: 1.25rem;
  --radius-xl: 1.75rem;
  --radius-full: 999px;
  --r-sm: var(--radius-sm);
  --r-md: var(--radius-md);
  --r-lg: var(--radius-lg);
  --r-full: var(--radius-full);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;

  --nav-height: 4.5rem;
  --nav-h: var(--nav-height);
  --max-content: 80rem;
  --max-copy: 42rem;
  --max-readable: 68ch;
  --max-w: var(--max-content);

  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.32);
  --shadow-md: 0 8px 28px rgba(0, 0, 0, 0.38);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.46);
  --glow: 0 0 32px rgba(245, 200, 66, 0.2);

  --transition-fast: 160ms ease;
  --transition-base: 220ms ease;
}

[data-theme="light"] {
  --color-bg: #f8f5ef;
  --color-surface: #ffffff;
  --color-surface-2: #f2ede4;
  --color-surface-3: #e8e0d0;
  --color-text: #0a0c0a;
  --color-muted: #5a6a5a;
  --color-border: rgba(0, 0, 0, 0.1);
  --color-border-strong: rgba(0, 0, 0, 0.18);
  --color-accent: #c8a020;
  --color-accent-hover: #d4ac28;
  --color-accent-dim: #9f7f15;
  --color-accent-soft: rgba(200, 160, 32, 0.08);
  --color-overlay: rgba(248, 245, 239, 0.82);
}