/*
  easywin — общие токены стиля для прототипов в коде (Lobby, Mines, Flight Dispatcher).
  Источник: docs/DICE-SPEC.md §9 (движение) и §11 (палитра, шрифты, формы, неон).
  Файл общий: правит только Claude. Потоки подключают его так:
    <link rel="stylesheet" href="../shared/tokens.css">
*/

@font-face {
  font-family: "Manrope";
  src: url("fonts/Manrope-Variable.ttf") format("truetype");
  font-weight: 200 800;
  font-display: swap;
}

@font-face {
  font-family: "Knewave";
  src: url("fonts/Knewave-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Kaushan Script";
  src: url("fonts/KaushanScript-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}

:root {
  /* Палитра, §11.2 */
  --ew-ink: #07090A;          /* фон страницы */
  --ew-graphite: #13171C;     /* плитки, меню */
  --ew-slate: #1C212B;        /* поля */
  --ew-steel: #222733;        /* вторичные кнопки */
  --ew-text: #FFF6FF;         /* основной текст */
  --ew-muted: #A9A5BD;        /* подписи */
  --ew-violet: #681BFD;       /* только действие: главная кнопка, выбранная вкладка, «+» баланса */
  --ew-lilac: #7F61FD;        /* бегунок, значки полей */
  --ew-focus: #C9B8FF;        /* фокус */
  --ew-win: #35CF72;
  --ew-win-mint: #42EDAA;     /* «Won», зелёная метка */
  --ew-loss: #F92F3A;         /* красная зона и метка */
  --ew-loss-text: #FF5A64;    /* только для текста проигрыша */
  --ew-coin-gold: #FEC22B;    /* монета, крупный выигрыш */
  --ew-brand-gold: #E7BA63;   /* золото бренда, рамки арта */
  --ew-border: rgba(255, 255, 255, .06);

  /* Шрифты, §11.3. Не больше трёх семейств. */
  --ew-font-ui: "Manrope", system-ui, sans-serif;            /* 500, 600, 800 */
  --ew-font-result: "Knewave", "Manrope", sans-serif;        /* WIN, BIG WIN, LOSE — только заглавными */
  --ew-font-phrase: "Kaushan Script", "Manrope", cursive;    /* слоган и фраза реакции */

  /* Формы, §11.4 */
  --ew-radius: 12px;          /* кнопки, поля, плитки */
  --ew-radius-pill: 999px;    /* баланс, метка результата */
  --ew-radius-scene-desktop: 16px;

  /* Отступы */
  --ew-space-1: 4px;
  --ew-space-2: 8px;
  --ew-space-3: 12px;
  --ew-space-4: 16px;
  --ew-space-5: 24px;
  --ew-space-6: 32px;

  /* Движение, §9 (Material Design 3) */
  --ew-ease-standard: cubic-bezier(.2, 0, 0, 1);
  --ew-ease-decelerate: cubic-bezier(.05, .7, .1, 1);
  --ew-ease-accelerate: cubic-bezier(.3, 0, .8, .15);
  --ew-motion-press: 100ms;
  --ew-motion-controls: 150ms;
  --ew-motion-marker: 300ms;
  --ew-motion-enter: 400ms;
  --ew-motion-exit: 200ms;
  --ew-motion-roll: 1000ms;
  --ew-motion-confetti: 1400ms;
  --ew-motion-reduced: 150ms;
}

/* Табличные цифры для сумм, баланса и множителей (§11.3) */
.ew-num {
  font-family: var(--ew-font-ui);
  font-weight: 800;
  font-variant-numeric: tabular-nums lining-nums;
}

/* Неоновая строка сцены (§11.6): только слоган или фраза реакции, не больше двух светящихся предметов в кадре. */
.ew-neon {
  --ew-neon-color: var(--ew-lilac);
  color: #fff;
  text-shadow:
    0 0 2px color-mix(in srgb, var(--ew-neon-color) 90%, transparent),
    0 0 8px color-mix(in srgb, var(--ew-neon-color) 50%, transparent),
    0 0 24px color-mix(in srgb, var(--ew-neon-color) 25%, transparent);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ew-motion-press: 0ms;
    --ew-motion-roll: 0ms;
    --ew-motion-confetti: 0ms;
  }
}