:root {
  /* Dark mode (default) — deep black */
  --surface: #050505;
  --surface-dim: #050505;
  --surface-bright: #1c1c1c;
  --surface-container-lowest: #000000;
  --surface-container-low: #090909;
  --surface-container: #111111;
  --surface-container-high: #1a1a1a;
  --surface-container-highest: #222222;
  --on-surface: #ede8e3;
  --on-surface-variant: #b0a898;
  --outline: #555555;
  --outline-variant: #2a2a2a;
  --surface-tint: #f6bc67;

  /* Accent */
  --accent-gold: #bf8c3c;
  --accent-gold-dim: #8c6a2c;

  /* Primary */
  --primary: #f6bc67;
  --on-primary: #442b00;

  /* Light mode tokens */
  --light-surface: #f4f2ef;
  --light-text-primary: #1a1a1a;
  --light-text-secondary: #6b6b6b;
  --light-border: #d4d4d0;

  /* Dark mode tokens */
  --dark-surface: #050505;
  --dark-text-primary: #ede8e3;
  --dark-text-secondary: #888888;
  --dark-border: #2a2a2a;

  /* Typography */
  --font-display: 'Fragment Mono', monospace;
  --font-body: 'EB Garamond', serif;
  --font-label: 'Syne', sans-serif;

  --text-display-xl: 4.5rem;
  --text-display-lg: 3rem;
  --text-display-md: 2rem;
  --text-body-reading: 1.125rem;
  --text-body-standard: 1rem;
  --text-metadata: 0.875rem;
  --text-label-sm: 0.75rem;
  --text-label-xl: 6rem;

  --leading-display: 1.1;
  --leading-body: 1.6;
  --leading-tight: 1;

  --tracking-display: 0.02em;
  --tracking-label: 0.05em;

  /* Spacing */
  --space-base: 8px;
  --space-gap: 140px;
  --space-card: 40px;
  --space-gutter: 24px;
  --space-desktop: 104px;
  --space-tablet: 64px;
  --space-mobile: 24px;

  /* Layout */
  --max-width: 1200px;

  /* Motion */
  --ease-out-expo: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-reveal: 600ms;
  --duration-fast: 200ms;
  --duration-slow: 800ms;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.6);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.7);
  --shadow-gold: 0 0 0 1px var(--accent-gold);

  /* Border radius */
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-full: 50%;
}