:root{--bg:#0b1118;--panel:#101823e8;--line:#263548;--text:#edf5ff;--muted:#91a1b5;--green:#44ff88;--red:#ff365e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 Inter,Segoe UI,Arial,sans-serif;overflow:hidden}#app{height:100vh;display:grid;grid-template-columns:310px 1fr}.side{background:linear-gradient(180deg,#111b28,#0d1420);border-right:1px solid var(--line);padding:16px;overflow:auto;box-shadow:0 0 30px #0008;z-index:3}.brand{font-size:28px;font-weight:900;letter-spacing:.04em;margin:0 0 4px}.sub{color:var(--muted);font-size:12px;margin-bottom:18px}.tiny{color:#9fb2c9;font-size:11px}.section{margin:18px 0}.section h2{font-size:12px;letter-spacing:.14em;color:#9fb2c9;text-transform:uppercase;margin:0 0 8px}.item{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:10px 11px;margin:6px 0;border:1px solid #223146;border-radius:14px;background:#172233b5;cursor:pointer;transition:.16s}.item:hover{transform:translateX(3px);background:#1e2d43}.item.active{border-color:#55d6ff;background:linear-gradient(90deg,#163650,#1b2d40);box-shadow:0 0 0 1px #55d6ff55 inset,0 8px 24px #0005}.item small{color:var(--muted);font-style:italic}.mapwrap{position:relative;overflow:hidden;background:radial-gradient(circle at 40% 30%,#1c2b3d,#080d13 70%);touch-action:none;overscroll-behavior:none}canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:none}.hud{position:absolute;right:16px;top:14px;padding:10px 13px;border:1px solid #31445b;background:#101823d9;border-radius:16px;backdrop-filter:blur(10px);text-align:right;box-shadow:0 10px 30px #0007}.hud .big{font-weight:800}.zoom{position:absolute;right:18px;bottom:54px;display:grid;gap:10px}.zoom button{width:44px;height:44px;border-radius:50%;border:1px solid #38516d;background:#132033;color:white;font-size:24px;font-weight:900;box-shadow:0 8px 25px #0009;cursor:pointer}.copy{position:absolute;right:18px;bottom:15px;font-weight:1000;font-size:11px;letter-spacing:.18em;color:#dceaffaa;text-shadow:0 2px 8px #000}.coordInfo{position:absolute;left:14px;bottom:14px;display:grid;gap:2px;padding:9px 12px;border:1px solid #31445b;background:#101823d9;border-radius:14px;box-shadow:0 10px 30px #0007;backdrop-filter:blur(10px);pointer-events:none}.coordInfo b{font-size:13px}.coordInfo small{color:#aebed2;font-size:12px}.tip{position:absolute;pointer-events:none;display:none;max-width:290px;padding:10px 12px;border:1px solid #45617e;background:#0f1722ee;border-radius:14px;box-shadow:0 14px 34px #000a;z-index:5}.pill{display:inline-block;margin:2px 4px 2px 0;padding:2px 7px;border:1px solid #354b64;border-radius:999px;color:#c8d8ed;font-size:12px}.axis{position:absolute;left:0;top:0;color:#d7e8ff88;font-size:11px;pointer-events:none;text-shadow:0 1px 3px #000}.chatbubble{position:absolute;transform:translate(-50%,-100%);background:white;color:#111;padding:8px 11px;border-radius:16px;box-shadow:0 8px 24px #0008;max-width:220px;font-weight:700;z-index:4;transition:left .12s linear,top .12s linear}.chatbubble:after{content:"";position:absolute;left:50%;bottom:-7px;border:8px solid transparent;border-top-color:white;transform:translateX(-50%)}.err{color:#ffb4c3;border-color:#6b2e43;background:#29131d}.loader{color:#cfe3ff;border-color:#31445b;background:#132033}
.mobileMenu,.mobileClose,.mobileBackdrop{display:none}@media (max-width: 760px){body{font-size:13px}#app{display:block;height:100vh}.mapwrap{position:fixed;inset:0;width:100vw;height:100vh}.side{position:fixed;left:0;top:0;bottom:0;width:min(86vw,340px);transform:translateX(-105%);transition:transform .22s ease;z-index:30;border-right:1px solid #39506d;padding:18px 14px 22px;box-shadow:18px 0 50px #000c}.side.open{transform:translateX(0)}body.menuOpen .mobileBackdrop{display:block;position:fixed;inset:0;background:rgba(2,8,14,.58);backdrop-filter:blur(2px);z-index:20}.mobileMenu{display:flex;position:fixed;left:12px;top:12px;z-index:18;align-items:center;justify-content:center;width:46px;height:46px;border-radius:16px;border:1px solid #3b526f;background:#101823e8;color:#fff;font-size:24px;font-weight:900;box-shadow:0 10px 30px #0009}.mobileClose{display:flex;position:absolute;right:12px;top:12px;align-items:center;justify-content:center;width:38px;height:38px;border-radius:14px;border:1px solid #3b526f;background:#162235;color:#fff;font-size:26px;font-weight:800}.brand{padding-right:42px}.section{margin:16px 0}.item{padding:13px 12px;border-radius:16px;min-height:46px}.hud{right:12px;top:12px;padding:8px 11px;border-radius:15px}.zoom{right:12px;bottom:70px}.zoom button{width:50px;height:50px;font-size:26px}.coordInfo{left:12px;bottom:12px;max-width:72vw}.tileDebug{left:66px!important;top:12px!important;max-width:calc(100vw - 170px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#101823a8;border:1px solid #31445b;border-radius:10px;padding:3px 7px}.copy{right:16px;bottom:16px}.axis{font-size:10px}.chatbubble{max-width:70vw}.tip{max-width:76vw}}