/* Therabot Clinical Note Engine — shared design tokens.
 *
 * The console is a clinical DOCUMENT tool, so the grammar is a medical
 * record's: paper-toned surfaces, ink text, a single restrained teal accent
 * inherited from Therabot, serif display for the note itself, a humanist sans
 * for the chrome, monospace for codes and times. Semantic colour (risk /
 * claim-blocking / audit / ok) is separate from the accent.
 *
 * Three theme states: bare :root = light; prefers-color-scheme dark (unless
 * data-theme=light); data-theme=dark always. Every token is declared here
 * first; components only ever read tokens. */
:root {
  --serif: "Source Serif 4", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sans: "Source Sans 3", "Source Sans Pro", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* paper & ink — warm, slightly green-biased neutrals (toward the teal) */
  --paper: #f7f6f2;
  --surface: #ffffff;
  --surface-2: #f0efe9;
  --ink: #1b2422;
  --ink-2: #3a4643;
  --muted: #6b7672;
  --line: #e3e1d9;
  --line-strong: #cfcdc4;

  --accent: #2f9d86;          /* Therabot teal, deepened for text-on-paper */
  --accent-ink: #1f7563;
  --accent-bg: #e6f4f0;

  /* semantic — never used as decoration */
  --good-ink: #1f6b3a; --good-bg: #e8f4ec; --good-line: #bfe0c9;
  --warn-ink: #8a5a06; --warn-bg: #fdf3df; --warn-line: #f2d59a;
  --danger-ink: #9b2c2c; --danger-bg: #fbe9e9; --danger-line: #f0bcbc;
  --info-ink: #2b4f8a; --info-bg: #e9f0fb; --info-line: #c2d3f2;

  --radius: 6px;
  --shadow: 0 1px 2px rgba(27, 36, 34, .06), 0 6px 20px -12px rgba(27, 36, 34, .18);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #14191a; --surface: #1b2223; --surface-2: #202829;
    --ink: #e8e6df; --ink-2: #c7c5bc; --muted: #8f9995;
    --line: #2a3233; --line-strong: #3a4446;
    --accent: #5cc5ad; --accent-ink: #7fd6c1; --accent-bg: #1d3330;
    --good-ink: #8fd3a5; --good-bg: #1c2f24; --good-line: #2f5a3d;
    --warn-ink: #f0c76b; --warn-bg: #33290f; --warn-line: #6a5320;
    --danger-ink: #f39c9c; --danger-bg: #3a1e1e; --danger-line: #6e3333;
    --info-ink: #9cbcf0; --info-bg: #1c2740; --info-line: #35507f;
    --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px -12px rgba(0, 0, 0, .6);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: #14191a; --surface: #1b2223; --surface-2: #202829;
  --ink: #e8e6df; --ink-2: #c7c5bc; --muted: #8f9995;
  --line: #2a3233; --line-strong: #3a4446;
  --accent: #5cc5ad; --accent-ink: #7fd6c1; --accent-bg: #1d3330;
  --good-ink: #8fd3a5; --good-bg: #1c2f24; --good-line: #2f5a3d;
  --warn-ink: #f0c76b; --warn-bg: #33290f; --warn-line: #6a5320;
  --danger-ink: #f39c9c; --danger-bg: #3a1e1e; --danger-line: #6e3333;
  --info-ink: #9cbcf0; --info-bg: #1c2740; --info-line: #35507f;
  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px -12px rgba(0, 0, 0, .6);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 15px; line-height: 1.5;
  font-feature-settings: "kern", "liga";
}
h1, h2, h3, h4 { text-wrap: balance; margin: 0; }
a { color: var(--accent-ink); }
button, input, select, textarea { font-family: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.mono, code, kbd, samp { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.tnum { font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }