:root{
  --bg:#070b14;--bg2:#0b1220;--surface:rgba(15,23,42,.72);--surface-strong:rgba(18,28,48,.9);
  --border:rgba(148,163,184,.14);--border-strong:rgba(148,163,184,.24);
  --text:#f8fafc;--muted:#93a4ba;--accent:#58c7f7;--accent2:#8b8cf7;
  --success:#34d399;--warning:#fbbf24;--danger:#fb4d5d;--gold:#f6c85f;
  --r-sm:12px;--r-md:18px;--r-lg:28px;--shadow:0 24px 70px rgba(0,0,0,.36);
}
html{background:var(--bg)}
body{background:linear-gradient(145deg,#070b14 0%,#0b1220 55%,#080d18 100%)!important;color:var(--text);position:relative;isolation:isolate}
body:before,body:after{content:"";position:fixed;border-radius:999px;filter:blur(80px);opacity:.22;z-index:-3;pointer-events:none;animation:premiumFloat 18s ease-in-out infinite alternate}
body:before{width:34vw;height:34vw;min-width:320px;min-height:320px;left:-10vw;top:-12vw;background:#3b82f6}
body:after{width:28vw;height:28vw;min-width:260px;min-height:260px;right:-8vw;bottom:-12vw;background:#7c3aed;animation-duration:23s;animation-direction:alternate-reverse}
@keyframes premiumFloat{0%{transform:translate3d(0,0,0) scale(.95)}50%{transform:translate3d(6vw,4vh,0) scale(1.08)}100%{transform:translate3d(-2vw,10vh,0) scale(1)}}
body>*{position:relative;z-index:1}
button,a,input,select,textarea{font-family:inherit}
button,.btn,.btn-action,.control-btn,.launch-btn,.btn-start-game{transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,opacity .18s ease!important}
button:hover,.btn:hover,.btn-action:hover,.control-btn:hover,.launch-btn:hover,.btn-start-game:hover{transform:translateY(-2px)}
button:active,.btn:active,.btn-action:active,.control-btn:active{transform:translateY(0) scale(.98)}
input,select,textarea,.form-control,.input-field{background:rgba(7,12,23,.72)!important;border:1px solid var(--border)!important;color:var(--text)!important;border-radius:14px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important}
input:focus,select:focus,textarea:focus,.form-control:focus,.input-field:focus{border-color:rgba(88,199,247,.7)!important;box-shadow:0 0 0 4px rgba(88,199,247,.1)!important;outline:none!important}
.hidden{display:none!important}
.toast{background:rgba(10,15,27,.88)!important;border:1px solid var(--border)!important;backdrop-filter:blur(18px)!important;box-shadow:var(--shadow)!important}

/* host screen */
#screen-lobby{max-width:1180px!important;margin:auto!important;padding:48px!important;background:rgba(10,16,29,.48)!important;border:1px solid var(--border)!important;border-radius:36px!important;backdrop-filter:blur(24px)!important;box-shadow:var(--shadow)!important}
#screen-lobby .logo-area{margin-bottom:14px!important}
.room-code-huge{font-size:clamp(64px,9vw,132px)!important;line-height:.95!important;letter-spacing:.07em!important;text-shadow:none!important;filter:drop-shadow(0 12px 40px rgba(88,199,247,.16))}
.qr-wrapper,.qr-container{border-radius:24px!important;box-shadow:0 18px 55px rgba(0,0,0,.28)!important}
.host-players-grid{gap:12px!important}
.host-player-card,.player-card{background:rgba(16,25,43,.7)!important;border:1px solid var(--border)!important;border-radius:16px!important;box-shadow:none!important}
.btn-start-game{background:var(--accent)!important;color:#06111a!important;border:none!important;border-radius:16px!important;box-shadow:0 16px 40px rgba(88,199,247,.18)!important}
#screen-game .game-layout{gap:18px!important}
.game-main,.game-sidebar{background:rgba(10,16,29,.54)!important;border:1px solid var(--border)!important;border-radius:28px!important;backdrop-filter:blur(22px)!important;box-shadow:var(--shadow)!important}
.host-header{position:relative!important;display:grid!important;grid-template-columns:minmax(130px,1fr) auto minmax(130px,1fr)!important;grid-template-rows:auto auto!important;align-items:center!important;gap:8px 24px!important;padding:10px 4px 22px!important;border-bottom:1px solid var(--border)!important}
.host-header .header-left{grid-column:1!important;grid-row:1!important;display:block!important;justify-self:start!important}
.host-header .header-left .meta-box:first-child{position:absolute!important;left:50%!important;top:86px!important;transform:translateX(-50%)!important;min-width:auto!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
.host-header .header-left .meta-box:first-child .meta-label{display:none!important}
.host-header .header-left .meta-box:first-child .meta-value{font-size:11px!important;letter-spacing:.2em!important;text-transform:uppercase!important;color:var(--muted)!important;white-space:nowrap!important}
.host-header .header-left .meta-box:nth-child(2){min-width:auto!important;padding:8px 12px!important;background:rgba(255,255,255,.035)!important;border:1px solid var(--border)!important;border-radius:12px!important}
.host-header>.meta-box{grid-column:3!important;grid-row:1!important;justify-self:end!important;min-width:auto!important;padding:8px 12px!important;background:rgba(255,255,255,.035)!important;border:1px solid var(--border)!important;border-radius:12px!important}
.meta-label{font-size:9px!important;letter-spacing:.18em!important;color:var(--muted)!important}
.meta-value{font-size:17px!important;color:var(--text)!important;text-shadow:none!important}
.main-timer{grid-column:2!important;grid-row:1!important;width:112px!important;height:112px!important;display:grid!important;place-items:center!important;border-radius:999px!important;font-size:60px!important;line-height:1!important;background:radial-gradient(circle,rgba(15,23,42,.96),rgba(9,14,25,.82))!important;border:1px solid rgba(88,199,247,.35)!important;box-shadow:0 0 0 8px rgba(88,199,247,.045),0 18px 55px rgba(0,0,0,.35)!important;color:#fff!important;text-shadow:none!important;position:relative!important}
.main-timer:before{content:"";position:absolute;inset:-8px;border-radius:inherit;border:2px solid rgba(88,199,247,.18)}
.main-timer.timer-danger,.main-timer.danger,.main-timer.urgent{color:#fff!important;background:radial-gradient(circle,rgba(127,29,29,.92),rgba(43,8,14,.94))!important;border-color:rgba(251,77,93,.86)!important;box-shadow:0 0 0 8px rgba(251,77,93,.08),0 0 48px rgba(251,77,93,.38)!important;animation:dangerPulse .72s ease-in-out infinite!important}
@keyframes dangerPulse{50%{transform:scale(1.07);box-shadow:0 0 0 12px rgba(251,77,93,.04),0 0 72px rgba(251,77,93,.58)}}
.question-title,#questionText,.question-text{font-size:clamp(28px,3vw,48px)!important;line-height:1.12!important;letter-spacing:-.025em!important;max-width:1050px!important;margin-left:auto!important;margin-right:auto!important}
.question-media-wrapper{border:1px solid var(--border)!important;border-radius:22px!important;box-shadow:0 20px 60px rgba(0,0,0,.25)!important;overflow:hidden!important}
.option-card,.trivia-option,.meme-opt-card{background:rgba(17,27,46,.78)!important;border:1px solid var(--border)!important;border-radius:18px!important;box-shadow:none!important}
.option-card:hover,.trivia-option:hover,.meme-opt-card:hover{border-color:var(--border-strong)!important;background:rgba(23,36,60,.88)!important}
.lb-item{background:rgba(17,27,46,.58)!important;border:1px solid var(--border)!important;border-radius:14px!important}
.lb-item.top1{border-color:rgba(246,200,95,.5)!important;background:linear-gradient(90deg,rgba(246,200,95,.11),rgba(17,27,46,.6))!important}

/* player */
.game-card{background:rgba(10,16,29,.7)!important;border:1px solid var(--border)!important;border-radius:28px!important;backdrop-filter:blur(24px)!important;box-shadow:var(--shadow)!important}
.logo,h1{letter-spacing:-.035em}
.avatar-option{background:rgba(255,255,255,.035)!important;border:1px solid var(--border)!important;border-radius:14px!important}
.avatar-option.selected{border-color:var(--accent)!important;background:rgba(88,199,247,.11)!important;box-shadow:0 0 0 4px rgba(88,199,247,.07)!important}
.btn-action{background:var(--accent)!important;color:#06111a!important;border-radius:15px!important;box-shadow:0 14px 34px rgba(88,199,247,.16)!important}
.player-stats{background:rgba(255,255,255,.025)!important;border:1px solid var(--border)!important;border-radius:16px!important}
.phone-opt-btn{border-radius:18px!important;border:1px solid rgba(255,255,255,.13)!important;box-shadow:0 12px 30px rgba(0,0,0,.18)!important}
.chat-container{background:rgba(8,14,25,.52)!important;border:1px solid var(--border)!important;border-radius:18px!important}

/* cabinet / admin / control */
.cabinet,.admin-panel,.control-container,.host-container{background:rgba(10,16,29,.68)!important;border:1px solid var(--border)!important;border-radius:28px!important;backdrop-filter:blur(24px)!important;box-shadow:var(--shadow)!important}
.pack-item,.script-panel,.players-status,.panel,.card{background:rgba(17,27,46,.58)!important;border:1px solid var(--border)!important;border-radius:16px!important}
.logout-btn{width:auto!important;margin-top:0!important;padding:9px 14px!important}

@media(max-width:760px){
  body{padding:14px!important}
  #screen-lobby{padding:26px 18px!important;border-radius:26px!important}
  .host-header{grid-template-columns:1fr auto 1fr!important;gap:6px 10px!important}
  .main-timer{width:88px!important;height:88px!important;font-size:46px!important}
  .host-header .header-left .meta-box:first-child{top:72px!important}
  .meta-value{font-size:14px!important}
  .meta-label{font-size:8px!important}
  .game-main,.game-sidebar,.game-card,.cabinet{border-radius:22px!important}
}
@media(prefers-reduced-motion:reduce){body:before,body:after,.main-timer{animation:none!important}}

/* v8: larger central timer */
#screen-game .main-timer,
.host-header > .main-timer{
  width:132px!important;
  height:132px!important;
  min-width:132px!important;
  font-size:68px!important;
}
.host-header .header-left .meta-box:first-child{top:102px!important}
@media(max-width:760px){
  #screen-game .main-timer,.host-header > .main-timer{width:100px!important;height:100px!important;min-width:100px!important;font-size:52px!important}
  .host-header .header-left .meta-box:first-child{top:82px!important}
}

/* v9: typography and color system */
:root{
  --font-ui:Inter,Manrope,Onest,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Strelka Ultra",Inter,system-ui,sans-serif;
  --font-mono:"SFMono-Regular","Cascadia Mono","Roboto Mono",Consolas,monospace;
  --color-bg:#070b14;
  --color-bg-2:#0b1220;
  --color-surface:rgba(15,23,42,.72);
  --color-surface-strong:rgba(18,28,48,.9);
  --color-border:rgba(148,163,184,.14);
  --color-text:#f8fafc;
  --color-muted:#93a4ba;
  --color-primary:#58c7f7;
  --color-secondary:#8b8cf7;
  --color-success:#34d399;
  --color-warning:#fbbf24;
  --color-danger:#ef4444;
  --color-winner:#f6c85f;
  --accent-color:var(--color-primary);
}

.display,.brand,.logo,.pack-name,.room-code-huge,.prompt-title,.question-title,#questionText,.question-text,
#textRoundTitle,.final-stage-header h1,.podium-score,.main-timer,.mock-timer,.all-answered-label,.all-answered-count{
  font-family:var(--font-display)!important;
}
#headerRoomCode,.room-code-huge,.meta-value.code,.room-code,.join-code{font-family:var(--font-display)!important}

body{
  background:linear-gradient(145deg,var(--color-bg) 0%,var(--color-bg-2) 58%,#080d18 100%)!important;
  color:var(--color-text)!important;
}
.meta-label,.section-intro,.feature p,.chat-message,.qr-label,.timer-caption{color:var(--color-muted)!important}
a.primary,.primary,.btn-action,.btn-start-game,.launch-btn,.control-btn.primary{
  background:var(--color-primary)!important;
  color:#06111a!important;
  border-color:transparent!important;
  box-shadow:0 12px 28px rgba(88,199,247,.16)!important;
}
.secondary,.ghost,.control-btn{
  background:rgba(255,255,255,.035)!important;
  color:var(--color-text)!important;
  border:1px solid var(--color-border)!important;
  box-shadow:none!important;
}
.success,.correct-ans,.toast.join{border-color:rgba(52,211,153,.42)!important}
.warning,.toast.round_start{border-color:rgba(251,191,36,.42)!important}
.danger,.wrong-ans,.toast.leave{border-color:rgba(239,68,68,.42)!important}
.winner,.podium-card.place-1,.lb-card.top1{
  border-color:rgba(246,200,95,.52)!important;
  box-shadow:0 18px 54px rgba(246,200,95,.08)!important;
}

.room-code-huge,#textRoundTitle,.hero h1 span{
  background:linear-gradient(135deg,#fff 12%,var(--color-primary) 62%,var(--color-secondary) 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}
.btn-start-game,.btn-action,.launch-btn,.control-btn,.primary{
  background-image:none!important;
}

/* Timer: digits only, no circular background */
.host-header > .main-timer-shell{
  width:clamp(76px,7vw,108px)!important;
  height:auto!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  animation:timerNumberFloat 2s ease-in-out infinite!important;
}
.main-timer-shell .timer-svg{display:none!important}
.main-timer-shell .timer-core{
  width:auto!important;
  height:auto!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  animation:none!important;
}
#screen-game .main-timer-shell .main-timer,
.host-header > .main-timer-shell .main-timer{
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  display:block!important;
  place-items:normal!important;
  font-size:clamp(48px,5.2vw,78px)!important;
  line-height:.86!important;
  color:var(--color-primary)!important;
  text-shadow:0 0 18px rgba(88,199,247,.34),0 8px 28px rgba(0,0,0,.35)!important;
}
.main-timer-shell .timer-caption{display:none!important}
.main-timer-shell.critical{animation:timerNumberCritical .5s ease-in-out infinite alternate!important}
.main-timer-shell.critical .main-timer{color:var(--color-danger)!important;text-shadow:0 0 22px rgba(239,68,68,.45)!important}
.main-timer-shell.warning .main-timer{color:var(--color-warning)!important;text-shadow:0 0 20px rgba(251,191,36,.35)!important}
@keyframes timerNumberFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.035)}}
@keyframes timerNumberCritical{from{transform:scale(1)}to{transform:scale(1.12)}}

@media(max-width:760px){
#screen-game .main-timer-shell .main-timer,.host-header > .main-timer-shell .main-timer{font-size:clamp(42px,13vw,62px)!important}
}

/* v10: no timer frame, no helper line under question */
.main-timer::before,.main-timer::after,
.host-header > .main-timer-shell::before,.host-header > .main-timer-shell::after,
.main-timer-shell .timer-core::before,.main-timer-shell .timer-core::after{
  display:none!important;
  content:none!important;
}
.host-footer,#footerStatus{
  display:none!important;
}
.host-header .header-left .meta-box:first-child{
  display:none!important;
}

/* v11: premium show layer */
#screen-lobby{
  position:relative!important;
  overflow:hidden!important;
  min-height:min(760px,calc(100vh - 56px))!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:20px!important;
  text-align:center!important;
}
#screen-lobby.hidden,
#screen-video.hidden,
#screen-game.hidden,
#screen-gameover.hidden,
.lobby-container.hidden,
.video-container.hidden{
  display:none!important;
}
#screen-lobby::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,rgba(88,199,247,.10),transparent 34%,rgba(139,140,247,.08));
  opacity:.72;
}
#screen-lobby .logo-area,#screen-lobby>div:not(#qrContainer):not(.host-players-grid),#screen-lobby .room-code-huge{
  position:relative;
  z-index:1;
}
#screen-lobby .logo-area{
  margin:0!important;
}
#screen-lobby .room-code-huge{
  margin:4px 0 6px!important;
  max-width:100%!important;
  font-size:clamp(72px,14vw,150px)!important;
  letter-spacing:.04em!important;
  line-height:.82!important;
  white-space:nowrap!important;
}
#qrContainer{
  position:relative!important;
  z-index:1!important;
  width:min(330px,82vw)!important;
  padding:18px!important;
  border-radius:28px!important;
  background:rgba(5,10,20,.56)!important;
  border:1px solid rgba(148,163,184,.18)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.34)!important;
}
#qrImage{
  width:min(270px,100%)!important;
  height:auto!important;
  margin:auto!important;
  display:block!important;
  border-radius:18px!important;
}
.host-players-grid{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  width:min(760px,100%)!important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;
}
.host-player-card{
  min-height:54px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  font-family:var(--font-display)!important;
  animation:premiumCardIn .34s cubic-bezier(.2,.8,.2,1) both!important;
}
#btnStartGame{
  position:relative!important;
  z-index:1!important;
  min-width:260px!important;
}
.pipli-lobby-status{
  position:relative;
  z-index:1;
  margin:0;
  color:var(--color-muted);
  font:700 12px/1 var(--font-ui);
  letter-spacing:.08em;
  text-transform:uppercase;
}
#screen-video{
  position:relative!important;
  overflow:hidden!important;
  min-height:min(720px,calc(100vh - 80px))!important;
  border:1px solid rgba(148,163,184,.16)!important;
  border-radius:36px!important;
  background:rgba(8,14,25,.68)!important;
  backdrop-filter:blur(24px)!important;
  box-shadow:var(--shadow)!important;
}
#screen-video::before{
  content:"Новый раунд";
  display:block;
  margin-bottom:18px;
  color:var(--color-primary);
  font:800 13px/1 var(--font-display);
  letter-spacing:.16em;
  text-transform:uppercase;
}
#textRoundTitle{
  animation:premiumTitleIn .72s cubic-bezier(.2,.8,.2,1) both!important;
}
#introVideo{
  max-width:min(960px,82vw)!important;
  max-height:54vh!important;
  border-radius:28px!important;
  border:1px solid rgba(148,163,184,.18)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.42)!important;
  overflow:hidden!important;
}
.question-media-wrapper{
  position:relative!important;
  background:rgba(5,10,20,.42)!important;
}
.question-media-wrapper::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -80px 90px rgba(5,10,20,.16);
}
.trivia-opt-card,.option-card,.trivia-option,.meme-opt-card{
  font-family:var(--font-display)!important;
  transform-origin:center!important;
  animation:premiumCardIn .38s cubic-bezier(.2,.8,.2,1) both!important;
}
.trivia-opt-card .opt-num{
  background:rgba(88,199,247,.16)!important;
  color:var(--color-primary)!important;
  border:1px solid rgba(88,199,247,.22)!important;
}
.correct-ans{
  background:linear-gradient(135deg,rgba(52,211,153,.24),rgba(17,27,46,.82))!important;
  box-shadow:0 0 0 1px rgba(52,211,153,.38),0 24px 70px rgba(52,211,153,.12)!important;
}
.wrong-ans{
  opacity:.42!important;
  filter:saturate(.6)!important;
}
.pipli-result-banner{
  position:fixed;
  z-index:80;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(760px,calc(100vw - 44px));
  padding:26px;
  border-radius:30px;
  background:rgba(8,14,25,.86);
  border:1px solid rgba(148,163,184,.18);
  box-shadow:0 34px 110px rgba(0,0,0,.55);
  backdrop-filter:blur(28px);
  text-align:center;
  animation:premiumPop .52s cubic-bezier(.2,.8,.2,1) both;
}
.game-main .pipli-result-banner,
.pipli-result-banner.in-game-main{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:min(720px,calc(100% - 44px))!important;
  transform:translate(-50%,-50%)!important;
}
.pipli-result-banner h3{
  margin:0 0 8px;
  color:var(--color-primary);
  font:clamp(30px,4vw,54px)/1 var(--font-display);
}
.pipli-result-banner p{
  margin:0;
  color:var(--color-muted);
  font:700 16px/1.35 var(--font-ui);
}
.pipli-result-banner.success h3{color:var(--color-success)}
.pipli-result-banner.winner h3{color:var(--color-winner)}
.pipli-feedback-toggle{
  position:fixed;
  z-index:120;
  right:16px;
  bottom:16px;
  display:flex;
  gap:8px;
  padding:8px;
  border-radius:18px;
  background:rgba(8,14,25,.76);
  border:1px solid rgba(148,163,184,.18);
  backdrop-filter:blur(18px);
  box-shadow:0 18px 50px rgba(0,0,0,.34);
}
.pipli-feedback-toggle button{
  width:40px;
  height:40px;
  padding:0!important;
  border-radius:13px!important;
  display:grid;
  place-items:center;
  font:800 15px/1 var(--font-ui)!important;
  color:#dbeafe!important;
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(148,163,184,.16)!important;
}
.pipli-feedback-toggle svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.pipli-feedback-toggle #pipliSoundToggle:not(.is-off) .sound-wave,
.pipli-feedback-toggle #pipliHapticToggle:not(.is-off) .vibe-wave{
  animation:feedbackIconPulse 1.4s ease-in-out infinite;
}
.pipli-feedback-toggle button.is-off{
  opacity:.45;
}
.pipli-feedback-toggle button.is-off .sound-wave,
.pipli-feedback-toggle button.is-off .vibe-wave{
  opacity:.28;
}
.game-cover{
  position:relative!important;
  overflow:hidden!important;
  min-height:150px!important;
  border-radius:22px!important;
  background:linear-gradient(135deg,rgba(88,199,247,.22),rgba(139,140,247,.12),rgba(5,10,20,.86))!important;
  border:1px solid rgba(148,163,184,.16)!important;
}
.game-cover img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.82;
}
.game-cover::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(5,10,20,.04),rgba(5,10,20,.62));
}
.game-cover-badge{
  position:relative!important;
  z-index:1!important;
}
.game-title{
  font-family:var(--font-display)!important;
}
#screen-gameplay{
  min-height:min(720px,calc(100vh - 28px))!important;
}
#gameplayBadge{
  color:var(--color-primary)!important;
}
#gameplayTitle{
  font-family:var(--font-display)!important;
  font-size:22px!important;
}
.player-stats .value{
  font-family:var(--font-display)!important;
  color:var(--color-primary)!important;
}
.phone-trivia-grid{
  gap:12px!important;
}
.phone-opt-btn{
  min-height:64px!important;
  text-align:left!important;
  font-family:var(--font-display)!important;
  color:#f8fafc!important;
  background:linear-gradient(135deg,rgba(17,27,46,.96),rgba(28,44,72,.9))!important;
}
.phone-opt-btn::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:10px;
  border-radius:999px;
  background:var(--color-primary);
  box-shadow:0 0 18px rgba(88,199,247,.45);
}
.answer-state{
  padding:24px 16px;
  text-align:center;
  border:1px solid rgba(88,199,247,.18);
  border-radius:24px;
  background:rgba(88,199,247,.06);
}
.answer-state h3{
  margin:0 0 8px;
  font:28px/1 var(--font-display);
  color:var(--color-primary);
}
@keyframes premiumCardIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes premiumTitleIn{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@keyframes premiumPop{from{opacity:0;transform:translate(-50%,-46%) scale(.94)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes feedbackIconPulse{0%,100%{opacity:.72;transform:translateX(0)}50%{opacity:1;transform:translateX(1px)}}
@media(max-width:900px){
  #screen-lobby{
    min-height:auto!important;
    padding:30px 18px!important;
  }
  #screen-lobby .room-code-huge{font-size:clamp(58px,18vw,104px)!important}
}

/* v12: cabinet cards, loading states, event lobby */
.auth-card,.app,.content,.section-card,.game-card,#screen-lobby,#screen-video,#screen-game,#screen-gameover{
  animation:premiumPageIn .48s cubic-bezier(.2,.8,.2,1) both;
}
.screen-enter{
  animation:screenEnter .5s cubic-bezier(.2,.8,.2,1) both!important;
}
#screen-login.game-card,
#screen-gameplay.game-card{
  animation:playerPanelIn .28s ease-out both!important;
  transform:none!important;
  will-change:opacity;
}
#screen-login.game-card::before,
#screen-login.game-card::after,
#screen-gameplay.game-card::before,
#screen-gameplay.game-card::after{
  display:none!important;
  content:none!important;
}
.game-card{
  isolation:isolate;
}
.game-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.08) 42%,transparent 64%);
  transform:translateX(-120%);
  transition:transform .7s ease;
}
.game-card:hover::after{
  transform:translateX(120%);
}
.game-cover{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 48px rgba(0,0,0,.22)!important;
}
.game-cover-badge,.game-status,.meta-chip{
  backdrop-filter:blur(12px);
}
.status-msg{
  transition:color .2s ease,border-color .2s ease,background .2s ease;
}
.status-msg:not(:empty){
  animation:statusGlow 1.8s ease-in-out infinite;
}
.btn.is-loading{
  gap:10px!important;
}
#screen-lobby{
  width:min(1280px,calc(100% - 44px))!important;
  min-height:min(820px,calc(100vh - 44px))!important;
  margin:auto!important;
  padding:56px!important;
  display:grid!important;
  grid-template-columns:minmax(360px,.92fr) minmax(340px,.78fr)!important;
  grid-template-areas:
    "brand qr"
    "code qr"
    "status qr"
    "players qr"
    "start qr"!important;
  align-items:center!important;
  justify-items:center!important;
  gap:26px 42px!important;
  border-radius:44px!important;
  background:
    radial-gradient(circle at 14% 18%,rgba(88,199,247,.20),transparent 34%),
    radial-gradient(circle at 86% 84%,rgba(139,140,247,.22),transparent 34%),
    linear-gradient(145deg,rgba(8,14,25,.78),rgba(12,20,36,.62))!important;
  border:1px solid rgba(148,163,184,.18)!important;
  box-shadow:0 46px 130px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
