/* Cardiology tools · design tokens · stage 1 */
:root {
  /* palette */
  --midnight: #142A63;
  --chart-white: #FCFCFD;
  --signal-red: #CC0000;
  --ember: #E0701A;
  --cobalt: #0E7FBE;
  --sky: #2BA8DE;
  --amber: #F2B049;
  --verde: #1BA152;
  --rose: #E23A8E;
  --orchid: #A9309F;
  --orchid-lift: #C257B8;
  --signal-red-lift: #E84545;
  --ink-0: #0B0C0E;
  --ink-1: #14161A;
  --ink-2: #1B1E23;
  --ink-3: #1C1F26;
  --ink-text: #E8EAEE;
  --ink-text-2: #A7ADB9;
  --ink-line: #2B2F36;
  --ink-line-2: #3D434C;
  --dusk: #6E7386;
  --mist: #EEF1F7;
  --hairline: #E3E4EA;
  --rule: #C4C8D3;
  --fog: #9297A8;
  --slate: #565C70;

  /* semantic · light */
  --surface-page: var(--chart-white);
  --surface-card: var(--chart-white);
  --surface-raised: var(--mist);
  --surface-header: var(--midnight);
  --surface-switcher-card: var(--mist);
  --surface-logo: var(--midnight);
  --text-primary: var(--midnight);
  --text-secondary: var(--slate);
  --text-disabled: var(--fog);
  --text-on-header: var(--chart-white);
  --text-on-logo: var(--chart-white);
  --border-subtle: var(--hairline);
  --border-strong: var(--rule);
  --border-header: var(--midnight);
  --focus-ring: var(--midnight);
  --danger-fill: var(--signal-red);
  --danger-on-fill: var(--chart-white);
  --danger-text: var(--signal-red);
  --risk-low: var(--cobalt);
  --risk-low-ink: var(--chart-white);
  --risk-borderline: var(--amber);
  --risk-borderline-ink: var(--midnight);
  --risk-intermediate: var(--ember);
  --risk-intermediate-ink: var(--ink-0);
  --risk-high: var(--signal-red);
  --risk-high-ink: var(--chart-white);
  --cor-1: var(--verde);
  --cor-1-ink: var(--ink-0);
  --cor-2a: var(--amber);
  --cor-2a-ink: var(--midnight);
  --cor-2b: var(--ember);
  --cor-2b-ink: var(--ink-0);
  --cor-3: var(--signal-red);
  --cor-3-ink: var(--chart-white);
  --site-tint: var(--midnight);
  --site-tint-dark: var(--chart-white);
  --accent: var(--site-tint);
  --accent-wash: color-mix(in srgb, var(--accent) 12%, var(--surface-card));

  /* type */
  --font-ui: 'Source Sans 3', 'Segoe UI', system-ui, sans-serif;
  --font-display: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --font-code: 'Source Code Pro', Consolas, 'Courier New', monospace;
  --type-display: 600 40px/48px var(--font-display);  --type-display-tracking: -0.015em;
  --type-h1: 600 32px/40px var(--font-display);  --type-h1-tracking: -0.01em;
  --type-h2: 600 24px/32px var(--font-display);
  --type-h3: 600 19px/28px var(--font-ui);
  --type-body: 400 15px/24px var(--font-ui);
  --type-small: 400 13px/20px var(--font-ui);
  --type-label: 700 12px/16px var(--font-ui);  --type-label-tracking: 0.08em;
  --type-numeral-xl: 600 56px/64px var(--font-display);
  --type-numeral: 600 32px/40px var(--font-display);
  --type-mono: 500 14px/20px var(--font-code);
  --type-keycap: 500 12px/16px var(--font-code);
  --type-numeric: tabular-nums lining-nums;

  /* space · 4px grid */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* form */
  --radius-ui: 3px;
  --radius-full: 9999px;
  --stroke-hairline: 1px;
  --stroke-indicator: 3px;
  --focus-width: 2px;
  --focus-offset: 2px;
  --control-h: 34px;
  --control-h-sm: 28px;
  --header-h: 56px;
  --mark-header: 24px;
  --tile-logo: 48px; /* 40–56 */
  --shadow: none;
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --ease: cubic-bezier(.2,0,0,1);
}
@media (pointer: coarse) { :root { --control-h: 44px; --control-h-sm: 36px; } }
@media (prefers-reduced-motion: reduce) { :root { --duration-fast: 0ms; --duration-base: 0ms; } }

