/* FORGE design tokens — Light (default) and Dark (opt-in via data-theme="dark").
   Palette per Masterkonzept v1.0 decision C: warm white, violet → electric blue, turquoise. */
:root {
  --font-ui: "Geist", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-display: "Inter Tight", "Geist", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --font-mono: "Geist Mono", "Cascadia Mono", Consolas, monospace;

  --r-xs: 6px; --r-sm: 9px; --r-md: 13px; --r-lg: 18px; --r-xl: 24px; --r-pill: 999px;
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .5, 1);
  --t-fast: 120ms; --t: 200ms; --t-slow: 360ms;
  --rail: 244px;

  color-scheme: light;
  --bg: #fbfaff;
  --bg-grad: radial-gradient(900px 520px at 88% -8%, rgba(85, 71, 218, .10), transparent 62%), radial-gradient(800px 480px at -8% 108%, rgba(20, 200, 189, .08), transparent 60%);
  --surface: #ffffff;
  --surface-2: #f6f5fd;
  --surface-3: #eeecf9;
  --surface-inv: #15132b;
  --glass: rgba(255, 255, 255, .72);
  --line: rgba(35, 30, 90, .08);
  --line-2: rgba(35, 30, 90, .14);
  --text: #17152e;
  --text-2: #57546f;
  --text-3: #8d8aa3;
  --text-inv: #f6f5ff;
  --accent: #5547da;
  --accent-2: #3477ff;
  --accent-3: #14c8bd;
  --accent-grad: linear-gradient(120deg, #5547da 0%, #3477ff 60%, #14c8bd 120%);
  --accent-ink: #ffffff;
  --accent-soft: rgba(85, 71, 218, .09);
  --ring: rgba(85, 71, 218, .38);
  --ok: #0e9a6b; --ok-soft: rgba(14, 154, 107, .1);
  --warn: #b26b00; --warn-soft: rgba(214, 140, 0, .12);
  --bad: #d6334a; --bad-soft: rgba(214, 51, 74, .09);
  --info: #2a6df5; --info-soft: rgba(42, 109, 245, .09);
  --shadow-1: 0 1px 2px rgba(30, 25, 80, .05);
  --shadow-2: 0 1px 2px rgba(30, 25, 80, .04), 0 14px 34px -16px rgba(50, 40, 140, .22);
  --shadow-3: 0 30px 70px -20px rgba(40, 30, 120, .35), 0 0 0 1px var(--line-2);
  --glow: 0 10px 30px -10px rgba(85, 71, 218, .55);
  --scrim: rgba(23, 21, 46, .32);
  --canvas: #0e0d1a;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b0a14;
  --bg-grad: radial-gradient(900px 520px at 88% -8%, rgba(110, 96, 255, .16), transparent 62%), radial-gradient(800px 480px at -8% 108%, rgba(20, 200, 189, .09), transparent 60%);
  --surface: #13121f;
  --surface-2: #1a1829;
  --surface-3: #232136;
  --surface-inv: #f4f3ff;
  --glass: rgba(19, 18, 31, .72);
  --line: rgba(255, 255, 255, .07);
  --line-2: rgba(255, 255, 255, .12);
  --text: #eeedf8;
  --text-2: #a9a6c2;
  --text-3: #716e8c;
  --text-inv: #15132b;
  --accent: #7d70ff;
  --accent-2: #4f8cff;
  --accent-3: #2fe0d2;
  --accent-grad: linear-gradient(120deg, #7d70ff 0%, #4f8cff 60%, #2fe0d2 120%);
  --accent-ink: #ffffff;
  --accent-soft: rgba(125, 112, 255, .15);
  --ring: rgba(125, 112, 255, .5);
  --ok: #3ddc97; --ok-soft: rgba(61, 220, 151, .13);
  --warn: #f5b83d; --warn-soft: rgba(245, 184, 61, .13);
  --bad: #ff6b7d; --bad-soft: rgba(255, 107, 125, .13);
  --info: #6aa8ff; --info-soft: rgba(106, 168, 255, .13);
  --shadow-1: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-2: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 14px 34px -14px rgba(0, 0, 0, .65);
  --shadow-3: 0 30px 70px -18px rgba(0, 0, 0, .75), 0 0 0 1px var(--line-2);
  --glow: 0 10px 34px -10px rgba(125, 112, 255, .6);
  --scrim: rgba(4, 4, 10, .66);
  --canvas: #07060d;
}