/* Generated by tools/scripts/gen_isocline_tokens.py from docs/design/tokens/isocline.tokens.json — do not edit by hand. */

:root {
  color-scheme: light dark;
  --paper: #F8F3E8;
  --card: #FDFAF3;
  --ink: #050303;
  --accent: #D4537E;
  --accent-2: #534AB7;
  --on-accent: #FAF3F4;
  --level-low: #99345A;
  --level-high: #8875D4;
  --safety: #BA3630;
  --muted: rgba(5, 3, 3, 0.62);
  --faint: rgba(5, 3, 3, 0.38);
  --line: rgba(5, 3, 3, 0.14);
  --grid: rgba(5, 3, 3, 0.05);
  --ylab: rgba(5, 3, 3, 0.1);
  --day-paper: #F8F3E8;
  --day-ink: #050303;
  --night-paper: #1C0C10;
  --night-ink: #F1E8EA;
  --success: #3B8C6E;
  --sage: #8FA382;
  --font-display: 'IBM Plex Serif', Georgia, serif;
  --font-mono: 'IBM Plex Mono', 'SF Mono', ui-monospace, monospace;
  --font-body: 'Atkinson Hyperlegible Next', 'Atkinson Hyperlegible', 'Helvetica Neue', system-ui, sans-serif;
  --radius-hairline: 2px;
  --radius-xs: 4px;
  --radius-chip: 6px;
  --radius-control: 8px;
  --radius-tile: 10px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 24px;
  --radius-specimen: 28px;
  --space-xxs: 2px;
  --space-xs: 4px;
  --space-s6: 6px;
  --space-sm: 8px;
  --space-s10: 10px;
  --space-md: 12px;
  --space-card: 14px;
  --space-lg: 16px;
  --space-xl: 20px;
  --space-xxl: 24px;
  --space-s28: 28px;
  --space-xxxl: 32px;
  --space-gutter: 22px;
  --line-hairline: 1px;
  --line-engrave: 0.75px;
  --line-curve: 1.8px;
  --line-curve-hero: 2.5px;
  --line-lab-ring: 1.3px;
  --curve-fill-top-opacity: 0.3;
  --range-band-opacity: 0.05;
  --now-halo-opacity: 0.15;
  --now-dot: 10px;
  --now-halo: 26px;
  --lab-ring: 9px;
  --curve-glow-opacity: 0.35;
  --curve-glow-radius: 6px;
  --tile-size: 32px;
  --tile-fill-opacity: 0.13;
  --avatar-row: 56px;
  --avatar-header: 72px;
  --avatar-editor: 112px;
  --action-pill-min-height: 44px;
  --floating-fade-height: 48px;
  --specimen-aspect: 1.08;
}

/* A forced theme also forces the browser's own UI (scrollbars, form controls). */
:root[data-theme="light"] { color-scheme: light; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #1C0C10;
    --card: #2A141A;
    --ink: #F1E8EA;
    --accent: #E8709A;
    --accent-2: #7E74D8;
    --on-accent: #FFFFFF;
    --level-low: #C2557E;
    --level-high: #B0A4EA;
    --safety: #F47C70;
    --muted: rgba(241, 232, 234, 0.62);
    --faint: rgba(241, 232, 234, 0.38);
    --line: rgba(241, 232, 234, 0.14);
    --grid: rgba(241, 232, 234, 0.035);
    --ylab: rgba(241, 232, 234, 0.15);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #1C0C10;
  --card: #2A141A;
  --ink: #F1E8EA;
  --accent: #E8709A;
  --accent-2: #7E74D8;
  --on-accent: #FFFFFF;
  --level-low: #C2557E;
  --level-high: #B0A4EA;
  --safety: #F47C70;
  --muted: rgba(241, 232, 234, 0.62);
  --faint: rgba(241, 232, 234, 0.38);
  --line: rgba(241, 232, 234, 0.14);
  --grid: rgba(241, 232, 234, 0.035);
  --ylab: rgba(241, 232, 234, 0.15);
}

@media (prefers-contrast: more) {
  :root {
    --line: rgba(5, 3, 3, 0.28);
    --grid: rgba(5, 3, 3, 0.1);
  }
  :root[data-theme="dark"] {
    --line: rgba(241, 232, 234, 0.28);
    --grid: rgba(241, 232, 234, 0.07);
  }
}

@media (prefers-contrast: more) and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --line: rgba(241, 232, 234, 0.28);
    --grid: rgba(241, 232, 234, 0.07);
  }
}