.studio-page{height:100dvh;overflow:hidden;display:flex;flex-direction:column}.studio{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 400px}.stage-wrap{position:relative;min-height:0;background:#070708}#stage{position:absolute;top:0;right:0;bottom:0;left:0}#stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}#stage canvas:active{cursor:grabbing}.stage-top,.stage-bottom{position:absolute;left:16px;right:16px;display:flex;justify-content:space-between;gap:12px;pointer-events:none;flex-wrap:wrap}.stage-top{top:16px}.stage-bottom{bottom:16px;align-items:flex-end}.stage-top>*,.stage-bottom>*{pointer-events:auto}.seg{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:12px;background:var(--bg-2);border:1px solid var(--line)}.seg button{flex:1 1 auto;padding:8px 12px;border-radius:9px;font-size:.84rem;color:var(--muted);transition:background .15s,color .15s;white-space:nowrap}.seg button:hover:not(:disabled){color:var(--text);background:#ffffff0d}.seg-dark{background:#0c0c0eb8;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:#ffffff1a}.seg-dark button{flex:0 0 auto}.hint{font-size:.78rem;color:#ffffff8c;text-shadow:0 1px 6px #000;margin-left:auto}.rail{min-height:0;overflow-y:auto;background:var(--bg-2);border-left:1px solid var(--line);display:flex;flex-direction:column;scrollbar-width:thin;scrollbar-color:#35353c transparent}.rail::-webkit-scrollbar{width:10px}.rail::-webkit-scrollbar-thumb{background:#33333a;border-radius:10px;border:2px solid var(--bg-2)}.rail::-webkit-scrollbar-thumb:hover{background:#42424a}.rail-head{padding:24px 22px 14px;display:grid;gap:7px}.rail-head h1{font-size:1.85rem}.rail-head p{color:var(--muted);font-size:.86rem}.groups{padding:2px 16px 0;display:grid;gap:8px}.group{border:1px solid var(--line);border-radius:13px;background:var(--panel);overflow:hidden;transition:border-color .2s,background .2s}.group:hover:not([open]){border-color:var(--line-2)}.group[open]{border-color:var(--line-2);background:var(--panel-2)}.group summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;user-select:none;-webkit-user-select:none}.group summary::-webkit-details-marker{display:none}.s-head{display:inline-flex;align-items:center;gap:12px;min-width:0}.num{flex:none;width:23px;height:23px;border-radius:7px;display:grid;place-items:center;font-family:var(--cond);font-weight:600;font-size:.82rem;background:#f0a94826;color:var(--amber);transition:background .2s,color .2s}.group[open] .num{background:var(--amber);color:var(--amber-ink)}.s-title{font-family:var(--cond);font-weight:600;font-size:1rem;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}.val{font-size:.82rem;color:var(--amber-2);text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group[open] .val{display:none}.group summary:after{content:"";flex:none;width:8px;height:8px;margin-left:2px;border-right:1.7px solid var(--dim);border-bottom:1.7px solid var(--dim);transform:rotate(45deg);transition:transform .25s ease,border-color .2s}.group:hover summary:after{border-color:var(--muted)}.group[open] summary:after{transform:rotate(-135deg);border-color:var(--amber)}.group-body{padding:2px 16px 18px}.group[open] .group-body{animation:cfgReveal .28s ease}@keyframes cfgReveal{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.field{display:grid;gap:10px;margin-bottom:18px}.field:last-child{margin-bottom:0}.field[hidden]{display:none}.field>label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:.8rem;color:var(--muted)}.field output{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}.note{font-size:.8rem;color:var(--amber-2);margin:-3px 0 0;line-height:1.45}.note:empty{display:none}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:26px;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:5px;background:#2e2e35}input[type=range]::-moz-range-track{height:5px;border-radius:5px;background:#2e2e35}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:19px;height:19px;border-radius:50%;background:var(--amber);margin-top:-7px;border:3px solid var(--panel-2);box-shadow:0 0 0 1px var(--amber),0 2px 6px #0006;transition:transform .12s}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12)}input[type=range]::-moz-range-thumb{width:15px;height:15px;border:3px solid var(--panel-2);border-radius:50%;background:var(--amber);box-shadow:0 0 0 1px var(--amber)}input[type=range]:focus-visible{outline:none}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 1px var(--amber),0 0 0 4px #f0a9484d}.seg{display:flex;gap:4px;padding:4px;border-radius:11px;background:var(--bg);border:1px solid var(--line)}.seg.seg-grid{display:grid;grid-template-columns:repeat(3,1fr)}.seg button{flex:1 1 auto;padding:9px 10px;border-radius:8px;font-size:.84rem;color:var(--muted);transition:background .15s,color .15s;white-space:nowrap}.seg.seg-grid button{flex:none}.seg button:hover:not(:disabled):not(.active){color:var(--text);background:#ffffff0d}.seg button.active{background:var(--amber);color:var(--amber-ink);font-weight:600}.seg button:disabled{opacity:.3;cursor:not-allowed}.swatches{display:flex;flex-wrap:wrap;gap:9px}.swatch{width:32px;height:32px;border-radius:9px;background:var(--c);cursor:pointer;border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 2px #ffffff24,inset 0 -4px 7px #0000004d;transition:transform .14s,box-shadow .14s}.swatch:hover{transform:translateY(-2px)}.swatch.active{box-shadow:0 0 0 2px var(--panel-2),0 0 0 4px var(--amber)}.swatch:focus-visible{outline:none;box-shadow:0 0 0 2px var(--panel-2),0 0 0 4px var(--amber)}.swatch.off{background:repeating-linear-gradient(45deg,#222 0,#222 5px,#2c2c2c 5px,#2c2c2c 10px);position:relative}.swatch.off:after{content:"";position:absolute;left:50%;top:5px;bottom:5px;width:2px;background:#8a8a8a;transform:translate(-50%) rotate(45deg)}.toggles{display:grid;gap:9px}.toggle{position:relative;cursor:pointer}.toggle input{position:absolute;opacity:0}.toggle span{display:block;padding:13px 14px 13px 42px;border-radius:10px;border:1px solid var(--line-2);background:var(--bg);font-size:.88rem;color:var(--muted);position:relative;transition:border-color .15s,color .15s,background .15s}.toggle span:before{content:"";position:absolute;left:14px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:5px;border:1.5px solid var(--dim);transition:background .15s,border-color .15s}.toggle:hover span{border-color:var(--line-2);color:var(--text)}.toggle input:checked+span{border-color:var(--amber);color:var(--text);background:#f0a9480f}.toggle input:checked+span:before{background:var(--amber);border-color:var(--amber);box-shadow:inset 0 0 0 3px var(--panel-2)}.toggle input:focus-visible+span{outline:2px solid var(--amber);outline-offset:2px}.summary{margin:16px 16px 24px;padding:20px;border-radius:14px;background:var(--panel);border:1px solid var(--line-2);display:grid;gap:14px}.summary-head .eyebrow{font-size:.72rem}.summary ul{list-style:none;display:grid;gap:12px}.summary li{display:grid;gap:3px;font-size:.85rem;color:var(--text);line-height:1.4}.summary li span{font-family:var(--cond);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--amber)}.summary-actions{display:grid;gap:8px;margin-top:2px}.summary-actions .btn{width:100%}@media(max-width:960px){.studio-page{height:auto;overflow:visible;display:block}.studio{display:block}.stage-wrap{height:62vh;min-height:380px;position:sticky;top:72px;z-index:5}.rail{border-left:0;overflow:visible}.hint{display:none}.stage-top{flex-direction:column;align-items:flex-start}.seg-dark button{padding:7px 9px;font-size:.76rem}}@media(max-width:960px)and (max-height:700px){.stage-wrap{position:relative;top:0}}.studio-page.embed .nav,.studio-page.embed .rail,.studio-page.embed .stage-top,.studio-page.embed .stage-bottom{display:none!important}.studio-page.embed .studio{display:block;height:100vh;margin:0;padding:0;gap:0}.studio-page.embed .stage-wrap{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;margin:0;border-radius:0}.studio-page.embed #stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}