:root {
  --ink: #0B0D0F;
  --deep-ink: #0B0D0F;
  --paper: #F4F0E8;
  --mist: #E9E6DE;
  --smoke: #70757A;
  --line: rgba(17, 19, 21, .14);
  --line-light: rgba(245, 241, 233, .2);
  --coral: #FF5A4F;
  --blue: #3D6CFF;
  --lime: #C7F000;
  --orange: var(--coral);
  --teal: var(--blue);
  --rose: var(--coral);
  --display: 'Bricolage Grotesque', sans-serif;
  --ui: 'Plus Jakarta Sans', sans-serif;
  --editorial: 'Newsreader', serif;
  --display-serif: 'Newsreader', serif;
  --data: 'IBM Plex Mono', 'Plus Jakarta Sans', monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --type-xs: 10px;
  --type-sm: 12px;
  --type-md: 16px;
  --type-lg: 22px;
  --type-xl: 42px;
  --type-hero: clamp(72px, 7.6vw, 110px);
  --type-major: clamp(42px, 5vw, 64px);
  --type-subsection: clamp(28px, 3vw, 38px);
  --type-card: clamp(18px, 1.7vw, 24px);
  --type-body: 16px;
  --type-meta: 12px;
  --radius: 8px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-pill: 999px;
  --shadow-soft: 0 12px 30px rgba(17, 19, 21, .08);
  --shadow-float: 0 24px 60px rgba(8, 9, 10, .2);
  --duration-fast: 160ms;
  --duration-base: 260ms;
  --duration-slow: 700ms;
  --ease-standard: cubic-bezier(.2, .7, .2, 1);
  --breakpoint-tablet: 900px;
  --breakpoint-mobile: 640px;
  --max: 1280px;

  /* Public design-system aliases for the next UX/UI refinement phase. */
  --color-bg: var(--paper);
  --color-dark: var(--deep-ink);
  --color-primary: var(--blue);
  --color-accent: var(--lime);
  --color-coral: var(--coral);
  --color-text: var(--ink);
  --color-muted: var(--smoke);
  --spacing: 8px;
  --shadow: var(--shadow-soft);
  --transition: var(--duration-base) var(--ease-standard);
}
