/* JtJ Tools — shared color tokens for the whole web app. Included by every
   page via <link rel="stylesheet" href="theme.css"> so a page never defines
   its own :root colors — that duplication is what caused near-misses before.
   Toggle between the two blocks below via the [data-theme] attribute on
   <html>, set by theme.js. */

:root {
  --bg: #0e0e0f;
  --surface: #18181b;
  --surface2: #222227;
  --border: #2e2e35;
  --accent: rgb(215, 53, 79);
  --accent-dim: rgba(215, 53, 79, 0.15);
  --text: #f0f0f2;
  --muted: #8888a0;
  --green: #22c55e;
  --red: #ef4444;
}

:root[data-theme="light"] {
  --bg: #f5f5f7;
  --surface: #ffffff;
  --surface2: #f0f0f2;
  --border: #e1e1e6;
  --accent: rgb(215, 53, 79);
  --accent-dim: rgba(215, 53, 79, 0.10);
  --text: #141414;
  --muted: #6b6b76;
  --green: #16a34a;
  --red: #dc2626;
}