/* Gameplay stays visible through the HUD; text retains its own contrast. */
.club-game .panel{background:#171728c7;backdrop-filter:none;box-shadow:0 3px 12px #08091233;border-color:#d2c7ed55}
.club-game #hud .panel{background:#14182666;text-shadow:0 1px 3px #000b}
.club-game #hud .panel button{background:#1d24343d;border-color:#ede5ff70}
.club-game #hud .panel button:active{background:#bacce344}
.club-game #hud .panel :is(.fine,span,small){color:#f1eafb}
.club-game .bottom .radar{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));left:auto;bottom:auto;width:280px;min-width:0;max-width:none}
.club-game .scores{position:fixed;left:18px;top:240px;width:250px;max-height:calc(100dvh - 410px);overflow:auto}
.club-game :is(#toast,#aimLabel,#danger,#streamStatus){background:#151a286b;box-shadow:0 2px 8px #0002;text-shadow:0 1px 3px #000b;border-color:#ddd2ff73}
.club-game .apple-threat{background:#512b204a;border-color:#ffc48b66}
.club-game .apple-threat-next{background:#ffe1ae52;color:#fff2d7}
html[data-touch=true]{--touch-radar-width:260px}
html[data-touch=true] .club-game .bottom .radar{position:fixed;left:auto;top:max(10px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));bottom:auto;width:var(--touch-radar-width);max-width:none;min-width:0;box-shadow:0 2px 8px #0002}
html[data-touch=true] .club-game .topbar .compact{width:auto;max-width:calc(100vw - var(--touch-radar-width) - 42px)}
html[data-touch=true] .club-game .gadget{box-shadow:0 2px 8px #0002}
/* A single mounted answer field keeps the keyboard steady when Next is tapped. */
.club-game #quizDialog{
 position:fixed;inset:auto;margin:0;left:calc(var(--visual-left,0px) + var(--visible-width,100vw) / 2);
 top:calc(var(--visual-top,0px) + var(--visible-height,100dvh) / 2);transform:translate(-50%,-50%);
 width:min(510px,calc(var(--visible-width,100vw) - 24px));max-height:calc(var(--visible-height,100dvh) - 20px);
 padding:22px;overflow:auto;overscroll-behavior:contain;border:1px solid #d1c6e889;border-top:4px solid #ffbd79;
 background:#1b1a2be6;color:#fff5e7;border-radius:20px;box-shadow:0 10px 35px #0004
}
#quizDialog::backdrop{background:#080f1d5c}
#quizDialog .quiz-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
#quizDialog h2{font-size:24px;line-height:1.1;letter-spacing:-.4px;margin:6px 0 0;color:#fff3dd}
#quizDialog .eyebrow{font-size:9px;letter-spacing:1.1px;color:#ffd49d}
#quizDialog .quiz-step{background:#bda5ff26;color:#e4d8ff;border:1px solid #bda5ff60;padding:8px 10px;border-radius:10px;font-size:12px;font-weight:700;white-space:nowrap}
#quizDialog #quizGoal{margin:12px 0 8px;font-size:12px;line-height:1.35;color:#d4cedf}
#quizProgress{display:block;width:100%;height:5px;appearance:none;border:0;border-radius:10px;background:#ffffff1c;overflow:hidden;margin:0 0 18px}
#quizProgress::-webkit-progress-bar{background:#ffffff1c}#quizProgress::-webkit-progress-value{background:#d4ff50}#quizProgress::-moz-progress-bar{background:#d4ff50}
#quizDialog #quizForm{margin:0}
#quizDialog #quizQuestions{display:block;padding:18px;border:1px solid #bca8cf55;border-radius:14px;background:#ffffff08}
#quizDialog .quiz-question-head{display:flex;align-items:center;gap:16px}
#quizDialog .quiz-number{min-width:36px;height:28px;background:#cfbaff;color:#302044;font-size:12px;border-radius:7px}
#quizDialog .quiz-equation{font-size:27px;line-height:1.2;letter-spacing:.6px;color:#fff9eb;font-weight:700}
#quizDialog #quizQuestions .quiz-answer{background:transparent;display:flex;align-items:center;gap:16px;margin:20px 0 0;padding:0}
#quizDialog .quiz-answer>span{font-size:23px;color:#e0ff95;white-space:nowrap}
#quizDialog #quizAnswer{font-size:24px!important;min-width:0;min-height:50px;width:100%;padding:9px 12px;border:1px solid #b7a9d0;border-radius:10px;background:#0e142966;color:#fff;line-height:1.2;margin:0;scroll-margin:12px}
#quizAnswer::placeholder{color:#beb8cc;font-size:17px}#quizAnswer[aria-invalid=true]{border-color:#ffbf80!important}
#quizDialog #quizError{font-size:12px;color:#ffd49d;line-height:1.3;margin:0}#quizDialog #quizError:not(:empty){margin:8px 0 0}
#quizDialog .quiz-actions{display:flex;gap:12px;margin-top:16px}
#quizDialog .quiz-actions button{min-height:48px;margin:0;padding:10px 15px;font-size:15px;font-weight:700;touch-action:manipulation}
#quizDialog #quizBack{flex:0 0 100px;background:#9e8ac222;color:#fff;border-color:#bca8cf77}
#quizDialog #quizSubmit{flex:1;width:auto;background:#d4ff50;color:#182413;border-color:#e7ff9f}
#quizDialog .quiz-safe{font-size:11px;line-height:1.4;color:#cec8dc;margin:12px 0 0}
#quizDialog #quizResult{font-size:12px;line-height:1.4;color:#ffdfa2;max-height:none}#quizDialog #quizResult:not(:empty){margin:0 0 8px}
#quizDialog #quizReview{margin:0 0 12px;font-size:12px;color:#ece1ff}#quizDialog #quizReview summary{padding:5px 0;min-height:26px;font-size:12px}
#quizDialog #quizReviewList{max-height:110px;overflow:auto;margin-top:4px}#quizDialog #quizReviewList p{font-size:13px;line-height:1.4;margin:6px 0}
html[data-compact-viewport=true] #quizDialog{padding:14px 18px;border-radius:16px}
html[data-compact-viewport=true] #quizDialog h2{font-size:20px}
html[data-compact-viewport=true] #quizDialog .eyebrow,html[data-compact-viewport=true] #quizDialog .quiz-safe{display:none}
html[data-compact-viewport=true] #quizDialog #quizGoal{margin:7px 0;font-size:11px}
html[data-compact-viewport=true] #quizProgress{margin-bottom:10px}
html[data-compact-viewport=true] #quizDialog #quizQuestions{padding:12px}
html[data-compact-viewport=true] #quizDialog #quizQuestions .quiz-answer{margin-top:12px}
html[data-compact-viewport=true] #quizDialog .quiz-actions{margin-top:12px}
html[data-tight-viewport=true] #quizDialog{padding:10px 14px}
html[data-tight-viewport=true] #quizDialog h2{font-size:18px}
html[data-tight-viewport=true] #quizDialog #quizQuestions{display:flex;align-items:center;gap:14px}
html[data-tight-viewport=true] #quizDialog .quiz-question-head{flex:1;gap:8px}
html[data-tight-viewport=true] #quizDialog .quiz-equation{font-size:22px}
html[data-tight-viewport=true] #quizDialog #quizQuestions .quiz-answer{flex:0 0 41%;margin:0;gap:8px}
html[data-tight-viewport=true] #quizDialog #quizAnswer{font-size:22px!important;padding:7px 9px}
html[data-tight-viewport=true] #quizDialog #quizResult{font-size:11px}
@media(max-width:600px) and (orientation:portrait){
 html[data-touch=true]{--touch-radar-width:164px}
 html[data-touch=true] .apple-threat{display:none}
 html[data-touch=true] .roomline{font-size:10px;gap:5px}
 html[data-touch=true] .roomline button{font-size:10px;padding:6px 8px}
 html[data-touch=true] #connection{font-size:9px}
 html[data-touch=true] .club-game .bottom .radar{padding:8px}
 html[data-touch=true] .radar #sound{position:static;min-height:34px}
 html[data-touch=true] .compass-reading p small{display:none}
 #quizDialog .quiz-step{font-size:10px;padding:7px}
 #quizDialog h2{font-size:21px}
 html[data-tight-viewport=true] #quizDialog #quizQuestions{display:block}
 html[data-tight-viewport=true] #quizDialog #quizQuestions .quiz-answer{margin-top:8px}
}