.lab{min-width:0;margin:0}.lab-frame{isolation:isolate;aspect-ratio:1;background:#e9eae5;outline:none;width:100%;position:relative;overflow:hidden}.lab-frame[data-variant=signal]{aspect-ratio:16/9;color:#b7bfa8;background:#0b0d0a}@media (max-width:700px){.lab-frame[data-variant=hero]{aspect-ratio:4/5}.lab-frame[data-variant=signal]{aspect-ratio:4/3}}.lab-poster,.lab-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.lab-poster{object-fit:cover;z-index:1;pointer-events:none;transition:opacity .45s}.lab-frame[data-phase=live] .lab-poster{opacity:0}.lab-canvas{z-index:0;touch-action:pan-y;cursor:crosshair}.lab-frame[data-variant=signal] .lab-canvas{cursor:grab}.lab-frame[data-variant=signal] .lab-canvas:active{cursor:grabbing}.lab-frame[data-phase=poster] .lab-canvas,.lab-frame[data-phase=manual] .lab-canvas,.lab-frame[data-phase=loading] .lab-canvas{visibility:hidden}.lab-labels{z-index:2;pointer-events:none;justify-content:space-between;align-items:flex-start;gap:8px;display:flex;position:absolute;inset:12px 12px auto}.lab-labels .micro,.lab-hint{font-family:var(--font-mono), monospace;letter-spacing:.08em;color:var(--paper,#f0f1ea);background:#191b16e6;border-radius:2px;padding:6px 9px;font-size:10px;line-height:1.25}.lab-labels .micro:last-child{white-space:nowrap}.lab-frame[data-variant=signal] .lab-labels .micro,.lab-frame[data-variant=signal] .lab-hint{color:var(--ink,#191b16);background:#f0f1eaeb}.lab-hint{z-index:2;letter-spacing:.04em;pointer-events:none;opacity:0;max-width:calc(100% - 24px);margin:0;transition:opacity .4s;position:absolute;bottom:62px;left:12px}.lab-frame[data-phase=live] .lab-hint{opacity:1}.lab-frame[data-interacted] .lab-hint{opacity:0}.lab-run{z-index:3;background:0 0;border:0;place-items:center;padding:0;display:grid;position:absolute;inset:0}.lab-run span{background:var(--ink,#191b16);color:var(--paper,#f0f1ea);align-items:center;gap:10px;padding:14px 20px;font-size:14px;font-weight:500;display:inline-flex}.lab-run:hover span{background:#3b4229}.lab-run:focus-visible{outline-offset:-6px;outline:3px solid #768e00}.lab-frame .film-controls{z-index:4}.lab-frame[data-variant=signal] .film-controls button{color:var(--paper,#f0f1ea);background:#101310;border-color:#2c322a}.lab-mode[aria-pressed=true]{background:var(--lime,#dbff5b)!important;color:var(--ink,#191b16)!important}.lab-frame[data-phase=loading]:after{content:"";z-index:3;background:var(--lime,#dbff5b);width:40%;height:2px;animation:1.1s ease-in-out infinite alternate lab-loading;position:absolute;bottom:0;left:0}@keyframes lab-loading{0%{transform:translate(0)}to{transform:translate(150%)}}.lab-caption{font-family:var(--font-mono), monospace;color:var(--muted,#60625a);letter-spacing:.02em;justify-content:space-between;gap:10px;padding:11px 0;font-size:10px;display:flex}.lab-section .lab-caption,.lab-caption[data-variant=signal]{color:#b7bfa8}.lab-frame.film-screen-expanded{z-index:200;aspect-ratio:auto;background:#0b0d0a;width:100%;height:100%;position:fixed;inset:0}.lab-frame.film-screen-expanded .lab-canvas{touch-action:none}.lab-close{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));z-index:5;background:var(--paper,#f0f1ea);width:44px;height:44px;color:var(--ink,#191b16);cursor:pointer;border:1px solid #c9cdc280;place-items:center;padding:0;display:grid;position:absolute}.lab-close:hover{background:var(--lime,#dbff5b)}.lab-close:focus-visible{outline-offset:2px;outline:3px solid #768e00}.lab-frame.film-screen-expanded .lab-canvas,.lab-frame.film-screen-expanded .lab-poster{object-fit:contain}.lab-frame.film-screen-expanded .lab-labels{inset:max(16px, env(safe-area-inset-top)) max(72px, calc(env(safe-area-inset-right) + 60px)) auto max(16px, env(safe-area-inset-left))}.lab-frame.film-screen-expanded .lab-labels .micro,.lab-frame.film-screen-expanded .lab-hint{color:var(--paper,#f0f1ea);background:#191b16db}.lab-frame.film-screen-expanded .lab-hint{left:max(16px, env(safe-area-inset-left));bottom:max(72px, calc(env(safe-area-inset-bottom) + 72px))}@media (prefers-reduced-motion:reduce){.lab-poster{transition:none}.lab-frame[data-phase=loading]:after{animation:none}}
