.lab{flex-direction:column;gap:12px;display:flex}.lab-stage{aspect-ratio:16/10;border:2px solid var(--rp-color-border,#8f7a45);background:var(--rp-color-surface,#12101a);border-radius:6px;width:100%;position:relative;overflow:hidden}.lab-viewport{width:100%;height:100%}.lab-poster{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;height:100%;padding:24px;display:flex}.lab-poster-title{font-family:var(--rp-font-display,monospace);margin:0;font-size:clamp(1.4rem,4vw,2.2rem)}.lab-poster-sub{opacity:.75;max-width:34ch;margin:0}.lab-badge{color:#f7f4ea;font-family:var(--rp-font-mono,monospace);letter-spacing:.06em;background:#0000008c;border-radius:3px;padding:2px 8px;font-size:.72rem;position:absolute;top:8px;right:8px}.lab-badge[data-mode=playback]{color:#ffcf33}.lab-controls{flex-wrap:wrap;gap:8px;display:flex}.lab-power,.lab-skill{border:2px solid var(--rp-color-border,#8f7a45);background:var(--rp-color-surface-raised,transparent);color:inherit;cursor:pointer;font:inherit;border-radius:4px;padding:6px 12px}.lab-power{font-weight:700}.lab-power:focus-visible,.lab-skill:focus-visible{outline:2px solid var(--rp-color-accent,#ffcf33);outline-offset:2px}.lab-skill:disabled{cursor:not-allowed;opacity:.45}.lab-skill kbd{opacity:.7;margin-left:4px;font-size:.75em}.lab-howto{opacity:.8;margin:0;font-size:.9rem}.lab-howto kbd{margin:0 2px}.lab-telemetry{border:1px dashed var(--rp-color-border,#8f7a45);font-family:var(--rp-font-mono,monospace);border-radius:4px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:0;padding:10px;font-size:.78rem;display:grid}.lab-telemetry dt{opacity:.6;text-transform:uppercase;letter-spacing:.06em;font-size:.68rem}.lab-telemetry dd{white-space:pre;margin:2px 0 0}.lab-note{opacity:.72;margin:0;font-size:.85rem}.lab-xr{flex-wrap:wrap;align-items:center;gap:8px;display:flex;position:absolute;bottom:8px;left:8px;right:8px}.lab-xr-enter{border:2px solid var(--rp-color-border,#8f7a45);color:#f7f4ea;cursor:pointer;font:inherit;background:#0000008c;border-radius:4px;padding:6px 12px;font-weight:700}.lab-xr-enter:focus-visible{outline:2px solid var(--rp-color-accent,#ffcf33);outline-offset:2px}.lab-xr-hint{color:#f7f4ea;text-shadow:0 1px 3px #000c;opacity:.85;font-size:.78rem}.lab-modes{flex-wrap:wrap;align-items:baseline;gap:8px 12px;display:flex}.lab-mode-buttons{gap:0;display:flex}.lab-mode{border:2px solid var(--rp-color-border,#8f7a45);background:var(--rp-color-surface-raised,transparent);color:inherit;cursor:pointer;font:inherit;padding:6px 12px;font-size:.9rem}.lab-mode:first-child{border-radius:4px 0 0 4px}.lab-mode:last-child{border-left-width:1px;border-radius:0 4px 4px 0}.lab-mode[aria-pressed=true]{background:var(--rp-color-accent,#ffcf33);color:#20202a;font-weight:700}.lab-mode:disabled{cursor:not-allowed;opacity:.45}.lab-mode:focus-visible{outline:2px solid var(--rp-color-accent,#ffcf33);outline-offset:2px}.lab-mode-hint{opacity:.78;flex:22ch;margin:0;font-size:.82rem}.lab-badge[data-mode=live]{color:#7ce4a8}.lab-overlay{pointer-events:none;position:absolute;inset:0}.lab-pad{pointer-events:auto;touch-action:none;background:#00000057;border:2px solid #f7f4ea4d;border-radius:50%;width:116px;height:116px;display:none;position:absolute;bottom:14px}.lab-pad-right{right:14px}.lab-pad-left{left:14px}.lab-pad-key{color:#f7f4ea;width:40px;height:40px;font:inherit;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#0000008c;border:2px solid #f7f4ea73;border-radius:50%;padding:0;font-size:.9rem;line-height:1;position:absolute}.lab-pad-key:active{background:#ffcf3366;border-color:#ffcf33}.lab-pad-fwd{top:2px;left:36px}.lab-pad-back{bottom:2px;left:36px}.lab-pad-turn-left{top:36px;left:2px}.lab-pad-turn-right{top:36px;right:2px}.lab-pad-boop{letter-spacing:.03em;border-style:dashed;font-size:.62rem;top:36px;left:36px}.lab-pad-replace,.lab-pad-swap{color:#f7f4ea;width:30px;height:26px;font:inherit;background:#00000080;border:2px solid #f7f4ea59;border-radius:5px;padding:0;font-size:.8rem;line-height:1;position:absolute;top:-34px;right:0}.lab-pad-replace{right:36px}@media (pointer:coarse){.lab-pad{display:block}}.lab.is-immersive .lab-pad{display:block}.lab-pad[hidden],.lab.is-immersive .lab-pad[hidden]{display:none}
