:root {
  color-scheme: light dark;

  --canvas-background: rgb(245 246 248);
  --surface-card: rgb(255 255 255);
  --surface-hover: #E6ECF2;
  --border-subtle: #CFD7E2;
  --text-primary: #11161D;
  --text-muted: #526071;

  --orokin-gold: #8F7124;
  --accent-primary: #EA580C;
  --tenno-cobalt: #255285;
  --helminth-green: #15803D;
  --thermal-amber: #B45309;
  --infested-red: #B91C1C;

  --accent-brand: var(--accent-primary);
  --accent-interactive: var(--tenno-cobalt);
  --status-ok: var(--helminth-green);
  --status-warn: var(--thermal-amber);
  --status-danger: var(--infested-red);
  --on-accent: rgb(255 255 255);

  --font-sans: 'IBM Plex Sans', 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;

  --radius: 10px;
  --measure: 66ch;
}

[data-theme='dark'] {
  --canvas-background: #0F1216;
  --surface-card: #181D24;
  --surface-hover: #222933;
  --border-subtle: #313B4A;
  --text-primary: rgb(240 243 247);
  --text-muted: #9CA8BA;

  --orokin-gold: #C8A951;
  --tenno-cobalt: #4D88C7;
  --helminth-green: #22C55E;
  --thermal-amber: rgb(245 158 11);
  --infested-red: #EF4444;

  --on-accent: var(--canvas-background);
  --accent-primary: #FB923C;
}