:root{--bg:#000;--panel:#050505;--panel-strong:#0a0a0a;--card:#000;--line:#2a2a2a;--line-soft:#171717;--text:#fafafa;--muted:#a1a1a1;--accent:#fff;--accent-strong:#fff;--warning:#d4d4d4;--sidebar-width:clamp(min(300px, 10vw), 360px, 40vw);--scrollbar-track:transparent;--scrollbar-thumb:#4a4a4a;--scrollbar-thumb-hover:#fafafa}*{box-sizing:border-box;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track);scrollbar-width:thin;margin:0;padding:0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);background-clip:content-box;border:3px solid #0000;border-radius:999px;min-height:40px}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);background-clip:content-box}::-webkit-scrollbar-corner{background:0 0}html,body{width:100%;height:100%;overflow:hidden}body{color:var(--text);background:var(--bg);font-family:Geist,Geist Sans,Avenir Next,Noto Sans SC,sans-serif}body.panel-resizing{cursor:col-resize;-webkit-user-select:none;user-select:none}body.panel-resizing *{cursor:col-resize!important}button,input{font:inherit}button{border:1px solid var(--text);color:var(--bg);background:var(--text);cursor:pointer;border-radius:0;padding:6px 12px}button:hover{color:var(--text);background:var(--bg)}button:disabled{cursor:wait;opacity:.5}.secondary-btn{color:var(--text);background:var(--bg)}.secondary-btn:hover{color:var(--bg);background:var(--text)}#app{background:var(--bg);width:100vw;height:100vh}.panel-hover-zone{z-index:25;width:16px;display:none;position:fixed;inset:0 auto 0 0}body.panel-hover-mode.panel-collapsed .panel-hover-zone{display:block}#control-panel{z-index:20;width:var(--sidebar-width);border-right:1px solid var(--line);background:var(--panel);border-radius:0;flex-direction:column;gap:18px;min-width:0;padding:18px;transition:transform .18s;display:flex;position:fixed;inset:0 auto 0 0;overflow:auto}.panel-resize-handle{z-index:2;color:#0000;cursor:col-resize;touch-action:none;background:0 0;border:0;width:10px;padding:0;position:absolute;inset:0 0 0 auto}.panel-resize-handle:after{background:var(--line);content:"";opacity:0;width:1px;transition:opacity .12s;position:absolute;inset:18px 1px 18px auto}.panel-resize-handle:hover,.panel-resize-handle:focus-visible{background:0 0}.panel-resize-handle:hover:after,.panel-resize-handle:focus-visible:after,body.panel-resizing .panel-resize-handle:after{opacity:1}body.panel-collapsed #control-panel{transform:translate(-100%)}.panel-hero{border-bottom:1px solid var(--line-soft);padding-bottom:18px}.panel-topbar{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;display:flex}.panel-topbar .eyebrow{margin-bottom:0}.panel-mode-toggle{width:30px;height:30px;color:var(--text);background:var(--bg);flex:none;place-items:center;padding:0;display:grid}.panel-mode-toggle:hover,.panel-mode-toggle[aria-pressed=true]{color:var(--bg);background:var(--text)}.pin-icon{fill:currentColor;transform-origin:50%;width:17px;height:17px;transition:transform .16s,opacity .16s}.panel-mode-toggle[aria-pressed=true] .pin-icon{opacity:.72;transform:rotate(-45deg)}.eyebrow{color:var(--text);letter-spacing:.18em;text-transform:uppercase;font-size:11px;font-weight:800;display:inline-flex}.panel-hero p,.section-heading span,.render-status,.selection-status,.category-count,.view-coordinate{color:var(--muted);font-size:12px}.panel-section{border-top:1px solid var(--line-soft);min-width:0;padding-top:18px}.section-heading{justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;display:flex}.section-heading h2{letter-spacing:-.02em;text-transform:uppercase;font-size:13px}.section-toggle{color:var(--text);font-size:inherit;letter-spacing:inherit;text-transform:inherit;background:0 0;border:0;align-items:center;gap:8px;padding:0;font-weight:800;display:inline-flex}.section-toggle:hover,.section-toggle:focus-visible{color:var(--text);background:0 0}.section-toggle:focus-visible{outline:1px solid var(--text);outline-offset:3px}.section-toggle-mark{width:10px;color:var(--muted);text-align:center;font-family:Geist Mono,SFMono-Regular,Consolas,monospace;font-size:12px}.section-content[hidden]{display:none}.view-switcher,.category-list{gap:6px;display:grid}.category-list{overflow:auto}.category-root-drop{border:1px dashed var(--line);color:var(--muted);background:var(--bg);text-align:center;text-transform:uppercase;padding:7px 10px;font-size:11px;font-weight:800}.view-option{border:1px solid var(--line-soft);background:var(--panel-strong);cursor:pointer;border-radius:0;align-items:center;gap:10px;padding:9px 10px;display:flex}.view-option:hover,.category-row:hover{border-color:var(--line);background:#111}.view-option input{accent-color:var(--text)}.render-status{min-height:18px;margin-bottom:8px}.render-status.busy{color:var(--warning)}.selection-toolbar{margin-bottom:8px}.selection-status.busy{color:var(--warning)}.category-row{border:1px solid var(--line-soft);background:var(--panel-strong);cursor:pointer;border-radius:0;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px;display:grid}.category-row:focus-visible{outline:1px solid var(--text);outline-offset:2px}.category-row.draggable{cursor:grab}.category-row.dragging,.category-row.moving{opacity:.45}.category-root-drop.drop-target,.category-row.drop-target{border-color:var(--text);box-shadow:inset 0 0 0 1px var(--text);background:#171717}.category-actions{gap:6px;display:flex}.category-row.active{border-color:var(--text);box-shadow:inset 3px 0 0 var(--text)}.category-main{align-items:center;gap:8px;min-width:0;display:flex}.category-dot{border:1px solid var(--text);color:#0000;cursor:pointer;border-radius:0;flex:none;width:18px;height:18px;padding:0}.category-dot:hover,.category-dot:focus-visible,.category-dot.updating{outline:1px solid var(--text);outline-offset:2px}.category-dot:disabled{cursor:wait}.category-toggle{width:10px;color:var(--muted);text-align:center;flex:none;font-family:Geist Mono,SFMono-Regular,Consolas,monospace;font-size:12px;font-weight:800}.category-name{text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;overflow:hidden}.category-count{white-space:nowrap;margin-left:auto}.delete-btn{border-color:var(--text);color:#fecaca;background:var(--bg);border-color:#7f1d1d;padding:5px 10px;font-size:11px;font-weight:800}.delete-btn:hover,.delete-btn.confirm{color:#fff;background:#b91c1c;border-color:#ef4444}.category-color-dialog{border:1px solid var(--text);width:min(360px,100vw - 32px);color:var(--text);background:var(--panel);border-radius:0;padding:18px;box-shadow:12px 12px #ffffff1a}.category-color-dialog::backdrop{background:#000000b8}.category-color-dialog h3{letter-spacing:-.03em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;margin-bottom:6px;font-size:15px;font-weight:900;overflow:hidden}.category-color-meta{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-bottom:14px;font-family:Geist Mono,SFMono-Regular,Consolas,monospace;font-size:10px;overflow:hidden}.category-color-preview{border:1px solid var(--text);letter-spacing:.08em;text-align:center;text-shadow:0 1px #ffffff5c;text-transform:uppercase;width:100%;height:46px;margin-bottom:12px;font-family:Geist Mono,SFMono-Regular,Consolas,monospace;font-size:13px;font-weight:900;display:block}.category-color-preview:focus-visible{outline:2px solid var(--text);outline-offset:2px}.category-color-preview.invalid{border-color:#ef4444;box-shadow:inset 0 0 0 1px #ef4444}.circular-color-picker{justify-items:center;gap:14px;margin-bottom:18px;display:grid}.circular-color-picker.disabled{opacity:.56}.color-wheel{cursor:crosshair;touch-action:none;border-radius:50%;width:220px;height:220px;position:relative}.color-wheel:before{border:1px solid var(--line);background:repeating-conic-gradient(from 45deg, #ffffff0d 0 25%, transparent 0 50%) 50% / 12px 12px;content:"";border-radius:50%;position:absolute;inset:-8px}.color-wheel:focus-visible{outline:2px solid var(--text);outline-offset:8px}.color-wheel-canvas{z-index:1;filter:drop-shadow(0 0 18px #ffffff14);border-radius:50%;width:220px;height:220px;display:block;position:relative}.color-wheel-thumb{z-index:2;pointer-events:none;border:2px solid #fff;border-radius:50%;width:18px;height:18px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #000,0 0 16px #000000b8}.color-value-label{width:100%;color:var(--muted);text-transform:uppercase;gap:8px;font-size:11px;font-weight:800;display:grid}.color-value-label input{width:100%;accent-color:var(--value-color);cursor:pointer}.color-value-label input:disabled{cursor:wait}.category-color-actions{justify-content:flex-end;gap:8px;display:flex}#workspace{inset:0 0 0 var(--sidebar-width);flex-direction:column;min-width:0;transition:left .18s;display:flex;position:fixed}body.panel-hover-mode #workspace{left:0}.app-header{border-bottom:1px solid var(--line-soft);background:var(--bg);flex:none;justify-content:space-between;align-items:center;gap:24px;min-height:72px;padding:14px 18px;display:flex}.app-title-group{gap:3px;min-width:0;display:grid}.app-title-group h1{letter-spacing:-.04em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;min-width:0;font-size:18px;font-weight:900;line-height:1;overflow:hidden}.app-title-group p{color:var(--muted);font-size:12px}.app-metrics{color:var(--muted);text-transform:uppercase;flex-wrap:wrap;flex:0 auto;justify-content:flex-end;align-items:center;gap:6px 16px;font-size:11px;display:flex}.app-metrics span{white-space:nowrap}.app-metrics b,.view-fps b{color:var(--text);font-family:Geist Mono,SFMono-Regular,Consolas,monospace}.views-grid{background:var(--line-soft);flex:auto;grid-template-columns:repeat(auto-fit,minmax(min(520px,100%),1fr));grid-auto-rows:minmax(0,1fr);gap:1px;width:100%;min-height:0;display:grid}.view-card{background:var(--card);border:0;border-radius:0;flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.view-stage{background:#000;flex:auto;min-height:0;position:relative}.view-chrome{z-index:3;pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute;inset:10px 10px auto}.view-coordinate,.view-fps{text-overflow:ellipsis;white-space:nowrap;background:#000000ad;border:1px solid #ffffff24;max-width:min(420px,70%);padding:5px 7px;overflow:hidden}.view-fps{color:var(--muted);text-transform:uppercase;flex:none;font-size:11px}.view-stage canvas{width:100%;height:100%;position:absolute;inset:0}.gpu-canvas{cursor:grab;z-index:1}.gpu-canvas:active{cursor:grabbing}.overlay-canvas{pointer-events:none;z-index:2}.view-loading{z-index:3;color:var(--muted);background:#000;place-items:center;display:grid;position:absolute;inset:0}.empty-state{border:1px solid var(--line-soft);min-height:100%;color:var(--muted);background:var(--bg);text-align:center;border-radius:0;place-items:center;display:grid}@media (width<=760px){#control-panel{padding:14px}.app-header{flex-direction:column;align-items:flex-start;gap:10px;min-height:92px;padding:12px}.app-metrics{justify-content:flex-start}.views-grid{grid-template-columns:1fr}}
