@import"https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Jua&family=Nunito:wght@700;800;900&display=swap";:root{--navy:#090b25;--purple:#5b2cff;--violet:#8f43ff;--cyan:#19d8ff;--pink:#ff3fb4;--yellow:#ffd83d;--white:#fff;--ink:#17152f;--good:#20dc8e;--bad:#ff4f6d}*{box-sizing:border-box;margin:0}html,body,#root{min-height:100%}body{background:#080a21;color:#fff;font-family:Nunito,Jua,system-ui,sans-serif;-webkit-text-size-adjust:100%}button,input{font:inherit}button{cursor:pointer;border:0}.app{max-width:480px;min-height:100dvh;margin:auto;background:radial-gradient(circle at 12% 12%,#6d37ff 0,transparent 28%),radial-gradient(circle at 92% 35%,#0ca7cf55 0,transparent 24%),linear-gradient(165deg,#171042,#080a21 72%);overflow:hidden;position:relative}.page-shell{min-height:100dvh;padding:20px;position:relative}.sub{color:#a9add3}.big{font:32px Black Han Sans,sans-serif}.entry{display:flex;flex-direction:column;gap:14px}.entry:before,.entry:after{content:"";position:absolute;width:220px;height:220px;border:1px solid #ffffff12;border-radius:50%;pointer-events:none}.entry:before{top:70px;left:-130px}.entry:after{right:-150px;top:250px}.entry-header{display:flex;justify-content:space-between;align-items:center;z-index:1}.live-pill,.sound-chip{height:38px;border-radius:999px;background:#161845cc;border:1px solid #ffffff20;color:#fff;display:flex;align-items:center;gap:7px;padding:0 13px;font-size:12px}.live-pill i,.live-note i{width:7px;height:7px;border-radius:50%;background:#ff405d;box-shadow:0 0 10px #ff405d;animation:pulse 1.2s infinite}.live-pill b{color:var(--cyan)}.sound-chip{width:38px;justify-content:center;padding:0}.spark{position:absolute;color:var(--cyan);font-size:22px;animation:float 2.6s ease-in-out infinite}.spark-one{top:95px;left:28px}.spark-two{top:220px;right:27px;color:var(--pink);animation-delay:.8s}.hero{text-align:center;z-index:1}.eyebrow{font-size:11px;letter-spacing:2.3px;color:#b9b9e4;margin:5px 0 7px}.logo{font:48px/.8 Black Han Sans,sans-serif;letter-spacing:-2px;text-shadow:0 7px 0 #2d166c,0 0 28px #743cff}.logo span{font:24px Nunito,sans-serif;color:var(--pink);letter-spacing:1px;display:block;margin-bottom:7px}.logo strong{font-size:65px;background:linear-gradient(#fff 12%,#8deaff 55%,#43a3ff);-webkit-background-clip:text;color:transparent;-webkit-text-stroke:1px #fff;letter-spacing:0}.mascot{width:108px;height:92px;margin:7px auto 0;border-radius:48% 52% 44% 56%;background:linear-gradient(135deg,#8b52ff,#3e1ba5);border:3px solid #bda9ff;box-shadow:0 12px 30px #0007,0 0 28px #6b44ff66;display:grid;place-items:center;position:relative}.mascot span{font-size:56px;filter:drop-shadow(0 5px 2px #0005)}.mascot i{position:absolute;right:-5px;top:-7px;background:var(--yellow);color:#402600;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;font-style:normal}.mascot.small{margin-top:auto}.battle-copy{display:flex;flex-direction:column;margin-top:7px}.battle-copy b{font-size:18px}.battle-copy span{font-size:12px;color:#afb5df;margin-top:2px}.entry-card{z-index:1;background:linear-gradient(145deg,#fffffffa,#e9eafff4);color:var(--ink);border-radius:24px;padding:15px;box-shadow:0 16px 40px #02020eaa,0 0 0 1px #fff8;display:flex;flex-direction:column;gap:11px}.mini-league{display:flex;justify-content:space-between;align-items:center;font-size:13px}.mini-league b{background:#eee9ff;color:var(--purple);padding:5px 9px;border-radius:99px;font-size:10px}.entry-card label{display:flex;flex-direction:column;gap:5px;text-align:left}.entry-card label>span{font-size:11px;font-weight:900;color:#686481;margin-left:4px}.entry input{width:100%;background:#f6f4ff;border:2px solid #dfdcf2;border-radius:13px;padding:12px 14px;font-size:15px;color:var(--ink);outline:none}.entry input:focus{border-color:#7045ff;box-shadow:0 0 0 4px #7045ff18}.cta{border-radius:15px;background:linear-gradient(100deg,#ff3c99,#713bff 53%,#15bde9);color:#fff;padding:13px;font-weight:900;box-shadow:0 8px 22px #7a37ff66}.battle-cta{display:flex;flex-direction:column;align-items:center}.battle-cta span{font-size:18px}.battle-cta small{font-size:10px;opacity:.75;margin-top:2px}.cta:disabled{filter:grayscale(1);opacity:.45}.reward-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;z-index:1}.reward-preview div{border:1px solid #ffffff18;background:#ffffff0c;border-radius:13px;padding:7px 2px;text-align:center}.reward-preview span{font-size:20px;display:block}.reward-preview b{font-size:9px;color:#c7c9e5}.install{background:#ffffff10;border:1px dashed #47ddff;color:#7de8ff;border-radius:12px;padding:10px;font-weight:900}.ios-tip{text-align:center;color:#a5a9cd;font-size:11px}.onboarding{justify-content:center}.auth-hero{margin-bottom:4px}.auth-card,.student-card{text-align:center;padding:21px 17px}.auth-card h2,.student-card h2{font-size:22px}.auth-card>p,.student-card>p{font-size:12px;line-height:1.55;color:#716e88;word-break:keep-all}.auth-badge{align-self:center;border-radius:999px;background:#e8e2ff;color:#6841e8;padding:6px 10px;font-size:10px;font-weight:900}.kakao-login{height:52px;border-radius:15px;background:#fee500;color:#191600;font-size:16px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 8px 18px #bfae0033}.kakao-login:active,.cta:active{transform:scale(.97)}.kakao-symbol{width:23px;height:20px;border-radius:50%;background:#191600;color:transparent;position:relative}.kakao-symbol:after{content:"";position:absolute;left:3px;bottom:-3px;border:5px solid transparent;border-top-color:#191600;transform:rotate(25deg)}.form-error{color:#e9365e!important;font-size:11px!important}.student-card label>span b{color:#8c889b;font-size:9px;margin-left:5px;font-weight:800}.school-input-wrap{display:flex;align-items:stretch;background:#f6f4ff;border:2px solid #dfdcf2;border-radius:13px;overflow:hidden}.school-input-wrap:focus-within{border-color:#7045ff;box-shadow:0 0 0 4px #7045ff18}.entry .school-input-wrap input{min-width:0;flex:1;border:0;border-radius:0;background:transparent;box-shadow:none;padding-right:8px}.school-input-wrap>span{flex:0 0 auto;display:flex;align-items:center;padding:0 14px 0 12px;background:#eceaf3;border-left:1px solid #d8d5e2;color:#8b8797;font-size:13px;font-weight:900;white-space:nowrap}.key-preview{background:#17152f;color:#fff;border-radius:13px;padding:10px 12px;display:flex;flex-direction:column;gap:3px;text-align:left}.key-preview small{color:#9ea1c7;font-size:9px}.key-preview b{font-size:12px;color:#ffe15d}.player-card{display:flex;align-items:center;gap:10px;background:#f4f1ff;border:1px solid #ded7f4;border-radius:15px;padding:10px}.player-card>span{width:42px;height:42px;border-radius:13px;background:#7448ff;display:grid;place-items:center;font-size:23px}.player-card>div{display:grid;text-align:left}.player-card small{font-size:9px;color:#86819b}.player-card b{font-size:15px}.player-card em{font-size:10px;color:#6d47dd;font-style:normal}.player-card button{margin-left:auto;border-radius:999px;background:#e6e0f9;color:#6340d3;padding:7px 10px;font-size:10px;font-weight:900}.logout-link{align-self:center;background:transparent;color:#8a869a;font-size:10px;text-decoration:underline;padding:4px}.student-login{min-height:48px}.auth-divider{display:flex;align-items:center;gap:10px;color:#9994aa;font-size:10px;font-weight:900}.auth-divider:before,.auth-divider:after{content:"";height:1px;flex:1;background:#d9d6e6}.pin-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pin-grid input{text-align:center;letter-spacing:5px}.auth-card label{text-align:left}.auto-id-note{display:flex;align-items:center;gap:10px;background:#eee9ff;border:1px solid #dcd3ff;border-radius:14px;padding:11px 12px;text-align:left}.auto-id-note>span{font-size:22px}.auto-id-note>div{display:flex;flex-direction:column;gap:2px}.auto-id-note b{font-size:12px;color:#4e34b7}.auto-id-note small{font-size:9px;color:#7c7890}.issued-card{text-align:center;padding:24px 18px}.issued-card>p{font-size:12px;line-height:1.6;color:#716e88}.issued-id{background:linear-gradient(135deg,#17152f,#5532b9);border-radius:19px;padding:18px;color:#fff;display:flex;flex-direction:column;gap:3px;box-shadow:0 12px 25px #4e2fc855}.issued-id small{font-size:9px;letter-spacing:2px;color:#bcb6ed}.issued-id strong{font-size:35px;color:#ffe15d;letter-spacing:1px}.immutable-note{background:#fff5d9;border:1px solid #f2d58b;color:#7c5a11;border-radius:13px;padding:9px 11px;font-size:10px;line-height:1.5;font-weight:800}.setup-cancel{align-self:center;background:transparent;color:#858198;font-size:11px;text-decoration:underline;padding:5px}.add-student{background:#ece7ff;color:#603bd0;border:1px dashed #8d70e7;border-radius:13px;padding:10px;font-size:12px;font-weight:900}.manager-card{text-align:center;max-height:calc(100dvh - 40px)}.manager-card>p{font-size:11px;color:#77738a}.student-list{display:flex;flex-direction:column;gap:8px;overflow-y:auto}.student-row{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:stretch}.student-select{display:flex;align-items:center;gap:9px;background:#f4f1ff;color:var(--ink);border:1px solid #ded7f4;border-radius:14px;padding:9px;text-align:left}.student-select>span{font-size:23px}.student-select>div{display:flex;flex-direction:column}.student-select b{font-size:13px}.student-select small{font-size:9px;color:#79758d}.student-delete{border-radius:12px;background:#ffe8ed;color:#d73558;padding:0 10px;font-size:10px;font-weight:900}.delete-modal{width:min(100%,360px);background:#fff;color:var(--ink);border-radius:25px;padding:22px 18px;text-align:center;box-shadow:0 24px 70px #000}.delete-icon{font-size:40px}.delete-modal h2{font-size:20px;margin:5px 0 9px}.delete-modal p{font-size:11px;line-height:1.6;color:#747084}.modal-actions .delete-yes{background:#ed3e62;color:#fff}.lobby{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:26px;text-align:center}.arena-title span{font:27px Black Han Sans;display:block;color:#fff;text-shadow:0 0 20px #7558ff}.arena-title b{display:block;color:var(--cyan);letter-spacing:3px;font-size:11px;margin-top:6px}.versus-card{display:grid;grid-template-columns:1fr 55px 1fr;align-items:center}.school-side{display:flex;flex-direction:column;gap:5px;align-items:center}.school-side>span{font-size:50px;width:86px;height:86px;display:grid;place-items:center;border-radius:25px;background:linear-gradient(145deg,#7550ff,#3c218f);border:2px solid #a491ff;box-shadow:0 10px 25px #0008}.school-side.rival>span{background:linear-gradient(145deg,#00bbe9,#126a9a);border-color:#53e9ff}.school-side b{font-size:14px;max-width:130px}.school-side small{font-size:10px;color:#aeb2d5}.versus{font:30px Black Han Sans;font-style:italic;color:var(--yellow);text-shadow:0 3px 0 #9a3b00}.countdown-wrap{width:190px;height:190px;margin:auto;border-radius:50%;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle,#291968 53%,#1c1249 55%);border:8px solid #ffffff15;outline:3px solid #7e5aff;box-shadow:0 0 45px #633cff88}.countdown-wrap p,.countdown-wrap span{font-size:11px;color:#c6c8e5}.countdown-wrap strong{font:72px Black Han Sans;line-height:1;color:var(--yellow);text-shadow:0 5px 0 #a84d00}.lobby-tip{border-radius:16px;background:#ffffff0c;border:1px solid #ffffff14;padding:14px;display:flex;flex-direction:column;gap:4px}.lobby-tip b{color:var(--yellow)}.lobby-tip span{font-size:11px;color:#bec1df}.loading-dots{display:flex;justify-content:center;gap:7px}.loading-dots i{width:8px;height:8px;background:#7652ff;border-radius:50%;animation:pulse 1s infinite}.loading-dots i:nth-child(2){animation-delay:.2s}.loading-dots i:nth-child(3){animation-delay:.4s}.empty-lobby{justify-content:center}.game{display:flex;flex-direction:column;gap:12px}.game-top,.stage-meta{display:flex;justify-content:space-between;align-items:center}.round-pill{background:linear-gradient(90deg,#ff3ca7,#6a42ff);padding:7px 13px;border-radius:99px;font-size:12px;font-weight:900}.score-chip{font-size:17px;color:var(--yellow);font-weight:900}.stage-meta{color:#adb2d5;font-size:11px}.stage-meta b{color:#fff}.gauge{height:9px;background:#27264a;border-radius:99px;overflow:hidden}.gauge-fill{height:100%;background:linear-gradient(90deg,#19d8ff,#8b47ff,#ff42b0);box-shadow:0 0 12px #41ccff;transition:width .1s linear}.question-card{background:linear-gradient(145deg,#fff,#ebeaff);color:var(--ink);border-radius:23px;padding:20px 17px;text-align:center;box-shadow:0 14px 30px #0007;border:1px solid #fff;min-height:205px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.question-type{font-size:10px;letter-spacing:2px;color:#693fff;background:#eae4ff;padding:5px 9px;border-radius:99px;font-weight:900}.prompt{font-size:22px;line-height:1.3;font-weight:900;word-break:keep-all}.visual{font-size:62px;line-height:1.1;filter:drop-shadow(0 5px 3px #44357b33)}.tts{background:linear-gradient(100deg,#5e3cff,#269fe6);color:#fff;padding:10px 17px;border-radius:99px;font-size:14px;font-weight:900;box-shadow:0 6px 15px #5e3cff44}.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{min-height:72px;border-radius:17px;background:#17183b;border:2px solid #34365f;color:#fff;padding:10px;display:flex;align-items:center;gap:10px;text-align:left;transition:transform .12s,border-color .12s}.choice:active{transform:scale(.96)}.choice>span{width:32px;height:32px;flex:0 0 32px;border-radius:11px;background:#2c2d57;display:grid;place-items:center;color:#7de5ff;font-size:13px}.choice>b{font-size:18px;overflow-wrap:anywhere}.choice.picked{border-color:var(--cyan);box-shadow:0 0 18px #19d8ff55}.choice.right{border-color:var(--good);background:#0b3d35}.choice.right>span{background:var(--good);color:#052319}.choice.wrong{border-color:var(--bad);background:#481833}.choice.wrong>span{background:var(--bad)}.feedback{text-align:center;font-size:18px;font-weight:900;border-radius:14px;padding:10px}.feedback.good{color:#102619;background:var(--good)}.feedback.bad{color:#fff;background:var(--bad)}.feedback.dim{color:#bbbdd8;background:#ffffff0b}.live-note{text-align:center;color:#969abd;font-size:10px;margin-top:auto}.live-note i{display:inline-block;margin-right:6px}.tts-fallback{background:#fff3cc;color:#8b5c00;border-radius:12px;padding:10px;font-size:12px}.tts-fallback b{font-size:22px;color:#231d12}.stars{color:var(--yellow)}.result{display:flex;flex-direction:column;gap:13px;padding-bottom:32px}.result-hero{text-align:center;padding:6px 0}.result-hero>span{font-size:52px;filter:drop-shadow(0 7px 4px #0007)}.result-hero p{font-size:9px;letter-spacing:2px;color:var(--cyan)}.result-hero h2{font:36px Black Han Sans;margin-top:3px}.result-hero small{color:#afb2d3}.my-result{display:grid;grid-template-columns:repeat(3,1fr);background:#ffffff0d;border:1px solid #ffffff16;border-radius:18px;padding:13px 4px}.my-result div{display:flex;flex-direction:column;text-align:center;border-right:1px solid #ffffff16}.my-result div:last-child{border:0}.my-result span{font-size:10px;color:#a8acca}.my-result strong{font-size:20px;color:var(--yellow)}.reward-card{display:flex;align-items:center;gap:13px;background:linear-gradient(110deg,#612fff,#ff3ea8);padding:14px;border-radius:18px;box-shadow:0 8px 24px #6d36ff55}.reward-icon{font-size:35px;width:55px;height:55px;display:grid;place-items:center;background:#fff2;border:1px solid #fff3;border-radius:16px}.reward-card>div:last-child{display:flex;flex-direction:column}.reward-card small{font-size:9px;color:#ffe0f4}.reward-card b{font-size:17px}.reward-card span{font-size:10px;color:#f0def0}.ranking-card{background:#f7f6ff;color:var(--ink);border-radius:21px;padding:14px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.section-title h3{font-size:16px}.section-title span{font-size:9px;background:#e8e1ff;color:var(--purple);padding:5px 8px;border-radius:99px}.rank{list-style:none;padding:0;display:flex;flex-direction:column;gap:6px}.rank li{display:flex;align-items:center;gap:8px;padding:8px;border-radius:12px;background:#fff}.rank li.me{background:#eee8ff;border:1px solid #8c6aff}.rank-no{width:24px;font-weight:900;text-align:center}.rank-avatar{font-size:22px}.rank-name{display:flex;flex-direction:column}.rank-name b{font-size:13px}.rank-name small{font-size:9px;color:#85839b}.rank em{margin-left:auto;font-style:normal;font-weight:900;font-size:12px;color:#623eff}.wrong-box{background:#ffffff0c;border:1px solid #ffffff16;border-radius:16px;padding:13px}.wrong-box summary{font-weight:900}.wrong-item{border-top:1px solid #ffffff16;margin-top:10px;padding-top:10px;font-size:12px}.bad-text{color:#ff8398}.good-text{color:#45e7a6}.admin{display:flex;flex-direction:column;gap:12px;padding:20px}.admin-row{display:flex;gap:8px;flex-wrap:wrap}.admin-row button{background:#25274d;color:#fff;padding:10px 12px;border-radius:10px;font-weight:800}.admin-list{display:flex;flex-direction:column;gap:6px;max-height:60dvh;overflow-y:auto}.admin-list button{text-align:left;font-size:13px;padding:8px 10px;border-radius:8px}.q-on{background:#25274d;color:#fff}.q-off{background:#341c2a;color:#aaa;text-decoration:line-through}.global-sound{position:absolute;z-index:20;right:20px;top:20px;transition:.15s}.global-sound:active{transform:scale(.88)}.global-sound.on{border-color:#65eaff;box-shadow:0 0 15px #19d8ff55}.global-sound.off{opacity:.65}.sound-status-toast{position:fixed;z-index:90;left:50%;top:68px;transform:translate(-50%);width:max-content;max-width:calc(100vw - 32px);white-space:normal;text-align:center;line-height:1.45;word-break:keep-all;background:#111436ef;border:1px solid #5ee8ff66;border-radius:18px;padding:10px 16px;color:#fff;font-size:12px;font-weight:900;box-shadow:0 8px 24px #0008;animation:toast-in .25s ease-out}.modal-backdrop{position:fixed;z-index:100;top:0;right:0;bottom:0;left:0;background:#050616d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center;padding:22px}.sound-modal{width:min(100%,390px);background:linear-gradient(150deg,#fff,#ecebff);color:var(--ink);border-radius:26px;padding:24px 20px 20px;text-align:center;box-shadow:0 25px 70px #000,0 0 40px #713bff77}.sound-modal-icon{width:82px;height:82px;margin:0 auto 10px;display:grid;place-items:center;border-radius:26px;background:linear-gradient(145deg,#7747ff,#ff42aa);font-size:42px;box-shadow:0 10px 24px #7d3fff66}.modal-kicker{color:#7145ff;font-size:10px;font-weight:900;letter-spacing:2px}.sound-modal h2{font-size:25px;margin:5px 0 9px}.sound-modal>p:not(.modal-kicker){color:#686781;font-size:14px;line-height:1.55}.modal-actions{display:grid;grid-template-columns:1fr 1.3fr;gap:9px;margin-top:20px}.modal-actions button{height:50px;border-radius:14px;background:#dfdeea;color:#68677b;font-weight:900}.modal-actions .sound-yes{background:linear-gradient(100deg,#713bff,#ff3c99);color:#fff;box-shadow:0 8px 18px #713bff44}@keyframes pulse{50%{opacity:.35;transform:scale(.8)}}@keyframes float{50%{transform:translateY(-8px) rotate(15deg)}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}}.gender-field{border:0;padding:0;margin:0;text-align:left}.gender-field legend{font-size:11px;font-weight:900;margin-bottom:6px}.gender-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.gender-options button{height:64px;border:2px solid #dfdcf2;border-radius:15px;background:#f6f4ff;color:#77738b;display:flex;align-items:center;justify-content:center;gap:9px;font-size:13px;font-weight:900}.gender-options button span{font-size:30px;filter:grayscale(.65);opacity:.65}.gender-options button.selected{color:#24213d;transform:translateY(-1px)}.gender-options button.selected span{filter:none;opacity:1}.gender-options button.selected.male{border-color:#45a8ff;background:#e8f5ff;box-shadow:0 6px 16px #45a8ff2b}.gender-options button.selected.female{border-color:#ff70ad;background:#fff0f7;box-shadow:0 6px 16px #ff70ad2b}.student-avatar.male{background:linear-gradient(145deg,#5ac8ff,#3877e8)!important}.student-avatar.female{background:linear-gradient(145deg,#ff8bb9,#e84b8c)!important}.student-row{grid-template-columns:1fr auto auto}.student-enter{border-radius:12px;background:linear-gradient(135deg,#6f4cff,#4925cd);color:#fff;padding:0 12px;font-size:10px;font-weight:900;box-shadow:0 5px 12px #6f4cff35}@media(max-width:360px){.page-shell{padding:15px}.logo{font-size:42px}.logo strong{font-size:57px}.mascot{width:95px;height:80px}.entry-card{padding:12px}.choice{min-height:64px}.question-card{min-height:190px}.prompt{font-size:19px}}@media(min-height:820px){.entry{justify-content:center}.hero{margin-top:4px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}