/* GENERATED by tokens/build.mjs — do not edit. Edit tokens/tokens.json. */

:root {
  /* families */
  --font-sans: -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, 'JetBrains Mono', monospace;
  /* type scale */
  --font-large-title-size: 34px;
  --font-large-title-line: 41px;
  --font-large-title-weight: 700;
  --font-large-title-tracking: 0.004em;
  --font-title1-size: 28px;
  --font-title1-line: 34px;
  --font-title1-weight: 700;
  --font-title1-tracking: 0.006em;
  --font-title2-size: 22px;
  --font-title2-line: 28px;
  --font-title2-weight: 600;
  --font-title2-tracking: 0.007em;
  --font-title3-size: 20px;
  --font-title3-line: 25px;
  --font-title3-weight: 600;
  --font-title3-tracking: 0.008em;
  --font-headline-size: 17px;
  --font-headline-line: 22px;
  --font-headline-weight: 600;
  --font-headline-tracking: -0.006em;
  --font-body-size: 17px;
  --font-body-line: 25px;
  --font-body-weight: 400;
  --font-body-tracking: -0.006em;
  --font-callout-size: 16px;
  --font-callout-line: 22px;
  --font-callout-weight: 400;
  --font-callout-tracking: -0.005em;
  --font-subhead-size: 15px;
  --font-subhead-line: 20px;
  --font-subhead-weight: 400;
  --font-subhead-tracking: -0.002em;
  --font-footnote-size: 13px;
  --font-footnote-line: 18px;
  --font-footnote-weight: 400;
  --font-footnote-tracking: 0em;
  --font-caption-size: 12px;
  --font-caption-line: 16px;
  --font-caption-weight: 500;
  --font-caption-tracking: 0em;
  --font-code-size: 14px;
  --font-code-line: 22px;
  --font-code-weight: 400;
  --font-code-tracking: 0em;
  /* spacing (8-pt grid) */
  --space-0: 0px;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 40px;
  --space-6: 48px;
  --space-8: 64px;
  --space-10: 80px;
  --space-12: 96px;
  --space-0_5: 4px;
  --space-1_5: 12px;
  --space-2_5: 20px;
  /* radii */
  --radius-none: 0px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  /* borders */
  --border-hairline: 1px;
  --border-regular: 1.5px;
  --border-thick: 2px;
  /* motion */
  --duration-instant: 0ms;
  --duration-fast: 120ms;
  --duration-base: 220ms;
  --duration-slow: 360ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --easing-entrance: cubic-bezier(0.16, 1, 0.3, 1);
  --easing-exit: cubic-bezier(0.4, 0, 1, 1);
  /* elevation */
  --elevation-none: none;
  --elevation-sm: 0 1px 2px rgba(16,15,13,0.06), 0 1px 1px rgba(16,15,13,0.04);
  --elevation-md: 0 4px 12px rgba(16,15,13,0.08), 0 1px 3px rgba(16,15,13,0.06);
  /* color — light is the default */
  --color-canvas: #FAFAF9;
  --color-surface: #FFFFFF;
  --color-surface-raised: #FFFFFF;
  --color-surface-sunken: #F4F3F1;
  --color-code-surface: #191714;
  --color-text-primary: #191714;
  --color-text-secondary: #615D56;
  --color-text-tertiary: #817C74;
  --color-text-on-accent: #FFFFFF;
  --color-text-on-code: #F4F3F1;
  --color-accent: #D2691E;
  --color-accent-pressed: #B4551A;
  --color-accent-muted: #FCE7D8;
  --color-separator: #E2E0DC;
  --color-separator-strong: #CFCCC6;
  --color-fill: #F4F3F1;
  --color-fill-pressed: #ECEBE8;
  --color-success: #2E7D5B;
  --color-danger: #B23B2E;
  --color-warning: #9A6B12;
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root {
  --color-canvas: #100F0D;
  --color-surface: #191714;
  --color-surface-raised: #211F1C;
  --color-surface-sunken: #100F0D;
  --color-code-surface: #000000;
  --color-text-primary: #FAFAF9;
  --color-text-secondary: #A8A49C;
  --color-text-tertiary: #817C74;
  --color-text-on-accent: #100F0D;
  --color-text-on-code: #ECEBE8;
  --color-accent: #E87F44;
  --color-accent-pressed: #F1A578;
  --color-accent-muted: #5E2D0F;
  --color-separator: #2C2A26;
  --color-separator-strong: #46433D;
  --color-fill: #211F1C;
  --color-fill-pressed: #2C2A26;
  --color-success: #4FB98A;
  --color-danger: #E7746A;
  --color-warning: #D8A54A;
    --elevation-none: none;
    --elevation-sm: 0 1px 2px rgba(0,0,0,0.4);
    --elevation-md: 0 4px 14px rgba(0,0,0,0.5);
  }
}

/* explicit override hooks for docs/screenshots */
[data-theme="light"] {
  --color-canvas: #FAFAF9;
  --color-surface: #FFFFFF;
  --color-surface-raised: #FFFFFF;
  --color-surface-sunken: #F4F3F1;
  --color-code-surface: #191714;
  --color-text-primary: #191714;
  --color-text-secondary: #615D56;
  --color-text-tertiary: #817C74;
  --color-text-on-accent: #FFFFFF;
  --color-text-on-code: #F4F3F1;
  --color-accent: #D2691E;
  --color-accent-pressed: #B4551A;
  --color-accent-muted: #FCE7D8;
  --color-separator: #E2E0DC;
  --color-separator-strong: #CFCCC6;
  --color-fill: #F4F3F1;
  --color-fill-pressed: #ECEBE8;
  --color-success: #2E7D5B;
  --color-danger: #B23B2E;
  --color-warning: #9A6B12;
}
[data-theme="dark"] {
  --color-canvas: #100F0D;
  --color-surface: #191714;
  --color-surface-raised: #211F1C;
  --color-surface-sunken: #100F0D;
  --color-code-surface: #000000;
  --color-text-primary: #FAFAF9;
  --color-text-secondary: #A8A49C;
  --color-text-tertiary: #817C74;
  --color-text-on-accent: #100F0D;
  --color-text-on-code: #ECEBE8;
  --color-accent: #E87F44;
  --color-accent-pressed: #F1A578;
  --color-accent-muted: #5E2D0F;
  --color-separator: #2C2A26;
  --color-separator-strong: #46433D;
  --color-fill: #211F1C;
  --color-fill-pressed: #2C2A26;
  --color-success: #4FB98A;
  --color-danger: #E7746A;
  --color-warning: #D8A54A;
}