#screen-lobby::before{
  background:
    linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px),
    linear-gradient(120deg,rgba(88,199,247,.12),transparent 38%,rgba(139,140,247,.10))!important;
  background-size:42px 42px,42px 42px,auto!important;
  opacity:.78!important;
}
#screen-lobby .logo-area{
  grid-area:brand;
  align-self:end!important;
  justify-self:start!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:10px!important;
  width:100%!important;
}
#screen-lobby .logo-area::before{
  display:none!important;
  content:none!important;
}
#screen-lobby .pack-name{
  font-size:clamp(30px,4vw,52px)!important;
  line-height:.92!important;
  text-align:left!important;
}
#screen-lobby>div[style*="РЕЖИМ"],
#screen-lobby>div[style*="letter-spacing"]{
  grid-area:brand;
  align-self:end!important;
  justify-self:start!important;
  margin:0 0 -18px!important;
  color:#a8b8ff!important;
  transform:translateY(10px);
}
#screen-lobby .room-code-huge{
  grid-area:code;
  position:relative!important;
  justify-self:start!important;
  width:100%!important;
  margin:38px 0 0!important;
  font-size:clamp(62px,7.4vw,104px)!important;
  letter-spacing:0!important;
  text-align:left!important;
  white-space:nowrap!important;
  max-width:min(100%,540px)!important;
  overflow:visible!important;
  filter:drop-shadow(0 22px 54px rgba(88,199,247,.28))!important;
  animation:roomCodeGlow 2.4s ease-in-out infinite!important;
}
#screen-lobby .room-code-huge::before{
  content:"Код комнаты";
  position:absolute;
  left:2px;
  top:-30px;
  color:#9fb0c5;
  font:900 12px/1 var(--font-ui);
  letter-spacing:.18em;
  text-transform:uppercase;
  -webkit-text-fill-color:#9fb0c5;
  background:none;
  filter:none;
  text-shadow:none;
}
#qrContainer{
  grid-area:qr;
  align-self:center!important;
  justify-self:center!important;
  width:min(390px,100%)!important;
  padding:22px!important;
  border-radius:34px!important;
  background:linear-gradient(145deg,rgba(5,10,20,.82),rgba(17,27,46,.62))!important;
  border:1px solid rgba(88,199,247,.18)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
