:root{color-scheme:dark;--bg:#060f18;--glass:rgba(10,22,31,.84);--border:rgba(128,185,207,.18);--mute:#7195a5;--main:#cee6ed;--accent:#65ddf1;--gold:#e1b487;--font:'Segoe UI',Inter,Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--main);font-family:var(--font)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#app{height:100%;position:relative;isolation:isolate}#viewport{width:100%;height:100%;display:block;background:radial-gradient(circle at 50% 60%,#183444,#050d15 80%);cursor:crosshair}.vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 190px 72px rgba(0,0,0,.55);z-index:1}.scanlines{pointer-events:none;position:absolute;inset:0;z-index:1;opacity:.055;background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(197,236,255,.6) 4px,transparent 5px)}.glass{background:var(--glass);border:1px solid var(--border);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.topbar{position:absolute;inset:13px 18px auto;height:70px;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:0 23px;border-radius:5px}.brand{display:flex;align-items:center;gap:13px}.brand strong{display:block;letter-spacing:2px;font-size:16px;font-weight:760}.brand em{font-size:14px;font-style:normal;color:#a3cedc;font-weight:450}.brand small{display:block;letter-spacing:2px;color:var(--mute);font-size:9px;margin-top:6px}.logo-mark{font-size:39px;color:#9cebf6;text-shadow:0 0 22px #57d4df77}.top-center{display:flex;gap:14px;align-items:center;font-size:10px;letter-spacing:1.8px;color:#c7e3e7}.live-dot{display:inline-block;width:7px;height:7px;background:#78efbe;border-radius:50%;box-shadow:0 0 11px #78efbe}.small-sep,.muted{color:var(--mute)}.top-actions{display:flex;gap:11px;align-items:center}.chip{border:1px solid #44737d;color:#93cdd6;font-size:9px;letter-spacing:1.3px;padding:8px 11px}.icon-btn{background:transparent;color:#afccd8;border:1px solid #56768468;min-width:30px;height:30px;border-radius:2px}.icon-btn:hover{color:white;border-color:var(--accent)}.overlay-ui{position:absolute;z-index:3;top:96px;bottom:77px;overflow:auto;scrollbar-width:thin;scrollbar-color:#304757 transparent;padding:20px 19px}.left-panel{left:18px;width:286px;border-radius:5px}.right-panel{right:18px;width:290px;border-radius:5px}.micro{font-size:10px;font-weight:750;color:#add7e1;letter-spacing:1.9px;display:flex;justify-content:space-between}.tag{font-size:9px;color:#86aab5}.hero-number{font-family:Consolas,monospace;letter-spacing:-3px;display:flex;align-items:baseline;gap:11px;margin-top:20px;font-size:47px;font-weight:300;color:#f4fafb}.unit{font-size:14px;letter-spacing:1px;color:#b3dce5}.subtitle{font-size:9px;letter-spacing:1.25px;color:var(--mute);margin-top:3px}.hairline{border-top:1px solid rgba(125,170,190,.17);margin:22px 0}.panel-heading{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.3px;font-weight:650;margin-bottom:13px}.text-link{color:#69d6d8}.mini-legend{display:flex;justify-content:space-between;gap:8px;font-size:8px;color:#7194a6;letter-spacing:.4px}.mini-legend span{display:flex;align-items:center;gap:5px}.mini-legend i{display:inline-block}.legend-line{background:#52819b;width:12px;height:2px}.legend-dot{width:6px;height:6px;border:1px solid #82c8dc;border-radius:50%}.legend-player{width:5px;height:5px;background:#f5ce83;border-radius:50%}#minimap{display:block;cursor:crosshair;width:100%;height:178px;border:1px solid #304652;background:rgba(5,16,25,.8);border-radius:2px;margin:3px 0 10px}.depths{display:flex;flex-direction:column;gap:5px}.depth-option{background:rgba(12,31,42,.54);border:1px solid rgba(98,145,163,.13);color:#9dc0c8;width:100%;text-align:left;display:flex;align-items:center;gap:11px;padding:9px 10px}.depth-option:hover{border-color:#75cbd1}.depth-option.selected{border-color:#79dcf0;background:rgba(59,129,145,.17);box-shadow:inset 3px 0 #77d6e5}.depth-option .depth-idx{font:10px Consolas,monospace;min-width:23px;color:#8dcad6}.depth-name{flex:1;font-size:10px;font-weight:600;letter-spacing:.4px}.depth-m{font:9px Consolas,monospace;color:#709aab}.telemetry{display:grid;gap:13px;font-size:10px}.telemetry>div{display:flex;justify-content:space-between}.telemetry strong{font:11px Consolas,monospace;color:#a9ebd6}.right-panel h2{font-weight:450;font-size:25px;letter-spacing:-.7px;margin:19px 0 8px}.panel-copy{font-size:11px;line-height:1.65;color:#90aab7;margin:0 0 24px}.control-row{margin:20px 0}.control-row label{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.25px;color:#a9c6d0;font-weight:650;margin-bottom:13px}.control-row output{font:11px Consolas,monospace;color:#effbfc}.control-row input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:3px;background:linear-gradient(90deg,#57b8c9,#304a57);cursor:pointer}.control-row input[type=range]::-webkit-slider-thumb{appearance:none;background:#95e9f0;border:3px solid #253d4c;width:16px;height:16px;border-radius:50%;box-shadow:0 0 0 1px #7ddbe6}.control-row input[type=range]::-moz-range-thumb{background:#95e9f0;border:2px solid #253d4c;width:12px;height:12px;border-radius:50%}select{background:#10222d;color:#bbd8e2;width:100%;border:1px solid #406071;border-radius:0;padding:9px;font-size:11px}.toggle-row{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:18px 0;font-size:11px;color:#b3d1d8}.toggle-row small{display:block;font-size:9px;color:#7694a3;margin-top:5px}.switch{display:block;width:33px;height:18px;flex-shrink:0;position:relative}.switch input{opacity:0;position:absolute}.thumb{display:block;width:100%;height:100%;border-radius:50px;background:#293b46;border:1px solid #455867;transition:background .2s}.thumb:before{content:'';display:block;background:#9eafb6;position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;transition:transform .2s}.switch input:checked+.thumb{background:#19798b;border-color:#46b8c1}.switch input:checked+.thumb:before{transform:translateX(15px);background:#d7ffff}.action-pair{display:flex;gap:7px;margin-top:26px}.action-pair button{flex:1;padding:11px 4px;font-size:9px;letter-spacing:.55px;border-radius:2px}.secondary{border:1px solid #52727f;background:#102c3a;color:#aac8d5}.primary{border:1px solid #79dbea;background:#85d8e2;color:#062330;font-weight:750}.hud-footer{position:absolute;z-index:3;left:18px;right:18px;bottom:13px;height:53px;border-radius:5px;display:flex;justify-content:space-between;align-items:center;padding:0 21px}.pos{display:flex;gap:12px;align-items:center;font-size:9px;letter-spacing:1.2px}.pos strong{font:10px Consolas,monospace;color:#a4d8de}.key-hints{display:flex;gap:23px;font-size:9px;color:#87a9b6;align-items:center;letter-spacing:.6px}.key-hints span{display:inline-flex;gap:3px;align-items:center}kbd{min-width:19px;padding:4px 5px;border:1px solid #3a5b66;text-align:center;color:#b8d4dd;font:9px Consolas,monospace;background:#122b37}.compass{display:flex;align-items:center;gap:9px;font-size:10px;color:#6dc6d5}.compass strong{font:14px Consolas,monospace;color:#e4f7f9}.reticle{display:none;pointer-events:none;position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%);width:18px;height:18px}.reticle span:first-child{position:absolute;left:8px;top:0;width:1px;height:18px;background:#bfeff1a1}.reticle span:last-child{position:absolute;left:0;top:8px;width:18px;height:1px;background:#bfeff1a1}.center-toast{position:absolute;top:19%;left:50%;transform:translateX(-50%);z-index:8;color:#ddfdff;font-size:11px;letter-spacing:1px;background:#102c3cbd;border:1px solid #51839b88;padding:10px 17px;opacity:0;transition:opacity .3s;pointer-events:none}.center-toast.shown{opacity:1}.start-layer{position:absolute;z-index:10;inset:0;background:radial-gradient(ellipse at center,rgba(7,28,36,.72),rgba(4,11,17,.94) 85%);display:flex;justify-content:center;align-items:center}.start-content{width:min(520px,90vw);padding:38px 46px 34px;text-align:center;border-color:#386c7a98;background:rgba(7,21,30,.81);box-shadow:0 16px 80px #0008}.eyebrow{font-size:9px;color:#84d6df;letter-spacing:2.6px}.start-symbol{display:block;font-size:66px;font-weight:100;color:#c2f5f8;text-shadow:0 0 45px #6cc4dba5;margin-top:12px}.start-content h1{font-weight:350;line-height:.97;margin:13px 0 22px;font-size:52px;letter-spacing:6px;color:#f3ffff}.start-content h1 em{font-style:normal;color:#84dce9;font-weight:650;letter-spacing:12px}.start-content p{color:#a1b9c3;font-size:12px;line-height:1.9;margin:0 auto;max-width:390px}.start-metrics{display:flex;justify-content:space-evenly;gap:9px;border-block:1px solid #47617069;margin:25px 0;padding:17px 0}.start-metrics span{font-size:9px;letter-spacing:1.2px;color:#8caab7}.start-metrics strong{display:block;font:18px Consolas,monospace;color:#def5f6;margin-bottom:7px}.enter-btn{border:0;background:#8fdfeb;color:#082c37;font-size:11px;font-weight:790;letter-spacing:1.45px;padding:16px 23px;width:100%;display:flex;justify-content:space-between}.enter-btn:hover{background:#c5f4f7}.start-content>small{font-size:10px;color:#648796;display:block;margin-top:19px}dialog{border:1px solid #5b8694;background:#0c1c27;color:#c7e4ee;padding:27px;width:min(550px,90vw);box-shadow:0 0 0 900px #061018cf}dialog::backdrop{background:#02080ccc}.help-head{display:flex;align-items:center;justify-content:space-between}.help-head h2{font-size:20px;font-weight:400}dialog p{line-height:1.85;font-size:12px;color:#9fb9c4}dialog b{color:#cdebf1}dialog .enter-btn{margin-top:20px}body.panel-hidden .overlay-ui{display:none}body.panel-hidden .topbar{opacity:.83}body.panel-hidden .key-hints{display:none}body.panel-hidden .reticle{display:block}body.hazard .topbar{border-color:#b65b5fbb}body.hazard .live-dot{background:#ff6873;box-shadow:0 0 12px #ff6873}body.hazard .top-center{color:#ffabb4}
@media(max-width:1180px){.top-center{display:none}.key-hints{gap:8px}.right-panel{width:255px}.left-panel{width:255px}.pos{display:none}}
@media(max-width:820px){.left-panel{width:215px;padding:14px;bottom:70px}.right-panel{width:215px;padding:14px;bottom:70px}.topbar{height:59px;left:7px;right:7px;top:7px;padding:0 11px}.overlay-ui{top:74px}.hud-footer{left:7px;right:7px;bottom:6px}.brand strong{font-size:13px}.brand small{font-size:7px}.brand .logo-mark{font-size:25px}.chip{display:none}.key-hints span:nth-child(n+3){display:none}}
@media(max-width:580px){.left-panel{top:auto;height:260px;bottom:68px;width:44%;left:7px}.right-panel{top:74px;bottom:auto;max-height:200px;width:44%;right:7px}.hero-number{font-size:31px;margin-top:7px}.subtitle,.mini-legend,.hairline,.telemetry,.panel-heading,.depths,.right-panel .panel-copy,.right-panel .toggle-row,.right-panel .action-pair{display:none}.right-panel h2{font-size:17px;margin:10px 0}.right-panel .control-row{margin:11px 0}.right-panel .control-row:nth-of-type(n+5){display:none}.left-panel #minimap{height:145px}.key-hints{gap:6px;font-size:8px}.key-hints span:nth-child(n+2){display:none}.start-content{padding:25px 22px}.start-content h1{font-size:38px}.start-metrics strong{font-size:14px}}