*{box-sizing:border-box}body{margin:0;background:#07111d;color:#edf5fc;font-family:system-ui,sans-serif}button,input{touch-action:manipulation}button{cursor:pointer;border:1px solid #526579;border-radius:9px;background:#233447;color:#edf5fc;min-height:44px;padding:10px 16px;font-weight:750}button:hover{background:#374f66}button:focus-visible{outline:3px solid #5fe6ff}button:disabled{opacity:.5;cursor:default}[hidden]{display:none!important}#game{max-width:1440px;margin:auto;border:1px solid #394a60;border-radius:14px;overflow:hidden;background:#101c2a}header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;gap:12px;background:linear-gradient(120deg,#14273a,#101827)}small{font-size:10px;letter-spacing:2px;color:#e5c375}h1{font-size:25px;margin:7px 0 0;letter-spacing:1px}h1 em{font-style:normal;color:#edc66d}.tools{display:flex;gap:8px}.hud{display:grid;grid-template-columns:repeat(5,1fr);background:#1b2c3e;text-align:center;padding:12px;font-size:10px;letter-spacing:1px}.hud strong{display:block;font-size:21px;margin-top:3px;font-variant-numeric:tabular-nums;color:#f4d285}#viewport{position:relative;background:#030812;isolation:isolate}#stage{height:clamp(360px,46vw,650px)}#stage canvas{display:block;width:100%;height:100%;touch-action:none}#objective{position:absolute;left:18px;top:18px;max-width:410px;padding:13px 18px;border:1px solid #63829f;background:#08131de0;border-radius:10px;pointer-events:none}#objective strong{display:block;font-size:17px;margin:6px 0}#objective span{color:#8cd9ef;font-size:12px}#alert{position:absolute;top:115px;left:50%;transform:translateX(-50%);text-align:center;max-width:85%;background:#19283ee8;border:1px solid #eac46b;border-radius:20px;padding:9px 17px;font-size:13px;color:#ffe2a1;pointer-events:none}#alert:empty{display:none}#overlay{position:absolute;inset:0;display:grid;place-items:center;background:#061020e8;overflow:auto}#overlay:empty{display:none}.intro{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center;max-width:1050px;padding:24px}.intro img{width:100%;border-radius:12px;box-shadow:0 15px 60px #0008}.intro h2,.result h2{font:800 32px Georgia,serif;color:#ffe0a0;margin:12px 0}.intro p,.result p{line-height:1.6;color:#c9d9e8;font-size:14px}.intro button,.result button{background:#e8c16c;color:#102033;border:0;margin:5px 4px 0 0}.result{max-width:570px;text-align:center;padding:26px;border:1px solid #718499;background:#162739;border-radius:16px}.big{font-size:40px!important;color:#f3ce7c!important;font-weight:850}.controls{display:flex;gap:8px;padding:12px;justify-content:center}.controls button{flex:1;max-width:230px}.controls .thrust{background:#ddb968;color:#14283a}.controls button.active{background:#6dd6e9;color:#0b2330}footer{padding:0 18px 14px;text-align:center;color:#9eafbf;font-size:11px}.audio{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}.audio button{font-size:12px;min-height:36px;padding:7px 12px}.audio label{display:flex;align-items:center;gap:8px}.audio input{width:95px;accent-color:#edc66d}.hint{max-width:850px;margin:14px auto 0;line-height:1.6}#cockpit{position:absolute;inset:0;pointer-events:none;overflow:hidden;border:12px solid #152537;border-bottom:0;background:linear-gradient(180deg,#30657a12,transparent 50%)}.beam{position:absolute;top:-15%;height:105%;width:4%;background:linear-gradient(90deg,#0b1421,#34465a,#111e2d);box-shadow:4px 0 10px #0005}.beam-l{left:15%;transform:rotate(-17deg)}.beam-r{right:15%;transform:rotate(17deg)}.reticle{position:absolute;top:40%;left:50%;color:#9ef4e0;font:40px monospace;transform:translate(-50%,-50%);text-shadow:0 0 12px #66cda7}.dash{position:absolute;bottom:0;left:0;right:0;padding:17px 8%;display:flex;gap:15px;justify-content:space-between;align-items:center;background:linear-gradient(#28394b,#081522);border-top:4px solid #81929b;border-radius:45% 45% 0 0 / 25% 25% 0 0;box-shadow:0 -12px 35px #0005}.dash>div{width:25%;text-align:center}.dash strong{display:block;font:700 24px monospace;color:#87f0d0;margin:7px}.dash span{font:10px monospace;color:#aac8cd}.dash canvas{width:38%;height:100px;max-width:260px;border:2px solid #344b5b;background:#081a24}.pilot-label{position:absolute;top:9px;right:20px;letter-spacing:2px;color:#aab9c9;font-size:9px}.glass-lines{position:absolute;inset:15% 22% 30%;border:1px solid #8cfbd718;clip-path:polygon(0 0,25% 0,25% 2%,2% 2%,2% 25%,0 25%,0 0,100% 0,100% 25%,98% 25%,98% 2%,75% 2%,75% 0)}@media(max-width:650px){header{padding:13px;display:block}h1{font-size:20px}.tools{margin-top:13px}.tools button{flex:1;padding:8px;font-size:12px}.hud{padding:10px 4px;font-size:8px}.hud strong{font-size:15px}#stage{height:430px}#objective{left:10px;top:10px;max-width:80%;padding:9px 12px}#objective strong{font-size:14px}#alert{top:110px;width:80%;font-size:11px}.intro{grid-template-columns:1fr;gap:8px;padding:14px}.intro img{max-height:160px;object-fit:cover}.intro h2{font-size:23px;margin:8px 0}.intro p{font-size:12px;margin:6px 0}.controls{gap:5px;padding:8px;flex-wrap:wrap}.controls button{padding:10px 6px;font-size:10px;flex:1 1 25%;max-width:none}#action{flex-basis:45%}.result{margin:12px;padding:18px}.dash{padding:16px 8px;gap:4px}.dash strong{font-size:16px}.dash small{font-size:7px;letter-spacing:1px}.dash span{font-size:7px}.dash canvas{height:85px}.beam-l{left:8%}.beam-r{right:8%}}
@media(max-width:650px){#viewport:has(.intro) #stage{display:none}#viewport:has(.intro) #cockpit{display:none!important}#viewport:has(.intro) #overlay{position:relative;overflow:visible}#viewport:has(.intro) #objective,#viewport:has(.intro) #alert{display:none}.intro img{max-height:125px}.intro h2{font-size:22px}.intro p{font-size:11px;line-height:1.45}.intro{padding:13px;gap:6px}}

#view{background:#112b40;color:#f5e2aa;border:1px solid #56717d;border-radius:8px;padding:10px;font:inherit;max-width:100%;}.controls{flex-wrap:wrap}.controls button{flex:1 1 120px}

.camera-shortcuts{display:flex;gap:6px;justify-content:center;padding:8px 12px 0}.camera-shortcuts button{font-size:11px;min-height:36px;padding:7px 12px}.tools{flex-wrap:wrap}@media(max-width:650px){.camera-shortcuts button{font-size:9px;flex:1;padding:6px 3px}.controls button{flex:1 1 28%}}