:root{color-scheme:dark;font:15px/1.65 system-ui,sans-serif;background:#070a14;color:#f1f7ff}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 3%,#233963,#070a14 58%)}a{color:#9cece8;text-decoration:none}a:focus-visible,button:focus-visible,canvas:focus-visible{outline:2px solid #a7fff5;outline-offset:3px}header{max-width:1400px;padding:20px 4%;margin:auto;display:flex;gap:15px;align-items:center;justify-content:space-between;border-bottom:1px solid #33485f;font:11px monospace;letter-spacing:.09em}header strong{font-size:16px;letter-spacing:.2em}header span{color:#8dabc2}main{max-width:1400px;margin:auto;padding:0 4%}.hero{padding:65px 0 45px}.eyebrow{font:700 11px monospace;letter-spacing:.18em;color:#89efdc}.hero h1,.grader h2{font-size:clamp(39px,6.4vw,86px);line-height:1.02;letter-spacing:-.07em;margin:20px 0}.hero em,.grader em{font-style:normal;color:#9bbcd9}.hero p:not(.eyebrow),.grader>p:not(.eyebrow){max-width:800px;color:#9ab4cb}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.chips span{border:1px solid #456079;border-radius:4px;padding:6px 12px;font:10px monospace;color:#b3d8e3}.game-wrap{background:#0b1726;border:1px solid #3a5a75;border-radius:13px;overflow:hidden;box-shadow:0 30px 90px #0009}.game-top{padding:15px 22px;display:flex;align-items:center;justify-content:space-between}.game-top small{color:#82b3c7;letter-spacing:.13em}.game-top h2{margin:0;line-height:1.3}.game-top>span{color:#9bffda;font:12px monospace}.viewport{position:relative;background:#050914}.viewport canvas{display:block;width:100%;aspect-ratio:16/9;touch-action:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#060b17ab}.overlay[hidden]{display:none}.overlay-panel{text-align:center;max-width:500px;padding:26px 22px;background:#0d1c31e8;border:1px solid #537b95;border-radius:12px;box-shadow:0 20px 60px #000a}.overlay h2{font-size:clamp(24px,3vw,44px);line-height:1.12;margin:12px 0}.overlay p{color:#b4ccdb}.overlay button,.grader-footer button{background:#a6f1e1;color:#05141e;border:0;border-radius:5px;padding:13px 23px;font-weight:800;cursor:pointer}.hud{display:grid;grid-template-columns:repeat(5,1fr);background:#122339}.hud div{padding:14px 18px;border-right:1px solid #29455f}.hud small,.grader-footer small{display:block;font:10px monospace;letter-spacing:.12em;color:#8aabc1}.hud strong{font-size:20px;letter-spacing:-.02em}.controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px}.controls button{min-width:112px;border:1px solid #6089a7;border-radius:8px;background:#1c3852;color:#c5faff;padding:13px;font-weight:800;touch-action:none}.controls button:active{background:#337c91}.controls p{font-size:12px;text-align:center;color:#91aec3}.grader{padding:110px 0 70px}.grader h2{font-size:clamp(35px,5.5vw,70px)}.levels{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:32px 0}.level{min-height:145px;padding:19px 14px;background:#0f2133;border:1px solid #304d67;border-radius:9px}.level.passed{border-color:#77f2d0;background:#15403955}.level .symbol{font-size:24px;display:block;margin-bottom:8px;color:#9bbbd6}.level.passed .symbol{color:#88f5d5}.level b{display:block;font-size:13px}.level small{display:block;color:#9badc2;font-size:11px;line-height:1.45;margin-top:6px}.grader-footer{border:1px solid #3b6176;padding:25px;border-radius:9px;display:flex;align-items:center;justify-content:space-between;gap:20px}.grader-footer strong{font-size:23px}.grader-footer p{font-size:12px;color:#a3bacb}.roadmap{margin-top:30px;border-top:1px solid #344b62;padding-top:22px;color:#b8cee0}.roadmap h3{color:#f1f8ff}.note{font-size:12px;color:#8a9fb2}footer{border-top:1px solid #29435d;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:35px 0;font:11px monospace}@media(max-width:850px){.levels{grid-template-columns:repeat(3,1fr)}}@media(max-width:550px){header{flex-wrap:wrap}header strong{order:-1;width:100%}.hero{padding-top:40px}.levels{grid-template-columns:repeat(2,1fr)}.hud{grid-template-columns:repeat(3,1fr)}.hud div{padding:9px}.hud strong{font-size:16px}.controls p{display:none}.controls button{width:44%}.grader-footer{display:block}.grader-footer button{margin-top:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}