:root{--bg:#071824;--navy:#0b2532;--panel:rgba(7,25,36,.92);--line:rgba(106,176,187,.22);--text:#e4eff0;--sub:#81a5ad;--teal:#53d2c7;--orange:#e9aa69;--muted:#678997;--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace;--font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html,body,#app{padding:0;margin:0;width:100%;height:100%;overflow:hidden;background:#061824;color:var(--text);font-family:var(--font)}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--teal);outline-offset:2px}#viewport{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none}#viewport:active{cursor:grabbing}
.topbar{position:absolute;top:0;left:0;right:0;height:82px;display:flex;align-items:center;gap:32px;padding:0 26px;background:linear-gradient(180deg,rgba(3,20,30,.96),rgba(3,20,30,.70));border-bottom:1px solid rgba(118,184,193,.17);pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;white-space:nowrap}.brand-mark{font-size:43px;color:var(--teal);font-weight:100;line-height:1}.brand strong{font-size:16px;letter-spacing:.14em;display:block;font-weight:800}.brand strong em{font-style:normal;color:var(--teal)}.brand span:not(.brand-mark){font:9px var(--mono);letter-spacing:.19em;color:var(--sub);display:block;margin-top:5px}.brand span b{color:var(--orange)}.top-stats{display:flex;gap:40px;margin:0 auto}.top-stats>div>span{font:10px var(--mono);color:var(--muted);letter-spacing:.13em;display:block;margin-bottom:7px}.top-stats>div>strong{font:700 17px var(--mono);letter-spacing:.03em}.top-stats small{font:11px var(--mono);color:var(--sub)}#status-pill{font-size:13px;color:#9fe1cc}.dot,.pulsing-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#69debd;box-shadow:0 0 13px #36d6b0;margin-right:7px}.pulsing-dot{animation:pulse 2.4s infinite}@keyframes pulse{50%{box-shadow:0 0 18px #63dbc0;opacity:.65}}.icon-btn{border:1px solid var(--line);background:rgba(8,35,47,.8);color:var(--text);border-radius:50%;width:34px;height:34px;font-weight:700;font-size:15px}
.left-stack{position:absolute;top:103px;left:20px;width:290px;display:flex;flex-direction:column;gap:11px;max-height:calc(100% - 172px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#275362 transparent;pointer-events:none}.left-stack>*{pointer-events:auto}.metric-card,.map-card{background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:17px 17px 16px;backdrop-filter:blur(12px);box-shadow:0 12px 40px #0002}.eyebrow{font:600 10px var(--mono);color:#9db8bc;letter-spacing:.105em}.right-mono{float:right;color:var(--teal);font:10px var(--mono)}.power-value{display:flex;align-items:baseline;gap:8px;margin:15px 0 0}.power-value strong{font:600 47px var(--mono);letter-spacing:-.055em;color:#e7fbf8}.power-value>span{color:var(--teal);font:600 14px var(--mono)}#power-graph{height:55px;width:100%;display:block;margin:6px 0 6px}.bar-track{background:#28434b;height:4px;width:100%;border-radius:2px;overflow:hidden}.bar-track i{display:block;height:100%;width:30%;background:linear-gradient(90deg,#317e96,#66e5c2);transition:width .25s}.metric-footer{display:flex;justify-content:space-between;align-items:center;margin-top:11px;font:9px var(--mono);color:var(--sub);letter-spacing:.07em}.metric-footer strong{color:var(--teal);font-size:12px}.compact{padding-top:16px;padding-bottom:9px}.compact .eyebrow{margin-bottom:12px}.reading{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid rgba(106,176,187,.10);font-size:11px;color:var(--sub)}.reading strong{color:var(--text);font:11px var(--mono)}.map-card{padding-bottom:13px}.map-shell{margin-top:13px;position:relative;overflow:hidden;border:1px solid #235465;background:#071f2b;border-radius:4px;aspect-ratio:1.28}.map-shell canvas{width:100%;height:100%}.map-corner{position:absolute;right:11px;top:10px;font:12px var(--mono);color:var(--teal)}.map-footer{display:flex;justify-content:space-between;margin-top:12px;font:9px var(--mono);color:#9fb6b8}.legend-dot{width:6px;height:6px;display:inline-block;border-radius:50%;margin-right:5px}.legend-dot.teal{background:var(--teal)}.legend-dot.orange{background:var(--orange)}.legend-dot.white{background:white}
.right-panel{position:absolute;right:20px;top:103px;width:276px;max-height:calc(100% - 167px);overflow-y:auto;padding:20px 17px 18px;background:var(--panel);border:1px solid var(--line);border-radius:9px;box-shadow:0 12px 40px #0003;scrollbar-width:thin;scrollbar-color:#275362 transparent;backdrop-filter:blur(14px)}.aside-head{display:flex;justify-content:space-between;margin-bottom:19px}.console-num{font:11px var(--mono);color:var(--teal)}.control-label{display:flex;justify-content:space-between;align-items:center;margin:20px 0 8px;font:10px var(--mono);letter-spacing:.035em;color:#a5bbc0}.control-label strong{color:var(--teal);font-weight:700;font-size:11px}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:4px;display:block;border-radius:2px;background:linear-gradient(90deg,#1c8d90,#24516a);cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#a3f1e2;border:2px solid #265c65;border-radius:50%;box-shadow:0 0 0 3px #153d49}input[type=range]::-moz-range-thumb{width:11px;height:11px;background:#a3f1e2;border:2px solid #265c65;border-radius:50%}.range-extents{display:flex;justify-content:space-between;color:#678a96;font:9px var(--mono);margin-top:9px}.section-separator{border-top:1px solid var(--line);margin:22px -1px 19px}.section-caption{margin-bottom:14px}.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mode-button{height:41px;border:1px solid #28515c;background:rgba(28,67,78,.44);color:var(--teal);border-radius:5px;font-size:15px;text-align:center}.mode-button span{font:10px var(--mono);color:#cadfe0;margin-left:5px}.mode-button:hover{background:#1b4b57}.asset-select-wrap{display:grid;gap:8px}.asset-select-wrap select{width:100%;padding:11px 7px;border-radius:4px;background:#102d3b;border:1px solid #2b5a63;color:#dcefee;font:11px var(--mono)}.primary-btn{background:#42b8ac;color:#062331;border:0;font:800 10px var(--mono);letter-spacing:.07em;border-radius:4px;padding:12px 10px}.primary-btn:hover{background:#72dace}.readout{display:flex;justify-content:space-between;margin-top:16px;color:var(--sub);font:10px var(--mono);letter-spacing:.035em}.readout strong{color:#dceff0}
.bottom-controls{pointer-events:none;position:absolute;left:325px;right:309px;bottom:14px;height:42px;display:flex;justify-content:space-between;align-items:center;color:#cde4e4;background:rgba(6,25,37,.75);border:1px solid var(--line);padding:0 14px;border-radius:6px;white-space:nowrap}.bottom-label{font:9px var(--mono);color:#7fa6ac;letter-spacing:.08em}.bottom-label b{color:var(--teal);margin-left:8px;font-size:11px}.control-hint{font:9px var(--mono);color:#86a2a8}.control-hint b{color:#cce8e9}.control-hint i{border-left:1px solid #56838b;margin:0 7px}.crosshair{color:var(--teal);font-size:21px;margin-right:13px}.selection-card{position:absolute;bottom:77px;left:325px;width:278px;background:rgba(7,27,39,.94);border:1px solid #46b4ac;border-radius:8px;padding:17px;box-shadow:0 12px 38px #0006;backdrop-filter:blur(10px)}.selection-card>strong{display:block;margin-top:13px;font:700 19px var(--mono);color:white}.selection-card>span{display:block;color:var(--sub);font-size:12px;margin:4px 0 12px}.selection-details{border-top:1px solid var(--line);padding:13px 0;margin-top:9px;font:10px var(--mono);color:var(--sub)}.selection-details>div{display:flex;justify-content:space-between;padding:4px 0}.selection-details strong{color:var(--teal)}.selection-card .primary-btn{width:100%}.selection-close{position:absolute;right:9px;top:8px;background:none;border:0;color:#acc7cc;font-size:22px}.hidden{display:none!important}.toast{position:absolute;bottom:70px;left:50%;transform:translateX(-50%);padding:13px 20px;background:#123d49;color:#c2f4e7;border:1px solid #42aeab;border-radius:7px;font:12px var(--mono);box-shadow:0 10px 30px #0008}
dialog{color:#e5f4ef;background:#0a2737;border:1px solid #347c81;border-radius:9px;box-shadow:0 15px 80px #000b;max-width:560px;padding:26px 30px}dialog::backdrop{background:#020c14cb;backdrop-filter:blur(4px)}dialog h2{font:700 17px var(--mono);color:#a3eadd;letter-spacing:.03em}dialog p{font-size:13px;line-height:1.75;color:#b3cbd0}.close-dialog{position:absolute;right:15px;top:12px;background:none;border:0;color:white;font-size:24px}
#loading{position:absolute;z-index:60;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle at 50% 50%,#103e4a 0%,#051824 68%);transition:opacity .65s}#loading.done{opacity:0;pointer-events:none}.load-symbol{font-size:74px;color:#6de5d1;text-shadow:0 0 32px #35c8ad}.load-label{font-size:24px;font-weight:800;letter-spacing:.15em;margin-top:22px}.load-label span{color:#7ba8ae}.load-sub{font:11px var(--mono);letter-spacing:.19em;color:#6db1b8;margin-top:12px}.loading-line{width:240px;height:2px;background:#225b68;margin-top:30px;overflow:hidden}.loading-line i{display:block;width:38%;height:100%;background:#69e8d3;animation:load 1.5s infinite}@keyframes load{0%{transform:translateX(-110%)}100%{transform:translateX(390%)}}#load-status{color:#77aab2;font:10px var(--mono);margin-top:15px}
@media(max-width:1180px){.top-stats{gap:15px}.top-stats>div:nth-child(2){display:none}.right-panel{right:12px;width:243px}.left-stack{left:12px;width:245px}.bottom-controls{left:270px;right:270px}.control-hint{display:none}}
@media(max-width:740px){.topbar{padding:0 12px;height:65px}.brand-mark{font-size:33px}.brand strong{font-size:12px}.brand span:not(.brand-mark){font-size:7px}.top-stats{display:none}.left-stack{left:10px;top:78px;width:198px;gap:7px;max-height:calc(100% - 150px)}.metric-card,.map-card{padding:11px}.power-value strong{font-size:29px}.metric-footer{font-size:8px}.map-card{display:none}.right-panel{right:8px;top:78px;width:166px;padding:11px;max-height:calc(100% - 135px)}.aside-head .eyebrow{font-size:8px}.console-num{display:none}.control-label{font-size:8px}.control-label strong{font-size:9px}.range-extents{font-size:7px}.mode-button{font-size:10px;padding:0}.mode-button span{font-size:7px;margin:0}.bottom-controls{left:9px;right:9px;bottom:6px;padding:0 9px;height:31px}.bottom-label{font-size:8px}.bottom-label b{font-size:8px}.selection-card{left:10px;bottom:50px;width:240px}}
