:root{color:#eaf8ff;background:#070817;font-family:Inter,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,Hiragino Sans,Yu Gothic,sans-serif;font-synthesis:none;line-height:1.5;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;min-height:100%}body{margin:0;min-height:100vh;overflow-x:hidden}body:before,body:after{content:"";top:0;right:0;bottom:0;left:0;pointer-events:none;position:fixed;z-index:-2}body:before{background:linear-gradient(110deg,#04081cfa,#120b30f5 48%,#07162dfa),radial-gradient(circle at 50% 45%,rgba(0,255,255,.12),transparent 38%)}body:after{background:repeating-linear-gradient(to bottom,rgba(150,244,255,.08) 0,rgba(150,244,255,.08) 1px,transparent 1px,transparent 7px),linear-gradient(90deg,rgba(0,255,255,.1),transparent 18%,transparent 82%,rgba(255,67,236,.1));opacity:.48;z-index:-1}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}.screen{align-content:center;display:grid;gap:24px;margin:0 auto;max-width:1220px;min-height:100vh;padding:42px 30px;position:relative}.screen:before,.screen:after{border-block:1px solid rgba(0,229,255,.22);content:"";height:72%;pointer-events:none;position:fixed;top:14%;width:118px}.screen:before{background:linear-gradient(135deg,transparent 18%,rgba(0,229,255,.16) 19%,transparent 20%),linear-gradient(45deg,transparent 32%,rgba(255,68,238,.13) 33%,transparent 34%);border-left:1px solid rgba(0,229,255,.34);left:0}.screen:after{background:linear-gradient(225deg,transparent 18%,rgba(0,229,255,.16) 19%,transparent 20%),linear-gradient(315deg,transparent 32%,rgba(255,68,238,.13) 33%,transparent 34%);border-right:1px solid rgba(255,68,238,.34);right:0}.start-screen{grid-template-columns:minmax(0,1.05fr) minmax(370px,.95fr)}.hero-panel,.settings-panel,.quiz-panel,.result-panel,.console-panel,.status-bar>div,.result-item{background:linear-gradient(180deg,#09132be0,#080a1ce6);border:1px solid rgba(0,229,255,.34);box-shadow:inset 0 0 22px #00e5ff14,0 0 34px #00e5ff1a}.hero-panel{border:0;box-shadow:none;padding:22px 0}.boot-panel{align-self:center}.eyebrow{color:#35f2ff;font-size:.86rem;font-weight:900;margin:0 0 14px;text-shadow:0 0 14px rgba(53,242,255,.72);text-transform:uppercase}h1{line-height:1.04;margin:0}.hero-panel h1{color:#f8fdff;font-size:5.2rem;font-weight:950;max-width:780px;text-shadow:0 0 12px rgba(0,229,255,.85),0 0 42px rgba(255,68,238,.42)}.lead{color:#c3d9e8;font-size:1.08rem;font-weight:800;margin:24px 0 0;max-width:640px}.press-start{animation:pulseText 1.4s ease-in-out infinite;color:#fff2a8;font-size:1.25rem;font-weight:950;margin:34px 0 0;text-shadow:0 0 16px rgba(255,242,168,.72)}.settings-panel,.quiz-panel,.result-panel,.console-panel{border-radius:8px;padding:26px;position:relative}.command-panel:before,.arena-panel:before,.console-panel:before,.result-panel:before{border-left:18px solid #35f2ff;border-top:18px solid transparent;content:"";height:0;left:-1px;position:absolute;top:-1px;width:0}.panel-header,.arena-topline{color:#8fefff;display:flex;font-size:.78rem;font-weight:900;justify-content:space-between;margin-bottom:20px}.setting-group{display:grid;gap:10px;margin-bottom:22px}.setting-label{color:#9fb7ca;font-size:.82rem;font-weight:900;text-transform:uppercase}.segmented-grid{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.segmented-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.choice-button,.secondary-button,.primary-button,.sound-toggle{align-items:center;background:#09122adb;border:1px solid rgba(118,235,255,.48);border-radius:8px;color:#eaf8ff;display:inline-flex;font-weight:950;justify-content:center;min-height:46px;padding:10px 14px;text-transform:uppercase;transition:background .16s ease,border .16s ease,box-shadow .16s ease,color .16s ease,transform .16s ease}.choice-button:hover,.choice-button.active,.sound-toggle:hover,.sound-toggle.active{background:#00e5ff29;border-color:#35f2ff;box-shadow:0 0 14px #00e5ff61,inset 0 0 16px #00e5ff1f;color:#fff}.select-row{display:grid;gap:10px}select,input{background:#040b1ceb;border:1px solid rgba(118,235,255,.46);border-radius:8px;color:#eefcff;min-height:50px;outline:none;padding:10px 14px;width:100%}select:focus,input:focus{border-color:#35f2ff;box-shadow:0 0 0 4px #35f2ff29}.primary-button{background:linear-gradient(180deg,#00e5ff40,#0081ff29);border-color:#35f2ff;box-shadow:0 0 18px #00e5ff42;color:#fff}.primary-button:hover{box-shadow:0 0 28px #00e5ff85,inset 0 0 18px #ffffff17;transform:translateY(-1px)}.secondary-button{border-color:#ff44ee8c;color:#ffd8fb}.secondary-button:hover{box-shadow:0 0 18px #ff44ee57;transform:translateY(-1px)}.start-button{font-size:1.05rem;margin-top:24px;min-height:56px;width:100%}.audio-control-grid{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:20px}.language-switch{display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.audio-control-grid .language-switch,.result-audio .language-switch{grid-column:1 / -1}.question-stock{bottom:18px;color:#91aabf;font-size:.9rem;left:50%;margin:0;position:fixed;text-shadow:0 0 10px rgba(0,229,255,.35);transform:translate(-50%)}.battle-screen.clear{animation:clearFlash .52s ease-out}.battle-screen.miss{animation:screenShake .36s ease-out}.hud-bar{grid-template-columns:repeat(5,minmax(0,1fr))}.status-bar{display:grid;gap:12px}.status-bar>div,.result-item{border-radius:8px;padding:15px}.status-label,.result-item span{color:#8aa2b6;display:block;font-size:.76rem;font-weight:950;margin-bottom:6px;text-transform:uppercase}.status-bar strong,.result-item strong{color:#f8fdff;font-size:1.42rem;text-shadow:0 0 12px rgba(0,229,255,.42)}.arena-panel{display:grid;gap:18px;min-height:270px;place-items:center;text-align:center}.arena-panel.clear{animation:cardBounce .52s ease-out;border-color:#dffcff}.arena-panel.miss{border-color:#ff5277}.arena-panel h1{color:#fff;font-size:2.45rem;max-width:880px;text-shadow:0 0 18px rgba(0,229,255,.38)}.arena-topline{align-self:start;width:100%}.battle-callout{color:#fff2a8;font-size:1.15rem;font-weight:950;min-height:34px;text-shadow:0 0 14px rgba(255,242,168,.42)}.battle-callout.clear{animation:calloutPop .52s ease-out;color:#fff;font-size:2.1rem;text-shadow:0 0 14px rgba(0,229,255,.92),0 0 34px rgba(255,255,255,.52)}.battle-callout.miss{animation:missBlink .52s ease-out;color:#ff6f8e;font-size:1.75rem;text-shadow:0 0 18px rgba(255,82,119,.72)}.hint{color:#9fb7ca;margin:0}.console-panel{display:grid;gap:18px;justify-items:stretch}.answer-form label{color:#8fefff;font-size:.85rem;font-weight:950;text-transform:uppercase}.typing-display{align-items:center;background:linear-gradient(90deg,#00e5ff14,#ff44ee0d),#020816e6;border:1px solid rgba(0,229,255,.36);border-radius:8px;display:flex;flex-wrap:nowrap;gap:clamp(6px,1.2vw,16px);justify-content:center;min-height:clamp(150px,24vh,280px);overflow:hidden;padding:clamp(20px,4vw,44px);position:relative;text-align:center;white-space:nowrap}.typing-display.error{animation:inputJolt .26s ease-out;border-color:#ff5277;box-shadow:0 0 18px #ff527757}.typing-display.complete{border-color:#dffcff;box-shadow:0 0 28px #00e5ff94,0 0 68px #ffffff38,inset 0 0 26px #d5ffff2e}.typing-guide{color:#eaf8ff59;font-size:clamp(2.1rem,7vw,5.6rem);font-weight:950;letter-spacing:.08em}.typed-char{animation:charPop .13s ease-out both;border-bottom:clamp(3px,.45vw,7px) solid currentColor;display:inline-flex;flex:0 1 auto;font-size:clamp(48px,8vw,118px);font-weight:950;line-height:1;min-width:.46em;padding:4px .03em 10px;transform-origin:center bottom}.typed-char.valid{color:#4bf7ff;text-shadow:0 0 14px rgba(75,247,255,.92),0 0 34px rgba(75,247,255,.44)}.typed-char.invalid{animation:charPop .15s ease-out both,missBlink .44s ease-out;color:#ff5f83;text-shadow:0 0 14px rgba(255,95,131,.82)}.typing-display.mid .typed-char{font-size:clamp(36px,5.6vw,76px);min-width:.34em}.typing-display.compact{gap:clamp(3px,.7vw,8px);padding-inline:clamp(14px,3vw,32px)}.typing-display.compact .typed-char{font-size:clamp(26px,4.6vw,64px);min-width:.28em;padding-inline:0}.answer-input{height:1px;left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;width:1px}.button-row{display:grid;gap:10px;grid-template-columns:minmax(180px,240px);justify-content:center}.floating-audio-controls{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.floating-audio-controls .sound-toggle{min-height:38px;min-width:104px}.floating-audio-controls .language-switch{min-width:220px}.result-screen{justify-items:center}.result-panel{max-width:900px;overflow:hidden;text-align:center;width:100%}.result-panel h1{color:#fff;font-size:2.1rem;text-shadow:0 0 18px rgba(0,229,255,.46)}.rank-display{animation:rankReveal .68s ease-out both;color:#fff;font-size:7rem;font-weight:950;line-height:1;margin:20px 0;text-shadow:0 0 16px rgba(0,229,255,.92),0 0 52px rgba(255,68,238,.46)}.rank-sss .rank-display,.rank-ss .rank-display{text-shadow:0 0 18px rgba(255,255,255,.98),0 0 48px rgba(0,229,255,.85),0 0 78px rgba(255,68,238,.58)}.rank-a .rank-display,.rank-b .rank-display,.rank-c .rank-display{color:#fff2a8}.result-grid{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:26px}.result-actions{margin-top:24px}.result-audio{margin-inline:auto;max-width:420px}@keyframes pulseText{0%,to{opacity:.45}50%{opacity:1}}@keyframes clearFlash{0%{box-shadow:inset 0 0 #fff0}20%{box-shadow:inset 0 0 160px #d5ffff6b}to{box-shadow:inset 0 0 #fff0}}@keyframes screenShake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(7px)}60%{transform:translate(-5px)}80%{transform:translate(4px)}}@keyframes cardBounce{0%,to{transform:translateY(0) scale(1)}45%{transform:translateY(-10px) scale(1.012)}}@keyframes calloutPop{0%{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}@keyframes missBlink{0%,to{opacity:1}45%{opacity:.38}}@keyframes inputJolt{0%,to{transform:translate(0)}35%{transform:translate(-5px)}70%{transform:translate(4px)}}@keyframes charPop{0%{opacity:0;transform:translateY(8px) scale(.82)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes rankReveal{0%{opacity:0;transform:translateY(18px) scale(.82)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 980px){.screen{padding:32px 18px}.screen:before,.screen:after{width:48px}.start-screen{grid-template-columns:1fr}.hero-panel h1{font-size:3.5rem}.hud-bar,.result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 620px){.segmented-grid,.segmented-grid.four,.button-row,.audio-control-grid,.hud-bar,.result-grid{grid-template-columns:1fr}.hero-panel h1{font-size:2.55rem}.arena-panel h1{font-size:1.65rem}.rank-display{font-size:4.5rem}.question-stock{display:none}}