/* ============================================================
   AI COMPASS — DESIGN TOKENS
   Три темы. Всё через переменные: цвет, шрифт, радиус, тень, свечение.
   Сменить палитру = отредактировать один блок ниже.
   ============================================================ */

:root {
  /* ---- размеры / ритм (общие для всех тем) ---- */
  --container: 1200px;
  --gutter: clamp(16px, 4vw, 32px);
  --section-y: clamp(56px, 9vw, 104px);

  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 20px;
  --r-xl: 24px;
  --r-2xl: 28px;
  --r-pill: 999px;

  --dur-fast: .15s;
  --dur: .28s;
  --dur-slow: .5s;
  --ease: cubic-bezier(.22, 1, .36, 1);

  --z-nav: 100;
  --z-overlay: 900;
  --z-modal: 1000;
  --z-toast: 1100;
}

/* ============================================================
   THEME 1 — NEON  (основная, по умолчанию)
   Ночной клуб: глубокий фиолетово-чёрный, розово-пурпурные акценты.
   ============================================================ */
:root,
[data-theme="neon"] {
  --font-head: 'Unbounded', 'Manrope', system-ui, sans-serif;
  --font-body: 'Manrope', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --head-weight: 800;
  --head-weight-hero: 900;
  --head-tracking: -.02em;

  --bg:            #0c0a13;
  --bg-alt:        #100d1a;
  --surface:       #161221;
  --surface-2:     #1d1730;
  --surface-glass: rgba(22, 18, 33, .78);
  --surface-solid: #161221;

  --border:        rgba(217, 166, 255, .12);
  --border-strong: rgba(199, 125, 255, .34);

  --text:          #f1edf8;
  --text-dim:      #b9aecb;
  --text-mute:     #9d90b3;
  --text-strike:   #6f6485;
  --on-accent:     #ffffff;

  --accent:        #c77dff;
  --accent-2:      #ff8ad4;
  --accent-3:      #a34df0;
  --grad:          linear-gradient(135deg, #a34df0, #e35bbf);
  --grad-text:     linear-gradient(135deg, #c77dff, #ff8ad4);
  --grad-soft:     linear-gradient(135deg, rgba(163, 77, 240, .16), rgba(227, 91, 191, .12));

  --star:          #ffc95e;
  --ok:            #4ade80;
  --warn:          #ffb648;
  --danger:        #ff6b8a;

  --shadow:        0 18px 48px rgba(0, 0, 0, .45);
  --shadow-sm:     0 6px 20px rgba(0, 0, 0, .35);
  --glow:          0 0 24px rgba(199, 125, 255, .28);
  --glow-strong:   0 0 12px rgba(199, 125, 255, .5), 0 0 48px rgba(227, 91, 191, .28);
  --blur:          blur(14px);

  --aura-1: rgba(163, 77, 240, .30);
  --aura-2: rgba(227, 91, 191, .22);
  --aura-3: rgba(90, 120, 255, .16);

  --nav-bg: rgba(12, 10, 19, .85);
  --scheme: dark;
}

/* ============================================================
   THEME 2 — WARM  «Тёплое стекло», светлая
   Тёплый минимализм, стеклянные карточки, жжёный оранжевый акцент.
   ============================================================ */
[data-theme="warm"] {
  --font-head: 'Golos Text', system-ui, sans-serif;
  --font-body: 'Golos Text', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --head-weight: 600;
  --head-weight-hero: 600;
  --head-tracking: -.03em;

  --bg:            #F4F3F0;
  --bg-alt:        #EEECE6;
  --surface:       rgba(255, 255, 255, .78);
  --surface-2:     #EEECE6;
  --surface-glass: rgba(255, 255, 255, .78);
  --surface-solid: #FFFFFF;

  --border:        rgba(28, 27, 23, .07);
  --border-strong: rgba(222, 74, 0, .30);

  --text:          #1C1B17;
  --text-dim:      #6C6A63;
  --text-mute:     #8F8D84;
  --text-strike:   #A9A79E;
  --on-accent:     #ffffff;

  --accent:        #DE4A00;
  --accent-2:      #E8873A;
  --accent-3:      #C23F00;
  --grad:          linear-gradient(135deg, #DE4A00, #E8873A);
  --grad-text:     linear-gradient(135deg, #DE4A00, #C23F00);
  --grad-soft:     linear-gradient(135deg, rgba(222, 74, 0, .10), rgba(232, 135, 58, .07));

  --star:          #E8A020;
  --ok:            #2E9E5B;
  --warn:          #C98A16;
  --danger:        #DE4A00;

  --shadow:        0 12px 32px rgba(28, 27, 23, .07), 0 2px 6px rgba(28, 27, 23, .04);
  --shadow-sm:     0 4px 14px rgba(28, 27, 23, .06);
  --glow:          none;
  --glow-strong:   none;
  --blur:          blur(20px);

  --aura-1: rgba(255, 196, 150, .35);
  --aura-2: rgba(170, 205, 255, .30);
  --aura-3: rgba(255, 235, 170, .30);

  --nav-bg: rgba(244, 243, 240, .82);
  --scheme: light;
}

/* ============================================================
   THEME 3 — GRAPHITE  «Тёплое стекло», тёмная
   Графит + тёплый оранжевый. Спокойная премиальная.
   ============================================================ */
[data-theme="graphite"] {
  --font-head: 'Golos Text', system-ui, sans-serif;
  --font-body: 'Golos Text', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --head-weight: 600;
  --head-weight-hero: 600;
  --head-tracking: -.03em;

  --bg:            #121214;
  --bg-alt:        #0A0A0C;
  --surface:       rgba(30, 30, 34, .72);
  --surface-2:     #28282D;
  --surface-glass: rgba(30, 30, 34, .72);
  --surface-solid: #1E1E22;

  --border:        rgba(237, 235, 229, .08);
  --border-strong: rgba(255, 106, 43, .32);

  --text:          #EDEBE5;
  --text-dim:      #9D9B94;
  --text-mute:     #82807A;
  --text-strike:   #62605B;
  --on-accent:     #ffffff;

  --accent:        #FF6A2B;
  --accent-2:      #FFA05E;
  --accent-3:      #E0521A;
  --grad:          linear-gradient(135deg, #FF6A2B, #FFA05E);
  --grad-text:     linear-gradient(135deg, #FF6A2B, #FFC15E);
  --grad-soft:     linear-gradient(135deg, rgba(255, 106, 43, .14), rgba(255, 160, 94, .08));

  --star:          #FFC85E;
  --ok:            #4ade80;
  --warn:          #FFC15E;
  --danger:        #FF6A2B;

  --shadow:        0 12px 32px rgba(0, 0, 0, .40);
  --shadow-sm:     0 4px 16px rgba(0, 0, 0, .30);
  --glow:          none;
  --glow-strong:   0 0 20px rgba(255, 106, 43, .22);
  --blur:          blur(20px);

  --aura-1: rgba(255, 106, 43, .14);
  --aura-2: rgba(90, 120, 255, .11);
  --aura-3: rgba(255, 200, 80, .09);

  --nav-bg: rgba(18, 18, 20, .84);
  --scheme: dark;
}