:root{font-family:"Segoe UI","Microsoft YaHei",sans-serif;color:#f5f6ec;font-synthesis:none;--cream:#fff9e9;--gold:#e7c283;--border:#e9f4e426}
*{box-sizing:border-box}
body{margin:0;overflow:hidden;background:#48aee2}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer;border:0;transition:background .2s,color .2s}
button:focus-visible,a:focus-visible{outline:2px solid #f5d090;outline-offset:4px}
button:disabled{cursor:default;opacity:.5}
[hidden]{display:none!important}
svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#game,#scene{width:100%;height:100dvh;position:absolute;inset:0}
#scene{display:block;touch-action:none;outline:none}
.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#226a9218,transparent 36%)}
.topbar{position:absolute;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:25px 30px;pointer-events:none}
.topbar>*{pointer-events:auto}
.brand{display:flex;gap:11px;align-items:center;color:var(--cream);text-decoration:none;text-shadow:0 1px 8px #084f6570}
.brand-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--border);border-radius:10px;background:#15566726}
.brand-icon svg{width:26px;height:26px;stroke:none;transform:rotate(-25deg)}
.brand b{font-size:17px;font-weight:500;letter-spacing:2px}
.brand small{display:block;font-size:8px;letter-spacing:2px;margin-top:5px;opacity:.55}
body.flying .brand-icon{width:30px;height:30px;border:0;background:transparent}
body.flying .brand-icon svg{width:24px;height:24px}
body.flying .brand b{font-size:14px;letter-spacing:2px}
body.flying .brand small{display:none}
.tools{display:flex;gap:7px}
.icon-button{display:grid;place-items:center;width:32px;height:32px;border:1px solid #e9f4e41f;border-radius:50%;background:#16566b59;backdrop-filter:blur(8px);color:#e9f3e4c9}
.icon-button:hover{background:#1a5b70aa;color:#fff9e9}
.icon-button svg{width:16px;height:16px}
body:not(.flying) #pause-button{display:none}
.intro{position:absolute;left:6%;top:49%;transform:translateY(-50%);width:365px;transition:opacity .4s,transform .4s;text-shadow:0 2px 14px #073a4066}
.intro.leaving{opacity:0;transform:translate(-15px,-50%);pointer-events:none}
h1{font-size:38px;font-weight:400;line-height:1.5;letter-spacing:1px;margin:0 0 15px;white-space:nowrap}
h1 span{color:#efd5a3}
.intro>p{font-size:12px;letter-spacing:.7px;color:#e0efdfbf;line-height:1.8;margin:0 0 23px}
.flight-options{display:flex;gap:0;border:1px solid #e9f4e430;border-radius:7px;overflow:hidden;width:315px;margin-bottom:18px;background:#14536866;backdrop-filter:blur(10px)}
.mode-button{flex:1;background:transparent;font-size:11px;letter-spacing:.7px;padding:12px 5px;color:#dbe9dbad}
.mode-button.selected{background:#f0deb222;color:#ffe5b4}
.mode-button:hover{background:#f0deb218}
.primary-button{display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:210px;background:var(--cream);color:#245663;padding:14px 19px;border-radius:7px;font-size:12px;font-weight:500;letter-spacing:1px}
.primary-button:hover{background:#f5deb4}
.intro>.primary-button{width:315px}
.context-dock{position:absolute;left:30px;bottom:27px;display:flex;align-items:center;gap:20px;max-width:calc(100vw - 320px);padding:8px 8px 8px 16px;border:1px solid var(--border);border-radius:9px;background:#145368b3;backdrop-filter:blur(12px)}
.context-dock>span{font-size:11px;color:#e4eed8d9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.context-dock>button{flex-shrink:0;padding:10px 16px;border-radius:6px;background:#fff9e9;color:#245663;font-size:11px;letter-spacing:.7px}
.context-dock>button:hover{background:#f5deb4}
body.paused .context-dock,body.paused .map-controls{visibility:hidden}
.map-panel{position:absolute;right:30px;bottom:76px;width:210px;border:1px solid #e9f4e426;border-radius:10px;background:#104d629c;backdrop-filter:blur(12px);overflow:hidden}
.map-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px 0;font-size:10px;color:#ecedcfbd;letter-spacing:.5px}
.map-north{font-size:9px;color:#dfecd18c}
.map-heading #map-objective{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map-view{padding:2px 4px;border-radius:3px;background:#d9e8d510;color:#ecedcfbd;font-size:9px;white-space:nowrap}
.map-view:hover{background:#d9e8d525;color:#fff5dd}
#minimap{display:block;width:100%;height:124px;margin:3px 0 5px}
.map-controls{display:flex;border-top:1px solid #e9f4e41a}
.map-controls>button{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;padding:9px 7px;background:transparent;font-size:9px;color:#d9e8d5a6;letter-spacing:.4px}
.map-controls>button+button{border-left:1px solid #e9f4e416}
.map-controls>button:hover{background:#d9e8d514;color:#fff5dd}
.map-controls>button[aria-pressed="true"]{color:#f6d79e;background:#e4d19b0c}
kbd{display:inline-grid;place-items:center;min-width:20px;height:22px;padding:2px 5px;font-family:inherit;font-size:10px;border:1px solid #dcebd532;border-radius:4px;color:#e7eede}
.map-controls kbd{font-family:Consolas,monospace;font-size:8px;min-width:15px;height:16px;padding:1px 3px;opacity:.6}
.flight-instruments{position:absolute;right:30px;bottom:28px;display:flex;align-items:center;gap:13px;color:#e4eedac7;font-size:9px;letter-spacing:.4px;padding:7px 12px;border-radius:6px;background:#14536875;backdrop-filter:blur(8px)}
.flight-instruments b{font-family:Consolas,monospace;font-size:17px;font-weight:400;color:#fff6df;margin-right:3px}
.flight-instruments #throttle{font-size:12px;margin-right:1px}
.flight-instruments i{width:1px;height:14px;background:#dcebd52e}
body:not(.flying) .flight-instruments{display:none}
.pause-status{position:absolute;top:88px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px;padding:8px 9px 8px 15px;border-radius:8px;border:1px solid var(--border);background:#145368b8;backdrop-filter:blur(10px);font-size:11px;color:#e4eedac9}
.pause-status button{padding:8px 13px;background:#fff4df;color:#245663;border-radius:5px;font-size:11px}
.toast{position:absolute;top:88px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 60px);padding:10px 16px;border-radius:7px;background:#145368d9;color:#f5e3bf;font-size:11px;line-height:1.7;opacity:0;transition:opacity .2s;pointer-events:none;white-space:nowrap}
.toast.visible{opacity:1}
.modal-backdrop{position:absolute;inset:0;display:grid;place-items:center;background:#03283338;backdrop-filter:blur(5px);z-index:10}
.modal{position:relative;width:405px;max-width:calc(100vw - 48px);max-height:calc(100dvh - 48px);overflow:auto;border:1px solid #daeade33;background:linear-gradient(145deg,#286d77f5,#165263f8);padding:28px 30px;border-radius:12px;box-shadow:0 20px 70px #032c4c44}
.modal h2{font-size:19px;font-weight:400;letter-spacing:1px;margin:0 0 23px}
.close-modal{position:absolute;right:12px;top:8px;background:transparent;padding:3px 7px;font-size:23px;color:#e3ebd8aa}
.help-content>div{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0;font-size:10px;color:#e4eddbbf}
.help-content>p{border-top:1px solid #dcebd526;padding-top:15px;margin-top:20px;font-size:10px;line-height:2;color:#d9e8d5a8}
.help-progress{display:block;margin:19px 0;color:#d9e8d58a;font-size:9px;letter-spacing:.5px}
.modal>.primary-button{width:100%;margin-top:20px}
.loading{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:#48aee2;font-size:12px;letter-spacing:2px;transition:opacity .5s}
.loading-plane{font-size:38px;color:#e8dcc1}
.loading.done{opacity:0;pointer-events:none}
.error{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;background:#135c70}
.error b{font-size:24px;font-weight:400}
.error p{font-size:13px;line-height:2;max-width:420px;color:#dbe9df}
@media(max-width:1050px){.topbar{padding:23px 25px}.map-panel{right:25px;width:195px}.flight-instruments{right:25px}.context-dock{left:25px;gap:14px}.intro{left:5%;width:345px}h1{font-size:34px}}
@media(max-height:620px){.topbar{padding-top:19px}.map-panel{bottom:69px}#minimap{height:110px}.context-dock{bottom:22px}.flight-instruments{bottom:23px}.pause-status,.toast{top:72px}}
@media(prefers-reduced-motion:reduce){button,.intro,.toast,.loading{transition:none}}
