/* Дизайн-система паку «Записка з вирізаних літер» + стилі Словоблуда й екрана для стріму. */
  /* Словоблуд — дизайн-система «записка з вирізаних літер». Усе гостре й під кутом, кругле лише печатки. */
  :root{
    color-scheme:dark;
    --void:#0c090e; --crypt:#17111b; --crypt-2:#221a28; --seam:#3a2d40;
    --bone:#f1e7d0; --bone-dim:#a99d88;
    --curse:#ff3b8d; --ecto:#2fe3c3; --candle:#ffc531; --hex:#a98bff; --blood:#ff5a3c;
    --on-accent:var(--void);
    --c-p:var(--curse); --c-l:var(--ecto); --c-a:var(--candle); --c-d:var(--hex);
    --font-display:"Cormorant Garamond","Cormorant",Georgia,serif;
    --font-punch:Oswald,"Arial Narrow",Impact,sans-serif;
    --font-body:"Golos Text","PT Sans",system-ui,sans-serif;
    --font-glyph:"Rubik Mono One",Impact,sans-serif;
    --font-mono:"JetBrains Mono",ui-monospace,monospace;
    --tilt-sm:-1.5deg; --tilt:-4deg; --skew:-12deg;
    --dur-snap:120ms; --dur-hit:180ms; --dur-sweep:320ms; --dur-ritual:640ms;
    --ease-overshoot:cubic-bezier(.2,1.6,.3,1); --ease-slam:cubic-bezier(.7,0,.2,1); --ease-drift:cubic-bezier(.3,.7,.4,1);
    --drop-hard:6px 6px 0 #000;
    --cut:16px;
  }
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
  html,body{margin:0;padding:0;}
  body{min-height:100vh;background:var(--void);color:var(--bone);font-family:var(--font-body);-webkit-font-smoothing:antialiased;
    background-image:radial-gradient(color-mix(in srgb,var(--bone) 6%,transparent) .6px,transparent .8px),radial-gradient(ellipse at 10% 0%,color-mix(in srgb,var(--hex) 18%,transparent),transparent 55%),radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--curse) 12%,transparent),transparent 50%);
    background-size:3px 3px,100% 100%,100% 100%;background-attachment:fixed;}
  .wrap{max-width:520px;margin:0 auto;padding:20px 16px 120px;min-height:100vh;}
  h1,h2,h3{margin:0;line-height:1.05;}
  h2{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:38px;}
  h3{font-family:var(--font-punch);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:20px;margin-bottom:10px;}
  b{font-weight:700;}

  /* проклятий заголовок */
  .logo{text-align:center;margin:8px 0 6px;}
  .nr-title{display:inline-flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:.03em;line-height:1;font-size:48px;}
  .nr-title .w{display:inline-flex;align-items:flex-end;gap:.03em;margin:0 .14em;}
  .nr-l{display:inline-block;transform:rotate(var(--r,0deg)) translateY(var(--y,0));padding:0 .06em;line-height:.95;}
  .nr-l.f-display{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:1.12em;}
  .nr-l.f-punch{font-family:var(--font-punch);font-weight:700;text-transform:uppercase;}
  .nr-l.f-glyph{font-family:var(--font-glyph);font-size:.78em;}
  .nr-l.f-body{font-family:var(--font-body);font-weight:700;}
  .nr-l.f-mono{font-family:var(--font-mono);font-weight:700;font-size:.86em;}
  .nr-l.chip-bone{background:var(--bone);color:var(--on-accent);}
  .nr-l.chip-curse{background:var(--curse);color:var(--on-accent);}
  .nr-l.chip-void{background:var(--void);color:var(--bone);outline:2px solid var(--bone);outline-offset:-2px;}
  .nr-l.ink-curse{color:var(--curse);} .nr-l.ink-candle{color:var(--candle);}
  .logo.small .nr-title{font-size:26px;}
  .tagline{text-align:center;color:var(--bone-dim);font-size:14px;margin:6px 0 22px;}
  .tagline b{color:var(--curse);font-family:var(--font-punch);letter-spacing:.06em;text-transform:uppercase;}

  /* панелі зі зрізаними кутами */
  .card{background:var(--crypt);padding:20px;margin-bottom:16px;position:relative;
    clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)));}
  .center{text-align:center;}
  .muted{color:var(--bone-dim);font-size:14px;line-height:1.45;}
  .small{font-size:12px;}
  .error{color:var(--blood);font-size:14px;font-weight:600;margin-top:10px;}
  .error::before{content:"✕ ";}
  .toplink{text-align:center;margin-top:16px;color:var(--bone-dim);font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;}

  /* скошені кнопки: фон скошений псевдоелементом, текст рівний */
  .btn{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:14px;padding:14px 18px;
    border:0;background:transparent;color:var(--on-accent);cursor:pointer;text-decoration:none;
    font-family:var(--font-punch);font-weight:700;font-size:19px;letter-spacing:.05em;text-transform:uppercase;
    transition:transform var(--dur-snap) var(--ease-overshoot);}
  .btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--bg,var(--curse));transform:skewX(var(--skew));box-shadow:var(--drop-hard);transition:box-shadow var(--dur-snap),transform var(--dur-snap);}
  .btn:hover{transform:translate(-2px,-2px);}
  .btn:hover::before{box-shadow:9px 9px 0 #000;}
  .btn:active{transform:translate(3px,3px) scale(.98);}
  .btn:active::before{box-shadow:0 0 0 #000;}
  .btn:focus-visible{outline:3px solid var(--candle);outline-offset:5px;}
  .btn-primary{--bg:var(--curse);}
  .btn-secondary{--bg:var(--bone);}
  .btn-pink{--bg:var(--curse);}
  .btn-shuffle{--bg:var(--hex);}
  .btn-ghost{--bg:transparent;color:var(--bone);font-size:15px;padding:11px 14px;}
  .btn-ghost::before{box-shadow:inset 0 0 0 2px var(--bone-dim);}
  .btn-ghost:hover::before{box-shadow:inset 0 0 0 2px var(--bone),6px 6px 0 #000;}
  .btn:disabled{cursor:not-allowed;color:var(--bone-dim);transform:none;}
  .btn:disabled::before{background:var(--crypt-2);box-shadow:none;}
  .btn-row{display:flex;gap:12px;} .btn-row .btn{flex:1;}

  /* поля */
  label,.lbl{font-family:var(--font-punch);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);}
  .field{margin-bottom:18px;}
  input,textarea{width:100%;background:var(--crypt-2);border:0;border-bottom:3px solid var(--bone-dim);color:var(--bone);font-family:var(--font-body);font-size:17px;padding:13px 14px;margin-top:8px;outline:none;border-radius:0;transition:border-color var(--dur-snap);}
  input:focus{border-bottom-color:var(--candle);background:color-mix(in srgb,var(--candle) 6%,var(--crypt-2));}
  input::placeholder{color:color-mix(in srgb,var(--bone-dim) 70%,transparent);}

  /* код кімнати */
  .code-display{font-family:var(--font-mono);font-weight:700;font-size:52px;letter-spacing:.24em;color:var(--candle);text-align:center;margin:8px 0 4px;padding-left:.24em;}
  .copybox{display:flex;gap:8px;align-items:center;background:var(--crypt-2);padding:10px 12px;margin-top:10px;}
  .copybox input{border:0;background:transparent;margin:0;padding:0;font-size:13px;color:var(--bone-dim);}
  .copybox button{background:var(--ecto);color:var(--on-accent);border:0;padding:8px 14px;font-family:var(--font-punch);font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transform:skewX(var(--skew));white-space:nowrap;}

  /* чипи гравців */
  .chip{display:inline-flex;align-items:center;gap:8px;background:var(--crypt-2);padding:6px 14px 6px 6px;margin:6px 6px 0 0;font-family:var(--font-punch);font-weight:600;font-size:15px;letter-spacing:.03em;transform:skewX(var(--skew));}
  .chip > *{transform:skewX(calc(var(--skew) * -1));}
  .chip.done{background:color-mix(in srgb,var(--candle) 20%,var(--crypt-2));box-shadow:inset 0 0 0 2px var(--candle);}

  .seg{display:flex;gap:10px;margin-top:8px;}
  .seg button{flex:1;padding:11px;border:0;background:var(--crypt-2);color:var(--bone);font-family:var(--font-punch);font-weight:700;font-size:18px;cursor:pointer;transform:skewX(var(--skew));transition:transform var(--dur-snap) var(--ease-overshoot);}
  .seg button.active{background:var(--candle);color:var(--on-accent);box-shadow:4px 4px 0 #000;}
  .seg button:active{transform:skewX(var(--skew)) scale(.94);}

  .spinner{width:46px;height:46px;margin:14px auto;border-radius:50%;border:3px dashed var(--hex);animation:spin 3s linear infinite;position:relative;}
  .spinner::after{content:"";position:absolute;inset:7px;border-radius:50%;border:2px dotted var(--curse);animation:spin 1.6s linear infinite reverse;}
  @keyframes spin{to{transform:rotate(360deg);}}
  .demo-banner{background:color-mix(in srgb,var(--candle) 12%,transparent);border-left:4px solid var(--candle);color:var(--candle);padding:10px 12px;font-size:13px;margin-bottom:16px;}

  /* шапка фази */
  .phase-head{display:flex;justify-content:space-between;align-items:center;margin:12px 0 16px;gap:10px;}
  .pill{display:inline-block;background:var(--bone);color:var(--on-accent);padding:4px 14px;font-family:var(--font-punch);font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;transform:skewX(var(--skew)) rotate(var(--tilt-sm));box-shadow:4px 4px 0 #000;animation:bannerIn var(--dur-sweep) var(--ease-overshoot) both;}
  .pill + .pill{background:var(--crypt-2);color:var(--candle);font-family:var(--font-mono);box-shadow:none;animation:none;transform:none;}
  @keyframes bannerIn{from{opacity:0;transform:skewX(var(--skew)) rotate(var(--tilt-sm)) translateX(-60%);}to{opacity:1;}}
  .rules{padding-left:22px;margin:8px 0 0;}
  .rules li{margin-bottom:8px;color:var(--bone-dim);font-size:14px;line-height:1.45;}
  .rules li::marker{font-family:var(--font-display);font-style:italic;font-weight:700;color:var(--curse);}
  .rules b{color:var(--bone);}

  /* категорії при написанні слів */
  .cat-title{display:flex;align-items:baseline;gap:8px;font-family:var(--font-punch);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px;}
  .cat-title .muted{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-weight:500;font-size:13px;}
  .cat-dot{width:14px;height:14px;display:inline-block;background:var(--c);transform:rotate(45deg);flex:none;align-self:center;}
  .cat-p{--c:var(--c-p);} .cat-l{--c:var(--c-l);} .cat-a{--c:var(--c-a);} .cat-d{--c:var(--c-d);}
  .cat-block{padding-left:0;margin-bottom:20px;}
  .cat-block input{border-bottom-color:color-mix(in srgb,var(--c) 70%,var(--bone-dim));}
  .cat-block input:focus{border-bottom-color:var(--c);background:color-mix(in srgb,var(--c) 8%,var(--crypt-2));}

  /* анекдот і дірки */
  .joke{background:var(--crypt);padding:20px 18px;font-size:19px;line-height:1.75;font-weight:500;position:relative;
    clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));}
  .card .joke{background:var(--crypt-2);}
  .joke.big{font-size:21px;}
  .slot{--c:var(--bone-dim);display:inline;font-family:var(--font-punch);font-weight:600;letter-spacing:.01em;color:var(--on-accent);background:var(--c);
    padding:.02em .32em .06em;margin:0 .06em;border-radius:2px;box-decoration-break:clone;-webkit-box-decoration-break:clone;
    filter:saturate(.55) brightness(.82);transition:filter var(--dur-snap);}
  .slot.c-p{--c:var(--c-p);} .slot.c-l{--c:var(--c-l);} .slot.c-a{--c:var(--c-a);} .slot.c-d{--c:var(--c-d);}
  .slot.chg{filter:none;box-shadow:3px 3px 0 #000;}
  .slot.edit{cursor:pointer;user-select:none;-webkit-user-select:none;}
  .slot.edit:active{filter:brightness(1.15);}
  .slot.active{outline:3px solid var(--bone);outline-offset:2px;}
  .slot .lk{font-size:.75em;margin-left:3px;}
  .slot.is-cursed{animation:glitch 70ms steps(2) infinite;filter:none;}
  .slot.is-landed{animation:land var(--dur-hit) var(--ease-overshoot);}
  @keyframes glitch{0%{filter:hue-rotate(40deg);text-shadow:2px 0 var(--ecto),-2px 0 var(--curse);}50%{filter:hue-rotate(-60deg) brightness(1.4);text-shadow:-2px 0 var(--ecto),2px 0 var(--hex);}100%{filter:none;}}
  @keyframes land{from{filter:brightness(1.8);}to{filter:none;}}
  .offer{margin-bottom:16px;}
  .offer .btn{margin-top:12px;}
  .legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--bone-dim);margin:8px 0 14px;}
  .legend span{display:inline-flex;align-items:center;gap:6px;}

  /* бій */
  .vs{font-family:var(--font-glyph);color:var(--bone);text-align:center;font-size:30px;margin:10px 0;text-shadow:3px 3px 0 var(--curse);transform:rotate(-6deg);}
  .vote-card{cursor:pointer;margin-top:18px;overflow:visible;transition:transform var(--dur-snap) var(--ease-overshoot);}
  .vote-card:active{transform:scale(.97) rotate(-.6deg);}
  .vote-card .tagline-ab{position:absolute;top:0;left:18px;transform:translateY(-1px) skewX(var(--skew));background:var(--curse);color:var(--on-accent);font-family:var(--font-punch);font-weight:700;font-size:13px;letter-spacing:.1em;padding:2px 12px;}
  .vote-card[data-arg="B"] .tagline-ab{background:var(--ecto);}
  .vote-card{padding-top:30px;}
  .res-card{position:relative;margin-bottom:8px;}
  .res-card.win{background:color-mix(in srgb,var(--candle) 14%,var(--crypt));box-shadow:inset 0 0 0 3px var(--candle);}
  .res-card.lose{opacity:.45;filter:grayscale(.7);}
  .res-meta{margin-top:12px;font-size:13px;color:var(--bone-dim);line-height:1.6;display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
  .res-meta b{color:var(--bone);font-family:var(--font-punch);font-weight:600;font-size:15px;letter-spacing:.03em;}
  .votes-big{font-family:var(--font-mono);font-weight:700;font-size:20px;color:var(--candle);margin-bottom:6px;}
  .crown{position:absolute;top:6px;right:22px;font-size:28px;transform:rotate(14deg);animation:crownDrop var(--dur-ritual) var(--ease-overshoot) both;}
  @keyframes crownDrop{from{opacity:0;transform:translateY(-30px) rotate(-30deg);}to{opacity:1;transform:rotate(14deg);}}
  .streak{color:var(--candle);font-weight:700;font-family:var(--font-mono);}
  .score-row{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;margin-bottom:6px;background:var(--crypt-2);font-family:var(--font-punch);font-weight:600;font-size:17px;letter-spacing:.02em;transform:skewX(var(--skew));}
  .score-row > *{transform:skewX(calc(var(--skew) * -1));display:inline-flex;align-items:center;gap:8px;}
  .score-row:first-child{background:var(--candle);color:var(--on-accent);}
  .score-row .pts{font-family:var(--font-mono);font-weight:700;font-size:19px;color:var(--candle);}
  .score-row:first-child .pts{color:var(--on-accent);}
  .badge{display:inline-block;font-family:var(--font-punch);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;padding:3px 12px;margin-bottom:12px;transform:skewX(var(--skew)) rotate(var(--tilt-sm));color:var(--on-accent);}
  .badge.g{background:var(--candle);} .badge.s{background:var(--hex);}
  .stamp{display:inline-block;font-family:var(--font-punch);font-weight:700;text-transform:uppercase;font-size:34px;line-height:1;letter-spacing:.04em;color:var(--curse);padding:.12em .4em;border:4px solid currentColor;transform:rotate(var(--tilt));animation:slam var(--dur-hit) var(--ease-slam) both;}
  @keyframes slam{from{opacity:0;transform:rotate(-14deg) scale(3);}to{opacity:1;transform:rotate(var(--tilt)) scale(1);}}

  /* шторка вибору слова */
  .sheet-bg{position:fixed;inset:0;background:color-mix(in srgb,var(--void) 75%,transparent);z-index:20;backdrop-filter:blur(3px);}
  .sheet{position:fixed;left:0;right:0;bottom:0;z-index:21;background:var(--crypt);border-top:5px solid var(--c);padding:20px 16px calc(26px + env(safe-area-inset-bottom,0px));max-height:72vh;overflow:auto;max-width:520px;margin:0 auto;animation:sheetUp var(--dur-sweep) var(--ease-overshoot) both;}
  @keyframes sheetUp{from{transform:translateY(100%);}to{transform:none;}}
  .sheet .opt{display:block;width:100%;text-align:left;background:var(--crypt-2);border:0;color:var(--bone);padding:13px 16px;margin-top:8px;font-size:17px;font-family:var(--font-body);font-weight:500;cursor:pointer;transform:skewX(var(--skew));transition:transform var(--dur-snap) var(--ease-overshoot);}
  .sheet .opt:active{transform:skewX(var(--skew)) scale(.97);}
  .sheet .opt.cur{background:var(--c);color:var(--on-accent);font-family:var(--font-punch);font-weight:600;}
  .sheet .opt.orig{color:var(--bone-dim);font-style:italic;}
  .toolbar{display:flex;gap:12px;margin-top:14px;}
  .toolbar .btn{margin-top:0;flex:1;font-size:16px;padding:12px 8px;}
  .hint{font-size:12px;color:var(--bone-dim);margin-top:10px;text-align:center;}
  .host-tools{margin-top:12px;}
  .dots::after{content:'';animation:dots 1.4s steps(4) infinite;}
  @keyframes dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
  .pop{animation:popIn var(--dur-sweep) var(--ease-overshoot) both;}
  @keyframes popIn{from{opacity:0;transform:scale(.6) rotate(-3deg);}to{opacity:1;transform:none;}}
  .slide-l{animation:slideL var(--dur-sweep) var(--ease-overshoot) both;}
  .slide-r{animation:slideR var(--dur-sweep) var(--ease-overshoot) both;}
  @keyframes slideL{from{opacity:0;transform:translateX(-40%) rotate(-3deg);}to{opacity:1;transform:none;}}
  @keyframes slideR{from{opacity:0;transform:translateX(40%) rotate(3deg);}to{opacity:1;transform:none;}}

  /* печатки-аватари */
  .av{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;width:1.8em;height:1.8em;line-height:1;flex:none;object-fit:cover;vertical-align:middle;font-size:1em;box-shadow:0 0 0 2px var(--void),0 0 0 3px var(--seam);}
  span.av{font-size:1.05em;}
  .av-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:10px;}
  .av-opt{aspect-ratio:1;border-radius:50%;border:0;font-size:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;overflow:hidden;color:inherit;transition:transform var(--dur-snap) var(--ease-overshoot);box-shadow:0 0 0 2px var(--void);}
  .av-opt:active{transform:scale(.88);}
  .av-opt.sel{box-shadow:0 0 0 3px var(--void),0 0 0 6px var(--candle);transform:scale(1.04);}
  .av-opt.taken{opacity:.18;pointer-events:none;}
  .av-opt img{width:100%;height:100%;object-fit:cover;}
  .av-opt.photo{font-size:20px;background:var(--crypt-2);box-shadow:inset 0 0 0 2px var(--bone-dim);}
  .av-cap{font-size:12px;color:var(--bone-dim);text-align:center;margin-top:8px;min-height:15px;font-family:var(--font-punch);letter-spacing:.06em;text-transform:uppercase;}
  .me-row{display:flex;align-items:center;gap:14px;margin-bottom:6px;}
  .me-row .av{font-size:30px;}
  .res-meta .av,.chip .av,.score-row .av{font-size:15px;}
  .sfx-toggle{position:fixed;top:calc(10px + env(safe-area-inset-top,0px));right:12px;z-index:15;width:38px;height:38px;border:0;background:var(--crypt-2);color:var(--bone);font-size:17px;cursor:pointer;transform:skewX(var(--skew));}

  .head-r{display:inline-flex;gap:8px;align-items:center;}
  .aud-toggle{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;color:var(--bone);font:inherit;font-size:15px;padding:6px 0 14px;cursor:pointer;text-align:left;}
  .aud-toggle .box{width:22px;height:22px;flex:none;display:grid;place-items:center;background:var(--crypt-2);box-shadow:inset 0 0 0 2px var(--bone-dim);font-weight:700;color:var(--on-accent);}
  .aud-toggle.on .box{background:var(--ecto);box-shadow:none;}
  .aud-v{font-size:.7em;color:var(--ecto);}
  .react-space{height:76px;}
  .react-bar{position:fixed;left:50%;bottom:calc(10px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:12;display:flex;gap:6px;padding:6px;background:color-mix(in srgb,var(--void) 88%,transparent);box-shadow:0 0 0 2px var(--seam),6px 6px 0 #000;backdrop-filter:blur(4px);}
  .react-bar button{width:46px;height:46px;border:0;background:var(--crypt-2);font-size:24px;cursor:pointer;transition:transform var(--dur-snap);}
  .react-bar button:active{transform:scale(.88);}
  .react-bar button.sent{animation:reactSent .5s var(--ease-overshoot);}
  @keyframes reactSent{0%{transform:scale(1);}40%{transform:scale(1.35) rotate(-8deg);background:var(--curse);}100%{transform:scale(1);}}
  .scr-mini{display:flex;flex-wrap:wrap;gap:.7vw;justify-content:flex-start;align-items:center;padding-right:clamp(100px,11vw,190px);min-height:clamp(30px,3.6vw,60px);}
  .scr-mini .mchip{position:relative;display:inline-flex;align-items:center;gap:.45em;font-family:var(--font-punch);font-weight:600;font-size:clamp(12px,1.15vw,22px);background:var(--crypt-2);padding:.2em .8em .2em .25em;transform:skewX(var(--skew));}
  .scr-mini .mchip .av{width:1.7em;height:1.7em;font-size:1em;}
  .scr-mini .mchip b{font-family:var(--font-mono);color:var(--candle);}
  .scr-mini .mchip.lead{box-shadow:inset 0 0 0 2px var(--candle);}
  .scr-mini .mchip.aud{padding-left:.8em;color:var(--ecto);}
  .scr-mini .mc{position:absolute;top:-.95em;left:.2em;font-style:normal;font-size:.9em;}
  .scr-mini .delta{position:absolute;right:-.3em;top:-1.1em;font-style:normal;font-family:var(--font-mono);font-weight:700;color:var(--ecto);animation:deltaUp 2.4s var(--ease-overshoot) both;}
  @keyframes deltaUp{0%{opacity:0;transform:translateY(.6em) scale(.6);}15%{opacity:1;transform:translateY(0) scale(1.25);}75%{opacity:1;transform:translateY(-.3em) scale(1);}100%{opacity:0;transform:translateY(-.8em);}}
  #scr-toasts{position:fixed;top:9vh;right:3vw;z-index:6;display:flex;flex-direction:column;align-items:flex-end;gap:.8vh;pointer-events:none;}
  .scr-toast{display:flex;align-items:center;gap:.6em;font-size:clamp(13px,1.2vw,22px);background:var(--crypt);padding:.35em 1em .35em .35em;box-shadow:inset 0 0 0 2px var(--seam),5px 5px 0 #000;transform:skewX(var(--skew));animation:toastIn .45s var(--ease-overshoot) both;}
  .scr-toast.out{animation:toastOut .45s ease-in forwards;}
  .scr-toast .av{width:1.8em;height:1.8em;}
  .scr-toast i{font-style:normal;font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
  .scr-toast i.cat-p{color:var(--curse);} .scr-toast i.cat-l{color:var(--ecto);} .scr-toast i.cat-a{color:var(--candle);} .scr-toast i.cat-d{color:var(--hex);}
  @keyframes toastIn{from{opacity:0;transform:translateX(40px) skewX(var(--skew));}to{opacity:1;transform:skewX(var(--skew));}}
  @keyframes toastOut{to{opacity:0;transform:translateX(40px) skewX(var(--skew));}}
  #scr-reacts{position:fixed;inset:0;z-index:7;pointer-events:none;overflow:hidden;}
  .scr-react{position:absolute;bottom:-12vh;display:flex;flex-direction:column;align-items:center;animation:reactFly 2.9s cubic-bezier(.2,.7,.3,1) forwards;}
  .scr-react .em{font-size:clamp(34px,4.4vw,84px);line-height:1;filter:drop-shadow(3px 3px 0 #000);}
  .scr-react .av{width:clamp(20px,1.9vw,36px);height:clamp(20px,1.9vw,36px);font-size:clamp(12px,1.1vw,20px);margin-top:-.3em;}
  @keyframes reactFly{0%{transform:translate(0,0) scale(.5);opacity:0;}12%{opacity:1;transform:translate(calc(var(--dx)*.2),-12vh) scale(1.15);}80%{opacity:1;}100%{transform:translate(var(--dx),-70vh) scale(.9) rotate(10deg);opacity:0;}}
  .lang-seg{max-width:260px;margin:0 auto 14px;}
  .lang-seg button{font-family:var(--font-mono);letter-spacing:.08em;}
  .g-row{display:flex;gap:8px;align-items:center;}
  .g-row input{flex:1;min-width:0;}
  .gtog{display:flex;flex:none;gap:3px;}
  .gtog button{min-width:34px;padding:0 7px;height:40px;border:0;background:var(--crypt-2);color:var(--bone-dim);font-family:var(--font-punch);font-weight:700;font-size:15px;cursor:pointer;transform:skewX(var(--skew));transition:background var(--dur-snap),color var(--dur-snap);}
  .gtog button.on{background:var(--curse);color:var(--on-accent);box-shadow:3px 3px 0 #000;}
  .spam-row .gtog button{height:44px;}
  .gbadge{display:inline-block;margin-left:6px;padding:0 6px;font-family:var(--font-mono);font-size:11px;background:var(--crypt-2);color:var(--bone-dim);vertical-align:middle;}
  .still .pill:not(.urgent), .still .sheet, .still .pop, .still .slide-l, .still .slide-r, .still .crown, .still .stamp{animation:none !important;}
  .pill.tmr{background:var(--crypt-2);color:var(--bone);font-family:var(--font-mono);box-shadow:none;animation:none;transform:none;}
  .pill.tmr.urgent{background:var(--curse);color:var(--on-accent);animation:tick 1s var(--ease-slam) infinite;}
  @keyframes tick{0%{transform:scale(1.12);}30%{transform:scale(1);}}
  .mut{margin:0 0 14px;} .mut .badge{margin-bottom:6px;} .mut p{margin:0;}
  .spam h3{font-size:16px;}
  .spam .seg button{font-size:14px;padding:9px 4px;}
  .spam .seg button.active{background:var(--c);}
  .spam-row{display:flex;gap:10px;align-items:stretch;margin-top:6px;}
  .spam-row input{flex:1;min-width:0;}
  .spam-row .btn{width:64px;flex:none;margin-top:8px;font-size:24px;padding:8px;}
  .rv-row{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px;}
  .rv-btn{width:48px;height:44px;border:0;background:var(--crypt);color:var(--bone);font-family:var(--font-punch);font-size:24px;font-weight:700;cursor:pointer;transform:skewX(var(--skew));box-shadow:4px 4px 0 #000;}
  .rv-btn:disabled{opacity:.3;box-shadow:none;cursor:not-allowed;}
  .rv-n{min-width:64px;text-align:center;color:var(--candle);font-size:22px;letter-spacing:.15em;}
  .slot.forced{filter:none;box-shadow:inset 0 0 0 2px var(--blood),3px 3px 0 #000;}
  .scr-mut{display:flex;flex-direction:column;align-items:center;gap:.3em;background:var(--hex);color:var(--on-accent);padding:.5em 1.6em;transform:rotate(-2deg);box-shadow:var(--drop-hard);}
  .scr-mut b{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:clamp(26px,3vw,58px);line-height:1;}
  .scr-mut span{font-size:clamp(14px,1.4vw,26px);font-weight:600;}
  .scr-timer{position:fixed;right:3vw;bottom:4vh;width:clamp(90px,9vw,170px);height:clamp(90px,9vw,170px);display:grid;place-items:center;z-index:3;}
  .scr-timer svg{position:absolute;inset:0;transform:rotate(-90deg);}
  .scr-timer .tr{fill:none;stroke:var(--crypt-2);stroke-width:9;}
  .scr-timer .br{fill:none;stroke:var(--candle);stroke-width:9;transition:stroke-dasharray 1s linear,stroke .2s;}
  .scr-timer span{font-family:var(--font-mono);font-weight:700;font-size:clamp(20px,2.2vw,40px);color:var(--bone);}
  .scr-timer.urgent .br{stroke:var(--curse);}
  .scr-timer.urgent span{color:var(--curse);animation:tick 1s var(--ease-slam) infinite;}
  .scr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6vh 1.6vw;width:min(92vw,1700px);}
  .scr-grid.n2,.scr-grid.n3{grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));}
  .scr-grid.n3{--cols:3;} .scr-grid.n5,.scr-grid.n6{grid-template-columns:repeat(3,minmax(0,1fr));} .scr-grid.n7,.scr-grid.n8{grid-template-columns:repeat(4,minmax(0,1fr));}
  .scr-cell{position:relative;background:var(--crypt);padding:2.2vh 1.2vw 1.6vh;font-size:clamp(14px,1.4vw,28px);line-height:1.55;font-weight:500;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));}
  .scr-cell .slot{filter:none;}
  .scr-cell .slot:not(.chg){filter:saturate(.55) brightness(.82);}
  .scr-cell.win{background:color-mix(in srgb,var(--candle) 14%,var(--crypt));box-shadow:inset 0 0 0 4px var(--candle);}
  .scr-cell.lose{opacity:.55;}
  .scr-cell .scr-crown{top:10px;transform:rotate(14deg);}
  .scr-num{position:absolute;top:0;left:1vw;font-family:var(--font-display);font-style:italic;font-weight:700;font-size:1.4em;color:var(--candle);}
  .scr-cell > .scr-num + *{margin-top:.6em;}
  .scr-cell{padding-top:3.4vh;}
  .scr-word{font-size:clamp(40px,6vw,120px);transform:rotate(-3deg);}
  .scr-word .slot{box-shadow:.08em .08em 0 #000;}
  @media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation-duration:1ms !important;animation-iteration-count:1 !important;transition-duration:1ms !important;} }

  /* ===================== ЕКРАН ДЛЯ СТРІМУ ===================== */
  body.screen-mode{overflow:hidden;}
  body.screen-mode .wrap{max-width:none;padding:0;min-height:0;}
  .scr-bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
  .scr-bg .ring{position:absolute;border-radius:50%;border:2px dashed var(--seam);animation:spin 80s linear infinite;}
  .scr-bg .ring.r1{width:120vh;height:120vh;right:-40vh;top:-30vh;}
  .scr-bg .ring.r2{width:90vh;height:90vh;right:-25vh;top:-15vh;border-style:dotted;animation-direction:reverse;animation-duration:60s;}
  .scr-bg .ring.r3{width:70vh;height:70vh;left:-30vh;bottom:-35vh;border-color:color-mix(in srgb,var(--hex) 35%,transparent);}
  .scr{position:fixed;inset:0;z-index:1;display:flex;flex-direction:column;padding:2.6vh 3vw;gap:1.4vh;}
  .scr-top{display:flex;justify-content:space-between;align-items:center;gap:2vw;}
  .scr-logo .nr-title{font-size:clamp(24px,2.6vw,48px);}
  .scr-right{display:flex;align-items:center;gap:1vw;}
  .scr-pill{font-family:var(--font-punch);font-weight:700;font-size:clamp(14px,1.4vw,26px);letter-spacing:.06em;text-transform:uppercase;background:var(--crypt-2);padding:.25em .9em;white-space:nowrap;transform:skewX(var(--skew));}
  .scr-pill b{color:var(--candle);font-family:var(--font-mono);letter-spacing:.16em;}
  .scr-gear{background:var(--crypt-2);border:0;color:var(--bone);width:2.4em;height:2.4em;font-size:clamp(14px,1.2vw,22px);cursor:pointer;transform:skewX(var(--skew));}
  .scr-main{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:0;gap:2.2vh;position:relative;}
  .scr-title{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:clamp(34px,5.4vw,104px);text-align:center;line-height:1;}
  .scr-title .hl{color:var(--curse);}
  .scr-sub{color:var(--bone-dim);font-size:clamp(15px,1.7vw,32px);text-align:center;max-width:70vw;}
  .scr-joke{background:var(--crypt);padding:3vh 2.6vw 2.4vh;font-size:clamp(18px,2.05vw,40px);line-height:1.65;font-weight:500;width:min(80vw,1400px);position:relative;
    clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px));transition:opacity .6s, transform .6s, filter .6s;}
  .scr-joke-wrap{position:relative;filter:drop-shadow(8px 8px 0 #000);transition:opacity .6s, transform .6s, filter .6s;}
  .scr-joke .slot{filter:none;box-shadow:4px 4px 0 #000;}
  .scr-joke .slot:not(.chg){filter:saturate(.55) brightness(.82);box-shadow:none;}
  .scr-label{position:absolute;top:0;left:2.2vw;z-index:2;font-family:var(--font-punch);font-weight:700;font-size:clamp(13px,1.2vw,22px);letter-spacing:.12em;background:var(--curse);color:var(--on-accent);padding:.15em .9em;transform:translateY(-55%) skewX(var(--skew)) rotate(var(--tilt-sm));}
  .scr-label.b{background:var(--ecto);}
  .scr-votes{position:absolute;top:0;right:7vw;z-index:2;font-family:var(--font-mono);font-weight:700;font-size:clamp(16px,1.6vw,30px);background:var(--candle);color:var(--on-accent);padding:.1em .7em;transform:translateY(-55%) rotate(3deg);animation:popIn .6s var(--ease-overshoot) both;animation-delay:.25s;}
  .scr-joke-wrap.win{filter:drop-shadow(8px 8px 0 #000) drop-shadow(0 0 30px rgba(255,197,49,.6));}
  .scr-joke-wrap.win .scr-joke{background:color-mix(in srgb,var(--candle) 13%,var(--crypt));box-shadow:inset 0 0 0 4px var(--candle);}
  .scr-joke-wrap.lose{opacity:.36;filter:grayscale(.75);transform:scale(.93) rotate(1deg);}
  .scr-crown{position:absolute;top:0;right:2.4vw;z-index:3;font-size:clamp(30px,3.4vw,64px);transform:translateY(-62%) rotate(14deg);animation:crownDrop var(--dur-ritual) var(--ease-overshoot) both;}
  .scr-vs{font-family:var(--font-glyph);font-size:clamp(26px,3.2vw,64px);color:var(--bone);text-shadow:4px 4px 0 var(--curse);line-height:1;transform:rotate(-6deg);}
  .scr-wait{color:var(--bone-dim);font-size:clamp(15px,1.7vw,30px);font-family:var(--font-punch);letter-spacing:.06em;text-transform:uppercase;}
  .scr-players{display:flex;flex-wrap:wrap;gap:1.2vw;justify-content:center;max-width:85vw;}
  .scr-chip{display:inline-flex;align-items:center;gap:.5em;font-family:var(--font-punch);font-weight:600;font-size:clamp(15px,1.6vw,30px);letter-spacing:.03em;background:var(--crypt-2);padding:.25em .9em .25em .3em;transform:skewX(var(--skew));animation:popIn .5s var(--ease-overshoot) both;}
  .scr-chip > *{transform:skewX(calc(var(--skew) * -1));}
  .scr-chip .av{font-size:1.1em;}
  .scr-chip.done{background:color-mix(in srgb,var(--candle) 22%,var(--crypt-2));box-shadow:inset 0 0 0 3px var(--candle);}
  .scr-lobby{display:flex;gap:5vw;align-items:center;justify-content:center;}
  .scr-codebox{text-align:center;}
  .scr-code{font-family:var(--font-mono);font-weight:700;font-size:clamp(60px,9.5vw,190px);letter-spacing:.14em;color:var(--candle);line-height:1;padding-left:.14em;animation:popIn var(--dur-ritual) var(--ease-overshoot) both;}
  .scr-url{font-size:clamp(14px,1.5vw,28px);color:var(--ecto);margin-top:1vh;font-family:var(--font-mono);}
  .scr-qr{background:var(--bone);padding:1.1vw;width:clamp(140px,16vw,300px);height:clamp(140px,16vw,300px);display:flex;align-items:center;justify-content:center;transform:rotate(2deg);box-shadow:var(--drop-hard);}
  .scr-qr img,.scr-qr canvas{width:100%!important;height:100%!important;image-rendering:pixelated;}
  .scr-lobby-players{display:flex;flex-wrap:wrap;gap:2.4vw;justify-content:center;max-width:88vw;}
  .scr-pl{display:flex;flex-direction:column;align-items:center;gap:.8vh;animation:popIn .6s var(--ease-overshoot) both;}
  .scr-pl .av{font-size:clamp(28px,3.2vw,60px);box-shadow:0 0 0 4px var(--void),0 0 0 7px var(--candle);}
  .scr-pl .nm{font-family:var(--font-punch);font-weight:700;font-size:clamp(14px,1.5vw,28px);letter-spacing:.04em;text-transform:uppercase;}
  .scr-author{display:flex;align-items:center;gap:.5em;margin-top:.7em;font-size:.6em;color:var(--bone-dim);flex-wrap:wrap;}
  .scr-author .av{font-size:1.5em;}
  .scr-author b{color:var(--bone);font-family:var(--font-punch);font-size:1.3em;letter-spacing:.04em;text-transform:uppercase;}
  .scr-author .words{display:inline-flex;align-items:center;gap:.25em;margin-left:.6em;}
  .scr-author .words .av{font-size:1em;}
  .scr-board{width:min(66vw,1100px);display:flex;flex-direction:column;gap:1vh;}
  .scr-row{display:grid;grid-template-columns:3.2em minmax(0,14em) 1fr 4.5em;align-items:center;gap:1.2vw;font-family:var(--font-punch);font-weight:600;font-size:clamp(16px,1.7vw,32px);background:var(--crypt);padding:.4em 1em;transform:skewX(var(--skew));animation:slideL .6s var(--ease-overshoot) both;}
  .scr-row > *{transform:skewX(calc(var(--skew) * -1));}
  .scr-row:first-child{background:var(--candle);color:var(--on-accent);}
  .scr-row .rk{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:1.4em;line-height:1;color:var(--bone-dim);}
  .scr-row:first-child .rk{color:var(--on-accent);}
  .scr-row .who{display:flex;align-items:center;gap:.6em;overflow:hidden;}
  .scr-row .who .av{font-size:1em;}
  .scr-row .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .scr-row .pts{font-family:var(--font-mono);font-weight:700;text-align:right;color:var(--candle);}
  .scr-row:first-child .pts{color:var(--on-accent);}
  .scr-bar{height:.5em;background:var(--curse);transform-origin:left;animation:growBar var(--dur-ritual) var(--ease-overshoot) both;}
  .scr-row:first-child .scr-bar{background:var(--void);}
  @keyframes growBar{from{transform:scaleX(0);}to{transform:scaleX(1);}}
  .scr-badge{display:inline-block;font-family:var(--font-punch);font-weight:700;font-size:clamp(15px,1.6vw,30px);letter-spacing:.08em;text-transform:uppercase;padding:.15em 1em;background:var(--bone);color:var(--on-accent);transform:skewX(var(--skew)) rotate(var(--tilt-sm));box-shadow:var(--drop-hard);animation:bannerIn var(--dur-sweep) var(--ease-overshoot) both;}
  .scr-badge.s{background:var(--hex);} .scr-badge.c{background:var(--curse);} .scr-badge.g{background:var(--candle);}
  .scr-progress{display:flex;gap:.6vw;align-items:center;font-family:var(--font-mono);font-weight:700;font-size:clamp(15px,1.5vw,28px);color:var(--bone-dim);}
  .scr-progress .pip{width:1em;height:1em;background:var(--crypt-2);transform:rotate(45deg);transition:background .3s, transform .3s var(--ease-overshoot);}
  .scr-progress .pip.on{background:var(--candle);transform:rotate(45deg) scale(1.25);}
  .scr-stamp{position:absolute;z-index:6;left:50%;top:50%;font-family:var(--font-punch);font-weight:700;text-transform:uppercase;font-size:clamp(50px,8vw,160px);line-height:1;letter-spacing:.04em;color:var(--curse);padding:.08em .4em .12em;border:.08em solid currentColor;background:color-mix(in srgb,var(--void) 55%,transparent);
    transform:translate(-50%,-50%) rotate(var(--tilt));animation:scrSlam var(--dur-hit) var(--ease-slam) both, scrStampOut .4s ease-in 1.5s forwards;pointer-events:none;}
  .scr-stamp.g{color:var(--candle);} .scr-stamp.e{color:var(--ecto);}
  @keyframes scrSlam{from{opacity:0;transform:translate(-50%,-50%) rotate(-16deg) scale(3);}to{opacity:1;transform:translate(-50%,-50%) rotate(var(--tilt)) scale(1);}}
  @keyframes scrStampOut{to{opacity:0;transform:translate(-50%,-50%) rotate(var(--tilt)) scale(1.15);}}
  .shake{animation:shake 260ms var(--ease-slam);}
  @keyframes shake{0%,100%{transform:none;}20%{transform:translate(-8px,4px);}40%{transform:translate(7px,-5px);}60%{transform:translate(-4px,3px);}80%{transform:translate(3px,-2px);}}
  /* VS-вставка */
  .scr-vsx{position:fixed;inset:0;overflow:hidden;z-index:4;}
  .scr-vsx .half{position:absolute;top:0;bottom:0;width:62%;}
  .scr-vsx .half.a{left:0;background:var(--curse);clip-path:polygon(0 0,100% 0,72% 100%,0 100%);animation:inA var(--dur-sweep) var(--ease-slam) both;}
  .scr-vsx .half.b{right:0;background:var(--ecto);clip-path:polygon(28% 0,100% 0,100% 100%,0 100%);animation:inB var(--dur-sweep) var(--ease-slam) both;animation-delay:60ms;}
  .scr-vsx .stripe{position:absolute;inset:0;background:repeating-linear-gradient(-62deg,transparent 0 2.2vw,color-mix(in srgb,var(--void) 16%,transparent) 2.2vw 2.6vw);}
  .scr-vsx .side{position:absolute;bottom:12vh;font-family:var(--font-punch);font-weight:700;font-size:clamp(30px,4.6vw,90px);text-transform:uppercase;color:var(--on-accent);line-height:.9;}
  .scr-vsx .side small{display:block;font-family:var(--font-body);font-weight:600;font-size:.32em;letter-spacing:.02em;text-transform:none;opacity:.8;margin-top:.4em;}
  .scr-vsx .side.a{left:6vw;animation:whoA var(--dur-sweep) var(--ease-overshoot) both;animation-delay:200ms;}
  .scr-vsx .side.b{right:6vw;text-align:right;animation:whoB var(--dur-sweep) var(--ease-overshoot) both;animation-delay:260ms;}
  .scr-vsx .big{position:absolute;left:50%;top:44%;font-family:var(--font-glyph);font-size:clamp(90px,16vw,320px);line-height:1;color:var(--bone);text-shadow:.04em .04em 0 var(--void),-.02em -.02em 0 var(--hex);transform:translate(-50%,-50%) rotate(-8deg);animation:vsSlam var(--dur-hit) var(--ease-slam) both;animation-delay:430ms;}
  .scr-vsx .tag{position:absolute;top:7vh;left:50%;transform:translateX(-50%) skewX(var(--skew));background:var(--void);color:var(--bone);font-family:var(--font-punch);font-weight:700;letter-spacing:.14em;font-size:clamp(16px,1.8vw,34px);padding:.3em 1.2em;white-space:nowrap;animation:fadeIn var(--dur-hit) both;animation-delay:600ms;}
  .scr-vsx .catch{position:absolute;bottom:4vh;left:50%;transform:translateX(-50%) rotate(-3deg);font-family:var(--font-display);font-style:italic;font-weight:700;font-size:clamp(26px,3.4vw,66px);color:var(--void);background:var(--bone);padding:0 .5em;animation:popIn var(--dur-sweep) var(--ease-overshoot) both;animation-delay:760ms;}
  .scr-vsx .flash{position:absolute;inset:0;background:var(--bone);opacity:0;animation:flash 380ms ease-out both;animation-delay:430ms;}
  @keyframes inA{from{transform:translateX(-105%);}to{transform:none;}}
  @keyframes inB{from{transform:translateX(105%);}to{transform:none;}}
  @keyframes whoA{from{opacity:0;transform:translateX(-20vw) rotate(-6deg);}to{opacity:1;transform:none;}}
  @keyframes whoB{from{opacity:0;transform:translateX(20vw) rotate(6deg);}to{opacity:1;transform:none;}}
  @keyframes vsSlam{from{opacity:0;transform:translate(-50%,-50%) rotate(-30deg) scale(3);}to{opacity:1;transform:translate(-50%,-50%) rotate(-8deg) scale(1);}}
  @keyframes flash{0%{opacity:.85;}100%{opacity:0;}}
  @keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
  .scr-star{display:flex;flex-direction:column;align-items:center;gap:1.4vh;}
  .scr-star .av{font-size:clamp(50px,6.5vw,124px);box-shadow:0 0 0 6px var(--void),0 0 0 10px var(--candle),0 0 60px rgba(255,197,49,.5);}
  #confetti{position:fixed;inset:0;z-index:8;pointer-events:none;}
  .scr-overlay{position:fixed;inset:0;z-index:10;background:color-mix(in srgb,var(--void) 86%,transparent);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
  .scr-panel{background:var(--crypt);padding:30px;width:min(560px,92vw);max-height:90vh;overflow:auto;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));}
  .scr-panel h2{margin-bottom:8px;}
  .scr-panel .row2{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0;}
  .scr-panel input[type=range]{width:55%;margin:0;padding:0;border:0;background:transparent;accent-color:var(--candle);}
  .toggle{width:56px;height:30px;background:var(--crypt-2);border:0;position:relative;cursor:pointer;flex:none;transform:skewX(var(--skew));}
  .toggle::after{content:'';position:absolute;top:4px;left:5px;width:20px;height:22px;background:var(--bone-dim);transition:left var(--dur-snap) var(--ease-overshoot);}
  .toggle.on{background:var(--candle);}
  .toggle.on::after{left:31px;background:var(--void);}
  .scr-start{text-align:center;}
  .scr-start .btn{font-size:24px;padding:18px 44px;width:auto;display:inline-flex;}

/* ===================== МЕНЮ ПАКУ: вибір гри ===================== */
.game-pick{display:flex;flex-direction:column;gap:8px;}
.gp{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;background:var(--crypt-2);color:var(--bone);padding:10px 14px;cursor:pointer;transform:skewX(var(--skew));box-shadow:inset 0 0 0 2px var(--seam);transition:box-shadow var(--dur-snap),background var(--dur-snap);font:inherit;}
.gp > *{transform:skewX(calc(var(--skew) * -1));}
.gp.active{background:color-mix(in srgb,var(--curse) 18%,var(--crypt-2));box-shadow:inset 0 0 0 3px var(--curse),5px 5px 0 #000;}
.gp.soon{opacity:.45;cursor:not-allowed;}
.gp-e{font-size:28px;line-height:1;flex:none;}
.gp-t{display:flex;flex-direction:column;gap:2px;min-width:0;}
.gp-t b{font-family:var(--font-punch);font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.gp-t small{color:var(--bone-dim);font-size:13px;}
.game-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--seam);}
.game-row:first-of-type{border-top:0;}
.game-row.soon{opacity:.6;}
.game-row b{font-family:var(--font-punch);letter-spacing:.04em;text-transform:uppercase;}