/* Tach Cobalt: the single palette and typography authority for every surface. */
@font-face { font-family: 'Barlow Condensed'; src: url('/fonts/barlow-condensed-400-latin.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Barlow Condensed'; src: url('/fonts/barlow-condensed-600-latin.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Barlow Condensed'; src: url('/fonts/barlow-condensed-700-latin.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Sans'; src: url('/fonts/ibm-plex-sans-400-700-latin.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/fonts/ibm-plex-mono-400-latin.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/fonts/ibm-plex-mono-500-latin.woff2') format('woff2'); font-weight: 500 700; font-style: normal; font-display: swap; }

:root {
  color-scheme: light;
  --font-heading: 'Barlow Condensed', sans-serif;
  --font-body: 'IBM Plex Sans', system-ui, sans-serif;
  --font-number: 'IBM Plex Mono', ui-monospace, monospace;
  --bg: #f3f6fb;
  --surface: #ffffff;
  --ink: #17263d;
  --muted-foreground: #53637a;
  --rule: #b9c7d8;
  --accent: #2458b6;
  --accent-soft: #e1ebfc;
  --m0: #37658e;
  --m1: #94701a;
  --m2: #885195;
  --m3: #267a71;
  --chart-grid: #dce4ef;
  --primary-foreground: #ffffff;
  --warning: #806019;
  --danger: #b12e47;
  --success: #267971;
  --radius: 0px;
  --design-radius: 0px;

  /* Established framework semantics remain surfaces, not text colors. */
  --background: var(--bg);
  --foreground: var(--ink);
  --card: var(--surface);
  --card-foreground: var(--ink);
  --popover: var(--surface);
  --popover-foreground: var(--ink);
  --primary: var(--accent);
  --secondary: var(--bg);
  --secondary-foreground: var(--ink);
  --muted: var(--bg);
  --accent-foreground: var(--accent);
  --destructive: var(--danger);
  --destructive-foreground: var(--surface);
  --border: var(--rule);
  --input: var(--rule);
  --ring: var(--accent);
  --paper: var(--bg);
  --surface-elevated: var(--bg);
  --line: var(--rule);
  --line-subtle: var(--chart-grid);
  --accent-hover: color-mix(in srgb, var(--accent) 85%, var(--ink));
  --warning-soft: color-mix(in srgb, var(--warning) 10%, var(--surface));
  --warning-border: color-mix(in srgb, var(--warning) 45%, var(--surface));
  --danger-soft: color-mix(in srgb, var(--danger) 10%, var(--surface));
  --danger-border: color-mix(in srgb, var(--danger) 45%, var(--surface));
  --success-soft: color-mix(in srgb, var(--success) 10%, var(--surface));
  --success-border: color-mix(in srgb, var(--success) 45%, var(--surface));
  --input-bg: var(--surface);
  --table-header: var(--bg);
  --table-row-hover: var(--accent-soft);
  --chart-1: var(--m0);
  --chart-2: var(--m1);
  --chart-3: var(--m2);
  --chart-4: var(--m3);
  --chart-5: color-mix(in srgb, var(--m0) 60%, var(--m2));
  --chart-6: color-mix(in srgb, var(--m1) 60%, var(--m3));
  --chart-7: color-mix(in srgb, var(--m2) 60%, var(--m1));
  --chart-8: color-mix(in srgb, var(--m3) 60%, var(--m0));
  --heat-1: #dce7f8;
  --heat-2: #c3d6f3;
  --heat-3: #97b4e7;
  --heat-4: #6389d2;
  --heat-5: #2458b6;
  --heat-ink: var(--surface);
}

html.dark {
  color-scheme: dark;
  --bg: #141e2c;
  --surface: #1d2a3b;
  --ink: #eef4ff;
  --muted-foreground: #b2c2d8;
  --rule: #4c607b;
  --accent: #8cb5ff;
  --accent-soft: #263f65;
  --m0: #92bde2;
  --m1: #dec078;
  --m2: #cda3dc;
  --m3: #80c7b8;
  --chart-grid: #314157;
  --primary-foreground: #141e2c;
  --warning: #dec078;
  --danger: #ff9eaf;
  --success: #80c7b8;
  --heat-1: #374c6e;
  --heat-2: #4a6690;
  --heat-3: #6287bb;
  --heat-4: #7ba3de;
  --heat-5: #8cb5ff;
}