/* dark · explicit */
[data-theme="dark"] {
  --accent: var(--site-tint-dark);
  --surface-page: var(--ink-0);
  --surface-card: var(--ink-1);
  --surface-raised: var(--ink-2);
  --surface-header: var(--ink-3);
  --surface-switcher-card: var(--mist);
  --surface-logo: var(--midnight);
  --text-primary: var(--ink-text);
  --text-secondary: var(--ink-text-2);
  --text-disabled: var(--dusk);
  --text-on-header: var(--ink-text);
  --text-on-logo: var(--chart-white);
  --border-subtle: var(--ink-line);
  --border-strong: var(--ink-line-2);
  --border-header: var(--ink-line);
  --focus-ring: var(--ink-text);
  --danger-fill: var(--signal-red);
  --danger-on-fill: var(--chart-white);
  --danger-text: var(--signal-red-lift);
  --risk-low: var(--cobalt);
  --risk-low-ink: var(--chart-white);
  --risk-borderline: var(--amber);
  --risk-borderline-ink: var(--ink-0);
  --risk-intermediate: var(--ember);
  --risk-intermediate-ink: var(--ink-0);
  --risk-high: var(--signal-red-lift);
  --risk-high-ink: var(--ink-0);
  --cor-1: var(--verde);
  --cor-1-ink: var(--ink-0);
  --cor-2a: var(--amber);
  --cor-2a-ink: var(--ink-0);
  --cor-2b: var(--ember);
  --cor-2b-ink: var(--ink-0);
  --cor-3: var(--signal-red-lift);
  --cor-3-ink: var(--ink-0);
  color-scheme: dark;
}
/* dark · follow OS unless user picked light */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --accent: var(--site-tint-dark);
    --surface-page: var(--ink-0);
    --surface-card: var(--ink-1);
    --surface-raised: var(--ink-2);
    --surface-header: var(--ink-3);
    --surface-switcher-card: var(--mist);
    --surface-logo: var(--midnight);
    --text-primary: var(--ink-text);
    --text-secondary: var(--ink-text-2);
    --text-disabled: var(--dusk);
    --text-on-header: var(--ink-text);
    --text-on-logo: var(--chart-white);
    --border-subtle: var(--ink-line);
    --border-strong: var(--ink-line-2);
    --border-header: var(--ink-line);
    --focus-ring: var(--ink-text);
    --danger-fill: var(--signal-red);
    --danger-on-fill: var(--chart-white);
    --danger-text: var(--signal-red-lift);
    --risk-low: var(--cobalt);
    --risk-low-ink: var(--chart-white);
    --risk-borderline: var(--amber);
    --risk-borderline-ink: var(--ink-0);
    --risk-intermediate: var(--ember);
    --risk-intermediate-ink: var(--ink-0);
    --risk-high: var(--signal-red-lift);
    --risk-high-ink: var(--ink-0);
    --cor-1: var(--verde);
    --cor-1-ink: var(--ink-0);
    --cor-2a: var(--amber);
    --cor-2a-ink: var(--ink-0);
    --cor-2b: var(--ember);
    --cor-2b-ink: var(--ink-0);
    --cor-3: var(--signal-red-lift);
    --cor-3-ink: var(--ink-0);
    color-scheme: dark;
  }
}

/* site accents · interface only, never in logos or share images */
[data-site="ascvd"] { --site-tint: var(--cobalt); --site-tint-dark: var(--cobalt); }
[data-site="troponin"] { --site-tint: var(--cobalt); --site-tint-dark: var(--cobalt); }
[data-site="stressingwisely"] { --site-tint: var(--amber); --site-tint-dark: var(--amber); }
[data-site="gdmt"] { --site-tint: var(--orchid); --site-tint-dark: var(--orchid-lift); }
[data-site="diurese"] { --site-tint: var(--orchid); --site-tint-dark: var(--orchid-lift); }
[data-site="swanology"] { --site-tint: var(--orchid); --site-tint-dark: var(--orchid-lift); }
[data-site="cardsonc"] { --site-tint: var(--rose); --site-tint-dark: var(--rose); }
[data-site="pqrstudio"] { --site-tint: var(--verde); --site-tint-dark: var(--verde); }
[data-site="atrialharmony"] { --site-tint: var(--verde); --site-tint-dark: var(--verde); }
[data-site="cardioob"] { --site-tint: var(--rose); --site-tint-dark: var(--rose); }

