:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#d9e8ed;background:#08121b;font-synthesis:none;--cyan:#62d9e6;--gold:#efb567;--panel:#07131fe9;--line:#27404d;--muted:#7b97a4;}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
#world-canvas{position:fixed;inset:0;width:100%;height:100%;background:radial-gradient(circle at 50% 55%,#263b48,#08121b 70%);display:block;z-index:0}.grain{position:fixed;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.16),transparent 30%,transparent 65%,rgba(0,0,0,.18)),linear-gradient(0deg,rgba(2,8,15,.45),transparent 30%);opacity:.65}
.glass{background:linear-gradient(150deg,rgba(8,24,36,.96),rgba(6,17,28,.90));border:1px solid #2a3e4c;box-shadow:0 20px 60px #0008, inset 0 1px 0 #a8eaff0a;backdrop-filter:blur(16px)}
.eyebrow,.kicker,.tiny-label,.subtle,.microcopy,.loading-text,.build-label,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:1.3px}.eyebrow{font-size:9px;font-weight:800;color:#68a2b1;margin:0 0 4px}.kicker{font-size:9px;color:#60b8c8;font-weight:800}.subtle{font-size:9px;color:#72919c}.tiny-label{display:block;color:#72909e;font-size:9px;margin-bottom:5px;font-weight:700}
.topbar{position:fixed;top:0;left:0;right:0;height:80px;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:linear-gradient(90deg,#08131df5,#07111be0);border-bottom:1px solid #233743}.brand{display:flex;align-items:center;gap:13px}.brand-mark{width:44px;height:44px;display:grid;place-items:center;border:2px solid #70d9df;color:#e4f8fc;font-size:25px;font-weight:900;letter-spacing:-6px;transform:skewY(-8deg)}.brand-mark span{font-size:10px;color:var(--gold);padding-left:4px}.brand h1{font-size:19px;letter-spacing:2.5px;margin:0;white-space:nowrap}.brand h1 span{color:#719ca7;font-weight:400}.top-stats{display:flex;align-items:center;gap:38px}.top-stats strong{font-size:15px;letter-spacing:1px}.top-status{border:1px solid #2b645b;background:#0d302b;color:#81edcb;font:700 10px ui-monospace,monospace;padding:10px 12px;letter-spacing:1px}.live-dot{display:inline-block;width:7px;height:7px;margin-right:7px;background:#80e1aa;border-radius:50%;box-shadow:0 0 11px #45fac5;animation:pulse 1.8s infinite}.top-actions{display:flex;align-items:center;gap:14px}.build-label{font-size:9px;color:#658899}.small-action{background:#152936;border:1px solid #345060;padding:10px 12px;font:700 10px ui-monospace,monospace;letter-spacing:.5px}
.left-panel,.right-panel{position:fixed;top:94px;z-index:3;bottom:20px;overflow:auto;scrollbar-width:thin;scrollbar-color:#30505e transparent}.left-panel{left:18px;width:277px;display:flex;flex-direction:column}.right-panel{right:18px;width:288px;padding:18px}.pane-section{padding:18px 15px 14px}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.panel-led{width:7px;height:7px;background:var(--cyan);border-radius:100%;box-shadow:0 0 14px var(--cyan)}h2{font-size:19px;line-height:1.25;letter-spacing:1.1px;margin:4px 0 11px}h2 em{font-style:normal;color:var(--cyan)}.pane-intro{font-size:11px;line-height:1.65;color:#91a6ae;margin:0 0 13px}.level-list{display:flex;flex-direction:column;gap:4px}.level-btn{background:#10222d;border:1px solid transparent;color:#b9cad2;text-align:left;padding:7px 9px;display:flex;gap:12px;align-items:center;min-height:46px;transition:.2s}.level-btn:hover,.dest:hover{background:#173641;border-color:#416774}.level-btn.active{background:#143b47;border-color:#5ab9cb;color:#f7ffff;box-shadow:inset 3px 0 0 #80e6f1}.level-num{font:700 16px ui-monospace,monospace;color:#7c9eac}.level-btn.active .level-num{color:var(--cyan)}.level-btn strong{display:block;font-size:11px;letter-spacing:1.1px}.level-btn small{display:block;font-size:9px;letter-spacing:.2px;color:#7492a0;margin-top:2px}.destination-section{border-top:1px solid #253d49;flex:1;padding-top:17px}.destinations{display:flex;flex-direction:column;gap:2px}.dest{min-height:32px;display:flex;gap:8px;align-items:center;text-align:left;border:0;border-bottom:1px solid #1b303a;background:transparent;padding:4px 3px 4px 1px;color:#aabcc5}.dest.hub{color:#f2d4ae}.dest-index{font-size:11px;color:#62d9e6;width:26px}.dest.hub .dest-index{color:#f4b76b}.dest-text{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.dest-arrow{color:#5f92a1}.left-bottom{display:flex;align-items:center;gap:8px;border-top:1px solid #273a47;padding:13px 12px}.microcopy{font-size:8px;color:#6e9eac}.mono{font-size:10px;color:#c8dee7;flex:1}.left-bottom button{border:1px solid #52606b;background:#19303e;color:#e3be87;font:bold 9px ui-monospace,monospace;padding:8px 5px}
.right-panel h2{margin-bottom:16px}.live-small{font-size:10px;color:#70e8be;letter-spacing:.7px}.system-strip{display:grid;gap:11px;padding:11px;background:#0d202e;border:1px solid #244050;margin-bottom:18px}.meter{height:4px;background:#253d4d}.meter i{display:block;width:50%;height:100%;background:#63e6bd;box-shadow:0 0 9px #57ddb8}.meter.blue i{background:#6bbfe8}.meter.amber i{background:#e9ae70}.sliders{display:grid;gap:14px}.control label{display:flex;align-items:center;justify-content:space-between;gap:5px;font:700 9px ui-monospace,monospace;letter-spacing:.5px;color:#a8c6ce}.control output{color:var(--cyan);font-size:11px}.control input[type=range]{width:100%;margin:10px 0 0;height:4px;accent-color:#69dfde;cursor:pointer}.divider{height:1px;background:#2a414c;margin:19px 0 15px}.toggle-line,.select-line{display:flex;align-items:center;justify-content:space-between;margin:12px 0;font-size:11px;color:#b0c6cc}.toggle-line input{appearance:none;width:30px;height:16px;background:#30414a;border-radius:20px;border:1px solid #455c65;cursor:pointer;position:relative}.toggle-line input:after{content:'';position:absolute;width:11px;height:11px;border-radius:100%;background:#92aab1;left:2px;top:1.5px;transition:.2s}.toggle-line input:checked{background:#24696c;border-color:#5ecbcb}.toggle-line input:checked:after{left:15px;background:#9effe7}.select-line select{max-width:160px;background:#132936;border:1px solid #31505f;color:#add8e1;padding:8px 5px;font-size:9px}.compact{margin-top:16px}.right-actions{display:flex;gap:7px;margin-top:22px}.secondary{border:1px solid #3a606f;background:#14303e;padding:11px 9px;font:700 10px ui-monospace,monospace;color:#c8e2e7;flex:1}.secondary:hover{background:#1b4858}.danger-border{border-color:#7f5348;color:#efb58a}.secondary.danger{background:#602b29;color:#ffcab8;animation:pulse 1s infinite}
.scene-top-center{position:fixed;z-index:2;top:103px;left:50%;transform:translateX(-50%);text-align:center;text-shadow:0 2px 8px #000e;pointer-events:none;min-width:250px}.crossline{color:#e7bb71;font-size:20px;line-height:20px}.scene-top-center p{font:800 10px ui-monospace,monospace;color:#80aeba;letter-spacing:2px;margin:5px 0}.separator{color:#dda968}.sector-name{color:#d7f2ef;font:600 12px ui-monospace,monospace;letter-spacing:1px}.toast{position:fixed;z-index:5;top:185px;left:50%;transform:translateX(-50%) translateY(-10px);background:#081e2ce8;border:1px solid #4babb7;color:#bdf1f1;padding:12px 22px;letter-spacing:1px;font:700 11px ui-monospace,monospace;opacity:0;transition:.24s;pointer-events:none;max-width:430px;text-align:center}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.map-panel{position:fixed;z-index:3;left:313px;bottom:26px;width:237px;padding:13px}.map-title{display:flex;justify-content:space-between;align-items:center}.map-title h3{font-size:12px;margin:5px 0 10px;letter-spacing:1px}.map-pulse{color:#5ef0d6;font-size:13px}.map-wrap{height:204px;position:relative;border:1px solid #223c4d;overflow:hidden;background:#07121b}.map-wrap canvas{width:100%;height:100%;cursor:crosshair}.map-grid-label{position:absolute;top:4px;right:8px;font-size:10px;color:#d7b179}.map-legend{display:flex;justify-content:space-between;gap:6px;margin-top:10px;font:700 9px ui-monospace,monospace;color:#87a3af}.legend-dot{width:6px;height:6px;display:inline-block;border-radius:100%;margin-right:4px}.legend-dot.cyan{background:#58d7df}.legend-dot.gold{background:#f3b66b}.legend-dot.white{background:#f5f5f4}
.bottom-center{position:fixed;z-index:3;bottom:24px;left:50%;transform:translateX(-50%);width:min(580px,calc(100vw - 720px));min-width:360px}.interaction-bar{display:flex;justify-content:center;background:#071722e8;padding:7px;border:1px solid #355362;gap:4px}.interaction-bar button{background:#18323e;color:#cfe4e9;border:1px solid #345769;font:700 10px ui-monospace,monospace;padding:11px 12px;white-space:nowrap;flex:1}.interaction-bar button.ready{background:#24635f;border-color:#8fe9c1;color:#effff9}.interaction-bar small{color:#8dbfc7}.interaction-bar button:hover{background:#205264}.hud-footer{margin-top:8px;background:#06131ed9;display:flex;justify-content:space-between;gap:6px;border:1px solid #2a4451;padding:10px;font:700 9px ui-monospace,monospace;letter-spacing:.5px;color:#799aa6}.hud-footer b{color:#d1edf2}
.help-cover{position:fixed;inset:0;z-index:9;background:#000b;display:grid;place-items:center}.help-cover[hidden]{display:none}.help{width:min(600px,95vw);padding:28px}.help h2{font-size:26px;margin:12px 0}.help p{font-size:12px;color:#a6c0ca;line-height:1.75}.help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 14px;margin:23px 0}.help-grid>div{padding:13px;background:#102839;display:grid;gap:8px}.help-grid kbd{color:#b9f3f3;font:800 12px ui-monospace,monospace}.help-grid span{font-size:11px;color:#88a4b0}.close-help{background:transparent;color:#b4dce7;border:1px solid #456272;padding:6px 10px}.help-foot{border-top:1px solid #345063;padding-top:10px}
.boot{position:fixed;z-index:20;inset:0;display:grid;place-items:center;background:#07121b;transition:opacity .6s}.boot.loaded{opacity:0;pointer-events:none}.boot.failed{background:#141217}.boot-box{text-align:center}.boot-symbol{font-size:77px;color:#76e5e9;margin:0 0 20px;text-shadow:0 0 30px #35c0c36a}.boot-box h1{font-size:36px;letter-spacing:5px;margin:5px 0;color:#f6ffff}.boot-box h1 span{color:#e3ad69}.boot-desc{font:700 13px ui-monospace,monospace;letter-spacing:4px;color:#8caebd}.loading-track{height:3px;width:300px;background:#193342;margin:36px auto 12px}.loading-track>div{width:57%;height:100%;background:#7bd9e1;box-shadow:0 0 20px #5bc9d9;animation:loading 2s ease-in-out infinite}.loading-text{font-size:10px;color:#80a7b9}@keyframes loading{0%{width:4%}60%{width:84%}100%{width:100%}}@keyframes pulse{50%{opacity:.5}}
@media(max-width:1440px){.top-stats{gap:17px}.topbar{padding:0 17px}.left-panel{width:252px}.right-panel{width:254px;padding:12px}.map-panel{left:281px;width:210px}.bottom-center{width:480px;min-width:380px}.build-label{display:none}.interaction-bar button{font-size:9px;padding:10px 7px}}
@media(max-width:1190px){.right-panel{top:auto;bottom:18px;max-height:42%;width:235px;right:10px}.left-panel{width:225px;left:10px}.map-panel{left:245px;width:191px;bottom:18px}.top-stats>div:nth-child(2),.top-stats>div:nth-child(3){display:none}.bottom-center{left:53%;width:390px;min-width:300px}.interaction-bar button{font-size:8px;padding:10px 3px}.hud-footer{font-size:8px}.scene-top-center{left:53%}}
@media(max-width:800px){.topbar{height:62px;padding:0 12px}.brand h1{font-size:13px;letter-spacing:1px}.brand-mark{width:32px;height:32px;font-size:17px}.top-stats{display:none}.left-panel{top:70px;bottom:auto;max-height:40vh;width:190px}.pane-section{padding:10px}.level-btn{min-height:32px}.level-btn small,.pane-intro,.destination-section,.left-bottom{display:none}.right-panel{top:auto;bottom:79px;right:6px;max-height:37vh;width:185px}.map-panel{left:6px;bottom:78px;width:165px}.map-wrap{height:138px}.bottom-center{bottom:7px;width:calc(100vw - 12px);min-width:0;left:50%}.interaction-bar button{font-size:8px}.hud-footer{font-size:7px}.scene-top-center{top:74px;left:57%;min-width:130px}.sector-name{font-size:9px}.scene-top-center p{font-size:8px}.left-panel.collapsed{display:none}}
@media(max-height:760px){.left-panel,.right-panel{top:84px;bottom:10px}.map-panel{bottom:10px;width:205px}.map-wrap{height:133px}.bottom-center{bottom:8px}}