/* J.A.R.V.I.S. Mark III design tokens: the one file every screen's colors and fonts come from.
   Change --accent here and the whole app recolors. Hex values live only in this file.

   Meaning of the status colors (UI-07), never shown by color alone:
     --accent  working   (filled dot, the word "Working")
     --needs   needs you (filled square, the word "Needs you"); amber means nothing else
     --idle    idle      (hollow ring, the word "Idle")
     --error   errors    (filled diamond, the word "Error"); red means nothing else */

@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500&display=swap');

:root {
  color-scheme: dark;

  /* ---------- the palette ---------- */
  --accent: #4fd6e8;
  --mk-bg: #040a0e;
  --mk-ice: #f2fbfd;
  --needs: #ffb547;
  --error: #ff7a7a;
  --idle: #93a5ac;
  --surface: #07121a;
  --surface-2: #0b1a23;
  --mk-muted: #a7bac1;
  --mk-muted-2: #8799a0;
  --accent-ink: #04222a;
  --needs-ink: #2a1a02;
  --black: #000;
  --white: #fff;

  /* Print has its own paper-and-ink palette (the Morning Brief is a first-class print target). */
  --print-paper: #fff;
  --print-ink: #17140f;
  --print-soft: #4a443a;
  --print-faint: #6f695c;
  --print-rule: #c9c1ae;
  --print-needs: #7a4f0f;
  --print-accent: color-mix(in srgb, var(--accent) 35%, var(--print-ink));

  /* ---------- derived from the palette, so they follow it ---------- */
  --accent-soft: color-mix(in srgb, var(--accent) 35%, transparent);
  --accent-faint: color-mix(in srgb, var(--accent) 10%, transparent);
  --accent-dim: color-mix(in srgb, var(--accent) 45%, var(--mk-bg));
  --needs-surface: color-mix(in srgb, var(--needs) 7%, var(--mk-bg));
  --needs-line: color-mix(in srgb, var(--needs) 40%, transparent);
  --needs-muted: color-mix(in srgb, var(--needs) 55%, var(--mk-ice));
  --error-line: color-mix(in srgb, var(--error) 45%, transparent);
  --grid-line: color-mix(in srgb, var(--accent) 5%, transparent);
  --line: color-mix(in srgb, var(--accent) 18%, transparent);
  --line-strong: color-mix(in srgb, var(--accent) 34%, transparent);

  /* ---------- fonts (system fallbacks keep the app readable offline) ---------- */
  --font-head: 'Rajdhani', 'DIN Alternate', 'Avenir Next Condensed', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --print-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;

  /* ---------- shape ---------- */
  --radius: 2px;
  --radius-sm: 2px;
  --sidebar: 236px;
  --m3-clip: 18px;

  /* ---------- old names, kept so the older stylesheets follow the tokens ---------- */
  /* design.css */
  --bg: var(--mk-bg);
  --bg-soft: var(--surface);
  --panel: var(--surface);
  --panel-2: var(--surface-2);
  --text: var(--mk-ice);
  --muted: var(--mk-muted);
  --muted-2: var(--mk-muted-2);
  --good: var(--accent);
  --warn: var(--needs);
  --bad: var(--error);
  --violet: var(--mk-muted);
  --font: var(--font-body);
  --mono: var(--font-mono);
  /* style.css (the trading pages read these too) */
  --bg-0: var(--mk-bg);
  --bg-1: var(--surface);
  --cyan: var(--accent);
  --cyan-soft: var(--accent-soft);
  --cyan-dim: var(--accent-dim);
  --amber: var(--needs);
  --text-dim: var(--mk-muted);
  --panel-bg: var(--surface);
  --panel-border: var(--line-strong);
  --danger: var(--error);
}