/* GENERATED from 06-design-system/tokens.json v2.0.0 — do not edit by hand. Run: node build.mjs
   Dark is the brand default. Add data-theme="light" on <html> (or class theme-light) for paper-white pages; print is light automatically. */
:root {
  color-scheme: dark;
  --background: #000000;
  --surface: #1C1C1C;
  --surface-raised: #262626;
  --separator: #2E2E2E;
  --line: #FFFFFF;
  --text-primary: #FFFFFF;
  --text-secondary: #9B9B9B;
  --text-on-fill: #000000;
  --accent: #FFFFFF;
  --on-accent: #000000;
  --accent-soft: #2A2A2A;
  --scrim: #000000A6;
  --good-fill: #30D158;
  --good-text: #30D158;
  --good-soft: #0F2A17;
  --warn-fill: #FFB340;
  --warn-text: #FFB340;
  --warn-soft: #33240A;
  --bad-fill: #FF5A4F;
  --bad-text: #FF6B61;
  --bad-soft: #3A1412;
  --font-family: "Barlow", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-display: 700 56px/58px var(--font-family); --tracking-display: -0.5px;
  --font-large-title: 700 34px/40px var(--font-family); --tracking-large-title: -0.3px;
  --font-title: 700 28px/33px var(--font-family); --tracking-title: -0.2px;
  --font-title2: 700 20px/25px var(--font-family);
  --font-headline: 600 17px/22px var(--font-family);
  --font-body: 400 17px/23px var(--font-family);
  --font-callout: 400 15px/20px var(--font-family);
  --font-footnote: 500 13px/17px var(--font-family);
  --font-label: 600 13px/17px var(--font-family); --tracking-label: 0.4px;
  --font-caption: 500 12px/16px var(--font-family);
  --font-metric: 600 44px/48px var(--font-family);
  --font-metric-sm: 600 28px/32px var(--font-family);
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --space-xxxl: 64px;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --border-hairline: 1px;
  --border-line: 1.5px;
  --border-ring: 3px;
  --border-focus: 2px;
  --size-min-touch-target: 44px;
  --size-min-touch-target-android: 48px;
  --size-button-height: 52px;
  --size-button-height-sm: 40px;
  --size-row-min-height: 54px;
  --size-input-height: 52px;
  --size-chip-height: 32px;
  --size-pill-height: 24px;
  --size-status-dot: 8px;
  --size-icon-sm: 16px;
  --size-icon-md: 24px;
  --size-icon-lg: 32px;
  --size-icon-xl: 48px;
  --size-step-circle: 30px;
  --size-verdict-ring: 168px;
  --size-verdict-ring-inner: 140px;
  --size-progress-bar: 2px;
  --size-grabber-width: 36px;
  --size-grabber-height: 5px;
  --size-avatar: 40px;
  --size-line-width: 1.5px;
  --layout-screen-margin: 16px;
  --layout-section-gap: 24px;
  --layout-panel-padding: 16px;
  --layout-bottom-bar-padding: 16px;
  --layout-illustration-height: 220px;
  --layout-readable-width: 720px;
  --layout-content-max-width: 1120px;
  --layout-breakpoint-sm: 600px;
  --layout-breakpoint-md: 900px;
  --layout-breakpoint-lg: 1200px;
  --layout-grid-columns-phone: 4px;
  --layout-grid-columns-tablet: 8px;
  --layout-grid-columns-desktop: 12px;
  --layout-grid-gutter: 16px;
  --opacity-pressed: 0.7;
  --opacity-disabled: 0.4;
  --opacity-dim: 0.35;
  --opacity-scrim: 0.65;
  --z-base: 0;
  --z-sticky: 10;
  --z-bottom-bar: 20;
  --z-sheet: 100;
  --z-dialog: 200;
  --z-toast: 300;
  --motion-fast: 150ms;
  --motion-standard: 250ms;
  --motion-slow: 400ms;
  --motion-emphasized: 500ms;
  --motion-pin-sweep: 1500ms;
  --motion-pulse: 1400ms;
  --motion-orbit: 2400ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --easing-decelerate: cubic-bezier(0, 0, 0, 1);
  --easing-accelerate: cubic-bezier(0.3, 0, 1, 1);
}
:root[data-theme="light"], .theme-light {
  color-scheme: light;
  --background: #FFFFFF;
  --surface: #F2F2F2;
  --surface-raised: #E6E6E6;
  --separator: #D6D6D6;
  --line: #000000;
  --text-primary: #000000;
  --text-secondary: #5E5E5E;
  --text-on-fill: #FFFFFF;
  --accent: #000000;
  --on-accent: #FFFFFF;
  --accent-soft: #E6E6E6;
  --scrim: #000000A6;
  --good-fill: #188C41;
  --good-text: #0A6B2C;
  --good-soft: #DDF5E4;
  --warn-fill: #B96D00;
  --warn-text: #8A5300;
  --warn-soft: #FFEFD2;
  --bad-fill: #D9342B;
  --bad-text: #B8261E;
  --bad-soft: #FDE3E0;
}
@media print {
  :root {
    color-scheme: light;
    --background: #FFFFFF;
    --surface: #F2F2F2;
    --surface-raised: #E6E6E6;
    --separator: #D6D6D6;
    --line: #000000;
    --text-primary: #000000;
    --text-secondary: #5E5E5E;
    --text-on-fill: #FFFFFF;
    --accent: #000000;
    --on-accent: #FFFFFF;
    --accent-soft: #E6E6E6;
    --scrim: #000000A6;
    --good-fill: #188C41;
    --good-text: #0A6B2C;
    --good-soft: #DDF5E4;
    --warn-fill: #B96D00;
    --warn-text: #8A5300;
    --warn-soft: #FFEFD2;
    --bad-fill: #D9342B;
    --bad-text: #B8261E;
    --bad-soft: #FDE3E0;
  }
}
@media (prefers-contrast: more) {
  :root {
    --text-secondary: #C2C2C2;
    --separator: #4A4A4A;
    --accent-soft: #3A3A3A;
    --bad-text: #FF8A82;
  }
  :root[data-theme="light"], .theme-light {
    --text-secondary: #3D3D3D;
    --separator: #9A9A9A;
    --accent-soft: #D0D0D0;
  }
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0.01ms;
    --motion-standard: 0.01ms;
    --motion-slow: 0.01ms;
    --motion-emphasized: 0.01ms;
    --motion-pin-sweep: 0.01ms;
    --motion-pulse: 0.01ms;
    --motion-orbit: 0.01ms;
  }
}
.tabular, .metric, .metric-sm { font-variant-numeric: tabular-nums; }