:root {
  --color-bg: #14181d;
  --color-bg-elevated: #1c222a;
  --color-bg-elevated-2: #252d37;
  --color-border: #2d3642;
  --color-text: #e9ecf1;
  --color-text-muted: #aab3c0;
  --color-text-faint: #7a8492; /* 4.5:1+ on --color-bg — safe for normal text */

  --color-accent: #e2812e;          /* amber/garage-orange — text/links/focus rings */
  --color-accent-hover: #f0954a;
  --color-accent-solid: #c8661a;    /* solid button fill — white text hits 4.6:1 */
  --color-accent-contrast: #ffffff;

  --color-success: #3ecf8e;
  --color-success-bg: #10261c;
  --color-warning: #e8b64a;
  --color-warning-bg: #2b2312;
  --color-danger: #e5636f;
  --color-danger-bg: #2b1417;

  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;

  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.35);
}

/* Light mode — opt-in per user via the account theme toggle. */
:root[data-theme="light"] {
  --color-bg: #f6f6f5;
  --color-bg-elevated: #ffffff;
  --color-bg-elevated-2: #eef0f1;
  --color-border: #d9dce0;
  --color-text: #1a1e24;
  --color-text-muted: #4b5563;
  --color-text-faint: #69707e;

  --color-accent: #b8570f;
  --color-accent-hover: #9c4a0c;
  --color-accent-solid: #b8570f;
  --color-accent-contrast: #ffffff;

  --color-success: #15803d;
  --color-success-bg: #dcfce7;
  --color-warning: #92620a;
  --color-warning-bg: #fef3c7;
  --color-danger: #b91c1c;
  --color-danger-bg: #fee2e2;

  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
}