: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:#07090e;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:#04060a75;padding:24px 16px}.panel{width:min(460px,100%);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,.dist,.sel,.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)}.dist{top:74px;right:12px;width:min(180px,42vw);font-size:12px;color:var(--dim)}.dist .track,.dist .track i{height:4px}.dist .track{background:#1a242c;margin-top:4px}.dist .track i{display:block;background:var(--cyan);width:0}.dist.opp .track i{background:var(--amber)}.dist strong{color:var(--text)}.sel{left:12px;top:74px;color:var(--dim);font-size:12px;letter-spacing:.08em}.turn-banner{top:108px;left:50%;transform:translate(-50%);letter-spacing:.28em;font-size:13px;color:var(--cyan)}.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:230px;width:112px}body.coarse .minimap-wrap canvas{width:112px;height:112px}body.coarse .coach{bottom:250px}.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 30%}.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}.dist{top:86px}}