:root{color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#0f0f0f;color:#e6e6e6;overflow:hidden}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:14px;padding:7px 14px;border-bottom:1px solid #ffffff14;flex:none}.topbar .name{font-weight:800;font-size:13px;letter-spacing:.04em}.topbar .status{margin-left:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55vw}.loading{color:#6cb2ff;font-size:12px;font-weight:700}.main{flex:1;display:flex;min-height:0}.sidebar{width:300px;flex:none;overflow-y:auto;border-right:1px solid #ffffff14;padding:14px 16px 24px;display:flex;flex-direction:column;gap:18px}.sectTitle{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;opacity:.5;margin-bottom:9px}.controls{display:flex;flex-direction:column;gap:10px}.control{display:flex;flex-direction:column;gap:5px}.control label{font-size:12px;font-weight:600;display:flex;justify-content:space-between;align-items:baseline}.v{color:#6cb2ff;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:600}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px}.hint{font-size:11px;opacity:.55;line-height:1.4}.row2{display:flex;gap:8px}.row2>*{flex:1}.btn{padding:7px 10px;border-radius:7px;border:1px solid #ffffff26;background:#ffffff0d;color:inherit;cursor:pointer;font-size:12.5px;text-align:center}.btn:hover:not(:disabled){background:#ffffff1a}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.35;cursor:default}.btn.active{border-color:#6cb2ff;color:#6cb2ff;background:#6cb2ff14}select{font:inherit;font-size:12.5px;color:inherit;background:#1b1b1b;border:1px solid #ffffff22;border-radius:7px;padding:6px 8px;width:100%}input[type=range]{width:100%;accent-color:#6cb2ff}input[type=checkbox]{accent-color:#6cb2ff}details.adv summary{cursor:pointer;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;opacity:.5}details.adv[open] summary{margin-bottom:10px}.stage{flex:1;display:flex;flex-direction:column;min-width:0;background:#0a0a0a}.canvasWrap{flex:1;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:16px}.viewCanvas{max-width:100%;max-height:100%;box-shadow:0 0 0 1px #ffffff12,0 10px 34px #00000090;background:#161616}canvas.clickable{cursor:crosshair}canvas.pannable{cursor:grab}canvas.pannable:active{cursor:grabbing}.modeToggle{position:absolute;top:12px;left:50%;transform:translate(-50%);z-index:4;display:flex;border:1px solid #ffffff26;border-radius:9px;overflow:hidden;background:#161616ee}.modeToggle button{padding:6px 16px;font-size:12px;font-weight:650;background:transparent;border:none;color:#b5b5b5;cursor:pointer}.modeToggle button.active{background:#6cb2ff22;color:#6cb2ff}.modeToggle button:disabled{opacity:.4;cursor:default}.geoBar{position:absolute;bottom:14px;left:50%;transform:translate(-50%);z-index:4;display:flex;gap:16px;align-items:flex-end;background:#161616f0;border:1px solid #ffffff26;border-radius:10px;padding:10px 14px;flex-wrap:wrap;max-width:calc(100% - 24px)}.geoItem{display:flex;flex-direction:column;gap:4px;min-width:130px}.geoItem select{width:auto}.geoLbl{font-size:11px;font-weight:650;opacity:.85;white-space:nowrap}.geoBtns{flex-direction:row;align-items:center;min-width:auto}.geoBtns .btn{padding:6px 10px}.emptyHint{position:absolute;top:18px;right:18px;bottom:18px;left:18px;display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;color:#8f8f8f;border:2px dashed #ffffff24;border-radius:14px;cursor:pointer}.emptyHint .big{font-size:17px;font-weight:700;color:#c9c9c9}.dropOverlay{position:absolute;top:10px;right:10px;bottom:10px;left:10px;border:2px dashed #6cb2ffaa;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#0a0a0ad9;z-index:5;font-weight:800;font-size:16px;color:#6cb2ff;pointer-events:none}.stagebar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:8px 14px;border-top:1px solid #ffffff14;flex:none}.stagebar label{font-size:12px;opacity:.85;display:flex;align-items:center;gap:8px}.stagebar select{width:auto}.stagebar input[type=range]{width:150px}.spacer{flex:1}
