:root {
  /* Brand */
  --color-brand-50: #eef6ff;
  --color-brand-100: #d9ebff;
  --color-brand-500: #1473e6;
  --color-brand-600: #0b5fcc;
  --color-brand-700: #084da8;
  --color-accent-400: #58d6c7;

  /* Neutral */
  --color-bg: #f4f7fb;
  --color-surface: #ffffff;
  --color-surface-subtle: #f8fafc;
  --color-text: #172033;
  --color-text-muted: #65718a;
  --color-border: #dfe5ef;
  --color-nav: #111a2e;
  --color-nav-hover: #1c2944;
  --color-nav-text: #dce5f5;
  --color-focus: #ffb020;
  --color-success: #17855b;

  /* Type */
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-xs: .75rem;
  --font-size-sm: .875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: clamp(2rem, 5vw, 4.5rem);
  --line-tight: 1.08;
  --line-normal: 1.65;

  /* Spacing */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* Shape/elevation */
  --radius-sm: .5rem;
  --radius-md: .875rem;
  --radius-lg: 1.25rem;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .07);
  --shadow-md: 0 14px 40px rgba(15, 23, 42, .12);

  /* Shell */
  --header-height: 72px;
  --nav-width: 272px;
  --content-max: 1180px;
  --transition-fast: 160ms ease;
}