*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{display:grid;place-items:center;background:radial-gradient(ellipse at 50% 20%,#224953,#07151e 75%);color:#ecf6e9;font:14px/1.5 system-ui,sans-serif}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.46}button:focus-visible,canvas:focus-visible{outline:3px solid #aaf6e4;outline-offset:-3px}[hidden]{display:none!important}.game{width:min(100%,474px);height:min(100dvh,980px);display:flex;flex-direction:column;background:#102a31;box-shadow:0 0 0 1px #7eaba335,0 18px 80px #0008;overflow:hidden}.hud{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px 10px;min-height:75px;background:linear-gradient(120deg,#1f3d42,#102731);border-bottom:1px solid #99b9a72b}.eyebrow{font:700 9px/1.6 monospace;letter-spacing:1.4px;color:#a9c5b9;display:block}.mission-info strong{display:block;font-size:12px;line-height:1.6;color:#f0edcd;letter-spacing:.2px}.score{text-align:right}.score strong{font:700 27px/1.2 monospace;letter-spacing:-1px;color:#ffdd98;display:block}.score .eyebrow{color:#b8c5b8}#hull{display:flex;gap:4px;margin-top:6px}#hull i{width:17px;height:4px;background:#497071}#hull i.full{background:#a4e5b2;box-shadow:0 0 7px #91fac322}.route{height:22px;flex:none;position:relative;background:#0a222c;text-align:center;font:700 8px/20px monospace;letter-spacing:1.4px;color:#b1c7bd}#progress{position:absolute;height:2px;bottom:0;left:0;background:#efc980;box-shadow:0 0 7px #e6c17599}.field{position:relative;flex:1;min-height:0;overflow:hidden;background:#173d4a}canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}#radio{pointer-events:none;position:absolute;top:58px;left:16px;right:16px;display:flex;align-items:center;gap:10px;background:#071e2bdc;border-left:2px solid #a9e5be;padding:8px 12px;box-shadow:0 5px 20px #05151d30}#radio>span{color:#b9f9d4;font-size:24px;line-height:1}#radio p{font-size:11px;color:#e0f1dc;margin:0;line-height:1.5}.message{position:absolute;bottom:17px;left:25px;right:25px;text-align:center;padding:8px;background:#092531e8;border:1px solid #e9ca8366;color:#ffe4ad;font:700 10px monospace;letter-spacing:1px;pointer-events:none}.controls{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:8px;padding:10px 12px 9px;background:linear-gradient(#153641,#102a33);border-top:1px solid #99bfb24d}.controls button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;background:linear-gradient(#36555e,#203e49);border:1px solid #8fafab66;border-radius:6px;color:#e3efda;box-shadow:inset 0 1px #ffffff17,0 3px #071b25;font-size:10px;font-weight:650;padding:5px 4px;white-space:nowrap}.controls button.primary{background:linear-gradient(#f8de9b,#ce9d58);color:#253839;border-color:#ffe6a4}.control-icon{font:24px/1 Georgia,serif}.controls button:active:not(:disabled){transform:translateY(2px);box-shadow:none}.tools{display:flex;align-items:center;justify-content:space-between;padding:0 13px 7px;gap:10px;background:#102a33}.tools button{border:0;background:transparent;color:#bfd2c6;min-height:32px;font-size:10px;padding:5px}.tools small{color:#6f9295;font:7px monospace;letter-spacing:1.5px}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:18px;background:linear-gradient(#05182218,#051c3166)}.panel{width:100%;max-width:345px;padding:25px 25px 23px;background:linear-gradient(145deg,#143841f5,#0b2430f5);border:1px solid #aec8ad77;border-top:3px solid #e8c581;box-shadow:0 20px 60px #061a27aa;position:relative}.panel:before,.panel:after{content:'';position:absolute;width:8px;height:8px;border:1px solid #e1bb72;top:10px;left:10px}.panel:after{left:auto;right:10px}.panel>.eyebrow{color:#a3d7c2;font-size:8px;text-align:center;letter-spacing:1.5px;margin-bottom:16px}.panel h1{font:700 38px/.98 Georgia,serif;letter-spacing:-1.2px;margin:0 0 15px;text-align:center;color:#ffedc5;text-wrap:balance}.panel p{font-size:12px;line-height:1.75;text-align:center;color:#c6dcd1;margin:0 0 18px}#briefing{padding:12px 0;border-block:1px solid #71938744;text-align:center;margin:0 0 16px;font:8px/1.7 monospace;letter-spacing:1px;color:#97b9ae}#briefing strong{display:block;font-size:10px;color:#f6dba5;margin:4px 0}.brief-line{width:65px;height:1px;background:#e8c58a55;margin:8px auto}.instructions{font-size:10px;line-height:1.7;color:#aac9c0;text-align:center;margin-bottom:20px}.panel button{display:block;width:100%;min-height:46px;background:linear-gradient(#f6d995,#cfaa6a);border:1px solid #f9dfa4;color:#16313b;font-weight:750;font-size:12px;border-radius:3px;box-shadow:0 4px 0 #091c27}.panel button.secondary{color:#bcd7ca;background:transparent;box-shadow:none;border:1px solid #88a99c44;margin-top:12px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}[data-embed=true] .game{max-width:none;width:100%;height:100dvh;box-shadow:none}[data-embed=true] .tools{display:none}[data-embed=true] .controls{padding-bottom:max(10px,env(safe-area-inset-bottom))}@media(max-height:720px){.hud{min-height:61px;padding:8px 14px}.mission-info strong{font-size:11px}.score strong{font-size:24px}.controls{padding:7px 10px}.controls button{min-height:44px}.panel{padding:18px}.panel h1{font-size:31px}.panel p{margin-bottom:12px}#briefing{padding:7px 0;margin-bottom:10px}.instructions{margin-bottom:13px;font-size:9px}#radio{top:51px}.tools{padding-bottom:2px}}@media(max-height:560px){#briefing{display:none}.panel h1{font-size:26px}.panel p{font-size:10px;line-height:1.4;margin:0 0 9px}.panel>.eyebrow{margin-bottom:8px}.panel{padding:14px}.instructions{line-height:1.4;margin-bottom:10px}.overlay{padding:10px}.hud{min-height:52px}.route{height:17px;line-height:15px}.tools{padding-bottom:2px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
@media(max-height:560px) and (min-aspect-ratio:1/1){
  .game{position:relative;display:grid;grid-template-columns:minmax(120px,1fr) min(53vw,58dvh) minmax(125px,1fr);grid-template-rows:1fr 38px;width:100%;max-width:920px;height:100dvh}
  .field{grid-column:2;grid-row:1/3;height:100%;min-height:0}
  .hud{grid-column:1;grid-row:1;align-self:start;flex-direction:column;align-items:flex-start;padding:20px 16px;gap:16px;background:transparent;border:0}
  .mission-info strong{font-size:12px}.score{text-align:left}.score strong{font-size:28px}
  .route{position:absolute;left:16px;top:165px;width:calc((100% - 58dvh)/2 - 32px);height:auto;min-height:24px;line-height:1.8;text-align:left;padding:5px 0;letter-spacing:.5px;font-size:8px;background:transparent}
  .controls{grid-column:3;grid-row:1/3;display:flex;flex-direction:column;justify-content:center;padding:16px 12px;gap:14px;border:0;background:transparent}
  .controls button{width:100%;min-height:52px;font-size:11px}.tools{grid-column:1;grid-row:2;display:flex;padding:0 10px 5px}.tools small{display:none}.tools button{min-height:32px;font-size:11px}
  .overlay{padding:9px}.panel{padding:15px 12px}.panel h1{font-size:25px}.panel>.eyebrow{font-size:7px;letter-spacing:.5px}.panel p{font-size:10px}.instructions{font-size:9px}.panel button{font-size:11px;min-height:40px}
  [data-embed=true] .tools{display:none}[data-embed=true] .game{max-width:none}
}
