:root{
  --bg:#07111d;--bg-2:#0a1726;--surface:#0d1c2c;--surface-2:#12263a;--surface-3:#173149;
  --line:#263f55;--line-soft:#1a3145;--text:#f7fbff;--muted:#9fb2c4;
  --accent:#5da9ff;--accent-2:#8b7cff;--accent-3:#40d7c2;--green:#3bdd8a;--red:#ff6d7d;--gold:#ffc861;
  --shadow:0 24px 70px rgba(0,0,0,.32);--radius:22px;--radius-sm:14px;
}
*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(900px 520px at 88% -10%,rgba(64,113,192,.22),transparent 62%),radial-gradient(700px 500px at -10% 20%,rgba(94,76,186,.14),transparent 65%),linear-gradient(180deg,#081521 0%,#06101a 100%);color:var(--text);letter-spacing:-.01em}body,h1,h2,h3,h4,p,div,span,label,td,th{color:inherit}a{color:inherit;text-decoration:none}h1,h2,h3,h4{letter-spacing:-.035em}button,input,select,textarea{font:inherit}
.wrap{max-width:1320px;margin:auto;padding:38px 28px 56px}.topbar{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:0 30px;border-bottom:1px solid rgba(127,170,205,.15);background:rgba(5,14,24,.78);position:sticky;top:0;z-index:30;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;font-size:24px;font-weight:900;letter-spacing:-.04em;white-space:nowrap}.brand-mark{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;margin-right:10px;background:linear-gradient(145deg,var(--accent),var(--accent-2));box-shadow:0 10px 28px rgba(83,128,255,.28);font-size:22px}.brand-word{color:#75baff}.brand-word-light{color:#fff;margin-left:2px}.nav{display:flex;align-items:center;gap:5px}.nav>a,.nav-logout{border:0;background:transparent;color:#c9d7e3;padding:9px 12px;border-radius:11px;font-weight:650;cursor:pointer}.nav>a:hover,.nav-logout:hover{color:#fff;background:rgba(255,255,255,.06)}.nav-form{display:inline;margin:0}.nav-logout{border:1px solid rgba(255,255,255,.11);margin-left:4px}
.card{background:linear-gradient(180deg,rgba(18,38,58,.94),rgba(10,25,39,.95));border:1px solid rgba(95,139,176,.32);border-radius:var(--radius);padding:24px;box-shadow:0 16px 45px rgba(0,0,0,.16);color:var(--text)}.card:hover{border-color:rgba(105,158,202,.42)}
.kicker,.eyebrow{font-size:12px;line-height:1.2;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#74b8ff!important}.muted{color:var(--muted)!important}.small{font-size:13px}.answer-ok{color:#72f1ad!important}.answer-near{color:#ffd581!important}.answer-no{color:#ff8b98!important}.stat{font-size:32px;font-weight:900;color:#fff}
.page-heading{max-width:1040px;margin:0 0 26px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.page-heading h1{font-size:clamp(34px,5vw,54px);line-height:1;margin:.18em 0 0}.page-heading p{margin:0;color:var(--muted);font-size:17px}.page-heading.compact{max-width:none;margin-bottom:22px}.live-dot{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(59,221,138,.1);border:1px solid rgba(59,221,138,.25);color:#8bf3b9}.live-dot:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(59,221,138,.08)}
.btn{appearance:none;border:1px solid rgba(109,151,185,.4);border-radius:13px;padding:11px 16px;font-weight:800;background:rgba(30,58,82,.88);color:#fff;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease}.btn:hover{transform:translateY(-1px);background:#244966;border-color:#5f89aa}.btn.primary{background:linear-gradient(135deg,#278cff,#6d75ff);border-color:rgba(142,183,255,.7);box-shadow:0 10px 26px rgba(63,113,255,.22)}.btn.primary:hover{box-shadow:0 14px 34px rgba(63,113,255,.32)}.btn.green{background:linear-gradient(135deg,#1aa963,#29ca7a);border-color:#46df91}.btn.red{background:#a93d50;border-color:#cf6475}.btn.ghost{background:transparent}.btn:disabled{opacity:.42;cursor:not-allowed;transform:none;box-shadow:none}.btn-lg{padding:14px 22px;border-radius:15px;font-size:16px}.grow{flex:1}.actions{display:flex;gap:10px;flex-wrap:wrap}
.home-shell{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:38px 28px}.home-hero{width:min(1180px,100%);min-height:590px;position:relative;overflow:hidden;border:1px solid rgba(108,157,198,.25);border-radius:32px;background:linear-gradient(128deg,rgba(12,29,45,.97) 0%,rgba(12,28,43,.9) 48%,rgba(18,31,57,.86) 100%);box-shadow:var(--shadow);display:grid;grid-template-columns:1.12fr .88fr;align-items:center;padding:70px;isolation:isolate}.home-content{position:relative;z-index:3}.home-title{font-size:clamp(66px,9vw,116px);line-height:.82;margin:18px 0 28px;letter-spacing:-.075em}.home-title span{display:block;background:linear-gradient(100deg,#fff 15%,#83c7ff 65%,#a397ff);-webkit-background-clip:text;background-clip:text;color:transparent}.home-lead{max-width:570px;font-size:clamp(18px,2.2vw,24px);line-height:1.45;color:#bdccda;margin:0 0 30px}.home-actions{display:flex;gap:11px;flex-wrap:wrap}.theme-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:34px}.theme-pills span{padding:7px 11px;border:1px solid rgba(130,170,202,.18);border-radius:999px;color:#8099ae;background:rgba(255,255,255,.025);font-size:12px;font-weight:700}.home-visual{position:relative;min-height:420px;z-index:2;display:grid;place-items:center}.vinyl{width:min(330px,72vw);aspect-ratio:1;border-radius:50%;position:relative;background:repeating-radial-gradient(circle at 50%,#0c1622 0 3px,#172536 4px 5px,#09131e 6px 9px);box-shadow:-20px 30px 80px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.08);transform:rotate(-12deg)}.vinyl:before{content:"";position:absolute;inset:28%;border-radius:50%;background:linear-gradient(145deg,#5aaeff,#8e71ff);box-shadow:0 0 50px rgba(101,110,255,.35)}.vinyl:after{content:"";position:absolute;inset:47%;border-radius:50%;background:#07111b;box-shadow:0 0 0 4px rgba(255,255,255,.12)}.vinyl-label{position:absolute;inset:0;display:grid;place-items:center;z-index:2;font-weight:950;font-size:26px;letter-spacing:-.05em;color:#fff}.equalizer{position:absolute;bottom:24px;left:10%;display:flex;align-items:end;gap:8px;height:86px;opacity:.75}.equalizer i{width:6px;border-radius:999px;background:linear-gradient(180deg,#7dd3ff,#8678ff);animation:eq 1.6s ease-in-out infinite alternate}.equalizer i:nth-child(1){height:34%}.equalizer i:nth-child(2){height:75%;animation-delay:.2s}.equalizer i:nth-child(3){height:48%;animation-delay:.4s}.equalizer i:nth-child(4){height:100%;animation-delay:.1s}.equalizer i:nth-child(5){height:60%;animation-delay:.5s}.equalizer i:nth-child(6){height:84%;animation-delay:.3s}.equalizer i:nth-child(7){height:42%;animation-delay:.6s}@keyframes eq{to{height:28%}}
.home-glow{position:absolute;border-radius:50%;filter:blur(8px);pointer-events:none;z-index:0}.home-glow-a{width:430px;height:430px;right:-100px;top:-130px;background:radial-gradient(circle,rgba(87,127,255,.24),transparent 67%)}.home-glow-b{width:360px;height:360px;left:28%;bottom:-240px;background:radial-gradient(circle,rgba(71,211,195,.12),transparent 68%)}
.auth-shell{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:30px}.auth-card{width:min(460px,100%);padding:34px}.auth-icon,.join-icon,.section-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#257fff,#766cff);font-size:22px;font-weight:900;box-shadow:0 10px 30px rgba(73,102,255,.22);margin-bottom:18px}.section-icon{float:right;width:42px;height:42px;margin:0 0 8px 12px}.section-icon.accent{background:linear-gradient(145deg,#6d72ff,#ba68e8)}.auth-card h1{font-size:42px;margin:8px 0 22px}.auth-note{margin-top:16px;text-align:center}
.player-shell{max-width:560px;margin:0 auto;padding:28px 18px}.player-card{margin-top:22px}.join-shell,.play-shell{padding-top:52px}.join-card,.play-card{padding:30px}.join-card h1,.play-card h1{font-size:42px;margin:8px 0 24px}.code-input{text-transform:uppercase;text-align:center;font-size:28px!important;font-weight:900!important;letter-spacing:.16em!important}.join-icon{margin-bottom:16px}.match-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(93,169,255,.1);border:1px solid rgba(93,169,255,.28);color:#8ac6ff;font-size:12px;font-weight:900;letter-spacing:.11em;margin-bottom:14px}
input,select,textarea{width:100%;background:rgba(4,16,27,.72);color:#fff;border:1px solid #34536d;border-radius:12px;padding:12px 13px;outline:none;transition:.16s ease}input:focus,select:focus,textarea:focus{border-color:#5aaeff;box-shadow:0 0 0 4px rgba(57,139,255,.11)}textarea{min-height:96px}label{display:grid;gap:7px;color:#d7e3ed;font-size:14px;font-weight:620}.formgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.span2{grid-column:span 2}.list{display:grid;gap:9px}.split{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:start}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 13px;border:1px solid rgba(94,139,175,.28);border-radius:13px;background:rgba(9,28,43,.72);color:#fff}.badge{display:inline-block;padding:4px 8px;border-radius:999px;background:#25435d;color:#eaf6ff;font-size:12px}.badge.green{background:#164b31;color:#9bffc3}.badge.amber{background:#5a451e;color:#ffe09a}.badge.red{background:#592531;color:#ffb0ba}.bigcode{font-size:clamp(48px,8vw,72px);font-weight:950;letter-spacing:.1em;color:#fff;margin:10px 0}.qr{background:white;border-radius:18px;padding:10px;width:220px;max-width:100%;box-shadow:0 18px 50px rgba(0,0,0,.28)}.center{text-align:center}.lobby-grid{grid-template-columns:.85fr 1.15fr}.lobby-code-card{padding:32px}.lobby-player-card{min-height:100%}.section-head{display:flex;align-items:center;justify-content:space-between}.question-stage{padding:clamp(24px,4vw,54px)}.question{font-size:clamp(34px,5vw,64px);font-weight:900;line-height:1.05;letter-spacing:-.05em}.game-stage{max-width:1200px;margin:auto}.scorestrip{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}.scorechip{padding:9px 13px;background:rgba(20,48,70,.8);border:1px solid rgba(88,137,176,.35);border-radius:12px;color:#fff}.musicbox{display:flex;align-items:center;gap:13px;padding:14px;background:rgba(6,22,35,.72);border:1px solid rgba(79,129,170,.35);border-radius:16px}.progress{height:8px;background:#172a3d;border-radius:999px;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,#248dff,#8a75ff);transition:width .2s ease}.host-actions{gap:10px}.host-actions .btn{min-width:145px}
.options{display:grid;gap:10px}.option{padding:16px;border:1px solid #3d607d;border-radius:14px;background:#10293e;text-align:left;color:#fff;font-weight:760;cursor:pointer;transition:.14s}.option:hover{background:#183853;border-color:#5f8fb4}.option.selected{outline:2px solid #62adff;background:#153f65}.review-q{margin:16px 0}.scoreboard{display:grid;gap:8px}.scoreboard .row:first-child{border-color:#8b783a;background:#312a15}
.tabs{display:flex;gap:7px;margin-bottom:18px;overflow:auto}.tab{border:1px solid rgba(88,134,170,.25);padding:9px 13px;border-radius:10px;background:rgba(17,42,61,.72);cursor:pointer;color:#cbd9e5;white-space:nowrap}.tab.active{background:linear-gradient(135deg,#247ce6,#5969e9);border-color:#659ee8;color:#fff}.drop{border:1px dashed #446c8d;border-radius:15px;padding:26px;text-align:center;background:rgba(7,21,34,.45)}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px;border-bottom:1px solid rgba(74,112,142,.25);vertical-align:top}th{color:#8fa7bb;font-size:12px;text-transform:uppercase;letter-spacing:.07em}.table-scroll{overflow:auto}.hidden{display:none!important}.modal{position:fixed;inset:0;background:rgba(1,5,10,.78);display:flex;align-items:center;justify-content:center;padding:18px;z-index:100;backdrop-filter:blur(10px)}.modal-card{width:min(820px,100%);max-height:86vh;overflow:hidden;display:flex;flex-direction:column}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.question-choices{display:grid;gap:8px;overflow:auto;margin-top:14px;padding-right:4px}.question-choice{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;text-align:left;background:#102b42;border:1px solid #355c79;color:#fff;border-radius:13px;padding:14px;cursor:pointer}.question-choice:hover{background:#173b59;border-color:#5d93bc}.question-choice small{display:block;color:#9fb4c5;margin-top:4px}.choice-arrow{font-size:24px;color:#71c5ff}
@media(max-width:900px){.home-hero{grid-template-columns:1fr;padding:46px 34px;min-height:0}.home-visual{min-height:290px}.vinyl{width:250px}.page-heading{align-items:flex-start;flex-direction:column;gap:9px}.split,.lobby-grid,.grid,.formgrid{grid-template-columns:1fr}.span2{grid-column:auto}.nav{max-width:65vw;overflow:auto}.wrap{padding:28px 16px}.home-shell{padding:22px 16px}.topbar{padding:0 16px}.brand{font-size:21px}.brand-mark{width:34px;height:34px}.question{font-size:clamp(30px,8vw,46px)}}
@media(max-width:620px){.topbar{min-height:64px;align-items:center}.nav>a{display:none}.nav-form{display:none}.nav>a[href="/join"],.nav>a[href="/login"]{display:inline-flex}.home-shell{min-height:calc(100vh - 64px)}.home-hero{padding:34px 22px;border-radius:24px}.home-title{font-size:64px}.home-lead{font-size:18px}.home-visual{min-height:240px}.vinyl{width:210px}.home-actions .btn{flex:1;min-width:130px;text-align:center}.theme-pills{margin-top:26px}.player-shell{padding:20px 12px}.join-card,.play-card,.card{padding:18px}.host-actions,.stack-mobile{flex-direction:column}.host-actions .btn,.stack-mobile .btn{width:100%}.musicbox{align-items:stretch;flex-direction:column}.auth-card h1,.join-card h1,.play-card h1{font-size:36px}}


/* v2.3 polish */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.metric-card{padding:20px;border-radius:18px;border:1px solid rgba(99,150,191,.28);background:linear-gradient(145deg,rgba(20,47,70,.94),rgba(12,30,46,.96));box-shadow:0 14px 38px rgba(0,0,0,.14)}.metric-card span{display:block;color:var(--muted);font-size:13px;margin-bottom:8px}.metric-card b{font-size:34px;line-height:1;color:#fff;letter-spacing:-.04em}.stat-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 13px;border:1px solid rgba(91,137,173,.25);border-radius:13px;background:rgba(8,26,40,.58)}.accuracy-pill{flex:0 0 auto;min-width:58px;text-align:center;padding:7px 9px;border-radius:999px;background:rgba(93,169,255,.12);border:1px solid rgba(93,169,255,.25);font-weight:900;color:#9bd0ff}.host-quickbar{max-width:760px;margin:14px auto 0;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.switchline{display:flex;align-items:center;gap:8px;font-size:13px;color:#cbd8e4;cursor:pointer}.switchline input{width:18px;height:18px;accent-color:#5da9ff}.review-hero{display:flex;align-items:center;justify-content:space-between;gap:18px}.btn-mini{padding:6px 9px;border-radius:9px;font-size:12px}.review-q table td{vertical-align:middle}.review-q{position:relative;overflow:hidden}.review-q:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--accent),var(--accent-2));opacity:.75}.question-stage{box-shadow:0 28px 90px rgba(0,0,0,.22)}.scorechip{transition:.18s ease}.progress>div{box-shadow:0 0 18px rgba(67,144,255,.38)}
@media(max-width:900px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.stats-grid{grid-template-columns:1fr 1fr}.metric-card{padding:15px}.metric-card b{font-size:28px}.review-hero{align-items:flex-start;flex-direction:column}.host-quickbar{align-items:flex-start;flex-direction:column;gap:8px}}


/* v2.4 robustness + diagnostics */
.preflight-box{padding:13px 14px;border-radius:14px;border:1px solid rgba(94,139,175,.28);background:rgba(7,25,39,.58);text-align:left}.live-dot.offline{background:#7a2630;color:#ffd5da}.status-dot{width:34px;height:34px;display:grid;place-items:center;border-radius:999px;font-weight:950;border:1px solid transparent}.status-dot.ok{background:rgba(35,178,104,.14);color:#80f3ae;border-color:rgba(51,198,119,.28)}.status-dot.warn{background:rgba(238,178,61,.13);color:#ffd581;border-color:rgba(238,178,61,.28)}.status-dot.bad{background:rgba(226,69,83,.14);color:#ff9ca7;border-color:rgba(226,69,83,.3)}.soft-rule{border:0;border-top:1px solid rgba(91,137,173,.22);margin:18px 0}.preflight-box .answer-ok,.preflight-box .answer-no{line-height:1.45}

/* v2.6 – persistent audio output */
.audio-output-card{background:linear-gradient(135deg,rgba(26,62,92,.92),rgba(14,35,54,.96));border-color:rgba(92,166,255,.28)}
.audio-output-head{display:flex;justify-content:space-between;align-items:center;gap:16px}
.audio-output-grid{display:grid;grid-template-columns:minmax(180px,1.1fr) minmax(220px,1.6fr) auto;gap:12px;align-items:end;margin-top:14px}
.audio-output-actions{display:flex;gap:8px;align-items:end;padding-bottom:1px}
.live-output-bar{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:13px 16px;position:relative;border-color:rgba(92,166,255,.25);background:linear-gradient(135deg,rgba(20,49,73,.96),rgba(12,31,48,.97))}
.live-output-main{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.live-output-main b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-output-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,#2f9dff,#766dff);font-size:22px;font-weight:800;box-shadow:0 8px 24px rgba(69,126,255,.22)}
.live-output-quick{display:grid;grid-template-columns:minmax(160px,.9fr) minmax(220px,1.4fr) auto auto;gap:8px;align-items:center;flex-basis:100%;width:100%;padding-top:12px;border-top:1px solid rgba(143,188,228,.15);margin-top:2px}
.live-output-bar:has(.live-output-quick:not(.hidden)){flex-wrap:wrap}
@media(max-width:760px){
  .audio-output-grid{grid-template-columns:1fr}
  .audio-output-actions{padding:0;flex-wrap:wrap}
  .live-output-quick{grid-template-columns:1fr 1fr}
  .live-output-bar{align-items:flex-start}
}
@media(max-width:520px){.live-output-quick{grid-template-columns:1fr}.live-output-bar{flex-wrap:wrap}.live-output-main{min-width:calc(100% - 86px)}}

/* v2.7 Anywhere Playback */
.audio-output-card select#setupPlaybackMode{font-weight:700}
.browser-volume{display:flex;align-items:center;gap:8px;font-size:.86rem;color:var(--muted)}
.browser-volume input{width:120px}
#browserPanel{padding:10px 0}
@media(max-width:720px){.browser-volume{width:100%}.browser-volume input{flex:1}.audio-output-actions{flex-wrap:wrap}}


/* v2.8 question countdown */
.quiz-timer{display:inline-flex;align-items:baseline;gap:5px;margin:14px auto 8px;padding:9px 15px;border-radius:999px;background:rgba(50,190,140,.12);border:1px solid rgba(75,225,170,.28);font-variant-numeric:tabular-nums;transition:.2s ease}
.quiz-timer b{font-size:30px;line-height:1;color:#8ef0c6}.quiz-timer .timer-icon{font-size:18px}.quiz-timer.timer-warn{background:rgba(245,180,60,.12);border-color:rgba(245,180,60,.4)}.quiz-timer.timer-warn b{color:#ffd074}.quiz-timer.timer-danger{background:rgba(242,80,80,.15);border-color:rgba(242,80,80,.48);animation:timerPulse .8s ease-in-out infinite alternate}.quiz-timer.timer-danger b{color:#ff8585}
.timer-track{height:7px;max-width:420px;margin:0 auto 14px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08)}.timer-track>div{height:100%;width:100%;background:linear-gradient(90deg,#57d9ad,#60a8ff);border-radius:inherit;transition:width .18s linear}.timer-track.timer-danger>div{background:#ff6969}.host-timer{margin-top:18px}.host-timer-track{max-width:360px}
@keyframes timerPulse{from{transform:scale(1)}to{transform:scale(1.035)}}
@media (prefers-reduced-motion:reduce){.quiz-timer.timer-danger{animation:none}}

/* v2.8.3 – quizmaster sees who has answered */
.answered-names{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;min-height:30px;margin-top:8px}.answered-label{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.answered-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;background:rgba(31,170,105,.13);border:1px solid rgba(77,218,151,.28);color:#aaf1ca;font-size:12px;font-weight:800}

/* v2.8.4 – invitation link for remote players */
.invite-share-box{margin:16px auto 0;max-width:520px;text-align:left}.invite-link{width:100%;font-size:13px;text-align:center;background:rgba(7,22,34,.78);border:1px solid rgba(92,143,184,.35);color:#dff2ff;border-radius:12px;padding:11px 12px}.invite-link:focus{outline:2px solid rgba(71,155,255,.45);outline-offset:2px}.invite-actions{margin-top:9px;gap:8px}.invite-status{text-align:center;margin-top:8px;line-height:1.4}
@media(max-width:620px){.invite-actions{flex-direction:column}.invite-actions .btn{width:100%}}

/* v2.9 – quizmaster flow: status, pause, preview and halftime */
.host-status-bar{position:sticky;top:76px;z-index:35;display:grid;grid-template-columns:repeat(4,minmax(110px,1fr)) auto;gap:10px;align-items:stretch;margin:0 0 14px;padding:10px;border:1px solid rgba(98,151,194,.3);border-radius:18px;background:rgba(7,24,38,.94);box-shadow:0 16px 40px rgba(0,0,0,.2);backdrop-filter:blur(14px)}
.host-status-item{min-width:0;padding:9px 12px;border-radius:12px;background:rgba(19,49,72,.72);border:1px solid rgba(89,139,177,.22)}
.host-status-item span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}.host-status-item b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-size:15px}.host-status-item.all-answered{background:rgba(25,116,76,.28);border-color:rgba(72,221,143,.42)}.host-status-item.all-answered b{color:#93f2bd}.host-status-actions{display:flex;gap:7px;align-items:center}.host-status-bar.is-paused{border-color:rgba(248,187,68,.5);box-shadow:0 16px 42px rgba(164,113,20,.12)}
.answer-roster{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:8px}.answer-roster+.answer-roster{margin-top:7px}.answered-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#8fa8bc;font-weight:800}.answered-chip,.waiting-chip{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.answered-chip{background:rgba(37,177,111,.14);border:1px solid rgba(54,211,132,.32);color:#a0f2c5}.waiting-chip{background:rgba(247,177,56,.1);border:1px solid rgba(237,181,75,.25);color:#f6d895}
.next-preview-card{margin-top:14px;padding:16px 18px;border-style:dashed;background:rgba(8,27,42,.72)}.next-preview-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.next-preview-body{padding-top:13px;margin-top:12px;border-top:1px solid rgba(101,148,184,.22)}.next-preview-question{font-size:20px;font-weight:850;line-height:1.25;color:#fff}.next-preview-body .muted{margin-top:6px}.halftime-card{width:min(680px,100%)}.halftime-scoreboard{margin-top:16px;display:grid;gap:9px}.halftime-row{font-size:18px}.halftime-row.leader{border-color:rgba(239,203,93,.56);background:linear-gradient(135deg,rgba(94,73,18,.48),rgba(39,36,22,.75))}.pause-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:rgba(246,183,67,.14);border:1px solid rgba(246,183,67,.32);color:#ffd986;font-weight:850;margin-right:5px}
@media(max-width:900px){.host-status-bar{top:66px;grid-template-columns:repeat(2,minmax(120px,1fr))}.host-status-audio{grid-column:span 2}.host-status-actions{grid-column:span 2;justify-content:stretch}.host-status-actions .btn{flex:1}}
@media(max-width:620px){.host-status-bar{position:relative;top:auto;grid-template-columns:1fr 1fr}.host-status-audio{grid-column:span 2}.next-preview-question{font-size:18px}}

/* v3.1 – beer-friendly live cockpit */
.host-cockpit-actions{max-width:820px;margin:20px auto 0;display:grid;gap:12px}
.host-next-main{width:100%;min-height:64px;font-size:clamp(20px,3vw,28px);border-radius:18px;letter-spacing:-.025em;box-shadow:0 18px 44px rgba(63,113,255,.28)}
.host-next-main span{font-size:1.15em;margin-left:8px}
.host-safety-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.host-safety-actions .btn{min-height:48px}
.host-more-controls{border:1px solid rgba(97,146,184,.22);border-radius:14px;background:rgba(8,25,39,.5);text-align:left;overflow:hidden}
.host-more-controls summary{cursor:pointer;list-style:none;padding:11px 14px;text-align:center;color:#b9c9d7;font-size:13px;font-weight:850;user-select:none}
.host-more-controls summary::-webkit-details-marker{display:none}.host-more-controls summary:after{content:' ▾';color:#77b9f4}.host-more-controls[open] summary:after{content:' ▴'}
.host-more-controls[open]{padding-bottom:13px}.host-more-controls>.actions{justify-content:center;padding:0 13px}.host-more-controls .host-quickbar{margin-top:12px;padding:0 13px}
#undoAction:not(:disabled){border-color:rgba(255,200,97,.38);background:rgba(104,76,24,.45);color:#ffe09a}
.correction-card{width:min(720px,100%)}.correction-answer{margin:12px 0 14px;padding:11px 13px;border-radius:12px;background:rgba(24,73,105,.5);border:1px solid rgba(93,169,255,.24)}
.correction-rows{display:grid;gap:8px;overflow:auto;padding-right:3px}.correction-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 13px;border:1px solid rgba(91,137,173,.25);border-radius:13px;background:rgba(8,26,40,.68)}
.correction-row-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}.correction-help{margin:12px 0 0}
.player-connection-pill{position:sticky;top:82px;z-index:20;margin:0 0 10px auto;width:max-content;display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid rgba(149,181,207,.22);background:rgba(8,24,37,.86);backdrop-filter:blur(10px);font-size:12px;color:#b9c8d5}.player-connection-pill span{width:8px;height:8px;border-radius:50%;background:#e5b64d}.player-connection-pill.online{color:#aaf1ca;border-color:rgba(70,216,142,.28)}.player-connection-pill.online span{background:#38d98a;box-shadow:0 0 0 4px rgba(56,217,138,.08)}.player-connection-pill.offline{color:#ffb4bd;border-color:rgba(255,109,125,.28)}.player-connection-pill.offline span{background:#ff6d7d}.player-connection-pill.connecting span{animation:connectionPulse .9s ease-in-out infinite alternate}
@keyframes connectionPulse{from{opacity:.45}to{opacity:1}}
.question-progress{height:5px;margin:8px 0 20px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.07)}.question-progress>div{height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#5da9ff,#8b7cff);transition:width .25s ease}
.year-input{text-align:center!important;font-size:42px!important;font-weight:950!important;letter-spacing:.12em!important;font-variant-numeric:tabular-nums;padding:14px 12px!important}
@media(max-width:620px){.host-safety-actions{grid-template-columns:1fr}.host-next-main{min-height:72px}.correction-row{align-items:flex-start;flex-direction:column}.correction-row-actions{width:100%;justify-content:space-between}.player-connection-pill{top:68px}.year-input{font-size:38px!important}}
@media (prefers-reduced-motion:reduce){.player-connection-pill.connecting span{animation:none}}

/* v3.2 – teams */
.team-builder{margin-top:14px;padding:14px;border:1px solid rgba(94,145,184,.25);border-radius:15px;background:rgba(7,24,38,.52)}
.team-builder-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.team-builder>.btn{width:100%}
.team-player-list{display:grid;gap:8px}.team-player-row{width:100%;display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid rgba(91,137,173,.25);border-radius:13px;background:rgba(8,26,40,.64);color:inherit;text-align:left;cursor:pointer;transition:.14s ease}.team-player-row:hover{border-color:rgba(93,169,255,.45);background:rgba(15,45,68,.72)}.team-player-row.selected{border-color:rgba(76,218,148,.56);background:rgba(22,99,68,.24);box-shadow:0 0 0 2px rgba(76,218,148,.08)}.team-player-row:disabled{cursor:default;opacity:.82}.team-select-mark{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.06);font-weight:900;color:#a9bdd0}.team-player-row.selected .team-select-mark{background:rgba(59,210,135,.18);color:#9cf0c1}.team-mini-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--team-color) 55%, transparent);background:color-mix(in srgb,var(--team-color) 13%, transparent);font-size:11px;font-weight:850;white-space:nowrap}.team-mini-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--team-color)}
.team-list{display:grid;gap:9px;margin-top:12px}.team-card{padding:11px 12px;border:1px solid color-mix(in srgb,var(--team-color) 42%, rgba(91,137,173,.2));border-left:4px solid var(--team-color);border-radius:13px;background:rgba(9,28,43,.76)}.team-card-top{display:grid;grid-template-columns:auto minmax(100px,1fr) auto auto;align-items:center;gap:7px}.team-color-dot{width:11px;height:11px;border-radius:50%;background:var(--team-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--team-color) 14%, transparent)}.team-name-input{min-width:0;padding:8px 9px;font-weight:850}.team-members{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.team-member-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.06);font-size:12px}.team-member-chip button{border:0;background:none;color:#ffadb5;font-size:17px;line-height:1;padding:0;cursor:pointer}.team-empty{margin:10px 2px 0}
.team-scorechip{border-left:3px solid var(--team-color);display:flex;flex-direction:column;align-items:flex-start}.team-scorechip small{display:block;color:var(--muted);font-size:10px;margin-top:2px;font-weight:500}
.player-team-identity{display:flex;align-items:center;gap:10px;margin:-2px 0 14px;padding:10px 12px;border:1px solid rgba(101,151,190,.25);border-radius:13px;background:rgba(9,29,44,.72);text-align:left}.player-team-dot{width:12px;height:12px;border-radius:50%;flex:0 0 12px;box-shadow:0 0 0 4px rgba(255,255,255,.06)}.player-team-identity b{display:block;color:#fff}.team-draft-status{margin-top:9px;padding:7px 9px;border-radius:10px;background:rgba(93,169,255,.08);border:1px solid rgba(93,169,255,.15)}
@media(max-width:620px){.team-card-top{grid-template-columns:auto minmax(0,1fr) auto}.team-card-top [data-team-dissolve]{grid-column:2 / -1;width:100%}.team-player-row{grid-template-columns:28px minmax(0,1fr);}.team-player-row .team-mini-badge,.team-player-row>.badge{grid-column:2;justify-self:start}.team-builder-head{align-items:flex-start}}

/* v3.3 – mistake-proof party flow, presence and recovery */
.host-status-bar{grid-template-columns:repeat(5,minmax(95px,1fr)) auto}
.host-status-item.connection-warning{background:rgba(137,71,34,.28);border-color:rgba(255,173,89,.38)}
.host-status-item.connection-warning b{color:#ffd08a}
.presence-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;vertical-align:1px;background:#687d8f;box-shadow:0 0 0 3px rgba(104,125,143,.09)}
.presence-dot.online{background:var(--green);box-shadow:0 0 0 3px rgba(59,221,138,.10)}
.presence-dot.offline{background:var(--red);box-shadow:0 0 0 3px rgba(255,109,125,.10)}
.team-player-row.player-offline{opacity:.72;border-style:dashed}
.team-online-note{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:rgba(59,221,138,.08);border:1px solid rgba(59,221,138,.18);color:#9df0c2;font-size:11px;font-weight:800}
.team-online-note.offline{background:rgba(255,109,125,.08);border-color:rgba(255,109,125,.18);color:#ffadb6}
.waiting-chip.offline{background:rgba(255,109,125,.10);border-color:rgba(255,109,125,.28);color:#ffc0c7}
.scorechip.competitor-offline{opacity:.68;border-style:dashed}
.host-toast-stack{position:fixed;right:22px;bottom:22px;z-index:120;display:grid;gap:9px;width:min(390px,calc(100vw - 32px));pointer-events:none}
.host-toast{transform:translateY(12px);opacity:0;padding:13px 15px;border-radius:14px;border:1px solid rgba(105,158,202,.38);background:rgba(7,26,41,.96);box-shadow:0 18px 48px rgba(0,0,0,.32);color:#eaf6ff;font-weight:780;transition:.2s ease;backdrop-filter:blur(14px)}
.host-toast.show{transform:translateY(0);opacity:1}.host-toast.success{border-color:rgba(59,221,138,.42);color:#a7f1c7}.host-toast.error{border-color:rgba(255,109,125,.46);color:#ffc0c7}.host-toast.info{border-color:rgba(93,169,255,.4)}
.active-games-panel{width:min(1180px,100%);margin-top:18px;padding:22px;border:1px solid rgba(108,157,198,.24);border-radius:24px;background:rgba(8,24,38,.78);box-shadow:0 14px 40px rgba(0,0,0,.16)}
.active-games-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px}.active-games-head h2{margin:4px 0 0;font-size:25px}.active-games-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.active-game-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px;padding:14px 15px;border:1px solid rgba(101,151,190,.22);border-radius:15px;background:rgba(15,39,58,.72);transition:.15s ease}.active-game-card:hover{transform:translateY(-1px);border-color:rgba(93,169,255,.5);background:rgba(20,50,73,.82)}
.active-game-code{font-size:18px;font-weight:950;letter-spacing:.08em;color:#8bc8ff}.active-game-main{min-width:0}.active-game-main b{display:block}.active-game-main span{display:block;margin-top:3px;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.active-game-arrow{font-size:12px;font-weight:850;color:#86c3ff;white-space:nowrap}
#nextQ:disabled{background:rgba(34,57,76,.72);border-color:rgba(109,151,185,.22);color:#9eb0bf;box-shadow:none}
@media(max-width:1050px){.host-status-bar{grid-template-columns:repeat(3,minmax(110px,1fr))}.host-status-audio{grid-column:auto}.host-status-actions{grid-column:span 3;justify-content:stretch}.host-status-actions .btn{flex:1}}
@media(max-width:760px){.active-games-grid{grid-template-columns:1fr}.active-game-card{grid-template-columns:auto minmax(0,1fr)}.active-game-arrow{grid-column:2}}
@media(max-width:620px){.host-status-bar{grid-template-columns:1fr 1fr}.host-status-audio{grid-column:span 2}.host-status-actions{grid-column:span 2}.host-toast-stack{right:16px;bottom:16px}.active-games-panel{padding:16px}.active-games-head{align-items:flex-start}.active-game-code{font-size:16px}}

/* v3.5 - Sifferquiz / Närmast vinner */
.numeric-input{font-size:clamp(28px,8vw,46px)!important;font-weight:800;text-align:center;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.numeric-result-card{margin-top:14px;padding:16px;border:1px solid rgba(96,165,250,.28);border-radius:16px;background:rgba(10,23,34,.72)}
.numeric-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.numeric-result-head b{display:block;font-size:clamp(20px,4vw,30px);margin-top:4px}
.numeric-result-rows table{margin:0}
.game-mode-tabs{display:flex;gap:8px;flex-wrap:wrap}
.game-mode-tabs .tab{min-height:44px}
@media(max-width:640px){.numeric-result-head{flex-direction:column}.numeric-result-card{padding:12px}.game-mode-tabs .tab{flex:1 1 100%}}