:root{--text:#e5eef1;--muted:#8ba3af;--ink:#071c26;--line:rgba(166,209,222,.14);--cyan:#8ee4e3;--gold:#d8b98a;--panel:rgba(7,22,31,.82)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#061622;color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
#sky{position:fixed;inset:0;background:radial-gradient(ellipse at 51% 45%,#4e6c70 0,#37525e 16%,#1b3748 39%,#0e2633 62%,#05131c 100%)}#sky:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(192,174,143,.22),transparent 36%,rgba(6,18,29,.27) 94%)}#viewport{display:block;position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline:0}#vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 33%,rgba(2,10,17,.24) 65%,rgba(1,9,17,.72) 108%)}
.app-shell{position:absolute;inset:0;pointer-events:none}.app-shell button,.panel,.bottom-bar,.scene-info,.view-tools,.topbar,.selection{pointer-events:auto}
.topbar{position:absolute;top:0;left:0;right:0;height:82px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 33px;background:linear-gradient(180deg,rgba(4,17,27,.86),rgba(4,20,28,.45));backdrop-filter:blur(20px);z-index:4}.brand{display:flex;gap:15px;align-items:center}.brandmark{position:relative;width:39px;height:39px;border:2px solid var(--cyan);transform:rotate(30deg);border-radius:9px;box-shadow:0 0 32px rgba(112,222,216,.19);display:grid;place-items:center}.brandmark:before,.brandmark:after{position:absolute;content:"";inset:8px;border:2px solid #81d3d3;border-radius:6px}.brandmark:after{inset:16px;border:0;background:#98e6e0;border-radius:50%}.brand-eyebrow,.overline,.mini-heading,.metric-name,.chart-heading,.bottom-meta,.top-center,.vertical-label,.loader-eyebrow{font-size:9px;letter-spacing:2px;font-weight:800;color:#a2bec6}.brand-eyebrow{margin-bottom:5px;color:#79c9c9}.brandname{font-weight:900;font-size:22px;letter-spacing:3.5px}.brand-suffix{font-size:11px;letter-spacing:2px;font-weight:600;color:#90adb8;margin-left:11px}.top-center{display:flex;align-items:center;gap:11px;opacity:.84}.separation{opacity:.42}.pulse-dot,.signal,.live span,.status-dot{display:inline-block;border-radius:100%;background:#93ded5;width:7px;height:7px;box-shadow:0 0 15px #5bdbdc}.top-right{display:flex;align-items:center;gap:13px}.system-pill{font-size:10px;font-weight:800;color:#a6e2db;letter-spacing:1.2px;display:flex;align-items:center;gap:10px}.icon-button{border:1px solid rgba(178,220,226,.2);border-radius:5px;background:rgba(9,29,42,.65);color:#cfebec;width:30px;height:30px;font-weight:700}
.panel{position:absolute;z-index:2;top:103px;bottom:91px;background:var(--panel);border:1px solid rgba(179,220,226,.16);box-shadow:0 11px 60px rgba(0,5,12,.32),inset 0 1px rgba(188,236,232,.05);backdrop-filter:blur(19px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#2c505b transparent}.left-panel{left:25px;width:294px;padding:21px}.right-panel{right:25px;width:296px;padding:20px}.panel-header{display:flex;justify-content:space-between;align-items:center}.panel-header h2{font-size:20px;letter-spacing:-.6px;margin:8px 0 0;font-weight:600}.panel-icon{color:#6fb6b9;font-size:26px}.subtitle{font-size:11px;color:#93a8b0;line-height:1.7;margin:18px 0 24px}.mini-heading{display:flex;justify-content:space-between;letter-spacing:1.2px;font-size:9px;color:#a1bdc4;margin-bottom:12px}.mini-heading span+span{color:var(--cyan)}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.preset{border:1px solid #2c4951;background:#142c38;color:#a6c3ca;border-radius:3px;height:33px;font-size:9px;letter-spacing:.75px;font-weight:800}.preset:hover,.preset.active{background:#204a50;border-color:#74caca;color:#d6ffff}.panel-rule{height:1px;background:var(--line);margin:23px 0}.sliders{display:flex;flex-direction:column;gap:21px}.control-label{display:flex;justify-content:space-between;gap:6px;font-size:10px;margin-bottom:13px}.control-label span:first-child{color:#d7e8e9;font-weight:600}.control-label output{color:#a2d8da;font-weight:800;white-space:nowrap}.slider-track{height:5px;appearance:none;-webkit-appearance:none;background:#24414d;border-radius:20px;width:100%;display:block;cursor:pointer}.slider-track::-webkit-slider-thumb{-webkit-appearance:none;background:#9ee0d9;border:3px solid #31545a;width:15px;height:15px;border-radius:100%;box-shadow:0 0 0 1px #a7dcd7}.slider-track::-moz-range-thumb{background:#9ee0d9;border:2px solid #31545a;width:12px;height:12px;border-radius:100%}.range-minmax{display:flex;justify-content:space-between;font-size:9px;color:#68838f;margin-top:10px}.emergency{width:100%;border:1px solid #9d6b5a;color:#efd4c4;background:linear-gradient(120deg,rgba(128,57,40,.29),rgba(43,28,29,.65));border-radius:3px;padding:14px 10px;display:flex;align-items:center;text-align:left;gap:11px}.emergency.active{background:rgba(167,70,59,.5);box-shadow:inset 0 0 35px rgba(192,62,46,.3)}.emergency-icon{font-size:19px;color:#e9ad95}.emergency strong{display:block;font-size:10px;letter-spacing:.9px}.emergency small{color:#c1a7a0;font-size:10px;display:block;margin-top:5px}.chevron{margin-left:auto;color:#ad8a7d}.caption-note{font-size:10px;line-height:1.65;color:#718c97;margin-top:21px}
.live{font-size:10px;color:#9ce2d8;display:flex;align-items:center;gap:7px;letter-spacing:1px}.live span{width:5px;height:5px}.big-metric{margin:25px 0 17px}.metric-name{color:#a2c0c4;letter-spacing:1.35px}.metric-main{display:flex;align-items:baseline;gap:9px;margin-top:9px}.metric-main strong{font-weight:300;font-size:64px;letter-spacing:-3px;line-height:1}.metric-main>span{color:var(--cyan);font-size:18px;font-weight:700;letter-spacing:1px}.metric-main small{font-size:10px}.metric-bottom{font-size:10px;color:#abc6c9;display:flex;align-items:center;gap:8px;margin-top:13px}.status-dot{width:5px;height:5px}.chart-heading{display:flex;justify-content:space-between;letter-spacing:1.1px;margin:21px 0 11px}.chart-heading span+span{color:#76caca}#powerChart{width:100%;height:94px;display:block;border:1px solid #234451;background:linear-gradient(180deg,rgba(31,63,75,.2),rgba(18,42,55,.1))}.metric-table{margin-top:19px}.metric-row{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid rgba(155,207,212,.085);padding:11px 0;gap:5px}.metric-row>span{color:#91aab3;letter-spacing:.6px;font-size:9px;font-weight:700}.metric-row strong{font-size:13px;color:#e3f3f2;font-weight:600;white-space:nowrap}.metric-row small{font-size:9px;color:#a7d2cd}.alarms{border-left:2px solid #7dbbb3;padding:5px 0 5px 10px;color:#b8d0d1;font-size:10px;line-height:1.6;min-height:25px}.alarms .success{color:#9eddd2;margin-right:6px}.alarms.alert{border-color:#ffac74;color:#f5c6ab}.export-grid{display:flex;gap:7px;margin-top:19px}.export-grid button{flex:1;border:1px solid #345562;color:#c3e1e3;background:#1b3844;border-radius:3px;font-size:9px;letter-spacing:.5px;padding:10px 4px}
.scene-info{position:absolute;z-index:1;left:calc(50% - 280px);top:133px;width:560px;text-align:center;text-shadow:0 3px 38px rgba(0,0,0,.5);pointer-events:none}.scene-tag{font-size:10px;letter-spacing:3px;color:#d5c59f;font-weight:800}.scene-info h1{font-size:40px;font-weight:300;letter-spacing:-1.5px;line-height:1.14;margin:14px 0 9px}.scene-desc{font-size:11px;color:#b1c5ca;letter-spacing:.3px}.reticle{position:absolute;left:50%;top:52%;height:26px;width:26px;transform:translate(-50%,-50%);opacity:.3;pointer-events:none}.reticle:before,.reticle:after{content:"";position:absolute;left:50%;top:0;width:1px;height:26px;background:#a3e8e1}.reticle:after{transform:rotate(90deg)}.reticle span:first-child{position:absolute;width:5px;height:5px;left:11px;top:11px;background:#a7ece1;border-radius:50%}
.view-tools{display:flex;flex-direction:column;position:absolute;right:335px;top:118px;gap:7px;align-items:flex-end}.vertical-label{font-size:8px;letter-spacing:1.3px;margin-bottom:7px}.view-btn{height:30px;min-width:138px;border:1px solid rgba(154,209,215,.3);background:rgba(9,29,38,.77);color:#b9d3d4;font-size:9px;letter-spacing:1px;font-weight:800;padding:0 11px;display:flex;justify-content:space-between;align-items:center}.view-btn.selected,.view-btn:hover{border-color:#8fdbd7;color:#edfcfc;background:rgba(20,75,79,.83)}.view-btn span{font-size:15px}.labels{position:absolute;inset:0;pointer-events:none}.world-label{position:absolute;transform:translate(-50%,-50%);background:rgba(4,25,34,.76);border-left:2px solid #82d7d4;color:#d8eeeb;padding:5px 8px;letter-spacing:.35px;white-space:nowrap;font-size:10px;pointer-events:auto;cursor:pointer;user-select:none;backdrop-filter:blur(5px);box-shadow:0 6px 15px #06192266}.world-label:hover{background:#1d5560}.selection{position:absolute;left:50%;top:62%;transform:translateX(-50%);background:rgba(7,28,39,.95);border:1px solid #426875;max-width:310px;padding:21px;z-index:9;backdrop-filter:blur(15px);box-shadow:0 15px 50px #03141fd9}.selection h3{font-size:19px;font-weight:500;margin:11px 0}.selection p{font-size:11px;line-height:1.7;color:#acc5c8}.selection>button{float:right;background:transparent;border:0;color:#9fb9bd;font-size:19px}.hidden{display:none!important}
.bottom-bar{position:absolute;bottom:0;left:0;right:0;height:72px;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(6,23,33,.63),rgba(4,18,28,.93));display:flex;align-items:center;padding:0 33px;gap:35px;backdrop-filter:blur(16px);z-index:3}.bottom-left{display:flex;align-items:center;gap:14px;min-width:244px}.corner{width:31px;height:31px;border:1px solid #41636d;color:#c5e1dd;font-size:19px;display:grid;place-items:center}.bottom-meta{color:#8caeb6;letter-spacing:1px}.bottom-title{font-size:11px;letter-spacing:.7px;margin-top:6px;font-weight:700}.bottom-bar nav{display:flex;gap:7px;flex:1}.cam{height:40px;min-width:96px;border:1px solid transparent;border-radius:3px;background:rgba(29,55,65,.38);color:#90b1bc;font-weight:700;font-size:11px}.cam span{font-size:9px;margin-left:4px}.cam.active,.cam:hover{border-color:#4e8c8f;background:#24474e;color:#d1eee9}.bottom-data{display:flex;flex-direction:column;gap:5px;text-align:right;color:#77939e;font-size:9px;letter-spacing:1px;min-width:92px}
.loading-screen{position:fixed;z-index:100;inset:0;background:radial-gradient(ellipse at center,#153b45,#071b27 55%,#04111c);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px;transition:opacity .65s}.loading-screen.ready{opacity:0;pointer-events:none}.loader-ring{width:69px;height:69px;border:2px solid #346c77;border-top:2px solid #91d9d3;border-radius:50%;animation:spin 1.7s linear infinite;margin-bottom:10px}.loader-eyebrow{color:#8cd1cc}.loading-screen strong{font-size:21px;letter-spacing:3px;font-weight:500}.loading-screen p{color:#829fa8;font-size:12px;margin:0}.loading-line{width:235px;height:2px;background:#22505a;overflow:hidden;margin-top:12px}.loading-line div{width:35%;height:100%;background:#98d8d5;animation:load 1.5s ease-in-out infinite alternate}@keyframes spin{to{transform:rotate(360deg)}}@keyframes load{to{transform:translateX(190%)}}
.modal{position:fixed;inset:0;background:rgba(1,10,17,.82);z-index:50;display:grid;place-items:center;pointer-events:auto;backdrop-filter:blur(8px)}.modal-content{background:#0d2734;border:1px solid #406874;padding:32px;max-width:620px;width:calc(100% - 30px)}.modal-content h2{font-weight:400;font-size:25px}.modal-content p{font-size:12px;color:#a6bec8;line-height:1.7}.modal-close{float:right;font-size:25px;background:transparent;border:0;color:#fff}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:27px 0}.help-grid div{border-bottom:1px solid #28414a;padding-bottom:12px}.help-grid strong{font-size:12px;display:block;color:#a7e1de}.help-grid small{font-size:11px;color:#8ba6ad;display:block;margin-top:5px}.primary-action{padding:12px 18px;background:#26535b;color:#e7ffff;border:1px solid #6fbab8;border-radius:3px;font-size:11px;letter-spacing:1px;font-weight:700}
@media(max-width:1250px){.top-center{display:none}.left-panel{width:265px;left:10px;padding:15px}.right-panel{width:268px;right:10px;padding:15px}.scene-info{width:400px;left:calc(50% - 200px)}.scene-info h1{font-size:32px}.view-tools{right:286px}.bottom-left{min-width:190px}.bottom-bar{gap:12px;padding:0 12px}.cam{min-width:79px}.cam span{font-size:8px}}
@media(max-width:900px){.topbar{height:68px;padding:0 13px}.brandname{font-size:17px}.brand-suffix{display:none}.brand-eyebrow{font-size:7px}.system-pill{font-size:8px}.panel{top:auto;bottom:76px;max-height:42vh}.left-panel{left:10px;width:48%;padding:14px}.right-panel{right:10px;width:48%;padding:14px}.panel-header h2{font-size:15px}.scene-info{top:90px;width:90%;left:5%}.scene-info h1{font-size:27px}.scene-desc{font-size:9px}.view-tools{right:10px;top:87px;transform:scale(.84);transform-origin:top right}.bottom-bar{height:65px}.bottom-left{display:none}.bottom-bar nav{justify-content:center}.cam{min-width:54px}.cam span{display:none}.bottom-data{display:none}}
@media(max-width:530px){.right-panel{display:none}.left-panel{width:calc(100% - 20px);max-height:36vh}.scene-info{top:89px}.scene-info h1{font-size:23px}.view-tools{top:195px}.top-right{gap:4px}.system-pill{letter-spacing:0}.bottom-bar nav{gap:2px}.cam{min-width:45px}}