/* Generated from DESIGN.md by tools/build_tokens.py. Do not edit by hand. */
:root {
  --color-primary: #024824;
  --color-surface: #F4F1E8;
  --color-surface-shaded: #EFEBDE;
  --color-ink: #14251B;
  --color-secondary: #5C6A5F;
  --color-hairline: #DCD6C6;
  --color-alert: #8A2118;
  --color-alert-tint: #F6E9E6;
  --color-warn: #7A5305;
  --color-warn-tint: #F6EFE0;

  --type-display-family: Playfair Display;
  --type-display-font-size: clamp(28px, 4vw, 42px);
  --type-display-line-height: 1.03;
  --type-display-letter-spacing: -0.022em;
  --type-heading-family: Playfair Display;
  --type-heading-font-size: 26px;
  --type-heading-line-height: 1.15;
  --type-heading-letter-spacing: -0.02em;
  --type-body-family: Inter;
  --type-body-font-size: 17px;
  --type-body-line-height: 1.55;
  --type-small-family: Inter;
  --type-small-font-size: 14.5px;
  --type-small-line-height: 1.5;
  --type-label-family: Inter;
  --type-label-font-size: 11px;
  --type-label-letter-spacing: 0.16em;
  --type-label-text-transform: uppercase;
  --type-figure-family: IBM Plex Mono;
  --type-figure-font-size: 26px;
  --type-figure-font-feature: 'tnum' 1, 'zero' 1;
  --type-figure-small-family: IBM Plex Mono;
  --type-figure-small-font-size: 13px;
  --type-figure-small-font-feature: 'tnum' 1, 'zero' 1;

  --space-0: 4px;
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 96px;

  --layout-max-width: 1120px;
  --layout-gutter: 24px;
  --layout-column-gap: 32px;
}