:root{color-scheme:dark;--bg:#08121c;--panel:#0a1722;--line:#243748;--line-dim:#1a2b38;--text:#d9e4eb;--muted:#7892a4;--cyan:#62e4f4;--purple:#b093f9;--orange:#f1a06b;--mono:'IBM Plex Mono',Consolas,monospace;--heading:'Barlow Condensed','Arial Narrow',sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--mono);font-size:11px}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}a{text-decoration:none;color:inherit}
#app{height:100%;display:flex;flex-direction:column}.topbar{height:64px;flex:0 0 64px;display:flex;align-items:center;justify-content:space-between;padding:0 23px;background:#09131e;border-bottom:1px solid #233342;gap:24px;z-index:20}.brand{display:flex;align-items:center;gap:11px}.brand .hexagon{font-size:39px;color:var(--cyan);line-height:1;text-shadow:0 0 18px #55e6ee77}.brand strong{font-family:var(--heading);font-size:22px;letter-spacing:1.7px;font-weight:800}.brand strong span{color:var(--cyan)}.brand small{display:block;font-size:8px;color:#7592a6;letter-spacing:1.3px;margin-top:-2px}.head-center{display:flex;gap:12px;align-items:center;font-size:10px;letter-spacing:1.1px;color:#b7c9d2}.live-dot,.online-dot{display:inline-block;background:#68eebc;border-radius:50%;height:6px;width:6px;box-shadow:0 0 12px #69ffd3}.status-text{color:#70d8bb}.head-divider{color:#4d6879}.head-actions{display:flex;align-items:center;gap:9px}.build-text{color:var(--muted);font-size:9px;margin-right:10px}.build-text code{color:#dce8ef}.ghost{background:transparent;border:1px solid #345069;color:#c7dbe7;border-radius:3px;padding:9px 12px;letter-spacing:.6px}.ghost:hover{border-color:var(--cyan);color:var(--cyan)}.workspace{display:grid;grid-template-columns:276px minmax(350px,1fr) 286px;min-height:0;flex:1}.scrollpanel{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#355068 transparent}.sidebar{background:linear-gradient(160deg,#0b1a28,#091520);border-right:1px solid #2a4052;padding:20px 19px 0}.sidebar-head .eyebrow,.eyebrow{font-size:9px;color:var(--cyan);letter-spacing:2px}.sidebar-head h1{font-family:var(--heading);font-size:59px;line-height:.9;letter-spacing:2px;margin:17px 0 5px;font-weight:800}.sidebar-head h1 .accent{color:var(--cyan)}.sidebar-head p{font-family:var(--heading);font-size:21px;line-height:1.02;letter-spacing:2px;margin:0;color:#a8c1d1}.sidebar-head .line{height:2px;width:56px;background:var(--cyan);margin:21px 0 13px;box-shadow:0 0 14px #40dde5aa}.sidebar-desc{color:#8196a6;line-height:1.8;font-size:10px}.section{padding:18px 0 20px;border-bottom:1px solid var(--line)}.section-heading,.radar-title{display:flex;justify-content:space-between;font-weight:600;letter-spacing:1.4px;color:#d7e6ec;font-size:10px;margin-bottom:16px}.small-mono{color:#4d7388;font-weight:400}.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.stat{border:1px solid #2a3e4e;background:#102334;padding:10px 12px}.stat strong{display:block;font-family:var(--heading);font-size:27px;line-height:1;color:var(--cyan);font-weight:700}.stat small{font-size:8px;letter-spacing:.8px;color:#839bad}.section-hint{color:var(--muted);line-height:1.55;margin:-4px 0 13px;font-size:9px}.depth-list{display:grid;gap:5px}.depth-item{background:transparent;border:1px solid #243747;padding:9px 7px;text-align:left;display:grid;grid-template-columns:22px 1fr auto;gap:5px;align-items:center;color:#adc0cb;transition:background .15s,border .15s}.depth-item:hover{background:#132a3a;border-color:#4a7284}.depth-item.active{background:#122e3c;border-color:#66d9e6}.depth-number{font-family:var(--heading);font-size:15px;font-weight:700;color:var(--cyan)}.depth-name{font-family:var(--heading);font-weight:600;letter-spacing:.5px;font-size:13px;white-space:nowrap}.depth-value{font-size:9px;color:#819baa}.wide{width:100%;padding:11px 9px;margin-top:9px;font-size:10px;letter-spacing:.6px;font-weight:600;border-radius:2px}.outline{color:#b4e8ea;background:#10202e;border:1px solid #3d6c79}.outline:hover{background:#193647}.primary{background:#66d5e2;border:1px solid #7cf8ff;color:#061a28;font-weight:600}.primary:hover{background:#a5f5f8}.form-label{display:block;color:#8da5b2;font-size:9px;text-transform:uppercase;letter-spacing:.8px;margin-bottom:7px}.select{width:100%;border:1px solid #3a5467;background:#0f2534;color:#d5e5ed;border-radius:0;padding:10px 7px;min-height:36px;font-size:10px}.poi-info{min-height:60px;line-height:1.6;color:#97aebb;margin-top:12px;font-size:10px}.poi-info b{color:#cfeaf2}.setting{margin:0 0 17px}.setting label{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;color:#9db5c3;font-size:10px}.setting output{color:var(--cyan)}input[type=range]{width:100%;accent-color:var(--cyan);height:4px;cursor:pointer}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:16px 0;font-size:10px;color:#afc4ce;cursor:pointer}.switch-row input{accent-color:var(--cyan);width:14px;height:14px}.sidebar-foot{padding:22px 0 25px;line-height:1.8;font-size:8px;letter-spacing:.6px;color:#647d8e}
.scene-wrap{position:relative;min-height:0;overflow:hidden;background:radial-gradient(ellipse at center,#132838 0%,#070f19 72%)}.scene-wrap canvas{display:block;width:100%;height:100%;outline:none}.scene-top{position:absolute;top:19px;left:22px;right:22px;display:flex;justify-content:space-between;gap:10px;align-items:center;pointer-events:none}.scene-label{font-size:9px;color:#c4d8e2;letter-spacing:1.5px}.scene-label b{color:var(--cyan)}.node-toast{border:1px solid #3a6079;background:#0b2032bb;color:#a9e7ef;font-size:9px;padding:8px 12px;letter-spacing:.7px;max-width:240px;text-align:right}.crosshair{position:absolute;pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);font-size:28px;color:#a6ffffaa;display:none;text-shadow:0 0 12px #62dceb}.scene-wrap.exploring .crosshair{display:block}.compass{position:absolute;right:20px;top:75px;display:grid;justify-items:center;color:#7999aa;font-size:10px;opacity:.7;pointer-events:none}.compass span{font-size:24px;color:var(--cyan)}.viewer-toolbar{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);display:flex;gap:2px;background:#07131ecc;border:1px solid #375164;padding:4px;backdrop-filter:blur(7px);white-space:nowrap}.tool{padding:11px 10px;background:transparent;border:0;color:#8cabbc;font-size:12px;min-width:85px}.tool span{font-size:9px;letter-spacing:.8px;margin-left:5px}.tool.active,.tool:hover{background:#18374a;color:#8feefa}.scene-bottom{position:absolute;left:21px;right:21px;bottom:19px;display:flex;justify-content:space-between;align-items:end;gap:10px;pointer-events:none}.subcaption{color:#7795a6;letter-spacing:1.1px;font-size:8px;margin-bottom:6px}.scene-bottom strong{font-size:10px;color:#d7e8f1;letter-spacing:.5px}.perf{text-align:right}.perf i{color:#426173;font-style:normal}.toast{position:absolute;bottom:165px;left:50%;transform:translateX(-50%);font-size:10px;color:#d6f9ff;background:#102e40e8;border:1px solid #5995a5;padding:13px 19px;opacity:0;pointer-events:none;transition:opacity .2s;white-space:nowrap}.toast.shown{opacity:1}#scene-loading{z-index:7;position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#0b1928;text-align:center;letter-spacing:2px;color:#b6edf0;font-weight:600}#scene-loading small{color:#66879a;letter-spacing:.4px}.load-symbol{font-size:65px;color:var(--cyan);animation:turn 4s linear infinite}@keyframes turn{to{transform:rotate(360deg)}}
.radar-panel{background:linear-gradient(175deg,#091926,#0b1721);border-left:1px solid #2d4656;padding:19px 16px 16px}.radar-header{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:9px;letter-spacing:.6px;font-weight:600;color:#e0eaf0}.pulse{color:#75dfb6;font-size:9px}.map-frame{border:1px solid #294051;background:#07141e;margin:18px 0 22px;position:relative}.map-frame canvas{width:100%;height:auto;display:block;cursor:crosshair}.map-footer{display:flex;justify-content:space-between;padding:9px 7px;border-top:1px solid #243e4c;color:#7693a5;font-size:8px;gap:8px}.radar-section{border-top:1px solid #294151;padding:19px 0}.radar-title{margin-bottom:19px;font-size:10px}.meter{display:flex;justify-content:space-between;gap:7px;color:#849fb1;font-size:9px;margin:15px 0 7px}.meter strong{color:#b8e8da}.progress{height:4px;background:#1d3444;overflow:hidden}.progress span{height:100%;display:block;background:#68d9ac;box-shadow:0 0 9px #68d9ac}.progress.blue span{background:#67d8ec}.progress.orange span{background:#efae79}.network-row{display:flex;justify-content:space-between;align-items:center;gap:9px;color:#b5c9d5;padding:8px 0;font-size:9px;border-bottom:1px solid #1b2d3b}.network-row strong{color:#8bdddf}.indicator{display:inline-block;width:5px;height:5px;background:#69dcb8;border-radius:50%;vertical-align:middle;margin-right:4px}.legend{font-size:9px;color:#a6bdc9}.legend>div:not(.radar-title){display:flex;align-items:center;gap:9px;margin-bottom:12px}.key{width:8px;height:8px;background:#6ad7eb;display:inline-block}.key.purple{background:#b094f7}.key.orange{background:#eea273}.key.dim{background:#456071}.radar-foot{line-height:2.1;font-size:9px;color:#6c899a;padding:10px 0}.radar-foot strong{color:#d7eff8}
.modal-backdrop{position:fixed;z-index:60;inset:0;background:#000b;display:flex;align-items:center;justify-content:center;padding:20px}.modal-backdrop.hidden{display:none}.modal{position:relative;width:min(560px,100%);border:1px solid #527c94;background:linear-gradient(145deg,#112738,#0a1723);padding:32px;box-shadow:0 24px 90px #000a}.modal h2{font-family:var(--heading);font-size:42px;margin:12px 0}.modal p{line-height:1.8;color:#9db5c6}.modal-close{position:absolute;right:14px;top:14px;color:#d8eef9;background:transparent;border:0;font-size:20px}.shortcut-grid{display:grid;grid-template-columns:110px 1fr;gap:14px 18px;border-block:1px solid #2b4356;padding:18px 0}.shortcut-grid span{color:var(--cyan)}.shortcut-grid strong{font-size:10px;font-weight:400;color:#c5d6e2}.help-note{font-size:10px}
@media(max-width:1160px){.workspace{grid-template-columns:238px minmax(350px,1fr) 242px}.sidebar{padding-inline:13px}.radar-panel{padding-inline:10px}.topbar{padding-inline:14px}.head-center{display:none}.tool{min-width:66px;padding-inline:7px}.tool span{font-size:8px}}
@media(max-width:900px){html,body{overflow:auto;height:auto}.workspace{grid-template-columns:1fr;grid-template-rows:70vh auto auto}.sidebar{order:2;border-right:none;border-top:1px solid #294457}.radar-panel{order:3;border-left:none;border-top:1px solid #294457}.scene-wrap{order:1;min-height:560px}.sidebar,.radar-panel{overflow:visible}.depth-list{grid-template-columns:repeat(2,1fr)}.radar-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}.radar-header,.radar-foot{grid-column:1/-1}.map-frame{grid-row:2 /span 3}.viewer-toolbar{bottom:90px}.topbar{position:sticky;top:0}.workspace{display:flex;flex-direction:column}.scene-wrap{height:70vh}.build-text{display:none}}
@media(max-width:530px){.topbar{height:58px;flex-basis:58px}.brand strong{font-size:18px}.brand small{display:none}.ghost{padding:9px;font-size:9px}.ghost:first-of-type{display:none}.scene-wrap{min-height:490px;height:65vh}.viewer-toolbar{left:12px;right:12px;transform:none;justify-content:space-between}.tool{min-width:0;flex:1}.tool span{display:none}.radar-panel{display:block}.map-frame{max-width:390px}.scene-top{left:10px;right:10px;top:8px}.node-toast{display:none}.scene-bottom{left:10px;right:10px;bottom:12px}.scene-bottom strong{font-size:8px}}