@import url("../assets/fonts/local-fonts.css");
:root{font-family:Inter,"Segoe UI",sans-serif;color:#eef3ff;background:#0d1533;font-synthesis:none;--sp-blue:#32b9ff;--sp-red:#ff5a88;--sp-violet:#8b6cff;--sp-ink:#172344;--sp-muted:#697692;--sp-card:#fff}
*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}
body[data-page=teacher]{min-height:100vh;padding:24px clamp(12px,3vw,38px) 50px;background:radial-gradient(ellipse at 4% 0,#27568666 0,transparent 35%),radial-gradient(ellipse at 94% 5%,#733b8060 0,transparent 31%),linear-gradient(135deg,#0c1430,#151b3e 58%,#12233a)}
.sp-shell{width:min(1380px,100%);margin:0 auto}.sp-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.sp-header h1{font-size:clamp(30px,4vw,46px);letter-spacing:-.035em;margin:7px 0;color:#fff}.sp-header p{margin:0;color:#c4cde1}.sp-header nav{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.sp-eyebrow{font-size:10px;font-weight:900;letter-spacing:.19em;color:#96aaff}.sp-layout{display:grid;grid-template-columns:minmax(290px,385px) minmax(0,1fr);gap:20px;align-items:start}.sp-panel{border:1px solid #ffffff24;border-radius:22px;background:linear-gradient(145deg,#ffffff12,#ffffff09);box-shadow:0 22px 60px #03081755,inset 0 1px #ffffff16;backdrop-filter:blur(14px)}.setup-panel{padding:23px}.sp-step{display:flex;gap:13px;align-items:flex-start;margin-bottom:18px}.sp-step>b{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:12px;color:#fff;background:linear-gradient(135deg,#31bafa,#8b68f7);box-shadow:0 8px 20px #3d82e755;font-size:13px}.sp-step h2,.sp-game-top h2{margin:0;color:#fff;font-size:21px}.sp-step p{margin:5px 0 0;color:#b9c5dc;font-size:13px;line-height:1.5}
.upload-zone{display:flex;min-height:180px;padding:18px;align-items:center;justify-content:center;flex-direction:column;gap:7px;border:1px dashed #99aaff88;border-radius:17px;text-align:center;color:#eef3ff;background:radial-gradient(circle at 50% 0,#8974ff25,transparent 65%),#151e3d;cursor:pointer;transition:.2s}.upload-zone:hover{border-color:#6ad5ff;transform:translateY(-1px)}.upload-icon{font-size:29px}.upload-zone small{color:#aab8d2}.upload-zone img{width:120px;height:120px;object-fit:cover;border-radius:14px;border:2px solid #ffffff33;box-shadow:0 8px 25px #050a1d80}.image-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8290b1;font-size:11px}.sp-filters{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:17px 0}.sp-filters label{display:grid;gap:7px;color:#cbd6eb;font-weight:750;font-size:12px}.sp-filters select{min-width:0;padding:11px 12px;border:1px solid #ffffff20;border-radius:11px;color:#eff3ff;background:#1d2948}.sp-filters option{color:#172344;background:white}.sp-button{display:inline-flex;min-height:43px;padding:11px 15px;align-items:center;justify-content:center;border:1px solid transparent;border-radius:11px;font-weight:850;text-decoration:none;transition:transform .16s,filter .16s,box-shadow .16s}.sp-button:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.07)}.sp-button:disabled{opacity:.42}.sp-button.soft{color:#e0e7ff;border-color:#ffffff23;background:#ffffff0c}.sp-button.bright{color:white;background:linear-gradient(110deg,#735dff,#4c82ff 58%,#22b7e9);box-shadow:0 9px 23px #514de94a}.sp-button.full{width:100%}.start-button{margin-top:13px}.sp-status{min-height:18px;margin:11px 0;color:#aab9d5;font-size:12px}.question-list{display:grid;max-height:260px;gap:7px;overflow:auto;padding-right:3px}.question-list article{display:flex;gap:9px;padding:10px;border:1px solid #ffffff13;border-radius:11px;color:#dbe5f8;background:#ffffff08;font-size:12px;line-height:1.55}.question-list article b{color:#82d5ff}.game-panel{padding:22px}.sp-game-top{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:17px;border-bottom:1px solid #ffffff18}.sp-game-top h2{margin-top:5px}.live-pill{padding:8px 11px;border:1px solid #42e2b755;border-radius:99px;color:#78efc4;background:#27c98016;font-weight:800;font-size:11px}.team-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin:16px 0}.team-chip{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid #ffffff17;border-radius:14px;background:#ffffff08;color:#fff;transition:.2s}.team-chip>div{display:grid;gap:4px}.team-chip b{font-size:12px;letter-spacing:.1em}.team-chip small{color:#b9c5dc;font-size:11px}.team-chip small span{color:#fff;font-weight:900;font-size:17px}.team-dot{width:12px;height:12px;flex:none;border-radius:50%;background:var(--sp-blue);box-shadow:0 0 15px currentColor}.red-team .team-dot{background:var(--sp-red)}.team-chip.is-active{border-color:#55cfffaa;background:linear-gradient(120deg,#209deb34,#5967e930);box-shadow:0 0 0 2px #40b9ff25,0 9px 25px #06102755}.team-chip.red-team.is-active{border-color:#ff6999aa;background:linear-gradient(120deg,#ff386f26,#7953dd29);box-shadow:0 0 0 2px #ff5b9222,0 9px 25px #06102755}.turn-indicator{display:grid;gap:5px;text-align:center;color:#8290ae;font-size:9px;font-weight:900;letter-spacing:.12em}.turn-indicator strong{color:#fff;font-size:13px;letter-spacing:0}.play-layout{display:grid;grid-template-columns:minmax(260px,.93fr) minmax(260px,1.07fr);gap:20px;align-items:start}.board-wrap{display:grid;justify-items:center;gap:12px}.slide-board{--puzzle-image:none;display:grid;width:min(100%,440px);aspect-ratio:1;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:8px;border:1px solid #ffffff47;border-radius:19px;background:#0a1027;box-shadow:0 18px 45px #03081990,inset 0 1px #ffffff45;touch-action:manipulation}.slide-tile{display:block;min-width:0;min-height:0;padding:0;border:1px solid #ffffff6e;border-radius:7px;background-image:var(--puzzle-image);background-size:400% 400%;background-position:var(--tile-x) var(--tile-y);box-shadow:inset 0 1px #ffffff57,0 3px 8px #03081675;transition:transform .12s,filter .12s,opacity .12s}.slide-tile:disabled{opacity:1}.slide-board:not(.projector-board) .slide-tile:not(.empty):not(:disabled):hover{transform:scale(.97);filter:brightness(1.1)}.slide-board:not(.projector-board) .slide-tile:not(.empty):not(:disabled){outline:2px solid #6ad3ff55}.slide-tile.empty{display:grid;place-items:center;border:1px dashed #e4edff8c;background-image:linear-gradient(#e7edff33,#e7edff33),var(--puzzle-image);opacity:.46}.slide-tile.empty span{padding:6px;border-radius:7px;color:#fff;background:#131a3dbd;font-size:8px;font-weight:950;letter-spacing:.15em}.slide-board.solved-board{overflow:hidden;padding:5px}.puzzle-complete-art{grid-column:1/-1;grid-row:1/-1;border-radius:12px;background-image:var(--puzzle-image);background-size:100% 100%;animation:pop-in .55s cubic-bezier(.2,.9,.2,1.15)}@keyframes pop-in{from{transform:scale(.9);opacity:.4}to{transform:scale(1);opacity:1}}.move-help{margin:0;color:#aebbd5;text-align:center;font-size:12px;font-weight:750}.teacher-controls{display:grid;gap:12px}.control-title span{color:#8fa1c2;font-size:10px;font-weight:900;letter-spacing:.12em}.control-title span b{color:#a9a0ff;margin-left:7px}.control-title h3{margin:6px 0 0;color:white;font-size:18px}.question-card{min-height:145px;padding:15px;border:1px solid #ffffff18;border-radius:15px;color:#e8efff;background:linear-gradient(145deg,#1a2544,#131e39)}.cq-kicker{color:#9f9bff;font-size:9px;font-weight:900;letter-spacing:.13em}.question-card h2{margin:12px 0;color:#fff;font-size:18px;line-height:1.65}.cq-passage{margin-top:10px;padding:12px;border-left:3px solid #39c8f5;border-radius:8px;color:#cfdaef;background:#ffffff09;font-size:13px;line-height:1.7}.cq-passage small{color:#7fc8ff;font-weight:900;letter-spacing:.12em}.cq-passage p{margin:5px 0}.cq-image{display:block;max-width:min(100%,260px);max-height:160px;object-fit:contain;margin:9px auto 0;border-radius:9px}.cq-answer{padding:11px;border-radius:10px;font-size:12px;line-height:1.65}.cq-answer p{margin:5px 0 0}.cq-answer.correct{color:#9af3cb;background:#0c8e6230;border:1px solid #35daa570}.cq-answer.wrong{color:#ffcfda;background:#a6234a38;border:1px solid #fd779274}.awaiting-mark,.empty-question{color:#9eacc6;font-size:12px;line-height:1.6}.judge-row,.control-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.sp-button.correct-button{color:#a9f6d1;border-color:#27d59a4d;background:#10a66a26}.sp-button.wrong-button{color:#ffc2d1;border-color:#f76c8d4d;background:#c02b5124}.sp-button.end-button{width:100%;color:#ffb6c7;border:1px solid #ff6a8a36;background:#ff335418;font-size:11px}.no-session{display:flex;gap:14px;align-items:center;margin-top:18px;padding:16px 18px;border:1px solid #ffffff16;border-radius:16px;color:#e8efff;background:#ffffff08}.no-session[hidden]{display:none}.no-session>span{font-size:28px}.no-session p{margin:4px 0 0;color:#aab8d2;font-size:12px}
@media(max-width:950px){.sp-layout{grid-template-columns:1fr}.setup-panel{max-width:none}.play-layout{grid-template-columns:minmax(250px,.9fr) minmax(260px,1.1fr)}.slide-board{width:min(100%,440px)}}
@media(max-width:680px){body[data-page=teacher]{padding:15px 11px 35px}.sp-header{align-items:flex-start;flex-direction:column}.sp-header nav{width:100%;justify-content:flex-start}.sp-layout{gap:13px}.setup-panel,.game-panel{padding:16px;border-radius:17px}.sp-filters{grid-template-columns:1fr}.team-bar{grid-template-columns:1fr 1fr}.turn-indicator{grid-column:1/-1;grid-row:1;text-align:left}.play-layout{grid-template-columns:1fr;gap:20px}.slide-board{width:min(100%,460px)}.sp-game-top{align-items:flex-start;flex-direction:column}.teacher-controls{gap:10px}}
@media(max-width:390px){.sp-header nav .sp-button{flex:1;padding:10px}.judge-row,.control-actions{grid-template-columns:1fr}}
.question-card h2,.cq-passage,.cq-answer p{font-family:"Hind Siliguri",Inter,sans-serif}

/* Keep the teacher reference inside the same bounded, flipping board as the puzzle. */
.teacher-board-flip{position:relative;width:min(100%,440px);aspect-ratio:1;perspective:1200px}
.teacher-board-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.2,.75,.2,1)}
.teacher-board-flip.is-flipped .teacher-board-inner{transform:rotateY(180deg)}
.teacher-board-face{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.teacher-board-front{transform:rotateY(0)}
.teacher-board-face .slide-board{width:100%;height:100%}
.teacher-board-back{padding:8px;border:2px solid #ffffff80;border-radius:19px;background:#101a36;transform:rotateY(180deg)}
.teacher-board-back img{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:cover;border:1px solid #ffffff66;border-radius:12px}

/* Projector: focused stage, team rails and viewport-safe flip board */
body.projector-page{height:100vh;height:100dvh;min-height:0;overflow:hidden;padding:clamp(8px,1.25vw,18px);color:#1e3158;background:radial-gradient(ellipse at 8% 8%,#d7f4ff 0,transparent 34%),radial-gradient(ellipse at 94% 9%,#fce7f1 0,transparent 33%),linear-gradient(145deg,#f5f8ff,#fdfaff 53%,#f0fbf7)}
.projector-shell{position:relative;isolation:isolate;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(1720px,100%);height:100%;min-height:0;gap:clamp(8px,1.2vh,14px);margin:0 auto;padding:clamp(10px,1.3vw,18px);overflow:hidden;border:1px solid #fff;border-radius:26px;background:radial-gradient(ellipse at 50% 50%,#ffffffc9,transparent 68%),linear-gradient(145deg,#ffffff8f,#f5f8ffad);box-shadow:0 22px 70px #4c638321,inset 0 1px #fff}
.projector-shell:before{position:absolute;z-index:-1;inset:0;content:"";pointer-events:none;background:radial-gradient(circle at 50% 52%,#8175ed0b 0 1px,transparent 1.5px);background-size:22px 22px;mask-image:radial-gradient(ellipse at center,#000 0,transparent 72%)}
.projector-header{display:flex;flex:none;align-items:center;justify-content:space-between;gap:18px;min-height:68px;padding:9px 16px;border:1px solid #e1e8f5;border-radius:18px;background:#ffffffdc;box-shadow:0 6px 22px #445b8412,inset 0 1px #fff}
.projector-title{display:flex;align-items:center;gap:13px}.projector-title h1{margin:2px 0 0;color:#1e3158;font-size:clamp(22px,2.5vw,34px);font-weight:900;letter-spacing:-.035em}.projector-title .sp-eyebrow{color:#6478a1;font-size:9px;letter-spacing:.16em}
.puzzle-mark{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:3px;width:48px;height:48px;padding:9px;border:1px solid #dce5f5;border-radius:15px;background:linear-gradient(145deg,#fff,#f3f7ff);box-shadow:0 5px 14px #526a941c}.puzzle-mark i{display:block;border-radius:4px;background:linear-gradient(145deg,#3abff1,#4388ed)}.puzzle-mark i:nth-child(2){background:linear-gradient(145deg,#9274fa,#6e5fe7)}.puzzle-mark i:nth-child(3){background:linear-gradient(145deg,#31c99a,#17a782)}.puzzle-mark i:nth-child(4){background:#e5ebf6}
.turn-banner{display:flex;align-items:center;gap:10px;padding:9px 13px;border:1px solid #dce5f5;border-radius:12px;color:#7180a0;background:#f9fbff;font-size:9px;font-weight:900;letter-spacing:.12em}.turn-banner b{margin:0;color:#27477e;font-size:14px;letter-spacing:0}
.projector-layout{display:grid;grid-template-columns:minmax(175px,.72fr) minmax(0,2.25fr) minmax(175px,.72fr);grid-template-areas:"blue stage red";align-items:center;justify-items:center;gap:clamp(16px,2.3vw,36px);width:100%;min-height:0;padding:clamp(6px,1.1vh,12px) clamp(8px,2vw,30px)}
.projector-layout[hidden]{display:none}.arena-team{display:flex;flex-direction:column;width:min(100%,250px);min-width:0;padding:18px 17px;border:1px solid #dfe8f5;border-radius:20px;background:linear-gradient(150deg,#fff,#f8fbff);box-shadow:0 12px 34px #354e7718,inset 0 1px #fff;transition:transform .22s,box-shadow .22s,border-color .22s}.arena-team.blue-team{grid-area:blue}.arena-team.red-team{grid-area:red}.arena-team.is-active{transform:translateY(-4px);border-color:#6cc6f0;box-shadow:0 0 0 3px #48b8ec18,0 18px 36px #3b7faa26,inset 0 1px #fff}.arena-team.red-team.is-active{border-color:#f68cb0;box-shadow:0 0 0 3px #ed5c8b16,0 18px 36px #a9456820,inset 0 1px #fff}
.arena-team-heading{display:flex;align-items:center;gap:9px;color:#52678f;font-size:11px;font-weight:950;letter-spacing:.13em}.arena-team .team-dot{width:11px;height:11px}.arena-active-label{align-self:flex-start;margin:17px 0 3px;padding:5px 8px;border-radius:99px;color:#2c6d9c;background:#e9f7ff;font-size:8px;font-weight:900;letter-spacing:.1em;opacity:0}.arena-team.is-active .arena-active-label{opacity:1}.arena-team.red-team .arena-active-label{color:#a84064;background:#fff0f4}.arena-score{display:flex;align-items:baseline;gap:8px}.arena-score b{color:#203962;font-size:clamp(42px,4vw,58px);line-height:1;font-variant-numeric:tabular-nums}.arena-score span{color:#7c8aa6;font-size:12px;font-weight:800}.arena-progress{display:grid;gap:8px;margin-top:20px}.arena-progress>div{display:flex;justify-content:space-between;gap:8px;color:#7887a3;font-size:10px;font-weight:750}.arena-progress>div b{color:#2e466e;font-variant-numeric:tabular-nums}.progress-track{height:7px;overflow:hidden;border-radius:99px;background:#e9eff8}.progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4cbef0,#7268e8);transition:width .35s}.red-team .progress-track i{background:linear-gradient(90deg,#ff8ca8,#e85083)}.arena-team p{margin:16px 0 0;color:#8591a8;font-size:10px;line-height:1.55}
.projector-board-wrap{grid-area:stage;display:grid;align-content:center;justify-items:center;gap:10px;width:100%;height:100%;min-width:0;min-height:0;perspective:1400px}.projector-board-flip{width:min(100%,min(72vh,calc(100dvh - 280px),790px));aspect-ratio:1;perspective:1500px}.projector-board-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.75,.2,1)}.projector-board-flip.is-flipped .projector-board-inner{transform:rotateY(180deg)}.projector-board-face{position:absolute;inset:0;display:grid;place-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden}.projector-board-front{transform:rotateY(0)}.projector-board-back{overflow:hidden;padding:clamp(8px,1vw,14px);border:2px solid #fff;border-radius:24px;background:linear-gradient(145deg,#334e82,#233863);box-shadow:0 10px 0 #c5d2e7,0 24px 40px #344b722b,inset 0 2px 4px #fff9;transform:rotateY(180deg)}.projector-board-back img{width:100%;height:100%;border:2px solid #ffffffbd;border-radius:14px;object-fit:cover;box-shadow:0 6px 16px #17284e5a}
.projector-board{width:100%;height:100%;aspect-ratio:1;gap:clamp(4px,.55vw,8px);padding:clamp(8px,1vw,14px);border:2px solid #fff;border-radius:24px;background:linear-gradient(145deg,#334e82,#233863 55%,#435d91);box-shadow:0 10px 0 #c5d2e7,0 24px 40px #344b722b,inset 0 2px 4px #fff9;transform:none}.projector-board .slide-tile{border:2px solid #ffffffc9;border-radius:clamp(6px,.7vw,11px);box-shadow:inset 0 2px 3px #fff9,0 4px 8px #17284e55}.slide-tile.empty{border:2px dashed #93a8ca;background:none!important;background-color:#e1e9f5;opacity:1;box-shadow:inset 0 3px 12px #526a9127}
.board-caption{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px;color:#687b9f;font-size:9px;font-weight:900;letter-spacing:.11em}.board-caption>span b{color:#354f7d}.pulse-dot{width:8px;height:8px;border-radius:50%;background:#19ba91;box-shadow:0 0 10px #19ba9170}.projector-status{padding:5px 9px;border:1px solid #dfe7f3;border-radius:99px;color:#647795;background:#ffffffc9;font-size:10px;font-weight:750;letter-spacing:0}.projector-flip-button{min-height:30px;padding:6px 11px;border:1px solid #ccd9ed;border-radius:9px;color:#304f7e;background:linear-gradient(120deg,#fff,#eef5ff);box-shadow:0 3px 9px #435b8915;font-size:10px;font-weight:850;letter-spacing:0;cursor:pointer;transition:transform .16s,box-shadow .16s}.projector-flip-button:hover{transform:translateY(-1px);box-shadow:0 6px 14px #435b8925}
.projector-footer{display:flex;justify-content:space-between;padding:0 5px;color:#8995ab;font-size:8px;font-weight:850;letter-spacing:.16em}.projector-footer b{color:#855cd4}.projector-wait{display:grid;grid-row:2;align-content:center;justify-items:center;padding:25px;border:1px solid #e1e9f5;border-radius:22px;text-align:center;background:#ffffffc9;box-shadow:0 15px 36px #354e7715}.projector-wait[hidden]{display:none}.waiting-emoji{font-size:56px;filter:drop-shadow(0 8px 15px #8f66ff55)}.projector-wait h2{margin:10px 0 5px;color:#203962;font-size:clamp(24px,3vw,40px)}.projector-wait p{margin:0;color:#7585a1}.projector-page [hidden]{display:none!important}
.question-overlay{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:14px;overflow:hidden;background:#dce6f2a8;backdrop-filter:blur(8px);animation:overlay-in .2s ease-out}.question-overlay[hidden]{display:none!important}@keyframes overlay-in{from{opacity:0}to{opacity:1}}.question-overlay-card{display:flex;flex-direction:column;gap:10px;width:min(1180px,calc(100vw - 28px));height:calc(100vh - 28px);height:calc(100dvh - 28px);overflow:hidden;padding:clamp(14px,2vh,24px);border:1px solid #dfe7f3;border-radius:24px;background:linear-gradient(145deg,#fff,#f4f7ff 62%,#edfbff);box-shadow:0 28px 80px #253b6438,0 0 0 7px #ffffff70,inset 0 1px #fff}.overlay-heading{display:flex;flex:none;align-items:center;gap:13px;margin:0}.overlay-icon{display:grid;place-items:center;width:clamp(42px,5vh,60px);height:clamp(42px,5vh,60px);flex:none;border-radius:15px;color:#fff;background:linear-gradient(145deg,#4fc8ff,#7966f5 58%,#ec68ba);box-shadow:0 8px 20px #7165d938;font-size:26px}.overlay-heading>div{min-width:0;flex:1}.overlay-kicker{color:#5572c8;font-size:clamp(10px,1vw,13px);font-weight:950;letter-spacing:.14em}.overlay-heading h2{margin:3px 0 0;color:#203564;font-size:clamp(18px,2vw,27px)}.overlay-team{padding:8px 12px;border:1px solid #b5dafa;border-radius:12px;color:#145a9a;background:#e4f5ff;font-weight:950;white-space:nowrap}.question-overlay .question-card{display:flex;flex:1;flex-direction:column;gap:8px;min-height:0;overflow:hidden;padding:clamp(12px,1.6vh,20px);border:1px solid #d7e3f4;border-radius:17px;color:#192d58;background:linear-gradient(145deg,#fff,#f4f7ff);box-shadow:0 10px 26px #516a9413}.question-overlay .cq-kicker{flex:none;color:#526dc0;font-size:clamp(11px,1vw,14px);letter-spacing:.1em}.question-overlay .cq-passage{flex:none;max-height:24dvh;overflow:auto;margin:0;padding:clamp(10px,1.3vh,16px) clamp(12px,1.5vw,20px);border-left:5px solid #28b9ee;border-radius:12px;color:#223962;background:linear-gradient(110deg,#eaf8ff,#f3f1ff);font-size:clamp(16px,1.65vw,23px);line-height:1.5}.question-overlay .cq-passage small{color:#2769b4;font-size:clamp(10px,1vw,13px)}.question-overlay .cq-image{max-height:11dvh}.question-overlay .question-card h2{flex:none;max-height:19dvh;overflow:auto;margin:3px 0;color:#142958;font-size:clamp(22px,3vw,40px);line-height:1.34}.question-overlay .cq-answer{flex:1;min-height:0;overflow:auto;margin:0;padding:clamp(10px,1.3vh,17px) clamp(12px,1.5vw,20px);border-radius:13px;font-size:clamp(14px,1.4vw,18px);line-height:1.5}.question-overlay .cq-answer p{font-size:clamp(17px,1.9vw,26px);line-height:1.5}.question-overlay .cq-answer.correct{color:#075f47;border-color:#7be0bd;background:linear-gradient(120deg,#e3fff3,#f0fffa)}.question-overlay .cq-answer.wrong{color:#a32a45;border-color:#ffb2c2;background:linear-gradient(120deg,#fff0f3,#fff8fa)}.question-overlay .awaiting-mark{flex:none;margin:0;color:#66799c;font-size:clamp(12px,1.15vw,15px)}.overlay-note{flex:none;margin:0;color:#7583a0;text-align:center;font-size:clamp(9px,.85vw,11px);font-weight:700}
@media(max-width:1050px){.projector-layout{grid-template-columns:minmax(145px,.65fr) minmax(0,2fr) minmax(145px,.65fr);gap:12px;padding-inline:5px}.arena-team{padding:14px 12px}.arena-team p{font-size:9px}.arena-score b{font-size:42px}}
@media(max-width:760px){body.projector-page{padding:6px}.projector-shell{gap:7px;padding:8px;border-radius:17px}.projector-header{min-height:50px;padding:6px 9px;border-radius:13px}.projector-title{gap:8px}.projector-title h1{font-size:clamp(18px,4vw,23px)}.projector-title .sp-eyebrow{font-size:7px}.puzzle-mark{width:37px;height:37px;padding:7px;border-radius:11px}.turn-banner{gap:5px;padding:6px 8px;font-size:7px}.turn-banner b{font-size:11px}.projector-layout{grid-template-columns:1fr 1fr;grid-template-areas:"blue red" "stage stage";align-content:center;gap:7px;padding:2px}.arena-team{width:100%;padding:7px 9px;border-radius:12px}.arena-team-heading{gap:5px;font-size:8px}.arena-team .team-dot{width:8px;height:8px}.arena-active-label{margin:5px 0 2px;padding:3px 6px;font-size:6px}.arena-score b{font-size:clamp(22px,6vw,31px)}.arena-score span{font-size:9px}.arena-progress{gap:4px;margin-top:6px}.arena-progress>div{font-size:8px}.progress-track{height:4px}.arena-team p{display:none}.projector-board-wrap{gap:5px}.projector-board-flip{width:min(91vw,min(58vh,calc(100dvh - 210px),560px))}.projector-board{gap:3px;padding:6px;border-radius:14px}.projector-board-back{padding:6px;border-radius:14px}.projector-board .slide-tile{border-radius:5px}.board-caption{gap:5px;font-size:7px}.projector-flip-button{min-height:25px;padding:4px 7px;font-size:8px}.projector-status{padding:4px 7px;font-size:8px}.projector-footer{font-size:6px}.question-overlay{padding:6px}.question-overlay-card{width:calc(100vw - 12px);height:calc(100vh - 12px);height:calc(100dvh - 12px);gap:6px;padding:9px;border-radius:15px}.overlay-heading{gap:8px}.overlay-icon{width:36px;height:36px;font-size:20px}.overlay-kicker{font-size:8px}.overlay-heading h2{font-size:16px}.overlay-team{padding:6px 8px;font-size:10px}.question-overlay .question-card{gap:5px;padding:9px;border-radius:12px}.question-overlay .cq-passage{max-height:23dvh;padding:8px 10px;font-size:clamp(14px,3.7vw,19px);line-height:1.4}.question-overlay .question-card h2{max-height:17dvh;font-size:clamp(20px,5.6vw,29px);line-height:1.3}.question-overlay .cq-answer{padding:8px 10px;font-size:13px}.question-overlay .cq-answer p{font-size:clamp(15px,4.2vw,22px);line-height:1.38}.question-overlay .cq-image{max-height:9dvh}.overlay-note{font-size:8px}}
@media(max-width:420px){.projector-team .team-progress{font-size:7px}.projector-board-flip{width:min(90vw,calc(100dvh - 205px))}.board-caption{letter-spacing:.04em}.projector-status{display:none}}
@media(max-height:700px) and (min-width:761px){.projector-header{min-height:54px}.projector-board-flip{width:min(66vh,calc(100dvh - 245px),650px)}.arena-team{padding:12px}.arena-active-label{margin-top:9px}.arena-progress{margin-top:12px}.arena-team p{margin-top:10px}}

.sp-team-photo{width:48px;height:48px;flex:none;object-fit:cover;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 2px #38a9ec,0 4px 12px #168acb55;animation:sp-team-pop .45s cubic-bezier(.2,.9,.2,1.2)}
.red-team .sp-team-photo{box-shadow:0 0 0 2px #ef5989,0 4px 12px #d72e6d55}
.sp-arena-photo{width:clamp(90px,9vw,124px);height:clamp(90px,9vw,124px);margin:0 auto 12px;object-fit:cover;border:5px solid #fff;border-radius:50%;box-shadow:0 0 0 3px #38a9ec,0 8px 22px #168acb45;animation:sp-team-pop .55s cubic-bezier(.2,.9,.2,1.2),sp-team-glow 2s ease-in-out infinite alternate}
.red-team .sp-arena-photo{box-shadow:0 0 0 3px #ef5989,0 8px 22px #d72e6d45}
.sp-arena-photo[hidden],.sp-team-photo[hidden]{display:none}
.arena-team-heading{flex-wrap:nowrap;align-self:center;justify-content:center;gap:8px;margin:2px 0 0}
.arena-team-heading .team-dot{width:10px;height:10px;animation:sp-live-pulse 1.5s ease-in-out infinite}
@keyframes sp-live-pulse{50%{transform:scale(1.35);filter:brightness(1.3)}}
@keyframes sp-team-pop{from{opacity:0;transform:scale(.5) rotate(-10deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes sp-team-glow{to{filter:saturate(1.3) brightness(1.08)}}
@media(max-width:760px){.sp-team-photo{width:34px;height:34px;border-width:2px}.sp-arena-photo{width:clamp(58px,12vw,82px);height:clamp(58px,12vw,82px);margin:0 auto 5px;border-width:3px}}
.sp-photo-section{display:grid;gap:8px;margin:17px 0;padding:13px;border:1px solid #ffffff1c;border-radius:14px;background:#ffffff08}.sp-photo-section> b{color:#e8efff;font-size:13px}.sp-photo-section> b span{margin-left:6px;padding:3px 6px;border-radius:99px;color:#b7c5e1;background:#ffffff12;font-size:9px;text-transform:uppercase;letter-spacing:.08em}.sp-photo-section>small{color:#aab8d2;font-size:11px;line-height:1.5}.portrait-zone{min-height:150px}.portrait-zone img{width:76px;height:76px;object-fit:cover;border-radius:50%}
.question-type{display:block;margin-bottom:3px;color:#7255d7;font-size:9px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}

/* Projector question view: show only the prompt and answer at classroom scale. */
.question-overlay .cq-passage{display:none}
.question-overlay .question-card{gap:clamp(14px,2.4vh,28px);padding:clamp(20px,3vh,40px)}
.question-overlay .cq-kicker{font-size:clamp(15px,1.5vw,21px)}
.question-overlay .question-card h2{max-height:30dvh;margin:0;font-size:clamp(38px,5vw,68px);line-height:1.22}
.question-overlay .cq-answer{padding:clamp(20px,3vh,38px) clamp(22px,3vw,42px);font-size:clamp(22px,2.5vw,36px);line-height:1.45}
.question-overlay .cq-answer b{font-size:clamp(19px,2vw,28px)}
.question-overlay .cq-answer p{font-size:clamp(24px,3vw,42px);line-height:1.45}
.question-overlay .awaiting-mark{font-size:clamp(16px,1.6vw,22px)}
@media(max-width:760px){.question-overlay .question-card{gap:12px;padding:14px}.question-overlay .question-card h2{max-height:28dvh;font-size:clamp(29px,7.5vw,46px)}.question-overlay .cq-answer{padding:16px;font-size:clamp(18px,4.8vw,27px)}.question-overlay .cq-answer b{font-size:clamp(16px,4.2vw,23px)}.question-overlay .cq-answer p{font-size:clamp(20px,5.5vw,32px)}.question-overlay .awaiting-mark{font-size:14px}}

/* Futuristic classroom presentation palette and clearer question/answer panels. */
.question-overlay{background:radial-gradient(ellipse at 12% 8%,#126c8870,transparent 38%),radial-gradient(ellipse at 88% 90%,#6d42aa70,transparent 42%),#071426eF}
.question-overlay-card{position:relative;border:1px solid #8deaff88;border-radius:28px;background:linear-gradient(145deg,#f8fcff 0%,#eef7ff 55%,#f4f0ff 100%);box-shadow:0 30px 100px #020817b8,0 0 0 1px #a9efff30,0 0 55px #28c5ec28,inset 0 1px #fff}
.question-overlay-card::before{position:absolute;top:0;left:clamp(20px,3vw,42px);right:clamp(20px,3vw,42px);height:4px;border-radius:0 0 8px 8px;background:linear-gradient(90deg,#19c7d9,#397bff 52%,#9465f5);content:""}
.overlay-icon{border:1px solid #ffffffbb;background:linear-gradient(145deg,#08bbce,#347bf4 58%,#8255e8);box-shadow:0 8px 24px #367fea55,0 0 18px #24c9dc45}
.overlay-kicker{color:#3865ad;letter-spacing:.17em}
.overlay-heading h2{color:#13294f;letter-spacing:-.025em}
.overlay-team{border-color:#62cce5;color:#075d78;background:linear-gradient(120deg,#ddfbff,#e8f0ff);box-shadow:0 4px 14px #277ea01a}
.question-overlay .question-card{position:relative;gap:clamp(14px,2.4vh,28px);padding:clamp(20px,3vh,40px);border:1px solid #c4d9f4;border-radius:22px;background:radial-gradient(ellipse at 95% 0,#d8eaff66,transparent 36%),linear-gradient(145deg,#fff,#f6f9ff 62%,#f8f5ff);box-shadow:0 16px 42px #2c47751a,inset 0 1px #fff}
.question-overlay .cq-kicker{display:flex;align-items:center;gap:10px;color:#4163a8;font-weight:950;letter-spacing:.13em}
.question-overlay .cq-kicker::before{width:10px;height:10px;flex:none;border-radius:3px;background:linear-gradient(135deg,#0bc5d4,#5975f5);box-shadow:0 0 0 4px #38bad51c;content:""}
.question-overlay .question-card h2{flex:none;max-height:30dvh;overflow:auto;margin:0;padding:clamp(14px,2vh,24px) clamp(18px,2.3vw,32px);border:1px solid #d5e2f7;border-left:5px solid #367af3;border-radius:16px;color:#112b59;background:linear-gradient(110deg,#eaf5ff,#f1f3ff 70%,#f8f2ff);box-shadow:0 8px 24px #456ba612;font-size:clamp(38px,5vw,68px);line-height:1.22;letter-spacing:-.035em}
.question-overlay .cq-answer{border:1px solid #69d9c4;border-radius:18px;color:#064b49;background:radial-gradient(ellipse at 100% 0,#72ead325,transparent 42%),linear-gradient(125deg,#e2fff4,#ecfffc 58%,#e8fbff);box-shadow:0 12px 30px #0a9b8217,inset 0 1px #fff}
.question-overlay .cq-answer b{display:inline-flex;align-items:center;gap:9px;margin-bottom:8px;color:#087d70;font-size:clamp(19px,2vw,28px);letter-spacing:.01em}
.question-overlay .cq-answer p{margin:.3em 0 0;color:#064b49;font-size:clamp(24px,3vw,42px);line-height:1.45}
.question-overlay .cq-answer.wrong{border-color:#ff9bb2;color:#6f2344;background:linear-gradient(125deg,#fff0f5,#fff7fc 58%,#f7f1ff);box-shadow:0 12px 30px #bd376117,inset 0 1px #fff}
.question-overlay .cq-answer.wrong b,.question-overlay .cq-answer.wrong p{color:#84294f}
.overlay-note{color:#526b94}
@media(max-width:760px){.question-overlay-card{border-radius:19px}.question-overlay .question-card{gap:12px;padding:14px;border-radius:16px}.question-overlay .question-card h2{max-height:28dvh;padding:12px 14px;font-size:clamp(29px,7.5vw,46px)}.question-overlay .cq-answer{border-radius:14px}.question-overlay .cq-answer p{font-size:clamp(20px,5.5vw,32px)}}

.team-upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.team-upload-grid .upload-zone{min-width:0;min-height:170px;padding:12px}.team-upload-grid .upload-zone img{width:88px;height:88px}.blue-upload{border-color:#32b9ff88}.red-upload{border-color:#ff5a8888}.winner-overlay{position:fixed;z-index:30;inset:0;display:grid;place-items:center;padding:20px;background:#101936c9;backdrop-filter:blur(12px);animation:overlay-in .3s}.winner-overlay[hidden]{display:none!important}.winner-card{display:flex;align-items:center;flex-direction:column;gap:12px;width:min(620px,94vw);max-height:94dvh;overflow:auto;padding:clamp(20px,4vw,42px);border:1px solid #ffffffb8;border-radius:28px;text-align:center;color:#203564;background:linear-gradient(145deg,#fff,#f0f7ff);box-shadow:0 28px 90px #050d2a88}.winner-confetti{font-size:clamp(50px,10vw,90px);animation:pop-in .6s}.winner-card h2{margin:0;color:#5c4de0;font-size:clamp(28px,6vw,52px)}.winner-card p{margin:0;color:#4e628c;font-size:clamp(15px,2.2vw,21px)}.winner-card img{width:min(52vh, min(65vw,380px));aspect-ratio:1;object-fit:cover;border:7px solid white;border-radius:20px;box-shadow:0 14px 40px #526a943d}.winner-card button{padding:12px 20px;border:0;border-radius:12px;color:white;background:linear-gradient(110deg,#735dff,#22b7e9);font-weight:850}@media(max-width:600px){.team-upload-grid{grid-template-columns:1fr}.team-upload-grid .upload-zone{min-height:135px}.winner-card img{width:min(42vh,72vw)}}
