/* ── Фестиваль · общие стили ─────────────────────────────────────────────── */
/* Шрифты лежат на нашем сервере — не зависим от Google Fonts */
@font-face { font-family: 'Russo One'; font-display: swap; font-weight: 400;
  src: url(fonts/russo-one-cyrillic-400-normal.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Russo One'; font-display: swap; font-weight: 400;
  src: url(fonts/russo-one-latin-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Golos Text'; font-display: swap; font-weight: 400 900;
  src: url(fonts/golos-text-cyrillic-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-display: swap; font-weight: 400 900;
  src: url(fonts/golos-text-latin-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --orange: #ff5a1a;
  --orange-deep: #e8470a;
  --cyan: #27b5f0;
  --cyan-soft: #d6effa;
  --ink: #121212;
  --ink-2: #4a4a4a;
  --ink-3: #8a8a8a;
  --paper: #f2f0eb;
  --paper-2: #e7e4dd;
  --bg: #ffffff;
  --ok: #19a463;
  --ok-soft: #dcf5e8;
  --bad: #e5361b;
  --bad-soft: #fde3dc;
  --warn: #c98a00;
  --warn-soft: #fff1c9;
  --radius: 6px;
  --display: 'Russo One', 'Arial Black', sans-serif;
  --body: 'Golos Text', 'Segoe UI', Roboto, Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--bg);
  color: var(--ink);
  font: 17px/1.45 var(--body);
  -webkit-font-smoothing: antialiased;
}
button, input, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }

/* Заголовок-плашка как в презентации */
.slab {
  display: inline-block;
  font-family: var(--display);
  font-weight: 400;
  line-height: 1.05;
  padding: .18em .42em .2em;
  margin: 0;
}
.slab--cyan { background: var(--cyan); color: var(--ink); }
.slab--orange { background: var(--orange); color: #fff; }
.slab--ink { background: var(--ink); color: #fff; }

.kicker { font-weight: 600; letter-spacing: .02em; font-size: 15px; color: var(--ink); }

/* Бумажная карточка со скотчем */
.paper {
  position: relative;
  background: var(--paper);
  border-radius: 3px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04), 0 10px 24px -14px rgba(0,0,0,.35);
}
.paper.taped::before {
  content: '';
  position: absolute;
  top: -12px; left: 22px;
  width: 78px; height: 24px;
  background: var(--orange);
  opacity: .92;
  transform: rotate(-7deg);
  clip-path: polygon(3% 0, 97% 4%, 100% 30%, 96% 55%, 100% 82%, 95% 100%, 4% 96%, 0 70%, 4% 45%, 0 20%);
}

/* Кнопки */
.btn {
  border: 0;
  border-radius: var(--radius);
  padding: 14px 22px;
  font-family: var(--display);
  font-size: 18px;
  letter-spacing: .01em;
  transition: transform .08s, background .15s, opacity .15s;
}
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .4; cursor: not-allowed; }
.btn--orange { background: var(--orange); color: #fff; }
.btn--orange:hover:not(:disabled) { background: var(--orange-deep); }
.btn--cyan { background: var(--cyan); color: var(--ink); }
.btn--ink { background: var(--ink); color: #fff; }
.btn--ghost { background: transparent; border: 2px solid var(--ink); }
.linkbtn {
  background: none; border: 0; padding: 0;
  color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px;
  font-size: 15px;
}

/* Индикатор связи */
.conn {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--ink-3);
}
.conn::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--ok); }
.conn.off::before { background: var(--bad); animation: blink 1s infinite; }
@keyframes blink { 50% { opacity: .2; } }

/* Фишка лото */
.chip-token {
  display: inline-grid; place-items: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--orange); color: #fff;
  font-family: var(--display); font-size: 19px;
  box-shadow: inset 0 -3px 0 rgba(0,0,0,.18), inset 0 0 0 4px rgba(255,255,255,.18);
}
