/* Canonical tokens. Every variable maps to docs/DESIGN.md frontmatter. */
:root {
  color-scheme: dark;

  --color-ink-950: #07111f;
  --color-ink-900: #0d1d33;
  --color-ink-800: #19314f;
  --color-mist-100: #f1f4f7;
  --color-mist-300: #c2cad4;
  --color-mist-500: #8794a5;
  --color-signal-500: #c6a25a;
  --color-line-600: #2d4561;
  --color-line-400: #546b87;

  --font-display: "Archivo", "Arial Narrow", sans-serif;
  --font-body: "Archivo", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", Consolas, monospace;

  --type-heading-hero-size: clamp(2.75rem, 6vw, 6rem);
  --type-heading-hero-weight: 620;
  --type-heading-hero-line: 0.92;
  --type-heading-hero-track: -0.04em;
  --type-heading-xl-size: clamp(2.5rem, 4.5vw, 5rem);
  --type-heading-xl-weight: 600;
  --type-heading-xl-line: 0.98;
  --type-heading-xl-track: -0.04em;
  --type-heading-lg-size: clamp(2rem, 3vw, 3.5rem);
  --type-heading-lg-weight: 580;
  --type-heading-lg-line: 1.02;
  --type-heading-lg-track: -0.035em;
  --type-heading-md-size: clamp(1.5rem, 2vw, 2.25rem);
  --type-heading-md-weight: 560;
  --type-heading-md-line: 1.08;
  --type-heading-md-track: -0.025em;
  --type-body-lg-size: clamp(1.0625rem, 1.25vw, 1.25rem);
  --type-body-lg-weight: 400;
  --type-body-lg-line: 1.6;
  --type-body-lg-track: -0.01em;
  --type-body-md-size: 1rem;
  --type-body-md-weight: 400;
  --type-body-md-line: 1.6;
  --type-body-md-track: -0.005em;
  --type-body-sm-size: 0.875rem;
  --type-body-sm-weight: 450;
  --type-body-sm-line: 1.5;
  --type-body-sm-track: 0;
  --type-label-size: 0.8125rem;
  --type-label-weight: 600;
  --type-label-line: 1.2;
  --type-label-track: 0.01em;
  --type-mono-size: 0.75rem;
  --type-mono-weight: 450;
  --type-mono-line: 1.4;
  --type-mono-track: 0.045em;

  --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-24: 6rem;
  --space-32: 8rem;
  --space-44: 11rem;

  --layout-container-max: 90rem;
  --layout-text-measure: 66ch;
  --layout-gutter-desktop: 3rem;
  --layout-gutter-tablet: 2rem;
  --layout-gutter-mobile: 1.25rem;
  --layout-grid-gap-desktop: 1.5rem;
  --layout-grid-gap-tablet: 1.25rem;
  --layout-grid-gap-mobile: 0.75rem;

  --radius-none: 0;
  --radius-control: 0.125rem;

  --shadow-nav: 0 0.75rem 2.5rem rgb(1 11 15 / 0.32);
  --shadow-media: 0 2rem 5rem rgb(1 11 15 / 0.42);

  --motion-duration-fast: 160ms;
  --motion-duration-base: 320ms;
  --motion-duration-reveal: 560ms;
  --motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --motion-hero-desktop-scroll: 210dvh;
  --motion-hero-mobile-scroll: 171dvh;
  --motion-hero-desktop-stage: 100dvh;
  --motion-hero-mobile-stage: 92dvh;

  --layer-base: 0;
  --layer-field: 2;
  --layer-content: 10;
  --layer-header: 50;
  --layer-menu: 70;

  --component-button-height: 3rem;
  --component-button-padding-inline: var(--space-6);
  --component-header-height-desktop: 4.5rem;
  --component-header-height-mobile: 4rem;
}
