/* ── Light mode (default) ── */
:root {
  --bg: #e8e8e8;
  --surface: #e9e9e9;
  --hover: #dcdcdc;
  --active: #d0d0d0;
  --text: #1e1e1e;
  --text-dim: #555555;
  --text-faint: #888888;
  --border: rgba(30, 30, 30, 0.13);

  --teal: #1e1e1e;
  --green: #1e1e1e;
  --gold: #1e1e1e;
  --purple: #1e1e1e;
  --blue: #1e1e1e;
  --red: #1e1e1e;

  --green-dot: #16a34a;

  --status-running: #16a34a;
  --status-paused: #eab308;
  --status-error: #e11d48;

  --nav-bg: rgba(232, 232, 232, 0.85);

  --font-display: 'Sohne', 'Helvetica Neue', Arial, sans-serif;
  --font-sans: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}

/* ── Dark mode ── */
html.dark {
  --bg: #011627;
  --surface: #0A2534;
  --hover: #0e2e42;
  --active: #12384e;
  --text: #C0C7D1;
  --text-dim: #5F7D97;
  --text-faint: #3A4B5A;
  --border: #223E64;

  --teal: #75D1C4;
  --green: #AAE87B;
  --gold: #FEC97D;
  --purple: #9372C9;
  --blue: #6E9CF1;
  --red: #f43f5e;

  --nav-bg: rgba(1, 22, 39, 0.85);
}