:root{color-scheme:dark;--ink:#07101c;--ink2:rgba(7,18,28,.87);--line:rgba(108,173,188,.20);--aqua:#70d2de;--light:#e1eef0;--muted:#7e9ca6;--orange:#ff9f59}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Inter,Arial,sans-serif;color:var(--light);background:#05101b}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}
#stage{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 48%,#143148 0%,#050b17 80%)}#stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none}#stage canvas:active{cursor:grabbing}#stage canvas.three-canvas{pointer-events:none}
body.three-mode #scene{opacity:0}
#loading{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 52% 35%,#122638,#040914 75%);transition:opacity .8s,visibility .8s}#loading.done{opacity:0;visibility:hidden;pointer-events:none}#loading.error{background:#081522}#loading h2{font:700 28px 'Barlow Condensed',sans-serif;letter-spacing:.13em;margin:18px 0 6px}#loading p{font:12px 'DM Mono',monospace;letter-spacing:.07em;color:#7897a4}#loading .smallcap{color:var(--aqua);letter-spacing:.3em;font:10px 'DM Mono',monospace;margin-top:24px}.loading-mark{font:800 72px 'Barlow Condensed',sans-serif;border:2px solid #4c94a1;width:116px;height:116px;text-align:center;line-height:108px;color:#f0f9f8;transform:skew(-4deg);text-shadow:0 0 30px #17b5cf70}.loading-mark span,.brand-symbol span{color:#f5a05d}.loading-line{width:200px;height:2px;margin-top:22px;background:#12374a;position:relative;overflow:hidden}.loading-line:after{position:absolute;content:"";background:var(--aqua);width:50%;height:100%;animation:scan 1.6s ease-in-out infinite}@keyframes scan{from{left:-50%}to{left:110%}}
.topbar{position:fixed;z-index:30;top:0;left:0;right:0;height:77px;display:flex;align-items:center;padding:0 25px;justify-content:space-between;background:linear-gradient(90deg,rgba(5,15,26,.96),rgba(10,25,37,.90));border-bottom:1px solid var(--line);box-shadow:0 10px 35px #020a1360}.brand{display:flex;align-items:center;gap:15px}.brand-symbol{border:1px solid #438a9b;color:white;height:45px;width:45px;text-align:center;line-height:42px;font:800 27px 'Barlow Condensed',sans-serif;display:grid;place-items:center;transform:skew(-7deg);position:relative}.brand-symbol span{position:absolute;right:5px;bottom:1px;font-size:11px;line-height:12px}.brand-title{font:800 23px 'Barlow Condensed',sans-serif;letter-spacing:.055em;line-height:1.05}.brand-thin{font-weight:400;color:#b8c9cd}.sub-brand{font:9px 'DM Mono',monospace;color:#6898a5;letter-spacing:.115em;margin-top:5px}.head-stats{display:flex;gap:31px;font:10px 'DM Mono',monospace;color:#86a9b4;letter-spacing:.12em}.head-stats span{white-space:nowrap}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#55ecac;margin-right:7px;box-shadow:0 0 12px #40c6a5}.top-actions{display:flex;gap:7px}.top-btn{color:#b9d4dc;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:3px;width:32px;height:32px;font-size:17px}.top-btn:hover,.map-head button:hover{border-color:#7fc9cf;color:white}
.panel{background:linear-gradient(135deg,rgba(5,18,29,.94),rgba(7,20,32,.83));border:1px solid var(--line);box-shadow:0 18px 65px #02060b88;backdrop-filter:blur(17px)}.left-panel{position:fixed;top:97px;bottom:127px;left:20px;width:273px;padding:19px 16px 12px;z-index:20;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#274758 transparent}.right-panel{position:fixed;top:97px;bottom:127px;right:20px;width:281px;padding:21px 17px;z-index:20;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#274758 transparent}.panel-label{font:9px 'DM Mono',monospace;color:#79afbc;letter-spacing:.135em;display:flex;justify-content:space-between;align-items:center}.panel-count{color:#bdcacc;font-size:9px}.panel-title{font:700 27px 'Barlow Condensed',sans-serif;letter-spacing:.065em;margin-top:10px}.panel-note{font:9px 'DM Mono',monospace;color:#537e8d;letter-spacing:.09em;margin:4px 0 19px}.level-btn{display:flex;align-items:center;width:100%;gap:12px;background:transparent;border:1px solid transparent;color:#86a7b0;text-align:left;padding:10px 9px;min-height:61px;border-bottom-color:#1c3440;transition:background .18s,border-color .18s}.level-btn:hover{background:#15313ca8}.level-btn.active{background:linear-gradient(90deg,#154251bd,#0b293600);border-left:2px solid #65d4e1;border-top-color:#2f697480;border-right-color:#2f697480;color:#e6fdff}.level-num{font:600 19px 'Barlow Condensed',sans-serif;color:#537586;width:27px}.level-btn.active .level-num{color:#82d9e9}.level-btn strong{display:block;font:600 13px 'Barlow Condensed',sans-serif;letter-spacing:.09em}.level-btn small{display:block;font:9px 'DM Mono',monospace;color:#6b91a0;margin-top:4px}.level-chevron{margin-left:auto;font-size:24px;color:#456775;font-weight:200}.section-divider{height:1px;min-height:1px;background:linear-gradient(90deg,transparent,#376075,transparent);margin:18px 0}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 9px;margin-top:13px}.metric-grid strong{display:block;font:700 22px 'Barlow Condensed',sans-serif;letter-spacing:.02em;color:#dbe6e7}.metric-grid span{font:8px 'DM Mono',monospace;color:#5b8695;letter-spacing:.04em}.panel-bottom{margin-top:auto;padding-top:15px;color:#678b9b;font:9px 'DM Mono',monospace;letter-spacing:.07em}.panel-bottom code{color:#a4dfe0}
.right-panel h2{font:700 30px 'Barlow Condensed',sans-serif;letter-spacing:.065em;margin:8px 0 2px}.live-text{color:#56d7a3}.slider-group label{display:flex;justify-content:space-between;font:9px 'DM Mono',monospace;letter-spacing:.08em;color:#9bbfc5;margin:14px 0 8px}.slider-group label span:first-child{display:flex;align-items:center;gap:7px}.slider-group label b{display:inline-block;width:19px;color:#63d1e1;font-size:14px;font-weight:400}.slider-group label span:last-child{color:#c7e9ed}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:3px;border-radius:3px;background:linear-gradient(90deg,#559ba7,#214653);margin:0;accent-color:#a9e6ef}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;border-radius:0;background:#b4f1f3;border:2px solid #285469;transform:rotate(45deg);box-shadow:0 0 8px #55cbd17b}#waypoints{width:100%;height:34px;background:#102735;color:#c4e4e9;border:1px solid #315766;outline:none;padding:6px;font:10px 'DM Mono',monospace;margin:12px 0 9px;border-radius:0}#waypoints optgroup{background:#0c212f;color:#e2f4f4}.action-btn{width:100%;border:1px solid #72a8b0;background:#2a7182;color:#e6fdff;padding:11px 12px;letter-spacing:.065em;text-align:left;font:600 11px 'Barlow Condensed',sans-serif;display:flex;align-items:center;justify-content:space-between}.action-btn:hover{background:#348a9d}.action-btn span{font-size:18px}.outline-btn{width:100%;padding:10px 7px;font:10px 'DM Mono',monospace;letter-spacing:.04em;border:1px solid #325360;color:#91bfcb;background:#0b1d2b;margin-top:8px}.outline-btn:hover{border-color:#8bc9d2;color:#e8fbfd}.engine-name{margin:9px 0;font:12px 'Barlow Condensed',sans-serif;color:#e6edea;letter-spacing:.1em}.micro-note{font:9px/1.55 'DM Mono',monospace;color:#608595;margin:9px 0 0}
.minimap{position:fixed;left:310px;bottom:127px;z-index:18;width:220px;padding:9px 9px 5px;background:rgba(5,17,28,.82)}.map-head{display:flex;align-items:center;justify-content:space-between;font:9px 'DM Mono',monospace;color:#80b6c2;letter-spacing:.08em}.map-head button{color:#8fbdca;background:transparent;border:1px solid transparent;font-size:18px;padding:0 7px}.minimap canvas{display:block;width:100%;aspect-ratio:1;margin-top:8px}.minimap.collapsed canvas{display:none}
.bottom-hud{position:fixed;left:20px;right:20px;bottom:16px;height:94px;z-index:24;border:1px solid var(--line);background:linear-gradient(90deg,rgba(4,15,25,.95),rgba(12,30,42,.88));backdrop-filter:blur(14px);display:flex;align-items:center;gap:27px;padding:12px 22px}.hud-block{min-width:112px}.hud-block.location{min-width:218px}.hud-block.depth{min-width:118px}.hud-eyebrow{font:9px 'DM Mono',monospace;letter-spacing:.12em;color:#588c9c;margin-bottom:5px}.hud-value{font:600 20px 'Barlow Condensed',sans-serif;letter-spacing:.065em;white-space:nowrap}.hud-sub{font:10px 'DM Mono',monospace;color:#7c9aa5;letter-spacing:.02em;margin-top:5px}.hud-divider{width:1px;height:43px;background:#274653}.unit{font-size:11px;color:#6aa4ac}.reset-btn{margin-left:auto;background:transparent;border:1px solid #406476;padding:12px;color:#9acbd1;font:10px 'DM Mono',monospace;letter-spacing:.05em;white-space:nowrap}.reset-btn:hover{border-color:var(--aqua)}
#crosshair{pointer-events:none;position:fixed;left:50%;top:50%;z-index:8;transform:translate(-50%,-50%);width:23px;height:23px;opacity:.72}#crosshair span{position:absolute;background:#bde4e8;box-shadow:0 0 6px #6cdce1;width:1px;height:7px;left:11px;top:0}#crosshair span:nth-child(2){top:16px}#crosshair span:nth-child(3){transform:rotate(90deg);top:8px;left:2px}#crosshair span:nth-child(4){transform:rotate(90deg);top:8px;left:19px}
.control-hint{position:fixed;z-index:15;bottom:118px;left:50%;transform:translateX(-50%);padding:8px 15px;background:rgba(7,21,32,.65);border:1px solid #3153636b;white-space:nowrap;font:9px 'DM Mono',monospace;color:#a4c7cc;letter-spacing:.06em}.key{border:1px solid #789ea9;padding:2px 4px;margin-right:2px;color:#d4eff2;background:#1c3944;font-size:9px}.sep{margin:0 9px;color:#628392}
#toast{position:fixed;z-index:43;left:50%;bottom:188px;transform:translate(-50%,15px);background:#082832;border:1px solid #57aab9;color:#cff3f3;font:11px 'DM Mono',monospace;padding:14px 20px;letter-spacing:.05em;opacity:0;transition:all .28s;pointer-events:none;max-width:90%;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}
.intro{position:fixed;z-index:26;left:50%;top:50%;transform:translate(-50%,-50%);width:min(530px,calc(100vw - 28px));padding:42px;background:linear-gradient(115deg,rgba(5,17,29,.96),rgba(8,26,39,.90));border:1px solid #458493;box-shadow:0 15px 110px #010408f0}.intro.hidden{display:none}.intro-badge{color:#65b8c3;font:10px 'DM Mono',monospace;letter-spacing:.18em}.intro h1{font:800 clamp(56px,6vw,95px)/.81 'Barlow Condensed',sans-serif;margin:22px 0 26px;letter-spacing:.015em}.intro h1 em{font-style:normal;color:#f9ab67}.intro p{max-width:380px;color:#aac2c8;font:14px/1.8 Inter,sans-serif}.intro button{width:100%;margin:21px 0;background:#368396;border:1px solid #85c8cc;color:white;padding:15px 17px;font:700 13px 'Barlow Condensed',sans-serif;letter-spacing:.1em;display:flex;justify-content:space-between}.intro-foot{font:9px 'DM Mono',monospace;color:#6d9ba7;letter-spacing:.04em;text-align:center}
dialog{background:#0a1b28;color:#d9eef0;border:1px solid #508d98;padding:28px;width:min(600px,90vw);box-shadow:0 0 100px #000c}dialog::backdrop{background:#020a14cd;backdrop-filter:blur(5px)}dialog .modal-top{display:flex;justify-content:space-between;font:10px 'DM Mono',monospace;color:#79bac7}dialog .modal-top button{font-size:25px;border:0;color:white;background:transparent;line-height:18px}dialog h2{font:800 34px 'Barlow Condensed',sans-serif;letter-spacing:.07em}dialog p{color:#93abb5;font:12px/1.7 Inter,sans-serif}.controls-grid{display:grid;grid-template-columns:150px 1fr;gap:13px;padding:15px 0;font:11px 'DM Mono',monospace;border-top:1px solid #314f5f;border-bottom:1px solid #314f5f}.controls-grid b{color:#b0dce0}.controls-grid span{color:#7794a5}.sr-only{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
body.minimal-ui .left-panel,body.minimal-ui .right-panel,body.minimal-ui .bottom-hud,body.minimal-ui .topbar,body.minimal-ui .minimap,body.minimal-ui .control-hint{display:none}
@media (max-height:760px){.left-panel,.right-panel{top:87px;bottom:98px}.topbar{height:67px}.bottom-hud{height:72px;bottom:10px}.minimap{bottom:98px}.control-hint{bottom:91px}.level-btn{min-height:50px;padding:6px}.panel-title{margin-top:5px}.metric-grid{gap:7px}}
@media (max-width:1280px){.head-stats span:nth-child(3){display:none}.minimap{left:18px;bottom:130px;width:172px}.left-panel{width:250px}.right-panel{width:255px}.bottom-hud{gap:15px;padding:10px 13px}.hud-block.location{min-width:175px}}
@media (max-width:950px){.head-stats{display:none}.left-panel{left:10px;top:82px;width:203px;padding:12px}.right-panel{right:10px;top:82px;width:223px;padding:13px}.level-btn{min-height:49px}.level-btn strong{font-size:11px}.metric-grid strong{font-size:17px}.minimap{display:none}.bottom-hud{left:10px;right:10px;gap:11px;padding:8px 10px}.hud-value{font-size:16px}.hud-block{min-width:75px}.hud-block.location{min-width:155px}.hud-sub{font-size:8px}.reset-btn{font-size:9px}.control-hint{font-size:8px}}
@media(max-width:670px){.topbar{height:60px;padding:0 11px}.brand-title{font-size:17px}.sub-brand{font-size:7px}.brand-symbol{width:34px;height:34px;font-size:20px}.left-panel{top:69px;bottom:auto;width:160px;height:225px;overflow:hidden}.left-panel .panel-label:nth-of-type(2),.left-panel .section-divider,.left-panel .metric-grid,.left-panel .panel-bottom{display:none}.level-btn{min-height:31px;padding:3px}.level-btn small{display:none}.level-btn strong{font-size:9px}.level-num{font-size:13px;width:17px}.right-panel{top:69px;bottom:auto;width:166px;max-height:330px;overflow:auto}.right-panel h2{font-size:22px}.slider-group label{font-size:8px}.right-panel .micro-note{display:none}.right-panel .panel-label{font-size:7px}.slider-group label{margin:8px 0 5px}.section-divider{margin:8px 0}.outline-btn{font-size:8px}.bottom-hud{height:67px;gap:8px}.hud-block.location{min-width:112px}.hud-block.depth{min-width:72px}.bottom-hud .hud-block:nth-of-type(5),.bottom-hud .hud-divider.hide-small,.bottom-hud .hud-block.hide-small{display:none}.hud-divider{height:35px}.hud-eyebrow{font-size:7px}.hud-sub{font-size:7px}.hud-value{font-size:12px}.reset-btn{padding:5px;font-size:8px}.control-hint{display:none}.intro{padding:24px}.intro h1{font-size:66px}}

.telemetry{display:grid;grid-template-columns:1fr 1fr;gap:12px 9px;margin:11px 0 2px}.telemetry span{font:8px "Courier New",monospace;color:#5e9bae;letter-spacing:.05em}.telemetry strong{display:block;color:#c8e9e9;font:600 16px "Arial Narrow",sans-serif;margin-top:5px}
