:root {
  --bg: #f6f7fb;
  --card: #fff;
  --text: #152033;
  --muted: #637083;
  --line: #d9dee8;
  --primary: #155eef;
  --danger: #b42318;
  --ok: #087443;

  --input-bg: #fff;
  --input-text: #152033;
  --row-stripe: #f8fafc;
  --row-detail: #f8fafc;
  --alert-error-bg: #fee4e2;
  --alert-ok-bg: #dcfae6;
}

/* Dark token block — kept in one place and applied under two selectors:
 *   1. OS dark mode AND user has not forced light
 *   2. User has explicitly chosen dark
 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f172a;
    --card: #1e293b;
    --text: #e2e8f0;
    --muted: #94a3b8;
    --line: #334155;
    --primary: #60a5fa;
    --danger: #f87171;
    --ok: #4ade80;

    --input-bg: #0f172a;
    --input-text: #e2e8f0;
    --row-stripe: #1e293b;
    --row-detail: #172033;
    --alert-error-bg: #3f1d1c;
    --alert-ok-bg: #14352a;
  }
}
:root[data-theme="dark"] {
  --bg: #0f172a;
  --card: #1e293b;
  --text: #e2e8f0;
  --muted: #94a3b8;
  --line: #334155;
  --primary: #60a5fa;
  --danger: #f87171;
  --ok: #4ade80;

  --input-bg: #0f172a;
  --input-text: #e2e8f0;
  --row-stripe: #1e293b;
  --row-detail: #172033;
  --alert-error-bg: #3f1d1c;
  --alert-ok-bg: #14352a;
}