:root{--bg:#090f18;--panel:#101a27ed;--stroke:#27394a;--text:#e7edf4;--muted:#8699a9;--accent:#f2a752;--teal:#53d7ce}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text)}button,input{font:inherit}button{cursor:pointer}#viewport{position:absolute;inset:0}#viewport canvas{display:block} .topbar{position:absolute;top:0;left:0;right:0;height:71px;z-index:20;background:#0a111bd9;border-bottom:1px solid #2c3945;display:flex;align-items:center;justify-content:space-between;padding:0 26px;backdrop-filter:blur(12px)}.brand{display:flex;gap:12px;align-items:center;letter-spacing:1.5px;font-size:15px}.brand-icon{background:#f3a64e;color:#101820;border-radius:7px;padding:12px;font-weight:900;letter-spacing:-1px}.brand small{display:block;color:#8d9da9;font-size:9px;letter-spacing:1.65px;margin-top:3px}.muted{color:#8998a5}.topright{display:flex;align-items:center;gap:21px;font-size:11px;letter-spacing:1px}.status{color:#7bd8c2}.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#58d3a2;box-shadow:0 0 12px #58d3a2;margin-right:6px}.icon-btn,.close{background:#1a2634;border:1px solid #3c4c5b;color:white;border-radius:6px;width:30px;height:30px}.sidebar{position:absolute;top:84px;left:15px;bottom:64px;z-index:10;width:310px;overflow-y:auto;padding:23px 18px 20px;background:var(--panel);border:1px solid var(--stroke);border-radius:11px;box-shadow:0 15px 60px #03080c80;scrollbar-width:thin;scrollbar-color:#354a5c transparent}.micro{font-size:9px;letter-spacing:2px;color:var(--accent);margin:0 0 7px;font-weight:700}.sidebar h2{font-size:21px;font-weight:700;margin:5px 0 19px}.hero-stat{border:1px solid #38434b;background:linear-gradient(135deg,#222b32,#1b232e);padding:15px 13px;border-radius:7px}.hero-stat span,.stats-grid span{font-size:9px;color:#9aaab6;letter-spacing:1.1px}.hero-stat strong{display:block;font-size:27px;margin-top:5px}.hero-stat em,.stats-grid em{font-size:12px;color:var(--muted);font-style:normal}.progress{height:3px;background:#434a50;margin-top:13px}.progress div{height:100%;width:90%;background:#f5a955}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}.stats-grid>div{padding:12px 8px;background:#192534;border:1px solid #263848;border-radius:6px}.stats-grid strong{display:block;font-size:19px;margin-top:6px}.section-head{font-size:10px;font-weight:700;letter-spacing:1.6px;color:#b6c3cf;margin:23px 0 10px;display:flex;justify-content:space-between}.section-head b{color:var(--accent)}.section-head span{font-size:8px;color:var(--muted)}.locations{display:grid;grid-template-columns:1fr;gap:5px}.locations button{background:#162330;border:1px solid #293c4d;padding:9px 11px;text-align:left;color:#b6c3cd;border-radius:5px;font-size:12px}.locations button span{font-family:monospace;color:#6f8497;margin-right:11px}.locations button.active,.locations button:hover{border-color:#bb864d;background:#49362670;color:white}.locations button.active span{color:#f6ba68}.switch-row{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #253747;padding:10px 2px}.switch-row b{display:block;font-size:12px;font-weight:600}.switch-row small{display:block;font-size:10px;color:#7c92a4;margin-top:3px}.switch-row input{appearance:none;position:absolute;opacity:0}.switch-row i{width:35px;height:20px;background:#344050;border-radius:13px;position:relative;flex:none;transition:background .2s}.switch-row i:after{content:"";width:14px;height:14px;position:absolute;left:3px;top:3px;border-radius:50%;background:#c1c9d0;transition:transform .2s}.switch-row input:checked+i{background:#2f867f}.switch-row input:checked+i:after{transform:translateX(15px);background:#c2fff8}.split{display:flex;gap:6px}.secondary{background:#182838;border:1px solid #304559;padding:9px;color:#b9c7d0;border-radius:5px;flex:1;font-size:11px}.secondary:hover,.secondary.selected{background:#3c3b34;border-color:#c68d4b;color:#ffcf8c}input[type=range]{width:100%;accent-color:#f4aa59}.rightpanel{position:absolute;top:84px;right:15px;width:303px;z-index:10;padding:17px;background:var(--panel);border:1px solid var(--stroke);border-radius:10px;box-shadow:0 15px 50px #0006}.panel-heading{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:1.5px;color:#b4c2ce;margin-bottom:12px}.panel-heading button{background:none;border:0;color:#a7bac7;font-size:20px}.rightpanel h3{font-size:18px;margin:8px 0}.rightpanel p:not(.micro):not(.canvas-note){font-size:12px;color:#aebec8;line-height:1.7}.inspect-row{display:flex;justify-content:space-between;border-top:1px solid #2a3948;padding:9px 0;font-size:11px}.inspect-row span:first-child{color:#91a6b6}.inspect-row span:last-child{color:#f1c58b}#minimap{width:100%;height:auto;display:block;border:1px solid #2e4658;border-radius:5px;background:#172732}.canvas-note{font-size:9px;color:#8499aa;margin:8px 0 0}.infobar{position:absolute;top:84px;left:338px;right:330px;display:flex;justify-content:space-between;gap:14px;z-index:10;background:#0a1423a6;padding:10px 16px;border:1px solid #2d4050;border-radius:7px;font-size:10px;letter-spacing:.6px;color:#9eafbe;backdrop-filter:blur(5px)}.infobar b{color:#e4ebf0}.bottom-controls{position:absolute;left:338px;right:330px;bottom:17px;display:flex;justify-content:space-evenly;gap:10px;z-index:10;background:#0b1625b9;padding:11px 8px;border-radius:5px;font-size:9px;color:#8c9eac;letter-spacing:.6px}.bottom-controls b{color:#e9eff6;margin-left:3px}#toast{position:absolute;left:50%;transform:translateX(-50%);top:85px;z-index:30;background:#1b2937;color:white;padding:10px 20px;border:1px solid #536373;border-radius:5px;opacity:0;pointer-events:none;transition:opacity .3s;font-size:12px}#toast.visible{opacity:1}.modal{position:absolute;inset:0;background:#000a;display:grid;place-items:center;z-index:40}.modal.hidden{display:none}.dialog{max-width:480px;width:90%;background:#131f2c;border:1px solid #486073;border-radius:10px;padding:30px;position:relative}.dialog h2{margin:0 0 14px}.dialog p{font-size:13px;line-height:1.8;color:#acbdca}.dialog .close{position:absolute;right:16px;top:16px}.primary{background:#e8a454;color:#13202c;border:0;border-radius:6px;padding:12px 18px;font-weight:750;margin-top:8px}@media(max-width:1170px){.infobar{right:20px}.rightpanel{display:none}.bottom-controls{right:20px}}@media(max-width:720px){.topbar{padding:0 12px}.brand{font-size:12px}.topright #clock,.status{display:none}.sidebar{width:245px;top:78px;bottom:12px;padding:14px 12px}.infobar,.bottom-controls{display:none}}
