:root{--bg:#0a1115;--panel:#101b20;--panel2:#142126;--line:#2b3c40;--line2:#263337;--text:#e1ebea;--muted:#738e91;--orange:#f5a765;--teal:#5adfc9;--red:#ff796e;--shadow:rgba(0,0,0,.43)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Inter,Arial,system-ui,sans-serif;font-size:13px}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,input:focus-visible{outline:2px solid var(--teal);outline-offset:3px}#shell{height:100%;width:100%;display:grid;grid-template-columns:292px minmax(350px,1fr) 303px;grid-template-rows:73px minmax(340px,1fr) 36px;overflow:hidden}.topbar{grid-column:1/4;grid-row:1;z-index:8;display:flex;align-items:center;justify-content:space-between;padding:0 22px 0 18px;background:#0c171bbf;border-bottom:1px solid #344348;backdrop-filter:blur(18px)}.brand{display:flex;gap:15px;align-items:center}.logo{display:flex;align-items:center;justify-content:center;font-size:27px;font-weight:900;width:43px;height:43px;border:1px solid #547075;background:#17282b;color:#dce8e5;letter-spacing:-5px}.logo span{color:#ee9869;font-size:15px}.brand strong{display:block;letter-spacing:2px;font-size:16px}.brand em{font-style:normal;color:#dc9874}.brand small{display:block;letter-spacing:2.2px;font-size:8px;color:#8da6a8;margin-top:5px}.head-actions{display:flex;align-items:center;gap:11px}.tag{font-size:10px;letter-spacing:1px;color:#a4d6c8}.pulse,.ok-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#63e4b6;margin-right:7px;box-shadow:0 0 12px #63e4b6aa;vertical-align:middle}.separator{height:21px;width:1px;background:var(--line);margin:0 6px}.tag.subtle{color:#869ca0}.button{padding:10px 12px;border:1px solid #3e5358;background:none;letter-spacing:1.1px;font-weight:750;font-size:10px}.button.primary{color:#112427;background:#dca576;border-color:#dca576}.button:hover{filter:brightness(1.18)}
#viewport{grid-column:2;grid-row:2;position:relative;min-width:0;background:#17242a;overflow:hidden}#sim-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none;cursor:grab}#sim-canvas:active{cursor:grabbing}.viewport-shade{position:absolute;pointer-events:none;inset:0;background:linear-gradient(180deg,rgba(4,11,16,.57),transparent 23%,transparent 66%,rgba(7,12,15,.76))}.view-caption{position:absolute;top:27px;left:28px;pointer-events:none;text-shadow:0 2px 15px #020608b0}.eyebrow,.view-caption .eyebrow{color:var(--orange);font-size:9px;letter-spacing:2px;font-weight:700}.view-caption h1{font-size:29px;margin:9px 0 6px;font-weight:800;letter-spacing:2.1px}.view-caption p{font-size:11px;max-width:350px;color:#cbd4d5;line-height:1.5;margin:0}.view-controls{position:absolute;top:27px;right:20px;display:flex;flex-direction:column;gap:5px;width:149px}.view-controls button{background:#0e1b20b8;text-align:left;color:#a9bcbd;border:1px solid #51666c4a;letter-spacing:.6px;font-size:9px;padding:9px 10px;backdrop-filter:blur(4px)}.view-controls button.active,.view-controls button:hover{background:#344244dd;border-left:3px solid #e7aa72;color:white}.coordinate-box{position:absolute;bottom:62px;left:23px;display:flex;flex-direction:column;gap:7px;letter-spacing:1px;font-size:9px;color:#afc3c5}.mode-tip{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.6px;color:#8da9aa;white-space:nowrap}.compass{position:absolute;bottom:60px;right:33px;display:flex;align-items:center;flex-direction:column;font-weight:700;font-size:10px;color:#d8e7e5;gap:3px}.compass i{font-size:21px;color:var(--orange);font-style:normal}
.panel{z-index:4;grid-row:2;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#476065 transparent;background:#101a1f;border-right:1px solid var(--line);padding:20px 18px 12px;min-width:0}.left-panel{grid-column:1}.right-panel{grid-column:3;border-right:none;border-left:1px solid var(--line);padding:20px 15px 12px}.section-heading{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}.section-heading small{font-size:10px;letter-spacing:2px;font-weight:800;color:var(--orange)}.section-heading strong{font-size:18px;letter-spacing:1.3px}.section-heading .sub{font-size:9px;color:var(--muted);letter-spacing:1.5px}.op-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:19px}.action{border:1px solid #3b5053;min-height:40px;letter-spacing:.5px;font-size:9px;font-weight:800;background:#16272c}.action.start{color:#9cdecc;border-color:#4b7169}.action.vent{color:#ffbd9a;border-color:#76533f}.action.vent.active{background:#663427;color:#fff}.control-group{border-top:1px solid var(--line2);padding-top:15px;margin-top:15px}.group-title{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.05px;color:#e9b385;font-weight:750}.group-title .number{color:#577078;font-size:10px}.slide-control{margin-top:18px}.slide-control>div{display:flex;align-items:center;justify-content:space-between}.slide-control label{font-size:11px;color:#b2c6c7}.slide-control output{font-size:10px;color:var(--orange);font-weight:bold}input[type=range]{display:block;width:100%;height:4px;accent-color:#dba574;cursor:pointer;margin:11px 0 8px}.slide-control small{font-size:9px;color:#6a8288}.compact .slide-control{margin-top:13px}.preset-row{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:20px 0 10px}.preset-row button{font-size:9px;padding:9px 2px;border:1px solid #34464b;background:#19282d;color:#b0c4c2}.preset-row button:hover{color:#f6b77c}
.mega-metric{background:radial-gradient(ellipse at top right,#1e4140,#152728 66%,#101f23);border:1px solid #33565a;padding:17px;margin-bottom:13px}.mega-metric .eyebrow{color:#8cbdac}.mega-value{font-size:46px;font-weight:850;letter-spacing:-2px;display:flex;align-items:baseline;gap:5px;margin:7px 0 11px;font-variant-numeric:tabular-nums}.mega-value small{font-size:14px;letter-spacing:0;color:#97bdb3}.meter{height:4px;background:#2b4144;overflow:hidden}.meter>i{display:block;background:linear-gradient(90deg,#57c7b5,#f3c077);height:100%;width:0%;transition:width .18s}.mega-bottom{display:flex;justify-content:space-between;margin-top:11px;font-size:8px;color:#88a2a0;letter-spacing:.4px}.mega-bottom strong{color:#a7e8ca;font-size:12px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.metric{border:1px solid #283a40;background:#152228;min-height:85px;padding:11px 8px}.metric small{display:block;font-size:8px;font-weight:750;letter-spacing:.8px;color:#8fa6a7}.metric strong{display:block;font-size:24px;margin:8px 0 5px;color:#edf1e9;font-variant-numeric:tabular-nums;white-space:nowrap}.metric i{font-style:normal;font-size:10px;color:#dcab7d;margin-left:4px;font-weight:500}.metric>span{font-size:7px;letter-spacing:.4px;color:#637f82}.chart-block,.geo-profile{border-top:1px solid var(--line);margin-top:15px;padding-top:13px}.chart-top,.chart-bottom,.geo-profile>div{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.7px;color:#92abad}.chart-top strong,.geo-profile strong{color:#e1e9e7;font-size:9px}.chart-top span{color:#c4966b}.chart-bottom{font-size:8px;color:#628186}.chart-block canvas,.geo-profile canvas{display:block;width:100%;height:97px;margin-top:12px}.geo-profile canvas{height:79px}.stats-list{margin-top:16px;padding:2px 0}.stats-list>div{display:flex;justify-content:space-between;border-top:1px solid #283a40;padding:10px 0;font-size:9px;letter-spacing:.35px}.stats-list span{color:#829fa0}.stats-list strong{color:#d2e1de}.geo-profile span{color:#efa66b}.disclaimer{font-size:8px;line-height:1.5;color:#708588;letter-spacing:.35px;padding:13px 0}.footer{grid-column:1/4;grid-row:3;background:#0b1418;border-top:1px solid #263b40;display:flex;justify-content:space-between;align-items:center;padding:0 17px;color:#779195;font-size:9px;letter-spacing:1px}.footer .ok-dot{width:5px;height:5px}#boot-screen{position:fixed;inset:0;z-index:100;background:#081216;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .7s}#boot-screen.hidden{opacity:0;pointer-events:none}#boot-screen .boot-mark{font-size:46px;color:#e4a875}#boot-screen h1{letter-spacing:5px;font-size:23px;margin:16px 0 4px}#boot-screen p{letter-spacing:2px;font-size:9px;color:#819c9f}.progress{width:210px;height:3px;background:#314344;margin-top:22px;overflow:hidden}.progress>i{display:block;width:45%;height:100%;background:#e7ad77;animation:load 1.3s ease-in-out infinite alternate}@keyframes load{to{transform:translateX(190%)}}dialog{border:1px solid #607379;background:#102025;color:#deeeee;max-width:510px;padding:26px;line-height:1.7;box-shadow:0 30px 120px #000c}dialog::backdrop{background:#000a}dialog h2{font-size:17px;letter-spacing:2px;color:#f3b280}dialog p{font-size:12px}
@media(max-width:1230px){#shell{grid-template-columns:240px minmax(250px,1fr) 250px}.view-controls{width:132px}.panel{padding-left:12px;padding-right:12px}.brand small{letter-spacing:1px}}@media(max-width:900px){#shell{grid-template-columns:220px minmax(280px,1fr) 0px}.right-panel{position:absolute;right:0;top:73px;bottom:36px;width:250px;transform:translateX(100%)}.head-actions{gap:4px}.view-controls{width:119px}.footer span:nth-child(2){display:none}}@media(max-width:620px){#shell{display:flex;flex-direction:column}.topbar{height:60px;flex-shrink:0}.brand strong{font-size:12px}.brand small{font-size:7px}.head-actions .subtle,.head-actions .separator,.head-actions .outline{display:none}#viewport{min-height:54vh;flex:1}.left-panel{height:42vh;overflow-y:auto}.right-panel{display:none}.footer{height:0;overflow:hidden}.view-controls{right:8px;top:11px;width:102px}.view-controls button{font-size:7px;padding:6px}.view-caption{left:11px;top:13px}.view-caption h1{font-size:18px}.view-caption p{max-width:160px}.mode-tip{display:none}}
