:root{--bg: #0f1115;--fg: #f2f4f8;--muted: #9aa4b2;--accent: #00b3a4;--err: #ff5a5f;--field: #161a22;--border: #2a303c}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{display:flex;flex-direction:column;height:100%}.app-header{padding:12px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #222733}.app-header h1{font-size:16px;margin:0;font-weight:600}.status{margin-left:auto;font-size:13px;color:var(--muted)}.status.live{color:var(--accent)}.status.error{color:var(--err)}.join{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;flex:1;padding:24px;text-align:center}.join p{color:var(--muted);margin:0}.room-input{font-size:20px;padding:12px 16px;border-radius:10px;border:1px solid var(--border);background:var(--field);color:var(--fg);text-align:center;letter-spacing:2px;width:min(320px,90vw)}button{font-size:16px;padding:12px 24px;border-radius:10px;border:0;background:var(--accent);color:#04211f;font-weight:700;cursor:pointer}button:disabled{opacity:.5;cursor:default}.error-text{color:var(--err);margin:0}.stage{flex:1;display:flex;align-items:center;justify-content:center;background:#000}.stage video{max-width:100%;max-height:100%}.controls{display:flex;justify-content:center;padding:12px;border-top:1px solid #222733}button.stop{background:var(--err);color:#2a0608}.hint{padding:8px 16px;font-size:12px;color:var(--muted);text-align:center;margin:0}