@font-face{font-family:"PT Serif";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/pt-serif-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:"PT Serif";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/pt-serif-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+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"PT Serif";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/pt-serif-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"PT Serif";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/pt-serif-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"PT Serif";font-weight:400;font-style:italic;font-display:swap;src:url(fonts/pt-serif-cyrillic-400-italic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"PT Serif";font-weight:400;font-style:italic;font-display:swap;src:url(fonts/pt-serif-latin-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --soot:#17120e;      /* фон — копоть со снимков */
  --soot-2:#221a14;    /* поверхности */
  --paper:#ddcdac;     /* альбуминная бумага — основной текст */
  --sepia:#9a8668;     /* второстепенный текст */
  --line:#3a2e24;      /* линии и рамки */
  --flame:#f2a33a;     /* огонь — единственный тёплый акцент */
  --seal:#9b3328;      /* сургуч — «дом голоден», забирание */
  --ghost:#aab6ba;     /* холодное серебро мира призраков */
  --gap:16px;
  --measure:34rem;
  --r:3px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--soot);color:var(--paper)}
body{font:400 17px/1.6 "PT Serif",Georgia,"Times New Roman",serif;-webkit-font-smoothing:antialiased;
  min-height:100svh;overflow-x:hidden}
button,input{font:inherit;color:inherit}
img{display:block;max-width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--flame);outline-offset:3px}

/* ---------- каркас */
.app{max-width:1280px;margin:0 auto;min-height:100svh;display:flex;flex-direction:column}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--gap);
  border-bottom:1px solid var(--line);min-height:56px;position:sticky;top:0;z-index:20;background:var(--soot)}
