:root{--pink:#ec4899;--deep:#db2777;--fuchsia:#c026d3;--rose:#f472b6;--ink:#421332;--muted:#84526f;--light:#fff1f7;--white:#fffbfd;--glass:rgba(255,255,255,.76);--line:rgba(178,50,116,.13);--shadow:0 24px 60px rgba(137,22,92,.13);--radius:22px;--ease:cubic-bezier(.2,.75,.3,1);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(ellipse 55% 40% at 7% 3%,rgba(244,114,182,.44),transparent 72%),radial-gradient(ellipse 45% 47% at 91% 11%,rgba(192,38,211,.18),transparent 75%),radial-gradient(ellipse 65% 65% at 50% 90%,rgba(251,207,232,.72),transparent 90%),linear-gradient(130deg,#fff1f7 0%,#fff7fb 36%,#f9d8f0 100%);background-attachment:fixed;overflow-x:hidden}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}a:hover{text-decoration:none}svg.icon{width:1.15em;height:1.15em;display:inline-block;fill:currentColor;vertical-align:-.18em;flex:none}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2rem,4vw,3.6rem);line-height:1.08;letter-spacing:-.05em}h2{font-size:clamp(1.45rem,2.3vw,2rem);letter-spacing:-.035em}h3{font-size:1.16rem;letter-spacing:-.02em}p{line-height:1.65}.muted{color:var(--muted)}.subtle{font-size:.88rem;color:var(--muted)}.small{font-size:.82rem}.center{text-align:center}.strong{font-weight:800}.gradient-text{background:linear-gradient(120deg,#db2777,#b117c7);-webkit-background-clip:text;background-clip:text;color:transparent}.container{max-width:1330px;margin:auto;padding:0 28px}.topbar{height:84px;position:sticky;top:0;z-index:30;background:rgba(255,242,249,.66);border-bottom:1px solid rgba(255,255,255,.65);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.topbar .container{height:100%;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:12px;font-size:1.28rem;letter-spacing:-.045em;white-space:nowrap}.mark,.boot-logo{width:44px;height:44px;display:inline-grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,var(--pink),var(--fuchsia));color:#fff;font-weight:900;box-shadow:0 9px 20px #db277745;transform:rotate(-8deg)}.nav-links{display:flex;align-items:center;gap:8px}.nav-link{padding:12px 17px;font-weight:650;font-size:.93rem;border-radius:14px;transition:background .2s,transform .2s}.nav-link:hover,.nav-link.active{background:#fff8fc;color:#c02670}.nav-link .icon{margin-right:5px}.btn{border:1px solid transparent;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px;min-height:45px;font-weight:750;font-size:.94rem;transition:transform .22s var(--ease),box-shadow .22s,background .22s;white-space:normal;text-align:center;line-height:1.25}.btn:hover{transform:translateY(-2px)}.btn:active{transform:scale(.975)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn.primary{color:white;background:linear-gradient(125deg,var(--pink),var(--fuchsia));box-shadow:0 10px 26px rgba(219,39,119,.24)}.btn.primary:hover{box-shadow:0 14px 32px rgba(219,39,119,.32)}.btn.light{color:#b92273;background:rgba(255,255,255,.84);border:1px solid #efc6dc}.btn.outline{border-color:#eab1d1;background:#fff6fb;color:#a72c6b}.btn.danger{background:linear-gradient(120deg,#be185d,#e11d48);color:white}.btn.success{background:linear-gradient(110deg,#0f986b,#33bc8b);color:white}.btn.ghost{background:transparent;color:#9e3772}.btn.sm{padding:8px 11px;min-height:36px;font-size:.84rem;border-radius:11px}.btn.icon-btn{min-width:37px;padding:8px 9px}.btn.block{display:flex;width:100%}.public-main{padding:52px 0 100px}.hero{position:relative;overflow:hidden;min-height:315px;border-radius:34px;padding:48px clamp(26px,6vw,85px);background:radial-gradient(circle at 95% -10%,#f9a8d4 0,transparent 45%),linear-gradient(116deg,#fcdaec,#f6b9dc 43%,#ead0fa);box-shadow:0 27px 75px #b23a8922;border:1px solid #ffffffa3;display:flex;align-items:center;justify-content:space-between;gap:25px}.hero:before{content:"";position:absolute;right:-55px;bottom:-175px;width:470px;height:470px;border:1px solid #fff8;border-radius:50%;box-shadow:0 0 0 30px #ffffff14,0 0 0 75px #ffffff10}.hero .hero-copy{position:relative;max-width:710px;z-index:1}.hero h1{margin:16px 0}.hero p{font-size:1.07rem;max-width:610px}.hero-art{width:230px;height:230px;flex:none;display:grid;place-items:center;position:relative}.hero-art:before,.hero-art:after{content:"";position:absolute;width:140px;height:192px;border-radius:26px;background:linear-gradient(145deg,#ec4899,#ab27d9);box-shadow:0 22px 45px #a72b783f;transform:rotate(18deg) translate(30px,8px)}.hero-art:after{transform:rotate(-18deg) translate(-30px,-12px);background:linear-gradient(135deg,#fff,#fad0e6);border:2px solid #ffffffaf}.hero-art .icon{position:relative;z-index:2;font-size:4.5rem;color:#db2777;animation:bob 4.2s ease-in-out infinite}.eyebrow{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.68);padding:8px 13px;border-radius:99px;color:#a62672;font-size:.83rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase}.section{margin-top:38px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:20px}.section-head h2{margin:0}.panel,.card,.auth-card{background:var(--glass);border:1px solid rgba(255,255,255,.85);backdrop-filter:blur(12px);border-radius:var(--radius);box-shadow:var(--shadow)}.panel{padding:24px}.card{padding:23px}.card:hover{border-color:#f9c6df}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.stat-card{position:relative;overflow:hidden;min-height:152px;border-radius:22px;padding:22px;background:linear-gradient(140deg,#fff,#fff0f8);box-shadow:0 12px 34px #c8479a13;border:1px solid #fff;transition:transform .25s}.stat-card:hover{transform:translateY(-5px)}.stat-card .stat-icon{width:43px;height:43px;border-radius:15px;background:#f9d4e9;display:grid;place-items:center;color:#cb2b82;font-size:1.22rem;margin-bottom:13px}.stat-card strong{font-size:1.85rem;letter-spacing:-.045em;display:block}.stat-card span{font-size:.86rem;color:var(--muted)}.table-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:17px;flex-wrap:wrap}.searchbox{display:flex;align-items:center;gap:10px;background:white;border:1px solid #f0c5dc;border-radius:13px;padding:0 13px;min-height:45px;max-width:400px;flex:1 1 240px;color:#ad477d}.searchbox input{background:transparent;border:0;outline:0;width:100%;min-width:0}.table-scroller{overflow-x:auto;max-width:100%;border-radius:15px}.data-table{border-collapse:separate;border-spacing:0;width:100%;text-align:left;min-width:640px}.data-table th{font-size:.79rem;letter-spacing:.035em;color:#985976;text-transform:uppercase;font-weight:800;padding:16px 14px;background:#fce8f3;white-space:nowrap}.data-table td{padding:17px 14px;border-bottom:1px solid #efdde8;font-size:.92rem;vertical-align:middle}.data-table tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:#fff6fb}.table-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:20px}.pagination{display:flex;gap:7px;align-items:center}.pill{display:inline-flex;align-items:center;gap:6px;border-radius:100px;padding:6px 11px;font-weight:700;font-size:.78rem;white-space:nowrap}.pill.pink{background:#fbe3f1;color:#b72f73}.pill.green{background:#ddfaee;color:#09774d}.pill.gray{background:#f0eaf0;color:#7c6176}.pill.gold{background:#fff1c9;color:#9c6d0a}.link{color:#c0267d;font-weight:750;cursor:pointer}.link:hover{text-decoration:underline}.rank-list{display:flex;flex-direction:column;gap:7px;min-width:175px}.rank-line{display:flex;gap:7px;align-items:center;font-size:.88rem}.rank-num{color:#c64a94;font-weight:900}.rank-line strong{margin-left:auto;white-space:nowrap}.empty{display:grid;place-items:center;text-align:center;padding:47px 20px;color:#986280}.empty .icon{font-size:2.3rem;color:#e69ec7;margin-bottom:13px}.empty strong{display:block;margin-bottom:5px;color:#6a3256}.game-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.game-tile{overflow:hidden;border-radius:25px;background:#fffafde0;box-shadow:0 15px 37px #a6397b1f;border:1px solid #fff;transition:transform .27s var(--ease),box-shadow .27s}.game-tile:hover{transform:translateY(-7px);box-shadow:0 24px 48px #a6397b38}.cover{width:100%;aspect-ratio:16/9;object-fit:cover;background:linear-gradient(135deg,#f59ac9,#c051d2);display:grid;place-items:center;color:white;font-size:3rem}.game-tile .tile-body{padding:20px}.game-tile h3{margin:12px 0 10px}.tile-meta{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:.83rem;color:#855a73}.tile-meta .icon{color:#da4492}.chip-row{display:flex;gap:8px;flex-wrap:wrap}.auth-page,.installer{min-height:calc(100vh - 60px);display:grid;place-items:center;padding:30px 18px}.auth-card{padding:34px;width:100%;max-width:440px}.auth-card h1{font-size:1.9rem;margin-top:28px}.auth-card .brand{justify-content:center}label{font-size:.87rem;color:#743b5d;font-weight:750;display:block;margin-bottom:14px}input:not([type=checkbox]):not([type=radio]):not([type=file]),textarea,select{width:100%;border:1px solid #ecc7dd;background:#fffcfe;border-radius:13px;padding:12px 14px;min-height:44px;color:#542242;outline:none;margin-top:7px;transition:border-color .2s,box-shadow .2s}input:focus,textarea:focus,select:focus{border-color:#e059a6!important;box-shadow:0 0 0 3px #ec48991c}input[type=file]{max-width:100%;padding:10px;border:1px dashed #ec9bc6;border-radius:12px;background:#fff7fc}textarea{min-height:100px;resize:vertical}select{appearance:auto}.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.field-row>*{min-width:0}.pass-wrap{position:relative}.pass-wrap input{padding-right:46px!important}.pass-wrap button{position:absolute;right:7px;bottom:5px;padding:8px;border:none;background:transparent;color:#ab4a80}.notice{border-radius:14px;padding:13px 15px;margin:15px 0;background:#fbe3f1;color:#ad3275}.notice.error{background:#fff0f1;color:#b91c4d}.notice.good{background:#def8ec;color:#116e52}.admin-layout{display:grid;grid-template-columns:264px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,rgba(255,244,250,.96),rgba(251,218,237,.94));border-right:1px solid #f2c3dd;padding:27px 15px;overflow-y:auto;transition:width .2s;z-index:40}.sidebar .brand{margin:0 12px 33px}.sidebar-heading{text-transform:uppercase;color:#ba78a0;letter-spacing:.1em;font-size:.68rem;font-weight:850;padding:15px 16px 9px}.side-link{width:100%;display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:14px;color:#89536f;margin-bottom:5px;font-size:.91rem;font-weight:700;transition:background .2s,transform .2s}.side-link:hover{background:#fff9fd;transform:translateX(3px)}.side-link.active{background:linear-gradient(120deg,#ec4899,#c026d3);color:white;box-shadow:0 9px 23px #d7359750}.side-link .icon{font-size:1.2rem}.admin-body{min-width:0}.admin-top{height:83px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,248,253,.53);border-bottom:1px solid #ffffffb3;backdrop-filter:blur(18px)}.admin-top strong{font-size:1.05rem}.avatar{width:41px;height:41px;display:grid;place-items:center;background:linear-gradient(140deg,#ec4899,#c026d3);border-radius:14px;color:#fff;font-weight:850}.profile-mini{display:flex;gap:12px;align-items:center;line-height:1.3}.admin-content{padding:30px;max-width:1580px;margin:auto}.admin-heading{margin-bottom:28px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.admin-heading h1{font-size:clamp(1.7rem,3vw,2.3rem);margin:0 0 8px}.admin-heading p{margin:0}.row-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.stack{display:flex;flex-direction:column;gap:18px}.grid-two{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);gap:22px}.menu-toggle{display:none}.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(57,12,45,.5);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:18px;animation:fade .18s ease}.modal{background:linear-gradient(145deg,#fffafd,#ffeaf5);border:1px solid #fff;box-shadow:0 30px 90px #3c16385e;border-radius:26px;width:min(700px,100%);max-height:min(90dvh,1000px);overflow-y:auto;animation:pop .27s var(--ease)}.modal.wide{width:min(950px,100%)}.modal-header{padding:23px 27px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #f2d5e5}.modal-header h2{font-size:1.33rem;margin:0}.modal-content{padding:25px 27px}.modal-footer{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:20px}.close{background:#fae3ef;color:#a83373;border:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center}.toast-area{position:fixed;right:22px;bottom:24px;z-index:150;display:grid;gap:10px;max-width:min(400px,calc(100vw - 36px))}.toast{display:flex;align-items:center;gap:11px;padding:14px 18px;border-radius:16px;box-shadow:0 17px 40px #50183840;background:#fff;border:1px solid #f1bfd9;color:#682f50;animation:slideIn .26s var(--ease);font-weight:700}.toast.error{border-color:#f5b0bb;color:#ac2549}.toast .icon{color:#c82a83}.editor-tools{display:flex;flex-wrap:wrap;gap:6px;background:#ffeff7;padding:8px;border-radius:13px;margin-top:9px;border:1px solid #f4cadd}.editor-tools button{border:none;background:#fff8fc;color:#9c4b77;border-radius:8px;width:35px;height:35px;display:grid;place-items:center}.editor-tools button:hover{background:#f6c9e3}.editor{background:#fff;border:1px solid #ecc7dd;min-height:210px;border-radius:13px;padding:15px;margin:10px 0;outline:0;line-height:1.65;overflow-wrap:anywhere}.editor:focus{box-shadow:0 0 0 3px #ec48991c;border-color:var(--pink)}.editor img,.rich img{max-width:100%;height:auto;border-radius:13px}.editor video,.rich video{max-width:100%}.editor table,.rich table{border-collapse:collapse;width:100%}.editor td,.editor th,.rich td,.rich th{border:1px solid #e3bfd4;padding:7px}.rich{overflow-wrap:anywhere;line-height:1.7}.rich p{margin:8px 0}.rich iframe{max-width:100%;aspect-ratio:16/9}.option-fields{display:grid;gap:9px}.option-line{display:flex;align-items:center;gap:10px}.option-line input[type=text]{margin:0!important;flex:1}.option-line span{font-weight:800;color:#b3327c;min-width:18px}.option-line input[type=radio]{accent-color:var(--pink);height:18px;width:18px}.game-stage{border-radius:30px;background:linear-gradient(132deg,#fce5f1,#f6c6e8 60%,#e6d1f9);padding:27px;box-shadow:0 15px 50px #c13c9322;border:1px solid #fff}.stage-header{display:flex;flex-wrap:wrap;justify-content:space-between;gap:15px;margin-bottom:20px}.stage-header h2{margin:6px 0}.scoreboard{display:grid;gap:11px}.score-row{display:flex;align-items:center;gap:10px;background:#fffcfee0;border:1px solid #fff;border-radius:14px;padding:11px 14px;transition:transform .4s}.score-row:hover{transform:translateX(3px)}.score-place{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#f8d6e9;color:#b12276;font-weight:900}.score-row:first-child .score-place{background:#fde6a9;color:#956400}.score-value{margin-left:auto;color:#bf2a79;font-size:1.05rem;font-weight:900;white-space:nowrap}.phase-card{background:#fffafdcb;border:1px solid white;border-radius:23px;padding:25px;text-align:center;min-height:310px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.phase-card h2{margin:0}.phase-card p{margin:0}.action-row{display:flex;justify-content:center;gap:11px;flex-wrap:wrap;margin-top:9px}.question-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:15px;width:100%;margin:18px 0}.question-card{aspect-ratio:4/5;border:2px solid #fff;border-radius:19px;color:white;background:linear-gradient(145deg,#ed61ab,#c333b8);box-shadow:0 14px 23px #b6369135;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-weight:900;animation:deal .5s var(--ease) both;transition:transform .23s,box-shadow .23s}.question-card:hover{transform:translateY(-7px) rotate(-2deg);box-shadow:0 22px 30px #ad278b57}.question-card .icon{font-size:1.8rem}.question-card span{font-size:.81rem;letter-spacing:.07em}.timer{font-size:clamp(2.6rem,7vw,5rem);font-weight:950;letter-spacing:-.07em;line-height:1.1;font-variant-numeric:tabular-nums;background:linear-gradient(120deg,#cf207e,#9538ce);background-clip:text;color:transparent}.timer.urgent{animation:pulse .7s infinite;color:#c02648;background:none}.game-metrics{display:flex;gap:9px;justify-content:center;flex-wrap:wrap}.wheel{width:min(270px,68vw);aspect-ratio:1;border-radius:50%;background:conic-gradient(#ef65b3 0deg 60deg,#b832d3 60deg 120deg,#fa99cc 120deg 180deg,#dd4ba5 180deg 240deg,#f5b6db 240deg 300deg,#d748c2 300deg);box-shadow:0 0 0 9px #fff,0 23px 45px #af3f8d50;display:grid;place-items:center;color:white;font-size:3.7rem;border:8px solid #fff5fc}.wheel.spinning{animation:spinWheel 2.4s cubic-bezier(.1,.7,.1,1) both}.wheel-modal{text-align:center;display:grid;place-items:center;gap:22px}.feedback-good{font-size:3rem;color:#07996a;animation:pop .6s both}.feedback-bad{font-size:3rem;color:#dc478d}.player-shell{max-width:840px;margin:auto}.player-shell .game-stage{padding:24px}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%}.choice{background:#fff;border:2px solid #f0c7e2;border-radius:14px;padding:16px;text-align:left;white-space:normal}.choice:hover:not(:disabled){border-color:var(--pink);background:#fff2fa}.choice.selected{border-color:#13a17d;background:#e9fff6}.choice-letter{display:inline-grid;place-items:center;width:31px;height:31px;border-radius:10px;background:#f8d7ea;color:#b3287b;font-weight:900;margin-right:10px}.waiting-dots{display:flex;gap:8px;justify-content:center}.waiting-dots i{width:10px;height:10px;background:#db3b99;border-radius:50%;animation:pulse 1s infinite}.waiting-dots i:nth-child(2){animation-delay:.2s}.waiting-dots i:nth-child(3){animation-delay:.4s}.qr-wrap{display:grid;place-items:center;background:white;border-radius:20px;padding:18px;width:max-content;max-width:100%;margin:auto}.qr-wrap svg{display:block;max-width:100%;height:auto}.floating-link{display:inline-block;max-width:100%;overflow-wrap:anywhere;color:#b82d7f}.progress-bar{height:10px;background:#f7d6e8;border-radius:99px;overflow:hidden;width:100%}.progress-bar span{display:block;height:100%;background:linear-gradient(90deg,#ec4899,#c026d3);border-radius:99px;transition:width .6s}.mobile-overlay{display:none}.boot{min-height:100vh;display:grid;justify-items:center;align-content:center;gap:16px}.boot-logo{width:74px;height:74px;font-size:2rem}.boot strong{font-size:2rem}.loader{width:32px;height:32px;border:3px solid #f8c0df;border-top-color:#d42794;border-radius:50%;animation:spin 1s linear infinite}.list-plain{list-style:none;margin:0;padding:0;display:grid;gap:8px}.list-plain li{padding:9px 12px;background:#fff9fd;border-radius:10px}.keyline{border:1px solid #f0c6de;border-radius:13px;padding:15px;background:#fff9fd}.keyline b{color:#b32b78}.history-round{padding:16px;border:1px solid #f0d3e4;border-radius:16px;margin-top:12px;background:#fff8fc}.edit-text{color:#a52e6b}.confetti{position:fixed;inset:0;pointer-events:none;z-index:125;overflow:hidden}.confetti span{position:absolute;top:-10%;width:9px;height:18px;background:hsl(var(--h) 84% 64%);animation:confettiFall var(--d) linear forwards;left:var(--x);transform:rotate(var(--r))}.page-appear{animation:fadeUp .4s var(--ease) both}.public-foot{padding:30px;color:#a15d82;text-align:center;border-top:1px solid #f5d7e8}.network-pill{display:inline-flex;gap:7px;align-items:center;font-size:.78rem;color:#aa3479;padding:7px 11px;background:#fff8fc;border-radius:50px}.network-pill.offline{color:#ae224e;background:#ffe6ed}
@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes bob{50%{transform:translateY(-12px)}}@keyframes pulse{50%{opacity:.35;transform:scale(.8)}}@keyframes deal{from{opacity:0;transform:translateY(20px) rotate(6deg)}to{opacity:1;transform:translateY(0) rotate(0)}}@keyframes spinWheel{from{transform:rotate(0)}to{transform:rotate(2160deg)}}@keyframes confettiFall{to{transform:translateY(115vh) rotate(720deg);opacity:0}}
@media(max-width:1050px){.stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.game-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-two{grid-template-columns:1fr}.hero-art{width:160px;height:160px}.hero-art:before,.hero-art:after{width:110px;height:146px}}@media(max-width:810px){.admin-layout{display:block}.sidebar{position:fixed;top:0;bottom:0;left:0;width:270px;transform:translateX(-110%);box-shadow:20px 0 50px #64244f25;transition:transform .24s var(--ease)}.sidebar.open{transform:translateX(0)}.mobile-overlay.visible{display:block;position:fixed;inset:0;background:#49113585;z-index:35}.menu-toggle{display:inline-flex}.admin-top{height:70px;padding:0 18px}.admin-content{padding:20px}.nav-links{gap:2px}.nav-link{padding:10px}.topbar{height:72px}.hero{padding:33px;min-height:270px}.hero-art{display:none}}@media(max-width:640px){.container{padding:0 16px}.public-main{padding:23px 0 55px}.hero{padding:25px 22px;border-radius:25px;min-height:280px}.hero h1{font-size:2.23rem}.hero p{font-size:.95rem}.section{margin-top:26px}.section-head{margin-bottom:15px}.panel{padding:15px}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-card{padding:15px;min-height:129px;border-radius:17px}.stat-card strong{font-size:1.48rem}.stat-card .stat-icon{width:34px;height:34px;font-size:1rem;margin-bottom:7px}.game-cards{grid-template-columns:1fr;gap:16px}.brand{font-size:1.03rem}.mark{width:37px;height:37px;border-radius:13px}.topbar .nav-link{font-size:.77rem;padding:8px 9px}.topbar .nav-link .icon{display:none}.topbar .brand{gap:7px}.topbar .container{gap:7px}.auth-card{padding:24px 20px}.field-row{grid-template-columns:1fr;gap:0}.admin-content{padding:17px 14px}.admin-heading{margin-bottom:21px}.card{padding:17px}.modal-backdrop{padding:8px;align-items:flex-end}.modal{max-height:94dvh;border-radius:24px 24px 16px 16px}.modal-content{padding:20px 16px}.modal-header{padding:18px 16px}.modal-footer .btn{flex:1}.phase-card{min-height:260px;padding:16px}.game-stage{padding:15px;border-radius:22px}.choice-grid{grid-template-columns:1fr}.question-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.question-card{border-radius:13px}.game-metrics .pill{font-size:.74rem}.profile-mini>div:last-child{display:none}.toast-area{bottom:15px;right:12px}.sidebar-heading{font-size:.7rem}.keyline{padding:11px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Sidebar desktop dapat diciutkan */
@media(min-width:811px){.admin-layout.collapsed{grid-template-columns:86px minmax(0,1fr)}.admin-layout.collapsed .sidebar{padding-left:10px;padding-right:10px}.admin-layout.collapsed .sidebar .brand strong,.admin-layout.collapsed .sidebar-heading,.admin-layout.collapsed .side-link span{display:none}.admin-layout.collapsed .sidebar .brand{margin:0 0 30px;justify-content:center}.admin-layout.collapsed .side-link{justify-content:center;padding:14px}.admin-layout.collapsed .side-link .icon{font-size:1.35rem}.desktop-toggle{display:inline-flex}}
@media(max-width:810px){.desktop-toggle{display:none!important}}
button[data-busy="1"]:after{content:"";width:14px;height:14px;border:2px solid #fff9;border-top-color:currentColor;border-radius:50%;display:inline-block;animation:spin .8s linear infinite;margin-left:5px}

.wheel{position:relative}.wheel-label{position:absolute;left:50%;top:50%;transform-origin:0 0;width:95px;margin-left:-47px;text-align:center;color:white;font-size:.68rem;font-weight:900;text-shadow:0 1px 2px #5c174e77;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.wheel-center{position:relative;z-index:1;width:68px;height:68px;border-radius:50%;background:#fff;display:grid;place-items:center;color:#d32e8b;border:5px solid #fce9f5;box-shadow:0 3px 13px #7d2a6940}

/* Kolom pencarian memiliki satu border saja, juga pada ponsel */
.searchbox input:not([type=checkbox]):not([type=radio]):not([type=file]){background:transparent;border:0;box-shadow:none;margin:0;min-height:42px;padding:0;outline:0}.searchbox:focus-within{border-color:#e059a6;box-shadow:0 0 0 3px #ec48991c}

/* Revisi 18 Oktober 2026 — ukuran kartu tetap, permainan satu layar dan sampul responsif. */
.game-cards{grid-template-columns:repeat(auto-fill,minmax(235px,260px));justify-content:start;align-items:stretch}
.game-tile{width:100%;min-width:0;max-width:260px;display:flex;flex-direction:column}
.game-tile .tile-body{display:flex;flex-direction:column;flex:1}
.game-tile .tile-body>div:last-child{margin-top:auto!important;padding-top:14px}
.question-grid{grid-template-columns:repeat(auto-fill,110px);justify-content:center;align-content:start;gap:13px}
.question-card{width:110px;height:138px;min-height:138px;aspect-ratio:4/5;flex-shrink:0}
.cover-file-field{display:flex;align-items:center;gap:13px;padding:13px 14px;background:linear-gradient(120deg,#fff8fc,#ffe9f4);border:1px dashed #e6a2ca;border-radius:15px;flex-wrap:wrap;margin-top:9px}
.cover-file-field>.icon{font-size:1.6rem;color:#cb358c}
.cover-file-field>div{display:grid;gap:4px;flex:1;min-width:160px}
.cover-file-field input[type=file]{width:min(100%,250px);padding:8px;font-size:.82rem;border-color:#f2bbd8;margin:0;background:white}
.cover-preview:not(:empty){margin:10px 0 20px}
.cover-preview-inner{width:min(100%,320px);display:grid;gap:10px}
.cover-preview-inner img,.cover-preview img{width:100%;height:170px;object-fit:cover;border:1px solid #efbed8;border-radius:16px;box-shadow:0 12px 24px #b82c8620}
.prep-lock{padding:22px 18px;border:1px dashed #eeb5d5;border-radius:17px;background:linear-gradient(135deg,#ffecf6,#f6e9ff);width:100%;color:#82395f;line-height:1.6}
.prep-lock>.icon{font-size:1.65rem;vertical-align:middle;margin-right:8px;color:#bb2486}
.suspense-spinner{width:78px;height:78px;margin:12px auto;border-radius:50%;border:7px solid #f7c4df;border-top-color:#c026d3;border-right-color:#db2777;animation:spin 1.08s linear infinite;box-shadow:0 0 35px #ec489930}
.readonly-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:9px;width:100%;text-align:left}
.readonly-choice{display:flex;align-items:center;gap:10px;background:#fffbfd;border:1px solid #f0c5de;border-radius:13px;padding:11px 13px;min-width:0;overflow-wrap:anywhere}
.player-live{display:grid;gap:17px}
.live-score-panel{display:grid;gap:12px}
.live-score-panel p{margin:0}
.live-score-panel .scoreboard-scroll{max-height:34dvh;overflow:auto;overscroll-behavior:contain}
/* Ruang guru: area tidak bergeser; hanya panel daftar nilai dan kartu yang dapat menggulir. */
.admin-body:has(.game-room){height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.admin-body:has(.game-room)>.admin-top{flex:0 0 auto}
.admin-content:has(.game-room){height:0;min-height:0;flex:1;display:flex;flex-direction:column;padding:14px 22px 16px;max-width:none;overflow:hidden}
.game-room{height:100%;min-height:0;min-width:0;display:flex;flex-direction:column;gap:12px}
.game-room>.admin-heading{flex:0 0 auto;margin:0;gap:10px}
.game-room .admin-heading h1{font-size:clamp(1.18rem,2.2vw,1.8rem)}
.game-room .admin-heading p{font-size:.85rem}
.game-room>.game-stage{display:flex;flex:1;min-height:0;flex-direction:column;padding:15px 17px;overflow:hidden}
.game-room .stage-header{flex:0 0 auto;margin-bottom:10px;align-items:center}
.game-room .stage-header h2{font-size:1.14rem;margin:2px 0}
.room-columns,.assessment-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(235px,.86fr);gap:14px;flex:1;min-height:0}
.room-play-area{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;border-radius:22px}
.room-play-area>.phase-card{height:100%;min-height:0;justify-content:flex-start;padding:16px 18px;overflow:auto}
.room-play-area>.phase-card>.question-grid{overflow-y:auto;min-height:0;flex:1;margin:6px 0;padding:12px 8px 16px}
.room-score-panel{height:100%;min-height:0;min-width:0;display:flex;flex-direction:column;padding:16px;overflow:hidden}
.room-score-panel>h3{flex:0 0 auto;margin:0 0 12px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:7px;font-size:1rem}
.scoreboard-scroll{overflow-y:auto;overflow-x:hidden;min-height:0;flex:1;overscroll-behavior:contain;padding-right:4px;scrollbar-width:thin;scrollbar-color:#d57aad #fff1f7}
.room-progress{flex:0 0 auto;padding-top:14px;margin-top:auto;border-top:1px solid #f0d1e3}
.room-progress>.progress-bar{margin-top:8px}
.assessment-main{min-height:0;height:100%;padding:14px;overflow-y:auto;justify-content:center}
.assessment-main>.assessment-question{max-height:38dvh;overflow:auto;width:100%;text-align:left}
.assessment-key{width:100%;text-align:left}
/* Browser fullscreen menampilkan hanya ruang permainan, bukan menu administrasi. */
html.game-fullscreen .sidebar,html.game-fullscreen .admin-top,html.game-fullscreen .mobile-overlay{display:none!important}
html.game-fullscreen .admin-layout{display:block;min-height:100dvh}
html.game-fullscreen .admin-body{width:100%;height:100dvh}
html.game-fullscreen .admin-content{height:100dvh;padding:10px 15px}
@media(max-width:1050px){.game-cards{grid-template-columns:repeat(auto-fill,minmax(230px,260px))}}
@media(max-width:800px){
 .room-columns,.assessment-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(105px,24%);gap:9px}
 .room-score-panel{padding:10px 12px}
 .room-score-panel h3{margin-bottom:8px}
 .admin-content:has(.game-room){padding:10px 12px}
 .game-room>.game-stage{padding:11px}
 .game-room .stage-header{gap:7px}
 .game-room .stage-header .action-row{margin-top:0;gap:5px}
 .game-room .stage-header .btn{padding:8px 10px;font-size:.76rem}
 .game-room>.admin-heading .btn{padding:9px}
 .game-room .admin-heading p{display:none}
 .room-play-area>.phase-card{padding:12px}
 .game-room .phase-card h2{font-size:clamp(1.1rem,3vw,1.6rem)}
 .scoreboard-scroll .scoreboard{gap:6px}
 .scoreboard-scroll .score-row{padding:6px 9px}
}
@media(max-width:640px){
 .game-cards{grid-template-columns:repeat(auto-fill,minmax(215px,260px));justify-content:center}
 .question-grid{grid-template-columns:repeat(auto-fill,90px);gap:8px}
 .question-card{width:90px;height:112px;min-height:112px}
 .cover-file-field{display:grid;grid-template-columns:auto 1fr}
 .cover-file-field input[type=file]{grid-column:1/-1;width:100%}
 .game-room .stage-header .eyebrow{font-size:.7rem}
 .game-room .admin-heading .btn{font-size:.75rem}
 .admin-body:has(.game-room) .admin-top{height:52px;padding:0 12px}
 .game-room .game-stage>.stage-header h2{font-size:1rem}
 .room-columns,.assessment-grid{grid-template-rows:minmax(0,1fr) minmax(104px,24%)}
 .suspense-spinner{width:56px;height:56px;border-width:5px}
}
@media(prefers-reduced-motion:reduce){.suspense-spinner{animation-duration:3s}}

/* REVISI 02 — jarak nyaman, simetri, animasi tidak berkedip */
@media(max-width:640px){
 .topbar .container{padding-inline:max(18px,env(safe-area-inset-left)) max(18px,env(safe-area-inset-right));gap:9px}
 .public-main.container{padding:24px max(22px,env(safe-area-inset-right)) 55px max(22px,env(safe-area-inset-left))!important;width:100%}
 .hero{padding:28px 23px;min-height:0;border-radius:22px}
 .hero h1{font-size:clamp(1.85rem,8vw,2.3rem);line-height:1.17;letter-spacing:-.045em}
 .hero p{line-height:1.62}
 .section{margin-top:31px}
 .section-head h2{font-size:1.19rem}
 .admin-content{padding-inline:20px}
 .game-room .stage-header .action-row{justify-content:flex-start}
 .modal-backdrop{padding:12px 15px;align-items:center}
 .modal{max-height:calc(100dvh - 30px);border-radius:22px;width:100%}
 .modal-content{padding:20px}
 .modal-header{padding:18px 20px}
 .game-cards{grid-template-columns:minmax(0,1fr);justify-content:stretch}
 .game-tile{max-width:none}
 .question-grid{grid-template-columns:repeat(auto-fill,90px);justify-content:center}
}
@media(max-width:380px){.public-main.container{padding-inline:18px!important}.topbar .nav-link{font-size:.72rem;padding:8px 6px}}
.hero-copy{max-width:660px}
.hero h1{font-weight:850;letter-spacing:-.055em;line-height:1.12}
.hero-art{opacity:.7}
.admin-heading h1,.section-head h1{letter-spacing:-.045em}
.wheel.wheel-stationary{animation:none;isolation:isolate;position:relative}
.wheel-stationary .wheel-label{z-index:2;pointer-events:none}
.wheel-pointer{position:absolute;inset:0;z-index:4;pointer-events:none;transform-origin:center;display:block}
.wheel-pointer .pointer-shaft{position:absolute;left:calc(50% - 5px);top:calc(50% - 79px);height:78px;width:10px;border-radius:12px;background:linear-gradient(#fff,#f3b0d5);box-shadow:0 2px 13px #8e215c88}
.wheel-pointer .pointer-tip{position:absolute;left:calc(50% - 17px);top:calc(50% - 100px);width:34px;height:34px;background:white;clip-path:polygon(50% 0%,100% 100%,0% 100%);filter:drop-shadow(0 3px 7px #7b1e4e)}
.wheel-pointer.spinning-pointer{animation:spinWheel 2.5s cubic-bezier(.09,.74,.17,1) both}
.wheel-center.wheel-center-dot{position:relative;z-index:5;width:31px;height:31px;border:5px solid #fee5f4;box-shadow:0 3px 12px #7a1c5748;background:#fff;border-radius:50%}
@media(prefers-reduced-motion:reduce){.wheel-pointer.spinning-pointer{animation:none}}
.btn.icon-btn{padding:10px;width:42px;min-width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center}
.return-page{min-height:60vh}
.saved-session{display:flex;flex-direction:column;gap:12px}
.saved-session .btn{margin-top:auto}
.saved-session h3{font-size:1.2rem;margin:8px 0 2px}
.network-pill{white-space:nowrap}

@media(max-width:640px){
 .topbar{height:auto;min-height:77px}
 .topbar .container{height:auto;min-height:77px;flex-wrap:wrap;padding-block:13px}
 .topbar .brand{margin-inline:auto;font-size:1.12rem}
 .topbar .nav-links{order:2;width:100%;flex:1 0 100%;gap:2px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
 .topbar .nav-link{font-size:.71rem;text-align:center;min-width:0;padding:10px 3px;border-radius:11px;white-space:normal;line-height:1.3}
 .topbar .nav-link .icon{display:none}
}

/* Revisi 03: semua sampul persegi 1:1 tanpa distorsi. */
.cover, img.cover,.game-tile .cover,.grid-two .cover{aspect-ratio:1/1!important;height:auto!important;object-fit:cover!important;width:100%}
.cover-preview-inner{width:min(100%,320px);max-width:320px}
.cover-square,.cover-preview-inner img,.cover-preview>img{aspect-ratio:1/1!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:cover!important;border-radius:18px;display:block;overflow:hidden}
.cover-square{display:grid;place-items:center;border:1px solid #edbad6;background:linear-gradient(135deg,#fff5fa,#f6def2)}
.cover-square>img{height:100%!important;display:block}
.cover-square .subtle{padding:40px 20px;text-align:center}
.game-tile{align-self:start}
@media(max-width:600px){.cover-preview-inner{max-width:min(100%,320px)}.game-tile .cover{aspect-ratio:1/1!important}}


/* Revisi 05: navigasi ringkas, detail premium, papan nilai tanpa urutan, ruang terpisah */
.topbar .nav-links{gap:8px}
.detail-page{display:grid;gap:22px}
.detail-navigation{display:flex;align-items:center;justify-content:space-between;gap:16px}
.detail-hero{display:grid;grid-template-columns:minmax(230px,390px) minmax(0,1fr);align-items:center;gap:clamp(22px,5vw,66px);padding:clamp(20px,4vw,42px);border-radius:32px;background:radial-gradient(ellipse at 80% 0%,#f4b6ee7c,transparent 45%),linear-gradient(135deg,#fff9fd,#ffe6f3 52%,#f9e6fb);border:1px solid #fff9;box-shadow:0 25px 70px #8a27651c;overflow:hidden;position:relative}
.detail-hero:after{content:"";position:absolute;width:250px;height:250px;border:45px solid #f5a9db33;border-radius:50%;right:-145px;bottom:-170px;pointer-events:none}
.detail-cover-frame{padding:11px;border:1px solid #fff;background:linear-gradient(135deg,#fff,#f9d2ed);box-shadow:0 25px 55px #a13c902b;border-radius:29px;aspect-ratio:1;position:relative;z-index:1;overflow:hidden}
.detail-cover-frame .cover,.detail-cover-frame img.cover{display:grid;place-items:center;max-width:none!important;border-radius:20px;width:100%;height:100%!important;aspect-ratio:1!important;object-fit:cover}
.detail-overview{position:relative;z-index:1;min-width:0}
.detail-overline{display:inline-flex;align-items:center;gap:7px;color:#bb2482;font-weight:900;font-size:.78rem;letter-spacing:.1em}
.detail-overview h1{font-size:clamp(2.2rem,4vw,4rem);letter-spacing:-.055em;margin:14px 0 13px;overflow-wrap:anywhere}
.detail-description{color:#815069;font-size:clamp(.92rem,1.2vw,1.04rem);max-width:640px;line-height:1.65}
.detail-tags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.detail-tags span{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:12px;background:#fff9fdc9;border:1px solid #efcae1;color:#8e2d6c;font-weight:740;font-size:.84rem}
.detail-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:25px 0 20px}
.detail-metrics>div{background:#fffcfeeb;border:1px solid #f1cee3;padding:15px 12px;border-radius:18px;display:flex;align-items:flex-start;flex-direction:column;gap:5px;min-width:0;box-shadow:0 9px 22px #be58a311}
.metric-symbol{color:#bf2887;font-size:1.25rem;margin-bottom:2px}.detail-metrics small{color:#915472;font-size:.75rem}.detail-metrics strong{font-size:.93rem;overflow-wrap:anywhere}
.detail-join-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;align-items:center}
.detail-join-actions .btn{border-radius:14px;min-height:45px}.detail-join-note{color:#945b79;font-size:.86rem}
.detail-lower{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.detail-panel{border-radius:26px;padding:23px;min-width:0}
.detail-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.detail-panel-heading h2{margin:5px 0 0;font-size:1.42rem}
.detail-members-list{display:grid;gap:10px;max-height:520px;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.detail-member-card,.detail-person{padding:13px;border:1px solid #efd3e5;background:#fffafd;border-radius:16px}
.detail-member-title{display:flex;align-items:center;gap:10px;min-width:0}.detail-member-title>div{display:grid;gap:2px;flex:1;min-width:0}.detail-member-title strong{overflow-wrap:anywhere}.detail-member-title small{font-size:.73rem;color:#9b6683}
.member-icon,.member-avatar,.score-avatar{width:37px;height:37px;display:grid;place-items:center;flex:none;border-radius:12px;background:linear-gradient(135deg,#fae5f2,#f4d4fa);color:#a7217a;font-weight:900}
.member-avatar{background:linear-gradient(135deg,#ed56a2,#b83ed0);color:white}
.member-chips{display:flex;flex-wrap:wrap;gap:6px;padding:10px 0 0 46px}.member-chip{padding:6px 10px;border-radius:9px;background:#fce6f3;color:#87305e;font-size:.76rem;font-weight:700}
.member-points{font-size:.83rem;font-weight:850;color:#ad2b80;white-space:nowrap;margin-left:auto}
.detail-person{display:flex;align-items:center;gap:12px}.detail-person strong{flex:1;overflow-wrap:anywhere}
.scoreboard-nonumber{gap:10px}.score-row-identity{border-color:#f4d7e9;padding:13px;background:linear-gradient(120deg,#fffdfa,#fff1fa);border-radius:17px}
.score-row-identity .score-avatar{background:linear-gradient(145deg,#f08bbe,#d476db);color:#fff}
.score-row-identity:first-child{border-color:#efd3a1;background:linear-gradient(120deg,#fffaee,#fff0f9)}
.score-row-identity:first-child .score-avatar{background:linear-gradient(140deg,#fac474,#f1a8cc);color:#602247}
.score-identity{flex:1;min-width:0}.score-identity strong{display:block;overflow-wrap:anywhere}.score-identity .subtle{font-size:.77rem;line-height:1.5;margin-top:3px}
.resume-section{margin-bottom:28px}.resume-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px}
.resume-item{display:flex;align-items:center;gap:14px;background:#fffbfde8;border:1px solid #f4cede;border-radius:18px;padding:13px 15px;min-width:0;box-shadow:0 12px 25px #ab51820c}
.resume-emblem{display:grid;place-items:center;width:46px;height:46px;background:#fbe0f0;color:#bd2d90;border-radius:14px;flex:none}
.resume-info{display:grid;gap:2px;flex:1;min-width:0}.resume-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resume-info small{color:#995774}.resume-item .btn{flex:none}
/* Dua halaman yang benar-benar berbeda, tanpa panel penilaian dalam ruang bermain. */
.premium-game-room,.premium-assessment-room{gap:9px}
.room-topline{display:flex;justify-content:space-between;gap:15px;align-items:center;flex:none;min-width:0}
.room-page-title{min-width:0}.room-page-title h1{font-size:clamp(1.18rem,2.3vw,1.65rem);line-height:1.2;margin:4px 0 2px}.room-page-title p{margin:0;color:#83516c;font-size:.83rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.room-top-actions,.sound-controls{display:flex;align-items:center;gap:7px;flex:none}
.sound-button.sound-muted{position:relative;opacity:.56}
.sound-button.sound-muted:after{content:"";position:absolute;height:2px;width:27px;transform:rotate(-42deg);background:#ae326f;border-radius:4px;left:7px}
.room-tabs{display:flex;align-self:flex-start;gap:4px;background:#fff4fabf;border:1px solid #f3d3e5;padding:4px;border-radius:16px;flex:none}
.room-tab{display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 18px;border-radius:12px;color:#8e4b72;font-weight:800;font-size:.87rem;white-space:nowrap;transition:background .2s,color .2s}
.room-tab:hover{background:#f9e1f0}.room-tab.selected{background:linear-gradient(130deg,#ee4e9f,#c735c1);color:white;box-shadow:0 7px 16px #e549a43d}
.premium-stage-head{background:linear-gradient(120deg,#fffafd,#ffe6f3);padding:12px 15px;border-radius:18px;border:1px solid #fffbfe;gap:12px}
.premium-stage-head .action-row{align-items:center;margin:0}.premium-score-head{display:flex;align-items:flex-start;justify-content:space-between;gap:9px;margin-bottom:12px}.premium-score-head h3{margin:4px 0 0;font-size:1.12rem}
.play-question-body{width:100%;text-align:left;background:#fff;border-radius:16px;overflow-y:auto;max-height:36vh}.play-question .timer{margin:0}
.premium-assessment-room>.game-stage{background:linear-gradient(135deg,#f3ddf4,#f8d9e9 55%,#f8eafa)}
.assessment-stage-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex:none;margin-bottom:14px;padding:15px 18px;border-radius:19px;background:linear-gradient(110deg,#692452,#ad327f);color:#fff;box-shadow:0 10px 24px #7f265735}
.assessment-stage-head .eyebrow{color:#ffcae9}.assessment-stage-head h2{margin:3px 0 0;font-size:clamp(1.1rem,2vw,1.5rem)}
.assessment-workspace{min-height:0;overflow-y:auto;overscroll-behavior:contain;background:#fffafd;border:1px solid #fff;border-radius:22px;padding:clamp(16px,2.4vw,28px);display:flex;flex-direction:column;gap:16px;align-items:stretch}
.assessment-question-kicker{display:flex;gap:8px;flex-wrap:wrap}.assessment-content{flex:1;background:#fff;border:1px solid #edd2e3;border-radius:17px;padding:18px;min-height:50px;max-height:35vh;overflow-y:auto}
.assessment-answer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-radius:14px;background:#edfdf5;color:#127450;flex-wrap:wrap}
.assessment-answer strong{display:inline-flex;gap:7px;align-items:center}.assessment-decision{text-align:center;background:linear-gradient(135deg,#fff0f8,#f9e6fe);border:1px solid #f4d5e8;padding:18px;border-radius:17px}
.assessment-decision h2{font-size:clamp(1.1rem,2.1vw,1.55rem);margin:6px 0}.assessment-decision p{color:#8d5173;margin:0 0 12px;font-size:.86rem}
.assessment-buttons{display:flex;justify-content:center;flex-wrap:wrap;gap:13px}.assessment-buttons .btn{min-width:130px;min-height:48px;font-weight:850}
.assessment-pending,.assessment-idle,.assessment-result{flex:1;min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;text-align:center}
.assessment-idle>.icon{font-size:2.4rem;color:#bd3688}.assessment-pending h2,.assessment-idle h2,.assessment-result h2{margin:0}
.assessment-pending p,.assessment-idle p,.assessment-result p{color:#995878;max-width:550px;margin:0}
.assessment-result strong{font-size:2rem;background:linear-gradient(120deg,#b72a80,#b52ad1);color:transparent;background-clip:text}
.player-live .live-score-panel .scoreboard-scroll{max-height:39dvh;overflow:auto;overscroll-behavior:contain}
@media(max-width:900px){.detail-hero{grid-template-columns:minmax(0,1fr);gap:20px}.detail-cover-frame{width:min(100%,330px);justify-self:center}.detail-lower{grid-template-columns:minmax(0,1fr)}.detail-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){
 .topbar .nav-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
 .detail-hero{padding:20px;border-radius:24px}.detail-overview h1{font-size:2rem}.detail-metrics{gap:7px}.detail-metrics>div{padding:11px 9px;border-radius:13px}.detail-metrics strong{font-size:.82rem}.detail-metrics small{font-size:.7rem}.detail-tags span{font-size:.77rem}
 .detail-join-actions{display:grid;grid-template-columns:minmax(0,1fr)}.detail-join-actions .btn{width:100%;justify-content:center}.detail-panel{padding:17px}
 .resume-item{flex-wrap:wrap}.resume-item .btn{width:100%;justify-content:center}
 .room-topline{align-items:flex-start}.room-top-actions{gap:5px}.room-tabs{width:100%;justify-content:stretch}.room-tab{flex:1;padding:9px 11px;font-size:.79rem}
 .premium-stage-head{padding:10px 12px;gap:7px}.premium-stage-head .action-row{gap:5px}
 .premium-assessment-room .assessment-grid{grid-template-rows:minmax(0,1fr) minmax(90px,19%)}
 .assessment-workspace{padding:12px}.assessment-content{padding:11px;max-height:24vh}.assessment-stage-head{margin-bottom:8px;padding:10px 12px}
 .assessment-pending,.assessment-idle,.assessment-result{min-height:140px;gap:9px}.assessment-pending .suspense-spinner{width:45px;height:45px}
 .room-page-title p{max-width:48vw}.sound-controls{gap:4px}
}
@media(prefers-reduced-motion:reduce){.room-tab,.detail-person,.detail-member-card{transition:none}}

/* Seluruh peserta juga terlihat dalam tabel Beranda, tanpa nomor, gulir di dalam sel. */
.rank-list.rank-all{max-height:225px;min-width:190px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;display:grid;gap:5px;padding:2px 4px 2px 1px}
.rank-list.rank-all .rank-line{display:flex;align-items:center;gap:8px;min-height:30px;border-radius:10px;background:linear-gradient(100deg,#fff8fc,#fce8f5);padding:6px 9px;font-size:.82rem}
.rank-list.rank-all .rank-line>span,.rank-list.rank-all .rank-line>a{min-width:0;flex:1;overflow-wrap:anywhere;font-weight:740}
.rank-list.rank-all .rank-line strong{white-space:nowrap;color:#b42a86;font-weight:900}
.rank-list.rank-all .rank-line strong small{font-size:.68rem;font-weight:600}

/* REVISI 06 — ruang bermain lapang, simetris dan tampilan pantauan peserta */
.tile-academic{display:grid;gap:9px;margin-top:13px}
.tile-academic .tile-meta{margin:0!important;display:flex;align-items:flex-start;gap:10px;min-width:0;border:1px solid #f2d3e6;background:#fff8fdf2;padding:10px 12px;border-radius:13px;color:#522445}
.tile-academic .tile-meta>.icon{margin-top:3px;flex:none;color:#c32e89}
.tile-academic .tile-meta>span{min-width:0;display:grid;gap:3px;overflow-wrap:anywhere;font-weight:760;line-height:1.38}
.tile-academic small{display:block;color:#9b6483;font-size:.72rem;font-weight:600}
.detail-lower-single{display:block}
.detail-panel-members{max-width:none}
.detail-panel-members .detail-members-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,295px),1fr));max-height:none;gap:13px;overflow:visible}
.detail-panel-members .detail-member-card,.detail-panel-members .detail-person{height:100%;transition:transform .18s ease, box-shadow .18s ease;background:#fffcfe}
.detail-panel-members .detail-member-card:hover{transform:translateY(-2px);box-shadow:0 13px 25px #d0458920}
.detail-panel-members .member-chips{padding-left:0}
.detail-member-title>div{min-width:0}
.detail-member-card .member-points{font-size:.88rem}
/* Seluruh kelompok menggunakan warna dasar yang sama, tanpa warna khusus urutan pertama. */
.score-row-identity,.score-row-identity:first-child{border-color:#f2d4e5!important;background:linear-gradient(115deg,#fffafd,#fff0f9)!important}
.score-row-identity .score-avatar,.score-row-identity:first-child .score-avatar{background:linear-gradient(135deg,#ee83bf,#ca69cc)!important;color:#fff!important}
.score-row-identity{gap:10px;padding:10px 11px;border-radius:14px;min-height:57px}
.score-row-identity .score-avatar{width:31px;height:31px;font-size:.82rem;border-radius:10px}
.score-row-identity .score-identity strong{font-size:clamp(.76rem,1.15vw,.91rem);line-height:1.3;word-break:break-word}
.score-row-identity .score-value{font-size:clamp(.77rem,1.2vw,.91rem);flex-shrink:0;white-space:nowrap}
.score-row-identity .score-value small{font-size:.71rem}
.score-group-details{min-width:0}
.score-group-details>summary{list-style:none;display:flex;gap:6px;align-items:center;cursor:pointer;flex-wrap:wrap;outline-offset:3px}
.score-group-details>summary::-webkit-details-marker{display:none}
.score-group-details>summary:before{content:'⌄';color:#c33291;font-weight:900;font-size:.86rem;transition:transform .2s;line-height:1;flex:none}
.score-group-details[open]>summary:before{transform:rotate(180deg)}
.score-group-details>summary .member-count{background:#fce5f3;color:#9f477e;border-radius:30px;padding:3px 6px;font-size:.66rem;font-weight:670;white-space:nowrap}
.score-member-names{list-style:none;display:flex;flex-direction:column;gap:4px;margin:8px 0 0!important;padding:8px 2px 0 9px!important;border-top:1px solid #f3d8ea}
.score-member-names li{font-size:.75rem;color:#75445f;overflow-wrap:anywhere}
.minimal-score-head{align-items:center;gap:7px;margin-bottom:10px}
.minimal-score-head h3{font-size:clamp(.95rem,1.2vw,1.07rem);line-height:1.3;margin:2px 0 0}
.minimal-score-head .eyebrow{font-size:.67rem}
.minimal-score-head .pill{font-size:.7rem;padding:6px 8px;white-space:nowrap}
/* Ruang guru lebar penuh dan tahap kartu tidak mengambil ruang berlebihan pada judul. */
.admin-content:has(.premium-game-room){padding-left:clamp(12px,1.35vw,24px);padding-right:clamp(12px,1.35vw,24px)}
.premium-game-room .room-columns{grid-template-columns:minmax(0,2.65fr) minmax(230px,.8fr);gap:clamp(10px,1.15vw,18px)}
.premium-game-room .room-play-area>.card-selection-phase{gap:0;align-items:stretch;padding:12px 15px;min-width:0}
.card-selection-heading{width:100%;text-align:center;display:flex;align-items:center;flex-direction:column;gap:3px;flex:none;padding:0 5px 8px}
.card-selection-heading .eyebrow{font-size:.7rem;padding:5px 11px;letter-spacing:.04em}
.premium-game-room .card-selection-heading h2{font-size:clamp(1.1rem,1.65vw,1.55rem);margin:1px 0 0;line-height:1.16;letter-spacing:-.025em}
.card-selection-heading p{font-size:.79rem;line-height:1.3;margin:0}
.premium-game-room .room-play-area>.card-selection-phase>.question-grid{width:100%;flex:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,118px));justify-content:center;align-content:start;gap:clamp(9px,1.2vw,16px);padding:10px 8px}
.premium-game-room .question-grid .question-card{width:100%;height:145px;min-height:145px;max-height:145px;aspect-ratio:unset;border-radius:18px}
.premium-game-room .question-grid .question-card span{font-size:.77rem}
/* Panel permainan siswa hanya menampilkan perkembangan tahapan; tidak ada tombol untuk mengubah hasil. */
.spectator-room{width:min(100%,1500px);margin:0 auto;display:flex;flex-direction:column;gap:16px}
.spectator-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.spectator-top .eyebrow{font-size:.74rem}
.spectator-top h1{font-size:clamp(1.38rem,2.7vw,2.2rem);margin:5px 0 2px;line-height:1.15}
.spectator-top p{color:#885171;margin:0;font-size:.87rem}
.spectator-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.spectator-layout{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(270px,.8fr);gap:17px;align-items:stretch;min-height:min(67dvh,640px);max-width:none;padding:clamp(13px,1.4vw,20px)}
.spectator-main{min-width:0;min-height:0;border:1px solid #fff;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;text-align:center;padding:clamp(17px,2vw,28px);border-radius:21px;background:#fffafd;overflow:auto}
.spectator-main h2{font-size:clamp(1.3rem,2.4vw,2rem);margin:4px 0}
.spectator-main p{max-width:620px;margin:0;color:#875b74}
.spectator-main .spectator-stage-heading h2{margin:4px 0}
.spectator-stage-heading{display:grid;gap:5px;justify-items:center}
.spectator-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(51px,70px));justify-content:center;align-content:center;gap:9px;width:100%;max-height:42dvh;overflow-y:auto;padding:10px}
.spectator-card{display:grid;place-items:center;width:100%;aspect-ratio:4/5;border-radius:13px;background:linear-gradient(145deg,#ed5bab,#c02bd0);border:2px solid #fff;color:#fff;box-shadow:0 7px 12px #be4a9230;pointer-events:none;user-select:none}
.spectator-card .icon{font-size:1.6rem}
.spectator-main .spotlight-card{width:90px;max-width:90px;aspect-ratio:4/5;margin:0 auto}
.spectator-main .spectator-question{max-height:35dvh;overflow:auto;width:100%;background:white;border-radius:15px;border:1px solid #f2d3e6;text-align:left;color:#381b2e}
.spectator-live-symbol{display:grid;place-items:center;width:64px;height:64px;border-radius:21px;background:#fbe1f1;color:#c33291;font-size:2.5rem}
.spectator-scores{min-width:0;min-height:0;display:flex;flex-direction:column;gap:5px;overflow:hidden;padding:16px}
.spectator-scores .scoreboard-scroll{max-height:none;overflow-y:auto;flex:1;min-height:0}
.spectator-foot{font-size:.79rem;color:#915875;display:flex;align-items:center;gap:8px;justify-content:center;text-align:center}
@media(max-width:1080px){.spectator-layout{grid-template-columns:minmax(0,1.4fr) minmax(235px,.85fr)}.premium-game-room .room-columns{grid-template-columns:minmax(0,2fr) minmax(190px,.77fr)}}
@media(max-width:800px){.spectator-layout{grid-template-columns:minmax(0,1fr);min-height:0;gap:11px}.spectator-main{min-height:340px}.spectator-scores{max-height:310px;min-height:190px}.premium-game-room .room-columns{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(105px,26%)}.premium-game-room .room-play-area>.card-selection-phase>.question-grid{grid-template-columns:repeat(auto-fill,minmax(90px,106px));gap:10px}.premium-game-room .question-grid .question-card{height:128px;min-height:128px;max-height:128px}}
@media(max-width:640px){.tile-academic .tile-meta{padding:10px}.detail-panel-members .detail-members-list{grid-template-columns:minmax(0,1fr)}.premium-game-room .card-selection-heading h2{font-size:1.08rem}.premium-game-room .room-play-area>.card-selection-phase{padding:9px}.premium-game-room .room-play-area>.card-selection-phase>.question-grid{grid-template-columns:repeat(auto-fill,minmax(75px,95px));gap:8px;padding:6px}.premium-game-room .question-grid .question-card{height:118px;min-height:118px;max-height:118px}.spectator-room{gap:12px}.spectator-top{gap:10px}.spectator-top h1{font-size:1.46rem}.spectator-top .eyebrow{font-size:.68rem}.spectator-main{min-height:320px;padding:16px}.spectator-scores{max-height:270px}.spectator-cards{grid-template-columns:repeat(auto-fit,minmax(43px,58px));gap:7px}.spectator-card{border-radius:9px}.spectator-foot{font-size:.72rem}.score-row-identity{padding:9px 10px}}
@media(prefers-reduced-motion:reduce){.score-group-details>summary:before{transition:none}}

/* Revisi 07 – penataan footer paginasi, pilihan dan peringkat */
.table-foot{gap:12px;margin-top:17px}
.table-foot .table-count{font-size:.79rem}
.pagination{margin-left:auto;gap:7px;display:flex;align-items:center;flex-wrap:nowrap}
.pagination .btn{width:36px;height:36px;min-height:36px;padding:6px;border-radius:11px}
.pagination .page-indicator{padding:7px 11px;font-size:.76rem;min-width:54px;justify-content:center}
.compact-limit{display:flex;align-items:center;margin:0;min-width:60px}
.compact-limit select{appearance:none!important;-webkit-appearance:none!important;margin:0!important;min-height:36px!important;height:36px!important;width:63px!important;padding:5px 23px 5px 12px!important;font-weight:780;font-size:.84rem!important;border-radius:11px!important;background:#fff9fc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23b7277f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 10px center / 10px no-repeat!important;color:#a52e76!important;cursor:pointer}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
select{accent-color:#dc388d!important;color-scheme:light!important;cursor:pointer}
select option{background:#fff1f9!important;color:#63214a!important}
select option:checked{background:#f7cce5!important;color:#842458!important}
select option:hover{background:#f9d8ea!important;color:#8f286d!important}
.themed-select-menu{display:flex;flex-direction:column;gap:3px;overflow-y:auto;overscroll-behavior:contain;background:#fffafd;border:1px solid #edbedb;box-shadow:0 20px 45px #6f1d533d;border-radius:15px;padding:7px;scrollbar-width:thin;scrollbar-color:#db83b4 #fff1f8}
.themed-select-option{appearance:none;border:0;border-radius:10px;text-align:left;flex:none;display:block;width:100%;min-height:37px;padding:9px 12px;color:#5b2248;font-weight:660;font-size:.87rem;background:transparent;cursor:pointer;white-space:normal;overflow-wrap:anywhere;transition:background .15s,color .15s}
.themed-select-option:hover,.themed-select-option.keyboard-focus{background:#f9d5ec;color:#a31c71}
.themed-select-option.selected{background:linear-gradient(120deg,#ec4899,#c026d3);color:#fff}
.themed-select-option:disabled{opacity:.45;cursor:not-allowed}
/* Permainan dan penilaian menggunakan lebar ruang kerja yang sama. */
.admin-content:has(.premium-game-room),.admin-content:has(.premium-assessment-room){padding-left:clamp(12px,1.35vw,24px);padding-right:clamp(12px,1.35vw,24px)}
.premium-game-room>.game-stage,.premium-assessment-room>.game-stage{width:100%;max-width:none;margin:0;box-sizing:border-box}
.premium-game-room .room-columns,.premium-assessment-room .assessment-grid{grid-template-columns:minmax(0,2.65fr) minmax(230px,.8fr);gap:clamp(10px,1.15vw,18px)}
/* Seluruh papan nilai menggunakan posisi peringkat: tanpa ikon huruf K atau panah. */
.score-rank{width:32px;height:32px;flex:none;display:inline-grid;place-items:center;border-radius:11px;background:linear-gradient(140deg,#e3489a,#c058c6);color:#fff;font-size:.85rem;font-weight:900;font-variant-numeric:tabular-nums;box-shadow:0 4px 10px #c43c9630}
.score-row:first-child .score-rank{background:linear-gradient(135deg,#dfa64b,#ec77a7);color:#fff}
.score-group-details>summary:before,.score-group-details[open]>summary:before{content:none!important;display:none!important}
.score-group-details>summary{gap:7px;cursor:pointer}
.score-group-details>summary:hover strong{color:#bb2b83}
.score-group-details>summary:focus-visible{outline:2px solid #ec4899;border-radius:4px}
.score-group-details>summary .member-count{background:#fce5f3;border-radius:99px}
.prep-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.selection-back{display:flex;justify-content:center;margin-top:7px}
@media(max-width:1080px){.premium-game-room .room-columns,.premium-assessment-room .assessment-grid{grid-template-columns:minmax(0,2fr) minmax(190px,.77fr)}}
@media(max-width:800px){.premium-game-room .room-columns,.premium-assessment-room .assessment-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(105px,26%)}}
@media(max-width:640px){.table-foot{align-items:center}.table-foot .table-count{font-size:.73rem}.pagination{gap:4px}.pagination .btn{min-width:32px;width:32px;height:33px;min-height:33px}.compact-limit select{height:33px!important;min-height:33px!important}.prep-actions .btn{min-height:38px;font-size:.81rem;padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.themed-select-option{transition:none}}


/* Revisi 08 – ringkas, lebar, dan responsif */
.premium-stage-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.stage-summary-block{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.stage-summary-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.eyebrow.compact{padding:7px 11px;font-size:.8rem;letter-spacing:.02em;text-transform:none}
.stage-summary-row .eyebrow.compact{max-width:100%;overflow-wrap:anywhere}
.stage-summary-row .pill{min-height:34px}
.tile-academic .tile-meta>span{display:block;font-weight:760;line-height:1.42}
.tile-academic small{display:none!important}
.detail-tags{gap:10px}
.detail-tags span{font-weight:760}
.detail-join-actions .btn .icon{margin-right:1px}
/* fmain lebih lebar dan pas satu layar desktop */
.player-shell.spectator-room{width:min(100%,1720px)}
.player-shell .game-stage.player-live{padding:clamp(12px,1.6vw,22px);min-height:min(78dvh,760px)}
.spectator-layout{grid-template-columns:minmax(0,2.55fr) minmax(280px,.9fr);gap:18px;min-height:min(72dvh,760px)}
.spectator-main{padding:clamp(18px,2.1vw,34px);min-height:0}
.spectator-main .spectator-question,.play-question-body,.assessment-content{max-height:none}
.spectator-main .rich,.play-question-body .rich,.assessment-content .rich{font-size:clamp(.98rem,1.2vw,1.08rem)}
.spectator-main img,.play-question-body img,.assessment-content img{max-width:100%;height:auto}
.live-score-panel{overflow:hidden}
/* ruang guru/penilaian lebih simetris */
.premium-game-room>.game-stage,.premium-assessment-room>.game-stage{padding:16px}
.premium-game-room .room-columns,.premium-assessment-room .assessment-grid{grid-template-columns:minmax(0,2.6fr) minmax(295px,.9fr)}
/* kartu lebih longgar */
.premium-game-room .room-play-area>.card-selection-phase>.question-grid{grid-template-columns:repeat(auto-fit,minmax(132px,148px));gap:18px;justify-content:center;padding:14px 10px 18px}
.premium-game-room .question-grid .question-card{height:172px;min-height:172px;max-height:172px}
.card-selection-heading{padding-bottom:12px}.card-selection-heading .eyebrow{font-size:.68rem}.card-selection-heading h2{font-size:clamp(1rem,1.45vw,1.38rem)}.card-selection-heading p{font-size:.74rem}
/* hide duplicate title emphasis in stage header on smaller widths */
.room-top-actions{justify-content:flex-end}
@media(max-width:1180px){
 .spectator-layout{grid-template-columns:minmax(0,1.75fr) minmax(250px,.9fr)}
 .premium-game-room .room-columns,.premium-assessment-room .assessment-grid{grid-template-columns:minmax(0,1.95fr) minmax(230px,.84fr)}
 .premium-game-room .room-play-area>.card-selection-phase>.question-grid{grid-template-columns:repeat(auto-fit,minmax(116px,132px));gap:14px}
 .premium-game-room .question-grid .question-card{height:156px;min-height:156px;max-height:156px}
}
@media(max-width:900px){
 .stage-summary-block,.stage-summary-row{width:100%}
 .spectator-layout{grid-template-columns:minmax(0,1fr)}
 .player-shell .game-stage.player-live{min-height:0}
 .spectator-main,.spectator-scores{min-height:0}
 .premium-game-room .room-columns,.premium-assessment-room .assessment-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto}
 .play-question-body,.assessment-content,.spectator-main .spectator-question{overflow:visible}
}
@media(max-width:640px){
 .room-page-title p{white-space:normal;max-width:none}
 .premium-stage-head{padding:11px 12px}
 .stage-summary-row{gap:6px}.eyebrow.compact{font-size:.74rem;padding:6px 10px}
 .spectator-top{align-items:flex-start}.spectator-controls{width:100%;justify-content:flex-end}
 .player-shell .game-stage.player-live{padding:12px}
 .spectator-layout{gap:12px}
 .spectator-main{padding:16px}
 .premium-game-room .room-play-area>.card-selection-phase>.question-grid{grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:10px;padding:10px 4px 12px}
 .premium-game-room .question-grid .question-card{height:132px;min-height:132px;max-height:132px}
 .spectator-main .spectator-question,.play-question-body,.assessment-content{padding:14px}
}

/* Fullscreen untuk halaman publik /main */
html.game-fullscreen .topbar,html.game-fullscreen .public-foot{display:none!important}
html.game-fullscreen .public-main.container{max-width:none!important;width:100%!important;padding:10px 12px 12px!important}
html.game-fullscreen .player-shell.spectator-room{width:100%!important;max-width:none!important}
html.game-fullscreen .player-shell .game-stage.player-live{min-height:calc(100dvh - 24px)!important}

/* KARTU SOAL — Revisi 09: area satu layar, kartu ringkas, dialog nilai */
.assessment-stage-head .eyebrow.assessment-participant-label{
  background:#ffe1f0!important;color:#8b1658!important;border:1px solid #f5add5;
  font-weight:900;box-shadow:0 3px 12px rgba(84,19,54,.12)
}
.assessment-stage-head .eyebrow.assessment-participant-label .icon{color:#a72573!important}
.game-cards{grid-template-columns:repeat(auto-fill,minmax(220px,250px));gap:18px;align-items:start}
.game-tile .cover{aspect-ratio:1/1;object-fit:cover}
.game-tile .tile-body{padding:14px 16px 17px}
.game-tile .tile-body h3{font-size:1.02rem;margin:8px 0;line-height:1.28}
.game-tile .chip-row{gap:5px}
.game-tile .tile-meta{font-size:.79rem;line-height:1.35;gap:7px}
.game-tile .tile-class{display:inline-flex;align-items:center;gap:7px;margin-top:8px;font-size:.79rem;font-weight:760;color:#a62c7c}
.game-tile .tile-class>.icon{font-size:.9rem}
.game-tile .tile-academic{gap:6px;margin-top:9px}
.game-tile .tile-academic .tile-meta{padding:7px 9px;border-radius:10px;font-size:.76rem}
.game-tile .tile-body>div:last-child{margin-top:12px!important}
.game-tile .btn.block{min-height:40px;padding:9px 12px;font-size:.83rem}
.ranking-popup-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:0 0 16px}
.ranking-popup-meta strong{font-size:1rem}
.modal .scoreboard{display:grid;gap:9px;max-height:min(60dvh,550px);overflow-y:auto;overscroll-behavior:contain;padding:3px}
.modal .scoreboard .score-row{background:#fff9fd;border:1px solid #f0d5e5;border-radius:14px}
/* Tampilan live peserta pada desktop tetap dalam luas yang nyaman; hanya konten bergulir */
.public-main.container:has(.spectator-room){max-width:1450px;width:100%;height:calc(100dvh - 84px);min-height:0;display:flex;flex-direction:column;padding:12px clamp(15px,2vw,28px) 15px}
.player-shell.spectator-room{width:100%;max-width:1375px;height:100%;min-height:0;gap:10px;margin:0 auto}
.player-shell .spectator-top{flex:none}
.player-shell .spectator-top h1{font-size:clamp(1.3rem,2vw,1.85rem)}
.player-shell .spectator-top .eyebrow{font-size:.68rem;padding:6px 11px}
.player-shell .game-stage.player-live,.spectator-layout{min-height:0!important;max-height:none;flex:1;overflow:hidden}
.player-shell .game-stage.player-live{padding:12px;display:grid;grid-template-columns:minmax(0,2.45fr) minmax(245px,.85fr);gap:12px}
.player-shell .spectator-main{min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain;justify-content:safe center;padding:16px}
.player-shell .spectator-scores{height:100%;max-height:none;min-height:0;padding:13px}
.player-shell .spectator-scores .scoreboard-scroll{max-height:none;overflow:auto;min-height:0}
.player-shell .spectator-main .spectator-question{max-height:100%;min-height:0;overflow:auto;overscroll-behavior:contain}
.player-shell .spectator-foot{flex:none;font-size:.72rem}
/* Layar penuh dibatasi agar tidak sampai melebar ke sisi-sisi monitor */
html.game-fullscreen .public-main.container:has(.spectator-room){max-width:1450px!important;width:100%!important;height:100dvh!important;margin-inline:auto!important;padding:10px 18px 12px!important}
html.game-fullscreen .player-shell.spectator-room{width:100%!important;max-width:1375px!important;min-height:0;height:100%}
html.game-fullscreen .player-shell .game-stage.player-live{min-height:0!important;max-height:none!important;flex:1}
/* Ruang guru dan penilaian ikut dibatasi lebarnya pada monitor ultralebar */
.premium-game-room,.premium-assessment-room{max-width:1600px;width:100%;margin-inline:auto}
@media(max-width:850px){
 .public-main.container:has(.spectator-room){height:auto;min-height:calc(100dvh - 84px);display:block;padding-bottom:25px}
 .player-shell.spectator-room{height:auto;min-height:0}
 .player-shell .game-stage.player-live{display:flex;flex-direction:column;overflow:visible;min-height:0!important}
 .player-shell .spectator-main{min-height:260px;max-height:none;overflow:visible}
 .player-shell .spectator-scores{height:auto;min-height:160px;max-height:285px}
 html.game-fullscreen .public-main.container:has(.spectator-room){height:100dvh!important;overflow-y:auto;max-width:none!important}
 html.game-fullscreen .player-shell.spectator-room{height:auto}
 html.game-fullscreen .player-shell .game-stage.player-live{height:auto;overflow:visible;flex:none}
 .game-cards{grid-template-columns:repeat(auto-fill,minmax(210px,244px));justify-content:start}
}
@media(max-width:540px){
 .game-cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:12px}
 .game-tile .tile-body{padding:12px}
 .assessment-stage-head .eyebrow.assessment-participant-label{font-size:.68rem}
}
/* Hindari footer menambah tinggi di bawah layar live. */
body:has(.spectator-room) .public-foot{display:none}
@media(max-width:640px){
 .public-main.container:has(.spectator-room){padding:14px 18px 22px!important}
}

/* Revisi 10 — pendaftaran peserta manual oleh Guru */
.manual-enroll-info{display:flex;align-items:center;gap:13px;padding:15px 17px;margin-bottom:17px;background:linear-gradient(125deg,#fff0f8,#fbe7fa);border:1px solid #f4c6e3;border-radius:17px;color:#ad2879}
.manual-enroll-info>.icon{flex:none;width:32px;height:32px}
.manual-enroll-info span{min-width:0;display:grid;gap:4px}
.manual-enroll-info strong{color:#542142;font-size:1rem;overflow-wrap:anywhere}
.manual-enroll-info small{color:#90526e;font-size:.81rem}
.premium-stage-head .action-row>.icon-btn{flex-shrink:0}
@media(max-width:640px){.premium-stage-head .action-row{flex-wrap:wrap;justify-content:flex-end}}

/* Revisi 11: sudut akhir roda mengikuti pilihan server, bukan angka tetap. */
@keyframes wheelPointerToWinner{from{transform:rotate(0deg)}to{transform:rotate(var(--wheel-end,1800deg))}}
.wheel-pointer.spinning-pointer{animation:wheelPointerToWinner 3.2s cubic-bezier(.11,.75,.13,1) forwards!important}
@media(prefers-reduced-motion:reduce){.wheel-pointer.spinning-pointer{animation:none!important;transform:rotate(calc(var(--wheel-end,0deg) - 1800deg))}}
/* Penilaian hanya menampilkan informasi soal dan dua keputusan guru. */
.grade-only-room>.game-stage{display:flex;flex-direction:column;min-height:min(70dvh,700px)}
.grade-only-workspace{display:flex;justify-content:center;align-items:stretch;flex:1;min-height:260px;overflow:auto;gap:clamp(16px,2.3vw,32px);padding:clamp(19px,3vw,38px)}
.assessment-minimal-question{display:grid;gap:16px;width:min(100%,810px);text-align:left}
.assessment-minimal-question>.rich{font-size:clamp(1.05rem,1.5vw,1.28rem);line-height:1.65;padding:clamp(15px,2vw,28px);background:#fff;border:1px solid #f1d7e7;border-radius:18px;overflow-wrap:anywhere;max-height:min(39dvh,370px);overflow-y:auto}
.assessment-minimal-question>.rich img{max-width:100%;height:auto}
.assessment-short-key{margin:0;color:#196747;background:#edfcf3;padding:10px 15px;border-radius:13px;overflow-wrap:anywhere}
.assessment-minimal-decision{width:100%;display:grid;place-items:center}
.grade-only-workspace .assessment-buttons{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,220px));justify-content:center;gap:18px}
.grade-only-workspace .assessment-buttons .btn{min-height:70px;font-size:1.25rem;border-radius:19px}
.grade-only-workspace .assessment-idle .icon{font-size:2.2rem;color:#ce3989}
@media(max-width:650px){.grade-only-workspace{padding:15px}.grade-only-workspace .assessment-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.grade-only-workspace .assessment-buttons .btn{min-height:60px;font-size:1rem;padding:12px 10px}}


/* REVISI 12 — seluruh soal responsif, tinggi alami, tanpa kolom teks sempit. */
.premium-game-room .room-play-area{min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.premium-game-room .room-play-area>.phase-card.play-question{
  height:auto;min-height:100%;overflow:visible;flex:0 0 auto;align-items:stretch;
  justify-content:flex-start;gap:clamp(10px,1.5vh,16px);padding:clamp(16px,1.8vw,28px);
}
.premium-game-room .play-question>.eyebrow{align-self:center}
.premium-game-room .play-question>h2,.premium-game-room .play-question>.timer{text-align:center;flex-shrink:0}
.premium-game-room .play-question>.timer{font-size:clamp(2.5rem,5vw,4.1rem);line-height:1.12}
.premium-game-room .play-question>.question-paper{
  display:block;box-sizing:border-box;flex:0 0 auto;align-self:stretch;width:100%;max-width:100%;
  min-width:0;min-height:95px;height:auto;max-height:none!important;overflow:visible!important;
  padding:clamp(17px,2.2vw,30px);border-radius:19px;border:1px solid #f0cfdf;
  background:#fffafd;color:#421332;font-size:clamp(1rem,1.3vw,1.2rem);
  line-height:1.7;text-align:left;white-space:normal;overflow-wrap:anywhere;word-break:normal;
}
.premium-game-room .question-paper :is(p,div,span,strong,b,em,h1,h2,h3,blockquote,li){
  max-width:100%;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal;
}
.premium-game-room .question-paper> :first-child{margin-top:0}
.premium-game-room .question-paper> :last-child{margin-bottom:0}
.premium-game-room .question-paper :is(img,video,iframe,svg){max-width:100%;height:auto}
.premium-game-room .question-paper iframe{aspect-ratio:16/9}
.premium-game-room .question-paper table{width:100%!important;max-width:100%!important;table-layout:fixed;border-collapse:collapse}
.premium-game-room .question-paper :is(td,th){white-space:normal!important;overflow-wrap:anywhere!important}
.premium-game-room .play-question>.action-row,.premium-game-room .play-question>.game-metrics,
.premium-game-room .play-question>p{flex:0 0 auto}
/* Ruang penilaian selalu memiliki dua kolom, termasuk sebelum dan setelah soal dinilai. */
.premium-assessment-room.grade-only-room{width:100%;max-width:1600px;min-width:0;align-self:stretch;margin-inline:auto}
.grade-only-room>.game-stage{flex:1;min-height:0;width:100%;max-width:none;overflow:hidden}
.grade-only-room .assessment-stage-head{flex-shrink:0}
.grade-only-room .grade-stable-grid{
  display:grid;grid-template-columns:minmax(0,2.6fr) minmax(265px,.9fr);
  grid-template-rows:minmax(0,1fr);gap:clamp(10px,1.15vw,18px);
  flex:1;width:100%;min-width:0;min-height:0;
}
.grade-only-room .grade-only-workspace{
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
  min-width:0;min-height:0;height:100%;margin:0;
  overflow-y:auto;overflow-x:hidden;padding:clamp(16px,2vw,26px);
}
.grade-only-room .assessment-minimal-question{width:100%;max-width:none;min-width:0;gap:12px}
.grade-only-room .assessment-minimal-question>.rich{
  width:100%;max-width:100%;min-width:0;max-height:none;overflow:visible;
  overflow-wrap:anywhere;white-space:normal;
}
.grade-only-room .assessment-minimal-question>.rich :is(img,iframe,video){max-width:100%;height:auto}
.grade-only-room .assessment-minimal-question>.rich table{width:100%;max-width:100%;table-layout:fixed}
.grade-only-room .grade-score-panel{
  display:flex;flex-direction:column;min-width:0;min-height:0;
  height:100%;overflow:hidden;padding:16px;
}
.grade-only-room .grade-score-panel .scoreboard-scroll{flex:1;min-height:0;max-height:none;overflow-y:auto;overflow-x:hidden}
.grade-only-room .grade-score-panel .score-identity{min-width:0}
.grade-only-room .grade-score-panel .score-identity strong{overflow-wrap:anywhere}
.grade-only-room .grade-score-panel .score-value{white-space:nowrap}
.grade-only-room .assessment-idle,.grade-only-room .assessment-result{width:100%;min-height:220px}
/* Pada perangkat sempit konten soal tetap selebar layar. Papan nilai di bawahnya. */
@media(max-width:900px){
 .grade-only-room>.game-stage{overflow-y:auto;overscroll-behavior:contain}
 .grade-only-room .grade-stable-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(270px,auto) minmax(190px,auto);align-content:start}
 .grade-only-room .grade-only-workspace{height:auto;min-height:270px;overflow:visible}
 .grade-only-room .grade-score-panel{min-height:190px;height:auto;max-height:295px}
 .grade-only-room .grade-score-panel .scoreboard-scroll{overflow-y:auto}
 .premium-game-room .play-question>.question-paper{min-height:90px;padding:16px}
}
@media(max-width:640px){
 .premium-game-room .room-play-area>.phase-card.play-question{padding:14px 12px}
 .premium-game-room .play-question>.timer{font-size:clamp(2.15rem,12vw,3.1rem)}
 .premium-game-room .play-question>.question-paper{font-size:1rem;line-height:1.65;padding:15px 13px}
 .grade-only-room .grade-stable-grid{gap:12px}
 .grade-only-room .grade-only-workspace{padding:14px}
 .grade-only-room .grade-score-panel{padding:13px}
}

/* Di layar tablet/ponsel, isi halaman boleh bergulir secara alami, tanpa kotak soal mini. */
@media(max-width:900px){
 .admin-body:has(.game-room){height:auto;min-height:100dvh;overflow:visible}
 .admin-content:has(.game-room){height:auto;min-height:0;flex:none;overflow:visible}
 .game-room{height:auto;min-height:0}
 .game-room>.game-stage{flex:none;height:auto;min-height:0;overflow:visible}
 .game-room .room-columns,.game-room .assessment-grid{flex:none;min-height:0;grid-template-rows:auto auto}
 .game-room .room-play-area{height:auto;min-height:0;overflow:visible}
 .game-room .room-play-area>.phase-card.play-question{height:auto;min-height:0;overflow:visible}
 .game-room .room-score-panel{height:auto;min-height:190px;max-height:320px}
 .game-room .room-score-panel .scoreboard-scroll{overflow-y:auto}
 .grade-only-room .grade-only-workspace{min-height:270px}
}