.live-ui{position:absolute;inset:0;z-index:2;pointer-events:none}.live-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.is-live{cursor:crosshair;touch-action:none}.live-readout{position:absolute;left:12px;bottom:10px;max-width:calc(100% - 24px);margin:0;font-family:var(--font-mono);font-size:.6875rem;line-height:1.45;letter-spacing:0;color:var(--ash);opacity:.85;font-variant-numeric:tabular-nums}.live-readout span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.live-context{opacity:.8}.live-lanes{position:absolute;top:8px;right:8px;display:flex;gap:2px;pointer-events:auto;opacity:0;transition:opacity .18s ease}.is-live:hover .live-lanes,.live-lanes:focus-within{opacity:1}@media(hover:none){.live-lanes{opacity:1}}.live-lanes button,.live-play{font:inherit;font-size:var(--t-caption);line-height:1;padding:6px 9px;border:1px solid transparent;background:transparent;color:var(--ash);cursor:pointer}.live-lanes button[aria-pressed=true]{color:var(--void);border-color:var(--void)}.live-lanes button:hover{color:var(--void)}.live-play{position:absolute;left:10px;bottom:52px;pointer-events:auto;color:var(--void);border-color:var(--void);background:var(--paper)}.live-lanes button:focus-visible,.live-play:focus-visible{outline:2px solid var(--void);outline-offset:2px}.tile-no{z-index:2}.is-live,.live-canvas,.live-ui{-webkit-user-select:none;user-select:none}.is-dragging-plate,.is-dragging-plate *{-webkit-user-select:none!important;user-select:none!important}.live-readout.is-idle{opacity:.55}.preview-controls{--plate: #e6e6e4;background:var(--plate);border-top:1px solid rgba(0,0,0,.14)}.preview-controls[hidden]{display:none}.live-controls{padding:12px 16px 14px;color:var(--void)}.controls-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px;font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ash)}.controls-mode{font-family:var(--font-mono);letter-spacing:0;text-transform:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.controls-mode:before{content:"";display:inline-block;width:5px;height:5px;margin-right:7px;vertical-align:1px;border-radius:50%;background:var(--void);animation:controls-pulse 1.8s ease-in-out infinite}.is-manual .controls-mode:before{animation:none;background:transparent;box-shadow:inset 0 0 0 1px var(--void)}@keyframes controls-pulse{50%{opacity:.25}}.controls-rows{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:4px 22px}.control{min-width:0;padding:8px 0 4px}.control-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.control-label{font-size:var(--t-caption);line-height:1.3;color:var(--void)}.control-value{font-family:var(--font-mono);font-size:.75rem;font-variant-numeric:tabular-nums;color:var(--void);white-space:nowrap}.control-hint{margin:3px 0 0;font-size:.6875rem;line-height:1.35;color:var(--ash)}.control-input{margin-top:6px}.range{--u: .5;position:relative;height:24px}.range-track{position:absolute;left:0;right:0;top:11px;height:2px;background:#00000029}.range-fill{height:100%;width:calc(var(--u) * 100%);background:var(--void)}.range-thumb{position:absolute;top:5px;left:calc(var(--u) * (100% - 14px));width:14px;height:14px;border-radius:50%;background:var(--void);box-shadow:0 0 0 3px var(--plate, #e6e6e4);transition:transform .16s ease;pointer-events:none}.range input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.range:hover .range-thumb,.range:active .range-thumb{transform:scale(1.18)}.range input:focus-visible+.range-thumb,.range:has(input:focus-visible) .range-thumb{box-shadow:0 0 0 3px var(--plate, #e6e6e4),0 0 0 5px var(--void)}.toggle{position:relative;width:38px;height:20px;padding:0;border:1px solid var(--void);border-radius:10px;background:transparent;cursor:pointer;transition:background-color .2s ease}.toggle-knob{position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:var(--void);transition:transform .22s cubic-bezier(.3,.7,.2,1),background-color .2s ease}.toggle[aria-checked=true]{background:var(--void)}.toggle[aria-checked=true] .toggle-knob{transform:translate(18px);background:var(--paper)}.segmented{display:flex;border:1px solid var(--void)}.segmented button{flex:1 1 0;min-width:0;min-height:28px;padding:0 6px;border:0;border-left:1px solid rgba(0,0,0,.18);background:transparent;font:inherit;font-size:.75rem;color:var(--void);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background-color .2s ease,color .2s ease}.segmented button:first-child{border-left:0}.segmented button[aria-checked=true]{background:var(--void);color:var(--paper)}.stepper{display:flex;align-items:center;gap:8px}.stepper-btn{width:28px;height:28px;padding:0;border:1px solid var(--void);background:transparent;font:inherit;font-size:1rem;line-height:1;color:var(--void);cursor:pointer}.stepper-btn:hover{background:var(--void);color:var(--paper)}.stepper-pips{flex:1;display:flex;gap:4px;height:28px;align-items:center}.pip{flex:1;height:8px;border:1px solid var(--void);cursor:pointer;transition:background-color .2s ease}.pip.is-on{background:var(--void)}.toggle:focus-visible,.segmented button:focus-visible,.stepper-btn:focus-visible,.stepper-pips:focus-visible{outline:2px solid var(--void);outline-offset:2px}@media(hover:none){.segmented button,.stepper-btn{min-height:36px}.stepper-btn{width:36px;height:36px}.range{height:32px}.range-track{top:15px}.range-thumb{top:8px;width:16px;height:16px;left:calc(var(--u) * (100% - 16px))}}@media(prefers-reduced-motion:reduce){.controls-mode:before{animation:none}}.live-models{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:0 22px;padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid rgba(0,0,0,.12)}.live-models .control[hidden]{display:none}.select{position:relative}.select:after{content:"";position:absolute;right:11px;top:50%;width:6px;height:6px;margin-top:-5px;border-right:1px solid var(--void);border-bottom:1px solid var(--void);transform:rotate(45deg);pointer-events:none}.select select{appearance:none;-webkit-appearance:none;width:100%;min-height:28px;padding:0 30px 0 8px;border:1px solid var(--void);border-radius:0;background:transparent;font:inherit;font-size:.75rem;color:var(--void);cursor:pointer;text-overflow:ellipsis}.select select:hover{background:#0000000a}.select select:focus-visible{outline:2px solid var(--void);outline-offset:2px}.select option,.select optgroup{color:#111;background:#fff}@media(hover:none){.select select{min-height:36px;font-size:1rem}}