:root{font-family:Inter,'Segoe UI',Arial,sans-serif;color:#eaf6f8;background:#071722;font-synthesis:none}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}#viewport{position:fixed;inset:0;z-index:0}#viewport canvas{display:block;width:100%;height:100%;touch-action:none}.topbar{position:absolute;left:0;right:0;top:0;z-index:5;background:linear-gradient(180deg,rgba(7,18,28,.96),rgba(7,18,28,.75));display:flex;align-items:center;justify-content:space-between;padding:16px 25px;border-bottom:1px solid #35525c;backdrop-filter:blur(12px);pointer-events:none}.topbar button{pointer-events:auto}.branding{display:flex;align-items:center;gap:13px}.brand-icon{width:48px;height:48px;background:#4ec5c6;color:#0e2c39;font-weight:950;display:grid;place-items:center;transform:skewX(-10deg);font-size:27px}.brand-icon span{font-size:12px;align-self:end;margin:-28px 0 8px 24px}.micro{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#8eb2bd}.slash{color:#6dcad1}.brand-title{font-size:20px;letter-spacing:1px;font-weight:900;line-height:26px}.thin{font-weight:300;color:#b6dce2}.tag-row{display:flex;align-items:center;gap:20px;font-size:10px;letter-spacing:1px}.tag-row .mono{color:#bbd3db;font-family:ui-monospace,monospace}.live{padding:8px 12px;background:#11392e;border:1px solid #326e60;color:#88ebbc}.live i{display:inline-block;width:7px;height:7px;background:#65eda8;border-radius:50%;margin-right:8px;box-shadow:0 0 12px #65eda8}button{font-family:inherit;cursor:pointer}#help-button{background:transparent;border:1px solid #44626e;color:#c3e1e6;padding:11px 14px;font-size:10px;letter-spacing:1px}button:hover{filter:brightness(1.22)}.control-panel{position:absolute;z-index:5;top:94px;left:18px;width:330px;max-height:calc(100vh - 177px);background:rgba(9,24,35,.94);border:1px solid #304d5b;box-shadow:0 24px 65px #0717228a;backdrop-filter:blur(14px);display:flex;flex-direction:column}.control-panel header{display:flex;align-items:center;justify-content:space-between;padding:19px 20px;border-bottom:1px solid #2b4550;flex-shrink:0}h2,h3{margin:0}h2{font-size:19px;letter-spacing:1px;margin-top:5px}h3{color:#87e5e4;font-size:10px;letter-spacing:1.45px;margin:0 0 13px}.control-panel header button{background:#223946;color:#d0e6e8;border:1px solid #4b6974;border-radius:2px;padding:6px 10px}.panel-content{overflow:auto;padding:0 20px 19px;scrollbar-color:#4a707c transparent}.control-panel section{padding:18px 0;border-bottom:1px solid #23404a}.control-panel.minimized{width:210px}.control-panel.minimized .panel-content{display:none}.camera-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.camera-grid button{border:1px solid #2e5263;background:#142f3c;color:#b8d5dc;text-align:left;font-size:12px;padding:11px 10px;border-radius:2px}.camera-grid button.active{color:#062e39;background:#4fc6ca;border-color:#61e5e9;font-weight:750}.slider-label{display:flex;justify-content:space-between;align-items:center;color:#c9e0e3;font-size:10px;letter-spacing:.9px;margin-top:15px}.slider-label strong{font-family:ui-monospace,monospace;color:#86e9e0;font-size:11px}.slider-label:first-of-type{margin-top:0}input[type=range]{appearance:none;width:100%;height:3px;background:#335460;outline:none;margin:13px 0 4px}input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;background:#4ccbd1;border-radius:50%;box-shadow:0 0 0 4px #27636c}input[type=checkbox]{accent-color:#5fc9c8}.toggle-list{display:grid;gap:10px}.toggle-list label{display:flex;align-items:center;gap:9px;font-size:12px;color:#c8dce2}.select-label{font-size:12px;color:#b9d2d8}.select-label select{margin-top:10px;display:block;width:100%;background:#152d3a;border:1px solid #385d6c;padding:9px;color:#d9e9eb;font:inherit}.action-row{display:flex;gap:9px;margin-top:20px}.action-row button{padding:12px 13px;border:1px solid #3b6971;background:#18333e;color:#d2edef;font-size:10px;font-weight:800;letter-spacing:.5px}.action-row .primary{flex:1;background:#48babb;color:#0d2b34;border:1px solid #60d4d0}.aside-note{font-size:10px;line-height:1.6;color:#91aeb9;margin:17px 0 0}.statusbar{position:absolute;z-index:3;bottom:0;left:0;right:0;min-height:69px;background:#081b27e9;border-top:1px solid #2d525c;display:flex;align-items:center;gap:35px;padding:13px 25px}.status-group{display:flex;flex-direction:column;gap:4px;min-width:72px}.status-group strong{font-family:ui-monospace,monospace;font-size:19px;font-weight:700;color:#e8f6f7}.status-group:nth-child(2) strong,.status-group:nth-child(3) strong{color:#71e8c1}.map-panel{position:absolute;right:24px;bottom:90px;z-index:3;width:246px;background:#0b202ede;border:1px solid #385a66;padding:12px 12px 8px;backdrop-filter:blur(10px)}.map-head{display:flex;justify-content:space-between;font-size:9px;font-weight:800;letter-spacing:1px;color:#a2d2d8}.map{margin:11px 0 8px;height:105px;background:repeating-linear-gradient(0deg,#183140,#183140 17px,#213c48 18px),repeating-linear-gradient(90deg,transparent,transparent 17px,#3e5b62 18px);position:relative;overflow:hidden}.map-rail{height:3px;background:#76c1c2;position:absolute;width:100%}.map-block{position:absolute;background:#d7ad64a0;outline:1px solid #d8b46a}.map-dot{position:absolute;left:50%;top:50%;width:11px;height:11px;background:#fff;border:3px solid #24d7d4;box-shadow:0 0 10px #63eff1;border-radius:50%;transform:translate(-50%,-50%)}#coordinates{text-align:right;font-family:ui-monospace,monospace;font-size:9px;color:#a1bdc7}.help{display:none;position:absolute;z-index:6;right:24px;top:94px;background:#0c2330eb;width:310px;border:1px solid #456a77;padding:20px;color:#c1dce3;line-height:1.55;font-size:13px}.help.shown{display:block}.help h3{margin-bottom:9px}.loading{position:fixed;inset:0;z-index:20;background:#081722;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;transition:opacity .4s}.loading.hidden{opacity:0;pointer-events:none}.spinner{height:52px;width:52px;border:3px solid #173b48;border-top-color:#50d1c9;border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-main{font-weight:900;letter-spacing:4px;font-size:16px}.loading-sub{color:#a1bac5;font-size:12px;letter-spacing:1px}.error-panel{position:fixed;z-index:25;top:50%;left:50%;transform:translate(-50%,-50%);max-width:600px;background:#251719;color:#ffd1d1;border:1px solid #c4575c;padding:26px;white-space:pre-wrap}
@media(max-width:900px){.tag-row .mono,.tag-row .live{display:none}.control-panel{width:280px;top:85px}.statusbar{gap:13px;overflow:auto}.status-group{min-width:60px}.map-panel{width:170px;right:12px}.brand-title{font-size:15px}}@media(max-width:620px){.topbar{padding:11px 14px}.brand-icon{width:34px;height:34px;font-size:18px}.brand-title{font-size:12px;letter-spacing:0}.micro{font-size:9px}.control-panel{top:74px;left:8px;max-height:53vh}.map-panel{bottom:83px;width:140px}.statusbar{min-height:64px;padding:9px 12px}.status-group strong{font-size:15px}}
