:root {
  color-scheme: dark;

  /* Brand */
  --brand-navy-950: #050b16;
  --brand-navy-900: #081120;
  --brand-navy-850: #0b1729;
  --brand-navy-800: #0d1c38;
  --brand-blue-600: #2a5fad;
  --brand-blue-400: #70b9e8;
  --brand-gold-600: #9a7c38;
  --brand-gold-500: #b69648;
  --brand-gold-400: #d4b46a;

  /* Semantic color */
  --bg-primary: var(--brand-navy-950);
  --bg-secondary: var(--brand-navy-900);
  --bg-surface: var(--brand-navy-850);
  --bg-elevated: #102039;
  --bg-light: #f4f6f9;
  --bg-light-soft: #edf1f6;
  --text-primary: #f3f6fb;
  --text-secondary: #b7c4d6;
  --text-muted: #8191a7;
  --text-dark: #0d1c38;
  --text-dark-secondary: #465970;
  --accent-primary: var(--brand-gold-500);
  --accent-primary-hover: var(--brand-gold-400);
  --accent-secondary: var(--brand-blue-400);
  --border-dark: rgba(212, 180, 106, 0.16);
  --border-light: rgba(13, 28, 56, 0.12);
  --focus-ring: #8bcdf4;
  --success: #70bd91;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Radius */
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-pill: 999px;

  /* Typography */
  --font-sans: "Satoshi", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-display: "Satoshi", "Segoe UI", system-ui, -apple-system, sans-serif;
  --text-display: clamp(2.55rem, 6vw, 5.65rem);
  --text-h2: clamp(2rem, 4.25vw, 4rem);
  --text-h3: clamp(1.15rem, 1.4vw, 1.45rem);
  --text-lead: clamp(1rem, 1.2vw, 1.2rem);
  --text-body: clamp(0.95rem, 0.35vw + 0.85rem, 1.05rem);
  --text-small: 0.875rem;
  --text-micro: 0.75rem;

  /* Layout */
  --container: min(1240px, calc(100vw - 2 * clamp(1.25rem, 4vw, 4rem)));
  --header-height: 5rem;

  /* Motion */
  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 180ms;
  --duration-base: 280ms;
  --duration-slow: 520ms;

  /* Layers */
  --z-base: 0;
  --z-content: 10;
  --z-header: 50;
  --z-fab: 60;
  --z-support: 70;
  --z-modal: 80;
  --motion: 1;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion: 0;
  }
}