/* Scaffold design tokens — generated from tokens.json. Themes: light, dark (default: light).
   Switch theme with <html data-theme="dark">. */
:root, [data-theme="light"] {
  --page: #e6e3dc;
  --page-mark: #d4d0c7;
  --ink: #1c2023;
  --ink-soft: #545a5f;
  --surface: #f8f7f4;
  --surface-sunk: #ebe8e2;
  --line: #d3cec5;
  --line-strong: #837e76;
  --steel: #262c31;
  --steel-ink: #f1eee8;
  --hivis: #ff6c1a;
  --hivis-deep: #b8460c;
  --hivis-ink: #1c2023;
  --timber: #a86f3c;
  --timber-soft: #ecdcc5;
  --go: #2a7243;
  --stop: #b4311f;
  --chalk: #1f5cc0;
  --shadow-sm: 0 1px 0 #1c20231a, 0 2px 6px -2px #1c202326;
  --shadow-md: 0 2px 0 #1c20231f, 0 14px 26px -12px #1c202359;
  --shadow-lg: 0 30px 60px -24px #1c202373, 0 2px 0 #1c20231f;
  --shadow-plinth: 0 5px 0 #1c2023;
  --shadow-press: 0 1px 0 #1c2023;
  --shadow-inset: inset 0 2px 0 #1c202314, inset 0 0 0 1px #1c20230f;
  color-scheme: light;
}
[data-theme="dark"] {
  --page: #15191c;
  --page-mark: #1e2327;
  --ink: #eeebe4;
  --ink-soft: #a6adb3;
  --surface: #22282c;
  --surface-sunk: #1a1f22;
  --line: #353c41;
  --line-strong: #727a80;
  --steel: #0d1013;
  --steel-ink: #eeebe4;
  --hivis: #ff7a2e;
  --hivis-deep: #a4400b;
  --hivis-ink: #15191c;
  --timber: #c48a54;
  --timber-soft: #3a2c1f;
  --go: #62c48a;
  --stop: #ff8370;
  --chalk: #78abff;
  --shadow-sm: 0 1px 0 #00000059, 0 2px 6px -2px #00000073;
  --shadow-md: 0 2px 0 #00000066, 0 14px 26px -12px #000000a6;
  --shadow-lg: 0 30px 60px -24px #000000cc, 0 2px 0 #00000080;
  --shadow-plinth: 0 5px 0 #000000;
  --shadow-press: 0 1px 0 #000000;
  --shadow-inset: inset 0 2px 0 #00000059, inset 0 0 0 1px #ffffff0a;
  color-scheme: dark;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-18: 72px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-full: 9999px;
  --duration-press: 70ms;
  --duration-thunk: 260ms;
  --duration-quick: 160ms;
  --duration-slide: 320ms;
  --duration-panel: 560ms;
  --duration-settle: 720ms;
  --duration-extend: 900ms;
  --ease-press: cubic-bezier(.5, 0, .9, .4);
  --ease-thunk: cubic-bezier(.25, 1.7, .45, 1);
  --ease-slide: cubic-bezier(.16, 1, .3, 1);
  --ease-settle: cubic-bezier(.3, 1.35, .5, 1);
  --ease-exit: cubic-bezier(.4, 0, 1, 1);
  --font-display: "Big Shoulders Display", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif;
  --font-stencil: "Big Shoulders Stencil Display", "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-body: "Public Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --type-display-family: var(--font-display);
  --type-display-size: 76px;
  --type-display-line: 68px;
  --type-display-weight: 800;
  --type-display-tracking: 0.005em;
  --type-title-family: var(--font-display);
  --type-title-size: 48px;
  --type-title-line: 46px;
  --type-title-weight: 800;
  --type-title-tracking: 0.01em;
  --type-heading-family: var(--font-display);
  --type-heading-size: 28px;
  --type-heading-line: 30px;
  --type-heading-weight: 700;
  --type-heading-tracking: 0.02em;
  --type-figure-family: var(--font-display);
  --type-figure-size: 44px;
  --type-figure-line: 44px;
  --type-figure-weight: 700;
  --type-figure-tracking: 0;
  --type-stencil-family: var(--font-stencil);
  --type-stencil-size: 18px;
  --type-stencil-line: 20px;
  --type-stencil-weight: 800;
  --type-stencil-tracking: 0.12em;
  --type-lead-family: var(--font-body);
  --type-lead-size: 20px;
  --type-lead-line: 30px;
  --type-lead-weight: 400;
  --type-body-family: var(--font-body);
  --type-body-size: 16px;
  --type-body-line: 25px;
  --type-body-weight: 400;
  --type-label-family: var(--font-body);
  --type-label-size: 13px;
  --type-label-line: 16px;
  --type-label-weight: 700;
  --type-label-tracking: 0.08em;
  --type-small-family: var(--font-body);
  --type-small-size: 14px;
  --type-small-line: 20px;
  --type-small-weight: 400;
}
/* Type styles as utility classes (optional) */
.type-display { font-family: var(--type-display-family); font-size: var(--type-display-size); line-height: var(--type-display-line); font-weight: var(--type-display-weight); letter-spacing: var(--type-display-tracking); }
.type-title { font-family: var(--type-title-family); font-size: var(--type-title-size); line-height: var(--type-title-line); font-weight: var(--type-title-weight); letter-spacing: var(--type-title-tracking); }
.type-heading { font-family: var(--type-heading-family); font-size: var(--type-heading-size); line-height: var(--type-heading-line); font-weight: var(--type-heading-weight); letter-spacing: var(--type-heading-tracking); }
.type-figure { font-family: var(--type-figure-family); font-size: var(--type-figure-size); line-height: var(--type-figure-line); font-weight: var(--type-figure-weight); letter-spacing: var(--type-figure-tracking); }
.type-stencil { font-family: var(--type-stencil-family); font-size: var(--type-stencil-size); line-height: var(--type-stencil-line); font-weight: var(--type-stencil-weight); letter-spacing: var(--type-stencil-tracking); }
.type-lead { font-family: var(--type-lead-family); font-size: var(--type-lead-size); line-height: var(--type-lead-line); font-weight: var(--type-lead-weight); }
.type-body { font-family: var(--type-body-family); font-size: var(--type-body-size); line-height: var(--type-body-line); font-weight: var(--type-body-weight); }
.type-label { font-family: var(--type-label-family); font-size: var(--type-label-size); line-height: var(--type-label-line); font-weight: var(--type-label-weight); letter-spacing: var(--type-label-tracking); }
.type-small { font-family: var(--type-small-family); font-size: var(--type-small-size); line-height: var(--type-small-line); font-weight: var(--type-small-weight); }