#qrImage{
  width:min(320px,100%)!important;
  border-radius:22px!important;
  padding:10px!important;
}
.qr-label{
  color:#c6d7eb!important;
  font:800 13px/1.2 var(--font-ui)!important;
}
.pipli-lobby-status{
  grid-area:status;
  justify-self:start;
  margin:0 0 -6px!important;
  padding:10px 13px;
  border-radius:999px;
  background:rgba(88,199,247,.08);
  border:1px solid rgba(88,199,247,.18);
  color:#bfeaff!important;
}
.host-players-grid{
  grid-area:players;
  align-self:start!important;
  margin-top:0!important;
  width:100%!important;
  max-width:none!important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;
  gap:14px!important;
}
.host-player-card{
  min-height:68px!important;
  justify-content:flex-start!important;
  padding:13px 15px!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,rgba(17,27,46,.82),rgba(28,44,72,.64))!important;
  border:1px solid rgba(148,163,184,.16)!important;
  box-shadow:0 18px 48px rgba(0,0,0,.22)!important;
  animation:lobbyCardIn .44s cubic-bezier(.2,.8,.2,1) both!important;
  animation-delay:calc(var(--i,0) * 45ms)!important;
}
.host-player-card.is-new{
  border-color:rgba(52,211,153,.48)!important;
  box-shadow:0 0 0 1px rgba(52,211,153,.16),0 22px 58px rgba(52,211,153,.12)!important;
  animation:lobbyNewPlayer .78s cubic-bezier(.2,.8,.2,1) both!important;
}
.lobby-avatar{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(88,199,247,.12);
  border:1px solid rgba(88,199,247,.18);
}
#btnStartGame{
  grid-area:start;
  min-width:min(360px,100%)!important;
  min-height:62px!important;
  border-radius:20px!important;
  text-transform:uppercase!important;
  letter-spacing:.06em!important;
  animation:startButtonPulse 2.4s ease-in-out infinite!important;
}
#btnStartGame:disabled{
  opacity:.45!important;
  filter:saturate(.4)!important;
  animation:none!important;
}
@keyframes premiumPageIn{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
@keyframes playerPanelIn{from{opacity:0}to{opacity:1}}
@keyframes screenEnter{from{opacity:0;transform:translateY(18px) scale(.985);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes roomCodeGlow{0%,100%{filter:drop-shadow(0 16px 34px rgba(88,199,247,.22)) drop-shadow(0 0 0 rgba(139,140,247,0))}50%{filter:drop-shadow(0 22px 54px rgba(88,199,247,.45)) drop-shadow(0 0 28px rgba(139,140,247,.32))}}
@keyframes statusGlow{50%{border-color:rgba(88,199,247,.24);background:rgba(88,199,247,.045)}}
@keyframes lobbyCardIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
@keyframes lobbyNewPlayer{0%{opacity:0;transform:translateY(22px) scale(.92)}55%{opacity:1;transform:translateY(-4px) scale(1.035)}100%{transform:none}}
@keyframes startButtonPulse{50%{box-shadow:0 0 0 8px rgba(88,199,247,.06),0 24px 58px rgba(88,199,247,.22)!important}}
@media(max-width:900px){
  #screen-lobby{
    width:calc(100% - 24px)!important;
    padding:28px 18px!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"brand" "code" "qr" "status" "players" "start"!important;
    border-radius:30px!important;
  }
  #screen-lobby .logo-area,#screen-lobby .room-code-huge,#screen-lobby>div[style*="РЕЖИМ"],#screen-lobby>div[style*="letter-spacing"]{
    justify-self:center!important;
    text-align:center!important;
    align-items:center!important;
  }
  #screen-lobby>div[style*="РЕЖИМ"],#screen-lobby>div[style*="letter-spacing"]{margin-top:78px!important}
  #screen-lobby .room-code-huge{font-size:clamp(68px,20vw,124px)!important;text-align:center!important}
  .host-players-grid{grid-template-columns:1fr 1fr!important;margin-top:36px!important}
}
@media(max-width:560px){
  .host-players-grid{grid-template-columns:1fr!important}
  #qrContainer{width:100%!important}
}

/* v13: brighter live game stage */
#screen-game .game-layout{
  gap:20px!important;
}
#screen-game .game-main,
#screen-game .game-sidebar{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 18% 16%,rgba(88,199,247,.18),transparent 34%),
    radial-gradient(circle at 78% 76%,rgba(139,140,247,.18),transparent 36%),
    linear-gradient(145deg,rgba(9,17,32,.86),rgba(8,13,25,.92))!important;
  border-color:rgba(88,199,247,.20)!important;
  box-shadow:0 34px 110px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.055)!important;
}
#screen-game .game-main::before,
#screen-game .game-sidebar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 92%);
}
#screen-game .game-main > *,
#screen-game .game-sidebar > *{
  position:relative;
  z-index:1;
}
#screen-game .host-header{
  border-bottom-color:rgba(88,199,247,.18)!important;
}
#screen-game .meta-box,
#screen-game .host-header .header-left .meta-box:nth-child(2),
#screen-game .host-header > .meta-box{
  background:linear-gradient(135deg,rgba(17,31,54,.88),rgba(13,22,39,.72))!important;
  border-color:rgba(88,199,247,.20)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.05)!important;
}
#screen-game .main-timer-shell .timer-core,
#screen-game .main-timer,
.host-header > .main-timer-shell .timer-core{
  background:radial-gradient(circle at 50% 38%,rgba(88,199,247,.18),rgba(8,14,25,.92) 68%)!important;
  border-color:rgba(88,199,247,.36)!important;
  box-shadow:0 0 0 8px rgba(88,199,247,.055),0 22px 58px rgba(88,199,247,.14),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
#screen-game .main-timer{
  color:#58c7f7!important;
  text-shadow:0 0 22px rgba(88,199,247,.50)!important;
  animation:gameTimerGlow 2s ease-in-out infinite!important;
}
#screen-game .main-timer-shell.warning .main-timer,
.host-header > .main-timer-shell.warning .main-timer{
  color:#facc15!important;
  text-shadow:0 0 24px rgba(250,204,21,.55),0 8px 28px rgba(0,0,0,.35)!important;
  animation:timerWarningGlow 1.2s ease-in-out infinite!important;
}
#screen-game .main-timer-shell.warning .timer-core,
.host-header > .main-timer-shell.warning .timer-core{
  border-color:rgba(250,204,21,.44)!important;
  box-shadow:0 0 0 8px rgba(250,204,21,.06),0 22px 58px rgba(250,204,21,.14),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
#screen-game .main-timer-shell.critical .main-timer,
.host-header > .main-timer-shell.critical .main-timer{
  color:#ef4444!important;
  text-shadow:0 0 26px rgba(239,68,68,.70),0 8px 28px rgba(0,0,0,.35)!important;
  animation:timerCriticalGlow .55s ease-in-out infinite alternate!important;
}
#screen-game .main-timer-shell.critical .timer-core,
.host-header > .main-timer-shell.critical .timer-core{
  border-color:rgba(239,68,68,.60)!important;
  box-shadow:0 0 0 8px rgba(239,68,68,.08),0 0 54px rgba(239,68,68,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
#screen-game .question-title,
#screen-game #questionText,
#screen-game .question-text{
  color:#fff!important;
  text-shadow:0 8px 28px rgba(0,0,0,.34),0 0 18px rgba(88,199,247,.14)!important;
}
#screen-game .trivia-opt-card,
#screen-game .option-card,
#screen-game .trivia-option,
#screen-game .meme-opt-card,
#screen-game .voting-card{
  background:
    linear-gradient(135deg,rgba(29,48,78,.92),rgba(14,25,45,.86))!important;
  border-color:rgba(88,199,247,.20)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.055)!important;
  min-height:max-content!important;
}
#screen-game .voting-card .answer-text{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  line-height:1.18!important;
  max-width:100%!important;
}
#screen-game .trivia-opt-card:nth-child(1),
#screen-game .option-card:nth-child(1),
#screen-game .trivia-option:nth-child(1){
  background:linear-gradient(135deg,rgba(255,90,66,.38),rgba(60,20,28,.86))!important;
  border-color:rgba(255,90,66,.56)!important;
}
#screen-game .trivia-opt-card:nth-child(2),
#screen-game .option-card:nth-child(2),
#screen-game .trivia-option:nth-child(2){
  background:linear-gradient(135deg,rgba(59,130,246,.26),rgba(16,31,56,.88))!important;
  border-color:rgba(59,130,246,.42)!important;
}
#screen-game .trivia-opt-card:nth-child(3),
#screen-game .option-card:nth-child(3),
#screen-game .trivia-option:nth-child(3){
  background:linear-gradient(135deg,rgba(250,204,21,.34),rgba(58,42,12,.84))!important;
  border-color:rgba(250,204,21,.52)!important;
}
#screen-game .trivia-opt-card:nth-child(4),
#screen-game .option-card:nth-child(4),
#screen-game .trivia-option:nth-child(4){
  background:linear-gradient(135deg,rgba(52,211,153,.34),rgba(12,54,42,.86))!important;
  border-color:rgba(52,211,153,.52)!important;
}
#screen-game .trivia-opt-card:hover,
#screen-game .option-card:hover,
#screen-game .trivia-option:hover,
#screen-game .meme-opt-card:hover{
  transform:translateY(-2px) scale(1.01)!important;
  border-color:rgba(88,199,247,.62)!important;
  box-shadow:0 22px 62px rgba(88,199,247,.13),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
