/* Design tokens — light (default) and dark themes */
:root {
  --bg: #fbf6f3;
  --bg-2: #f5ece8;
  --surface: #ffffff;
  --surface-2: #fffaf7;
  --surface-3: #f7eeea;
  --line: #eee0db;
  --line-2: #e2cfc9;
  --ink: #27181b;
  --ink-2: #4d3b3f;
  --ink-3: #836e6e;
  --muted: #9b8584;
  --brand: #c9323f;
  --brand-2: #e3664f;
  --brand-3: #ff9e7d;
  --brand-ink: #7c1c29;
  --brand-soft: #fde9e4;
  --brand-soft-2: #fad5cb;
  --gold: #e7ad45;
  --ok: #2f9e6e;
  --ok-soft: #e2f4eb;
  --warn: #c98016;
  --warn-soft: #fcf0da;
  --bad: #d64545;
  --bad-soft: #fbe4e4;
  --info: #3576bd;
  --info-soft: #e3eefa;
  --role-primary: #e2343f;
  --role-secondary: #f5a13a;
  --role-stabilizer: #5a93d8;
  --side-bg: #2a1219;
  --side-bg-2: #3b1821;
  --side-ink: #dcc3c5;
  --side-ink-2: #a8878b;
  --side-line: #4d242d;
  --shadow-sm: 0 1px 2px rgba(70, 22, 28, .06), 0 2px 10px rgba(70, 22, 28, .05);
  --shadow: 0 12px 32px rgba(92, 34, 35, .085);
  --shadow-lg: 0 28px 70px rgba(50, 12, 20, .22);
  --radius: 18px;
  --radius-sm: 12px;
  --radius-xs: 8px;
  --hero: radial-gradient(circle at 80% 14%, rgba(255, 150, 120, .35) 0, transparent 32%), linear-gradient(115deg, #36141f 0%, #6e2230 48%, #b9424a 100%);
  --hero-ink: #fff5f1;
  --hero-ink-2: #f4d0ca;
  --stage: radial-gradient(ellipse at 50% 38%, #fffaf5 0%, #f8ede7 60%, #efdfd7 100%);
  --focus: #ff8e6e;
  --font: 'DM Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-head: 'Manrope', 'DM Sans', ui-sans-serif, system-ui, sans-serif;
  --sidebar-w: 256px;
  --topbar-h: 64px;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg: #110a0c;
  --bg-2: #170d10;
  --surface: #1c1114;
  --surface-2: #22151a;
  --surface-3: #2a1a1f;
  --line: #342126;
  --line-2: #452b32;
  --ink: #f7ebe8;
  --ink-2: #dac6c2;
  --ink-3: #a99090;
  --muted: #8d7676;
  --brand: #f24d5a;
  --brand-2: #ff7c5e;
  --brand-3: #ffa487;
  --brand-ink: #ffb8ad;
  --brand-soft: #35181e;
  --brand-soft-2: #4a1f27;
  --gold: #f2bd57;
  --ok: #4cc28b;
  --ok-soft: #132a20;
  --warn: #f0ae3c;
  --warn-soft: #2e2212;
  --bad: #f06363;
  --bad-soft: #341719;
  --info: #6aa6e8;
  --info-soft: #14233a;
  --side-bg: #0d0608;
  --side-bg-2: #1a0c10;
  --side-ink: #d6bcbe;
  --side-ink-2: #8f7275;
  --side-line: #2c1419;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4), 0 2px 10px rgba(0, 0, 0, .25);
  --shadow: 0 14px 34px rgba(0, 0, 0, .35);
  --shadow-lg: 0 28px 70px rgba(0, 0, 0, .55);
  --hero: radial-gradient(circle at 80% 14%, rgba(255, 110, 90, .28) 0, transparent 34%), linear-gradient(115deg, #1f0b11 0%, #4a1520 50%, #8a2d38 100%);
  --stage: radial-gradient(ellipse at 50% 38%, #2c1a1f 0%, #1c1014 58%, #120a0c 100%);
  color-scheme: dark;
}