:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:#d8e5ee;background:#07121b;font-synthesis:none}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid #56e4e0;outline-offset:3px}.app-shell{display:grid;grid-template-columns:286px minmax(0,1fr) 292px;height:100vh;min-height:580px}.sidebar,.inspector{background:#0c1b28;min-height:0;display:flex;flex-direction:column;z-index:4}.sidebar{border-right:1px solid #243947}.inspector{border-left:1px solid #253a48}.brand{height:76px;padding:18px 17px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #243746}.brand-icon{height:38px;width:38px;border:1px solid #178e96;background:linear-gradient(145deg,#173a43,#0b2835);color:#47d7d7;border-radius:10px;display:flex;justify-content:center;align-items:center;font-size:35px;line-height:1;font-weight:400;box-shadow:0 0 22px #1c9d9d22}.brand-name{font-size:16px;letter-spacing:.7px;font-weight:900;color:#f0f9fe}.brand-name span{color:#35c9cc;font-weight:500}.brand-caption{font-size:8px;letter-spacing:1.1px;color:#7a95a7;margin-top:4px;white-space:nowrap}.side-scroll,.inspector-scroll{flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#284455 transparent}.side-scroll{padding:18px 17px 22px}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;color:#8da6b7;font-size:10px;font-weight:800;letter-spacing:1.25px}.section-head.second{margin-top:25px;margin-bottom:13px}.tiny-dot{background:#2adacc;height:5px;width:5px;border-radius:50%;box-shadow:0 0 12px #34dcca}.control-pills{display:flex;gap:8px;margin-bottom:18px}.btn{border:1px solid #31515d;background:#133442;color:#dce8eb;border-radius:7px;padding:9px 13px;font-size:11px;font-weight:700;transition:background .15s,border-color .15s}.btn:hover{background:#235266;border-color:#39969c}.btn-run{background:#1a5e63;border-color:#318e8f;flex:1;color:#dbfff9}.icon-btn{font-size:20px;line-height:16px}.control-row{display:flex;align-items:center;justify-content:space-between;margin:15px 0 8px;font-size:11px;color:#9cb2c2}.control-row b{font-size:11px;color:#e3f5fa;font-weight:700;font-variant-numeric:tabular-nums}.sidebar input[type=range]{display:block;width:100%;margin:0;accent-color:#2fd6cd;height:5px;background:transparent;cursor:pointer}.control-toggles{margin-top:20px;padding:15px 0 2px;border-top:1px solid #213541;display:grid;gap:13px}.control-toggles label{display:flex;align-items:center;gap:10px;font-size:11px;color:#acbecc;cursor:pointer}.control-toggles input{accent-color:#2dcac4;width:15px;height:15px}.scenario-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px}.scenario-grid button,.chart-tabs button{border:1px solid #273e4b;color:#a3b9c9;background:#0c2431;border-radius:5px;font-size:10px;min-height:32px}.scenario-grid button:hover,.chart-tabs button:hover{border-color:#2a9b9e}.scenario-grid button.active,.chart-tabs button.active{background:#155356;border-color:#2caeb1;color:#adf9f2}.clock-control label{display:flex;justify-content:space-between;color:#b6c9d4;font-size:11px;margin-bottom:10px}.clock-control b{color:#5fe0d8}.clock-sub{font-size:10px;display:block;color:#748f9f;margin-top:10px}.sidebar-foot,.inspector-foot{display:flex;align-items:center;gap:8px;padding:16px 18px;border-top:1px solid #263b47;color:#688b9e;font-size:9px;letter-spacing:.8px}.version{margin-left:auto}.led{width:7px;height:7px;background:#33d8b4;border-radius:100%;box-shadow:0 0 10px #33d8b4}.workspace{display:flex;flex-direction:column;min-width:0;min-height:0;background:#071823}.topbar{height:58px;flex:none;display:flex;justify-content:space-between;align-items:center;padding:0 24px;border-bottom:1px solid #203441;background:#0d202b}.topbar-title{display:flex;align-items:center;gap:11px;font-size:11px;font-weight:800;color:#d6e8ef;letter-spacing:.7px}.crumb,.slash{color:#738e9e}.release{border:1px solid #266c64;background:#103b3d;padding:5px 7px;border-radius:4px;font-size:8px;letter-spacing:1px;color:#58d9c5}.topbar-right{display:flex;align-items:center;gap:8px}.top-note{color:#738d9c;font-size:9px;letter-spacing:.6px;margin-right:8px}.btn-outline{background:transparent;padding:8px 10px;font-size:10px;border-color:#3a5865}.metric-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:107px;flex:none;padding:14px 18px;background:#0b1b29;border-bottom:1px solid #28404e}.metric{padding:4px 15px;border-right:1px solid #273c4b;min-width:0}.metric:last-child{border:0}.metric>span{color:#7e9baa;font-weight:800;font-size:9px;letter-spacing:1.15px}.metric div{display:flex;align-items:baseline;gap:6px;margin:7px 0 4px;white-space:nowrap}.metric strong{font-weight:700;color:#f0fbff;font-size:clamp(17px,1.65vw,27px);font-variant-numeric:tabular-nums;letter-spacing:-1px}.metric em{font-style:normal;color:#69c9c9;font-size:10px}.metric small{display:block;color:#7191a1;font-size:9px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.viewport-section{flex:1;min-height:255px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 55%,#1b4351,#102530 65%,#081622)}#scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}#scene:active{cursor:grabbing}.scene-gradient{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#071923a8 0%,transparent 23%,transparent 74%,#061c26b8 100%)}.scene-top-left{position:absolute;top:22px;left:25px;pointer-events:none;text-shadow:0 2px 8px #07212a}.scene-label{letter-spacing:1.6px;color:#5ee1dc;font-size:9px;font-weight:800}.scene-top-left h1{margin:8px 0 4px;font-size:clamp(17px,2.05vw,27px);letter-spacing:1.9px;color:white;font-weight:850}.scene-top-left p{margin:0;color:#c6dde5;font-size:10px}.scene-tools{position:absolute;top:25px;right:19px;display:grid;gap:6px}.scene-tools button{width:33px;height:33px;border-radius:6px;color:#e3f9fa;font-size:22px;border:1px solid #436679;background:#0b2738cb}.scene-tools button[aria-pressed=false]{color:#66808b}.scene-tools button:hover{background:#1b5361}.world-labels{position:absolute;inset:0;pointer-events:none}.world-label{position:absolute;font-size:9px;letter-spacing:.9px;font-weight:800;border:1px solid #69ccd18f;border-radius:4px;background:#072b3cc4;color:#e1ffff;padding:6px 7px;text-transform:uppercase;white-space:nowrap;transform:translate(-50%,-50%);text-shadow:0 1px 3px black;box-shadow:0 2px 15px #04151a66;pointer-events:auto;cursor:pointer}.world-label:hover{background:#186878}.world-label.active{background:#167c81;border-color:#b3eeef}.view-footer{position:absolute;bottom:13px;left:22px;right:20px;display:flex;align-items:center;gap:15px;color:#b4cbd3;font-size:9px;letter-spacing:.35px;pointer-events:none}.view-footer>span{display:inline-flex;align-items:center;gap:6px}.view-tip{margin-left:auto;color:#93b8c5;font-size:8px;letter-spacing:.45px}.legend-icon{width:8px;height:8px;border-radius:50%}.legend-icon.feed{background:#438b9e}.legend-icon.teal{background:#3bd6c9}.legend-icon.brine{background:#6d9ac7}.lower{display:grid;grid-template-columns:1.04fr .96fr;gap:1px;flex:none;min-height:223px;background:#273f4d;border-top:1px solid #314856}.panel{background:#0b1c29;padding:17px 22px 13px;min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.eyebrow{display:block;color:#5acccc;font-size:9px;letter-spacing:1.3px;font-weight:800}.panel h2{font-size:14px;font-weight:750;letter-spacing:.1px;color:#e2f1f7;margin:5px 0 3px}.chart-tabs{display:flex;gap:4px}.chart-tabs button{min-height:28px;padding:0 8px}.panel-chart>canvas{display:block;width:100%;height:116px;margin-top:8px}.chart-key{display:flex;align-items:center;gap:8px;font-size:9px;color:#9db6c5;margin-top:6px}.primary-dot{height:7px;width:7px;border-radius:50%;background:#39d6ca}.chart-side{margin-left:auto;font-size:8px;color:#6f8f9f;letter-spacing:.6px}.flow-head-dot{font-size:8px;color:#50c7bc;border:1px solid #2d817b;padding:5px 7px;border-radius:5px}.flow-diagram{display:grid;grid-template-columns:1fr 12px 1fr 12px 1fr;gap:3px;align-items:center;margin:24px 0 21px}.flow-diagram>div{padding:13px 9px;min-width:0;text-align:center;background:#112e3b;border:1px solid #294958;border-radius:7px}.flow-diagram>div.product-water{background:#144545;border-color:#277f7b}.flow-diagram span:not(.flow-arrow){display:block;font-size:8px;color:#8faebf;letter-spacing:.5px;white-space:nowrap}.flow-diagram strong{font-size:17px;color:#edfaff;display:inline-block;margin:6px 0 2px;font-variant-numeric:tabular-nums}.flow-diagram small{display:block;font-size:9px;color:#6db3b8}.flow-arrow{text-align:center;font-size:22px;color:#48c5c2}.flow-bottom{border-top:1px solid #2c4655;padding-top:13px;display:flex;gap:7px;align-items:center;color:#829eaf;font-size:9px}.flow-bottom b{color:#d8f2f6;margin-left:5px}.push{margin-left:auto}.workspace-foot{height:28px;flex:none;background:#071722;display:flex;align-items:center;justify-content:space-between;padding:0 17px;color:#577989;font-size:8px;letter-spacing:.65px}.inspector-scroll{padding:21px 17px}.radar{font-size:15px;color:#35bebb}.inspector-hint{font-size:11px;line-height:1.6;color:#829eaf;margin:-4px 0 15px}.zone-list{display:grid;gap:5px}.zone-card{background:#102634;border:1px solid #263f4e;border-radius:6px;padding:10px 9px;display:flex;align-items:center;gap:10px;text-align:left;color:#bed5dd}.zone-card:hover{border-color:#4a9ca1;background:#143b46}.zone-card.active{border-color:#39bab5;background:#14464a}.zone-index{font-size:10px;color:#44bbbd;font-weight:800;width:18px}.zone-text{flex:1;min-width:0}.zone-text strong{font-size:10px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zone-text small{display:block;font-size:9px;color:#698d9e;margin-top:4px}.zone-chev{color:#549ca3;font-size:18px}.zone-details{background:#102837;border:1px solid #2e4b59;padding:13px;border-radius:7px}.zone-details h3{margin:0 0 7px;font-size:13px;color:#e3f8f8}.zone-details p{margin:0;color:#8faab9;font-size:10px;line-height:1.5}.zone-details ul{margin:9px 0 0;padding:0;list-style:none;max-height:125px;overflow:auto}.zone-details li{display:flex;justify-content:space-between;gap:5px;margin:6px 0;color:#7e9ead;font-size:9px}.zone-details li b{color:#cde7e9;font-variant-numeric:tabular-nums}.reservoir-widget{border:1px solid #2d4957;border-radius:7px;padding:13px;background:#102836}.reservoir-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;font-size:10px;color:#aec4d0}.reservoir-top b{font-size:18px;color:#57d7ce}.tank-bar{background:#253d4a;height:14px;border-radius:6px;overflow:hidden;border:1px solid #416270}.tank-bar>div{width:0%;height:100%;background:linear-gradient(90deg,#187b86,#38d3ca);transition:width .2s}.storage-meta{display:flex;justify-content:space-between;color:#688c9c;font-size:9px;margin-top:11px}.alerts{display:grid;gap:7px}.success-note,.warning-note,.danger-note{display:block;border:1px solid #235b55;border-radius:6px;color:#72d9c8;font-size:10px;padding:11px;line-height:1.5;background:#11342f}.warning-note{border-color:#866333;background:#31291f;color:#f2c885}.danger-note{border-color:#964a4b;background:#3d2228;color:#ff999c}.inspector-foot{flex-direction:column;align-items:flex-start;gap:3px}.inspector-foot strong{font-size:28px;font-variant-numeric:tabular-nums;letter-spacing:-1.3px;color:#e5f5f9}.inspector-foot small{font-size:9px}.loading-screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#0a2f3bfa,#061723fc);z-index:3;gap:12px;transition:opacity .4s;color:#bbd7e1;text-align:center}.loading-screen.hidden{opacity:0;pointer-events:none}.loader-symbol{font-size:65px;color:#4be2d5;line-height:1}.loading-screen strong{font-size:12px;letter-spacing:1.7px}.loading-screen span{font-size:10px;color:#7baaba}.loader-track{width:215px;height:3px;background:#2a5564;border-radius:10px;overflow:hidden}.loader-track div{height:100%;background:#4ee0d3;width:60%;animation:loading 1.5s ease-in-out infinite}@keyframes loading{0%{transform:translateX(-100%)}100%{transform:translateX(280%)}}.error-banner{position:absolute;z-index:5;top:100px;left:25px;max-width:450px;color:#ffe0dc;background:#6c2028ee;border:1px solid #ef7b80;border-radius:8px;padding:15px;line-height:1.5;font-size:12px}@media(max-width:1370px){.app-shell{grid-template-columns:246px minmax(0,1fr) 245px}.metric{padding:4px 8px}.topbar{padding:0 12px}.top-note{display:none}.view-tip{display:none}.flow-diagram strong{font-size:13px}.brand-caption{letter-spacing:.55px}.sidebar .side-scroll{padding:15px 13px}.inspector-scroll{padding:17px 12px}.panel{padding:16px 13px}}@media(max-width:1050px){.app-shell{grid-template-columns:230px minmax(0,1fr)}.inspector{display:none}.metric-bar{height:90px}.metric strong{font-size:18px}.topbar-right .btn{font-size:9px}.release{display:none}}@media(max-width:680px){html,body{height:auto;min-height:100%;overflow:auto}.app-shell{display:flex;flex-direction:column;height:auto}.sidebar{order:2;min-height:430px}.workspace{order:1;min-height:720px}.side-scroll{max-height:500px}.topbar{padding:8px;height:auto}.topbar-right{display:none}.metric-bar{height:auto;grid-template-columns:repeat(3,1fr);padding:8px}.metric{padding:8px 5px}.metric>span{font-size:8px}.metric strong{font-size:20px}.metric small{display:none}.viewport-section{height:430px;flex:0 0 430px}.scene-top-left h1{font-size:18px}.view-footer{bottom:12px;gap:7px;font-size:7px}.lower{display:block}.panel{min-height:190px}.workspace-foot{display:none}}
