:root{--ink:#e8f6fc;--muted:#8ca8b7;--fine:#55717e;--line:rgba(158,210,231,.18);--panel:rgba(4,20,29,.83);--panel2:rgba(5,23,34,.92);--cyan:#8af0f7;--cyan2:#4fd7e7;--gold:#e6b86d;--green:#78e8c4;--font:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#07121c;color:var(--ink);font-family:var(--font);font-weight:400}canvas#worldCanvas{position:absolute;inset:0;display:block;width:100%;height:100%;outline:none;cursor:crosshair}.grid-overlay{pointer-events:none;position:fixed;inset:0;z-index:1;background:linear-gradient(90deg,rgba(16,34,44,.15),transparent 13%,transparent 87%,rgba(7,17,27,.2));box-shadow:inset 0 0 190px rgba(2,12,20,.32)}button,select,input{font:inherit}button{cursor:pointer;color:inherit;border:0;background:transparent}button:hover{color:#fff}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--cyan2);outline-offset:3px}button:active{transform:translateY(1px)}
.topbar{z-index:5;position:fixed;top:0;left:0;right:0;min-height:80px;padding:14px 24px;display:flex;align-items:center;gap:34px;background:linear-gradient(180deg,rgba(4,17,28,.93),rgba(4,17,28,.78));border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:13px;min-width:310px}.brandmark{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid var(--cyan);font-size:27px;font-weight:800;letter-spacing:-7px;padding-right:7px;color:var(--cyan);clip-path:polygon(0 0,85% 0,100% 18%,100% 100%,0 100%)}.brandmark span{color:#fff}.brand strong{display:block;font-size:16px;font-weight:750;letter-spacing:.19em;line-height:1.6}.brand .thin{font-weight:350;color:#86a9bb}.brand small{display:block;font-size:9px;letter-spacing:.22em;color:#8fabb6}.top-stats{display:flex;align-items:center;margin:auto;gap:44px;text-align:center}.top-stats>div{min-width:74px}.top-stats b{font-size:21px;font-weight:530;display:block;line-height:1.35;font-variant-numeric:tabular-nums}.top-stats small{color:#789ca9;font-size:9px;letter-spacing:.18em}.top-stats .suffix{font-size:12px;color:var(--muted)}.top-actions{display:flex;gap:8px}.top-actions button{border:1px solid var(--line);height:37px;min-width:37px;padding:0 11px;font-size:16px;background:rgba(27,49,60,.45);border-radius:3px}.top-actions button span{font-size:10px;letter-spacing:.11em;margin-left:6px}.top-actions .blue{color:var(--cyan);border-color:rgba(79,215,231,.45)}
.sidebar{z-index:4;position:fixed;left:18px;top:96px;bottom:54px;width:295px;background:var(--panel);border:1px solid var(--line);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#1a4a55 transparent;backdrop-filter:blur(17px);box-shadow:0 20px 60px #00131d55}.side-heading{padding:17px 20px;color:#a4d8df;font-size:10px;font-weight:700;letter-spacing:.2em;border-bottom:1px solid var(--line)}.signal{width:6px;height:6px;display:inline-block;border-radius:100%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);margin-right:9px}.side-n{float:right;font-size:10px;color:var(--fine);letter-spacing:.02em}.section{padding:17px 20px;border-bottom:1px solid var(--line)}.fieldtitle{color:#e1f1f6;font-size:11px;letter-spacing:.17em;font-weight:750;margin-bottom:20px}.fieldtitle span{font-size:9px;letter-spacing:.1em;color:#5b8694;float:right;font-weight:450}.section label{color:var(--muted);font-size:11px;display:flex;justify-content:space-between;align-items:center;margin:0 0 10px}.section label strong{color:var(--cyan);font-size:12px;font-weight:650}.section .minor{color:#51727e;font-size:8px;letter-spacing:.1em}.section input[type=range]{width:100%;height:5px;margin:4px 0 5px;background:#214350;appearance:none;accent-color:var(--cyan2);cursor:pointer}.section input[type=range]::-webkit-slider-thumb{width:11px;height:11px;border:2px solid #dbffff;box-shadow:0 0 10px #62ddeb;appearance:none;background:#76deed;border-radius:50%}.slider-bounds{display:flex;justify-content:space-between;font-size:9px;color:#64818d;margin-bottom:20px}.section select{width:100%;border:1px solid rgba(122,186,210,.25);height:39px;color:#d0e5ec;background:#102633;border-radius:3px;padding:0 10px;font-size:11px;outline:none;margin-bottom:17px}.control-row{display:flex;gap:9px}.outline{min-height:34px;border:1px solid rgba(136,190,213,.29);padding:9px 10px;font-size:9px;letter-spacing:.07em;font-weight:650;background:#0f2a38;color:#b6dce5}.outline:hover{background:#174452;border-color:var(--cyan);color:#e6f8ff}.control-row button{flex:1}.section .action{display:block;width:100%;background:var(--cyan);color:#092631;letter-spacing:.1em;font-weight:750;font-size:10px;padding:13px 11px;margin:0 0 9px;text-align:left}.action span{float:right;font-size:15px}.section .underground{width:100%;margin-top:3px}.system-status .line{display:flex;justify-content:space-between;gap:14px;margin-bottom:11px;font-size:10px;color:#73929e}.system-status .line strong{text-align:right;overflow-wrap:anywhere;color:#b9d8e1;font-weight:550;max-width:155px}.sidetip{display:flex;align-items:flex-start;gap:10px;padding:17px 18px 20px}.sidetip>span{color:#66d4df}.sidetip p{margin:0;color:#72929f;font-size:10px;line-height:1.6}
.right-stack{z-index:4;position:fixed;right:20px;top:100px;width:262px}.mapbox{background:var(--panel2);border:1px solid var(--line);backdrop-filter:blur(13px);box-shadow:0 20px 60px #00131d66;padding:0}.map-head,.map-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 13px;color:#a5c9d1;font-size:10px;font-weight:650;letter-spacing:.14em}.map-head button{font-size:16px;color:var(--cyan);line-height:1}.map-foot{color:#7a9da7;border-top:1px solid var(--line);font-size:9px;padding:12px 13px}.map-foot .coordinate{color:var(--cyan)}.mapwrap{position:relative;margin:0 12px;line-height:0;border:1px solid #426676;overflow:hidden}.mapwrap canvas{width:100%;display:block;aspect-ratio:1/1;image-rendering:auto}.map-cross{position:absolute;pointer-events:none;background:rgba(188,235,238,.22)}.map-cross-h{left:0;right:0;top:50%;height:1px}.map-cross-v{top:0;bottom:0;left:50%;width:1px}.waypoint-card{display:flex;align-items:center;gap:15px;margin-top:13px;background:rgba(4,21,31,.86);padding:13px;border:1px solid var(--line);backdrop-filter:blur(14px)}.waypoint-icon{font-size:27px;color:var(--cyan)}.waypoint-card div{display:flex;flex-direction:column;gap:4px}.waypoint-card small{font-size:9px;color:#7095a2;letter-spacing:.17em}.waypoint-card strong{font-size:11px;letter-spacing:.11em}.waypoint-card div>span{font-size:9px;color:#76d9e7}
.bottom-hud{z-index:3;position:fixed;bottom:0;left:0;right:0;min-height:43px;display:flex;align-items:center;justify-content:space-between;background:rgba(3,18,27,.91);padding:8px 23px;border-top:1px solid rgba(103,179,199,.22);gap:18px}.status-left{display:flex;gap:10px;align-items:center;min-width:240px;color:#98b9c5;font-size:11px}.green-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 11px #40b89d}.bottom-controls{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.1em;color:#7a9fa9}.bottom-controls kbd{color:#dcf4f6;font-family:inherit;font-size:9px;font-weight:700;letter-spacing:.05em}.bottom-controls i{height:12px;width:1px;background:#46626d;margin:0 8px}.streambox{position:fixed;z-index:4;bottom:58px;left:50%;transform:translateX(-50%);width:290px;padding:16px 18px;border:1px solid #557680;background:#041927de;backdrop-filter:blur(12px);text-align:center;box-shadow:0 0 30px #00101e}.streambox>span{color:#b7e5ee;font-size:10px;letter-spacing:.19em}.progress-track{height:3px;margin:14px 0 10px;background:#21404e}.progress-fill{height:100%;background:#68e0ed;width:0;box-shadow:0 0 8px #68e0ed;transition:width .25s}.streambox small{font-size:9px;color:#86a3aa}
.boot{position:fixed;z-index:15;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;background:radial-gradient(circle at 50% 42%,#123443 0,#05121e 65%)}.boot-logo{width:89px;height:89px;border:1px solid #6ce4ef;display:flex;align-items:center;justify-content:center;font-size:37px;font-weight:700;color:#b3f8ff}.boot-logo span{color:#618791}.boot .micro{color:#65bcc9;letter-spacing:.3em;font-size:10px;margin:28px 0 7px}.boot h1{font-size:clamp(35px,6vw,80px);letter-spacing:.19em;font-weight:320;margin:0 0 12px}.boot p{color:#88a8b1;font-size:12px}.boot-spinner{height:3px;width:168px;background:linear-gradient(90deg,transparent,#83ffff,transparent);margin-top:20px;animation:pulse 1.4s infinite}@keyframes pulse{0%{opacity:.2;transform:scaleX(.4)}50%{opacity:1;transform:scaleX(1)}100%{opacity:.2;transform:scaleX(.4)}}.hidden{display:none!important}
.modal-backdrop{position:fixed;z-index:12;inset:0;background:#010b15bd;display:none;align-items:center;justify-content:center;backdrop-filter:blur(7px)}.modal-backdrop.open{display:flex}.modal{position:relative;max-width:520px;width:calc(100vw - 40px);max-height:90vh;overflow:auto;background:#09212ef7;border:1px solid #487d8d;padding:40px;box-shadow:0 30px 100px #000c}.modal .close{position:absolute;right:15px;top:8px;color:#84bdc8;font-size:30px}.eyebrow{font-size:11px;color:#6cdee8;letter-spacing:.25em}.modal h2{font-size:35px;font-weight:400;letter-spacing:-.04em;margin:15px 0}.modal p{font-size:13px;line-height:1.7;color:#9cbdc8}.help-grid{display:grid;grid-template-columns:1fr 1.5fr;border-top:1px solid var(--line);margin:22px 0 10px}.help-grid>*{padding:9px 0;border-bottom:1px solid var(--line);font-size:11px}.help-grid span{color:#72e1e8;font-weight:750;letter-spacing:.07em}.help-grid strong{font-weight:400;color:#bdd3dc}.modal .modal-footer{font-size:11px;color:#66929f}.map-large .right-stack{width:min(500px,calc(100vw - 36px));top:100px}.map-large .right-stack .mapbox{max-height:75vh}.minimal .sidebar,.minimal .right-stack,.minimal .topbar,.minimal .bottom-controls{display:none}.minimal .bottom-hud{background:transparent;border:0}
@media(max-height:750px){.sidebar{top:80px;bottom:43px}.section{padding:12px 18px}.section .fieldtitle{margin-bottom:10px}.section select{margin-bottom:10px}.side-heading{padding:13px 18px}}
@media(max-width:1080px){.top-stats{gap:20px}.brand{min-width:260px}.right-stack{width:190px}.bottom-controls i:nth-of-type(n+3),.bottom-controls kbd:nth-of-type(n+4){display:none}.bottom-controls{font-size:8px}.sidebar{width:265px}}
@media(max-width:760px){.topbar{padding:11px 12px;min-height:64px}.brand{min-width:0}.brandmark{width:38px;height:38px;font-size:22px}.brand strong{font-size:12px}.brand small{font-size:7px}.top-stats{display:none}.top-actions{margin-left:auto}.top-actions button{padding:0 8px}.top-actions button span{display:none}.sidebar{top:70px;bottom:47px;left:10px;width:min(270px,calc(100vw - 20px));transform:translateX(calc(-100% + 33px));transition:transform .2s}.sidebar:hover,.sidebar:focus-within{transform:translateX(0)}.right-stack{right:10px;top:73px;width:145px}.waypoint-card{padding:7px}.waypoint-icon{font-size:17px}.waypoint-card strong{font-size:8px}.map-head,.map-foot{font-size:8px;padding:9px}.mapwrap{margin:0 8px}.bottom-controls{display:none}.status-left{min-width:0}.bottom-hud{justify-content:center;padding:7px 10px}.streambox{width:230px}}
