:root{color-scheme:dark;--bg:#07131c;--deep:#091923;--panel:#0b1c27;--panel2:#102631;--line:#29424c;--muted:#7895a3;--txt:#e6f4f5;--cyan:#46daca;--gold:#ffc577;--red:#ec8183;--mono:ui-monospace,SFMono-Regular,Consolas,monospace;--sans:Inter,'Segoe UI',Arial,sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}body{font:13px var(--sans);background:var(--bg);color:var(--txt)}button,input,select{font:inherit}button{cursor:pointer;border:0;color:inherit;transition:background .18s,border-color .18s,transform .18s}button:hover{filter:brightness(1.22)}button:active{transform:scale(.97)}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px} .mono{font-family:var(--mono)}.eyebrow{font:700 10px var(--mono);letter-spacing:1.6px;color:var(--cyan)}.muted{color:#94bdc2}.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;background:#071720;position:relative;z-index:5;padding:0 27px}.identity{display:flex;align-items:center;gap:12px;min-width:290px}.identity strong{font-size:17px;letter-spacing:1.45px;font-weight:800}.identity small{display:block;font-size:9px;letter-spacing:1.65px;margin-top:5px;color:#83a4af}.identity small b{color:var(--cyan)}.mark{width:43px;height:43px;color:var(--cyan)}.mark svg{height:100%;width:100%}.header-center{display:flex;align-items:center;gap:13px;color:#b9d0d4;font:600 10px var(--mono);letter-spacing:1.05px}.live-dot{display:inline-block;background:#44dfb0;width:7px;height:7px;border-radius:50%;box-shadow:0 0 10px #40e9ab;flex-shrink:0}.header-line{height:15px;border-left:1px solid #40606d;margin:0 10px}.top-actions{display:flex;gap:8px}.top-actions button{height:36px;border:1px solid var(--line);background:#10232d;border-radius:4px;padding:0 13px;font:700 10px var(--mono);letter-spacing:.7px}.top-actions .accent-button{background:#49d9ca;color:#06262c;border-color:#49d9ca}.screen{height:calc(100vh - 76px);display:flex;min-height:0}.sidebar{background:#0a1a24;position:relative;z-index:3;flex-shrink:0;overflow:hidden}.sidebar.left{width:262px;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:25px 17px 18px}.sidebar.right{width:337px;border-left:1px solid var(--line);display:flex;flex-direction:column}.section-header,.nav-group-title{display:flex;justify-content:space-between;align-items:center;font:700 10px var(--mono);letter-spacing:1.1px;color:#89aab6}.section-header .version,.nav-group-title span:last-child{font:600 9px var(--mono);color:#537684}.site-info{border:1px solid #274451;margin:24px 0 27px;padding:16px 13px 14px;background:linear-gradient(137deg,#16313d,#0d2530 72%);position:relative;overflow:hidden}.site-info:before{content:'';position:absolute;width:145px;height:145px;border:1px solid #4dd7cb2e;transform:rotate(43deg);right:-65px;top:-54px}.site-name{font-size:20px;font-weight:850;line-height:1.18;letter-spacing:.4px;margin:13px 0}.site-name em{font-style:normal;color:#56ded1}.site-details{color:#d4e3e9;font:600 10px var(--mono)}.dot-sep{color:#54dcca}.site-overline{font:600 8px var(--mono);color:#678f9d;letter-spacing:.8px;margin-top:17px}.zone-list{margin-top:13px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#2e5260 transparent;padding-right:2px}.zone-btn{width:100%;display:flex;gap:10px;text-align:left;background:transparent;padding:11px 8px;margin:2px 0;border:1px solid transparent;border-left:2px solid transparent}.zone-btn:hover{background:#15303c}.zone-btn.selected{background:#123440;border-color:#305d62;border-left-color:var(--cyan)}.zone-number{display:grid;place-items:center;color:#5b9cab;font:700 11px var(--mono);width:26px;height:27px;border:1px solid #2d4b54;margin-top:2px}.zone-btn.selected .zone-number{color:#82ffe6;border-color:#49d9ca}.zone-copy{min-width:0;flex:1}.zone-copy strong{font:700 11px var(--sans);letter-spacing:.3px;display:block}.zone-copy small{font:600 9px var(--mono);color:#7093a0;margin-top:7px;display:block}.zone-right{width:7px;height:7px;border-radius:100%;background:#52cda7;margin-top:8px}.left-footer{margin-top:auto;padding-top:22px;border-top:1px solid var(--line)}#miniMap{display:block;width:100%;height:145px;border:1px solid #23434f;background:#0c2632;margin-top:14px;cursor:crosshair}.map-footer{display:flex;gap:10px;flex-wrap:wrap;margin-top:11px;color:#7e9da9;font:600 8px var(--mono)}.map-footer span:last-child{margin-left:auto;color:#4fbdaf}.legend-dot{display:inline-block;width:5px;height:5px;margin-right:5px;vertical-align:middle;border-radius:100%}.visualizer{position:relative;flex:1;min-width:0;background:#11232e;overflow:hidden}#viewport{width:100%;height:100%;display:block;cursor:grab;touch-action:none}#viewport:active{cursor:grabbing}.viewport-shading{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#07141bf0 0%,#07141b70 16%,transparent 40%,transparent 68%,#061119e0 100%),linear-gradient(90deg,#05131c99 0%,transparent 32%)}.view-head{position:absolute;top:29px;left:30px;pointer-events:none}.small-pill{font:700 10px var(--mono);letter-spacing:1.5px;border:1px solid #3b7978;color:#c5ece6;display:inline-flex;align-items:center;gap:9px;background:#0a3339ba;padding:8px 11px;border-radius:2px}.small-pill .live-dot{width:6px;height:6px}.view-head h1{font-size:clamp(24px,2.4vw,39px);margin:18px 0 10px;line-height:1.09;letter-spacing:1px;font-weight:860;text-shadow:0 4px 30px #06151a}.view-head h1 span{color:#58e1d1}.view-sub{font:650 9px var(--mono);letter-spacing:.5px;color:#b0c6c7}.view-sub b{color:#57d7c2;margin:0 5px}.camera-help{position:absolute;right:15px;top:31px;display:flex;gap:5px;flex-direction:column;align-items:flex-end;pointer-events:none}.camera-help span{padding:5px 8px;color:#9cb7b9;font:650 9px var(--mono);background:#0d2633b8;border:1px solid #2c4a56}.floating-stats{position:absolute;top:210px;left:30px;display:flex;gap:20px;pointer-events:none}.float-stat{border-left:2px solid #51cebd;padding-left:10px;min-width:100px}.float-stat span,.float-stat small{display:block;font:700 9px var(--mono);color:#a0bec5;letter-spacing:.5px}.float-stat strong{font:800 24px var(--mono);display:block;color:white;margin:7px 0}.float-stat small{font-size:8px;color:#66939f}.view-toolbar{position:absolute;left:24px;bottom:210px;display:flex;gap:6px}.toolbutton{background:#0a2633d9;border:1px solid #2a5260;border-radius:3px;padding:10px 13px;color:#b7d2d5;font:700 10px var(--mono);letter-spacing:.45px}.toolbutton.active{color:#83f3df;border-color:#52b9ac;background:#1b4748d9}.bottom-hud{position:absolute;bottom:13px;left:16px;right:16px;min-height:179px;background:#091a24ed;border:1px solid #2c515e;backdrop-filter:blur(16px);padding:12px 15px 10px;box-shadow:0 6px 22px #0005}.hud-title{display:flex;justify-content:space-between;align-items:center}.hud-badges{display:flex;gap:13px;align-items:center;font:600 9px var(--mono);color:#6d98a3}.status-pill{border-radius:2px;background:#16494380;color:#56dec1;border:1px solid #3c8079;padding:5px 7px;font-size:9px}.hud-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:9px}.kpi{border-right:1px solid #28444f;padding-right:6px}.kpi:last-child{border:none}.kpi>div{font:700 9px var(--mono);color:#a5c1c7}.kpi>div span{font-size:8px;color:#658e9c;margin-left:3px}.kpi strong{display:block;font:770 clamp(18px,2vw,27px) var(--mono);color:#e6f5f3;letter-spacing:-1px;margin:5px 0 2px}.kpi:nth-child(2) strong{color:#4ce5c6}.kpi:nth-child(3) strong{color:#ffc579}.kpi small{font:600 8px var(--mono);letter-spacing:.35px;color:#628892}.chart-row{margin-top:10px;position:relative}.chart-key{position:absolute;top:-19px;right:2px;font:600 9px var(--mono);display:flex;gap:10px;color:#98b5be}.chart-key i{display:inline-block;width:7px;height:7px;margin-right:4px}#flowChart{width:100%;height:40px;display:block}.time-axis{display:flex;justify-content:space-between;font:600 8px var(--mono);color:#587d88;margin-top:3px}.right-title{padding:23px 20px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.right-title h2{font-size:22px;letter-spacing:1px;margin:9px 0 0}.right-icon{width:34px;height:34px;border:1px solid #355b67;display:grid;place-items:center;color:#49d9ca;font-size:21px}.controls-scroll{overflow-y:auto;min-height:0;scrollbar-color:#31515c transparent;scrollbar-width:thin;flex:1;padding:0 20px 25px}.ops-row{display:flex;justify-content:space-between;margin:17px 0;font:700 10px var(--mono);letter-spacing:.5px;color:#9fbcc5}.status-light{font-size:9px;color:#4ce2b4}.status-light i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#50e2ba;margin-right:5px}.play-commands{display:grid;grid-template-columns:1fr 1fr;gap:8px}.play-commands button{padding:13px 8px;font:750 11px var(--mono);letter-spacing:.4px;border-radius:3px}.control-main{background:#1a514a;color:#83ead4;border:1px solid #398978}.control-danger{background:#4e2b36;color:#f4a4a5;border:1px solid #8b4654}.control-section{border-top:1px solid #25434f;margin-top:22px;padding-top:18px}.section-head{display:flex;justify-content:space-between;color:#d3eced;font:750 10px var(--mono);letter-spacing:.5px;margin-bottom:19px}.section-head .tiny{font:600 8px var(--mono);color:#628b9a;letter-spacing:0}.slider-label{display:flex;justify-content:space-between;align-items:baseline;margin:14px 0 10px;color:#a9c7cd;font-size:11px}.slider-label output{color:#5de9d0;font:750 11px var(--mono)}input[type=range]{appearance:none;width:100%;height:4px;display:block;outline:0;background:linear-gradient(90deg,#54d7c6 60%,#23434c 60%);border-radius:10px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:11px;height:11px;background:#78f1dc;border:2px solid #164a4e;border-radius:100%;box-shadow:0 0 0 2px #2c7c79}.range-limits{display:flex;justify-content:space-between;color:#5c7f8d;font:600 9px var(--mono);margin-top:8px}.select-control{width:100%;background:#0f2b37;color:#d1e7e7;border:1px solid #31525d;border-radius:3px;padding:11px;outline:none;font:650 11px var(--sans)}.scenario-note{font-size:10px;line-height:1.5;color:#7a9eaa;margin-top:10px}.materials-list{display:flex;flex-direction:column;gap:12px}.material-item .material-top{display:flex;justify-content:space-between;font-size:10px;color:#b8cdd2;margin-bottom:7px}.material-item .material-top strong{font:700 11px var(--mono);color:#deeef1}.material-bar{height:5px;border-radius:1px;background:#25404a}.material-bar div{height:100%;border-radius:1px;min-width:1px}.stream-footer{border-top:1px dashed #2d4b56;display:flex;justify-content:space-between;margin-top:16px;padding-top:13px;align-items:center;font:700 9px var(--mono);color:#91b7be}.stream-footer strong{font:800 19px var(--mono);color:#4bdac4}.unit-details{padding:14px;background:#102c38;border:1px solid #294b56;margin-top:10px}.unit-details strong{font-size:12px;color:#daf1ec;display:block}.unit-details small{font:600 10px var(--mono);color:#77a1a8;display:block;margin-top:7px}.unit-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.unit-metrics b{font:700 12px var(--mono);color:#6adfc8}.unit-actions{display:flex;gap:7px;margin-top:9px}.unit-actions button{flex:1;font:700 9px var(--mono);padding:10px 4px;border:1px solid #345766;background:#193541;color:#b1e7df;border-radius:2px}.event-log{display:flex;flex-direction:column;gap:11px}.event{border-left:2px solid #3caeab;padding:0 0 1px 10px}.event.warning{border-left-color:#d7a35b}.event.danger{border-left-color:#df6e7f}.event strong{display:block;font:700 10px var(--mono);color:#d1e8e8}.event small{display:block;color:#6c9ba5;font:600 9px var(--mono);margin:4px 0}.event p{font-size:10px;color:#8caeb5;margin:5px 0;line-height:1.55}.right-footer{padding:13px 20px 16px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.right-footer span{font:600 8px var(--mono);color:#618896}.right-footer strong{display:block;margin-top:6px;font:700 10px var(--mono);color:#b9d5d8}#toast{position:absolute;right:20px;top:120px;background:#0f333d;border:1px solid #48b6af;color:#bff8ed;font:700 11px var(--mono);padding:12px;pointer-events:none;opacity:0;transform:translateY(-8px);transition:.25s}#toast.visible{opacity:1;transform:translateY(0)}.fatal{position:fixed;z-index:100;inset:14%;background:#132735;padding:30px;border:2px solid #e77c75;border-radius:8px;color:#f4d9d6}.fatal[hidden]{display:none}@media(max-width:1300px){.sidebar.left{width:208px;padding:17px 10px}.sidebar.right{width:304px}.controls-scroll{padding:0 14px}.left-footer{display:none}.floating-stats{top:190px;gap:8px}.float-stat strong{font-size:19px}.view-head{left:19px}.bottom-hud{padding:10px}.topbar{padding:0 13px}.header-center{display:none}}@media(max-width:980px){.sidebar.left{width:155px}.zone-btn{padding:9px 3px}.zone-number{width:20px}.zone-copy strong{font-size:10px}.sidebar.right{width:270px}.floating-stats{display:none}.view-head h1{font-size:24px}.view-sub{display:none}.camera-help{display:none}.top-actions span{display:none}.identity{min-width:0}.identity small{display:none}.kpi strong{font-size:18px}.bottom-hud{min-height:150px}.view-toolbar{bottom:188px}.toolbutton span{display:none}}@media(max-width:740px){.sidebar.left{display:none}.sidebar.right{width:200px}.right-title{padding:13px}.right-title h2{font-size:16px}.controls-scroll{padding:0 8px}.right-footer{padding:9px;grid-template-columns:1fr 1fr}.topbar{height:59px}.screen{height:calc(100vh - 59px)}.identity strong{font-size:12px}.mark{width:33px;height:33px}.top-actions button{height:28px;padding:0 9px}.view-head{top:15px;left:10px}.view-head h1{margin-top:10px;font-size:19px}.small-pill{font-size:8px}.bottom-hud{bottom:5px;left:4px;right:4px}.kpi>div{font-size:7px}.kpi small{display:none}.kpi strong{font-size:14px}.hud-row{gap:4px}.chart-row{margin-top:15px}.view-toolbar{bottom:175px;left:6px}.toolbutton{padding:8px}.play-commands{grid-template-columns:1fr}.section-head .tiny{display:none}}
@media(max-width:600px){.screen{flex-direction:column}.sidebar.right{width:100%;height:44%;border-left:0;border-top:1px solid var(--line);order:2}.visualizer{flex:1 1 auto;min-height:0}}