:root{font-family:Inter,Arial,sans-serif;color:#10223d;background:#edf3ff}body{margin:0}.wrap{max-width:1220px;margin:auto;padding:22px}.card{background:white;border-radius:24px;padding:22px;margin:14px 0;box-shadow:0 12px 34px #15315c18}.hero{background:radial-gradient(circle at top left,#37d5ff33,transparent 35%),linear-gradient(135deg,#3157ff,#7b2cff);color:white}.big{font-size:44px;font-weight:950;letter-spacing:-1px}.grid{display:grid;grid-template-columns:360px 1fr;gap:16px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.row{display:flex;gap:14px;flex-wrap:wrap}.grow{flex:1;min-width:280px}.muted{opacity:.7}.copyBox{background:#f4f7ff;border:1px dashed #b9c7ff;border-radius:14px;padding:12px;margin:8px 0;word-break:break-all}.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}button,.fileBtn{border:0;border-radius:14px;padding:13px 18px;font-weight:850;background:#3157ff;color:white;cursor:pointer;display:inline-block}button.secondary,.fileBtn{background:#eef2ff;color:#263b73}button.mini{font-size:12px;padding:8px 11px;border-radius:10px}.danger{background:#ffebed!important;color:#a0182a!important}input,select{padding:14px;border-radius:12px;border:1px solid #cbd4ea;width:100%;box-sizing:border-box;margin:6px 0}.fileBtn input{display:none}.pill{background:#edf2ff;border-radius:999px;padding:8px 12px;display:inline-block;color:#19305f}.hot{background:#fff2a8;color:#1c1c1c}img.qr{width:245px;height:245px;border:10px solid white;border-radius:22px;box-shadow:0 8px 24px #0002}.qrCard{text-align:center}.questionPreview{background:#f8fbff;border-radius:18px;padding:16px;margin-top:12px}.option{display:block;width:100%;text-align:left;margin:10px 0;background:#f1f5ff;color:#102}.option:disabled{opacity:.55}.correct{background:#dbffe5}.wrong{background:#ffe0e0}.playerCard{display:flex;align-items:center;gap:12px;border:1px solid #e8eeff;background:linear-gradient(180deg,#fff,#f8fbff);border-radius:18px;padding:12px;margin:10px 0;position:relative;overflow:hidden}.playerCard.rank1{background:linear-gradient(135deg,#fff7d6,#fff)}.playerCard.rank2{background:linear-gradient(135deg,#f1f4ff,#fff)}.playerCard.rank3{background:linear-gradient(135deg,#fff0df,#fff)}.avatar{font-size:34px;width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:#eef4ff}.pcBody{flex:1}.bar{height:8px;background:#e8eefc;border-radius:99px;overflow:hidden;margin:8px 0}.bar span{display:block;height:100%;background:linear-gradient(90deg,#3157ff,#10c878);border-radius:99px}.liveDot{width:10px;height:10px;border-radius:50%;background:#18d16f;box-shadow:0 0 0 6px #18d16f22}.leader{display:flex;justify-content:space-between;border-bottom:1px solid #eef;padding:10px}.qItem{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;border-bottom:1px solid #eef;padding:12px 0}.qItem small{color:#667}.form{background:#f8fbff;border-radius:18px;padding:14px;margin:12px 0}@media(max-width:820px){.grid{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}.big{font-size:30px}.wrap{padding:12px}img.qr{width:210px;height:210px}.qItem{grid-template-columns:1fr}}

.liveDot.offline{opacity:.25;filter:grayscale(1)}
.online{color:#20d67b;font-weight:800}.offline{color:#9aa4b2}
.playerCard{transition:transform .15s ease, box-shadow .15s ease}.playerCard:hover{transform:translateY(-2px)}


/* Reveal Result Popup v0.8 */
.resultOverlay{position:fixed;inset:0;background:rgba(7,15,35,.72);backdrop-filter:blur(6px);z-index:9999;display:grid;place-items:center;padding:18px;animation:fadeIn .18s ease}
.resultModal{width:min(860px,96vw);max-height:92vh;overflow:auto;border-radius:30px;background:radial-gradient(circle at top left,#fff7bf 0,#ffffff 28%,#f5f8ff 100%);box-shadow:0 30px 90px #0007;position:relative;padding:28px;border:1px solid #ffffffaa;animation:popIn .28s cubic-bezier(.2,1.25,.32,1)}
.resultTitle{text-align:center;font-size:42px;font-weight:950;letter-spacing:-1px;margin:4px 0 6px;background:linear-gradient(90deg,#ff9d00,#3157ff,#8a2cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.resultSub{text-align:center;color:#4d5d80;font-weight:750;margin-bottom:18px}.podium{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:12px;align-items:end;margin:16px 0 22px}.podiumCard{border-radius:24px;padding:18px;text-align:center;background:white;box-shadow:0 10px 30px #243a7118;border:1px solid #eaf0ff;min-height:130px;display:grid;place-items:center}.podiumCard.first{min-height:170px;background:linear-gradient(160deg,#fff3a8,#fff,#eef4ff);transform:translateY(-8px)}.podiumMedal{font-size:42px}.podiumName{font-size:20px;font-weight:950;margin-top:6px}.podiumScore{font-size:15px;color:#52617f;font-weight:800}.resultList{background:#ffffffaa;border-radius:20px;padding:12px}.resultModal .closeBtn{position:absolute;top:14px;right:14px;border-radius:999px;background:#111b33;color:white;padding:10px 14px}.confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:30px}.confetti i{position:absolute;top:-20px;width:10px;height:16px;border-radius:3px;animation:fall 1.9s linear forwards;opacity:.95}.confetti i:nth-child(3n){background:#ffbd00}.confetti i:nth-child(3n+1){background:#3157ff}.confetti i:nth-child(3n+2){background:#ff4d8d}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes popIn{from{opacity:0;transform:scale(.88) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes fall{to{transform:translateY(105vh) rotate(720deg)}}@media(max-width:680px){.resultTitle{font-size:30px}.podium{grid-template-columns:1fr}.podiumCard.first{transform:none;min-height:135px}}


/* v0.9 - Bigger reveal scores */
.resultOverlay .podiumScore{font-size:28px!important;font-weight:950!important;color:#10223d!important;margin-top:8px;line-height:1.25}
.resultOverlay .podiumScore .scoreNum{font-size:42px;display:block;color:#3157ff;text-shadow:0 6px 18px #3157ff22}
.resultOverlay .playerCard small{font-size:18px;font-weight:900;color:#263b73}
.resultOverlay .pcBody b{font-size:22px}.resultOverlay .avatar{font-size:42px;width:68px;height:68px}.resultOverlay .liveDot{display:none}
.waitForm{background:#f8fbff;border:1px dashed #cbd8ff;border-radius:18px;padding:14px;margin-top:12px}


/* v0.16 game-style player cards + compact avatar picker */
.avatarPicker{display:flex;gap:8px;overflow-x:auto;padding:8px 2px 12px;margin:4px 0 8px;scrollbar-width:thin}.avatarChoice{min-width:44px;height:44px;border-radius:14px;padding:0;background:#f1f5ff;color:#10223d;font-size:24px;display:grid;place-items:center;border:2px solid transparent;box-shadow:0 4px 12px #15315c10}.avatarChoice.selected{border-color:#3157ff;background:#e7edff;transform:translateY(-1px)}
.avatarWrap{position:relative;display:grid;place-items:center}.crown{position:absolute;top:-16px;font-size:22px;filter:drop-shadow(0 5px 8px #0002)}.statusLine{font-size:13px;font-weight:800;margin-top:3px}.spark{color:#13a552;font-weight:950}.scoreBox{min-width:92px;text-align:center;background:#f4f7ff;border-radius:16px;padding:8px 10px;border:1px solid #e2e9ff}.scoreLabel{display:block;font-size:11px;font-weight:900;color:#667596;text-transform:uppercase}.scoreValue{display:block;font-size:30px;line-height:1;font-weight:1000;color:#3157ff;text-shadow:0 6px 18px #3157ff22}.scoreBox small{display:block;font-size:11px;color:#51617f;margin-top:4px}.leaderGlow{border-color:#ffe082!important;box-shadow:0 0 0 2px #ffe08255,0 16px 38px #ffca2830!important;animation:leaderPulse 1.25s ease-in-out infinite}.correctFlash{animation:correctFlash 1.15s ease-in-out 3}.rank1 .scoreValue{color:#f59f00}.rank1 .avatar{background:#fff4c4}.resultOverlay .scoreBox{background:#fff;border-color:#dfe7ff}.resultOverlay .scoreValue{font-size:42px}@keyframes leaderPulse{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.012)}}@keyframes correctFlash{0%,100%{background:linear-gradient(180deg,#fff,#f8fbff)}35%{background:#d8ffe6;box-shadow:0 0 0 3px #2ee66b44,0 16px 42px #20d67b35}}@media(max-width:620px){.playerCard{align-items:flex-start}.scoreBox{min-width:76px}.scoreValue{font-size:24px}}


/* v0.17 Student answer redesign */
.studentQuestion{padding:0;overflow:hidden;background:linear-gradient(180deg,#ffffff,#f8fbff)}
.studentQuestionHeader{padding:20px 20px 10px;border-bottom:1px solid #eef3ff;background:radial-gradient(circle at top left,#e9f0ff,transparent 42%),#fff}
.questionCount{display:inline-flex;align-items:center;gap:8px;background:#eef3ff;color:#3157ff;border-radius:999px;padding:7px 12px;font-size:13px;font-weight:950;margin-bottom:10px}
.questionText{font-size:26px;line-height:1.28;margin:4px 0 10px;font-weight:950;color:#10223d;letter-spacing:-.3px}
.answerGrid{display:grid;gap:12px;padding:16px 18px 20px}
.answerBtn{width:100%;display:flex;align-items:center;gap:14px;text-align:left;background:#fff;color:#10223d;border:2px solid #e1e9ff;border-radius:22px;padding:16px 18px;box-shadow:0 8px 24px #15315c10;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease,background .12s ease;min-height:72px;position:relative;overflow:hidden}
.answerBtn:hover{transform:translateY(-1px);box-shadow:0 12px 30px #15315c18;border-color:#b9c9ff}.answerBtn:active{transform:scale(.985)}
.answerLetter{width:42px;height:42px;min-width:42px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#3157ff,#7b2cff);color:#fff;font-size:20px;font-weight:1000;box-shadow:0 8px 18px #3157ff28}.answerText{font-size:20px;font-weight:850;line-height:1.25;flex:1}.answerTapHint{font-size:13px;color:#71809e;font-weight:800;opacity:.75}.answerBtn.selected{border-color:#3157ff;background:#eef4ff;box-shadow:0 0 0 4px #3157ff18,0 12px 32px #3157ff1c}.answerBtn.selected .answerLetter{background:linear-gradient(135deg,#13b85d,#23d77a)}.answerBtn.selected::after{content:'Submitted';position:absolute;right:14px;top:10px;background:#13b85d;color:white;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:950}.answerBtn:disabled{opacity:.62;cursor:not-allowed;transform:none}.answerBtn.selected:disabled{opacity:1}.answerStatus{margin:0 18px 18px;border-radius:18px;padding:12px 14px;background:#eefaf2;color:#0b7a35;font-weight:900;border:1px solid #bff0cf;display:none}.answerStatus.show{display:block;animation:statusPop .18s ease}.revealBox{margin:0 18px 20px;border-radius:20px;padding:16px;background:#eafbf0;border:1px solid #b9efca;color:#10223d}.revealBox h3{margin:0 0 8px;font-size:22px}.revealBox p{margin:0;font-size:16px;font-weight:700;color:#38516c}@keyframes statusPop{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(max-width:620px){.questionText{font-size:22px}.answerBtn{padding:14px;min-height:66px;border-radius:19px}.answerLetter{width:38px;height:38px;min-width:38px;border-radius:14px}.answerText{font-size:18px}.answerTapHint{display:none}}

/* v0.18 Timer + Arrange Sentence */
.timerSetting{display:grid;grid-template-columns:1fr 90px auto;gap:8px;align-items:end;margin:14px 0;background:#f8fbff;border:1px solid #e7eeff;border-radius:18px;padding:12px}.timerSetting label{font-size:13px;font-weight:900;color:#52617f}.teacherTimer,.timerBox{background:#f8fbff;border:1px solid #e5ecff;border-radius:18px;padding:12px;margin:10px 0}.timerBox{display:grid;gap:8px}.timerLabel{font-size:12px;text-transform:uppercase;color:#667596;font-weight:950;margin-right:8px}.countdownNum{font-size:40px;line-height:1;font-weight:1000;color:#3157ff}.countdownNum.dangerTime{color:#ff304f;animation:timePulse .8s ease-in-out infinite}.timerSec{font-size:14px;font-weight:900;color:#667596;margin-left:4px}.countdownTrack{height:10px;background:#e7edff;border-radius:999px;overflow:hidden}.countdownTrack span{display:block;height:100%;background:linear-gradient(90deg,#10c878,#3157ff);border-radius:999px;transition:width .25s ease}.dangerTime + .timerSec + .countdownTrack span{background:#ff304f}.arrangeArea{padding:16px 18px 20px;display:grid;gap:14px}.sentenceBox{min-height:62px;border:2px dashed #cbd8ff;background:#f8fbff;border-radius:20px;padding:12px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.selectedWord,.wordChip{border:0;border-radius:14px;padding:11px 14px;font-size:18px;font-weight:900;background:#eef4ff;color:#10223d;box-shadow:0 6px 16px #15315c10}.wordBank{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}.wordChip{cursor:pointer;background:#fff;border:2px solid #dfe8ff}.wordChip:hover{border-color:#3157ff;transform:translateY(-1px)}.wordChip:disabled{opacity:.38;cursor:not-allowed;transform:none}.wordChip.static{display:inline-block;cursor:default}.arrangeActions{display:flex;gap:10px;flex-wrap:wrap}.bigAnswer{font-size:24px;font-weight:950;color:#3157ff;background:#eef4ff;border-radius:16px;padding:12px}.revealBox{margin:0 18px 20px;background:#eafff1;border:1px solid #bff4cf;border-radius:20px;padding:16px}.answerStatus{margin:0 18px 18px;padding:12px 14px;border-radius:16px;background:#eef4ff;color:#3157ff;font-weight:950;display:none}.answerStatus.show{display:block}@keyframes timePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}@media(max-width:720px){.timerSetting{grid-template-columns:1fr}.countdownNum{font-size:34px}.selectedWord,.wordChip{font-size:16px}.arrangeActions button{flex:1}}


/* v0.19 audio countdown polish */
.timerSetting input{max-width:110px}.teacherTimer,.timerBox{border:1px solid #dfe7ff;background:#f7faff;border-radius:18px;padding:12px;margin:10px 0}.countdownNum{font-size:42px;font-weight:1000;color:#3157ff;margin:0 5px;display:inline-block;min-width:48px;text-align:center}.timerLabel{font-size:12px;font-weight:950;text-transform:uppercase;color:#667596}.timerSec{font-weight:900;color:#667596}.dangerTime{color:#ff3157!important;animation:timerPulse .38s ease-in-out infinite}.countdownTrack{height:10px;background:#dfe7ff;border-radius:999px;overflow:hidden;margin-top:8px}.countdownTrack span{display:block;height:100%;background:linear-gradient(90deg,#3157ff,#13d66d);border-radius:999px;transition:width .25s ease}.dangerTime~.timerSec + .countdownTrack span,.timerBox:has(.dangerTime) .countdownTrack span{background:linear-gradient(90deg,#ff3157,#ffb000)}@keyframes timerPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}


/* v0.21 Compact timer + projector-friendly question area */
.compactTimer{display:flex!important;align-items:center!important;gap:8px!important;margin:10px 0 6px!important;padding:8px 10px!important;border-radius:14px!important;background:#f7faff!important;border:1px solid #e0e8ff!important}
.compactTimer .timerTinyLabel{font-size:12px;font-weight:950;color:#536381;white-space:nowrap}
.compactTimer input{width:70px!important;max-width:70px!important;margin:0!important;padding:8px 9px!important;border-radius:10px!important;font-weight:950;text-align:center}
.compactTimer button{padding:8px 12px!important;margin:0!important;border-radius:10px!important}
.teacherTimer{padding:8px 10px!important;margin:6px 0 10px!important;border-radius:14px!important;display:grid;gap:6px}.teacherTimer b{font-size:15px}.teacherTimer .countdownTrack{height:7px!important;margin-top:0!important}.questionPreview{padding:18px 20px!important}.questionPreview h2{font-size:32px;line-height:1.2;margin:8px 0 14px}.questionPreview .pill{font-size:18px;margin:5px 6px 5px 0;padding:10px 14px}.studentQuestionHeader{padding-top:16px!important}.timerBox{padding:9px 12px!important;margin:8px 0 12px!important;border-radius:16px!important}.timerBox .countdownTrack{height:8px!important}.timerBox .countdownNum{font-size:34px!important}.questionText{font-size:28px!important}@media(min-width:980px){#live .questionPreview{min-height:320px}.questionPreview h2{font-size:38px}.questionPreview .pill{font-size:21px}.questionText{font-size:32px!important}}


/* v0.22 Move time control into Start / Reveal / Next toolbar */
.gameControlCard h2{margin-bottom:10px}
.controlRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0 8px}
.controlRow button{margin:0!important}
.inlineTimer{margin:0!important;display:inline-flex!important;align-items:center!important;gap:7px!important;flex:0 0 auto!important;min-height:40px!important;padding:6px 8px!important;background:#f6f9ff!important;border:1px solid #dde8ff!important}
.inlineTimer .timerTinyLabel{font-size:11px!important;color:#536381!important;font-weight:950!important;line-height:1;white-space:nowrap!important}
.inlineTimer input{height:34px!important;width:58px!important;max-width:58px!important;padding:5px 6px!important;font-size:15px!important}
.inlineTimer button{height:34px!important;padding:6px 10px!important;font-size:12px!important}
@media(max-width:720px){.controlRow{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px}.controlRow .inlineTimer{grid-column:1/-1;justify-content:center}.controlRow button{width:100%}}


/* v0.23 Compact control status for projector layout */
.controlStatus{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto;min-height:38px}
.controlStatus .pill{font-size:12px!important;font-weight:950!important;padding:7px 10px!important;margin:0!important;white-space:nowrap;background:#f0f5ff;color:#263b73;border:1px solid #dfe8ff}
.controlStatus .statusPill{background:#eefaf2;color:#10743b;border-color:#c9efd5;text-transform:capitalize}.controlStatus .qPill{background:#fff7df;color:#6d4b00;border-color:#ffe6a8}
#live > h3{display:none!important}.gameControlCard{padding-bottom:16px!important}.questionPreview{margin-top:8px!important}.questionPreview h2{margin-top:4px!important}
@media(max-width:920px){.controlStatus{margin-left:0;width:100%;justify-content:center}.controlStatus .pill{flex:1;text-align:center}.controlRow{align-items:stretch}}
@media(min-width:980px){.controlRow{gap:9px}.gameControlCard h2{display:none}.questionPreview{min-height:360px!important}.questionPreview h2{font-size:42px!important}}

/* v0.24 final flow */
.startedBtn{background:#d7dce8!important;color:#6d778d!important;cursor:default!important;box-shadow:none!important}
.finalOverlay .resultTitle{font-size:48px}.finalModal{background:radial-gradient(circle at top,#fff1a6 0,#fff 34%,#eef6ff 100%)}
.finalReady{text-align:center;display:grid;place-items:center}.finalReady h2{font-size:46px!important;color:#3157ff}
.controlRow{align-items:center!important}.controlRow #startBtn{min-width:110px}


/* v0.25 Teacher question display fix */
.teacherQuestion{background:linear-gradient(180deg,#ffffff,#f6f9ff)!important;border:1px solid #e3ebff;border-radius:22px!important;padding:18px 22px!important;margin-top:8px!important;min-height:360px;display:flex;flex-direction:column;justify-content:flex-start;overflow:visible!important}
.teacherQuestion.idleQuestion{min-height:240px;align-items:center;justify-content:center;text-align:center}.teacherQuestion.idleQuestion h2{font-size:44px!important;color:#3157ff}.teacherQuestion.isReveal{background:linear-gradient(180deg,#fff,#f0fff5)!important;border-color:#bff4cf!important}
.projectorQuestionText{font-size:42px!important;line-height:1.17!important;margin:8px 0 16px!important;color:#10223d;letter-spacing:-.5px}.questionTypeBadge{align-self:flex-start;background:#edf2ff;color:#3157ff;font-weight:950;border-radius:999px;padding:8px 13px;margin-bottom:4px}.teacherOptionGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}.teacherOption{display:flex;align-items:center;gap:12px;background:#fff;border:2px solid #e0e8ff;border-radius:18px;padding:14px 16px;box-shadow:0 8px 22px #15315c10;min-height:62px}.teacherOption span{width:38px;height:38px;min-width:38px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#3157ff,#7b2cff);color:#fff;font-weight:1000;font-size:20px}.teacherOption b{font-size:22px;line-height:1.2}.teacherOption.correctOption{background:#eafff1;border-color:#4bd47c;box-shadow:0 0 0 4px #4bd47c22,0 12px 28px #20d67b22}.teacherAnswerBox{margin-top:16px;background:#eafff1;border:1px solid #bff4cf;border-radius:18px;padding:14px 16px}.teacherAnswerBox h3{margin:0 0 8px}.teacherWordBank{margin-top:8px}.compactTopTimer{margin:0 0 12px!important}.compactTopTimer b{font-size:18px!important;color:#3157ff}.finalReady{align-items:center;justify-content:center;text-align:center}.finalReady h2{font-size:44px!important;color:#f59f00}
@media(max-width:900px){.teacherOptionGrid{grid-template-columns:1fr}.projectorQuestionText{font-size:32px!important}.teacherOption b{font-size:18px}.teacherQuestion{min-height:280px}}
@media(min-width:1100px){.teacherQuestion{min-height:420px}.projectorQuestionText{font-size:48px!important}.teacherOption b{font-size:25px}}

/* v0.26 Teacher question top spacing fix */
#live{clear:both;display:block;padding-top:16px!important;margin-top:12px!important;position:relative;z-index:1;overflow:visible!important}
.gameControlCard{overflow:visible!important}
.controlRow{position:relative;z-index:3;margin-bottom:10px!important}
.teacherQuestion{position:relative;z-index:1;margin-top:14px!important;padding-top:30px!important;overflow:visible!important}
.questionTypeBadge{position:relative;z-index:2;margin-top:0!important;margin-bottom:12px!important;display:inline-flex!important;align-items:center;line-height:1.1!important;min-height:18px!important;box-shadow:0 4px 12px #15315c12}
.projectorQuestionText{margin-top:0!important;padding-top:0!important}
.compactTopTimer{margin-bottom:14px!important}
@media(min-width:980px){#live{padding-top:18px!important}.teacherQuestion{padding-top:34px!important;margin-top:16px!important}.questionTypeBadge{margin-bottom:14px!important}.projectorQuestionText{font-size:46px!important}}


/* v0.27 Restore Teacher question projector area */
.projectorCard{margin-top:12px!important;padding:16px 18px 20px!important;background:linear-gradient(180deg,#ffffff,#f8fbff)!important;overflow:visible!important;display:block!important;clear:both!important}
.teacherLiveArea{display:block!important;min-height:360px!important;overflow:visible!important;padding-top:0!important;margin-top:0!important;visibility:visible!important;opacity:1!important}
.projectorCard .teacherQuestion{display:flex!important;visibility:visible!important;opacity:1!important;margin-top:0!important;min-height:390px!important;padding-top:24px!important}
.topTeacherGrid{align-items:start!important;margin-bottom:0!important}.gameControlCard{min-height:auto!important}.gameControlCard #live{display:none!important}
.projectorCard .questionTypeBadge{margin-top:0!important;margin-bottom:12px!important}.projectorCard .projectorQuestionText{display:block!important;visibility:visible!important;color:#10223d!important}.projectorCard .teacherOptionGrid{display:grid!important}
@media(min-width:1100px){.teacherLiveArea{min-height:440px!important}.projectorCard .teacherQuestion{min-height:440px!important}.projectorCard .projectorQuestionText{font-size:50px!important}}
@media(max-width:900px){.projectorCard{padding:12px!important}.projectorCard .teacherQuestion{min-height:300px!important}}


/* v0.28 Teacher grouped layout */
.classroomHub{padding:16px 18px;margin-bottom:12px}.hubHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.hubHeader h2{margin:0;font-size:22px}.teacherDashboardGrid{display:grid;grid-template-columns:260px minmax(320px,1fr) minmax(300px,1fr);gap:14px;align-items:start}.hubPanel{background:#f8fbff;border:1px solid #e4ebff;border-radius:20px;padding:14px;min-height:180px}.hubPanel h3{margin:0 0 10px;font-size:18px}.qrMiniPanel{text-align:center}.compactQr{width:168px!important;height:168px!important;border-width:8px!important;border-radius:18px!important}.compactLink{font-size:12px;max-height:54px;overflow:auto;padding:8px;margin-top:8px}.pendingTitle{margin-top:16px!important}.playersPanel .playerCard,.leaderboardPanel .playerCard{padding:9px;margin:7px 0;border-radius:15px}.playersPanel .avatar,.leaderboardPanel .avatar{width:42px;height:42px;font-size:26px;border-radius:14px}.playersPanel .scoreBox,.leaderboardPanel .scoreBox{min-width:72px;padding:6px}.playersPanel .scoreValue,.leaderboardPanel .scoreValue{font-size:22px}.projectorStage{padding:14px 18px 20px;margin-top:12px}.projectorControlBar{display:grid;grid-template-columns:auto auto 1fr;gap:12px;align-items:center;padding:8px 10px;margin-bottom:14px;background:#f8fbff;border:1px solid #e2eaff;border-radius:18px}.controlLeft{display:flex;gap:8px;align-items:center}.controlMiddle{display:flex;align-items:center}.controlRight{justify-content:flex-end;margin:0!important}.projectorLiveBox{margin-top:0}.projectorStage .teacherQuestion{margin-top:0!important;padding-top:26px!important}.projectorStage .projectorQuestionText{font-size:clamp(32px,4.4vw,58px);line-height:1.12;margin-top:8px}.projectorStage .teacherOptionGrid{gap:14px}.projectorStage .teacherOption{font-size:clamp(20px,2.3vw,32px);padding:18px}.projectorStage .questionTypeBadge{margin-bottom:14px}@media(max-width:980px){.teacherDashboardGrid{grid-template-columns:1fr}.projectorControlBar{grid-template-columns:1fr}.controlRight{justify-content:flex-start}.controlLeft{flex-wrap:wrap}.compactQr{width:150px!important;height:150px!important}}

/* v0.29 leaderboard separated */
.classroomHub .teacherDashboardGrid{grid-template-columns:minmax(210px,280px) 1fr!important;}
.leaderboardStandalone{margin-top:14px;}
.leaderboardHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px;}
.leaderboardWide{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;}
.leaderboardWide .playerCard{margin:0;}
@media(max-width:900px){.classroomHub .teacherDashboardGrid{grid-template-columns:1fr!important;}}


/* v0.30 projector mode */
.compactQr{width:190px!important;height:190px!important;}
body.projectorMode .classroomHub,
body.projectorMode .card:has(#qManager){display:none!important;}
body.projectorMode .projectorStage,
body.projectorMode .leaderboardStandalone{display:block!important;max-width:100%!important;}
body.projectorMode .projectorStage{margin-top:0}


/* v0.31 Projector / Presenter Mode PRO */
body.projectorMode{background:#071122;color:#f8fbff;overflow:hidden}
body.projectorMode .wrap{max-width:none!important;width:100vw!important;height:100vh!important;padding:12px!important;margin:0!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(260px,24vw)!important;grid-template-rows:1fr!important;gap:12px!important;box-sizing:border-box!important}
body.projectorMode .hero,
body.projectorMode .classroomHub,
body.projectorMode .card:has(#qManager){display:none!important}
body.projectorMode .projectorStage{display:flex!important;flex-direction:column!important;grid-column:1!important;grid-row:1!important;margin:0!important;height:calc(100vh - 24px)!important;min-height:0!important;border-radius:24px!important;background:radial-gradient(circle at 20% 0%,#2e5bff30,transparent 38%),linear-gradient(180deg,#0f1d3c,#0b1430)!important;color:#fff!important;box-shadow:0 18px 60px #0008!important;border:1px solid #3550a0!important;overflow:hidden!important;padding:14px!important}
body.projectorMode .leaderboardStandalone{display:flex!important;flex-direction:column!important;grid-column:2!important;grid-row:1!important;margin:0!important;height:calc(100vh - 24px)!important;min-height:0!important;border-radius:24px!important;background:linear-gradient(180deg,#101f42,#081226)!important;color:#fff!important;border:1px solid #304a93!important;box-shadow:0 18px 60px #0008!important;overflow:hidden!important;padding:14px!important}
body.projectorMode .projectorControlBar{flex:0 0 auto!important;margin:0 0 12px!important;padding:8px 10px!important;border-radius:18px!important;background:#ffffff12!important;border:1px solid #ffffff20!important;color:#fff!important;grid-template-columns:auto auto 1fr!important;backdrop-filter:blur(10px)}
body.projectorMode .projectorControlBar button{padding:8px 12px!important;border-radius:12px!important;font-size:13px!important;box-shadow:none!important}
body.projectorMode .inlineTimer{background:#ffffff14!important;border-color:#ffffff24!important;color:#fff!important;padding:5px 7px!important}
body.projectorMode .inlineTimer .timerTinyLabel{color:#dce6ff!important}
body.projectorMode .inlineTimer input{height:30px!important;background:#ffffff!important;color:#10223d!important}
body.projectorMode .controlStatus .pill{background:#ffffff15!important;border-color:#ffffff24!important;color:#fff!important;font-size:12px!important;padding:6px 10px!important}
body.projectorMode #live{flex:1 1 auto!important;min-height:0!important;margin:0!important;padding:0!important;display:flex!important}
body.projectorMode .teacherQuestion{flex:1 1 auto!important;width:100%!important;margin:0!important;padding:22px!important;border-radius:22px!important;background:radial-gradient(circle at 50% 0%,#ffffff18,transparent 42%),#ffffff08!important;border:1px solid #ffffff18!important;display:flex!important;flex-direction:column!important;justify-content:center!important;color:#fff!important;overflow:hidden!important;box-sizing:border-box!important}
body.projectorMode .questionTypeBadge{align-self:flex-start!important;background:#ffe78a!important;color:#2b2300!important;border:0!important;font-size:15px!important;font-weight:1000!important;padding:8px 14px!important;border-radius:999px!important;margin-bottom:14px!important;box-shadow:0 8px 24px #0004!important}
body.projectorMode .projectorQuestionText{font-size:clamp(44px,6.2vw,88px)!important;line-height:1.06!important;color:#fff!important;text-align:center!important;letter-spacing:-1.2px!important;text-shadow:0 12px 42px #0009!important;margin:8px auto 26px!important;max-width:98%!important}
body.projectorMode .teacherOptionGrid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;margin-top:8px!important}
body.projectorMode .teacherOption{background:#ffffff12!important;color:#fff!important;border:2px solid #ffffff24!important;border-radius:20px!important;padding:18px 20px!important;font-size:clamp(20px,2.4vw,34px)!important;box-shadow:0 12px 30px #0004!important;min-height:82px!important;display:flex!important;align-items:center!important;gap:16px!important}
body.projectorMode .teacherOption span{background:#ffd85c!important;color:#111!important;min-width:46px!important;height:46px!important;border-radius:15px!important;display:grid!important;place-items:center!important;font-weight:1000!important}
body.projectorMode .teacherOption.correctOption{background:#12c46a35!important;border-color:#3cff9a!important;box-shadow:0 0 0 4px #22ff8a20,0 18px 40px #12c46a25!important}
body.projectorMode .teacherAnswerBox{background:#10c87822!important;border:1px solid #36ff9b66!important;border-radius:20px!important;padding:16px!important;margin-top:16px!important;text-align:center!important;color:#fff!important}
body.projectorMode .teacherAnswerBox h3{font-size:clamp(24px,3vw,42px)!important;margin:0 0 6px!important;color:#9cffc3!important}
body.projectorMode .teacherAnswerBox p{font-size:clamp(18px,2vw,28px)!important;color:#fff!important}
body.projectorMode .teacherTimer{position:absolute!important;top:18px!important;right:18px!important;width:140px!important;background:#00000040!important;border-color:#ffffff22!important;color:#fff!important;z-index:5!important}
body.projectorMode .teacherTimer b{font-size:22px!important;color:#fff!important}
body.projectorMode .teacherTimer .countdownTrack{height:8px!important;background:#ffffff22!important}
body.projectorMode .leaderboardHeader{flex:0 0 auto!important;margin-bottom:10px!important;padding-bottom:10px!important;border-bottom:1px solid #ffffff1c!important}
body.projectorMode .leaderboardHeader h2{font-size:24px!important;margin:0!important;color:#fff!important}
body.projectorMode .leaderboardHeader button{display:none!important}
body.projectorMode .leaderboardWide{flex:1 1 auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;gap:10px!important;overflow:hidden!important}
body.projectorMode .leaderboardWide .playerCard{background:#ffffff10!important;border:1px solid #ffffff1e!important;color:#fff!important;border-radius:18px!important;padding:12px!important;box-shadow:0 10px 30px #0004!important;margin:0!important;min-height:74px!important}
body.projectorMode .leaderboardWide .playerCard:nth-child(n+6){display:none!important}
body.projectorMode .leaderboardWide .avatar{width:48px!important;height:48px!important;font-size:30px!important;background:#ffffff18!important;color:#fff!important}
body.projectorMode .leaderboardWide .pcBody b{font-size:18px!important;color:#fff!important}
body.projectorMode .leaderboardWide small,body.projectorMode .leaderboardWide .statusLine{color:#d6e0ff!important}
body.projectorMode .leaderboardWide .scoreBox{background:#00000030!important;border-color:#ffffff20!important;color:#fff!important;min-width:76px!important}
body.projectorMode .leaderboardWide .scoreLabel{color:#afc2ff!important}.leaderboardWide .rank1 .scoreValue{color:#f59f00}
body.projectorMode .leaderboardWide .scoreValue{font-size:28px!important;color:#ffd85c!important}
body.projectorMode .leaderGlow{animation:projectorLeaderPulse 1.2s ease-in-out infinite!important;border-color:#ffe66d!important;box-shadow:0 0 0 3px #ffe66d22,0 18px 46px #ffd85c25!important}
body.projectorMode .finalReady h2{font-size:clamp(48px,7vw,98px)!important;color:#fff!important;text-shadow:0 14px 42px #0009!important}
body.projectorMode .idleQuestion h2{font-size:clamp(48px,7vw,96px)!important;color:#fff!important;text-align:center!important}
body.projectorMode .wordBank.teacherWordBank{justify-content:center!important}.wordBank.teacherWordBank .wordChip.static{font-size:clamp(20px,2.4vw,34px)!important}
body.projectorMode .finalOverlay .resultModal, body.projectorMode .resultModal{color:#10223d!important}
@keyframes projectorLeaderPulse{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.018)}}
@media(max-width:980px){body.projectorMode .wrap{grid-template-columns:1fr!important;grid-template-rows:1fr auto!important;overflow:auto!important}body.projectorMode{overflow:auto}body.projectorMode .projectorStage{height:auto!important;min-height:70vh!important}body.projectorMode .leaderboardStandalone{grid-column:1!important;grid-row:2!important;height:auto!important;max-height:34vh!important}body.projectorMode .teacherOptionGrid{grid-template-columns:1fr!important}body.projectorMode .projectorQuestionText{font-size:clamp(34px,9vw,62px)!important}}


/* v0.32 Unit Practice Mode */
.practiceSetup{background:#ffffff18;border:1px solid #ffffff33;border-radius:22px;padding:14px;margin:14px 0;backdrop-filter:blur(8px)}
.practiceSetup h3{margin:0 0 10px;font-size:20px}.practiceRow{display:grid;grid-template-columns:auto minmax(160px,1fr) minmax(180px,1fr) auto 82px;gap:8px;align-items:center}.practiceRow label{font-weight:950}.practiceRow select,.practiceRow input{margin:0;padding:10px 12px;border-radius:12px;border:1px solid #d7e1ff}.unitCheckGrid{display:none;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:6px;margin-top:10px}.unitCheckGrid label{background:#ffffff20;border:1px solid #ffffff2d;border-radius:12px;padding:8px;font-weight:850}.practiceHint{margin:10px 0 0;color:#eef4ff;font-weight:700}.practiceBadge{background:#fff7df;color:#6d4b00;border:1px solid #ffe2a0;border-radius:999px;padding:8px 12px;font-weight:950;font-size:13px}.hubHeader{flex-wrap:wrap}.questionTypeBadge{font-size:14px!important;letter-spacing:.2px}@media(max-width:760px){.practiceRow{grid-template-columns:1fr}.practiceRow label{margin-top:4px}.practiceRow select,.practiceRow input{width:100%;box-sizing:border-box}.unitCheckGrid{grid-template-columns:repeat(2,1fr)}}

/* v0.33 Course/Lesson/Skill selector */
.practiceSetup{border:1px solid #dbe7ff;background:linear-gradient(180deg,#f8fbff,#eef5ff);border-radius:22px;padding:14px;margin:14px 0;box-shadow:0 8px 24px rgba(33,80,160,.08)}
.practiceSetup h3{margin:0 0 10px}.practiceRow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0}.practiceRow label{font-weight:800;color:#24406a}.practiceRow select,.practiceRow input{border:1px solid #cbd8f0;border-radius:12px;padding:9px 11px;background:#fff;font-weight:700}.advancedPractice{padding-top:8px;border-top:1px dashed #c7d7f5}.unitCheckGrid{display:none;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-top:10px}.unitCheckGrid label{background:#fff;border:1px solid #dbe7ff;border-radius:12px;padding:8px;font-weight:700}.practiceHint{font-size:13px;color:#49627f;margin:8px 0 0}.practiceBadge{background:#e8f4ff;border:1px solid #c8e2ff;color:#14508a;border-radius:999px;padding:7px 12px;font-weight:900;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qItem small{display:block;color:#60708a;margin-top:5px;font-weight:700}

/* v0.34 Redesigned Unit Practice Mode - clear text + cleaner options */
.hero .practiceSetupClean{background:#ffffff!important;color:#10223d!important;border:1px solid #dbe7ff!important;border-radius:26px!important;padding:18px!important;margin:18px 0!important;box-shadow:0 18px 50px rgba(8,26,69,.22)!important;backdrop-filter:none!important}
.practiceTop{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.practiceTop h3{color:#10223d!important;font-size:24px!important;font-weight:1000!important;margin:0 0 4px!important}.practiceTop p{color:#5c6f8e!important;font-size:14px!important;font-weight:750!important;margin:0}.practiceModePill{background:linear-gradient(135deg,#3157ff,#7b2cff);color:#fff;border-radius:999px;padding:8px 13px;font-weight:950;font-size:13px;white-space:nowrap;box-shadow:0 8px 22px #3157ff30}.practiceSection{background:#f7faff;border:1px solid #e3ecff;border-radius:22px;padding:14px;margin:12px 0}.sectionTitle{display:flex;align-items:center;gap:10px;color:#18335e;font-size:15px;font-weight:1000;margin-bottom:11px}.sectionTitle span{width:26px;height:26px;border-radius:10px;display:grid;place-items:center;background:#3157ff;color:#fff;font-size:14px;box-shadow:0 8px 18px #3157ff22}.practiceCleanGrid{display:grid;gap:12px}.practiceCleanGrid.mainGrid{grid-template-columns:1.3fr 1.4fr 110px}.practiceCleanGrid.filterGrid{grid-template-columns:repeat(4,minmax(145px,1fr))}.fieldBox{background:#fff;border:1px solid #dbe7ff;border-radius:18px;padding:12px;box-shadow:0 8px 22px rgba(30,70,140,.07)}.fieldBox label{display:block;color:#24406a!important;font-size:12px;font-weight:1000;text-transform:uppercase;letter-spacing:.4px;margin-bottom:7px}.fieldBox select,.fieldBox input{width:100%!important;margin:0!important;background:#fff!important;color:#10223d!important;border:1px solid #bdccee!important;border-radius:13px!important;padding:11px 12px!important;font-weight:850!important;box-sizing:border-box!important;outline:none!important}.fieldBox select:focus,.fieldBox input:focus{border-color:#3157ff!important;box-shadow:0 0 0 4px #3157ff18!important}.fieldBox small{display:block;margin-top:7px;color:#6b7b98;font-size:12px;font-weight:750}.hero .cleanUnitGrid{background:#fff!important;border:1px solid #dbe7ff!important;border-radius:20px!important;padding:12px!important;margin:12px 0!important;grid-template-columns:repeat(auto-fit,minmax(100px,1fr))!important;gap:8px!important}.hero .cleanUnitGrid label{background:#f8fbff!important;color:#18335e!important;border:1px solid #dbe7ff!important;border-radius:14px!important;padding:10px!important;font-weight:900!important;display:flex!important;align-items:center!important;gap:7px!important}.cleanUnitGrid input{width:auto!important;margin:0!important}.hero .cleanHint{background:#eef5ff;color:#31496d!important;border:1px solid #d7e6ff;border-radius:16px;padding:11px 13px;margin:12px 0 0!important;font-weight:800!important}.hero .cleanHint b{color:#3157ff}.hero .practiceSetupClean + button,.hero button[onclick="createRoom()"]{box-shadow:0 12px 30px rgba(0,0,0,.20)}
@media(max-width:980px){.practiceCleanGrid.mainGrid,.practiceCleanGrid.filterGrid{grid-template-columns:1fr 1fr}.practiceTop{flex-direction:column}.practiceModePill{align-self:flex-start}}
@media(max-width:620px){.practiceCleanGrid.mainGrid,.practiceCleanGrid.filterGrid{grid-template-columns:1fr}.hero .practiceSetupClean{padding:14px!important;border-radius:22px!important}.practiceTop h3{font-size:21px!important}.fieldBox{padding:10px}}

/* v0.35 Presenter Mode repair - keep other layouts unchanged */
body.projectorMode #roomBox{display:contents!important;}
body.projectorMode .wrap > .hero{display:none!important;}
body.projectorMode .classroomHub,
body.projectorMode #roomBox > .card:has(#qManager){display:none!important;}
body.projectorMode .projectorStage{grid-column:1!important;grid-row:1!important;}
body.projectorMode .leaderboardStandalone{grid-column:2!important;grid-row:1!important;}
body.projectorMode .projectorControlBar{display:grid!important;align-items:center!important;gap:10px!important;}
body.projectorMode .controlLeft{display:flex!important;gap:8px!important;align-items:center!important;flex-wrap:wrap!important;}
body.projectorMode .controlMiddle{justify-self:start!important;}
body.projectorMode .controlRight{justify-self:end!important;display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
body.projectorMode .teacherLiveArea{height:100%!important;}
body.projectorMode .leaderboardStandalone .leaderboardHeader::after{content:'Top 5 Live';margin-left:auto;background:#ffffff14;border:1px solid #ffffff22;border-radius:999px;padding:6px 10px;color:#dce6ff;font-size:12px;font-weight:900;}
body.projectorMode .leaderboardStandalone .leaderboardHeader{display:flex!important;align-items:center!important;gap:10px!important;}
@media(max-width:980px){body.projectorMode #roomBox{display:block!important;}body.projectorMode .wrap{display:block!important;}body.projectorMode .projectorStage,body.projectorMode .leaderboardStandalone{width:auto!important;margin-bottom:12px!important;}}

/* v0.37 Presenter Mode result popup font color fix only */
body.projectorMode .resultOverlay .resultModal,
body.projectorMode .resultOverlay .finalModal{
  color:#10223d!important;
}
body.projectorMode .resultOverlay .resultTitle{
  background:none!important;
  -webkit-background-clip:initial!important;
  background-clip:initial!important;
  color:#0b3d91!important;
  text-shadow:0 6px 18px rgba(11,61,145,.18)!important;
}
body.projectorMode .resultOverlay .finalOverlay .resultTitle,
body.projectorMode .finalOverlay .resultTitle{
  color:#b45309!important;
  text-shadow:0 6px 18px rgba(180,83,9,.2)!important;
}
body.projectorMode .resultOverlay .resultSub{
  color:#172554!important;
  font-weight:950!important;
}
body.projectorMode .resultOverlay .podiumName{
  color:#111827!important;
}
body.projectorMode .resultOverlay .podiumScore{
  color:#1e3a8a!important;
}
body.projectorMode .resultOverlay .podiumScore .scoreNum,
body.projectorMode .resultOverlay .scoreValue{
  color:#dc2626!important;
  text-shadow:0 6px 18px rgba(220,38,38,.18)!important;
}
body.projectorMode .resultOverlay .resultList h3{
  color:#0f172a!important;
}

/* v0.38 Presenter Mode result layout background fix only */
body.projectorMode .resultOverlay{
  background:rgba(2,6,23,.84)!important;
  backdrop-filter:blur(10px)!important;
}
body.projectorMode .resultOverlay .resultModal,
body.projectorMode .resultOverlay .finalModal{
  background:radial-gradient(circle at top left,#1e3a8a 0%,#0f172a 42%,#020617 100%)!important;
  border:1px solid rgba(125,211,252,.38)!important;
  box-shadow:0 34px 110px rgba(0,0,0,.78),0 0 0 1px rgba(255,255,255,.06) inset!important;
  color:#f8fafc!important;
}
body.projectorMode .resultOverlay .resultTitle{
  color:#facc15!important;
  text-shadow:0 0 22px rgba(250,204,21,.38),0 8px 26px rgba(0,0,0,.55)!important;
}
body.projectorMode .finalOverlay .resultTitle{
  color:#fbbf24!important;
  text-shadow:0 0 24px rgba(251,191,36,.42),0 8px 28px rgba(0,0,0,.6)!important;
}
body.projectorMode .resultOverlay .resultSub{
  background:rgba(15,23,42,.72)!important;
  border:1px solid rgba(96,165,250,.32)!important;
  color:#e0f2fe!important;
  border-radius:18px!important;
  padding:12px 16px!important;
  margin:12px auto 18px!important;
  max-width:92%!important;
}
body.projectorMode .resultOverlay .podiumCard{
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.06))!important;
  border:1px solid rgba(255,255,255,.18)!important;
  color:#f8fafc!important;
  box-shadow:0 18px 42px rgba(0,0,0,.35)!important;
}
body.projectorMode .resultOverlay .podiumCard.first{
  background:linear-gradient(180deg,rgba(250,204,21,.28),rgba(255,255,255,.07))!important;
  border-color:rgba(250,204,21,.45)!important;
}
body.projectorMode .resultOverlay .podiumName{color:#ffffff!important;}
body.projectorMode .resultOverlay .podiumScore{color:#bae6fd!important;}
body.projectorMode .resultOverlay .podiumScore .scoreNum,
body.projectorMode .resultOverlay .scoreValue{color:#22c55e!important;text-shadow:0 0 20px rgba(34,197,94,.38)!important;}
body.projectorMode .resultOverlay .resultList{
  background:rgba(15,23,42,.76)!important;
  border:1px solid rgba(148,163,184,.24)!important;
  color:#f8fafc!important;
}
body.projectorMode .resultOverlay .resultList h3{color:#facc15!important;}
body.projectorMode .resultOverlay .playerCard{
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(255,255,255,.14)!important;
  color:#f8fafc!important;
}
body.projectorMode .resultOverlay .pcBody b{color:#ffffff!important;}
body.projectorMode .resultOverlay .scoreBox{background:rgba(2,6,23,.46)!important;border-color:rgba(255,255,255,.16)!important;}
body.projectorMode .resultOverlay .scoreLabel{color:#bfdbfe!important;}
body.projectorMode .resultOverlay .closeBtn{background:#f8fafc!important;color:#0f172a!important;}


/* v0.40 Arrange + Presenter result fixes */
.arrangeArea.submitted{opacity:.48;filter:grayscale(.25);pointer-events:none;transition:opacity .18s ease,filter .18s ease;position:relative}
.arrangeArea.submitted::after{content:'Submitted';position:absolute;right:18px;top:10px;background:#64748b;color:#fff;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:1000;box-shadow:0 8px 18px rgba(15,23,42,.2)}
.arrangeArea.submitted .sentenceBox{border-color:#94a3b8;background:#f1f5f9}.arrangeArea.submitted .selectedWord,.arrangeArea.submitted .wordChip{background:#e2e8f0!important;color:#334155!important}.arrangeArea.submitted button{background:#cbd5e1!important;color:#475569!important;border-color:#cbd5e1!important;box-shadow:none!important}
body.projectorMode .teacherAnswerBox{background:linear-gradient(135deg,#082f49,#0f172a)!important;border:2px solid rgba(125,211,252,.55)!important;box-shadow:0 22px 60px rgba(0,0,0,.45),0 0 34px rgba(14,165,233,.18)!important;color:#f8fafc!important;border-radius:24px!important;padding:20px!important;margin-top:18px!important}
body.projectorMode .teacherAnswerBox h3{color:#facc15!important;font-size:clamp(24px,3vw,42px)!important;text-shadow:0 0 22px rgba(250,204,21,.36)!important;margin:0 0 12px!important}
body.projectorMode .teacherAnswerBox .bigAnswer{display:block!important;background:linear-gradient(135deg,#fef3c7,#fde68a)!important;color:#111827!important;border:3px solid #facc15!important;border-radius:22px!important;padding:18px 22px!important;font-size:clamp(30px,5vw,64px)!important;font-weight:1000!important;line-height:1.15!important;text-shadow:none!important;box-shadow:0 16px 42px rgba(250,204,21,.22)!important;margin:10px 0 12px!important}
body.projectorMode .teacherAnswerBox p:not(.bigAnswer){color:#dbeafe!important;font-size:clamp(18px,2vw,28px)!important;font-weight:850!important}

/* v0.41 final safety patch - Presenter Arrange + Student submitted state */
body.projectorMode .teacherQuestion.isReveal .teacherAnswerBox{
  background:linear-gradient(135deg,#061826 0%,#0f2f55 52%,#031019 100%)!important;
  border:3px solid #facc15!important;
  box-shadow:0 24px 80px rgba(0,0,0,.62),0 0 36px rgba(250,204,21,.28)!important;
}
body.projectorMode .teacherQuestion.isReveal .teacherAnswerBox h3{
  color:#fde68a!important;
  font-weight:1000!important;
  text-shadow:0 0 20px rgba(253,230,138,.45),0 6px 18px rgba(0,0,0,.7)!important;
}
body.projectorMode .teacherQuestion.isReveal .teacherAnswerBox .bigAnswer{
  background:#fff7ed!important;
  color:#7c2d12!important;
  border:4px solid #fb923c!important;
  box-shadow:0 18px 48px rgba(251,146,60,.28)!important;
}
body.projectorMode .teacherQuestion.isReveal .teacherAnswerBox p:not(.bigAnswer){
  color:#e0f2fe!important;
  text-shadow:0 4px 14px rgba(0,0,0,.55)!important;
}
.arrangeArea.submitted{opacity:.46!important;filter:grayscale(.45)!important;pointer-events:none!important;user-select:none!important;}
.arrangeArea.submitted .wordChip,.arrangeArea.submitted button{cursor:not-allowed!important;}
.arrangeArea.submitted + .answerStatus.show{background:#f1f5f9!important;color:#334155!important;border-color:#cbd5e1!important;}

/* v0.42 Student selected answer highlight + countdown sound states */
.answerBtn.studentPicked,
.answerBtn.selected{
  border-color:#facc15!important;
  background:linear-gradient(135deg,#fff7cc,#e8fff2)!important;
  box-shadow:0 0 0 5px rgba(250,204,21,.28),0 18px 44px rgba(34,197,94,.24)!important;
  transform:translateY(-2px) scale(1.015)!important;
}
.answerBtn.studentPicked .answerLetter,
.answerBtn.selected .answerLetter{
  background:linear-gradient(135deg,#22c55e,#16a34a)!important;
  color:#fff!important;
  box-shadow:0 0 0 4px rgba(34,197,94,.18),0 10px 22px rgba(34,197,94,.32)!important;
}
.answerBtn.studentPicked .answerText,
.answerBtn.selected .answerText{color:#0f172a!important;font-weight:1000!important;}
.answerBtn.studentPicked::before,
.answerBtn.selected::before{
  content:'✓ Selected';position:absolute;left:14px;top:10px;background:#22c55e;color:#fff;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:1000;box-shadow:0 8px 18px rgba(34,197,94,.28)
}
.answerBtn.selected::after{content:'Submitted'!important;right:14px!important;top:10px!important;background:#3157ff!important;color:#fff!important;}
.sentenceBox:has(.selectedWord){
  border-color:#facc15!important;background:linear-gradient(135deg,#fff8d9,#ecfdf5)!important;box-shadow:0 0 0 5px rgba(250,204,21,.18),0 12px 32px rgba(34,197,94,.15)!important;
}
.selectedWord{
  background:linear-gradient(135deg,#22c55e,#16a34a)!important;color:#fff!important;border:2px solid rgba(255,255,255,.55)!important;box-shadow:0 8px 20px rgba(34,197,94,.26)!important;animation:selectedWordPop .16s ease;
}
.wordChip:disabled{opacity:.26!important;filter:grayscale(.45)!important;}
@keyframes selectedWordPop{from{transform:scale(.92);opacity:.75}to{transform:scale(1);opacity:1}}
.countdownNum.dangerTime{color:#ff174d!important;text-shadow:0 0 18px rgba(255,23,77,.35)!important;}


/* v0.44 Presenter Mode countdown highlight */
body.projectorMode .teacherTimer{
  position:absolute!important;
  top:18px!important;
  right:18px!important;
  width:190px!important;
  padding:16px 14px!important;
  border-radius:28px!important;
  background:radial-gradient(circle at top,#2563eb 0%,#111827 68%)!important;
  border:2px solid rgba(147,197,253,.72)!important;
  color:#fff!important;
  z-index:20!important;
  text-align:center!important;
  box-shadow:0 22px 60px rgba(0,0,0,.55),0 0 34px rgba(59,130,246,.42)!important;
}
body.projectorMode .teacherTimer .timerCaption{
  display:block!important;
  color:#bfdbfe!important;
  font-size:12px!important;
  font-weight:1000!important;
  letter-spacing:1px!important;
  margin-bottom:4px!important;
}
body.projectorMode .teacherTimer b{
  display:block!important;
  color:#ffffff!important;
  font-size:72px!important;
  line-height:.92!important;
  font-weight:1000!important;
  text-shadow:0 0 24px rgba(255,255,255,.32),0 8px 24px rgba(0,0,0,.45)!important;
}
body.projectorMode .teacherTimer b span{
  font-size:25px!important;
  margin-left:3px!important;
  color:#dbeafe!important;
}
body.projectorMode .teacherTimer .countdownTrack{
  height:14px!important;
  border-radius:999px!important;
  margin-top:12px!important;
  background:rgba(255,255,255,.18)!important;
  overflow:hidden!important;
}
body.projectorMode .teacherTimer .countdownTrack span{
  background:linear-gradient(90deg,#22c55e,#facc15)!important;
  box-shadow:0 0 16px rgba(250,204,21,.45)!important;
}
body.projectorMode .teacherTimer.urgentTimer{
  background:radial-gradient(circle at top,#f59e0b 0%,#7c2d12 58%,#111827 100%)!important;
  border-color:rgba(251,191,36,.86)!important;
  box-shadow:0 26px 70px rgba(0,0,0,.62),0 0 44px rgba(245,158,11,.58)!important;
  animation:presenterTimeShake .55s ease-in-out infinite!important;
}
body.projectorMode .teacherTimer.urgentTimer .timerCaption{color:#ffedd5!important;}
body.projectorMode .teacherTimer.urgentTimer .countdownTrack span{background:linear-gradient(90deg,#facc15,#fb923c,#ef4444)!important;}
body.projectorMode .teacherTimer.criticalTimer{
  background:radial-gradient(circle at top,#ef4444 0%,#7f1d1d 58%,#020617 100%)!important;
  border-color:rgba(248,113,113,.92)!important;
  box-shadow:0 30px 85px rgba(0,0,0,.72),0 0 58px rgba(239,68,68,.72)!important;
  animation:presenterCriticalPulse .32s ease-in-out infinite!important;
}
body.projectorMode .teacherTimer.criticalTimer b{color:#fff7ed!important;text-shadow:0 0 30px rgba(254,202,202,.7),0 8px 26px rgba(0,0,0,.62)!important;}
body.projectorMode .teacherTimer.criticalTimer .countdownTrack span{background:linear-gradient(90deg,#fb7185,#ef4444,#f97316)!important;}
@keyframes presenterTimeShake{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.035)}}
@keyframes presenterCriticalPulse{0%,100%{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.08);filter:brightness(1.16)}}
@media(max-width:980px){body.projectorMode .teacherTimer{position:relative!important;top:auto!important;right:auto!important;width:auto!important;margin:8px 0 14px!important}}

/* v0.48 Presenter Mode countdown position + professional question card only */
body.projectorMode .teacherTimer{
  top:0!important;
  right:16px!important;
  margin-top:0!important;
  width:174px!important;
  padding:12px 12px!important;
  border-radius:24px!important;
}
body.projectorMode .teacherTimer b{
  font-size:62px!important;
  line-height:.9!important;
}
body.projectorMode .teacherTimer .countdownTrack{
  height:10px!important;
  margin-top:8px!important;
}
body.projectorMode .teacherQuestion{
  padding:28px 28px 30px!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(96,165,250,.22),transparent 34%),
    radial-gradient(circle at 82% 0%,rgba(250,204,21,.16),transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055))!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 24px 70px rgba(0,0,0,.34)!important;
}
body.projectorMode .questionTypeBadge{
  margin-top:0!important;
  margin-bottom:18px!important;
  box-shadow:0 10px 28px rgba(0,0,0,.34)!important;
}
body.projectorMode .projectorQuestionText{
  display:block!important;
  width:min(92%,1180px)!important;
  box-sizing:border-box!important;
  margin:44px auto 28px!important;
  padding:28px 34px!important;
  border-radius:30px!important;
  background:linear-gradient(180deg,rgba(15,23,42,.68),rgba(15,23,42,.38))!important;
  border:1px solid rgba(191,219,254,.30)!important;
  color:#f8fafc!important;
  font-size:clamp(40px,5.7vw,82px)!important;
  line-height:1.12!important;
  letter-spacing:-.7px!important;
  text-shadow:0 6px 22px rgba(0,0,0,.58)!important;
  box-shadow:0 20px 56px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.09)!important;
}
body.projectorMode .teacherOptionGrid{
  width:min(94%,1200px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
body.projectorMode .teacherOption{
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.08))!important;
  border:2px solid rgba(219,234,254,.25)!important;
  box-shadow:0 16px 40px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
body.projectorMode .teacherOption b{
  color:#f8fafc!important;
  font-weight:950!important;
}
body.projectorMode .wordBank.teacherWordBank{
  width:min(94%,1120px)!important;
  margin:0 auto!important;
  padding:18px!important;
  border-radius:24px!important;
  background:rgba(15,23,42,.32)!important;
  border:1px solid rgba(255,255,255,.12)!important;
}
@media(max-width:980px){
  body.projectorMode .teacherTimer{top:auto!important;right:auto!important;width:auto!important;margin-top:0!important;}
  body.projectorMode .projectorQuestionText{margin-top:16px!important;width:100%!important;font-size:clamp(32px,8vw,58px)!important;padding:22px!important;}
}

/* v0.49 Presenter Mode countdown position only */
body.projectorMode .teacherTimer{
  top:3px!important;
  margin-top:3px!important;
}
@media(max-width:980px){
  body.projectorMode .teacherTimer{margin-top:3px!important;}
}

/* v0.50 Presenter Mode typography balance + no-overlap tuning */
body.projectorMode .projectorStage{
  padding:12px!important;
}
body.projectorMode .projectorControlBar{
  margin-bottom:10px!important;
  min-height:52px!important;
}
body.projectorMode .teacherTimer{
  top:3px!important;
  right:14px!important;
  margin-top:3px!important;
  width:150px!important;
  padding:9px 10px!important;
  border-radius:20px!important;
}
body.projectorMode .teacherTimer .timerCaption{
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:.9px!important;
}
body.projectorMode .teacherTimer b{
  font-size:48px!important;
  line-height:.92!important;
  letter-spacing:-1px!important;
}
body.projectorMode .teacherTimer .countdownTrack{
  height:8px!important;
  margin-top:6px!important;
}
body.projectorMode .teacherQuestion{
  padding:24px 26px 26px!important;
  justify-content:center!important;
  gap:10px!important;
}
body.projectorMode .questionTypeBadge{
  font-size:13px!important;
  padding:7px 12px!important;
  margin:0 0 10px!important;
}
body.projectorMode .projectorQuestionText{
  width:min(90%,1040px)!important;
  max-width:calc(100% - 24px)!important;
  margin:34px auto 18px!important;
  padding:22px 28px!important;
  border-radius:26px!important;
  font-size:clamp(32px,4.55vw,68px)!important;
  line-height:1.16!important;
  letter-spacing:-.45px!important;
  max-height:38vh!important;
  overflow:auto!important;
}
body.projectorMode .teacherOptionGrid{
  width:min(92%,1060px)!important;
  gap:12px!important;
  margin-top:4px!important;
}
body.projectorMode .teacherOption{
  min-height:70px!important;
  padding:14px 16px!important;
  border-radius:18px!important;
  font-size:clamp(18px,1.75vw,28px)!important;
  line-height:1.18!important;
  gap:12px!important;
}
body.projectorMode .teacherOption span{
  min-width:40px!important;
  width:40px!important;
  height:40px!important;
  border-radius:13px!important;
  font-size:20px!important;
  flex:0 0 40px!important;
}
body.projectorMode .wordBank.teacherWordBank{
  width:min(92%,1040px)!important;
  padding:14px!important;
}
body.projectorMode .wordBank.teacherWordBank .wordChip.static{
  font-size:clamp(18px,1.9vw,28px)!important;
  padding:12px 16px!important;
}
body.projectorMode .teacherAnswerBox{
  width:min(92%,1040px)!important;
  margin:12px auto 0!important;
  padding:16px!important;
  border-radius:22px!important;
}
body.projectorMode .teacherAnswerBox h3{
  font-size:clamp(22px,2.4vw,34px)!important;
  margin-bottom:8px!important;
}
body.projectorMode .teacherAnswerBox .bigAnswer{
  font-size:clamp(26px,3.8vw,52px)!important;
  padding:14px 18px!important;
}
body.projectorMode .teacherAnswerBox p:not(.bigAnswer){
  font-size:clamp(16px,1.7vw,24px)!important;
}
@media(max-height:720px){
  body.projectorMode .projectorControlBar{min-height:46px!important;margin-bottom:8px!important;}
  body.projectorMode .teacherTimer{width:132px!important;padding:7px 9px!important;}
  body.projectorMode .teacherTimer b{font-size:40px!important;}
  body.projectorMode .projectorQuestionText{font-size:clamp(28px,4vw,56px)!important;margin-top:26px!important;padding:18px 22px!important;max-height:34vh!important;}
  body.projectorMode .teacherOption{min-height:60px!important;font-size:clamp(16px,1.55vw,24px)!important;padding:12px 14px!important;}
}
@media(max-width:980px){
  body.projectorMode .teacherTimer{position:relative!important;top:auto!important;right:auto!important;width:auto!important;margin:3px 0 10px!important;}
  body.projectorMode .projectorQuestionText{width:100%!important;margin:14px auto 14px!important;font-size:clamp(28px,7.6vw,54px)!important;padding:18px 20px!important;max-height:none!important;}
  body.projectorMode .teacherOptionGrid{grid-template-columns:1fr!important;width:100%!important;}
}


/* v0.51 smoother teacher app + edit focus + question transition */
.qEditForm{border:2px solid rgba(49,87,255,.18)!important;box-shadow:0 14px 36px rgba(31,64,160,.12)!important;animation:editFormIn .22s ease-out both;}
.qEditForm input:focus,.qEditForm select:focus{outline:none!important;border-color:#3157ff!important;box-shadow:0 0 0 4px rgba(49,87,255,.14)!important;}
@keyframes editFormIn{from{opacity:.65;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.teacherLiveArea{will-change:contents;contain:layout paint;}
.questionPreview{transform-origin:center top;}
.questionSwitchIn{animation:questionSwitchIn .46s cubic-bezier(.18,.89,.32,1.18) both;}
@keyframes questionSwitchIn{0%{opacity:0;transform:translateY(18px) scale(.985);filter:blur(3px)}55%{opacity:1;transform:translateY(-2px) scale(1.003);filter:blur(0)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
body.projectorMode .questionSwitchIn{animation:presenterQuestionSwitch .52s cubic-bezier(.18,.89,.32,1.18) both;}
@keyframes presenterQuestionSwitch{0%{opacity:0;transform:translateX(24px) scale(.98);filter:blur(4px)}60%{opacity:1;transform:translateX(-3px) scale(1.005);filter:blur(0)}100%{opacity:1;transform:translateX(0) scale(1);filter:blur(0)}}
.playerCard,.teacherOption,.wordChip,.qItem{backface-visibility:hidden;transform:translateZ(0);}
.leaderboardWide,.playersPanel,#players,#board{contain:layout paint;}
.teacherTimer b,.teacherTimer .countdownTrack span{transition:width .2s linear,color .18s ease,background .18s ease,box-shadow .18s ease;}
@media (prefers-reduced-motion: reduce){.questionSwitchIn,.qEditForm{animation:none!important}.teacherTimer b,.teacherTimer .countdownTrack span{transition:none!important}}

/* v0.56 Game Engine v2.0: Hall of Fame + Bonus/Comeback UI */
.teacherEventBanner{margin:10px auto 14px;padding:12px 16px;border-radius:18px;text-align:center;max-width:780px;background:linear-gradient(135deg,#7c3aed,#2563eb);color:#fff;box-shadow:0 14px 36px rgba(37,99,235,.25),inset 0 0 0 1px rgba(255,255,255,.18);animation:eventPulse 1.1s ease-in-out infinite alternate}.teacherEventBanner b{display:block;font-size:24px;letter-spacing:.6px}.teacherEventBanner span{font-weight:800;font-size:14px;opacity:.96}.teacherEventBanner.bonus{background:linear-gradient(135deg,#f59e0b,#ef4444)}.teacherEventBanner.comeback{background:linear-gradient(135deg,#16a34a,#0ea5e9)}.eventResultBadge{display:inline-block;margin:0 auto 12px;padding:10px 16px;border-radius:999px;font-weight:1000;color:#fff;background:linear-gradient(135deg,#f59e0b,#ef4444);box-shadow:0 12px 32px rgba(239,68,68,.25)}.eventResultBadge.comeback{background:linear-gradient(135deg,#16a34a,#0ea5e9)}@keyframes eventPulse{from{transform:scale(1);filter:brightness(1)}to{transform:scale(1.018);filter:brightness(1.12)}}
.hallOfFameModal{max-width:1100px!important}.hofTop3{align-items:end}.hofPodium.first{transform:scale(1.06)}.podiumTitle{font-size:13px;text-transform:uppercase;letter-spacing:.8px;color:#fde68a;font-weight:1000;margin:2px 0 5px}.specialAwards{margin:18px auto;background:rgba(15,23,42,.78);border:1px solid rgba(250,204,21,.22);border-radius:24px;padding:16px;max-width:820px;color:#fff}.specialAwards h3{margin:0 0 12px;text-align:center;color:#facc15;font-size:24px}.awardGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.awardCard{background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:16px;text-align:center;box-shadow:0 14px 34px rgba(0,0,0,.28)}.awardIcon{font-size:38px;margin-bottom:4px}.awardCard b{display:block;color:#e0f2fe;font-size:18px;margin-bottom:6px}.awardCard span{display:block;font-weight:950;color:#fff}.awardCard strong{display:block;margin-top:7px;color:#22c55e;font-size:26px;text-shadow:0 0 18px rgba(34,197,94,.35)}@media(max-width:760px){.awardGrid{grid-template-columns:1fr}.teacherEventBanner b{font-size:20px}.teacherEventBanner{padding:10px 12px}}

/* v0.58 - compact balanced Hall of Fame layout based on v0.56 */
.finalOverlay .hallOfFameModal,
body.projectorMode .finalOverlay .hallOfFameModal{
  max-width:980px!important;
  width:min(94vw,980px)!important;
  padding:24px 26px!important;
  border-radius:30px!important;
  overflow:hidden!important;
}
.finalOverlay .hallOfFameModal .resultTitle,
body.projectorMode .finalOverlay .hallOfFameModal .resultTitle{
  font-size:clamp(30px,4vw,48px)!important;
  line-height:1!important;
  margin:2px 0 10px!important;
  letter-spacing:-.7px!important;
}
.finalOverlay .hallOfFameModal .resultSub,
body.projectorMode .finalOverlay .hallOfFameModal .resultSub{
  max-width:720px!important;
  margin:0 auto 14px!important;
  padding:9px 14px!important;
  font-size:clamp(14px,1.6vw,18px)!important;
  line-height:1.28!important;
}
.finalOverlay .hofTop3,
body.projectorMode .finalOverlay .hofTop3{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1.16fr) minmax(0,1fr)!important;
  gap:12px!important;
  align-items:end!important;
  margin:10px auto 14px!important;
  max-width:850px!important;
}
.finalOverlay .hofTop3 .podiumCard,
body.projectorMode .finalOverlay .hofTop3 .podiumCard{
  min-height:124px!important;
  padding:14px 12px!important;
  border-radius:22px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
}
.finalOverlay .hofTop3 .podiumCard.first,
body.projectorMode .finalOverlay .hofTop3 .podiumCard.first{
  min-height:154px!important;
  transform:translateY(-8px) scale(1.02)!important;
  border-width:2px!important;
}
.finalOverlay .hofTop3 .podiumMedal,
body.projectorMode .finalOverlay .hofTop3 .podiumMedal{
  font-size:clamp(28px,3.8vw,44px)!important;
  line-height:1!important;
  margin-bottom:3px!important;
}
.finalOverlay .hofTop3 .podiumTitle,
body.projectorMode .finalOverlay .hofTop3 .podiumTitle{
  font-size:clamp(10px,1.15vw,13px)!important;
  letter-spacing:.7px!important;
  margin:1px 0 4px!important;
  opacity:.95!important;
}
.finalOverlay .hofTop3 .podiumName,
body.projectorMode .finalOverlay .hofTop3 .podiumName{
  font-size:clamp(16px,2vw,23px)!important;
  line-height:1.12!important;
  margin:3px 0 5px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  max-width:100%!important;
}
.finalOverlay .hofTop3 .podiumScore,
body.projectorMode .finalOverlay .hofTop3 .podiumScore{
  font-size:clamp(12px,1.3vw,15px)!important;
  line-height:1.15!important;
  margin-top:2px!important;
  font-weight:900!important;
}
.finalOverlay .hofTop3 .podiumScore .scoreNum,
body.projectorMode .finalOverlay .hofTop3 .podiumScore .scoreNum{
  font-size:clamp(24px,3vw,36px)!important;
  line-height:1!important;
  display:block!important;
  margin-bottom:1px!important;
}
.finalOverlay .specialAwards,
body.projectorMode .finalOverlay .specialAwards{
  max-width:760px!important;
  margin:12px auto!important;
  padding:12px!important;
  border-radius:22px!important;
}
.finalOverlay .specialAwards h3,
body.projectorMode .finalOverlay .specialAwards h3{
  font-size:clamp(18px,2.2vw,24px)!important;
  margin:0 0 8px!important;
}
.finalOverlay .awardGrid,
body.projectorMode .finalOverlay .awardGrid{
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.finalOverlay .awardCard,
body.projectorMode .finalOverlay .awardCard{
  padding:11px 12px!important;
  border-radius:18px!important;
}
.finalOverlay .awardIcon,
body.projectorMode .finalOverlay .awardIcon{
  font-size:30px!important;
  margin-bottom:2px!important;
}
.finalOverlay .awardCard b,
body.projectorMode .finalOverlay .awardCard b{
  font-size:15px!important;
  margin-bottom:3px!important;
}
.finalOverlay .awardCard span,
body.projectorMode .finalOverlay .awardCard span{
  font-size:14px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.finalOverlay .awardCard strong,
body.projectorMode .finalOverlay .awardCard strong{
  font-size:22px!important;
  margin-top:4px!important;
}
.finalOverlay .hallOfFameModal .resultList,
body.projectorMode .finalOverlay .hallOfFameModal .resultList{
  max-width:900px!important;
  max-height:210px!important;
  overflow:auto!important;
  margin:10px auto 0!important;
  padding:10px!important;
  border-radius:20px!important;
}
.finalOverlay .hallOfFameModal .resultList h3,
body.projectorMode .finalOverlay .hallOfFameModal .resultList h3{
  margin:0 0 8px!important;
  font-size:18px!important;
  text-align:center!important;
}
@media(max-width:760px){
  .finalOverlay .hofTop3,
  body.projectorMode .finalOverlay .hofTop3{grid-template-columns:1fr!important;max-width:420px!important;gap:10px!important;}
  .finalOverlay .hofTop3 .podiumCard.first,
  body.projectorMode .finalOverlay .hofTop3 .podiumCard.first{transform:none!important;min-height:132px!important;order:-1!important;}
  .finalOverlay .awardGrid,
  body.projectorMode .finalOverlay .awardGrid{grid-template-columns:1fr!important;}
  .finalOverlay .hallOfFameModal,
  body.projectorMode .finalOverlay .hallOfFameModal{padding:18px 14px!important;}
}

/* v0.59 Hall of Fame ceremony effects: fireworks, applause timing, Champion zoom/glow */
.finalOverlay .hallOfFameModal{overflow:hidden!important;position:relative!important;}
.finalOverlay .fireworks{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden;border-radius:inherit;}
.finalOverlay .fireworks span{position:absolute;left:var(--x);top:var(--y);width:8px;height:8px;border-radius:999px;background:#facc15;box-shadow:0 0 0 0 rgba(250,204,21,.85),0 0 22px rgba(250,204,21,.75);animation:fireworkPop 1.45s ease-out var(--d) both;}
.finalOverlay .fireworks span:nth-child(3n+1){background:#60a5fa;box-shadow:0 0 0 0 rgba(96,165,250,.85),0 0 22px rgba(96,165,250,.75)}
.finalOverlay .fireworks span:nth-child(3n+2){background:#fb7185;box-shadow:0 0 0 0 rgba(251,113,133,.85),0 0 22px rgba(251,113,133,.75)}
.finalOverlay .fireworks span:nth-child(4n){background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.85),0 0 22px rgba(34,197,94,.75)}
@keyframes fireworkPop{0%{opacity:0;transform:scale(.2)}10%{opacity:1}65%{opacity:1;box-shadow:0 0 0 34px rgba(255,255,255,0),0 0 34px currentColor;transform:scale(1.15)}100%{opacity:0;box-shadow:0 0 0 54px rgba(255,255,255,0),0 0 8px currentColor;transform:scale(.4)}}
.finalOverlay .hallOfFameModal > *:not(.confetti):not(.fireworks){position:relative;z-index:2;}
.finalOverlay .hofTop3 .podiumCard{opacity:0;animation:awardRise .62s cubic-bezier(.2,1,.2,1) both;}
.finalOverlay .hofTop3 .podiumCard.third{animation-delay:.45s;}
.finalOverlay .hofTop3 .podiumCard.second{animation-delay:.8s;}
.finalOverlay .hofTop3 .podiumCard.first{animation-delay:1.18s;}
@keyframes awardRise{from{opacity:0;transform:translateY(26px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
.finalOverlay .hofTop3 .podiumCard.first{position:relative!important;isolation:isolate;box-shadow:0 0 0 2px rgba(250,204,21,.45),0 26px 70px rgba(250,204,21,.24),0 0 54px rgba(250,204,21,.34)!important;}
.finalOverlay .hofTop3 .podiumCard.first::before{content:"";position:absolute;inset:-14px;border-radius:28px;background:radial-gradient(circle at 50% 35%,rgba(250,204,21,.36),rgba(250,204,21,0) 62%);z-index:-1;animation:championGlow 1.7s ease-in-out 1.55s infinite;}
.finalOverlay .hofTop3 .podiumCard.first > div{animation:championZoom .72s cubic-bezier(.18,1.35,.24,1) 1.55s both;}
@keyframes championZoom{0%{transform:scale(1)}45%{transform:scale(1.13)}100%{transform:scale(1)}}
@keyframes championGlow{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.04)}}
.finalOverlay .hofTop3 .podiumCard.first .podiumTitle::after{content:" 🏆";}
.finalOverlay .hofTop3 .podiumCard.first .podiumTitle{color:#fde68a!important;text-shadow:0 0 18px rgba(250,204,21,.45)!important;}
.finalOverlay .hofTop3 .podiumCard.first .podiumName{font-size:clamp(22px,2vw,28px)!important;text-shadow:0 0 18px rgba(255,255,255,.25)!important;}
.finalOverlay .hofTop3 .podiumCard.first .podiumMedal{filter:drop-shadow(0 0 18px rgba(250,204,21,.55));}
@media(max-width:760px){.finalOverlay .hofTop3 .podiumCard{animation-delay:.18s!important}.finalOverlay .hofTop3 .podiumCard.first > div{animation-delay:.4s!important}}


/* v0.64 simplify Content Filters */
.practiceCleanGrid.simpleFilterGrid{grid-template-columns:repeat(2,minmax(180px,1fr))!important;}
@media(max-width:620px){.practiceCleanGrid.simpleFilterGrid{grid-template-columns:1fr!important;}}


/* v0.65 Question Manager popup editor */
.qModal{position:fixed;inset:0;z-index:9999;background:rgba(2,6,23,.62);backdrop-filter:blur(8px);align-items:center;justify-content:center;padding:18px}
.qModalCard{width:min(760px,96vw);max-height:92vh;overflow:auto;background:linear-gradient(180deg,#ffffff,#f7faff);border:1px solid #dbe7ff;border-radius:26px;box-shadow:0 28px 90px rgba(2,6,23,.35);padding:0;color:#10223d}
.qModalHead{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;background:linear-gradient(180deg,#ffffff,#f4f8ff);border-bottom:1px solid #e2ebff;padding:18px 20px}
.qModalHead h3{margin:0;color:#10223d;font-size:24px;font-weight:1000}.qModalHead p{margin:5px 0 0;color:#5c6f8e;font-weight:750}.modalClose{width:42px;height:42px;border-radius:14px!important;padding:0!important;background:#eef4ff!important;color:#18335e!important;font-size:26px!important;line-height:1!important;box-shadow:none!important}.qEditPopupForm{padding:18px 20px!important;background:transparent!important;border:0!important;box-shadow:none!important}.qEditPopupForm label{display:block;margin:12px 0 7px;color:#24406a;font-weight:1000;text-transform:uppercase;font-size:12px;letter-spacing:.4px}.qEditPopupForm input,.qEditPopupForm select,.qEditPopupForm textarea{width:100%;box-sizing:border-box;border:1px solid #bdccee;border-radius:14px;background:#fff;color:#10223d;padding:12px 13px;font-weight:800;outline:none}.qEditPopupForm textarea{font-family:inherit;resize:vertical;line-height:1.35}.qEditPopupForm input:focus,.qEditPopupForm select:focus,.qEditPopupForm textarea:focus{border-color:#3157ff;box-shadow:0 0 0 4px #3157ff18}.qModalActions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid #e2ebff}.qModalActions button{min-width:130px}.qModalActions button:disabled{opacity:.65;cursor:not-allowed}.qList .qItem{transition:transform .15s ease,box-shadow .15s ease}.qList .qItem:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(30,70,140,.10)}
@media(max-width:620px){.qModal{padding:10px}.qModalCard{border-radius:20px}.qModalHead{padding:14px}.qEditPopupForm{padding:14px!important}.qModalActions{flex-direction:column-reverse}.qModalActions button{width:100%}}


/* v0.66 English Question Focus redesign */
.focusTabs{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:10px;margin:10px 0 16px}.focusTab{background:#f7f9ff;border:1px solid #dfe7ff;border-radius:18px;padding:12px;cursor:pointer;display:flex;flex-direction:column;gap:4px;transition:.16s ease}.focusTab input{display:none}.focusTab span{font-weight:950;color:#172b55}.focusTab small{opacity:.65}.focusTab.active{background:linear-gradient(135deg,#3157ff,#7b2cff);border-color:#ffffff55;box-shadow:0 14px 28px #3157ff30;transform:translateY(-1px)}.focusTab.active span,.focusTab.active small{color:white;opacity:1}.englishFocusGrid{grid-template-columns:1.2fr .8fr}.fieldBox.importantFocus{border:2px solid #3157ff22;background:linear-gradient(180deg,#fff,#f7f9ff)}#grammarTopicFilter{min-height:205px}.ratioBox{margin-top:12px;background:#f6f8ff;border-radius:14px;padding:10px}.ratioBox input{margin:2px 0}.ratioBox b{display:inline-block;margin-top:4px;color:#3157ff}.grammarExtraBox textarea,#qForm textarea{width:100%;box-sizing:border-box;border:1px solid #cbd4ea;border-radius:12px;padding:14px;font-family:inherit;resize:vertical}.practiceSetupClean .sectionTitle span{background:#3157ff;color:white;border-radius:999px;padding:4px 10px;margin-right:8px}@media(max-width:960px){.focusTabs{grid-template-columns:repeat(2,1fr)}.englishFocusGrid{grid-template-columns:1fr}}
/* v0.69 Knowledge Center redesign */
.knowledgeSetup .practiceTop h3{letter-spacing:-.3px}.knowledgeCenterSection{background:linear-gradient(180deg,#f8fbff,#eef6ff)}
.quickPresetGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:10px 0 14px}.presetBtn{border:1px solid #d9e6ff;background:#fff;border-radius:16px;padding:12px;text-align:left;cursor:pointer;box-shadow:0 8px 20px rgba(30,70,140,.06);transition:.18s ease}.presetBtn b{display:block;color:#142b52;font-size:14px}.presetBtn small{display:block;color:#64748b;margin-top:4px;font-weight:750}.presetBtn:hover{transform:translateY(-1px);border-color:#9bbcff}.presetBtn.active{background:linear-gradient(135deg,#2454ff,#7337ff);border-color:#2454ff;box-shadow:0 16px 35px rgba(36,84,255,.22)}.presetBtn.active b,.presetBtn.active small{color:#fff}.knowledgeGrid{grid-template-columns:1fr 1fr!important}.advancedGrammar{margin-top:12px;background:#fff;border:1px solid #dce8ff;border-radius:18px;padding:12px;box-shadow:0 8px 22px rgba(30,70,140,.06)}.advancedGrammar summary{font-weight:1000;color:#18335e;cursor:pointer;list-style:none}.advancedGrammar summary::-webkit-details-marker{display:none}.advancedGrammar summary:after{content:'▾';float:right;color:#3157ff}.advancedGrammar:not([open]) summary:after{content:'▸'}.topicChipWrap{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.topicChip{border:1px solid #d7e5ff;background:#f8fbff;color:#1e3a5f;border-radius:999px;padding:8px 12px;font-weight:900;cursor:pointer;transition:.15s ease}.topicChip:hover{border-color:#8fb4ff}.topicChip.active{background:#143cff;color:#fff;border-color:#143cff;box-shadow:0 8px 20px rgba(20,60,255,.22)}.grammarExtraInline{margin-top:12px}.unitScopeSection .unitCheckGrid{display:none}.practiceHint.cleanHint{color:#31496d}@media(max-width:740px){.knowledgeGrid{grid-template-columns:1fr!important}.quickPresetGrid{grid-template-columns:1fr}.topicChip{font-size:13px}}


/* v1.0.3 Grammar Extra Tag Selector */
.grammarExtraSelector{margin-top:12px}
.grammarExtraHelp{font-size:12px;color:#64748b;margin:4px 0 10px;line-height:1.35}
.grammarExtraTags{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.extraChip{border:1px solid rgba(37,99,235,.22);background:#f8fafc;color:#0f172a;border-radius:999px;padding:8px 12px;font-weight:700;cursor:pointer;transition:.18s ease;box-shadow:0 1px 2px rgba(15,23,42,.06)}
.extraChip:hover{transform:translateY(-1px);border-color:#2563eb;background:#eff6ff}
.extraChip.active{background:linear-gradient(135deg,#2563eb,#0f766e);color:white;border-color:transparent;box-shadow:0 8px 18px rgba(37,99,235,.22)}
.extraChip .count{font-weight:800;font-size:11px;opacity:.82;margin-left:4px}
.extraChip.active .count{opacity:.95;color:#dff7ff}
.extraChip.custom{border-style:dashed}
.customExtraRow{display:flex;gap:8px;align-items:center;margin-top:8px}
.customExtraRow input{flex:1;min-width:180px;border:1px solid #dbe3ef;border-radius:12px;padding:10px 12px;font-weight:600;background:white}
.grammarExtraStatus{margin-top:8px;font-size:12px;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:8px 10px}
.grammarExtraStatus.active{color:#075985;background:#ecfeff;border-color:#67e8f9;font-weight:700}

/* v1.0.4 filter diagnostics */
.practicePreview{margin:12px 0 4px;padding:11px 13px;border-radius:14px;border:1px solid #dbe7ff;background:#f8fbff;color:#334155;font-size:13px;line-height:1.4}
.practicePreview.ok{background:#ecfdf5;border-color:#86efac;color:#166534}
.practicePreview.warning{background:#fff7ed;border-color:#fdba74;color:#9a3412}
.practicePreview small{font-weight:700}

/* v1.1.0 Independent Grammar Academy */
.grammarAcademyPanel{margin:18px 0;padding:0;border:1px solid #cfe0ff;border-radius:20px;background:linear-gradient(180deg,#f8fbff,#fff);box-shadow:0 14px 34px rgba(30,64,175,.08);overflow:hidden}
.grammarAcademyPanel>.academySummary{display:block;padding:18px;cursor:pointer;list-style:none;user-select:none}
.grammarAcademyPanel>.academySummary::-webkit-details-marker{display:none}
.grammarAcademyPanel>.academySummary:hover{background:rgba(239,246,255,.72)}
.grammarAcademyPanel[open]>.academySummary{border-bottom:1px solid #dbe8ff}
.academyContent{padding:0 18px 18px}
.academyHeaderRight{display:flex;align-items:center;gap:10px}
.academyCollapseIcon{width:30px;height:30px;border-radius:10px;background:#eaf1ff;display:grid;place-items:center;color:#3157c8;font-weight:1000;flex:0 0 auto}
.academyCollapseIcon:after{content:'▸';font-size:18px;line-height:1}
.grammarAcademyPanel[open] .academyCollapseIcon:after{content:'▾'}
.academyHeader{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.academyHeader h3{margin:3px 0 5px;font-size:22px}.academyHeader p{margin:0;color:#5b6b84}.academyEyebrow{font-size:11px;letter-spacing:.12em;font-weight:900;color:#3157c8}.academyBadge{white-space:nowrap;background:#143cff;color:white;padding:8px 12px;border-radius:999px;font-weight:900;font-size:12px}
.academyToolbar{display:grid;grid-template-columns:1fr auto auto;gap:8px;margin:15px 0 10px}.academyToolbar input{min-width:0}.academySelected{font-size:12px;padding:10px 12px;border:1px dashed #cbd5e1;border-radius:12px;color:#64748b;background:#fff;margin-bottom:12px}.academySelected.active{border-style:solid;border-color:#93c5fd;background:#eff6ff;color:#1e3a8a}
.academyTree{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.academyChapter{border:1px solid #dce7f8;border-radius:14px;background:white;overflow:hidden}.academyChapterHead{width:100%;display:grid;grid-template-columns:34px 1fr auto;align-items:center;text-align:left;gap:9px;padding:11px;border:0;background:white;color:#13233f;cursor:pointer}.academyChapterHead:hover{background:#f7faff}.academyChapterHead small{display:block;color:#7a8ba5;font-weight:700;margin-top:2px}.academyChapterNumber{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#eaf1ff;color:#143cff;font-weight:900}.academyArrow{font-size:17px;color:#60708a}.academyChapterBody{padding:0 9px 10px;display:flex;flex-direction:column;gap:6px}.academyTopic{display:flex;justify-content:space-between;gap:8px;align-items:center;text-align:left;border:1px solid #e5eaf2;border-radius:10px;background:#fafcff;color:#334155;padding:8px 9px;cursor:pointer;font-weight:750}.academyTopic:hover{border-color:#93b4ff}.academyTopic.active{background:#143cff;color:white;border-color:#143cff;box-shadow:0 6px 14px rgba(20,60,255,.18)}.academyTopic small{white-space:nowrap;opacity:.72}.academyLoading{grid-column:1/-1;padding:20px;text-align:center;color:#64748b}
@media(max-width:1000px){.academyTree{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.academyTree{grid-template-columns:1fr}.academyHeader{flex-direction:column}.academyHeaderRight{width:100%;justify-content:space-between}.academyToolbar{grid-template-columns:1fr 1fr}.academyToolbar input{grid-column:1/-1}}

/* v1.3.0 Unified Grammar Center */
.grammarCenter{margin:18px 0;border:1px solid #cfe0ff;border-radius:20px;background:linear-gradient(180deg,#f8fbff,#fff);box-shadow:0 14px 34px rgba(30,64,175,.08);overflow:hidden}
.grammarCenter>.grammarCenterSummary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;cursor:pointer;list-style:none;user-select:none}
.grammarCenter>.grammarCenterSummary::-webkit-details-marker{display:none}.grammarCenter>.grammarCenterSummary:hover{background:rgba(239,246,255,.72)}
.grammarCenter[open]>.grammarCenterSummary{border-bottom:1px solid #dbe8ff}.grammarCenter .academyCollapseIcon:after{content:'▸';font-size:18px;font-weight:1000;color:#3157ff}.grammarCenter[open] .academyCollapseIcon:after{content:'▾'}
.grammarCenterSummary h3{margin:4px 0;color:#102b58}.grammarCenterSummary p{margin:0;color:#64748b;font-weight:750}.grammarCenterBody{padding:14px 16px 18px}
.grammarCenterTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:5px;background:#edf4ff;border-radius:14px;margin-bottom:14px}.grammarCenterTab{border:0;background:transparent;border-radius:11px;padding:11px 10px;font-weight:950;color:#4b6385;cursor:pointer}.grammarCenterTab.active{background:#fff;color:#173fff;box-shadow:0 7px 18px rgba(30,64,175,.12)}
.grammarCenterPane{display:none}.grammarCenterPane.active{display:block}.grammarFilterLabel{font-weight:1000;color:#18335e;margin-bottom:8px}.grammarFilterNote{margin-top:12px;padding:10px 12px;border-radius:12px;background:#f7faff;color:#61708b;font-weight:750;font-size:13px}
@media(max-width:740px){.grammarCenter>.grammarCenterSummary{align-items:flex-start}.grammarCenterTabs{grid-template-columns:1fr}.grammarCenterTab{text-align:left}.grammarCenterSummary p{font-size:12px}.academyHeaderRight{min-width:auto}}

/* v1.4.0 Unified Grammar Academy Manager */
.academyMainToolbar{grid-template-columns:minmax(240px,1fr) auto auto auto!important}
.grammarManagerBtn{background:linear-gradient(135deg,#6d5dfc,#8b5cf6)!important;color:#fff!important;border-color:transparent!important}
.myGrammarChapter{border-color:rgba(139,92,246,.55)!important;box-shadow:0 0 0 1px rgba(139,92,246,.12) inset}
.myGrammarChapter .academyChapterHead{background:linear-gradient(135deg,rgba(109,93,252,.16),rgba(139,92,246,.08))}
.academyEmpty{padding:16px;color:#8a8fa3;font-size:13px;text-align:center}
.grammarManagerModal{position:fixed;inset:0;z-index:10000;background:rgba(9,12,24,.72);backdrop-filter:blur(8px);align-items:center;justify-content:center;padding:24px}
.grammarManagerCard,.grammarEditorCard{width:min(1050px,96vw);max-height:90vh;overflow:auto;background:#fff;border-radius:22px;box-shadow:0 30px 90px rgba(0,0,0,.32);padding:22px}
.grammarEditorCard{width:min(560px,96vw);display:grid;gap:10px}
.grammarManagerHead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;border-bottom:1px solid #e8eaf2;padding-bottom:14px;margin-bottom:16px}.grammarManagerHead h3{margin:2px 0 4px}.grammarManagerHead p{margin:0;color:#6b7280}
.iconClose{width:38px;height:38px;border-radius:50%;font-size:26px;line-height:1;padding:0;background:#f1f3f8;color:#333}
.grammarManagerActions{display:flex;gap:10px;margin-bottom:14px}.grammarManagerActions input{flex:1}
.grammarManagerTable{border:1px solid #e6e8ef;border-radius:14px;overflow:hidden}.gmRow{display:grid;grid-template-columns:2fr 1.1fr .8fr .6fr 1.3fr;gap:10px;align-items:center;padding:12px 14px;border-top:1px solid #edf0f5}.gmRow:first-child{border-top:0}.gmRow>span:first-child{display:flex;flex-direction:column;gap:3px}.gmRow small{color:#8a8fa3}.gmHeader{background:#f7f8fb;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.gmStatus{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.gmStatus.published{background:#dcfce7;color:#166534}.gmStatus.draft{background:#fef3c7;color:#92400e}.gmStatus.archived{background:#e5e7eb;color:#4b5563}.gmActions{display:flex!important;flex-direction:row!important;gap:6px}.mini.danger{background:#fff0f0;color:#c62828;border-color:#ffcaca}
.grammarEditorCard label{font-size:13px;font-weight:800;color:#34384a}.grammarEditorCard input,.grammarEditorCard textarea,.grammarEditorCard select{width:100%}
@media(max-width:760px){.academyMainToolbar{grid-template-columns:1fr 1fr!important}.academyMainToolbar input{grid-column:1/-1}.grammarManagerBtn{grid-column:1/-1}.gmHeader{display:none}.gmRow{grid-template-columns:1fr;gap:6px}.gmRow>span{display:flex;justify-content:space-between}.gmActions{justify-content:flex-end!important}.grammarManagerActions{flex-direction:column}}
/* v2.0 compact question-source layout */
.sourceSetup{max-width:1100px;margin:auto}.sourceCard,.settingsCard,.presetCard{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.11);border-radius:18px;padding:18px;margin-top:16px}.sourceSwitch{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.sourceChoice{display:flex;flex-direction:column;gap:4px;padding:16px;border:1px solid rgba(255,255,255,.14);border-radius:14px;cursor:pointer;background:rgba(0,0,0,.12)}.sourceChoice input{display:none}.sourceChoice.active{border-color:#63e6be;box-shadow:0 0 0 2px rgba(99,230,190,.18);background:rgba(99,230,190,.08)}.sourceChoice b{font-size:18px}.sourceChoice small{opacity:.72}.sourcePanel{margin-top:14px}.contentTabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.contentTab{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);padding:9px 14px;border-radius:999px}.contentTab.active{background:#2f9e44;border-color:#69db7c}.compactPresets{grid-template-columns:repeat(4,minmax(0,1fr))}.academyTree{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.academyChapter{margin:0}.academyChapterBody{max-height:320px;overflow:auto}.practicePreview{margin-top:16px}.grammarManagerBtn{margin-left:auto}@media(max-width:760px){.sourceSwitch,.academyTree,.compactPresets{grid-template-columns:1fr}.sourceCard,.settingsCard,.presetCard{padding:13px}.academyToolbar{display:grid;grid-template-columns:1fr 1fr}.academyToolbar input{grid-column:1/-1}.grammarManagerBtn{margin-left:0}}


/* v2.1 Unified Question Manager */
.contentQuestionManagerCard{width:min(1180px,96vw);height:min(820px,92vh);background:var(--card,#fff);border-radius:24px;box-shadow:0 24px 80px #0005;display:flex;flex-direction:column;overflow:hidden}
.contentManagerToolbar{display:grid;grid-template-columns:auto 1fr 210px;gap:10px;padding:14px 20px;border-top:1px solid #ffffff15;border-bottom:1px solid #ffffff18}
.contentManagerToolbar input,.contentManagerToolbar select{width:100%}
.contentManagerBody{display:grid;grid-template-columns:360px 1fr;min-height:0;flex:1}
.contentQuestionListPane{border-right:1px solid #ffffff18;display:flex;flex-direction:column;min-height:0;background:#091a32aa}
.contentQuestionCount{padding:10px 14px;font-size:12px;color:#9fb4d3;border-bottom:1px solid #ffffff12}
.contentQuestionList{overflow:auto;padding:8px}
.contentQuestionRow{width:100%;display:grid;grid-template-columns:1fr auto;text-align:left;gap:4px 10px;padding:12px;border:1px solid transparent;background:transparent;border-radius:12px;color:inherit;margin-bottom:6px}
.contentQuestionRow:hover,.contentQuestionRow.active{background:#3b82f61c;border-color:#60a5fa55}
.contentQuestionRow b{grid-column:1/3;font-size:13px;line-height:1.35}.contentQuestionRow small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9fb4d3}.statusDot{font-size:10px;text-transform:uppercase;padding:3px 7px;border-radius:999px;background:#334155}.statusDot.published{background:#166534}.statusDot.draft{background:#92400e}.statusDot.archived{background:#475569}
.contentQuestionEditor{overflow:auto;padding:22px}.contentEditorEmpty{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#9fb4d3;gap:8px}.contentEditorEmpty b{font-size:22px;color:#e5edf9}.contentEditorEmpty.success b{color:#4ade80}
.contentEditorHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.contentEditorHead h3{margin:3px 0 0}
.destinationCards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.destinationCard{display:block}.destinationCard input{position:absolute;opacity:0}.destinationCard span{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid #ffffff22;border-radius:14px;cursor:pointer;background:#ffffff08}.destinationCard input:checked+span{border-color:#60a5fa;background:#2563eb28;box-shadow:0 0 0 2px #60a5fa22}.destinationCard small{color:#9fb4d3}
.destinationFields,.contentEditorGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.contentEditorGrid{grid-template-columns:repeat(4,minmax(0,1fr));margin:12px 0}.destinationFields .fieldBox select[multiple]{min-height:112px}.contentQuestionEditor label{display:block;font-weight:700;font-size:12px;margin:12px 0 6px}.contentQuestionEditor input,.contentQuestionEditor textarea,.contentQuestionEditor select{width:100%;box-sizing:border-box}.optionGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.contentAdditional{margin-top:14px;padding:12px;border:1px solid #ffffff1d;border-radius:14px}.contentAdditional summary{cursor:pointer;font-weight:800}.editorHelp{display:block;color:#9fb4d3;margin-top:5px}
@media(max-width:850px){.contentManagerToolbar{grid-template-columns:1fr}.contentManagerBody{grid-template-columns:1fr}.contentQuestionListPane{max-height:250px;border-right:0;border-bottom:1px solid #ffffff18}.destinationCards{grid-template-columns:1fr}.destinationFields,.contentEditorGrid,.optionGrid{grid-template-columns:1fr}.contentQuestionManagerCard{height:95vh}}

/* v2.1.2 — compact, reliable Grammar Academy controls */
.grammarAcademyCompact{margin-top:12px;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:rgba(0,0,0,.12);overflow:hidden}
.grammarAcademyToggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}
.grammarAcademyToggle:hover{background:rgba(255,255,255,.045)}
.grammarAcademyToggle>span:first-child{display:flex;flex-direction:column;gap:3px}.grammarAcademyToggle b{font-size:17px}.grammarAcademyToggle small{opacity:.72;font-weight:700}
.grammarAcademyChevron{font-size:18px;font-weight:1000;min-width:24px;text-align:center}.grammarAcademyContent{padding:0 14px 14px;border-top:1px solid rgba(255,255,255,.09)}
.grammarAcademyContent[hidden],.academyChapterBody[hidden]{display:none!important}
.academyMainToolbar{display:grid!important;grid-template-columns:minmax(220px,1fr) auto auto auto auto!important;align-items:center;gap:8px;margin:12px 0!important}
.academyMainToolbar>*{min-width:0;white-space:nowrap}.academyMainToolbar input{width:100%}.academyMainToolbar button{height:40px}
@media(max-width:920px){.academyMainToolbar{grid-template-columns:minmax(180px,1fr) auto auto!important}.academyMainToolbar .grammarManagerBtn{grid-column:auto!important}.academyMainToolbar button:nth-of-type(3),.academyMainToolbar button:nth-of-type(4){grid-column:auto}}
@media(max-width:680px){.academyMainToolbar{display:flex!important;flex-wrap:wrap}.academyMainToolbar input{flex:1 1 100%}.academyMainToolbar button{flex:1 1 auto}.grammarAcademyContent{padding:0 10px 10px}}

/* ===== v2.1.3: Unit / Grammar Academy alignment and content-tab contrast ===== */
.sourceSetup{width:100%;max-width:1100px;box-sizing:border-box}
.sourceCard,.settingsCard,.presetCard{width:100%;box-sizing:border-box}
.sourceSwitch{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.sourceChoice{min-width:0;height:100%;box-sizing:border-box}
.sourcePanel{width:100%;box-sizing:border-box}

/* Keep Unit mode and Unit controls the same width and aligned in one row. */
.practiceCleanGrid.mainGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:stretch}
.practiceCleanGrid.mainGrid .fieldBox{width:100%;height:100%;box-sizing:border-box}
.practiceCleanGrid.mainGrid .fieldBox.wide{grid-column:auto!important}
.practiceCleanGrid.mainGrid .unitField{grid-column:auto!important}

/* Unit content choices: equal-width buttons, strong text contrast in all states. */
.contentTabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px!important;width:100%;box-sizing:border-box;margin-top:14px}
.contentTab{
  width:100%;min-height:44px;box-sizing:border-box;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:#eef4ff!important;color:#17335f!important;
  border:1px solid #b9cbee!important;border-radius:14px!important;
  padding:10px 12px!important;font-weight:900!important;
  text-shadow:none!important;box-shadow:0 5px 14px rgba(35,70,130,.08);
}
.contentTab:hover{background:#dfeaff!important;border-color:#7da2ed!important;color:#102a52!important}
.contentTab.active{
  background:linear-gradient(135deg,#2457d6,#2f9e44)!important;
  color:#fff!important;border-color:#6dd58a!important;
  box-shadow:0 8px 18px rgba(36,87,214,.24)!important;
}
.contentTab.active:hover{color:#fff!important}

/* Grammar Academy occupies exactly the same available width as Unit Learning. */
#unitSourcePanel,#grammarSourcePanel,.grammarAcademyCompact,.grammarAcademyContent{width:100%;max-width:none;box-sizing:border-box}
.grammarAcademyCompact{margin:0}
.grammarAcademyToggle{width:100%;box-sizing:border-box}
.academyTree{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:start}
.academyChapter{width:100%;min-width:0;box-sizing:border-box}

/* Question Settings fields also stay evenly aligned. */
.practiceCleanGrid.filterGrid{grid-template-columns:minmax(0,1fr) minmax(180px,.35fr)!important;align-items:stretch}
.practiceCleanGrid.filterGrid .fieldBox{height:100%;box-sizing:border-box}

@media(max-width:820px){
  .contentTabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .contentTab:first-child{grid-column:1/-1}
  .academyTree{grid-template-columns:1fr!important}
}
@media(max-width:620px){
  .sourceSwitch,.practiceCleanGrid.mainGrid,.practiceCleanGrid.filterGrid{grid-template-columns:1fr!important}
  .contentTabs{grid-template-columns:1fr!important}
  .contentTab:first-child{grid-column:auto}
}


/* v2.1.5 Grammar Manager safe table workflow */
.gmManagerHint{margin:-4px 0 14px;color:#6b7280;font-size:13px}
.grammarManagerActions button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:700px){.grammarManagerActions{flex-direction:column}.grammarManagerActions>*{width:100%}}

/* v2.2 Content Studio */
.arrangePreview{margin-top:10px;padding:10px;border:1px dashed rgba(100,116,139,.45);border-radius:10px;min-height:42px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.arrangePreview b{margin-right:4px}.contentManagerToolbar{flex-wrap:wrap}
.presetBtn.modified{outline:2px solid rgba(255,193,7,.9);box-shadow:0 0 0 3px rgba(255,193,7,.14)}
.presetBtn.modified small::after{content:" · Custom";font-weight:700}

/* v2.2.6 feature flag: Grammar Academy remains visible but disabled */
.sourceChoice.featureDisabled{opacity:.55;cursor:not-allowed;filter:grayscale(.25)}
.sourceChoice.featureDisabled *{cursor:not-allowed}

/* v2.4.2 — Keep Question Type, Difficulty, CEFR and Questions on one row */
.practiceCleanGrid.filterGrid{
  display:grid!important;
  grid-template-columns:minmax(190px,1.35fr) minmax(155px,1fr) minmax(185px,1.15fr) minmax(105px,.6fr)!important;
  align-items:stretch!important;
  gap:12px!important;
}
.practiceCleanGrid.filterGrid>.fieldBox{min-width:0!important;width:100%!important;height:100%!important;box-sizing:border-box!important}
.practiceCleanGrid.filterGrid>.fieldBox select,
.practiceCleanGrid.filterGrid>.fieldBox input{min-width:0!important}
@media(max-width:850px){
  .practiceCleanGrid.filterGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:520px){
  .practiceCleanGrid.filterGrid{grid-template-columns:1fr!important}
}

/* v2.4.4 Final Results: Top 3 left, rank 4+ right */
.finalOverlay .hallOfFameModal,
body.projectorMode .finalOverlay .hallOfFameModal{
  max-width:1240px!important;
  width:min(96vw,1240px)!important;
  max-height:94vh!important;
  overflow:auto!important;
}
.finalResultsGrid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.85fr);gap:18px;align-items:stretch;margin-top:10px;position:relative;z-index:2}
.finalTopSection{min-width:0;display:flex;flex-direction:column;justify-content:center}
.finalTopSection .hofTop3{margin-top:4px!important}
.finalTopSection .specialAwards{width:100%;box-sizing:border-box;margin-bottom:0!important}
.finalRankingPanel{min-width:0;background:linear-gradient(180deg,rgba(15,23,42,.94),rgba(30,41,59,.92));border:1px solid rgba(148,163,184,.26);border-radius:24px;padding:14px;box-shadow:0 20px 48px rgba(15,23,42,.28);color:#fff;display:flex;flex-direction:column;max-height:610px}
.finalRankingHead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 4px 12px;border-bottom:1px solid rgba(255,255,255,.12)}
.finalRankingHead span{font-size:11px;letter-spacing:1.4px;color:#93c5fd;font-weight:1000}
.finalRankingHead h3{margin:3px 0 0;font-size:21px;color:#fff}
.finalRankingHead>b{min-width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#3157ff;color:#fff;font-size:17px;box-shadow:0 8px 22px rgba(49,87,255,.35)}
.finalRankingList{overflow:auto;padding:8px 3px 2px;scrollbar-width:thin;scrollbar-color:#64748b transparent}
.finalRankRow{display:grid;grid-template-columns:38px 46px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 9px;margin:7px 0;border-radius:17px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.10);transition:transform .18s ease,background .18s ease}
.finalRankRow:nth-child(even){background:rgba(255,255,255,.11)}
.finalRankRow:hover{transform:translateX(-2px);background:rgba(59,130,246,.18)}
.finalRankNo{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:rgba(148,163,184,.16);font-weight:1000;color:#e2e8f0;font-size:16px}
.finalRankAvatar{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:#fff;font-size:25px;box-shadow:0 8px 20px rgba(0,0,0,.16)}
.finalRankInfo{min-width:0}.finalRankInfo b{display:block;color:#fff;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.finalRankInfo small{display:block;color:#cbd5e1;margin-top:3px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.finalRankScore{text-align:right;min-width:62px}.finalRankScore strong{display:block;font-size:23px;line-height:1;color:#60a5fa}.finalRankScore span{display:block;font-size:9px;letter-spacing:1px;color:#94a3b8;font-weight:1000;margin-top:3px}
.finalRankingEmpty{padding:28px 14px;text-align:center;color:#cbd5e1;font-weight:800}
@media(max-width:900px){
  .finalResultsGrid{grid-template-columns:1fr}
  .finalRankingPanel{max-height:330px}
  .finalTopSection .specialAwards{max-width:760px!important}
}
@media(max-width:560px){
  .finalOverlay .hallOfFameModal,body.projectorMode .finalOverlay .hallOfFameModal{width:96vw!important;padding:16px 11px!important}
  .finalRankRow{grid-template-columns:34px 40px minmax(0,1fr) auto;padding:8px 7px;gap:8px}
  .finalRankAvatar{width:38px;height:38px;font-size:22px}
  .finalRankInfo small{font-size:10px}
  .finalRankScore strong{font-size:20px}
}


/* v2.4.5 - Strong, persistent student answer selection */
.answerBtn.studentPicked,
.answerBtn.selected{
  position:relative!important;
  border:4px solid #16a34a!important;
  background:linear-gradient(135deg,#dcfce7 0%,#fef9c3 100%)!important;
  box-shadow:0 0 0 6px rgba(34,197,94,.22),0 20px 46px rgba(22,163,74,.30)!important;
  transform:translateY(-3px) scale(1.025)!important;
  opacity:1!important;
  filter:none!important;
}
.answerBtn.studentPicked .answerTapHint,
.answerBtn.selected .answerTapHint{
  background:#16a34a!important;color:#fff!important;font-weight:1000!important;
  border-radius:999px!important;padding:6px 12px!important;opacity:1!important;
}
.answerBtn.submitted:not(.selected):not(.studentPicked){
  opacity:.42!important;filter:grayscale(.55)!important;transform:none!important;
}
.answerBtn.selected.submitted,
.answerBtn.studentPicked.submitted{opacity:1!important;filter:none!important;}
@media(max-width:640px){
  .answerBtn.studentPicked,.answerBtn.selected{transform:translateY(-2px) scale(1.012)!important;border-width:3px!important;}
}

/* v3.0.0-beta1: Auto / Cloud / Offline connection status */
.connectionModeBox{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:14px 0;padding:12px 14px;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(0,0,0,.14)}
.connectionModeBox label{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700}.connectionModeBox select{min-width:170px;padding:8px 10px;border-radius:9px}
.connectionStatus{display:flex;flex-direction:column;gap:2px}.connectionStatus b{font-size:14px}.connectionStatus small{opacity:.82}.connectionStatus.cloud b{color:#73e6a2}.connectionStatus.offline b{color:#ffd36b}.connectionStatus.checking b{color:#a9c7ff}
@media(max-width:700px){.connectionModeBox{align-items:stretch;flex-direction:column}.connectionModeBox label{justify-content:space-between}.connectionModeBox select{flex:1}}

/* v3.0.0 Beta 2 — room question selection manager */
.questionSelectionActions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid rgba(148,163,184,.25)}
.questionSelectionActions small{color:var(--muted,#64748b)}
.roomQuestionManagerCard{width:min(1050px,94vw);max-height:90vh;overflow:hidden;background:var(--panel,#fff);border-radius:22px;box-shadow:0 24px 80px rgba(15,23,42,.32);padding:20px;display:flex;flex-direction:column}
.roomQuestionManagerToolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid rgba(148,163,184,.25)}
.roomQuestionManagerToolbar>div{margin-right:auto;display:flex;flex-direction:column;gap:2px}
.roomQuestionManagerToolbar small{color:var(--muted,#64748b)}
.roomQuestionManagerList{overflow:auto;padding:12px 2px;display:flex;flex-direction:column;gap:8px;min-height:220px}
.roomQuestionRow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:12px 14px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:rgba(255,255,255,.72);transition:.18s ease}
.roomQuestionRow:hover{border-color:rgba(59,130,246,.45);box-shadow:0 6px 18px rgba(15,23,42,.07)}
.roomQuestionRow.disabled{opacity:.48;background:rgba(148,163,184,.08)}
.roomQuestionCheck{display:flex;align-items:center;gap:8px;font-weight:800}
.roomQuestionCheck span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:rgba(59,130,246,.1)}
.roomQuestionText{min-width:0;display:flex;flex-direction:column;gap:4px}
.roomQuestionText b{white-space:normal;line-height:1.35}
.roomQuestionText small{color:var(--muted,#64748b);text-transform:capitalize}
.roomQuestionOrder,.roomQuestionActions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.roomQuestionOrder button:disabled,.roomQuestionActions button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:700px){.roomQuestionManagerCard{width:96vw;padding:14px}.roomQuestionManagerToolbar{align-items:stretch}.roomQuestionManagerToolbar>div{width:100%}.roomQuestionRow{grid-template-columns:auto 1fr}.roomQuestionOrder,.roomQuestionActions{grid-column:2;justify-content:flex-end}.questionSelectionActions{align-items:stretch}.questionSelectionActions button{width:100%}}

/* v3.0.0 Beta 3 — flexible room creation */

/* v3.1 Content Studio */
.contentStudioTabs{display:flex;gap:8px;padding:10px 18px;border-top:1px solid #ffffff15;border-bottom:1px solid #ffffff18;overflow:auto}.studioTab{background:#ffffff0b;color:inherit;border:1px solid #ffffff18;white-space:nowrap}.studioTab.active{background:#3157ff;color:#fff;border-color:#6d8cff}.contentStudioThree{grid-template-columns:220px 340px minmax(420px,1fr)!important}.contentExplorerPane{min-height:0;overflow:auto;background:#071428;border-right:1px solid #ffffff18;padding:10px}.explorerTitle{font-size:11px;letter-spacing:.12em;color:#8fa7c7;font-weight:900;padding:8px}.contentQuestionExplorer{display:flex;flex-direction:column;gap:4px}.explorerNode,.explorerTopic{width:100%;display:flex;justify-content:space-between;gap:8px;background:transparent;color:#dce8f8;padding:9px 10px;border:1px solid transparent;text-align:left;border-radius:9px}.explorerNode:hover,.explorerTopic:hover,.explorerNode.active,.explorerTopic.active{background:#3157ff22;border-color:#5f83ff55}.explorerNode b,.explorerTopic b{font-size:11px;color:#9db1cf}.explorerTopics{display:none;padding-left:12px}.explorerTopics.open{display:block}.explorerTopic{font-size:12px;padding:7px 9px}.contentLoadMore{margin:8px 12px 14px;width:calc(100% - 24px)}.studioSectionPlaceholder{padding:34px;min-height:420px}.studioSectionPlaceholder h3{font-size:26px;margin:0 0 10px}.questionLibrarySummary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px;border:1px solid #dfe8ff;border-radius:18px;background:linear-gradient(135deg,#f8fbff,#eef4ff)}.questionLibrarySummary h3{margin:4px 0}.questionLibrarySummary p{margin:4px 0;color:#5d6f8d}.libraryStatGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:14px 0}.libraryStat{background:#f8fbff;color:#17315b;border:1px solid #dfe8ff;display:flex;justify-content:space-between}.libraryStat span{background:#e8efff;border-radius:999px;padding:2px 8px}.compactLibraryActions{padding-top:4px}.studioV31 .contentQuestionManagerCard{max-width:none}
@media(max-width:1000px){.contentStudioThree{grid-template-columns:190px 300px minmax(360px,1fr)!important}.contentQuestionManagerCard{width:99vw}}
@media(max-width:820px){.contentStudioThree{grid-template-columns:1fr!important}.contentExplorerPane{max-height:180px;border-right:0;border-bottom:1px solid #ffffff18}.contentQuestionListPane{max-height:260px}.questionLibrarySummary{align-items:flex-start;flex-direction:column}.contentStudioTabs{padding:8px}}

/* v3.1.1 simplified classroom setup */
.simplifiedSetupTop{align-items:center}
.simplifiedSetupTop .practiceModePill{white-space:nowrap;background:rgba(16,185,129,.1);color:#047857;border:1px solid rgba(16,185,129,.25)}
.reviewCollectionCard{margin-top:16px;border:1px solid rgba(99,102,241,.25);background:linear-gradient(135deg,rgba(99,102,241,.07),rgba(14,165,233,.045));border-radius:18px;padding:18px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.reviewCollectionInfo{min-width:0}.reviewCollectionInfo h4{margin:3px 0 6px;font-size:18px}.reviewCollectionInfo p{margin:0;color:var(--muted,#64748b);font-size:14px;line-height:1.5}
.sectionKicker{display:block;font-size:11px;letter-spacing:.12em;font-weight:800;color:#6366f1}
.reviewCollectionActions{display:flex;align-items:center;gap:10px;flex:0 0 auto}.reviewCollectionActions button{margin:0;white-space:nowrap}
.roomQuestionManagerCard{max-width:980px}
.roomQuestionManagerToolbar{position:sticky;top:0;z-index:2;background:var(--card,#fff);padding-bottom:12px;border-bottom:1px solid rgba(148,163,184,.2)}
@media(max-width:760px){.reviewCollectionCard{align-items:stretch;flex-direction:column}.reviewCollectionActions{display:grid;grid-template-columns:1fr}.reviewCollectionActions button{width:100%}.simplifiedSetupTop{align-items:flex-start}.simplifiedSetupTop .practiceModePill{margin-top:4px}}

/* v3.1.2 — two clear classroom workflows */
.classroomWorkflowSwitch{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:4px 0 16px}.classroomWorkflowCard{display:flex!important;align-items:center!important;gap:13px!important;text-align:left!important;background:#f8fbff!important;color:#18335e!important;border:1px solid #dbe7ff!important;border-radius:18px!important;padding:15px!important;box-shadow:none!important}.classroomWorkflowCard:hover{border-color:#8ba8ff!important;transform:translateY(-1px)}.classroomWorkflowCard.active{background:linear-gradient(135deg,#3157ff,#6f3cff)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 12px 26px rgba(49,87,255,.24)!important}.classroomWorkflowCard .workflowIcon{font-size:28px}.classroomWorkflowCard span:last-child{display:flex;flex-direction:column;gap:3px}.classroomWorkflowCard b{font-size:16px}.classroomWorkflowCard small{font-size:12px;opacity:.78;line-height:1.35}.classroomWorkflowCard.active small{opacity:.92}
.lessonCollectionWorkspace{margin-top:12px}.collectionWorkspaceHead{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;border:1px solid #dbe7ff;border-radius:18px;background:#f8fbff;margin-bottom:12px}.collectionWorkspaceHead h3{margin:3px 0 4px;color:#17345f}.collectionWorkspaceHead p{margin:0;color:#667a9b}.collectionWorkspaceGrid{display:grid;grid-template-columns:minmax(230px,32%) 1fr;gap:12px;min-height:420px}.savedCollectionPane,.savedCollectionDetail{background:#fff;border:1px solid #dbe7ff;border-radius:18px;padding:14px}.savedCollectionTitle{display:flex;justify-content:space-between;align-items:center;padding:4px 2px 12px;color:#17345f}.savedCollectionTitle span{background:#eef3ff;color:#3157ff;border-radius:999px;padding:4px 9px;font-weight:900}.savedCollectionList{display:flex;flex-direction:column;gap:8px}.savedCollectionItem{display:flex!important;align-items:center!important;gap:10px!important;text-align:left!important;width:100%;background:#f8fbff!important;color:#17345f!important;border:1px solid #e1e9fb!important;border-radius:14px!important;padding:11px!important;box-shadow:none!important}.savedCollectionItem span:last-child{display:flex;flex-direction:column;gap:3px;min-width:0}.savedCollectionItem b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.savedCollectionItem small{color:#6c7f9d}.savedCollectionItem.active{background:#eef3ff!important;border-color:#3157ff!important}.collectionEmpty{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;color:#667a9b}.collectionEmpty.compact{min-height:140px}.collectionEmpty b{color:#17345f}.collectionDetailHead{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid #e6ecf8}.collectionDetailHead h3{margin:3px 0 4px;color:#17345f}.collectionDetailHead p{margin:0;color:#667a9b}.collectionDetailActions{display:flex;gap:8px}.collectionPreviewList{display:flex;flex-direction:column;gap:8px;padding:14px 0}.collectionPreviewRow{display:grid;grid-template-columns:32px 1fr;gap:10px;align-items:center;background:#f8fbff;border:1px solid #e5ecfa;border-radius:13px;padding:10px}.collectionPreviewRow>span{width:30px;height:30px;display:grid;place-items:center;background:#eef3ff;color:#3157ff;border-radius:10px;font-weight:900}.collectionPreviewRow div{display:flex;flex-direction:column;gap:3px;min-width:0}.collectionPreviewRow b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#17345f}.collectionPreviewRow small{color:#6c7f9d}.collectionMore{text-align:center;color:#667a9b;font-weight:800;padding:8px}.collectionFooterActions{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #e6ecf8;padding-top:12px}.dangerSoft{background:#fff1f2!important;color:#be123c!important;border:1px solid #fecdd3!important;box-shadow:none!important}
@media(max-width:760px){.classroomWorkflowSwitch{grid-template-columns:1fr}.collectionWorkspaceHead,.collectionDetailHead{align-items:stretch;flex-direction:column}.collectionWorkspaceGrid{grid-template-columns:1fr}.collectionDetailActions{display:grid;grid-template-columns:1fr 1fr}.collectionWorkspaceHead button,.collectionDetailActions button{width:100%}}

/* v3.1.3 — Content Studio viewport/layout fix + Quick Room exact-count feedback */
.grammarManagerModal{
  overflow-y:auto;
  align-items:flex-start;
  padding:12px;
}
.contentQuestionManagerCard.studioV31{
  width:min(1420px,calc(100vw - 24px));
  height:min(900px,calc(100vh - 24px));
  max-height:calc(100vh - 24px);
  margin:0 auto;
  border-radius:20px;
  overflow:hidden;
}
.contentQuestionManagerCard.studioV31>.grammarManagerHead{
  flex:0 0 auto;
  margin:0;
  padding:16px 20px 13px;
  min-height:72px;
  box-sizing:border-box;
  background:#0b1830;
  color:#f4f8ff;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.contentQuestionManagerCard.studioV31>.grammarManagerHead h3{
  margin:2px 0 4px;
  line-height:1.25;
}
.contentQuestionManagerCard.studioV31>.grammarManagerHead p{
  color:#a9bad2;
  line-height:1.35;
  white-space:normal;
}
.contentQuestionManagerCard.studioV31>.contentStudioTabs,
.contentQuestionManagerCard.studioV31 .contentManagerToolbar{
  flex:0 0 auto;
}
.contentQuestionManagerCard.studioV31 #contentLibrarySection{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.contentQuestionManagerCard.studioV31 .contentManagerBody{
  min-height:0;
  overflow:hidden;
}
.contentQuestionManagerCard.studioV31 .contentExplorerPane,
.contentQuestionManagerCard.studioV31 .contentQuestionListPane,
.contentQuestionManagerCard.studioV31 .contentQuestionEditor{
  min-width:0;
  min-height:0;
}
.contentQuestionManagerCard.studioV31 .contentQuestionEditor{
  padding:18px 20px 28px;
}
#roomQuestionManagerCount.countWarning{color:#f59e0b}
@media(max-width:1000px){
  .contentQuestionManagerCard.studioV31{width:calc(100vw - 12px);height:calc(100vh - 12px);max-height:calc(100vh - 12px);border-radius:14px}
  .grammarManagerModal{padding:6px}
  .contentQuestionManagerCard.studioV31>.grammarManagerHead{padding:13px 14px 11px}
}
@media(max-width:820px){
  .contentQuestionManagerCard.studioV31{height:auto;min-height:calc(100vh - 12px);overflow:auto}
  .contentQuestionManagerCard.studioV31 #contentLibrarySection{overflow:visible}
  .contentQuestionManagerCard.studioV31 .contentManagerBody{overflow:visible}
}

/* v3.1.4 Lesson Builder + compact Question Library */
.collectionSearchInput{width:100%;box-sizing:border-box;margin:0 0 10px;padding:10px 12px;border:1px solid #dbe7ff;border-radius:12px;background:#fff;color:#17345f}
.collectionBuilderToolbar{display:flex;gap:8px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid #e6ecf8}
.collectionLibraryPicker{margin:12px 0;padding:12px;border:1px solid #cddcff;border-radius:16px;background:#f7faff}
.collectionLibrarySearch{display:grid;grid-template-columns:1fr 180px;gap:8px;margin-bottom:10px}
.collectionLibrarySearch input,.collectionLibrarySearch select{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #d7e2f6;border-radius:11px;background:#fff}
.collectionLibraryResults{display:flex;flex-direction:column;gap:7px;max-height:320px;overflow:auto}
.collectionLibraryResult{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 11px;background:#fff;border:1px solid #e1e9f7;border-radius:12px}
.collectionLibraryResult>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.collectionLibraryResult b{color:#17345f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.collectionLibraryResult small{color:#6b7f9d}
.collectionQuestionList{display:flex;flex-direction:column;gap:8px;padding:14px 0}
.collectionQuestionRow{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid #e3ebf8;border-radius:13px;background:#fbfdff}
.collectionQuestionNumber{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#eef3ff;color:#3157ff;font-weight:900}
.collectionQuestionText{display:flex;flex-direction:column;gap:3px;min-width:0}
.collectionQuestionText b{color:#17345f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.collectionQuestionText small{color:#6b7f9d}
.collectionQuestionActions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.compactStudio{width:min(1180px,96vw)!important;max-height:92vh!important;padding:0!important;overflow:hidden!important}
.compactStudio>.grammarManagerHead{padding:18px 20px}
.compactStudioToolbar{display:grid!important;grid-template-columns:auto minmax(220px,1fr) 170px 180px;gap:8px;padding:12px 18px!important;border-top:1px solid #ffffff18;border-bottom:1px solid #ffffff18}
.compactStudioBody{display:grid!important;grid-template-columns:minmax(320px,38%) minmax(0,1fr)!important;min-height:0;height:min(68vh,700px)!important}
.compactStudio .contentQuestionListPane{max-height:none!important;overflow:auto;border-right:1px solid #ffffff18}
.compactStudio .contentQuestionEditor{overflow:auto;min-width:0}
@media(max-width:850px){.collectionWorkspaceGrid{grid-template-columns:1fr}.collectionLibrarySearch{grid-template-columns:1fr}.collectionQuestionRow{grid-template-columns:32px 1fr}.collectionQuestionActions{grid-column:2;justify-content:flex-start}.compactStudioToolbar{grid-template-columns:1fr 1fr}.compactStudioToolbar input{grid-column:1/-1}.compactStudioBody{grid-template-columns:1fr!important;height:auto!important;max-height:78vh;overflow:auto}.compactStudio .contentQuestionListPane{max-height:280px!important;border-right:0;border-bottom:1px solid #ffffff18}}

/* Stable 1.0: simplified My Lessons workflow */
.lessonMenuActions{display:flex;gap:8px;align-items:center}
.collectionBuilderToolbar{justify-content:flex-start}
.collectionBuilderToolbar>button{min-width:160px}
.collectionQuestionList{padding-bottom:118px}
.lessonCreateFooter{position:sticky;bottom:12px;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin:8px auto 0;padding:14px 18px;border:1px solid #cfe0ff;border-radius:18px;background:rgba(255,255,255,.97);box-shadow:0 10px 28px rgba(24,56,112,.16);backdrop-filter:blur(10px)}
.lessonCreateFooter>div{display:flex;align-items:center;gap:10px;color:#17345f}
.lessonCreateFooter>div b{font-size:1rem}
.lessonCreateFooter>div span{color:#667a9b;font-weight:800}
.lessonCreateFooter.ready>div b{color:#14804a}
.lessonCreateFooter.notReady>div b{color:#7b879d}
.lessonCreateRoomBtn{min-width:min(360px,90%);padding:15px 28px!important;font-size:1.04rem!important;font-weight:950!important;letter-spacing:.04em;border-radius:15px!important}
.lessonCreateRoomBtn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none!important}
.compactQuestionFields{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.savedCollectionItem small{text-transform:none}
@media(max-width:760px){.lessonMenuActions{display:grid;grid-template-columns:1fr 1fr}.lessonCreateFooter{bottom:8px}.lessonCreateRoomBtn{width:100%;min-width:0}.compactQuestionFields{grid-template-columns:1fr 1fr!important}}

/* Stable 1.0.3 answer/reveal feedback */
.wrongOption{outline:3px solid #ef4444!important;background:rgba(239,68,68,.16)!important}.responseProgress{display:inline-flex;align-items:center;gap:.35rem;margin:.45rem 0 .75rem;padding:.45rem .75rem;border-radius:999px;background:rgba(59,130,246,.12);font-weight:700}.teacherOption small{display:block;margin-top:.25rem;opacity:.75;font-weight:600}

/* Web RC4: Quick Room edit / one-for-one replacement */
.replaceQuestionCard{width:min(900px,94vw)}
.managedReplaceResults{max-height:58vh;overflow:auto;margin-top:12px}
.roomQuestionActions .mini{white-space:nowrap}