:root{color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box}body{margin:0;background:#111827;color:#f9fafb}.page{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:1.25rem 1rem 2rem}.brand{color:#9ca3af;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1rem}h1{font-size:1.3rem;margin:0;overflow-wrap:anywhere}.muted{color:#9ca3af;margin:.5rem 0 0}.card{width:100%;max-width:440px;margin-top:8vh;background:#1f2937;border:1px solid #374151;border-radius:.75rem;padding:1.5rem}.notice{margin:.75rem 0 0;padding:.6rem .75rem;border-radius:.5rem;background:#422006;color:#fdba74}.error{margin:.75rem 0 0;color:#fca5a5}.code-form{display:flex;gap:.5rem;margin-top:1rem}.code-input{flex:1;min-width:0;padding:.65rem .75rem;border-radius:.5rem;border:1px solid #4b5563;background:#111827;color:inherit;font:inherit;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.1rem;letter-spacing:.15em;text-transform:uppercase}.code-input::placeholder{color:#4b5563}.code-input[aria-invalid=true]{border-color:#f87171}button{padding:.65rem 1.1rem;border:0;border-radius:.5rem;background:#f97316;color:#111827;font:inherit;font-weight:600;cursor:pointer}button:hover{background:#fb923c}.code-input:focus-visible,button:focus-visible{outline:2px solid #fdba74;outline-offset:2px}.viewer{width:100%;max-width:1100px}.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}.live-badge{flex:none;display:inline-flex;align-items:center;gap:.4rem;padding:.15rem .6rem;border-radius:999px;background:#dc2626;color:#fff;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.live-badge:before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:#fff}.stage{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;border:1px solid #374151;border-radius:.75rem;overflow:hidden}.player{display:block;width:100%;height:100%}.stage-message{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;padding:1rem;text-align:center;color:#9ca3af}.stage-message strong{color:#f9fafb;font-size:1.1rem}.spinner{width:1.75rem;height:1.75rem;margin-bottom:.5rem;border:3px solid #374151;border-top-color:#f97316;border-radius:50%;animation:spin .9s linear infinite}.card>.spinner{display:block}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2.5s}}@media(orientation:landscape)and (max-height:500px){.page{padding:.5rem}.brand{display:none}.viewer-header{margin-bottom:.4rem}.stage{max-height:calc(100vh - 3.5rem);margin:0 auto;width:auto}}