#screen-game .trivia-opt-card .opt-num,
#screen-game .option-card .opt-num,
#screen-game .trivia-option .opt-num,
#screen-game .option-number{
  background:linear-gradient(135deg,#58c7f7,#8b8cf7)!important;
  color:#05101d!important;
  border:0!important;
  box-shadow:0 8px 22px rgba(88,199,247,.22)!important;
}
#screen-game .leaderboard-title,
#screen-game .game-sidebar h3{
  color:#58c7f7!important;
  text-shadow:0 0 18px rgba(88,199,247,.25)!important;
}
#screen-game .lb-item{
  background:linear-gradient(90deg,rgba(25,43,70,.82),rgba(15,25,44,.62))!important;
  border-color:rgba(88,199,247,.18)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.22)!important;
}
#screen-game .lb-item.top1{
  background:linear-gradient(90deg,rgba(246,200,95,.22),rgba(26,42,66,.82))!important;
  border-color:rgba(246,200,95,.58)!important;
  box-shadow:0 0 0 1px rgba(246,200,95,.12),0 18px 46px rgba(246,200,95,.12)!important;
}
#screen-game .chat-area{
  border-color:rgba(88,199,247,.12)!important;
}
.all-answered-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:90!important;
  display:grid!important;
  place-items:center!important;
  padding:32px!important;
  background:
    radial-gradient(circle at 50% 44%,rgba(88,199,247,.18),transparent 24%),
    radial-gradient(circle at 50% 58%,rgba(139,140,247,.16),transparent 34%),
    rgba(5,9,18,.58)!important;
  backdrop-filter:blur(14px) saturate(1.12)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.12)!important;
}
.all-answered-overlay.hidden{
  display:none!important;
}
.all-answered-overlay::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(circle at center,#000 0 45%,transparent 74%);
  opacity:.36;
  pointer-events:none;
}
.all-answered-stage{
  position:fixed!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  z-index:1;
  width:min(680px,calc(100vw - 42px));
  min-height:360px;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:16px;
  padding:34px 36px 38px;
  border-radius:38px;
  background:
    radial-gradient(circle at 50% 0,rgba(88,199,247,.24),transparent 42%),
    linear-gradient(145deg,rgba(10,20,37,.72),rgba(8,13,25,.54));
  border:1px solid rgba(88,199,247,.22);
  box-shadow:0 42px 130px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
  animation:answeredStagePop .48s cubic-bezier(.2,.8,.2,1) both;
}
.all-answered-stage::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:280px;
  height:280px;
  border-radius:50%;
  transform:translate(-50%,-38%);
  background:radial-gradient(circle,rgba(88,199,247,.18),transparent 64%);
  border:1px solid rgba(88,199,247,.12);
  box-shadow:0 0 80px rgba(88,199,247,.18);
  pointer-events:none;
}
.all-answered-stage::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:26px;
  width:min(310px,60%);
  height:4px;
  border-radius:99px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,#58c7f7,#8b8cf7,transparent);
  box-shadow:0 0 28px rgba(88,199,247,.45);
  animation:resultScan 1.15s ease-in-out infinite alternate;
}
.all-answered-overlay > *{
  position:relative;
  z-index:1;
}
.all-answered-kicker{
  position:relative;
  z-index:1;
  padding:8px 13px;
  border-radius:999px;
  color:#bfffe7;
  background:rgba(52,211,153,.09);
  border:1px solid rgba(52,211,153,.24);
  font:900 12px/1 var(--font-display)!important;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.all-answered-label{
  position:relative;
  z-index:1;
  font-size:clamp(38px,4.5vw,68px)!important;
  line-height:.95!important;
  color:#fff!important;
  text-align:center!important;
  text-shadow:0 16px 46px rgba(0,0,0,.52),0 0 24px rgba(88,199,247,.28)!important;
}
.all-answered-subtitle{
  position:relative;
  z-index:1;
  color:#d8e9ff!important;
  font:900 16px/1.2 var(--font-display)!important;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.all-answered-count-wrap{
  position:relative;
  z-index:1;
  width:150px;
  height:150px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:radial-gradient(circle,rgba(88,199,247,.16),rgba(88,199,247,.04) 60%,transparent 61%);
  border:1px solid rgba(88,199,247,.28);
  box-shadow:0 0 54px rgba(88,199,247,.22),inset 0 0 34px rgba(88,199,247,.08);
}
.all-answered-count-wrap::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:inherit;
  border:2px solid rgba(88,199,247,.16);
  border-top-color:#58c7f7;
  border-right-color:#8b8cf7;
  animation:spin 1.8s linear infinite;
}
.all-answered-count{
  margin:0!important;
  font-size:clamp(72px,8vw,112px)!important;
  line-height:.8!important;
  color:#58c7f7!important;
  text-shadow:0 0 34px rgba(88,199,247,.58),0 10px 30px rgba(0,0,0,.42)!important;
}
@keyframes resultScan{from{opacity:.45;transform:translateX(-50%) scaleX(.62)}to{opacity:1;transform:translateX(-50%) scaleX(1)}}
@keyframes answeredStagePop{
  from{opacity:0;transform:translate(-50%,-46%) scale(.94)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}
}
.phone-opt-btn.p-opt-0{
  background:linear-gradient(135deg,#ff5a42,#ef4444)!important;
  border-color:rgba(255,90,66,.42)!important;
  color:#05070f!important;
}
.phone-opt-btn.p-opt-1{
  background:linear-gradient(135deg,#4aa3ff,#3b82f6)!important;
  border-color:rgba(74,163,255,.42)!important;
  color:#05070f!important;
}
.phone-opt-btn.p-opt-2{
  background:linear-gradient(135deg,#facc15,#eab308)!important;
  border-color:rgba(250,204,21,.42)!important;
  color:#05070f!important;
}
.phone-opt-btn.p-opt-3{
  background:linear-gradient(135deg,#34d399,#10b981)!important;
  border-color:rgba(52,211,153,.42)!important;
  color:#05070f!important;
}
.phone-opt-btn.p-opt-0::before,
.phone-opt-btn.p-opt-1::before,
.phone-opt-btn.p-opt-2::before,
.phone-opt-btn.p-opt-3::before{
  background:rgba(5,7,15,.26)!important;
  box-shadow:none!important;
}
.final-home-link{
  width:max-content;
  max-width:100%;
  margin:28px auto 0;
  padding:15px 22px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:18px;
  text-decoration:none;
  color:#06111a!important;
  background:linear-gradient(135deg,#58c7f7,#8b8cf7)!important;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 20px 52px rgba(88,199,247,.20);
  font:900 18px/1 var(--font-display);
  letter-spacing:.02em;
  transition:transform .18s ease,box-shadow .18s ease;
}
.final-home-link:hover{
  transform:translateY(-2px);
  box-shadow:0 26px 70px rgba(88,199,247,.28);
}
.audio-question-card{
  width:min(720px,100%);
  height:100%;
  min-height:240px;
  margin:0 auto;
  display:grid;
  place-items:center;
  align-content:center;
  gap:18px;
  padding:30px;
  border-radius:28px;
  background:
    radial-gradient(circle at 50% 0%,rgba(88,199,247,.28),transparent 38%),
    linear-gradient(145deg,rgba(12,24,43,.96),rgba(7,12,24,.98));
  border:1px solid rgba(88,199,247,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 26px 70px rgba(0,0,0,.36);
}
.audio-question-label{
  font:900 clamp(24px,3.2vw,44px)/1 var(--font-display)!important;
  color:#fff;
  text-align:center;
  text-shadow:0 0 28px rgba(88,199,247,.35);
}
.audio-question-card audio{
  width:min(560px,100%);
  accent-color:#58c7f7;
}
.audio-replay-btn{
  appearance:none;
  border:1px solid rgba(88,199,247,.35);
  border-radius:16px;
  padding:14px 22px;
  color:#06111a;
  background:linear-gradient(135deg,#58c7f7,#8b8cf7);
  font:900 17px/1 var(--font-display)!important;
  box-shadow:0 18px 42px rgba(88,199,247,.2);
  cursor:pointer;
}
.audio-replay-btn.hidden{display:none!important}
@keyframes gameTimerGlow{0%,100%{filter:drop-shadow(0 0 12px rgba(88,199,247,.28))}50%{filter:drop-shadow(0 0 28px rgba(88,199,247,.55))}}
@keyframes timerWarningGlow{50%{filter:drop-shadow(0 0 24px rgba(250,204,21,.48))}}
@keyframes timerCriticalGlow{from{filter:drop-shadow(0 0 16px rgba(239,68,68,.48));transform:scale(1)}to{filter:drop-shadow(0 0 34px rgba(239,68,68,.78));transform:scale(1.08)}}

html{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cfilter id='g'%3E%3CfeDropShadow dx='0' dy='0' stdDeviation='1.8' flood-color='%2358c7f7' flood-opacity='.72'/%3E%3C/filter%3E%3Cpath filter='url(%23g)' d='M6 4l18 11-8.2 2.1L12 25z' fill='%23f8fafc' stroke='%2358c7f7' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M12 24l3.8-6.9' stroke='%23050914' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") 6 4,auto;
}
body,body *{
  cursor:inherit;
}
a,button,[role="button"],label,summary,input[type="button"],input[type="submit"],input[type="checkbox"],input[type="radio"],select,.btn,.nav-btn,.control-btn,.btn-action,.launch-btn,.btn-start-game,.phone-opt-btn,.avatar-option{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Cfilter id='g'%3E%3CfeDropShadow dx='0' dy='0' stdDeviation='2.2' flood-color='%238b8cf7' flood-opacity='.76'/%3E%3C/filter%3E%3Cpath filter='url(%23g)' d='M7 5l18.5 11.2-8.3 2.2-3.8 8.1z' fill='%2358c7f7' stroke='%23f8fafc' stroke-width='1.7' stroke-linejoin='round'/%3E%3Ccircle cx='24' cy='8' r='3' fill='%23f8fafc' stroke='%2358c7f7' stroke-width='1.2'/%3E%3C/svg%3E") 7 5,pointer!important;
}
input[type="text"],input[type="password"],input[type="email"],input[type="number"],textarea,[contenteditable="true"]{
  cursor:text!important;
}