/* ==========================================================
   EGOR CASINO — дизайн-токены
   Подключение: <html data-theme="neon|bsuir"> + <body class="ds">
   Две темы: «Неон» (казино) и «БГУИР» (учёба). Тема меняет только токены —
   все компоненты читают семантические токены и не знают о теме.
   Переключение в консоли: document.documentElement.dataset.theme = 'bsuir'
   ========================================================== */

.ds {
  /* ---------- База: нейтральная шкала «ночь» ---------- */
  --n-950: #07060D;
  --n-900: #0D0B18;
  --n-850: #141225;
  --n-800: #1C1933;
  --n-700: #2A2648;
  --n-500: #5E5886;
  --n-300: #A9A3C7;
  --n-100: #E6E2F7;
  --n-0:   #F4F1FF;

  /* ---------- База: неоны (у каждого одна роль) ---------- */
  --pink-400: #FF6BBB;  --pink-500: #FF3EA5;  --pink-700: #B8176F;  --pink-950: #2E0419;
  --lime-400: #CCFF73;  --lime-500: #B6FF3E;  --lime-700: #7BC40F;  --lime-950: #1A2608;
  --cyan-500: #3EE8FF;  --cyan-950: #052A36;
  --gold-500: #FFD23E;  --gold-950: #332403;
  --coral-500:#FF6B4A;  --coral-950:#3A0F07;

  /* ---------- Семантика: поверхности и текст ---------- */
  --bg:          var(--n-950);
  --surf-1:      var(--n-900);   /* карточка в потоке */
  --surf-2:      var(--n-850);   /* панель, инпут */
  --surf-3:      var(--n-800);   /* модалка, поповер */
  --line:        var(--n-700);
  --line-strong: var(--n-500);
  --tx:          var(--n-0);
  --tx-2:        var(--n-300);
  --tx-3:        var(--n-500);   /* только подписи и disabled */

  /* ---------- Семантика: роли неонов ---------- */
  --accent:       var(--pink-500);   /* главное действие режима */
  --accent-hover: var(--pink-400);
  --accent-deep:  var(--pink-700);
  --on-accent:    var(--pink-950);
  --info:         var(--cyan-500);   /* числа, баланс, множители */
  --on-info:      var(--cyan-950);
  --win:          var(--gold-500);   /* ТОЛЬКО момент выигрыша */
  --on-win:       var(--gold-950);
  --loss:         var(--coral-500);  /* проигрыш, фолд, удаление */
  --on-loss:      var(--coral-950);

  /* ---------- Типографика ---------- */
  --font-display: 'Russo One', 'Onest', system-ui, sans-serif; /* заголовки ≥24px */
  --font-ui:      'Onest', system-ui, 'Segoe UI', sans-serif;   /* весь интерфейс */
  --font-num:     'JetBrains Mono', ui-monospace, monospace;    /* деньги и множители */

  --fs-12: 0.75rem;   /* подписи */
  --fs-14: 0.875rem;  /* UI, кнопки */
  --fs-16: 1rem;      /* основной текст */
  --fs-20: 1.25rem;   /* подзаголовок */
  --fs-24: 1.5rem;    /* заголовок блока */
  --fs-32: 2rem;      /* заголовок экрана */
  --fs-48: 3rem;      /* выигрыш, баланс крупно */
  --fs-72: 4.5rem;    /* неоновая вывеска */
  --lh-tight: 1.1;
  --lh-body:  1.55;

  /* ---------- Отступы (шаг 4) ---------- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-6: 24px; --sp-8: 32px; --sp-12: 48px; --sp-16: 64px;

  /* ---------- Скругления: 5 вместо 17 ---------- */
  --r-xs: 6px;     /* бейджи, чипы */
  --r-sm: 10px;    /* кнопки, инпуты */
  --r-md: 16px;    /* карточки */
  --r-lg: 24px;    /* панели, модалки */
  --r-pill: 999px; /* переключатели */

  /* ---------- Свечение: только на действие или результат ---------- */
  --glow-1: 0 0 0 1px var(--accent);
  --glow-2: 0 0 0 1px var(--accent), 0 0 18px color-mix(in srgb, var(--accent) 45%, transparent);
  --glow-win: 0 0 0 1px var(--win), 0 0 36px color-mix(in srgb, var(--win) 55%, transparent);
  --neon-text: 0 0 6px color-mix(in srgb, var(--accent) 80%, transparent),
               0 0 22px color-mix(in srgb, var(--accent) 55%, transparent),
               0 0 48px color-mix(in srgb, var(--accent) 35%, transparent);

  /* ---------- Движение ---------- */
  --t-fast: 120ms;
  --t-base: 220ms;
  --t-slow: 420ms;
  --ease-out:  cubic-bezier(.2, .8, .2, 1);
  --ease-snap: cubic-bezier(.3, 1.4, .5, 1);

  /* ---------- Расширения проекта (собраны только из базовых токенов выше) ---------- */
  --card-face:   var(--n-0);
  --card-ink:    var(--n-950);
  --card-red:    var(--pink-700);
  --card-back:   var(--accent-deep);
  --wheel-red:   var(--pink-700);
  --wheel-black: var(--n-900);
  --wheel-zero:  var(--lime-700);
  --scrim:       color-mix(in srgb, var(--n-950) 72%, transparent);
  --shadow-pop:  0 24px 64px color-mix(in srgb, var(--n-950) 70%, transparent);
  --ambient:     color-mix(in srgb, var(--accent) 11%, transparent); /* подсветка фона сверху */
  --bdg-gold:    var(--gold-500);   /* цвета бейджей титулов — из палитры неонов */
  --bdg-pink:    var(--pink-400);
  --bdg-cyan:    var(--cyan-500);
  --bdg-lime:    var(--lime-500);
  --door-bg:     var(--n-900);
  --door-tx:     var(--n-100);
  --door-glow:   var(--pink-500);
  --topbar-h:    64px;

  background: var(--bg);
  color: var(--tx);
  font-family: var(--font-ui);
}