.ghost-mode .bar{background:#0f1314}
.bar-right{display:flex;align-items:center;gap:14px;flex:none}
.bar-left{display:flex;align-items:baseline;gap:10px;min-width:0}
.clock{font-variant-numeric:tabular-nums;color:var(--sepia);font-size:15px}
.place{font-weight:700;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.main{flex:1;padding:0 0 calc(var(--gap) * 2)}

/* таймер выбора: крупно в прилипшей шапке, на последних секундах — сургуч и пульс */
.timer{display:inline-flex;align-items:baseline;gap:2px;min-width:3.2ch;justify-content:flex-end;
  font-variant-numeric:tabular-nums;color:var(--flame);line-height:1}
.timer b{font-size:30px;font-weight:700}
.timer small{font-size:14px;color:var(--sepia)}
.timer.warm b{color:#f0c56a}
.timer.hot b{color:#e0533f;animation:pulse 1s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
.hurry .fuse span{background:linear-gradient(90deg,#6b2a1f,#e0533f)}
.hurry .fuse{height:5px}
.snd{background:none;border:1px solid var(--line);border-radius:var(--r);color:var(--sepia);cursor:pointer;
  width:36px;height:36px;display:grid;place-items:center;padding:0}
.snd svg{width:20px;height:20px}
.snd[aria-pressed=true]{color:var(--flame);border-color:#5a4636}
/* меню звука (0.1.5): «Звук», «Голос», «Музыка» */
.sndwrap{position:relative}
.snd[aria-expanded=true]{border-color:var(--sepia)}
.sndmenu{position:absolute;right:0;top:calc(100% + 10px);z-index:30;width:248px;padding:6px;
  background:var(--soot);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 14px 34px rgba(0,0,0,.55)}
.ghost-mode .sndmenu{background:#0f1314}
.sndrow{display:grid;grid-template-columns:22px 1fr 38px;align-items:center;gap:12px;width:100%;min-height:52px;
  padding:8px 10px;background:none;border:0;border-radius:calc(var(--r) - 2px);color:var(--paper);font:inherit;
  font-size:16px;text-align:left;cursor:pointer}
.sndrow + .sndrow{border-top:1px solid var(--line)}
.sndrow:hover{background:rgba(255,255,255,.03)}
.sndrow svg{width:20px;height:20px;color:var(--sepia)}
.sndrow small{display:block;font-size:13px;line-height:1.3;color:var(--sepia)}
.sndrow .sw{position:relative;width:38px;height:22px;border-radius:11px;background:#3a3029;transition:background .2s}
.sndrow .sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;
  background:var(--sepia);transition:transform .2s}
.sndrow[aria-checked=true] svg{color:var(--flame)}
.sndrow[aria-checked=true] .sw{background:#8a5a2b}
.sndrow[aria-checked=true] .sw::after{transform:translateX(16px);background:var(--paper)}
.btn.sound-on{gap:10px}
.note svg.inl{width:16px;height:16px;vertical-align:-3px}
.btn.sound-on svg{width:22px;height:22px}

/* свеча: три огонька */
.candle{display:flex;gap:10px;align-items:flex-end;height:28px}
.candle .wick{width:10px;height:26px;position:relative}
.candle .wick::after{content:"";position:absolute;left:4px;bottom:0;width:2px;height:6px;background:#5a4636}
.candle .fire{position:absolute;left:0;bottom:5px;width:10px;height:18px;border-radius:50% 50% 50% 50%/62% 62% 38% 38%;
  background:radial-gradient(ellipse at 50% 72%,#fff3c4 0 18%,var(--flame) 46%,rgba(242,163,58,0) 72%);
  transform-origin:50% 100%;animation:flicker 2.4s ease-in-out infinite}
.candle .wick:nth-child(2) .fire{animation-delay:-.8s}
.candle .wick:nth-child(3) .fire{animation-delay:-1.6s}
.candle .wick.out .fire{opacity:0;animation:none}
.candle .wick.out::before{content:"";position:absolute;left:3px;bottom:7px;width:4px;height:12px;
  background:linear-gradient(to top,rgba(170,160,150,.35),rgba(170,160,150,0));filter:blur(1.5px)}
.candle .wick.lost .fire{animation:douse .9s ease-out forwards}
@keyframes flicker{0%,100%{transform:scale(1,1) rotate(-1deg)}30%{transform:scale(.94,1.06) rotate(1.5deg)}
  55%{transform:scale(1.04,.95) rotate(-1.5deg)}80%{transform:scale(.97,1.03) rotate(.6deg)}}
@keyframes douse{0%{opacity:1;transform:scale(1)}40%{opacity:1;transform:scale(1.25,.6)}100%{opacity:0;transform:scale(.2,.2)}}

/* ---------- сцена: картинка + страница */
.stage{display:grid;grid-template-columns:1fr}
.plate{position:relative;background:#0e0b09;aspect-ratio:16/9;overflow:hidden}
.plate img{width:100%;height:100%;object-fit:cover}
.plate.ghostly img{filter:grayscale(1) contrast(.95) brightness(.9) sepia(.15) hue-rotate(160deg)}
.fuse{height:3px;background:var(--line);position:relative}
.fuse span{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#6b4a22,var(--flame));
  transform-origin:left;transition:transform 1s linear}
.fuse span::after{content:"";position:absolute;right:-3px;top:-3px;width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle,#fff3c4 0 25%,var(--flame) 55%,transparent 75%)}
.fuse.idle span{transition:none}
.page{padding:20px var(--gap) 0;max-width:calc(var(--measure) + var(--gap) * 2)}
.page p{margin:0 0 .9em}
.lede{font-size:18px;line-height:1.65}
.dim{color:var(--sepia)}
.note{font-size:15px;color:var(--sepia);margin-top:4px}
.hungry{color:#d07a6c;font-style:italic;margin:0 0 .6em}

@media (min-width:900px){
  .stage{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:start}
  .stage .media{position:sticky;top:0}
  .page{padding:28px 32px 0}
  body{font-size:18px}
}

/* ---------- кнопки */
.choices{display:grid;gap:12px;margin:20px 0 6px}
.choice{display:block;width:100%;text-align:left;padding:16px 18px;border:1px solid var(--line);
  background:var(--soot-2);border-radius:var(--r);cursor:pointer;font-size:18px;line-height:1.35;
  transition:border-color .15s,background .15s}
.choice:hover{border-color:#5a4636}
.choice .k{display:block;font-size:14px;color:var(--sepia);margin-bottom:2px}
.choice[aria-pressed=true]{border-color:var(--flame);background:#2b2016}
.choice[aria-pressed=true] .k{color:var(--flame)}
.choice:disabled{cursor:default}
.choice.struck{opacity:.45;text-decoration:line-through;text-decoration-color:var(--sepia)}
.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:var(--r);
  border:1px solid var(--flame);background:transparent;color:var(--paper);cursor:pointer;font-size:17px}
.btn.solid{background:var(--flame);color:#1d140b;font-weight:700}
.btn.quiet{border-color:var(--line);color:var(--sepia)}
.btn:disabled{opacity:.4;cursor:default}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 0}
.wait{color:var(--sepia);font-style:italic;margin-top:18px}
.actions.stack{display:grid;grid-template-columns:1fr;gap:10px;max-width:360px}
.actions.stack .btn{width:100%}
.linkbox{display:block;width:100%;max-width:360px;margin:10px 0 0;min-height:44px;padding:0 12px;background:var(--soot-2);border:1px solid var(--flame);border-radius:var(--r);font-size:15px}

/* ---------- вскрытие голосов: карточки у приборов */
.tally-h{margin-top:4px}
.tally{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:4px 0 18px}
.tally .cnt{display:block;font-size:28px;line-height:1.1;color:var(--paper);font-variant-numeric:tabular-nums}
.tally .won .cnt{color:var(--flame)}
.place-card.deal{opacity:0;animation:deal .4s ease-out forwards}
@keyframes deal{from{opacity:0;transform:translateY(-10px) rotate(-4deg)}to{opacity:1;transform:none}}
.tally .col{border-top:1px solid var(--line);padding-top:10px}
.tally .col.won{border-top-color:var(--flame)}
.tally .lab{font-size:14px;color:var(--sepia);line-height:1.35;margin-bottom:8px}
.tally .won .lab{color:var(--paper)}
.cards{display:flex;flex-wrap:wrap;gap:6px}
.place-card{font-style:italic;font-size:15px;padding:3px 9px;background:#e3d5b6;color:#2a1f16;border-radius:1px;
  box-shadow:0 1px 0 #8a7656}
.taken{border-left:3px solid var(--seal);padding:4px 0 4px 14px;margin:18px 0}
.saved{border-left:3px solid var(--paper);padding:4px 0 4px 14px;margin:18px 0}
.event{color:var(--flame);font-style:italic;margin:0 0 .6em}

/* ---------- лобби и вход */
.hero{display:grid;grid-template-columns:1fr}
.hero .art{position:relative;height:min(56svh,520px);overflow:hidden}
.hero .art img{width:100%;height:100%;object-fit:cover;object-position:52% 46%}
.hero .art::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(to bottom,rgba(23,18,14,0),var(--soot))}
.hero .inner{position:relative;z-index:1;margin-top:-56px;padding:0 var(--gap) 32px;max-width:calc(var(--measure) + var(--gap) * 2)}
.title{font-size:clamp(44px,12vw,80px);line-height:1;font-weight:400;letter-spacing:-.01em;margin:0 0 14px}
@media (min-width:900px){
  .hero{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:center;min-height:100svh}
  .hero .art{height:100svh}
  .hero .art::after{inset:0 0 0 auto;width:35%;height:auto;background:linear-gradient(to right,rgba(23,18,14,0),var(--soot))}
  .hero .inner{margin:0;padding:32px 40px}
}
.field{display:block;margin:14px 0 0}
.field span{display:block;font-size:15px;color:var(--sepia);margin-bottom:6px}
.field input{width:100%;min-height:50px;padding:0 14px;background:rgba(23,18,14,.85);border:1px solid #5a4636;
  border-radius:var(--r);font-size:18px}
.field input:focus{border-color:var(--flame);outline:none}
.code-in{text-transform:uppercase;letter-spacing:.3em;font-variant-numeric:tabular-nums}
.or{color:var(--sepia);margin:22px 0 0}
.err{color:#e09a8c;margin:12px 0 0}

.invite{width:100%;max-width:460px;margin:0 auto;padding:24px var(--gap)}
.invite .card{container-type:inline-size;position:relative;aspect-ratio:1080/1926;width:min(100%, 360px);margin:0 auto;background:#0e0b09}
.invite .card img{width:100%;height:100%;object-fit:cover}
.invite .card .ink{position:absolute;left:34.5%;right:34.5%;top:42%;bottom:25%;display:flex;flex-direction:column;
  justify-content:center;text-align:center;color:#2a1f16;font-style:italic;font-size:3.4cqw;line-height:1.4;line-height:1.45;
  white-space:pre-line;text-shadow:0 0 1px rgba(255,240,210,.5)}
.invite .card .ink b{font-style:normal;font-size:1.25em;display:block;margin-bottom:.4em}

.roomcode{font-size:44px;letter-spacing:.18em;font-variant-numeric:tabular-nums;line-height:1;margin:6px 0 4px}
.guests{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.guests li{display:flex;align-items:center;gap:6px}
.guests li.off .place-card{opacity:.45}
.guests button{background:none;border:0;color:var(--sepia);cursor:pointer;padding:4px;font-size:15px}
.rules{padding-left:1.1em;margin:10px 0 0}
.rules li{margin:0 0 .5em}
.toggle{display:flex;align-items:center;gap:12px;margin:20px 0 0;cursor:pointer;user-select:none}
.toggle input{width:22px;height:22px;accent-color:var(--flame)}
h2{font-size:22px;font-weight:700;margin:26px 0 8px;line-height:1.3}

/* ---------- призрак */
.ghost-mode{--paper:#c9d1d3;--sepia:#7e8a8e;--line:#2c3336;--soot-2:#161b1d;--flame:var(--ghost)}
.ghost-mode,.ghost-mode body{background:#0f1314}
.ghost-mode .candle{display:none}
.ghostcard{border:1px solid var(--line);padding:14px 16px;margin:0 0 16px;border-radius:var(--r)}
.ghostcard p{margin:0 0 .5em}
.hint{font-style:italic}
.phrases{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.whispers{margin:16px 0 0;padding:12px 14px;border:1px dashed #5a4636;border-radius:var(--r)}
.whispers p{margin:0 0 .35em;font-style:italic}
.whispers small{color:var(--sepia)}

/* ---------- финал и концовка */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 0}
.doors .choice{min-height:72px}
.result{font-size:19px;margin:18px 0}
.share{margin:22px 0 0}
.share canvas{width:100%;max-width:360px;height:auto;display:block;border:1px solid var(--line)}
.roll{list-style:none;padding:0;margin:8px 0 0}
.roll li{padding:8px 0;border-bottom:1px solid var(--line);font-size:16px}
.promo{margin:30px 0 0;padding:18px 0 0;border-top:1px solid var(--line)}
.follow{margin:24px 0 0;padding:18px 16px;border:1px solid #5a4636;border-radius:var(--r);background:var(--soot-2)}
.follow > p:first-child{font-size:19px;margin:0}
.follow .actions{margin-top:14px}
.mail{margin-top:14px}
.mail .field{margin:0}
.mail .toggle{font-size:15px;line-height:1.45;margin-top:14px;align-items:flex-start;color:var(--sepia)}
.mail .toggle input{flex:none;margin-top:1px}
.mail .toggle a{color:var(--paper)}
.mail .ok{margin:0}
.ok{color:var(--flame);margin:16px 0 0;font-style:italic}
.promo a{color:var(--paper)}

/* ---------- скример и тряска */
.scare{position:fixed;inset:0;z-index:50;background:#000;display:grid;place-items:center;pointer-events:none;
  animation:scare .9s ease-out forwards}
.scare img{width:100%;height:100%;object-fit:cover;filter:contrast(1.6) brightness(1.2);animation:lunge .9s ease-out forwards}
@keyframes scare{0%{opacity:1}70%{opacity:1}100%{opacity:0}}
@keyframes lunge{0%{transform:scale(1.6)}100%{transform:scale(1.05)}}
.shake{animation:shake .45s linear}
@keyframes shake{0%,100%{transform:none}20%{transform:translate(-6px,3px)}40%{transform:translate(5px,-4px)}
  60%{transform:translate(-4px,-2px)}80%{transform:translate(3px,3px)}}
.banner{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px var(--gap);background:#2b2016;
  border-top:1px solid var(--flame);text-align:center;font-style:italic}

/* ---------- большой экран */
.tv body,.tv{font-size:22px}
.tv .page{max-width:none}
.tv .lede{font-size:26px}
.tv .roomcode{font-size:96px}
.tv .tally .lab{font-size:21px}
.tv .tally .cnt{font-size:48px}
.tv .place-card{font-size:21px;padding:4px 12px}
.tv .note{font-size:21px}
.tv .timer b{font-size:44px}
.tv .taken p{font-size:26px}
@media (min-width:1600px){.tv .app{max-width:none;zoom:1.45}}

@media (prefers-reduced-motion:reduce){
  .candle .fire{animation:none}
  .shake,.scare,.scare img{animation:none}
  .scare{display:none}
  .fuse span{transition:none}
  .timer.hot b{animation:none}
  .place-card.deal{animation:none;opacity:1}
}

/* ================= 0.1.4: движение и широкий экран ================= */
/* фактура тёмных полей: мелкое зерно поверх фона (svg-шум, без файлов) */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.app{position:relative;z-index:1}

/* картинка сцены: проявление из темноты при смене картинки, потом медленный дрейф и туман */
.plate img{animation:drift 60s ease-in-out infinite alternate;animation-delay:var(--clock,0s);transform-origin:50% 55%}
@keyframes drift{0%{transform:scale(1.035) translate(0,0)}100%{transform:scale(1.085) translate(-1.2%,-.8%)}}
.fresh-img .plate{animation:reveal 1.8s ease-out both}
@keyframes reveal{0%{opacity:0;filter:brightness(.2) blur(6px)}60%{opacity:1}100%{opacity:1;filter:none}}
.plate::before{content:"";position:absolute;inset:-10% -30%;z-index:1;pointer-events:none;opacity:.22;mix-blend-mode:screen;
  background:radial-gradient(40% 30% at 30% 70%,rgba(220,205,175,.55),transparent 70%),
             radial-gradient(35% 25% at 75% 80%,rgba(220,205,175,.4),transparent 70%),
             radial-gradient(30% 22% at 55% 60%,rgba(220,205,175,.3),transparent 70%);
  filter:blur(18px);animation:fog 40s linear infinite;animation-delay:var(--clock,0s)}
@keyframes fog{0%{transform:translateX(-6%)}50%{transform:translateX(6%)}100%{transform:translateX(-6%)}}
.plate::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(10,8,6,.55) 100%)}
.ghost-mode .plate::before{opacity:.32}

/* текст экрана поднимается из темноты, абзацы по очереди */
.fresh > *{animation:rise .7s ease-out both}
.fresh > *:nth-child(2){animation-delay:.08s}.fresh > *:nth-child(3){animation-delay:.16s}
.fresh > *:nth-child(4){animation-delay:.24s}.fresh > *:nth-child(5){animation-delay:.32s}
.fresh > *:nth-child(n+6){animation-delay:.4s}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* отклик кнопок */
.btn,.choice{transition:transform .12s ease,border-color .15s,background .15s,box-shadow .2s}
.btn:active:not(:disabled),.choice:active:not(:disabled){transform:scale(.975)}
.btn.solid:hover:not(:disabled){box-shadow:0 0 0 3px rgba(242,163,58,.18),0 0 24px rgba(242,163,58,.25)}
.choice:hover:not(:disabled){border-color:#6b543f;background:#271d15}
.choice[aria-pressed=true]{animation:chosen .5s ease-out}
@keyframes chosen{0%{box-shadow:0 0 0 0 rgba(242,163,58,.5)}100%{box-shadow:0 0 0 12px rgba(242,163,58,0)}}
.tally .won .cnt{animation:glow 1.2s ease-out .6s both}
@keyframes glow{0%{text-shadow:none}40%{text-shadow:0 0 18px rgba(242,163,58,.8)}100%{text-shadow:0 0 6px rgba(242,163,58,.3)}}

/* ---------- ноутбук и шире: картинка во всю высоту, текст колонкой рядом */
@media (min-width:900px){
  .app{max-width:none}
  .bar{padding:10px 28px;background:linear-gradient(to bottom,rgba(23,18,14,.96),rgba(23,18,14,.88));backdrop-filter:blur(6px)}
  .ghost-mode .bar{background:linear-gradient(to bottom,rgba(15,19,20,.96),rgba(15,19,20,.88))}
  .stage{grid-template-columns:minmax(0,1.55fr) minmax(400px,1fr);align-items:start;min-height:calc(100svh - 57px)}
  .stage .media{position:sticky;top:57px;height:calc(100svh - 57px);overflow:hidden}
  .stage .plate{aspect-ratio:auto;height:100%}
  .stage .media::after{content:"";position:absolute;inset:0 0 0 auto;width:28%;z-index:2;pointer-events:none;
    background:linear-gradient(to right,rgba(23,18,14,0),var(--soot))}
  .ghost-mode .stage .media::after{background:linear-gradient(to right,rgba(15,19,20,0),#0f1314)}
  .stage .fuse{position:absolute;left:0;right:0;bottom:0;z-index:3;height:4px}
  .page{padding:clamp(28px,7vh,80px) clamp(28px,3.4vw,56px) 56px;max-width:42rem}
  body{font-size:19px}
  .lede{font-size:20px;line-height:1.7}
  h2{font-size:25px}
  .choice{font-size:19px;padding:18px 20px}
  .tally .lab{font-size:15px}
  .note{font-size:16px}
}
@media (min-width:1500px){
  .stage{grid-template-columns:minmax(0,1.7fr) minmax(460px,1fr)}
  .page{max-width:44rem}
}
/* большой экран: без колонки-скролла, всё крупно */
.tv .stage .media::after{width:22%}

@media (prefers-reduced-motion:reduce){
  .plate img,.plate::before,.fresh-img .plate,.fresh > *,.choice[aria-pressed=true],.tally .won .cnt{animation:none}
}
/* узкий телефон: таймер, свеча и два значка не должны съедать название сцены */
@media (max-width:480px){
  .bar{gap:8px;padding:10px 12px 10px 14px}
  .bar-left{gap:7px}
  .bar-right{gap:7px}
  .snd{width:30px;height:30px}
  .snd svg{width:18px;height:18px}
  .candle{gap:6px}
  .timer b{font-size:26px}
  .clock{font-size:14px}
}