/* GENERATED by build/make_theme.py — do not edit by hand.
   Light: Blue · Arc absolute — black-blue, cyan at full
   Dark:  Custom · Jed's dark — absolute base, max-contrast mint
   Typography: paper · Surface: elevated
   Edit the palette in 7 System/palettes.py, then re-run this. */

:root {
  --s-body: "Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --s-display: "Iowan Old Style",Charter,"Palatino Linotype",Palatino,Georgia,serif;
  --s-mono: ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --s-size: 15px;
  --s-brand: 19px;
  --s-brand-w: 600;
  --s-h-track: -0.012em;
  --s-eyebrow-f: ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --s-eyebrow-size: 11px;
  --s-eyebrow-w: 500;
  --s-eyebrow-track: 0.14em;
  --s-h-f: "Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --s-value-f: "Iowan Old Style",Charter,"Palatino Linotype",Palatino,Georgia,serif;
  --s-value-w: 600;
  --s-value-track: -0.015em;
  --s-card-bg: var(--n-surface);
  --s-card-bd: transparent;
  --s-card-sh: 0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.10);
  --s-card-r: 14px;
  color-scheme: dark;
  --n-paper: #00040a;
  --n-surface: #030a13;
  --n-surface-2: #06121f;
  --n-ink: #f0fbff;
  --n-ink-2: #8fb6d0;
  --n-ink-3: #62869f;
  --n-rule: #102030;
  --n-accent: #00f7ff;
  --n-accent-soft: #002631;
  --n-danger: #ff8a8a;
  --n-danger-soft: #3a1a1e;
  --n-warn: #ffcf6b;
  --n-warn-soft: #33280f;
  --surface-0: #00040a;
  --surface-1: #030a13;
  --surface-2: #06121f;
  --text-primary: #f0fbff;
  --text-secondary: #8fb6d0;
  --text-muted: #62869f;
  --grid: #102030;
  --axis: #62869f;
  --border: #102030;
  --border-strong: #62869f;
  --accent: #00f7ff;
  --accent-quiet: #002631;
  --good: #00f7ff;
  --good-text: #00f7ff;
  --warning: #ffcf6b;
  --serious: #ffcf6b;
  --critical: #ff8a8a;
  --heat-0: #06121f;
  --heat-1: color-mix(in srgb, #00f7ff 22%, #06121f);
  --heat-2: color-mix(in srgb, #00f7ff 40%, #06121f);
  --heat-3: color-mix(in srgb, #00f7ff 58%, #06121f);
  --heat-4: color-mix(in srgb, #00f7ff 78%, #06121f);
  --heat-5: color-mix(in srgb, #00f7ff 100%, #06121f);
}

@media (prefers-color-scheme: dark) {
  :root:where(:not([data-theme="light"])) {
  color-scheme: dark;
  --n-paper: #000806;
  --n-surface: #061210;
  --n-surface-2: #0a1a16;
  --n-ink: #ffffff;
  --n-ink-2: #b8ccc7;
  --n-ink-3: #7e918c;
  --n-rule: #1b2f2a;
  --n-accent: #7ce8cd;
  --n-accent-soft: #123028;
  --n-danger: #ff9d93;
  --n-danger-soft: #39201d;
  --n-warn: #dfb266;
  --n-warn-soft: #30261a;
  --surface-0: #000806;
  --surface-1: #061210;
  --surface-2: #0a1a16;
  --text-primary: #ffffff;
  --text-secondary: #b8ccc7;
  --text-muted: #7e918c;
  --grid: #1b2f2a;
  --axis: #7e918c;
  --border: #1b2f2a;
  --border-strong: #7e918c;
  --accent: #7ce8cd;
  --accent-quiet: #123028;
  --good: #7ce8cd;
  --good-text: #7ce8cd;
  --warning: #dfb266;
  --serious: #dfb266;
  --critical: #ff9d93;
  --heat-0: #0a1a16;
  --heat-1: color-mix(in srgb, #7ce8cd 22%, #0a1a16);
  --heat-2: color-mix(in srgb, #7ce8cd 40%, #0a1a16);
  --heat-3: color-mix(in srgb, #7ce8cd 58%, #0a1a16);
  --heat-4: color-mix(in srgb, #7ce8cd 78%, #0a1a16);
  --heat-5: color-mix(in srgb, #7ce8cd 100%, #0a1a16);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --n-paper: #000806;
  --n-surface: #061210;
  --n-surface-2: #0a1a16;
  --n-ink: #ffffff;
  --n-ink-2: #b8ccc7;
  --n-ink-3: #7e918c;
  --n-rule: #1b2f2a;
  --n-accent: #7ce8cd;
  --n-accent-soft: #123028;
  --n-danger: #ff9d93;
  --n-danger-soft: #39201d;
  --n-warn: #dfb266;
  --n-warn-soft: #30261a;
  --surface-0: #000806;
  --surface-1: #061210;
  --surface-2: #0a1a16;
  --text-primary: #ffffff;
  --text-secondary: #b8ccc7;
  --text-muted: #7e918c;
  --grid: #1b2f2a;
  --axis: #7e918c;
  --border: #1b2f2a;
  --border-strong: #7e918c;
  --accent: #7ce8cd;
  --accent-quiet: #123028;
  --good: #7ce8cd;
  --good-text: #7ce8cd;
  --warning: #dfb266;
  --serious: #dfb266;
  --critical: #ff9d93;
  --heat-0: #0a1a16;
  --heat-1: color-mix(in srgb, #7ce8cd 22%, #0a1a16);
  --heat-2: color-mix(in srgb, #7ce8cd 40%, #0a1a16);
  --heat-3: color-mix(in srgb, #7ce8cd 58%, #0a1a16);
  --heat-4: color-mix(in srgb, #7ce8cd 78%, #0a1a16);
  --heat-5: color-mix(in srgb, #7ce8cd 100%, #0a1a16);
}

/* ---- the styler's own override rules, minus its settings panel ---------- */

/* ================================================================== *
   Styler override. Loaded after the dashboard's own stylesheet, so it
   wins on equal specificity. Nothing here is a literal colour — every
   value routes through a --n-* token or a --s-* typography variable.
 * ================================================================== */

body { font-family: var(--s-body); font-size: var(--s-size); }

.brand h1 {
  font-family: var(--s-display);
  font-size: var(--s-brand);
  font-weight: var(--s-brand-w);
  letter-spacing: var(--s-h-track);
}
.brand .stamp { font-family: var(--s-mono); font-size: 11.5px; letter-spacing: .02em; }

nav.tabs button { font-family: var(--s-body); }
nav.tabs button[aria-selected="true"] { color: var(--n-accent); }

/* The section head is the design system's eyebrow: mono, tracked, accent. */
.section-head h2 {
  font-family: var(--s-eyebrow-f);
  font-size: var(--s-eyebrow-size);
  font-weight: var(--s-eyebrow-w);
  letter-spacing: var(--s-eyebrow-track);
  color: var(--n-accent);
}
.section-head .note { font-family: var(--s-mono); font-size: 11px; }

.card h3, .detail-head h3 { font-family: var(--s-h-f); letter-spacing: var(--s-h-track); }

.tile .value {
  font-family: var(--s-value-f);
  font-weight: var(--s-value-w);
  letter-spacing: var(--s-value-track);
  font-variant-numeric: tabular-nums;
}
.tile .label {
  font-family: var(--s-mono);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 10.5px;
}

svg.chart text { font-family: var(--s-mono); }
.row .num, .tooltip .t-val, .heat-legend, .heat-months {
  font-family: var(--s-mono); font-variant-numeric: tabular-nums;
}

/* Surface treatment. .card.flat and .stub keep their own higher-specificity
   overrides, which is correct — they are deliberate variants, not defaults. */
.card {
  background: var(--s-card-bg);
  border: 1px solid var(--s-card-bd);
  box-shadow: var(--s-card-sh);
  border-radius: var(--s-card-r);
}


/* The theme button, in the eyebrow's voice — the styler styled this alongside
   its own Settings button, which does not exist here. */
.theme-toggle {
  font-family: var(--n-mono); font-size: 10px; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  border-radius: 999px; padding: 5px 12px;
  border: 1px solid var(--n-rule); background: none;
  color: var(--n-ink-3); cursor: pointer;
}
.theme-toggle:hover { color: var(--n-accent); border-color: var(--n-accent); }
:focus-visible { outline: 2px solid var(--n-accent); outline-offset: 2px; }

/* ==== HEADING FONT OVERRIDE — added 2026-08-17 at Jed's request ==========
   Trial: the header and the big tile numbers drop the Iowan serif and take the
   same sans as the exercise names. Sizes, weights and colours are untouched;
   only the family changes, so this is a clean A/B.

   TO REVERT: delete this whole block (or set HEADING_SANS = False in
   build/make_theme.py) and re-run the script. Nothing else depends on it.   */
.brand h1, .brand .stamp, .card h3, .detail-head h3, .tile .value {
  font-family: var(--s-body);
}
/* ==== end heading font override ======================================== */
