:root{color-scheme:dark;font-family:system-ui,sans-serif;--panel: rgba(18, 18, 22, .86);--border: #333;--accent: #2d6cdf;--muted: #9aa}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;width:100%;background:#111}#app{position:relative}#viewport{display:block;width:100%;height:100%}#left-panel,#right-panel{position:absolute;top:12px;bottom:12px;width:240px;overflow-y:auto;padding:10px;background:var(--panel);border:1px solid var(--border);border-radius:6px;color:#eee;font-size:12px;display:flex;flex-direction:column;gap:6px}body.hud-hidden #left-panel,body.hud-hidden #right-panel{display:none}#left-panel{left:12px}#right-panel{right:12px}.panel-title{text-transform:uppercase;letter-spacing:.05em;font-size:10px;color:var(--muted);margin-top:4px}.map-select{width:100%;padding:4px 6px;background:#1b1b1b;color:#eee;border:1px solid #444;border-radius:4px}.tree{display:flex;flex-direction:column}.tree-header{text-transform:uppercase;letter-spacing:.04em;font-size:10px;color:var(--muted);padding:6px 8px 2px}.tree-node{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:3px 8px;border-radius:4px;cursor:pointer}.tree-node:hover{background:#ffffff12}.tree-node.sel{background:var(--accent)}.tree-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-group{display:flex;flex-wrap:wrap;gap:4px}button{background:#1b1b1b;color:#bbb;border:1px solid #444;border-radius:4px;padding:3px 8px;cursor:pointer;text-transform:capitalize;font-size:11px}button:hover{border-color:#666}button.active{background:var(--accent);color:#fff;border-color:var(--accent)}button.action{width:100%;padding:6px;margin-bottom:4px}.field{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 0}.field.check{justify-content:flex-start}.field input[type=number]{width:90px;padding:3px 6px;background:#1b1b1b;color:#eee;border:1px solid #444;border-radius:4px}.readout div{display:flex;justify-content:space-between;padding:2px 0;border-bottom:1px solid #ffffff10}.readout span{color:var(--muted)}.hint{color:var(--muted);font-size:10px;line-height:1.4}.field input[type=color]{width:48px;height:24px;padding:0;border:1px solid #444;border-radius:4px;background:none;cursor:pointer}.debug-panel{position:sticky;bottom:-10px;margin:6px -10px -10px;padding:6px 10px 10px;background:var(--panel);border-top:1px solid var(--border)}.debug-panel.idle .readout span{color:#666}