/* ---------- Тема «БГУИР»: строгая, светлая, академичная, без свечения ---------- */
/* Синий — ориентир из роадмапа; при необходимости сверить с брендбуком БГУИР. */
[data-theme="bsuir"] .ds {
  --bg:          #FFFFFF;
  --surf-1:      #F4F7FB;
  --surf-2:      #E8EEF6;
  --surf-3:      #DCE4EF;
  --line:        #D3DCE8;
  --line-strong: #A7B5C8;
  --tx:          #0F1E33;
  --tx-2:        #4A5B73;
  --tx-3:        #7C8BA1;

  --accent:       #1B4F9C;
  --accent-hover: #143D7A;
  --accent-deep:  #0F2F5E;
  --on-accent:    #FFFFFF;
  --info:         #1B4F9C;   /* тот же синий — одна акцентная краска */
  --on-info:      #FFFFFF;
  --win:          #9A6400;   /* тёмное золото: читается на белом */
  --on-win:       #FFFFFF;
  --loss:         #B3261E;
  --on-loss:      #FFFFFF;

  --font-display: 'PT Serif', Georgia, serif;
  --font-ui:      'PT Sans', system-ui, 'Segoe UI', sans-serif;
  --font-num:     'PT Mono', ui-monospace, monospace;

  --r-xs: 4px; --r-sm: 6px; --r-md: 10px; --r-lg: 10px;

  --glow-1: 0 0 0 1px var(--accent);
  --glow-2: 0 0 0 1px var(--accent);
  --glow-win: 0 0 0 1px var(--win);
  --neon-text: none;
  --scrim: color-mix(in srgb, #0F1E33 45%, transparent);
  --shadow-pop: 0 12px 32px color-mix(in srgb, #0F1E33 14%, transparent);
  --ambient: transparent;
  /* Бейджи на белом: те же оттенки, но тёмные — чтобы читались */
  --bdg-gold: #8A5A00;
  --bdg-pink: #A3135E;
  --bdg-cyan: #00687A;
  --bdg-lime: #3D6B00;
}
:root[data-theme="bsuir"] { color-scheme: light; }
:root[data-theme="neon"], :root:not([data-theme]) { color-scheme: dark; }

@media (prefers-reduced-motion: reduce) {
  .ds { --t-fast: 0ms; --t-base: 0ms; --t-slow: 0ms; }
}
/* Настройка «Анимации: выкл» */
.ds[data-anim="off"] { --t-fast: 0ms; --t-base: 0ms; --t-slow: 0ms; }
