/* Экран для проектора 16:9 — всё в единицах контейнера (cqw/cqh), читается с 8–10 м */
html, body { height: 100%; background: #112E26; overflow: hidden; }
.viewport { width: 100vw; height: 100vh; container-type: size; }
.stage {
  /* на весь экран при любой пропорции; единицы масштабируются от меньшей стороны 16:9 */
  --u: min(1cqw, 1.7778cqh); --v: min(1cqh, 0.5625cqw);
  position: relative;
  width: 100%; height: 100%;
  background: var(--beige); color: var(--text-primary); overflow: hidden;
  display: grid; grid-template-rows: calc(9 * var(--v)) 1fr auto;
}
.stage::before { /* фирменный мотив — золотой контур кольца логотипа, тихо, в углу */
  content: ''; position: absolute; right: calc(-6 * var(--u)); bottom: calc(-10 * var(--v)); width: calc(30 * var(--u)); height: calc(30 * var(--u)); pointer-events: none; opacity: .10;
  background: url(/img/ring-gold.png) center / contain no-repeat;
  transform: rotate(8deg);
}

/* Верхняя полоса */
.topbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 calc(3 * var(--u)); border-bottom: 1px solid var(--border-subtle); position: relative; z-index: 2; }
.brand { display: flex; align-items: center; gap: calc(1 * var(--u)); font-family: var(--font-serif); font-size: calc(2.1 * var(--u)); font-weight: 600; color: var(--green-800); }
.brand img { height: calc(5.6 * var(--v)); width: auto; }
.brand b { color: var(--gold); font-weight: 700; }
.where { font-size: calc(1.35 * var(--u)); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--text-secondary); text-align: center; }
.meta { justify-self: end; display: flex; align-items: center; gap: calc(2 * var(--u)); }
.count { font-size: calc(1.6 * var(--u)); font-weight: 600; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.count b { color: var(--green-800); font-size: calc(2.2 * var(--u)); }
.topbar .timer { width: calc(7 * var(--v)); height: calc(7 * var(--v)); }
.topbar .timer .t-num { font-size: calc(2.2 * var(--u)); }

.main { position: relative; z-index: 1; padding: calc(4 * var(--v)) calc(4 * var(--u)) calc(4 * var(--v)); min-height: 0; display: flex; flex-direction: column; }
.enter { animation: enter .45s var(--ease-out) both; }
@keyframes enter { from { opacity: 0; transform: translateY(calc(1.2 * var(--v))); } }

.overline { font-size: calc(1.45 * var(--u)); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.display { font-family: var(--font-serif); font-weight: 600; color: var(--green-800); line-height: 1.12; }
.q-text { font-size: calc(3.4 * var(--u)); font-weight: 600; line-height: 1.25; color: var(--text-primary); text-wrap: balance; }
.muted { color: var(--text-secondary); }
.chip { display: inline-flex; align-items: center; gap: .5em; padding: .35em .8em; border-radius: 999px; background: var(--accent-soft); color: var(--accent-soft-ink); font-weight: 600; white-space: nowrap; }
.chip.orange { background: var(--warn-soft); color: var(--warn-ink); }
.eye-ico { width: 1.1em; height: 1.1em; vertical-align: -0.15em; }

/* ---------- Регистратура: таблица Сивцева ---------- */
.lobby { display: grid; grid-template-columns: 1.15fr 1fr; gap: calc(4 * var(--u)); height: 100%; align-items: center; }
.sivtsev { display: grid; gap: calc(1.2 * var(--v)); padding: calc(3 * var(--v)) calc(3 * var(--u)); border: 1px solid var(--border-subtle); border-radius: calc(1.2 * var(--u)); background: var(--surface); box-shadow: var(--shadow-sm); }
.sv-row { display: grid; grid-template-columns: calc(5 * var(--u)) 1fr calc(5 * var(--u)); align-items: center; }
.sv-row .lbl { font-size: calc(.95 * var(--u)); font-weight: 600; color: var(--text-tertiary); font-variant-numeric: tabular-nums; }
.sv-row .lbl.r { text-align: right; }
.sv-row .let { text-align: center; font-family: var(--font-sans); font-weight: 800; color: var(--ink); letter-spacing: .5em; padding-left: .5em; line-height: 1; }
.sv-row .let.em { color: var(--gold); }
.sv-1 .let { font-size: calc(11 * var(--v)); } .sv-2 .let { font-size: calc(8.2 * var(--v)); } .sv-3 .let { font-size: calc(6.2 * var(--v)); } .sv-4 .let { font-size: calc(4.6 * var(--v)); }
.sv-sub { text-align: center; font-family: var(--font-serif); font-style: italic; font-size: calc(1.6 * var(--u)); color: var(--text-secondary); margin-top: calc(1 * var(--v)); }
.join { display: grid; gap: calc(2.4 * var(--v)); justify-items: center; text-align: center; }
.qr { width: calc(34 * var(--v)); height: calc(34 * var(--v)); padding: calc(1.4 * var(--v)); background: var(--surface); border-radius: calc(1 * var(--u)); box-shadow: var(--shadow-md); border: 1px solid var(--border-subtle); }
.qr img { width: 100%; height: 100%; display: block; }
.join-url { font-size: calc(1.5 * var(--u)); font-weight: 600; color: var(--green-700); word-break: break-all; }
.join-title { font-size: calc(2.2 * var(--u)); font-weight: 700; color: var(--green-800); }
.joined { display: flex; flex-wrap: wrap; gap: calc(.8 * var(--u)); justify-content: center; max-width: calc(42 * var(--u)); font-size: calc(1.35 * var(--u)); }
.joined .chip { animation: enter .4s var(--ease-out) both; }
.joined-count { font-size: calc(1.5 * var(--u)); color: var(--text-secondary); font-weight: 600; }

/* ---------- Заставка кабинета ---------- */
.intro { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.faces { position: absolute; inset: calc(-4 * var(--v)) calc(-4 * var(--u)); display: grid; grid-template-columns: repeat(5, 1fr); gap: calc(3 * var(--v)) calc(3 * var(--u)); padding: calc(8 * var(--v)) calc(8 * var(--u)); align-content: center; }
.face { aspect-ratio: 1; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: var(--mint); color: var(--green-800); font-weight: 700; font-size: calc(5 * var(--u)); }
.face:nth-child(3n+2) { background: var(--beige-3); }
.face:nth-child(4n+1) { background: var(--beige-3); }
.face img { width: 100%; height: 100%; object-fit: cover; }
.intro-card { position: relative; text-align: center; background: rgba(252, 250, 247, .9); backdrop-filter: blur(6px); padding: calc(5 * var(--v)) calc(6 * var(--u)); border-radius: calc(2 * var(--u)); box-shadow: var(--shadow-lg); max-width: calc(70 * var(--u)); }
.intro-card .overline { font-size: calc(1.8 * var(--u)); }
.intro-card .display { font-size: calc(7.4 * var(--u)); margin: calc(1.5 * var(--v)) 0 calc(1 * var(--v)); }
.intro-card .sub { font-size: calc(2.2 * var(--u)); color: var(--text-secondary); font-family: var(--font-serif); font-style: italic; }
.intro-card .jok { margin-top: calc(3 * var(--v)); font-size: calc(1.5 * var(--u)); display: flex; gap: calc(.8 * var(--u)); flex-wrap: wrap; justify-content: center; align-items: center; }

/* ---------- Найди ложь ---------- */
.lie { display: grid; grid-template-rows: auto 1fr; gap: calc(2 * var(--v)); height: 100%; min-height: 0; }
.lie-head { display: flex; align-items: baseline; gap: calc(2 * var(--u)); }
.lie-head .display { font-size: calc(4 * var(--u)); }
.lie-head .muted { font-size: calc(1.8 * var(--u)); }
.facts { display: grid; gap: calc(1.6 * var(--v)); align-content: center; min-height: 0; }
.fact { display: grid; grid-template-columns: calc(6 * var(--u)) 1fr; align-items: center; gap: 0 calc(2 * var(--u)); padding: calc(2 * var(--v)) calc(2.4 * var(--u)); border-radius: calc(1.2 * var(--u)); background: var(--bg-subtle); border: 2px solid transparent; transition: all .4s var(--ease); position: relative; }
.fact .no { grid-row: span 2; align-self: start; width: calc(5 * var(--u)); height: calc(5 * var(--u)); border-radius: 50%; display: grid; place-items: center; background: var(--green-800); color: var(--gold-light); font-weight: 800; font-size: calc(2.6 * var(--u)); }
.fact .txt { align-self: center; min-height: calc(5 * var(--u)); display: flex; align-items: center; font-size: calc(2.6 * var(--u)); font-weight: 600; line-height: 1.25; }
.fact .voters { grid-column: 2; display: flex; flex-wrap: wrap; gap: calc(.6 * var(--u)); font-size: calc(1.25 * var(--u)); margin-top: calc(.6 * var(--v)); }
.fact.is-lie { background: var(--warn-soft); border-color: var(--warn-text); }
.fact.is-lie .no { background: var(--warn-text); color: #fff; }
.fact.is-truth { opacity: .55; }
.fact .stamp { position: absolute; right: calc(2.4 * var(--u)); top: 50%; transform: translateY(-50%) rotate(-8deg); font-weight: 800; font-size: calc(2.6 * var(--u)); letter-spacing: .12em; color: var(--warn-text); border: calc(.35 * var(--u)) solid var(--warn-text); border-radius: calc(.6 * var(--u)); padding: calc(.3 * var(--v)) calc(1 * var(--u)); animation: stamp .5s var(--ease-out) both; background: var(--surface); }
@keyframes stamp { from { opacity: 0; transform: translateY(-50%) rotate(-8deg) scale(1.6); } }

/* ---------- Ближе всех ---------- */
.closest { display: grid; grid-template-rows: auto 1fr; gap: calc(3 * var(--v)); height: 100%; }
.closest .q-text { font-size: calc(3.8 * var(--u)); }
.mult { margin-left: calc(1 * var(--u)); }
.scale-wrap { align-self: center; display: grid; gap: calc(2.4 * var(--v)); }
.scale { position: relative; height: calc(22 * var(--v)); margin: 0 calc(4 * var(--u)); }
.scale .axis { position: absolute; left: 0; right: 0; top: 50%; height: calc(.5 * var(--v)); background: var(--border-default); border-radius: calc(1 * var(--v)); }
.mark { position: absolute; top: 50%; transform: translate(-50%, -50%); display: grid; justify-items: center; gap: calc(.6 * var(--v)); animation: enter .5s var(--ease-out) both; }
.mark .dot { width: calc(2 * var(--v)); height: calc(2 * var(--v)); border-radius: 50%; background: var(--green-700); border: calc(.4 * var(--v)) solid #fff; box-shadow: var(--shadow-sm); }
.mark .lab { font-size: calc(1.15 * var(--u)); font-weight: 600; white-space: nowrap; background: var(--surface); padding: calc(.2 * var(--v)) calc(.5 * var(--u)); border-radius: calc(.4 * var(--u)); }
.mark.up .lab { order: -1; }
.mark .val { font-size: calc(1 * var(--u)); color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.mark.answer .dot { width: calc(3.4 * var(--v)); height: calc(3.4 * var(--v)); background: var(--gold); }
.mark.answer .lab { font-size: calc(1.6 * var(--u)); color: var(--gold); font-weight: 800; }
.results { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(1.2 * var(--v)) calc(1.6 * var(--u)); font-size: calc(1.5 * var(--u)); }
.results .r { display: flex; justify-content: space-between; gap: calc(1 * var(--u)); padding: calc(1.2 * var(--v)) calc(1.2 * var(--u)); border-radius: calc(.8 * var(--u)); background: var(--bg-subtle); }
.results .r b { color: var(--green-800); }
.results .r.win { background: var(--accent-soft); }
.answer-big { text-align: center; }
.answer-big .display { font-size: calc(6 * var(--u)); color: var(--gold); font-variant-numeric: tabular-nums; }
.answer-big .cmp { font-size: calc(2 * var(--u)); font-family: var(--font-serif); font-style: italic; color: var(--text-secondary); margin-top: calc(1 * var(--v)); }

/* ---------- Своя игра ---------- */
.board { display: grid; grid-template-columns: repeat(5, 1fr); gap: calc(1.2 * var(--v)) calc(1 * var(--u)); height: 100%; }
.cat { display: grid; grid-template-rows: calc(11 * var(--v)) repeat(5, 1fr); gap: calc(1.2 * var(--v)); }
.cat-title { display: grid; place-items: center; text-align: center; background: var(--green-800); color: #fff; border-radius: calc(.8 * var(--u)); font-weight: 700; font-size: calc(1.45 * var(--u)); line-height: 1.2; padding: 0 calc(1 * var(--u)); }
.cell { display: grid; place-items: center; border-radius: calc(.8 * var(--u)); background: var(--accent-soft); color: var(--green-800); font-size: calc(3.6 * var(--u)); font-weight: 800; font-variant-numeric: tabular-nums; transition: all .5s var(--ease); }
.cell.played { background: var(--bg-subtle); color: transparent; }
.cell.closed { background: var(--bg-subtle); color: var(--border-default); }
.cell.active { background: var(--green-800); color: var(--gold-light); }
.board-foot { margin-top: calc(2 * var(--v)); font-size: calc(1.8 * var(--u)); text-align: center; color: var(--text-secondary); }
.board-foot b { color: var(--green-800); }
.board-wrap { display: grid; grid-template-rows: 1fr auto; height: 100%; }

.cellq { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr auto; gap: calc(2.5 * var(--v)) calc(3 * var(--u)); height: 100%; }
.cellq-head { grid-column: 1 / -1; display: flex; align-items: center; gap: calc(1.5 * var(--u)); }
.cellq-head .val { font-size: calc(2.6 * var(--u)); font-weight: 800; color: var(--gold); }
.cellq-body { display: grid; align-content: center; gap: calc(3 * var(--v)); min-height: 0; }
.cellq-media { width: calc(40 * var(--u)); max-height: calc(58 * var(--v)); display: grid; place-items: center; align-self: center; }
.cellq-media .media-img { width: 100%; height: 100%; max-height: calc(58 * var(--v)); }
.cellq-media .media-img img { max-height: calc(58 * var(--v)); }
.cellq-media .media-emoji { font-size: calc(13 * var(--u)); }
.cellq-media .media-audio audio { width: calc(36 * var(--u)); }
.options { display: grid; grid-template-columns: repeat(2, 1fr); gap: calc(1.4 * var(--v)) calc(1.4 * var(--u)); }
.options.four { grid-template-columns: repeat(4, 1fr); }
.opt { padding: calc(1.6 * var(--v)) calc(1.4 * var(--u)); border-radius: calc(.8 * var(--u)); background: var(--bg-subtle); font-size: calc(1.9 * var(--u)); font-weight: 600; text-align: center; transition: all .4s var(--ease); }
.opt.right { background: var(--green-800); color: #fff; }
.opt.dim { opacity: .45; }
.note { font-size: calc(1.6 * var(--u)); color: var(--text-secondary); display: flex; gap: calc(1 * var(--u)); align-items: center; flex-wrap: wrap; }
.note .chip { font-size: calc(1.4 * var(--u)); }
.hint { font-family: var(--font-serif); font-style: italic; font-size: calc(2.3 * var(--u)); color: var(--text-secondary); border-left: 0; background: var(--warn-soft); padding: calc(1.8 * var(--v)) calc(2 * var(--u)); border-radius: calc(.8 * var(--u)); }
.reveal-box { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; gap: calc(1 * var(--v)) calc(2.4 * var(--u)); align-items: center; padding: calc(2 * var(--v)) calc(2.4 * var(--u)); border-radius: calc(1 * var(--u)); background: var(--accent-soft); animation: enter .45s var(--ease-out) both; }
.reveal-box .ans { font-family: var(--font-serif); font-size: calc(3.6 * var(--u)); font-weight: 700; color: var(--green-800); }
.reveal-box .who { font-size: calc(1.5 * var(--u)); display: flex; flex-wrap: wrap; gap: calc(.6 * var(--u)); align-items: center; }
.reveal-box .who .chip { background: var(--surface); }

/* ---------- Комиссия ---------- */
.duel { display: grid; grid-template-rows: auto 1fr; gap: calc(3.5 * var(--v)); height: 100%; }
.case { font-family: var(--font-serif); font-size: calc(2.9 * var(--u)); line-height: 1.3; color: var(--green-800); text-wrap: balance; }
.sol-grid { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2.4 * var(--u)); align-content: center; }
.sol-grid.many { grid-template-columns: repeat(4, 1fr); gap: calc(1.4 * var(--v)) calc(1.4 * var(--u)); align-content: start; }
.sol { position: relative; padding: calc(3 * var(--v)) calc(2.4 * var(--u)); border-radius: calc(1.2 * var(--u)); background: var(--bg-subtle); display: grid; gap: calc(2 * var(--v)); align-content: start; transition: all .4s var(--ease); }
.sol .lab { font-size: calc(3 * var(--u)); font-weight: 800; color: var(--gold); }
.sol .txt { font-size: calc(2.4 * var(--u)); font-weight: 600; line-height: 1.3; }
.sol-grid.many .sol { padding: calc(1.8 * var(--v)) calc(1.4 * var(--u)); gap: calc(1 * var(--v)); }
.sol-grid.many .lab { font-size: calc(1.8 * var(--u)); }
.sol-grid.many .txt { font-size: calc(1.45 * var(--u)); }
.sol .votes { font-size: calc(1.8 * var(--u)); font-weight: 700; color: var(--green-800); }
.sol .bar { height: calc(1 * var(--v)); border-radius: calc(1 * var(--v)); background: var(--border-subtle); overflow: hidden; }
.sol .bar i { display: block; height: 100%; background: var(--green-700); transform-origin: left center; transform: scaleX(var(--fill, 0)); animation: barfill .8s var(--ease-out) both; }
@keyframes barfill { from { transform: scaleX(0); } }
.sol .author { font-size: calc(1.5 * var(--u)); font-weight: 600; color: var(--text-secondary); }
.sol.lead { background: var(--accent-soft); }
.unanimous { position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%) rotate(-6deg); font-weight: 800; font-size: calc(6 * var(--u)); letter-spacing: .1em; color: var(--gold); border: calc(.6 * var(--u)) solid var(--gold); border-radius: calc(1 * var(--u)); padding: calc(1 * var(--v)) calc(3 * var(--u)); background: rgba(252, 250, 247, .94); animation: gavel .7s var(--ease-out) both .2s; z-index: 5; }
@keyframes gavel { 0% { opacity: 0; transform: translate(-50%, -50%) rotate(-6deg) scale(2.2); } 60% { opacity: 1; } 100% { opacity: 1; transform: translate(-50%, -50%) rotate(-6deg) scale(1); } }

/* ---------- Центр (бонус, ставки, пауза) ---------- */
.center { display: grid; place-items: center; text-align: center; height: 100%; gap: calc(3 * var(--v)); align-content: center; }
.center .display { font-size: calc(5.6 * var(--u)); }
.center .lead { font-size: calc(2.4 * var(--u)); color: var(--text-secondary); max-width: calc(70 * var(--u)); text-wrap: balance; }
.big-count { font-size: calc(9 * var(--u)); font-weight: 800; color: var(--green-800); font-variant-numeric: tabular-nums; line-height: 1; }
.bonus { display: grid; grid-template-columns: 1fr 1fr; gap: calc(4 * var(--u)); height: 100%; align-items: center; }
.bonus .media-img { height: calc(66 * var(--v)); }
.bonus .media-img img { max-height: calc(66 * var(--v)); }
.double { display: grid; grid-template-columns: 1.1fr 1fr; gap: calc(4 * var(--u)); height: 100%; align-items: center; }
.double .media-img { height: calc(72 * var(--v)); }
.double .media-img img { max-height: calc(72 * var(--v)); }

/* ---------- Рейтинг: таблица для проверки зрения ---------- */
.lb { display: grid; grid-template-rows: auto 1fr auto; height: 100%; gap: calc(2 * var(--v)); }
.lb-chart { align-self: center; display: grid; gap: calc(3 * var(--v)); padding: calc(3 * var(--v)) calc(4 * var(--u)); border: 1px solid var(--border-subtle); border-radius: calc(1.2 * var(--u)); box-shadow: var(--shadow-sm); background: var(--surface); width: calc(76 * var(--u)); justify-self: center; }
.lb-row { display: grid; grid-template-columns: calc(6 * var(--u)) 1fr auto; align-items: baseline; gap: calc(2 * var(--u)); animation: enter .5s var(--ease-out) both; }
.lb-row:nth-child(2) { animation-delay: .25s; } .lb-row:nth-child(3) { animation-delay: .5s; }
.lb-row .pl { font-size: calc(1.2 * var(--u)); font-weight: 600; color: var(--text-tertiary); font-variant-numeric: tabular-nums; }
.lb-row .nm { font-weight: 800; color: var(--ink); letter-spacing: .02em; line-height: 1.05; }
.lb-row .sc { font-weight: 700; color: var(--green-800); font-variant-numeric: tabular-nums; }
.lb-row.r1 .nm { font-size: calc(6 * var(--u)); } .lb-row.r1 .sc { font-size: calc(4 * var(--u)); }
.lb-row.r2 .nm { font-size: calc(4.2 * var(--u)); } .lb-row.r2 .sc { font-size: calc(3 * var(--u)); }
.lb-row.r3 .nm { font-size: calc(3 * var(--u)); } .lb-row.r3 .sc { font-size: calc(2.2 * var(--u)); }
.lb-note { text-align: center; font-family: var(--font-serif); font-style: italic; font-size: calc(2.4 * var(--u)); color: var(--gold); }
.full-table { display: grid; grid-auto-rows: 1fr; gap: calc(.9 * var(--v)); height: 100%; align-content: center; }
.full-row { display: grid; grid-template-columns: calc(5 * var(--u)) 1fr calc(20 * var(--u)) calc(10 * var(--u)); align-items: center; gap: calc(2 * var(--u)); padding: 0 calc(2 * var(--u)); border-radius: calc(.8 * var(--u)); background: var(--bg-subtle); font-size: calc(2.2 * var(--u)); min-height: calc(6.6 * var(--v)); animation: enter .4s var(--ease-out) both; }
.full-row .pl { font-weight: 800; color: var(--text-tertiary); }
.full-row .nm { font-weight: 700; }
.full-row .cl { font-size: calc(1.4 * var(--u)); color: var(--text-secondary); }
.full-row .sc { text-align: right; font-weight: 800; color: var(--green-800); font-variant-numeric: tabular-nums; }
.full-row.top { background: var(--accent-soft); }

/* ---------- Номинации ---------- */
.nom { display: grid; place-items: center; text-align: center; height: 100%; align-content: center; gap: calc(2.4 * var(--v)); }
.nom .overline { font-size: calc(1.8 * var(--u)); }
.nom .display { font-size: calc(6.2 * var(--u)); }
.nom .desc { font-size: calc(2 * var(--u)); color: var(--text-secondary); }
.nom .winner { font-size: calc(5 * var(--u)); font-weight: 800; color: var(--gold); margin-top: calc(2 * var(--v)); animation: enter .7s var(--ease-out) both .6s; }
.nom-prev { position: absolute; left: calc(4 * var(--u)); right: calc(4 * var(--u)); bottom: calc(3 * var(--v)); display: flex; flex-wrap: wrap; gap: calc(.8 * var(--u)); justify-content: center; font-size: calc(1.2 * var(--u)); }

/* ---------- Пауза / финал ---------- */
.pause { position: absolute; inset: 0; background: var(--grad-dark); color: #fff; display: grid; place-items: center; align-content: center; gap: calc(4 * var(--v)); text-align: center; }
.pause img { height: calc(44 * var(--v)); width: auto; }
.pause .display { color: #fff; font-size: calc(4 * var(--u)); }

/* ---------- Оверлей полного рейтинга ---------- */
.overlay { position: absolute; inset: calc(9 * var(--v)) 0 0 0; background: var(--bg-base); z-index: 10; padding: calc(4 * var(--v)) calc(4 * var(--u)); display: grid; grid-template-rows: auto 1fr; gap: calc(2 * var(--v)); animation: enter .35s var(--ease-out) both; }
.offline { position: absolute; left: 50%; bottom: calc(2 * var(--v)); transform: translateX(-50%); background: var(--danger); color: #fff; padding: calc(1 * var(--v)) calc(2 * var(--u)); border-radius: 999px; font-size: calc(1.3 * var(--u)); font-weight: 600; z-index: 20; }
.preview-badge { position: absolute; top: calc(1 * var(--v)); right: calc(1 * var(--u)); z-index: 30; background: var(--gold); color: var(--green-900); font-size: calc(1 * var(--u)); font-weight: 700; padding: calc(.4 * var(--v)) calc(.8 * var(--u)); border-radius: calc(.4 * var(--u)); }
.enter-wrap { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.enter-wrap > * { flex: 1; min-height: 0; }
/* шкала «Ближе всех» с ярусами подписей */
.scale { position: relative; margin: 0 calc(6 * var(--u)); }
.scale .axis { position: absolute; left: 0; right: 0; top: auto; bottom: calc(3.6 * var(--v)); height: calc(.5 * var(--v)); background: var(--border-default); border-radius: calc(1 * var(--v)); }
.mk { position: absolute; bottom: calc(3.85 * var(--v)); width: 0; display: flex; flex-direction: column; align-items: center; animation: enter .5s var(--ease-out) both; }
.mk .lab { font-size: calc(1.2 * var(--u)); font-weight: 700; white-space: nowrap; background: var(--bg-base); padding: calc(.2 * var(--v)) calc(.5 * var(--u)); border-radius: calc(.4 * var(--u)); line-height: 1.2; width: max-content; }
.mk .lab small { font-size: .85em; font-weight: 600; color: var(--text-secondary); margin-left: .3em; }
.mk .stem { width: 2px; background: var(--border-strong); height: calc(calc(1.2 * var(--v)) + var(--lane) * calc(4.4 * var(--v))); }
.mk .dot { width: calc(1.8 * var(--v)); height: calc(1.8 * var(--v)); border-radius: 50%; background: var(--green-700); border: calc(.35 * var(--v)) solid var(--bg-base); margin-bottom: calc(-.9 * var(--v)); box-sizing: content-box; }
.ans-line { position: absolute; top: 0; bottom: calc(3.6 * var(--v)); width: calc(.35 * var(--u)); background: var(--gold); transform: translateX(-50%); border-radius: calc(.3 * var(--u)); opacity: .9; }
.ans-line span { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); margin-top: calc(.6 * var(--v)); font-size: calc(1.5 * var(--u)); font-weight: 800; color: var(--gold); white-space: nowrap; }
.unanimous { animation: gavel .7s var(--ease-out) both .2s, settle .6s var(--ease) forwards 3s; }
@keyframes settle { to { left: 87%; top: 88%; transform: translate(-50%, -50%) rotate(-6deg) scale(.42); } }
.lb-row .nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.lb-row.r1 .nm { font-size: calc(5.2 * var(--u)); }
.topbar .timer { width: calc(8 * var(--v)); height: calc(8 * var(--v)); }
.topbar .timer .t-num { font-size: calc(1.9 * var(--u)); }

/* ---------- Полоса игроков внизу ---------- */
.pbar { display: flex; justify-content: center; gap: calc(1.6 * var(--u)); padding: calc(1.2 * var(--v)) calc(3 * var(--u)) calc(1.8 * var(--v)); border-top: 1px solid var(--border-subtle); background: var(--beige); position: relative; z-index: 2; }
.pbar:empty { display: none; }
.pb { position: relative; display: grid; justify-items: center; gap: calc(.4 * var(--v)); min-width: calc(9 * var(--u)); transition: opacity .3s var(--ease), transform .3s var(--ease); }
.pb .pb-nm { font-size: calc(1.4 * var(--u)); font-weight: 700; color: var(--text-primary); white-space: nowrap; }
.pb .pb-st { font-size: calc(1.05 * var(--u)); font-weight: 600; color: var(--text-tertiary); height: 1.2em; }
.pb.thinking .pb-nm, .pb.tried .pb-nm { color: var(--text-tertiary); }
.pb.done .pb-st { color: var(--ok-ink); }
.pb.answering .ava { outline: calc(.45 * var(--v)) solid var(--gold); outline-offset: calc(.3 * var(--v)); }
.pb.answering .pb-st { color: var(--gold); }
.pb.answering { transform: translateY(calc(-.8 * var(--v))); }
.pb.tried .pb-st { color: var(--danger); }
.pb.ready .pb-st { color: var(--green-700); }
.pb-ok { position: absolute; top: calc(-.3 * var(--v)); right: calc(1.4 * var(--u)); width: calc(3 * var(--v)); height: calc(3 * var(--v)); border-radius: 50%; background: var(--success); border: 2px solid var(--bg-base); }
.pb-ok::after { content: ''; position: absolute; left: 32%; top: 18%; width: 26%; height: 46%; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.pb-dots { position: absolute; top: calc(-.2 * var(--v)); right: calc(.8 * var(--u)); display: flex; gap: 2px; padding: calc(.3 * var(--v)) calc(.4 * var(--u)); background: var(--bg-base); border: 1px solid var(--border-default); border-radius: 999px; }
.pb-dots b { width: calc(.7 * var(--v)); height: calc(.7 * var(--v)); border-radius: 50%; background: var(--text-tertiary); animation: think 1.2s infinite ease-in-out; }
.pb-dots b:nth-child(2) { animation-delay: .2s; } .pb-dots b:nth-child(3) { animation-delay: .4s; }
@keyframes think { 0%, 80%, 100% { opacity: .3; } 40% { opacity: 1; } }
@keyframes pop { 0% { transform: scale(.7); } 70% { transform: scale(1.08); } 100% { transform: scale(1); } }

/* ---------- Статус кнопки в «Своей игре» ---------- */
.buzz-status { font-size: calc(2.2 * var(--u)); font-weight: 700; color: var(--text-secondary); display: flex; align-items: center; gap: calc(1.2 * var(--u)); }
.buzz-status.live { color: var(--green-700); }
.buzz-status.who { color: var(--text-primary); background: var(--warn-soft); padding: calc(1.2 * var(--v)) calc(1.6 * var(--u)); border-radius: calc(1 * var(--u)); width: fit-content; }
.ava-chip { padding-left: .3em; }
.ava-inline { display: inline-block; vertical-align: middle; margin-right: .3em; }
.reveal-box .who .ava { flex: none; }
.lb-row .nm .ava, .full-row .nm .ava { vertical-align: -0.12em; }

/* =================== Моушн и динамическая типографика =================== */
/* слова: всплывают из размытия */
.w { display: inline-block; animation: word-in .6s var(--ease-out) both; animation-delay: var(--i, 0s); }
@keyframes word-in { from { opacity: 0; transform: translateY(.45em); filter: blur(6px); } }
/* буквы: выезжают с лёгким поворотом */
.ch { display: inline-block; animation: char-in .55s var(--ease-out) both; animation-delay: var(--i, 0s); white-space: pre; }
@keyframes char-in { from { opacity: 0; transform: translateY(.6em) rotate(6deg) scale(.9); } }
.sv-row .let .ch { animation: chart-in .5s var(--ease-out) both; animation-delay: var(--i, 0s); }
@keyframes chart-in { from { opacity: 0; transform: scale(1.8); filter: blur(10px); } }
/* повторная отрисовка того же вопроса — без повторной анимации появления */
.calm .w, .calm .ch, .calm .enter, .calm .cell, .calm .fact, .calm .sol, .calm .opt { animation: none !important; }

/* табло: клетки выкладываются волной; выбранная — пульсирует */
.cell { animation: cell-in .45s var(--ease-out) both; animation-delay: var(--i, 0s); }
@keyframes cell-in { from { opacity: 0; transform: translateY(1.5cqh) scale(.9); } }
.cell.played { animation: cell-out .5s var(--ease) both; }
@keyframes cell-out { from { background: var(--green-800); color: var(--gold-light); } }
.cat-title { animation: enter .45s var(--ease-out) both; }

/* факты, решения, варианты — по очереди */
.fact { animation: enter .5s var(--ease-out) both; }
.fact:nth-child(2) { animation-delay: .35s; } .fact:nth-child(3) { animation-delay: .7s; }
.sol { animation: enter .5s var(--ease-out) both; }
.sol:nth-child(2) { animation-delay: .15s; } .sol:nth-child(3) { animation-delay: .3s; } .sol:nth-child(4) { animation-delay: .45s; } .sol:nth-child(n+5) { animation-delay: .6s; }
.opt { animation: enter .4s var(--ease-out) both; }
.opt:nth-child(2) { animation-delay: .08s; } .opt:nth-child(3) { animation-delay: .16s; } .opt:nth-child(4) { animation-delay: .24s; } .opt:nth-child(n+5) { animation-delay: .32s; }
.opt.right { animation: right-in .6s var(--ease-out) both; }
@keyframes right-in { 0% { transform: scale(1); } 40% { transform: scale(1.08); } 100% { transform: scale(1); } }

/* раскрытие ответа: проблеск по плашке */
.reveal-box { position: relative; overflow: visible; }
.reveal-box::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.7) 50%, transparent 70%) no-repeat; background-size: 250% 100%; animation: shine 1.2s var(--ease) .2s both; pointer-events: none; }
@keyframes shine { from { background-position: 120% 0; } to { background-position: -120% 0; } }
.answer-big .display { animation: big-in .7s var(--ease-out) both; display: inline-block; }
@keyframes big-in { from { opacity: 0; transform: scale(.6); } }

/* салют из треугольников */
.burst { position: absolute; left: 50%; top: 50%; width: 0; height: 0; pointer-events: none; z-index: 6; }
.burst i { position: absolute; width: calc(1.4 * var(--u)); height: calc(1.4 * var(--u)); background: var(--c); clip-path: polygon(50% 0, 100% 100%, 0 100%); opacity: 0; animation: burst var(--t) var(--ease-out) forwards; }
@keyframes burst { 0% { opacity: 1; transform: rotate(var(--a)) translateY(0) rotate(0) scale(.4); } 70% { opacity: 1; } 100% { opacity: 0; transform: rotate(var(--a)) translateY(calc(var(--d) * -1 * var(--v))) rotate(var(--r)) scale(1); } }
.burst-wrap { position: absolute; left: 50%; top: 55%; width: 0; height: 0; pointer-events: none; z-index: 6; }
.burst-wrap .burst i { animation-delay: .35s; }
.burst-wrap.late { top: 72%; }
.burst-wrap.late .burst i { animation-delay: 1.5s; width: calc(1.8 * var(--u)); height: calc(1.8 * var(--u)); }

/* номинации и заставки */
.nom .winner { animation: none; }
.nom .winner .ch { animation: winner-in .6s var(--ease-out) both; animation-delay: var(--i, 0s); }
@keyframes winner-in { 0% { opacity: 0; transform: translateY(.5em) scale(1.6); filter: blur(8px); } 100% { opacity: 1; transform: none; filter: none; } }
.intro-card { animation: card-in .7s var(--ease-out) both; }
@keyframes card-in { from { opacity: 0; transform: scale(.92) translateY(2cqh); } }
.face { animation: drift 9s ease-in-out infinite; }
.face:nth-child(2n) { animation-duration: 11s; animation-direction: reverse; }
.face:nth-child(3n) { animation-duration: 13s; }
@keyframes drift { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(calc(.8 * var(--u)), calc(-1.2 * var(--v))); } }
.breathe { animation: breathe 5s ease-in-out infinite; }
@keyframes breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.03); } }
.lb-row .sc, .full-row .sc { font-variant-numeric: tabular-nums; }
.lb-row.r1 { animation: enter .6s var(--ease-out) both .9s; }
.lb-row.r2 { animation-delay: .5s; } .lb-row.r3 { animation-delay: .1s; }

/* таймер: последние секунды пульсирует */
.topbar .timer.low { animation: tick 1s ease-in-out infinite; }
@keyframes tick { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.14); } }
.buzz-status.live { animation: live 1.1s ease-in-out infinite; }
@keyframes live { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
.buzz-status.who { animation: enter .4s var(--ease-out) both; }

/* фирменный мотив в углу медленно дрейфует */
.stage::before { animation: motif 40s linear infinite; }
@keyframes motif { from { transform: rotate(8deg); } to { transform: rotate(368deg); } }

/* =================== Парящие карточки =================== */
/* Плавают отдельными свойствами translate/rotate — не мешают анимациям появления (transform) и увеличению (scale).
   ease-in-out на каждом участке: карточка замедляется перед сменой направления и покачивается обратно. */
.stage .fl { animation: fl-in .7s var(--ease-out) both var(--i, 0s), fl-float var(--fd, 8s) ease-in-out infinite var(--fdl, 0s); }
.stage .sol.fl.from-l { animation-name: fl-in-l, fl-float; }
.stage .sol.fl.from-r { animation-name: fl-in-r, fl-float; }
.calm .fl, .calm .sol.fl.from-l, .calm .sol.fl.from-r { animation: fl-float var(--fd, 8s) ease-in-out infinite var(--fdl, 0s) !important; }
@keyframes fl-in { from { opacity: 0; transform: translateY(calc(3 * var(--v))) scale(.94); } }
@keyframes fl-in-l { from { opacity: 0; transform: translateX(calc(-30 * var(--u))) rotate(-14deg) scale(.9); } }
@keyframes fl-in-r { from { opacity: 0; transform: translateX(calc(30 * var(--u))) rotate(14deg) scale(.9); } }
@keyframes fl-float {
  0%   { translate: 0 0; rotate: 0deg; }
  22%  { translate: calc(var(--fx) * var(--u)) calc(var(--fy) * -1 * var(--v)); rotate: calc(var(--fr) * 1deg); }
  48%  { translate: calc(var(--fx) * -.4 * var(--u)) calc(var(--fy) * -1.4 * var(--v)); rotate: calc(var(--fr) * -.6deg); }
  74%  { translate: calc(var(--fx) * -1 * var(--u)) calc(var(--fy) * -.5 * var(--v)); rotate: calc(var(--fr) * -1deg); }
  100% { translate: 0 0; rotate: 0deg; }
}

/* =================== Дуэли =================== */
.sol { transition: scale .7s var(--ease-out), opacity .5s var(--ease), left .9s var(--ease-out) 1.9s; position: relative; left: 0; }
.sol-grid.is-revealed .sol { opacity: .8; }
.sol-grid.is-revealed .sol.win { opacity: 1; scale: 1.08; z-index: 2; background: var(--accent-soft); box-shadow: 0 calc(1.2 * var(--v)) calc(3 * var(--v)) hsl(var(--shadow-color) / .18); }
.sol-grid.many.is-revealed .sol.win { scale: 1.06; }
.stage .sol.gone { animation: sol-fall 1.2s cubic-bezier(.55, 0, .8, .2) 1.4s forwards !important; }
@keyframes sol-fall { 0% { transform: translateY(0) rotate(0); opacity: 1; } 15% { transform: translateY(calc(-2 * var(--v))) rotate(-3deg); } 100% { transform: translateY(110vh) rotate(24deg); opacity: .6; } }
.sol-grid.pair:has(.gone) .sol.win:first-child { left: calc(50% + 1.2 * var(--u)); scale: 1.16; }
.sol-grid.pair:has(.gone) .sol.win:last-child { left: calc(-50% - 1.2 * var(--u)); scale: 1.16; }
.voters-row { display: flex; flex-wrap: wrap; gap: calc(.8 * var(--u)); align-items: flex-end; min-height: calc(5 * var(--v)); }
.vt { display: grid; justify-items: center; gap: calc(.2 * var(--v)); position: relative; animation: vt-in .55s var(--ease-out) both var(--k, .5s); }
.vt-nm { font-size: calc(1 * var(--u)); font-weight: 700; color: var(--text-secondary); }
.sol-grid.many .vt-nm { display: none; }
.vt .md { position: absolute; top: calc(-1 * var(--v)); right: calc(-.6 * var(--u)); font-style: normal; font-size: calc(1.5 * var(--u)); }
@keyframes vt-in { 0% { opacity: 0; transform: translateY(calc(-8 * var(--v))) scale(.4); } 70% { opacity: 1; transform: translateY(calc(.6 * var(--v))) scale(1.05); } 100% { transform: none; } }
.sol .author { display: flex; align-items: center; gap: .5em; animation: enter .5s var(--ease-out) both; }
.sol .votes small { font-size: .7em; font-weight: 600; color: var(--text-secondary); }
.sol .place { position: absolute; top: calc(-1.6 * var(--v)); right: calc(-.8 * var(--u)); font-size: calc(3.4 * var(--u)); animation: place-in .6s var(--ease-out) both .9s; }
@keyframes place-in { from { opacity: 0; transform: scale(2.4) rotate(-20deg); } }
.sol-grid.pair { align-items: start; }

/* Заставки: название кабинета в одну строку */
.intro-card .display { white-space: nowrap; }

/* Регистратура: «ОЧНЫЙ ПРИЕМ» проявляется, держится, расплывается («зрение садится») и после паузы — снова */
.sv-row .let .ch, .calm .sv-row .let .ch { animation: sv-loop 10s infinite both var(--i, 0s) !important; }
@keyframes sv-loop {
  0%   { opacity: 0; transform: scale(1.8); filter: blur(10px); animation-timing-function: cubic-bezier(.16, 1, .3, 1); }
  8%   { opacity: 1; transform: scale(1); filter: blur(0); }
  78%  { opacity: 1; transform: scale(1); filter: blur(0); animation-timing-function: ease-in; }
  88%  { opacity: 0; transform: scale(.9); filter: blur(8px); }
  100% { opacity: 0; transform: scale(.9); filter: blur(8px); }
}

/* Подсказка про полный экран и скрытие курсора в нём */
.fs-hint { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 12px); z-index: 50; background: rgba(19, 53, 44, .92); color: #fff; font: 600 15px/1 var(--font-sans); padding: 12px 18px; border-radius: 999px; opacity: 0; pointer-events: none; transition: opacity .3s var(--ease), transform .3s var(--ease); }
.fs-hint b { display: inline-grid; place-items: center; min-width: 26px; height: 26px; margin: 0 4px; border-radius: 6px; background: #fff; color: var(--green-800); font-weight: 800; }
.fs-hint.on { opacity: 1; transform: translate(-50%, 0); }
body.is-fs { cursor: none; }

/* Рейтинг: аватар в своей ячейке, с запасом под прыжки — не обрезается */
.lb-row { grid-template-columns: calc(6 * var(--u)) auto 1fr auto; }
.lb-ava { display: grid; place-items: center; padding: calc(1.4 * var(--v)) calc(.6 * var(--u)) calc(.4 * var(--v)); overflow: visible; }
.lb-row { align-items: center; }
.lb-chart { overflow: visible; }
.full-row { grid-template-columns: calc(5 * var(--u)) auto 1fr calc(20 * var(--u)) calc(10 * var(--u)); overflow: visible; }
.full-row .lb-ava { padding: calc(.8 * var(--v)) 0 calc(.2 * var(--v)); }
.full-table { overflow: visible; }

/* «Кто голосовал»: аватар с именем, падают по очереди */
.who-chip { display: inline-grid; justify-items: center; gap: calc(.2 * var(--v)); margin-right: calc(.6 * var(--u)); animation: vt-in .55s var(--ease-out) both var(--k, .2s); vertical-align: bottom; }
.who-chip > span:last-child { font-size: calc(1 * var(--u)); font-weight: 700; color: var(--text-secondary); white-space: nowrap; }
.fact .voters { gap: calc(.4 * var(--u)); align-items: flex-end; margin-top: calc(1 * var(--v)); }
.note .who-chip { margin-left: calc(.4 * var(--u)); }
.r-who { display: flex; align-items: center; gap: calc(.6 * var(--u)); }
.nom-ava { margin-top: calc(1 * var(--v)); animation: big-in .7s var(--ease-out) both 1.1s; }
.nom .reason { font-family: var(--font-serif); font-style: italic; font-size: calc(2.2 * var(--u)); color: var(--text-secondary); max-width: 70%; text-wrap: balance; }

/* «Своя» → «Моя игра» */
.sub-moya { font-size: calc(3.2 * var(--u)) !important; margin-top: calc(4.5 * var(--v)); color: var(--text-secondary); }
.sub-moya .svoya { position: relative; display: inline-block; }
.sub-moya .sv-word, .sub-moya .sv-rest { display: inline-block; animation: word-in .6s var(--ease-out) both var(--t0); }
.sub-moya .sv-rest { animation-delay: calc(var(--t0) + .1s); }
.sub-moya .sv-word { animation: word-in .6s var(--ease-out) both var(--t0), sv-dim .4s var(--ease) forwards calc(var(--t0) + 1.3s); }
@keyframes sv-dim { to { opacity: .45; } }
.sub-moya .strike { position: absolute; left: -6%; right: -6%; top: 52%; height: calc(.45 * var(--v)); min-height: 3px; background: var(--gold); border-radius: 999px; transform-origin: left center; transform: scaleX(0) rotate(-4deg); animation: strike .45s cubic-bezier(.6, 0, .3, 1) forwards calc(var(--t0) + .9s); }
@keyframes strike { to { transform: scaleX(1) rotate(-4deg); } }
.sub-moya .my { position: absolute; left: 50%; bottom: 72%; display: inline-flex; align-items: center; gap: .02em; font-style: normal; font-weight: 700; color: var(--green-800); white-space: nowrap; transform: translateX(-50%) rotate(-7deg); opacity: 0; animation: moya-in .7s cubic-bezier(.34, 1.56, .64, 1) forwards calc(var(--t0) + 1.45s); }
.sub-moya .m-logo { height: 1.15em; width: auto; animation: m-spin .9s var(--ease-out) both calc(var(--t0) + 1.45s); }
@keyframes moya-in { from { opacity: 0; transform: translateX(-50%) translateY(calc(2 * var(--v))) rotate(-20deg) scale(.4); } to { opacity: 1; transform: translateX(-50%) rotate(-7deg) scale(1); } }
@keyframes m-spin { from { transform: rotate(-200deg) scale(.3); } }

/* =================== Дуэли: раскрытие по шагам =================== */
/* итоговое состояние (без анимации — например, при перезагрузке экрана) */
.sol-grid.is-revealed .sol.lose { opacity: .72; }
.sol-grid.is-revealed:not(.seq) .sol.gone { display: none; }
.sol-grid.is-revealed:not(.seq) .vt { animation: none; }
.sol-grid.pair.is-revealed:not(.seq):has(.gone) .sol.win:first-child { left: calc(50% + 1.2 * var(--u)); scale: 1.16; }
.sol-grid.pair.is-revealed:not(.seq):has(.gone) .sol.win:last-child { left: calc(-50% - 1.2 * var(--u)); scale: 1.16; }
.sol-grid.pair:has(.gone) .sol.win:first-child, .sol-grid.pair:has(.gone) .sol.win:last-child { transition: none; }
.sol-grid.seq .sol { transition: none; }
/* последовательность: голоса падают (--k у каждого), затем в момент --wat выделяется победитель */
.calm .seq .sol.fl.win, .seq .sol.fl.win { animation: fl-float var(--fd, 8s) ease-in-out infinite var(--fdl, 0s), win-grow .8s cubic-bezier(.34, 1.4, .64, 1) both var(--wat) !important; }
.calm .seq .sol.fl.lose, .seq .sol.fl.lose { animation: fl-float var(--fd, 8s) ease-in-out infinite var(--fdl, 0s), lose-dim .6s var(--ease) both var(--wat) !important; }
.calm .seq .sol.fl.gone, .seq .sol.fl.gone { animation: sol-fall 1.2s cubic-bezier(.55, 0, .8, .2) forwards calc(var(--wat) + .4s) !important; }
.sol-grid.seq .sol.win, .sol-grid.seq .sol.lose { scale: 1; opacity: 1; background: var(--bg-subtle); box-shadow: none; }
.calm .sol-grid.pair.seq:has(.gone) .sol.fl.win:first-child, .sol-grid.pair.seq:has(.gone) .sol.fl.win:first-child { animation: fl-float var(--fd, 8s) ease-in-out infinite var(--fdl, 0s), win-grow .8s cubic-bezier(.34, 1.4, .64, 1) both var(--wat), win-center-l .9s var(--ease-out) both calc(var(--wat) + 1.5s) !important; }
.calm .sol-grid.pair.seq:has(.gone) .sol.fl.win:last-child, .sol-grid.pair.seq:has(.gone) .sol.fl.win:last-child { animation: fl-float var(--fd, 8s) ease-in-out infinite var(--fdl, 0s), win-grow .8s cubic-bezier(.34, 1.4, .64, 1) both var(--wat), win-center-r .9s var(--ease-out) both calc(var(--wat) + 1.5s) !important; }
@keyframes win-grow { from { scale: 1; background: var(--bg-subtle); box-shadow: none; } to { scale: 1.08; background: var(--accent-soft); box-shadow: 0 calc(1.2 * var(--v)) calc(3 * var(--v)) hsl(var(--shadow-color) / .18); } }
@keyframes lose-dim { from { opacity: 1; } to { opacity: .72; } }
@keyframes win-center-l { from { left: 0; scale: 1.08; } to { left: calc(50% + 1.2 * var(--u)); scale: 1.16; } }
@keyframes win-center-r { from { left: 0; scale: 1.08; } to { left: calc(-50% - 1.2 * var(--u)); scale: 1.16; } }
.calm .vt { animation: vt-in .55s var(--ease-out) both var(--k, .5s); }
.sol-grid.seq .sol .place { animation-delay: calc(var(--wat) + .2s); }
.sol-grid.seq .sol .author .ava { animation-delay: var(--wat); }
.unanimous { animation: gavel .7s var(--ease-out) both calc(var(--wat, 0s) + .2s), settle .6s var(--ease) forwards calc(var(--wat, 0s) + 3s); }
.burst-wrap .burst i { animation-delay: calc(var(--wat, 0s) + .35s); }
.votes [data-ticks].bump, .votes .bump { display: inline-block; animation: tick-bump .35s var(--ease-out); }
@keyframes tick-bump { 0% { transform: scale(1.35); color: var(--gold); } 100% { transform: scale(1); } }
.sol .medals { font-size: .85em; margin-left: .4em; }

.sub-moya { font-size: calc(3.6 * var(--u)) !important; margin-top: calc(5.5 * var(--v)); }
.sub-moya .my { font-size: 1.3em; bottom: 70%; }

/* Правила на заставке */
.intro-card { max-width: 78cqw; }
.rules { list-style: none; margin: calc(3 * var(--v)) 0 0; padding: 0; display: grid; gap: calc(1.1 * var(--v)); text-align: left; max-width: calc(62 * var(--u)); margin-left: auto; margin-right: auto; }
.rules li { display: grid; grid-template-columns: calc(3 * var(--u)) 1fr; gap: calc(1 * var(--u)); align-items: center; font-size: calc(1.7 * var(--u)); line-height: 1.3; color: var(--text-primary); animation: word-in .6s var(--ease-out) both var(--i, 0s); }
.rules .rn { width: calc(2.6 * var(--u)); height: calc(2.6 * var(--u)); border-radius: 50%; background: var(--green-800); color: var(--gold-light); display: grid; place-items: center; font-weight: 800; font-size: calc(1.3 * var(--u)); }
.rules-joker { margin-top: calc(2 * var(--v)); display: inline-flex; align-items: center; gap: .5em; font-size: calc(1.5 * var(--u)); font-weight: 700; color: #6B4E24; background: linear-gradient(100deg, #F5EBD0, #E9D6A4); padding: calc(.9 * var(--v)) calc(1.4 * var(--u)); border-radius: 999px; animation: word-in .6s var(--ease-out) both var(--i, 0s); }
.calm .rules li, .calm .rules-joker { animation: none; }

/* Джокер: золотая вспышка */
.joker-flash { position: absolute; inset: 0; z-index: 40; display: grid; place-items: center; pointer-events: none; animation: jf-life 5.5s var(--ease) forwards; }
@keyframes jf-life { 0% { opacity: 0; } 6% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; } }
.jf-glow { position: absolute; inset: 0; background: radial-gradient(circle at 50% 36%, rgba(223, 201, 142, .7) 0%, rgba(185, 138, 78, .25) 18%, rgba(11, 32, 27, 0) 38%), rgba(11, 32, 27, .9); animation: jf-glow 5.5s var(--ease) both; }
@keyframes jf-glow { 0% { transform: scale(.4); opacity: 0; } 10% { transform: scale(1.05); opacity: 1; } 20% { transform: scale(1); } }
.jf-rays { position: absolute; width: 160cqh; height: 160cqh; background: repeating-conic-gradient(from 0deg, rgba(223, 201, 142, .3) 0deg 6deg, transparent 6deg 18deg); -webkit-mask: radial-gradient(circle, #000 0 25%, transparent 62%); mask: radial-gradient(circle, #000 0 25%, transparent 62%); animation: jf-spin 12s linear infinite, jf-rays-in .8s var(--ease-out) both; }
@keyframes jf-spin { to { rotate: 360deg; } }
@keyframes jf-rays-in { from { opacity: 0; transform: scale(.3); } }
.jf-sparks { position: absolute; left: 50%; top: 50%; width: 0; height: 0; }
.jf-sparks i { position: absolute; width: calc(1.6 * var(--u) * var(--s)); height: calc(1.6 * var(--u) * var(--s)); background: radial-gradient(circle, #FFF8E6 0 30%, #DFC98E 31% 60%, transparent 61%); opacity: 0; animation: jf-spark var(--t) var(--ease-out) forwards .35s; }
@keyframes jf-spark { 0% { opacity: 1; transform: rotate(var(--a)) translateY(0) scale(.3); } 75% { opacity: 1; } 100% { opacity: 0; transform: rotate(var(--a)) translateY(calc(var(--d) * -1 * var(--v))) scale(1); } }
.jf-card { position: relative; display: grid; justify-items: center; gap: calc(1 * var(--v)); text-align: center; animation: jf-card .9s cubic-bezier(.34, 1.56, .64, 1) both .15s; }
@keyframes jf-card { from { opacity: 0; transform: scale(.3) rotate(-8deg); } }
.jf-ava { position: relative; filter: drop-shadow(0 0 calc(3 * var(--v)) rgba(223, 201, 142, .85)); }
.jf-ava .ava { box-shadow: 0 0 0 calc(.8 * var(--v)) #DFC98E, 0 0 0 calc(1.6 * var(--v)) rgba(223, 201, 142, .35); }
.jf-eye { position: absolute; right: calc(-1.5 * var(--v)); bottom: calc(-.5 * var(--v)); width: calc(7 * var(--v)); height: calc(7 * var(--v)); border-radius: 50%; display: grid; place-items: center; background: linear-gradient(145deg, #EAD7A2, #B98A4E); color: #4A3618; border: calc(.5 * var(--v)) solid #fff; font-size: calc(3.6 * var(--v)); animation: jf-eye .6s cubic-bezier(.34, 1.56, .64, 1) both .9s; }
@keyframes jf-eye { from { transform: scale(0) rotate(-90deg); } }
.jf-title { font-family: var(--font-serif); font-weight: 700; font-size: calc(6 * var(--u)); filter: drop-shadow(0 calc(.3 * var(--v)) 0 rgba(90, 58, 0, .45)); }
.jf-title .ch { background: linear-gradient(180deg, #FBF3DC 0%, #E6CF93 45%, #B98A4E 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.jf-name { font-size: calc(3.2 * var(--u)); font-weight: 800; color: #fff; text-shadow: 0 2px 10px rgba(90, 58, 0, .6); animation: word-in .6s var(--ease-out) both 1.1s; }
.jf-sub { font-size: calc(1.8 * var(--u)); font-weight: 600; color: #F5EBD0; text-shadow: 0 2px 8px rgba(90, 58, 0, .6); animation: word-in .6s var(--ease-out) both 1.4s; }

/* Фон заставки: парящие аватары игроков */
.faces-bg { position: absolute; inset: 0; overflow: hidden; }
.faces-bg .drift { position: absolute; transform: translate(-50%, -50%); animation: bg-drift var(--dd, 14s) ease-in-out infinite var(--dl, 0s); opacity: .9; }
.faces-bg .ph { display: block; border-radius: 50%; overflow: hidden; box-shadow: 0 calc(1 * var(--v)) calc(3 * var(--v)) hsl(var(--shadow-color) / .2); }
.faces-bg .ph img { width: 100%; height: 100%; object-fit: cover; }
@keyframes bg-drift {
  0%, 100% { translate: 0 0; rotate: -4deg; }
  33% { translate: calc(1.6 * var(--u)) calc(-2.4 * var(--v)); rotate: 5deg; }
  66% { translate: calc(-1.4 * var(--u)) calc(1.6 * var(--v)); rotate: -2deg; }
}
/* повторная отрисовка заставки — «Моя игра» сразу в конечном виде */
.calm .sub-moya .sv-word { animation: none; opacity: .45; }
.calm .sub-moya .sv-rest, .calm .sub-moya .m-logo { animation: none; }
.calm .sub-moya .strike { animation: none; transform: scaleX(1) rotate(-4deg); }
.calm .sub-moya .my { animation: none; opacity: 1; }
.calm .intro-card .display .ch { animation: none; }

/* Реакции из зала */
.react-float { position: absolute; bottom: calc(4 * var(--v)); z-index: 30; display: grid; justify-items: center; pointer-events: none; animation: rf-rise var(--rt, 3.6s) cubic-bezier(.25, .6, .4, 1) forwards; }
.rf-emoji { font-size: calc(6 * var(--u)); line-height: 1; filter: drop-shadow(0 calc(.6 * var(--v)) calc(1 * var(--v)) rgba(17, 46, 38, .25)); animation: rf-sway 1.2s ease-in-out infinite alternate; }
.rf-who { margin-top: calc(-1.2 * var(--v)); }
@keyframes rf-rise { 0% { opacity: 0; transform: translateY(20%) scale(.4); } 12% { opacity: 1; transform: translateY(0) scale(1.1); } 20% { transform: translateY(-4%) scale(1); } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(calc(-62 * var(--v))) scale(.9); } }
@keyframes rf-sway { from { rotate: calc(var(--sway) * -1deg - 6deg); translate: calc(-1 * var(--u)) 0; } to { rotate: calc(var(--sway) * 1deg + 6deg); translate: calc(1 * var(--u)) 0; } }

/* Подсказки про реакции */
.react-hint { position: absolute; top: 0; right: 0; font-size: calc(1.2 * var(--u)); font-weight: 600; color: var(--text-secondary); background: var(--bg-subtle); padding: calc(.6 * var(--v)) calc(1.2 * var(--u)); border-radius: 999px; }
.lie { position: relative; }
.react-window { position: absolute; left: 50%; bottom: calc(3 * var(--v)); transform: translateX(-50%); z-index: 3; font-size: calc(1.5 * var(--u)); font-weight: 700; color: var(--accent-soft-ink); background: rgba(252, 250, 247, .94); padding: calc(1 * var(--v)) calc(2 * var(--u)); border-radius: 999px; box-shadow: var(--shadow-md); white-space: nowrap; animation: enter .5s var(--ease-out) both 1.5s; font-variant-numeric: tabular-nums; }
.rules-joker { background: linear-gradient(110deg, #E9D6A4 0%, #F8F0DA 30%, #DCC07F 55%, #EADBAE 80%, #E9D6A4 100%); background-size: 250% 100%; animation: word-in .6s var(--ease-out) both var(--i, 0s), jk-flow 4s linear infinite; }
@keyframes jk-flow { to { background-position: -250% 0; } }
.calm .rules-joker { animation: jk-flow 4s linear infinite; }

/* =================== Заставка: спокойный фирменный фон =================== */
.intro { background: var(--grad-dark); }
.intro-bg { position: absolute; inset: -6%; animation: bg-pan 60s ease-in-out infinite alternate; }
/* декор — золотой контур кольца логотипа, едва заметно и медленно вращается */
.intro-bg .ring { position: absolute; display: block; opacity: .10; animation: ring-turn 160s linear infinite; }
.intro-bg .ring.r1 { width: 150cqh; height: 150cqh; left: 50%; top: 50%; margin: -75cqh 0 0 -75cqh; }
.intro-bg .ring.r2 { width: 70cqh; height: 70cqh; right: -12cqh; bottom: -22cqh; opacity: .08; animation-direction: reverse; animation-duration: 120s; }
.intro-bg .ring.r3 { width: 46cqh; height: 46cqh; left: -10cqh; top: -14cqh; opacity: .07; animation-duration: 100s; }
@keyframes ring-turn { to { rotate: 360deg; } }
@keyframes bg-pan { from { transform: translate(-1.5%, -1%) scale(1.02); } to { transform: translate(1.5%, 1%) scale(1.06); } }
.intro::after { content: ''; position: absolute; inset: 0; background: radial-gradient(60% 60% at 50% 45%, rgba(11, 32, 27, 0) 0%, rgba(11, 32, 27, .5) 100%); pointer-events: none; }
.intro-stack { position: relative; z-index: 1; display: grid; justify-items: center; gap: calc(2.4 * var(--v)); max-width: 80%; }
.intro-card { max-width: 100%; padding: calc(4 * var(--v)) calc(5 * var(--u)); background: rgba(252, 250, 247, .97); backdrop-filter: none; }
.intro-card .display { margin: calc(1 * var(--v)) 0 calc(.6 * var(--v)); }
.rules { margin-top: calc(2.4 * var(--v)); gap: calc(.8 * var(--v)); }
.rules li { font-size: calc(1.55 * var(--u)); }
.intro-under { display: grid; justify-items: center; gap: calc(1.2 * var(--v)); min-height: calc(6 * var(--v)); }
.intro-joker { display: inline-flex; align-items: center; gap: .6em; font-size: calc(1.55 * var(--u)); font-weight: 700; color: #3E2E14; padding: calc(1 * var(--v)) calc(1.8 * var(--u)); border-radius: 999px;
  background: linear-gradient(110deg, #C9A567 0%, #DFC98E 22%, #F5EBD0 38%, #D9BC7E 55%, #BE9558 78%, #DFC98E 100%); background-size: 250% 100%;
  box-shadow: 0 calc(.6 * var(--v)) calc(2 * var(--v)) rgba(0, 0, 0, .3); animation: under-in .7s var(--ease-out) both 2.2s, jk-flow 4s linear infinite 2.9s; }
.intro-joker svg { width: 1.3em; height: 1.3em; flex: none; }
@keyframes under-in { from { opacity: 0; transform: translateY(calc(2 * var(--v))); } }
.intro .jok { display: flex; gap: calc(.8 * var(--u)); align-items: center; flex-wrap: wrap; justify-content: center; font-size: calc(1.4 * var(--u)); color: rgba(255, 255, 255, .8); font-weight: 600; animation: under-in .6s var(--ease-out) both 2.4s; }
.chip.gold { background: linear-gradient(110deg, #E9D6A4, #F5EBD0, #DCC07F); color: #4A3618; }
.calm .intro-joker { animation: jk-flow 4s linear infinite; }
.calm .intro .jok { animation: none; }

/* =================== Анамнез: факты в ряд =================== */
.lie-row { grid-template-rows: auto 1fr; gap: calc(2.4 * var(--v)); }
.lie-row .facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(1.6 * var(--u)); align-content: start; align-items: stretch; }
.lie-row .fact { grid-template-columns: 1fr; grid-template-rows: auto auto 1fr; align-content: start; gap: calc(1.4 * var(--v)); padding: calc(2.6 * var(--v)) calc(1.8 * var(--u)); min-height: calc(40 * var(--v)); }
.lie-row .fact .no { grid-row: auto; width: calc(4.6 * var(--u)); height: calc(4.6 * var(--u)); font-size: calc(2.2 * var(--u)); }
.lie-row .fact .txt { min-height: 0; display: block; line-height: 1.28; font-weight: 600; }
.lie-row .fact .voters { grid-column: 1; align-self: end; margin-top: 0; padding-top: calc(1 * var(--v)); border-top: 1px dashed var(--border-default); min-height: calc(7 * var(--v)); }
.lie-row .fact .stamp { top: calc(2.4 * var(--v)); right: calc(1.4 * var(--u)); transform: rotate(-8deg); }
@keyframes stamp { from { opacity: 0; transform: rotate(-8deg) scale(1.6); } }
.lie-row .fact .stamp { animation-name: stamp; }
.lie-head { flex-wrap: wrap; row-gap: calc(.4 * var(--v)); position: relative; z-index: 2; }

/* =================== Топ-3: имя в две строки =================== */
.lb-row .nm { display: grid; line-height: 1; gap: calc(.3 * var(--v)); white-space: nowrap; }
.lb-row .nm b { font-weight: 800; }
.lb-row .nm small { font-size: .5em; font-weight: 700; color: var(--text-secondary); letter-spacing: .01em; }
.lb-row.r1 .nm { font-size: 5cqw; font-size: calc(5 * var(--u)); }
.lb-chart { width: min(80cqw, calc(80 * var(--u))); }

/* =================== Ближе всех: точки цвета аватара =================== */
.mk .dot { background: var(--dot, var(--green-700)); width: calc(2.4 * var(--v)); height: calc(2.4 * var(--v)); margin-bottom: calc(-1.2 * var(--v)); box-shadow: 0 0 0 calc(.35 * var(--v)) var(--bg-base), var(--shadow-sm); border: 0; }
.mk.scored .dot { width: calc(3 * var(--v)); height: calc(3 * var(--v)); margin-bottom: calc(-1.5 * var(--v)); }
.mk .lab { font-size: calc(1.15 * var(--u)); font-weight: 600; box-shadow: var(--shadow-sm); border: 1px solid var(--border-subtle); }
.mk .lab b { font-weight: 800; }
.mk .lab .pts { font-style: normal; font-weight: 800; color: var(--gold); }
.mk .stem { height: calc(1.2 * var(--v) + var(--lane) * 4.6 * var(--v)); background: var(--border-default); }

/* =================== Реакции: аватар запускает эмодзи =================== */
.react-float { position: absolute; bottom: calc(2 * var(--v)); z-index: 30; width: 0; display: block; pointer-events: none; animation: none; }
.react-float .rf-who { position: absolute; left: 0; bottom: 0; transform: translateX(-50%); margin: 0; animation: rf-who 3.6s var(--ease) forwards; }
.react-float .rf-emoji { position: absolute; left: 0; bottom: calc(3 * var(--v)); transform: translateX(-50%); font-size: calc(3.4 * var(--u)); line-height: 1; opacity: 0; filter: drop-shadow(0 calc(.4 * var(--v)) calc(.8 * var(--v)) rgba(17, 46, 38, .25)); animation: rf-launch 3s cubic-bezier(.2, .7, .3, 1) forwards .45s; }
@keyframes rf-who { 0% { opacity: 0; transform: translateX(-50%) translateY(60%) scale(.6); } 12% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); } 22% { transform: translateX(-50%) translateY(6%) scale(1.08, .9); } 30% { transform: translateX(-50%) translateY(0) scale(1); } 70% { opacity: 1; } 100% { opacity: 0; transform: translateX(-50%) translateY(30%) scale(.85); } }
@keyframes rf-launch { 0% { opacity: 0; transform: translateX(-50%) translateY(0) scale(.4); } 10% { opacity: 1; transform: translateX(-50%) translateY(calc(-3 * var(--v))) scale(1.15); } 75% { opacity: 1; } 100% { opacity: 0; transform: translateX(calc(-50% + var(--sway) * 3 * var(--u))) translateY(calc(-34 * var(--v))) scale(.9); } }

/* =================== Джокер: золотое свечение аватара в полосе =================== */
.pb.gold .ava { box-shadow: 0 0 0 calc(.35 * var(--v)) #C9A567, 0 0 calc(2.4 * var(--v)) calc(.4 * var(--v)) rgba(201, 165, 103, .55); }
.pb.gold::after { content: ''; position: absolute; top: calc(-.6 * var(--v)); left: 50%; width: calc(10 * var(--v)); height: calc(10 * var(--v)); transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle, rgba(201, 165, 103, .35), rgba(201, 165, 103, 0) 70%); z-index: -1; animation: gold-pulse 2.6s ease-in-out infinite; }
.pb { isolation: isolate; }
@keyframes gold-pulse { 0%, 100% { opacity: .6; transform: translateX(-50%) scale(.95); } 50% { opacity: 1; transform: translateX(-50%) scale(1.08); } }

/* Дуэли: авторы раскрываются сами — после подсчёта голосов */
.sol-grid.seq .sol .author { animation: author-in .6s var(--ease-out) both calc(var(--wat) + .3s); }
@keyframes author-in { from { opacity: 0; transform: translateY(calc(1.5 * var(--v))); } }
.sol .txt { overflow-wrap: anywhere; }
.sol-grid.many .sol .txt { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

/* Ближе всех: когда показана шкала — вопрос и число компактнее, чтобы всё помещалось */
.closest.has-res { gap: calc(1.4 * var(--v)); }
.closest.has-res .q-text { font-size: calc(2.4 * var(--u)) !important; margin-top: calc(.8 * var(--v)) !important; }
.closest.has-res .answer-big .display { font-size: calc(4.4 * var(--u)); }
.closest.has-res .scale-wrap { gap: calc(1.2 * var(--v)); align-self: end; }

.who-chip > span:last-child { font-size: calc(1.3 * var(--u)); }
.lie-row .fact .voters { gap: calc(.6 * var(--v)) calc(.4 * var(--u)); }
.lie-row .fact.is-truth { opacity: .7; }
.vt-nm { font-size: calc(1.15 * var(--u)); }
.mk .lab { font-size: calc(1.35 * var(--u)); }

/* Полоса игроков: плавно уезжает и возвращается */
.pbar { max-height: calc(20 * var(--v)); overflow: hidden; transition: max-height .6s var(--ease), opacity .45s var(--ease), padding .6s var(--ease), border-color .6s var(--ease); }
.pbar.hide { max-height: 0; opacity: 0; padding-top: 0; padding-bottom: 0; border-top-color: transparent; }

/* Джокер на заставке: перелив быстрее */
.intro-joker { animation: under-in .7s var(--ease-out) both 2.2s, jk-flow 1.4s linear infinite 2.9s; }
.calm .intro-joker { animation: jk-flow 1.4s linear infinite; }

/* Дуэли: автор в шапке карточки рядом с А/Б или №; карточки компактнее */
.sol-head { display: flex; align-items: center; justify-content: space-between; gap: calc(1 * var(--u)); min-height: calc(4 * var(--v)); }
.sol-head .author { font-size: calc(1.35 * var(--u)); font-weight: 700; color: var(--text-secondary); display: flex; align-items: center; gap: .45em; white-space: nowrap; }
.sol-grid.many .sol-head .author { font-size: calc(1.05 * var(--u)); }
.sol-grid.many { gap: calc(1.2 * var(--v)) calc(1.2 * var(--u)); }
.sol-grid.many .sol { padding: calc(1.4 * var(--v)) calc(1.2 * var(--u)); gap: calc(.8 * var(--v)); }
.sol-grid.many .sol .txt { font-size: calc(1.3 * var(--u)); -webkit-line-clamp: 3; }
.sol-grid.many .voters-row { min-height: 0; gap: calc(.5 * var(--u)); }
.votes.medals-only { display: flex; gap: calc(.8 * var(--u)); font-size: calc(1.5 * var(--u)); align-items: center; }
.votes.medals-only .md-c b { font-size: .85em; margin-left: .1em; color: var(--green-800); }
.sol-grid.seq .votes.medals-only { animation: author-in .5s var(--ease-out) both var(--wat); }
.sol-grid.pair .sol { padding: calc(2.4 * var(--v)) calc(2 * var(--u)); gap: calc(1.4 * var(--v)); }

/* Итоговый экран номинаций */
.nom-all { display: grid; grid-template-rows: auto 1fr; gap: calc(2 * var(--v)); height: 100%; }
.na-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(1.6 * var(--v)) calc(1.4 * var(--u)); align-content: center; }
.na-card { display: grid; grid-template-columns: auto 1fr; gap: calc(1 * var(--u)); align-items: center; padding: calc(1.6 * var(--v)) calc(1.2 * var(--u)); background: var(--bg-subtle); border-radius: calc(1 * var(--u)); }
.na-name { font-size: calc(1.3 * var(--u)); font-weight: 800; color: var(--text-primary); }
.na-title { font-family: var(--font-serif); font-size: calc(1.5 * var(--u)); font-weight: 700; color: var(--gold); line-height: 1.15; margin: calc(.3 * var(--v)) 0; }
.na-why { font-size: calc(1 * var(--u)); color: var(--text-secondary); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Джокер: «Смотри в оба!» читается поверх лучей — тёмная подложка и яркое золото с обводкой */
.jf-card::before { content: ''; position: absolute; left: 50%; top: 58%; width: 150%; height: 78%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(closest-side, rgba(11, 32, 27, .94) 0%, rgba(11, 32, 27, .82) 55%, rgba(11, 32, 27, 0) 100%); z-index: -1; }
.jf-card { isolation: isolate; }
.jf-title { filter: drop-shadow(0 calc(.25 * var(--v)) 0 rgba(60, 38, 0, .95)) drop-shadow(0 0 calc(.35 * var(--v)) rgba(40, 24, 0, .7)) drop-shadow(0 0 calc(1.4 * var(--v)) rgba(0, 0, 0, .5)); }
.jf-title .ch { background: linear-gradient(180deg, #FFFAEC 0%, #EEDDAA 40%, #D9BC7E 75%, #B98A4E 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.jf-name { color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, .35), 0 0 12px rgba(0, 0, 0, .5); }
.jf-sub { color: #EADBAE; text-shadow: 0 1px 0 rgba(0, 0, 0, .4); }

/* «Анамнез»: отсчёт до раскрытия лжи */
.auto-reveal { margin-left: auto; align-self: center; font-size: calc(1.6 * var(--u)); font-weight: 700; color: var(--warn-ink); background: var(--warn-soft); padding: calc(.8 * var(--v)) calc(1.6 * var(--u)); border-radius: 999px; font-variant-numeric: tabular-nums; animation: enter .4s var(--ease-out) both; }
.auto-reveal b { color: var(--warn-text); font-size: 1.2em; }

/* Джокер на заставке: золото стоит, редкий быстрый блик (раз в ~5 с) */
.intro-joker, .calm .intro-joker { position: relative; overflow: hidden; background-size: 100% 100%; background-position: 0 0; animation: under-in .7s var(--ease-out) both 2.2s; }
.calm .intro-joker { animation: none; }
.intro-joker::after { content: ''; position: absolute; top: -30%; bottom: -30%; left: -40%; width: 28%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .9), transparent); transform: skewX(-20deg); animation: gold-glint 5s cubic-bezier(.4, 0, .2, 1) infinite 3s; pointer-events: none; }
@keyframes gold-glint { 0% { left: -40%; } 14% { left: 120%; } 100% { left: 120%; } }

/* Уже показанные элементы при перерисовке экрана не анимируются повторно */
.who-chip.seen, .vt.seen, .mk.seen, .pb.seen { animation: none !important; }
.pb.seen .ava.mood-done { animation: none; }

/* Правдивые факты после раскрытия — зелёная плашка «ПРАВДА» */
.lie-row .fact.is-truth { opacity: 1; background: var(--mint); border-color: rgba(45, 106, 87, .4); }
.lie-row .fact.is-truth .no { background: var(--green-600); color: #fff; }
.fact .stamp.truth { color: var(--green-700); border-color: var(--green-600); font-size: calc(2 * var(--u)); animation-delay: .25s; }