:root{--bg: #070d14;--bg-canvas: #0a1420;--panel: #0c1622;--panel-raised: #101d2c;--hairline: #1b2d40;--hairline-bright: #29435e;--text: #d7e6f2;--text-dim: #7d93a8;--text-faint: #51667a;--c-src: #6fd7ff;--c-offset: #ffb454;--c-rev: #ff5d8f;--c-raw: #b18cff;--c-alert: #ff4d5e;--c-b: #5affc3;--font-display: "Chakra Petch", "Avenir Next Condensed", sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;--sidebar-w: 296px}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-display);font-size:14px;overflow:hidden;-webkit-font-smoothing:antialiased}#app{display:grid;grid-template-columns:var(--sidebar-w) 1fr;height:100vh}#sidebar{display:flex;flex-direction:column;background:linear-gradient(180deg,var(--panel) 0%,#0a121d 100%);border-right:1px solid var(--hairline-bright);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--hairline-bright) transparent}#brand{display:flex;gap:12px;align-items:center;padding:18px 16px 16px;border-bottom:1px solid var(--hairline);background:linear-gradient(180deg,rgba(111,215,255,.05),transparent 70%)}.brand-mark{flex:none;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--hairline-bright);background:var(--bg-canvas)}.brand-text h1{font-size:15px;font-weight:600;letter-spacing:.04em;text-transform:lowercase;color:var(--text)}.brand-text h1 span{color:var(--c-offset);font-weight:400}.brand-text{min-width:0}.brand-text p{margin-top:2px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint)}.brand-link{flex:none;margin-left:auto;display:grid;place-items:center;width:34px;height:34px;color:var(--text-dim);border:1px solid transparent;transition:color .12s ease,border-color .12s ease}.brand-link:hover{color:var(--c-src);border-color:var(--hairline-bright)}.usage{border-bottom:1px solid var(--hairline)}.usage>summary{list-style:none;cursor:pointer;padding:12px 16px;font-family:var(--font-mono);font-size:9.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--text-faint);display:flex;align-items:center;gap:9px;transition:color .12s ease}.usage>summary::-webkit-details-marker{display:none}.usage>summary:before{content:"+";color:var(--c-src);font-size:13px;line-height:1;width:9px;text-align:center}.usage[open]>summary:before{content:"−"}.usage>summary:hover{color:var(--text-dim)}.usage-body{padding:0 16px 14px}.usage-lead{font-size:12px;line-height:1.5;color:var(--text-dim);margin-bottom:10px}.usage-code{background:var(--bg-canvas);border:1px solid var(--hairline);padding:9px 11px;margin-bottom:10px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--hairline-bright) transparent;font-family:var(--font-mono);font-size:11px;line-height:1.55;color:var(--text)}.usage-code code{font-family:inherit;white-space:pre}.usage-links{display:flex;flex-wrap:wrap;gap:8px 16px}.usage-links a{color:var(--c-src);text-decoration:none;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em}.usage-links a:hover{text-decoration:underline}#scene-tabs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hairline);border-bottom:1px solid var(--hairline)}.scene-tab{appearance:none;border:0;background:var(--panel);color:var(--text-dim);font-family:var(--font-display);font-size:12px;font-weight:500;letter-spacing:.03em;padding:10px 10px 9px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:3px;transition:background .12s ease,color .12s ease}.scene-tab .tab-num{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;color:var(--text-faint)}.scene-tab:hover{background:var(--panel-raised);color:var(--text)}.scene-tab.active{background:var(--panel-raised);color:var(--c-src);box-shadow:inset 0 2px 0 var(--c-src)}.scene-tab.active .tab-num{color:var(--c-src)}#scene-blurb{padding:12px 16px;font-size:12px;line-height:1.5;color:var(--text-dim);border-bottom:1px solid var(--hairline)}#controls{padding:6px 16px 4px}.ctl-group{padding:12px 0 10px;border-bottom:1px dashed var(--hairline)}.ctl-group-title{font-family:var(--font-mono);font-size:9.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--text-faint);margin-bottom:10px}.ctl{display:block;margin-bottom:12px}.ctl:last-child{margin-bottom:2px}.ctl-label-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}.ctl-label{font-size:12.5px;color:var(--text-dim);letter-spacing:.02em}.ctl-value{font-family:var(--font-mono);font-size:12px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--c-offset)}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:18px;background:transparent;cursor:ew-resize}input[type=range]::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--hairline-bright),var(--hairline))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:11px;height:15px;margin-top:-6.5px;background:var(--panel-raised);border:1px solid var(--c-src);box-shadow:0 0 0 2px #6fd7ff1f;border-radius:1px}input[type=range]::-moz-range-track{height:2px;background:var(--hairline-bright)}input[type=range]::-moz-range-thumb{width:9px;height:13px;background:var(--panel-raised);border:1px solid var(--c-src);border-radius:1px}input[type=range]:focus-visible{outline:1px solid var(--c-src);outline-offset:2px}.ctl-check{display:flex;align-items:center;gap:9px;cursor:pointer;-webkit-user-select:none;user-select:none}.ctl-check input{position:absolute;opacity:0;width:0;height:0}.check-box{flex:none;width:13px;height:13px;border:1px solid var(--hairline-bright);background:var(--bg-canvas);position:relative;transition:border-color .12s ease}.check-box:after{content:"";position:absolute;inset:2px;background:var(--c-offset);opacity:0;transform:scale(.4);transition:opacity .12s ease,transform .12s ease}.ctl-check input:checked+.check-box,.path-row input:checked+.check-box{border-color:var(--c-offset)}.ctl-check input:checked+.check-box:after,.path-row input:checked+.check-box:after{opacity:1;transform:scale(1)}.ctl-check input:focus-visible+.check-box,.path-row input:focus-visible+.check-box{outline:1px solid var(--c-src);outline-offset:2px}.ctl-check:hover .ctl-label{color:var(--text)}.ctl-segmented{display:flex;gap:1px;background:var(--hairline);border:1px solid var(--hairline)}.ctl-segmented button{appearance:none;flex:1;border:0;padding:7px 4px;background:var(--panel);color:var(--text-dim);font-family:var(--font-mono);font-size:10.5px;font-weight:500;letter-spacing:.04em;cursor:pointer;transition:background .12s ease,color .12s ease}.ctl-segmented button:hover{background:var(--panel-raised);color:var(--text)}.ctl-segmented button.active{background:#6fd7ff1f;color:var(--c-src);box-shadow:inset 0 -2px 0 var(--c-src)}.ctl-legend{display:flex;flex-direction:column;gap:6px}.legend-item{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--text-dim)}.legend-swatch{flex:none;width:14px;height:3px}.ctl-button{appearance:none;display:block;width:100%;border:1px solid var(--hairline-bright);background:var(--panel-raised);color:var(--text);font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;text-align:center;padding:9px 8px;cursor:pointer;transition:border-color .12s ease,color .12s ease,background .12s ease}.ctl-button:hover{border-color:var(--c-src);color:var(--c-src);background:#6fd7ff14}.ctl-button:focus-visible{outline:1px solid var(--c-src);outline-offset:2px}.ctl-file{position:relative}.ctl-file input[type=file]{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.path-actions{display:flex;gap:1px;margin-bottom:12px;background:var(--hairline);border:1px solid var(--hairline)}.path-actions button{appearance:none;flex:1;border:0;padding:5px 4px;background:var(--panel);color:var(--text-dim);font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;cursor:pointer;transition:background .12s ease,color .12s ease}.path-actions button:hover{background:var(--panel-raised);color:var(--c-src)}.vlist{position:relative;overflow-y:auto;overflow-x:hidden;margin-bottom:6px;border:1px solid var(--hairline);background:#00000024;scrollbar-width:thin;scrollbar-color:var(--hairline-bright) transparent;overscroll-behavior:contain}.vlist-spacer{position:relative;width:100%}.vlist-row{position:absolute;left:0;right:0;display:flex;align-items:center;padding:0 9px}.path-row{display:flex;align-items:center;gap:9px;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.path-row input{position:absolute;opacity:0;width:0;height:0}.path-row-label{font-size:12px;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path-row:hover .path-row-label{color:var(--text)}.ctl-color{display:flex;align-items:center;justify-content:space-between;gap:9px;cursor:pointer}.ctl-color input[type=color]{appearance:none;-webkit-appearance:none;width:34px;height:20px;padding:0;border:1px solid var(--hairline-bright);background:none;cursor:pointer}.ctl-color input[type=color]::-webkit-color-swatch-wrapper{padding:2px}.ctl-color input[type=color]::-webkit-color-swatch{border:none}.ctl-note{font-size:11.5px;line-height:1.5;color:var(--text-faint)}#stats-panel{padding:14px 16px 10px;margin-top:auto}#stats-panel h2{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:9.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--text-faint);margin-bottom:10px}#stats-panel h2 .rule{flex:1;height:1px;background:var(--hairline)}#stats{display:grid;grid-template-columns:auto 1fr;row-gap:5px;column-gap:14px;background:var(--bg-canvas);border:1px solid var(--hairline);padding:10px 12px}#stats dt{font-family:var(--font-mono);font-size:10px;letter-spacing:.05em;color:var(--text-faint);text-transform:uppercase;align-self:baseline}#stats dd{font-family:var(--font-mono);font-size:11.5px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--text);text-align:right;align-self:baseline}#sidebar-footer{padding:10px 16px 14px;border-top:1px solid var(--hairline)}.hint-row{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.04em;color:var(--text-faint);line-height:1.9}kbd{font-family:var(--font-mono);font-size:9px;color:var(--text-dim);border:1px solid var(--hairline-bright);padding:1px 4px;border-radius:2px;background:var(--panel-raised)}#viewport{position:relative;overflow:hidden;background:radial-gradient(1100px 700px at 62% 38%,rgba(30,70,110,.2),transparent 65%),var(--bg-canvas)}#canvas{position:absolute;inset:0;display:block;cursor:crosshair;touch-action:none}#canvas.hover-geometry{cursor:grab}#canvas.dragging-geometry{cursor:grabbing}#canvas.panning{cursor:move}#warning-badge{position:absolute;top:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:6px 14px;background:#ff4d5e1a;border:1px solid rgba(255,77,94,.55);color:var(--c-alert);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;pointer-events:none;animation:warn-in .16s ease}#warning-badge[hidden]{display:none}.warn-glyph{font-size:9px}@keyframes warn-in{0%{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%)}}#hud{position:absolute;left:14px;bottom:14px;display:flex;align-items:center;gap:12px;padding:7px 12px;background:#0a1420d1;border:1px solid var(--hairline);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-family:var(--font-mono);font-size:11px;font-variant-numeric:tabular-nums;color:var(--text-dim);white-space:pre}.hud-sep{width:1px;height:12px;background:var(--hairline-bright)}#fit-btn{appearance:none;border:1px solid var(--hairline-bright);background:transparent;color:var(--text-dim);font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;padding:3px 8px;cursor:pointer;transition:color .12s ease,border-color .12s ease}#fit-btn:hover{color:var(--c-src);border-color:var(--c-src)}#titleblock{position:absolute;right:14px;bottom:14px;min-width:218px;border:1px solid var(--hairline-bright);background:#0a1420d1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-family:var(--font-mono);pointer-events:none}.tb-row{display:flex;align-items:baseline;gap:8px;padding:4px 10px;border-top:1px solid var(--hairline);font-size:9.5px;color:var(--text-dim)}.tb-row.tb-head{border-top:0;padding:6px 10px;font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--c-src);background:#6fd7ff0f}.tb-label{color:var(--text-faint);text-transform:uppercase;letter-spacing:.1em;font-size:8.5px}.tb-val{font-variant-numeric:tabular-nums}@media(max-width:760px){#app{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);height:100dvh}#sidebar{max-height:48dvh;border-right:0;border-bottom:1px solid var(--hairline-bright);padding-top:env(safe-area-inset-top)}#viewport{min-height:0}#titleblock{display:none}#hud{bottom:max(14px,env(safe-area-inset-bottom))}}@media(pointer:coarse){.scene-tab{padding:13px 12px 12px}#fit-btn{padding:7px 12px}input[type=range]{height:26px}input[type=range]::-webkit-slider-thumb{width:15px;height:21px;margin-top:-9.5px}input[type=range]::-moz-range-thumb{width:13px;height:19px}.ctl-segmented button{padding:11px 4px}.check-box{width:16px;height:16px}}