/* Tailwind v4 */
@theme inline {
  --color-*: initial;
  --color-midnight: var(--midnight);
  --color-chart-white: var(--chart-white);
  --color-signal-red: var(--signal-red);
  --color-ember: var(--ember);
  --color-cobalt: var(--cobalt);
  --color-sky: var(--sky);
  --color-amber: var(--amber);
  --color-verde: var(--verde);
  --color-rose: var(--rose);
  --color-orchid: var(--orchid);
  --color-orchid-lift: var(--orchid-lift);
  --color-signal-red-lift: var(--signal-red-lift);
  --color-ink-0: var(--ink-0);
  --color-ink-1: var(--ink-1);
  --color-ink-2: var(--ink-2);
  --color-ink-3: var(--ink-3);
  --color-ink-text: var(--ink-text);
  --color-ink-text-2: var(--ink-text-2);
  --color-ink-line: var(--ink-line);
  --color-ink-line-2: var(--ink-line-2);
  --color-dusk: var(--dusk);
  --color-mist: var(--mist);
  --color-hairline: var(--hairline);
  --color-rule: var(--rule);
  --color-fog: var(--fog);
  --color-slate: var(--slate);
  --color-surface-page: var(--surface-page);
  --color-surface-card: var(--surface-card);
  --color-surface-raised: var(--surface-raised);
  --color-surface-header: var(--surface-header);
  --color-surface-switcher-card: var(--surface-switcher-card);
  --color-surface-logo: var(--surface-logo);
  --color-text-primary: var(--text-primary);
  --color-text-secondary: var(--text-secondary);
  --color-text-disabled: var(--text-disabled);
  --color-text-on-header: var(--text-on-header);
  --color-text-on-logo: var(--text-on-logo);
  --color-border-subtle: var(--border-subtle);
  --color-border-strong: var(--border-strong);
  --color-border-header: var(--border-header);
  --color-focus-ring: var(--focus-ring);
  --color-danger-fill: var(--danger-fill);
  --color-danger-on-fill: var(--danger-on-fill);
  --color-danger-text: var(--danger-text);
  --color-risk-low: var(--risk-low);
  --color-risk-low-ink: var(--risk-low-ink);
  --color-risk-borderline: var(--risk-borderline);
  --color-risk-borderline-ink: var(--risk-borderline-ink);
  --color-risk-intermediate: var(--risk-intermediate);
  --color-risk-intermediate-ink: var(--risk-intermediate-ink);
  --color-risk-high: var(--risk-high);
  --color-risk-high-ink: var(--risk-high-ink);
  --color-cor-1: var(--cor-1);
  --color-cor-1-ink: var(--cor-1-ink);
  --color-cor-2a: var(--cor-2a);
  --color-cor-2a-ink: var(--cor-2a-ink);
  --color-cor-2b: var(--cor-2b);
  --color-cor-2b-ink: var(--cor-2b-ink);
  --color-cor-3: var(--cor-3);
  --color-cor-3-ink: var(--cor-3-ink);
  --color-accent: var(--accent);
  --color-accent-wash: var(--accent-wash);
  --font-sans: var(--font-ui);
  --font-serif: var(--font-display);
  --font-mono: var(--font-code);
  --spacing: 4px;
  --radius-ui: 3px;
  --shadow-*: initial;
  --text-display: 40px; --text-display--line-height: 48px; --text-display--font-weight: 600; --text-display--letter-spacing: -0.015em;
  --text-h1: 32px; --text-h1--line-height: 40px; --text-h1--font-weight: 600; --text-h1--letter-spacing: -0.01em;
  --text-h2: 24px; --text-h2--line-height: 32px; --text-h2--font-weight: 600;
  --text-h3: 19px; --text-h3--line-height: 28px; --text-h3--font-weight: 600;
  --text-body: 15px; --text-body--line-height: 24px; --text-body--font-weight: 400;
  --text-small: 13px; --text-small--line-height: 20px; --text-small--font-weight: 400;
  --text-label: 12px; --text-label--line-height: 16px; --text-label--font-weight: 700; --text-label--letter-spacing: 0.08em;
  --text-numeral-xl: 56px; --text-numeral-xl--line-height: 64px; --text-numeral-xl--font-weight: 600;
  --text-numeral: 32px; --text-numeral--line-height: 40px; --text-numeral--font-weight: 600;
  --text-mono: 14px; --text-mono--line-height: 20px; --text-mono--font-weight: 500;
  --text-keycap: 12px; --text-keycap--line-height: 16px; --text-keycap--font-weight: 500;
}
/* Overrides applied after the Claude Design tokens (src/../design-source/stage1-tokens/tokens.css).
   None at the moment: the export's site accents are correct as delivered.
   Add overrides here, documented, rather than editing the export. */
