:root{--bg: rgba(6, 9, 14, .78);--line: rgba(126, 214, 232, .45);--cyan: #7ee7ff;--amber: #ffb24a;--danger: #ff4d6a;--text: #e7eef6;--dim: #8ea0b3;--font: "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif;color:var(--text);font-family:var(--font)}*{box-sizing:border-box}html,body{margin:0;height:100%;height:100dvh;overflow:hidden;background:#04060a;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}input,select,textarea{user-select:text;touch-action:manipulation}#view{position:fixed;inset:0;width:100%;height:100%;display:block}#app{position:fixed;inset:0;pointer-events:none;z-index:2}[hidden]{display:none!important}button,.overlay,.touch-ui,.hud-hit{pointer-events:auto}button{font:inherit;color:var(--text);background:#080e14d1;border:1px solid var(--line);min-height:44px;padding:0 14px;letter-spacing:.08em;cursor:pointer}button:hover,button.on{border-color:var(--cyan);color:var(--cyan)}button:active{transform:translateY(1px)}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#04060a8c;padding:24px 16px;overflow:hidden}.panel{width:min(460px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--bg);border:1px solid var(--line);padding:22px 20px 18px;box-shadow:0 0 40px #3cb4c814}.brand{font-size:12px;letter-spacing:.42em;color:var(--cyan)}h1{margin:6px 0 4px;font-weight:560;font-size:34px;letter-spacing:.04em}.sub{margin:0 0 16px;color:var(--dim)}.col,.row{display:flex;gap:8px}.col{flex-direction:column}.row{flex-wrap:wrap}.grow{flex:1}.menu-actions{margin-top:8px}label.field{display:flex;flex-direction:column;gap:6px;color:var(--dim);font-size:12px;letter-spacing:.12em;margin-bottom:10px}input[type=text],input[type=range],select{width:100%;background:#0b1016;color:var(--text);border:1px solid rgba(126,214,232,.28);min-height:36px;padding:4px 8px;font:inherit}.check{flex-direction:row;align-items:center;letter-spacing:.06em}.check input{width:auto}.bar{height:4px;background:#172028;margin-top:18px}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#1a6d80,var(--cyan))}#hud{position:fixed;inset:0;pointer-events:none}.topbar,.meters,.sel,.compass,.keyhint,.coach,.toast,.turn-banner,.thinking,.minimap-wrap,.desk{position:absolute;pointer-events:none}.topbar{top:calc(10px + env(safe-area-inset-top));left:12px;right:12px;display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.chip{background:var(--bg);border:1px solid rgba(126,214,232,.28);padding:6px 8px;font-size:12px;letter-spacing:.14em}.chip b{display:block;color:var(--text);letter-spacing:.04em;font-size:14px}.chip.alert b{color:var(--danger)}.pips{display:flex;gap:4px;margin-top:4px}.pips s{width:14px;height:6px;background:#24303a;text-decoration:none;display:block}.pips s.on{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.meters{top:70px;right:12px;width:148px;display:flex;flex-direction:column;align-items:stretch;gap:8px;font-size:13px;color:var(--dim);line-height:1.25}.meter-row{display:flex;justify-content:flex-end;align-items:center;gap:6px}#hud-aim{display:block;flex:0 0 auto;transform-origin:50% 55%}.meters .axes{margin:0;text-align:right;color:var(--amber);letter-spacing:.06em;min-height:1.2em}.meters .track{height:4px;background:#1a242c;margin-top:4px}.meters .track i{display:block;height:100%;background:var(--cyan);width:0}.meter.opp .track i{background:var(--amber)}.meters strong{color:var(--text);font-size:16px;font-weight:600;min-width:1.5em;text-align:right}.sel{left:12px;top:74px;color:var(--dim);font-size:12px;letter-spacing:.08em}.compass{left:12px;top:104px;width:132px;display:flex;flex-direction:column;align-items:center;gap:3px}.compass-label{align-self:flex-start;font-size:10px;letter-spacing:.22em;color:var(--dim)}.compass-mid,.compass-z{display:flex;gap:3px;align-items:center}.compass-face{width:40px;height:22px;display:grid;place-items:center;font-size:10px;letter-spacing:.04em;color:#66788a;border:1px solid rgba(90,110,126,.45);background:#080c10b8}.compass-face.open{color:#d8fbff;border-color:#3ce6ffd9;background:#3ce6ff24}.compass-face.exit{box-shadow:inset 0 0 0 1px #ffb24a;color:#ffb24a}.compass-face.open.exit{color:#ffe1b0}.compass-core{width:10px;height:10px;border-radius:50%;background:#3ce6ff;box-shadow:0 0 6px #3ce6ff}.turn-banner{top:calc(12px + env(safe-area-inset-top));left:50%;transform:translate(-50%);padding:4px 14px;border-radius:999px;background:#080e14b8;border:1px solid rgba(126,230,255,.55);letter-spacing:.18em;font-size:12px;color:var(--cyan);white-space:nowrap;opacity:0;transition:opacity .35s ease}.turn-banner.show{opacity:1}.thinking,.coach,.toast{left:50%;transform:translate(-50%);background:#080a0ecc;border:1px solid var(--line);padding:6px 12px;font-size:13px;white-space:nowrap}.thinking{top:136px;color:var(--amber)}.coach{bottom:168px;max-width:92vw;white-space:normal;text-align:center}.toast{bottom:132px;color:var(--danger)}.minimap-wrap{left:12px;bottom:64px;width:148px;pointer-events:auto}.minimap-wrap canvas{width:148px;height:148px;border:1px solid rgba(126,214,232,.3);background:#05080ca6;display:block}.minimap-wrap button{width:100%;min-height:32px}.keyhint,.desk{bottom:14px;left:50%;transform:translate(-50%);color:var(--dim);font-size:12px;letter-spacing:.04em;text-align:center;width:min(720px,96vw)}.desk{pointer-events:auto;display:flex;gap:8px;justify-content:center;bottom:36px}.touch-ui{display:none}body.coarse .touch-ui{display:block}body.coarse .keyhint,body.coarse .desk{display:none}body.coarse .minimap-wrap{bottom:248px;width:96px}body.coarse .minimap-wrap canvas{width:96px;height:96px}body.coarse .coach{bottom:268px;max-width:70vw}body.coarse .compass{top:118px;transform:scale(.86);transform-origin:top left}body.coarse .meters{top:68px;width:min(132px,40vw)}.stick-zone,.look-zone{position:fixed;top:0;bottom:220px}.stick-zone{left:0;width:46%}.look-zone{right:0;width:54%}.stick{position:absolute;width:84px;height:84px;margin-left:-42px;margin-top:-42px;border:1px solid var(--line);border-radius:50%;background:#08101673;display:none}.stick i{position:absolute;width:28px;height:28px;margin:-14px;border-radius:50%;background:var(--cyan);opacity:.8}.tray{position:fixed;left:0;right:0;bottom:0;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:#05080ce0;border-top:1px solid rgba(126,214,232,.25);max-height:46dvh}.tray label{color:var(--dim);font-size:11px;letter-spacing:.14em}.tray-buttons{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.tray-buttons button{flex:1 1 28%;min-width:0}.dial{width:64px;height:64px;border:1px solid var(--cyan);border-radius:50%;display:grid;place-items:center;color:var(--cyan);letter-spacing:.14em;font-size:12px;flex:0 0 64px}.steps{min-height:140px;color:var(--text);line-height:1.55}.steps svg{width:72px;height:72px;float:left;margin-right:12px}.stats{line-height:1.7;color:var(--dim)}.stats b{color:var(--text)}@media(max-width:720px){h1{font-size:28px}.overlay{padding:16px 12px}.panel{padding:16px 14px 14px}.meters{top:66px;width:min(140px,42vw)}.compass{top:112px}.turn-banner{font-size:11px;letter-spacing:.12em}.row button,.col button{min-width:0}}#net-code{width:100%;min-height:92px;margin-top:6px;padding:8px;background:#060a0eeb;color:var(--text);border:1px solid var(--line);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;line-height:1.45;letter-spacing:.02em;word-break:break-all;resize:vertical}#net-code:focus{outline:1px solid var(--cyan)}#net-status{color:var(--cyan);min-height:2.6em;margin:8px 0 4px}#screen-net .panel{width:min(520px,100%)}#screen-net button:disabled{opacity:.4;cursor:not-allowed}