.lab-as{margin-top:clamp(2.5rem,7vw,4.5rem)}.lab-as-frame{aspect-ratio:16/9;border:1px solid color-mix(in oklch, var(--fg) 20%, transparent);border-radius:var(--radius-0);background-color:var(--bg-elev);position:relative;overflow:hidden}.lab-as-source{object-fit:cover;width:100%;height:100%;display:block}.lab-as-stage{opacity:0;pointer-events:none;transition:opacity var(--t-quick) var(--e-out);position:absolute;inset:0}.lab-as-stage canvas{width:100%;height:100%;display:block}.lab-as-unsupported{background-color:var(--bg-elev);color:var(--fg-muted);font-family:var(--font-mono);margin:0;padding:.5rem .875rem;display:none;position:absolute;bottom:clamp(1rem,3vw,1.75rem);left:50%;transform:translate(-50%)}.lab-as-bar{visibility:hidden;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.25rem 1.5rem;margin-top:.875rem;display:flex}.lab-as-switch{gap:1.25rem;display:flex}.lab-as-switch-button{font-family:var(--font-mono);padding:.25rem 0}.lab-as-cell{align-items:center;gap:.75rem;display:flex}.lab-as-cell-label,.lab-as-cell-value,.lab-as-weight{font-family:var(--font-mono);color:var(--fg-muted);margin:0}.lab-as-cell-value b,.lab-as-weight b{color:var(--fg);font-variant-numeric:tabular-nums;font-weight:500}.lab-as-range{appearance:none;background:linear-gradient(color-mix(in oklch, var(--fg) 30%, transparent), color-mix(in oklch, var(--fg) 30%, transparent)) center / 100% 1px no-repeat;cursor:pointer;width:7rem;height:2.75rem}.lab-as-range::-webkit-slider-thumb{appearance:none;background:var(--accent);width:.85rem;height:.85rem}.lab-as-range::-moz-range-thumb{background:var(--accent);border:0;width:.85rem;height:.85rem}.lab-as-range:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.lab-as-range:disabled{cursor:not-allowed;opacity:.4}.lab-as[data-lab-ascii-mode=original] :is(.lab-as-cell-label,.lab-as-cell-value){opacity:.4}.lab-as-hint{font-family:var(--font-mono);color:var(--fg-muted);visibility:hidden;margin:.875rem 0 0}.lab-as[data-lab-ascii-state=live] .lab-as-bar,.lab-as[data-lab-ascii-state=live] .lab-as-hint{visibility:visible}.lab-as[data-lab-ascii-state=live]:not([data-lab-ascii-mode=original]) .lab-as-stage{opacity:1}.lab-as[data-lab-ascii-state=unsupported] .lab-as-unsupported{display:block}@media (prefers-reduced-motion:reduce){.lab-as-stage{transition:none}}
.lab-au{margin-top:clamp(2.5rem,7vw,4.5rem)}.lab-au-frame{aspect-ratio:16/9;border:1px solid color-mix(in oklch, var(--fg) 20%, transparent);border-radius:var(--radius-0);background-color:var(--bg-elev);position:relative;overflow:hidden}.lab-au-silence{inset-inline:clamp(1rem,4vw,2.5rem);background-color:color-mix(in oklch, var(--fg) 30%, transparent);height:1px;transition:opacity var(--t-quick) var(--e-out);position:absolute;top:50%}.lab-au-silence-note{inset-inline-start:clamp(1rem,4vw,2.5rem);font-family:var(--font-mono);color:var(--fg-muted);transition:opacity var(--t-quick) var(--e-out);margin:0;position:absolute;top:calc(50% - 1.75rem)}.lab-au-stage{opacity:0;pointer-events:none;transition:opacity var(--t-base) var(--e-out);position:absolute;inset:0}.lab-au-stage canvas{width:100%;height:100%;display:block}@media (max-width:40rem){.lab-au-frame{aspect-ratio:4/3}}.lab-au-run{background-color:var(--bg-elev);min-height:3rem;color:var(--fg);font-size:var(--text-label);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;cursor:pointer;align-items:center;padding-inline:1.5rem;font-weight:500;display:none;position:absolute;bottom:clamp(1rem,3vw,1.75rem);left:50%;transform:translate(-50%)}.lab-au:not([data-lab-audio-state=live]) [data-lab-audio-label=stop],.lab-au[data-lab-audio-state=live] [data-lab-audio-label=start]{display:none}.lab-au-note{background-color:var(--bg-elev);color:var(--fg-muted);font-family:var(--font-mono);margin:0;padding:.5rem .875rem}.lab-au-unsupported{display:none;position:absolute;bottom:clamp(1rem,3vw,1.75rem);left:50%;transform:translate(-50%)}.lab-au-blocked{inset-inline:clamp(1rem,4vw,2.5rem);flex-direction:column;align-items:center;gap:.75rem;display:none;position:absolute;bottom:clamp(1rem,3vw,1.75rem)}.lab-au-retry{white-space:nowrap;background-color:var(--bg-elev);min-height:2.75rem;color:var(--fg);font-family:var(--font-mono);font-size:var(--text-mono-data);padding-inline:1.25rem}.lab-au-mic-denied{inset-inline-start:clamp(1rem,4vw,2.5rem);max-width:min(28rem,70%);display:none;position:absolute;top:clamp(1rem,3vw,1.75rem)}.lab-au-bar{visibility:hidden;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.25rem 1.5rem;margin-top:.875rem;display:flex}.lab-au-switch{gap:1.25rem;display:flex}.lab-au-switch-button{font-family:var(--font-mono);padding:.25rem 0}.lab-au-level,.lab-au-weight{font-family:var(--font-mono);color:var(--fg-muted);align-items:center;gap:.5rem;margin:0;display:flex}.lab-au-level b,.lab-au-weight b{color:var(--fg);font-variant-numeric:tabular-nums;font-weight:500}.lab-au-meter{background-color:color-mix(in oklch, var(--fg) 25%, transparent);width:4.5rem;height:1px;display:inline-block;position:relative}.lab-au-meter:after{content:"";background-color:var(--fg);transform:scaleX(var(--lab-au-level,0));transform-origin:0;transition:transform var(--t-instant) var(--e-out);position:absolute;inset:0}.lab-au-privacy,.lab-au-hint{font-family:var(--font-mono);color:var(--fg-muted);visibility:hidden;margin:.875rem 0 0}.lab-au[data-lab-audio-state=ready] .lab-au-bar,.lab-au[data-lab-audio-state=loading] .lab-au-bar,.lab-au[data-lab-audio-state=live] .lab-au-bar,.lab-au[data-lab-audio-state=blocked] .lab-au-bar,.lab-au[data-lab-audio-state=ready] .lab-au-privacy,.lab-au[data-lab-audio-state=loading] .lab-au-privacy,.lab-au[data-lab-audio-state=live] .lab-au-privacy,.lab-au[data-lab-audio-state=blocked] .lab-au-privacy,.lab-au[data-lab-audio-state=ready] .lab-au-hint,.lab-au[data-lab-audio-state=loading] .lab-au-hint,.lab-au[data-lab-audio-state=live] .lab-au-hint,.lab-au[data-lab-audio-state=blocked] .lab-au-hint{visibility:visible}.lab-au[data-lab-audio-state=ready] .lab-au-run,.lab-au[data-lab-audio-state=loading] .lab-au-run,.lab-au[data-lab-audio-state=live] .lab-au-run{display:inline-flex}.lab-au[data-lab-audio-state=live] .lab-au-stage{opacity:1}.lab-au[data-lab-audio-state=live] .lab-au-silence,.lab-au[data-lab-audio-state=live] .lab-au-silence-note{opacity:0}.lab-au[data-lab-audio-state=unsupported] .lab-au-unsupported{display:block}.lab-au[data-lab-audio-state=blocked] .lab-au-blocked{display:flex}.lab-au[data-lab-audio-mic=denied] .lab-au-mic-denied{display:block}@media (prefers-reduced-motion:reduce){.lab-au-stage,.lab-au-silence,.lab-au-silence-note,.lab-au-meter:after{transition:none}}
.lab-pt{margin-top:clamp(2.5rem,7vw,4.5rem)}.lab-pt-frame{aspect-ratio:16/9;border:1px solid color-mix(in oklch, var(--fg) 20%, transparent);border-radius:var(--radius-0);background-color:var(--bg-elev);position:relative;overflow:hidden}.lab-pt-stage{opacity:0;touch-action:none;transition:opacity var(--t-base) var(--e-out);position:absolute;inset:0}.lab-pt-stage canvas{width:100%;height:100%;display:block}@media (hover:hover) and (pointer:fine){.lab-pt-stage{cursor:crosshair}}.lab-pt-poster{pointer-events:none;background-color:var(--fg);opacity:.7;transition:opacity var(--t-base) var(--e-out);position:absolute;inset:0;-webkit-mask-image:url(/lab/particles-poster.avif);mask-image:url(/lab/particles-poster.avif);-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.lab-pt-unsupported,.lab-pt-run{display:none;position:absolute;bottom:clamp(1rem,3vw,1.75rem);left:50%;transform:translate(-50%)}.lab-pt-unsupported{background-color:var(--bg-elev);color:var(--fg-muted);font-family:var(--font-mono);margin:0;padding:.5rem .875rem}.lab-pt-run{background-color:var(--bg-elev);min-height:3rem;color:var(--fg);font-size:var(--text-label);letter-spacing:.08em;text-transform:uppercase;align-items:center;padding-inline:1.5rem;font-weight:500}.lab-pt-bar{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.75rem 1.5rem;margin-top:.875rem;display:none}.lab-pt-readout{font-family:var(--font-mono);color:var(--fg-muted);flex-wrap:wrap;gap:.35rem 1.5rem;margin:0;display:flex}.lab-pt-slot b{color:var(--fg);font-variant-numeric:tabular-nums;font-weight:500}.lab-pt-switch{gap:1.25rem;display:flex}.lab-pt-switch-button{font-family:var(--font-mono);padding:.25rem 0}.lab-pt-pool-button{font-variant-numeric:tabular-nums}.lab-pt-hint,.lab-pt-nogpu,.lab-pt-pinned{font-family:var(--font-mono);color:var(--fg-muted);margin:.875rem 0 0;display:none}.lab-pt[data-lab-particles-state=live] .lab-pt-stage{opacity:1}.lab-pt[data-lab-particles-state=live] .lab-pt-poster{opacity:0}.lab-pt[data-lab-particles-state=live] .lab-pt-bar,.lab-pt[data-lab-particles-state=loading] .lab-pt-bar{display:flex}.lab-pt[data-lab-particles-state=live] .lab-pt-hint,.lab-pt[data-lab-particles-state=unsupported] .lab-pt-unsupported,.lab-pt[data-lab-particles-webgpu=false] .lab-pt-nogpu,.lab-pt[data-lab-particles-pinned=true] .lab-pt-pinned{display:block}.lab-pt[data-lab-particles-state=hold] .lab-pt-run{display:inline-flex}@media (prefers-reduced-motion:reduce){.lab-pt-stage,.lab-pt-poster{transition:none}}
.lab-exp{padding-block:clamp(3rem,8vw,5rem) clamp(6rem,14vw,10rem);padding-inline:clamp(1.5rem,5vw,4rem)}.lab-exp-back{margin:0}.lab-exp-back-link{font-family:var(--font-mono)}.lab-exp-head{max-width:42rem;margin-top:clamp(1.5rem,4vw,2.5rem)}.lab-exp-head-meta{font-family:var(--font-mono);color:var(--fg-muted);flex-wrap:wrap;align-items:baseline;gap:.5rem 1rem;margin:clamp(1.25rem,3vw,2rem) 0 0;display:flex}.lab-exp-status{color:var(--accent)}.lab-exp-challenge{color:var(--fg);margin:clamp(1.25rem,3vw,2rem) 0 0}.lab-exp-demo{margin-top:clamp(2.5rem,7vw,4.5rem)}.lab-exp-demo-inner{aspect-ratio:16/9;border:1px solid color-mix(in oklch, var(--fg) 20%, transparent);border-radius:var(--radius-0);background-color:var(--bg-elev);justify-content:center;align-items:center;display:flex}.lab-exp-demo-note{text-align:center}.lab-exp-prose{max-width:42rem;margin-top:clamp(3rem,8vw,5rem)}.lab-exp-note{color:var(--fg);margin:1.25rem 0 0}.lab-exp-code{max-width:42rem;margin-top:clamp(3rem,8vw,5rem)}.lab-exp-label{color:var(--fg-muted);margin:0}.lab-exp-pre{border:1px solid color-mix(in oklch, var(--fg) 20%, transparent);border-radius:var(--radius-0);background-color:var(--bg-elev);margin:1.25rem 0 0;padding:clamp(1.25rem,3vw,1.75rem);overflow-x:auto}.lab-exp-code-text{color:var(--fg);white-space:pre}.lab-exp-nav{border-top:1px solid color-mix(in oklch, var(--fg) 20%, transparent);grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);margin-top:clamp(5rem,12vw,8rem);padding-top:clamp(1.5rem,4vw,2.5rem);display:grid}.lab-exp-nav-link{width:fit-content;color:inherit;flex-direction:column;gap:.625rem;text-decoration:none;display:flex}.lab-exp-nav-next{text-align:right;justify-self:end;align-items:flex-end}.lab-exp-nav-label{color:var(--fg-muted)}@media (max-width:47.9375rem){.lab-exp-nav{grid-template-columns:1fr}.lab-exp-nav-next{text-align:left;justify-self:start;align-items:flex-start}}