:root {
  color-scheme: light;

  /* Colour */
  --color-paper: #F6F5F1;
  --color-white: #FFFFFF;
  --color-ink: #111111;
  --color-black: #080808;
  --color-text-secondary: #696864;
  --color-mist: #E9E8E4;
  --color-stone: #C8C1B8;
  --color-danger: #A33A32;
  --color-success: #345C49;
  --color-focus: #111111;
  --color-on-dark: #F6F5F1;
  --color-line: rgba(17, 17, 17, 0.15);
  --color-line-strong: rgba(17, 17, 17, 0.42);
  --color-line-dark: rgba(246, 245, 241, 0.20);
  --project-accent: #111111;

  /* Typography */
  --font-sans: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Instrument Serif", Georgia, "Times New Roman", serif;

  --font-size-2xs: 0.6875rem; /* 11 */
  --font-size-xs: 0.75rem;    /* 12 */
  --font-size-sm: 0.875rem;   /* 14 */
  --font-size-md: 1rem;       /* 16 */
  --font-size-lg: 1.125rem;   /* 18 */
  --font-size-xl: 1.25rem;    /* 20 */

  --type-display-1: clamp(3.625rem, 6.7vw, 6.5rem);
  --type-display-2: clamp(3rem, 5vw, 4.25rem);
  --type-h2: clamp(2.5rem, 4.15vw, 4rem);
  --type-h3: clamp(1.75rem, 2.4vw, 2.25rem);
  --type-h4: clamp(1.375rem, 1.8vw, 1.75rem);

  --leading-display: 0.92;
  --leading-heading: 1.00;
  --leading-body: 1.55;
  --tracking-display: -0.045em;
  --tracking-heading: -0.03em;
  --tracking-meta: 0.08em;

  /* Spacing */
  --space-1: 0.25rem;  /* 4 */
  --space-2: 0.5rem;   /* 8 */
  --space-3: 0.75rem;  /* 12 */
  --space-4: 1rem;     /* 16 */
  --space-5: 1.5rem;   /* 24 */
  --space-6: 2rem;     /* 32 */
  --space-7: 3rem;     /* 48 */
  --space-8: 4rem;     /* 64 */
  --space-9: 5rem;     /* 80 */
  --space-10: 6rem;    /* 96 */
  --space-11: 7.5rem;  /* 120 */

  /* Layout */
  --container-max: 85rem; /* 1360 */
  --reading-max: 47.5rem; /* 760 */
  --grid-columns: 12;
  --grid-gap: 1.5rem;
  --page-gutter: clamp(2rem, 3.35vw, 3rem);
  --section-space: clamp(5.5rem, 7vw, 6.5rem);
  --section-space-compact: clamp(4rem, 5vw, 5rem);

  /* Shape */
  --radius-xs: 0.125rem;
  --radius-sm: 0.25rem;

  /* Controls */
  --control-height: 3rem;
  --touch-min: 2.75rem;

  /* Motion */
  --motion-fast: 180ms;
  --motion-medium: 300ms;
  --motion-reveal: 520ms;
  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-ui: cubic-bezier(0.2, 0, 0, 1);

  /* Layers */
  --z-base: 0;
  --z-sticky: 20;
  --z-dropdown: 40;
  --z-overlay: 80;
  --z-drawer: 90;
  --z-modal: 100;

  /* Header reference token */
  --header-height: 4.5rem;
}

@media (max-width: 74.9375rem) {
  :root {
    --page-gutter: 2rem;
    --grid-gap: 1.25rem;
  }
}

@media (max-width: 56.1875rem) {
  :root {
    --grid-columns: 8;
    --page-gutter: 1.5rem;
    --section-space: 4.5rem;
    --section-space-compact: 3.5rem;
  }
}

@media (max-width: 37.4375rem) {
  :root {
    --grid-columns: 4;
    --page-gutter: 1.125rem;
    --grid-gap: 1rem;
    --section-space: 3.75rem;
    --section-space-compact: 3rem;

    --type-display-1: clamp(2.75rem, 13vw, 3.5rem);
    --type-display-2: clamp(2.5rem, 11vw, 3.125rem);
    --type-h2: clamp(2.125rem, 9.5vw, 2.75rem);
    --type-h3: clamp(1.5rem, 7vw, 1.875rem);
  }
}