@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--cyan:#62e9ff;--pink:#ff609f;--lime:#caff75;--line:#29395c;--ink:#edf7ff;--muted:#a5b8d0}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(circle at 75% 0,#273f7b,transparent 31%),#070b1a;color:var(--ink);font-family:'Space Grotesk',sans-serif}.app{width:min(720px,100%);margin:auto;padding:max(14px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}header{display:flex;justify-content:space-between;align-items:center;padding:3px 3px 13px}.logo{display:grid;gap:2px}.logo b{letter-spacing:.12em;font-size:17px}.logo b::first-letter{color:var(--cyan)}small{font:10px 'DM Mono',monospace;letter-spacing:.06em;color:var(--muted)}button{font-family:inherit;cursor:pointer}.sound{width:43px;height:43px;border:1px solid #58d5ed;background:#102647;border-radius:50%;font-size:19px}.hud{display:grid;grid-template-columns:repeat(5,1fr);background:#101a33;border:1px solid var(--line);border-radius:12px 12px 0 0;overflow:hidden}.hud div{padding:9px 6px;text-align:center;border-right:1px solid var(--line)}.hud div:last-child{border:0}.hud small{display:block;font-size:8px}.hud b{font:15px 'DM Mono',monospace;color:var(--cyan)}.game{border:1px solid var(--line);border-top:0;background:linear-gradient(145deg,#14244b,#0a1127);overflow:hidden}.mission{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 13px;border-bottom:1px solid var(--line)}.mission p{margin:0;font-size:13px}.repeat{padding:9px 10px;white-space:nowrap;border:1px solid #4cc7dd;border-radius:7px;background:#173459;color:var(--cyan);font-size:12px;font-weight:700}.sky{height:185px;position:relative;overflow:hidden;background-image:radial-gradient(#fff 1px,transparent 1px),radial-gradient(#60e6fc 1px,transparent 1px);background-size:47px 47px,69px 69px;background-position:0 0,15px 21px}.alien{position:absolute;width:39px;height:24px;border:3px solid var(--pink);border-radius:12px 12px 4px 4px;box-shadow:0 0 13px #ff609f;animation:float 3s ease-in-out infinite}.alien:after{content:'••';position:absolute;top:0;left:8px;color:var(--pink);letter-spacing:6px}.a1{left:10%;top:26px}.a2{left:34%;top:53px;animation-delay:-1s}.a3{right:29%;top:24px;animation-delay:-2s}.a4{right:7%;top:61px;animation-delay:-.5s}.ship{position:absolute;bottom:20px;left:calc(50% - 29px);height:28px;width:58px;border:3px solid var(--cyan);border-radius:30px 30px 8px 8px;box-shadow:0 0 15px var(--cyan)}.ship:after{content:'';position:absolute;width:16px;height:9px;border:2px solid var(--lime);border-bottom:0;border-radius:10px 10px 0 0;left:18px;top:-11px}.beam{position:absolute;bottom:48px;width:3px;height:41px;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:shoot 1.5s linear infinite}.b1{left:46%}.b2{left:56%;animation-delay:-.75s}.choices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 10px 7px;background:#080e20a8}.choice{min-height:64px;border:1px solid #3a4e7b;border-radius:9px;background:#19284e;color:var(--ink);font-size:clamp(17px,5vw,23px);font-weight:700}.choice:active{transform:scale(.96)}.choice.correct{background:#28523b;border-color:var(--lime);color:var(--lime)}.choice.wrong{background:#5a2440;border-color:var(--pink);color:#ffc5dd}.choice:disabled{cursor:default}.feedback{min-height:39px;margin:0;padding:7px 10px 13px;text-align:center;color:var(--muted);font-size:12px}.feedback.good{color:var(--lime)}.feedback.bad{color:#ff9dc1}.hint{text-align:center;color:var(--muted);font-size:11px;margin:13px 5px}.panel{position:fixed;z-index:5;inset:0;display:grid;place-items:center;padding:20px;background:#030614a8;backdrop-filter:blur(5px)}.panel.hide{display:none}.panel>div{width:min(430px,100%);padding:34px 25px;text-align:center;background:linear-gradient(145deg,#172955,#0a1028);border:1px solid #42629a;border-radius:15px;box-shadow:0 20px 60px #000}.eyebrow{color:var(--cyan);font:11px 'DM Mono',monospace;letter-spacing:.15em}.panel h1{font-size:clamp(28px,9vw,37px);line-height:1;margin:12px 0}.panel p:not(.eyebrow){color:#c2d2e5;line-height:1.5;font-size:15px}.start{margin:11px 0 13px;padding:13px 18px;border:0;border-radius:8px;background:var(--lime);color:#12210d;font-weight:700;font-size:15px}.start span{font-size:20px;margin-left:7px}@keyframes float{50%{transform:translateY(9px) translateX(4px)}}@keyframes shoot{0%{opacity:0;transform:translateY(10px)}15%,80%{opacity:1}100%{opacity:0;transform:translateY(-135px)}}@media(min-width:600px){.app{padding-top:30px}.sky{height:210px}.choices{padding:16px 18px 9px}.mission{padding:11px 18px}.choice{min-height:69px}}@media(max-width:365px){.hud b{font-size:13px}.hud div{padding-inline:3px}.logo b{font-size:15px}.sky{height:164px}.choice{min-height:57px}}