:root{--bg-main:#faf7f2;--surface-card:#fff;--surface-card-border:#f0ebe1;--text-main:#1c1917;--text-muted:#78716c;--accent-gold:#facc15;--accent-gold-hover:#eab308;--accent-gold-container:#fef9c3;--accent-gold-text:#854d0e;--accent-violet:#6366f1;--accent-violet-bg:#6366f11a;--status-live:#059669;--status-live-bg:#d1fae5;--status-paused:#d97706;--status-paused-bg:#fef3c7;--status-error:#dc2626;--status-error-bg:#fee2e2;--radius-xl:28px;--radius-lg:20px;--radius-md:14px;--radius-full:9999px;--shadow-sm:0 2px 8px #00000008;--shadow-md:0 8px 24px #0000000d;--font-sans:"Roboto", system-ui, -apple-system, sans-serif}:root[data-theme=dark]{--bg-main:#141311;--surface-card:#1f1d19;--surface-card-border:#2e2a24;--text-main:#f5f5f4;--text-muted:#a8a29e;--accent-gold:#facc15;--accent-gold-hover:#eab308;--accent-gold-container:#423505;--accent-gold-text:#fef08a;--accent-violet:#818cf8;--accent-violet-bg:#818cf826;--status-live:#34d399;--status-live-bg:#34d39926;--status-paused:#fbbf24;--status-paused-bg:#fbbf2426;--status-error:#f87171;--status-error-bg:#f8717126;--shadow-sm:0 2px 8px #0003;--shadow-md:0 8px 24px #0000004d}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg-main:#141311;--surface-card:#1f1d19;--surface-card-border:#2e2a24;--text-main:#f5f5f4;--text-muted:#a8a29e;--accent-gold:#facc15;--accent-gold-hover:#eab308;--accent-gold-container:#423505;--accent-gold-text:#fef08a;--accent-violet:#818cf8;--accent-violet-bg:#818cf826;--status-live:#34d399;--status-live-bg:#34d39926;--status-paused:#fbbf24;--status-paused-bg:#fbbf2426;--status-error:#f87171;--status-error-bg:#f8717126;--shadow-sm:0 2px 8px #0003;--shadow-md:0 8px 24px #0000004d}}*{box-sizing:border-box;margin:0;padding:0}html,body{font-family:var(--font-sans);background-color:var(--bg-main);color:var(--text-main);width:100%;min-height:100vh;line-height:1.5;transition:background-color .3s,color .3s;overflow-x:hidden}.bg-blob-top{opacity:.55;filter:blur(40px);pointer-events:none;z-index:0;background:radial-gradient(circle,#fef08a 0%,#fde047 60%,#0000 80%);border-radius:50% 40% 70% 30%/30% 60% 40% 70%;width:550px;height:350px;position:fixed;top:-80px;right:-100px}.bg-blob-bottom{opacity:.5;filter:blur(45px);pointer-events:none;z-index:0;background:radial-gradient(circle,#fef08a 0%,#fde047 70%,#0000 85%);border-radius:40% 60% 30% 70%/60% 30% 70% 40%;width:600px;height:400px;position:fixed;bottom:-100px;left:-120px}:root[data-theme=dark] .bg-blob-top,:root[data-theme=dark] .bg-blob-bottom{opacity:.15}.app-container{z-index:1;flex-direction:column;width:100%;min-height:100vh;display:flex;position:relative;overflow-x:hidden}.top-app-bar{justify-content:space-between;align-items:center;gap:12px;width:100%;max-width:1600px;margin:0 auto;padding:20px 36px;display:flex}.brand{color:var(--text-main);letter-spacing:-.02em;flex-shrink:0;align-items:center;gap:12px;font-size:1.35rem;font-weight:800;display:flex}.brand-icon{aspect-ratio:1;background-color:var(--accent-gold);color:#1c1917;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.top-bar-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.btn{border-radius:var(--radius-full);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:8px;height:44px;padding:0 20px;font-family:inherit;font-size:.875rem;font-weight:700;text-decoration:none;transition:all .2s cubic-bezier(.2,0,0,1);display:inline-flex}.btn:hover{box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn:active{transform:translateY(0)scale(.98)}.btn-gold{background-color:var(--accent-gold);color:#1c1917}.btn-gold:hover{background-color:var(--accent-gold-hover)}.btn-soft{background-color:var(--surface-card);color:var(--text-main);border:1px solid var(--surface-card-border)}.btn-soft:hover{background-color:var(--surface-card-border)}.btn-icon{aspect-ratio:1;border-radius:var(--radius-full);border:1px solid var(--surface-card-border);background:var(--surface-card);width:44px;height:44px;color:var(--text-main);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:inline-flex}.btn-icon:hover{background-color:var(--surface-card-border)}.main-layout{flex:1;grid-template-columns:1fr 340px;gap:24px;width:100%;max-width:1600px;margin:0 auto;padding:0 36px 36px;transition:grid-template-columns .3s;display:grid}.main-layout.theater-mode{grid-template-columns:1fr}.main-layout.theater-mode .side-panel{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.main-layout.theater-mode .video-stage{min-height:640px}@media (width<=1100px){.main-layout{grid-template-columns:1fr;padding:0 16px 24px}.top-app-bar{padding:16px}.health-dashboard{flex-direction:column;align-items:flex-start;gap:16px;padding:16px}.health-metrics{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px;width:100%;display:grid}}@media (width<=600px){.top-app-bar{gap:8px;padding:12px 14px}.brand{gap:8px;font-size:1.15rem}.brand-icon{border-radius:10px;width:32px;height:32px}.btn{height:38px;padding:0 14px;font-size:.8rem}.btn-icon{width:38px;height:38px}.top-bar-actions{gap:6px}.main-layout{gap:16px;padding:0 12px 20px}.video-stage{border-radius:18px;min-height:280px}}.stage-container{flex-direction:column;gap:20px;width:100%;display:flex}.health-dashboard{background-color:var(--surface-card);border-radius:var(--radius-xl);border:1px solid var(--surface-card-border);box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;gap:20px;width:100%;padding:18px 24px;display:flex}.health-status-group{align-items:center;gap:16px;display:flex}.status-badge{border-radius:var(--radius-full);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:8px;padding:8px 18px;font-size:.8125rem;font-weight:800;display:inline-flex}.status-badge.live{background-color:var(--status-live-bg);color:var(--status-live)}.status-badge.live .dot{background-color:var(--status-live);border-radius:50%;width:8px;height:8px}.status-badge.paused{background-color:var(--status-paused-bg);color:var(--status-paused)}.status-badge.connecting{background-color:var(--accent-violet-bg);color:var(--accent-violet)}.status-badge.idle{background-color:var(--bg-main);color:var(--text-muted)}.status-badge.error{background-color:var(--status-error-bg);color:var(--status-error)}.health-metrics{align-items:center;gap:24px;display:flex}.metric-item{flex-direction:column;display:flex}.metric-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-size:.6875rem;font-weight:700}.metric-value{color:var(--text-main);font-size:.875rem;font-weight:700}.metric-value.highlight{color:var(--accent-violet)}.video-stage{border-radius:var(--radius-xl);min-height:520px;box-shadow:var(--shadow-md);background-color:#000;border:1px solid #0003;justify-content:center;align-items:center;width:100%;transition:cursor .2s;display:flex;position:relative;overflow:hidden}.video-stage.user-inactive,.video-stage.user-inactive *{cursor:none!important}.video-stage moq-publish,.video-stage moq-watch{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.video-stage video,.video-stage canvas{object-fit:contain;background:#000;width:100%;height:100%;max-height:72vh;display:block}.video-overlay-controls{z-index:9999;-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-full);opacity:0;pointer-events:none;background:#000000bf;border:1.5px solid #ffffff4d;align-items:center;gap:8px;padding:6px 10px;transition:opacity .35s,transform .35s;display:flex;position:absolute;bottom:16px;right:16px;transform:translateY(4px);box-shadow:0 4px 16px #0006}.video-stage.user-active .video-overlay-controls,.video-overlay-controls:hover{opacity:1;pointer-events:auto;transform:translateY(0)}.video-stage.user-inactive .video-overlay-controls{opacity:0!important;pointer-events:none!important;transform:translateY(4px)!important}.video-overlay-btn{color:#fff;cursor:pointer;background:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;transition:all .2s;display:flex}.video-overlay-btn:hover{background:var(--accent-gold);color:#1c1917;transform:scale(1.08)}.video-overlay-btn svg{stroke:currentColor;fill:none;width:20px;height:20px}:-webkit-any(.video-stage:fullscreen,.video-stage:-webkit-full-screen,.video-stage:fullscreen){background-color:#000!important;border-radius:0!important;width:100vw!important;height:100vh!important;max-height:100vh!important}:-moz-any(.video-stage:fullscreen,.video-stage:fullscreen,.video-stage:-moz-full-screen){background-color:#000!important;border-radius:0!important;width:100vw!important;height:100vh!important;max-height:100vh!important}:is(.video-stage:fullscreen,.video-stage:fullscreen,.video-stage:fullscreen){background-color:#000!important;border-radius:0!important;width:100vw!important;height:100vh!important;max-height:100vh!important}:-webkit-any(.video-stage:fullscreen moq-publish,.video-stage:fullscreen moq-watch,.video-stage:fullscreen video,.video-stage:fullscreen canvas,.video-stage:-webkit-full-screen moq-publish,.video-stage:-webkit-full-screen moq-watch,.video-stage:-webkit-full-screen video,.video-stage:-webkit-full-screen canvas){object-fit:contain!important;width:100vw!important;height:100vh!important;max-height:100vh!important}:is(.video-stage:fullscreen moq-publish,.video-stage:fullscreen moq-watch,.video-stage:fullscreen video,.video-stage:fullscreen canvas,.video-stage:fullscreen moq-publish,.video-stage:fullscreen moq-watch,.video-stage:fullscreen video,.video-stage:fullscreen canvas){object-fit:contain!important;width:100vw!important;height:100vh!important;max-height:100vh!important}.placeholder-card{text-align:center;color:#fff;flex-direction:column;align-items:center;gap:16px;max-width:460px;padding:40px 24px;display:flex}.placeholder-icon{width:72px;height:72px;color:var(--accent-gold);background-color:#ffffff1a;border-radius:50%;justify-content:center;align-items:center;display:flex}.floating-bar-wrapper{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-full);border:1px solid var(--surface-card-border);width:fit-content;max-width:95%;transition:all var(--transition-fast);background:#fdf8e7d9;justify-content:center;margin:0 auto;padding:10px 18px;display:flex;box-shadow:0 8px 32px #00000040}:root[data-theme=dark] .floating-bar-wrapper{background:#1f1d19d9;border-color:#ffffff26}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .floating-bar-wrapper{background:#1f1d19d9;border-color:#ffffff26}}.floating-control-bar{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;width:100%;display:flex}.floating-control-bar .btn{border-radius:var(--radius-full);box-sizing:border-box;white-space:nowrap;justify-content:center;align-items:center;gap:8px;height:42px;padding:0 18px;font-size:.875rem;display:inline-flex}.side-panel{flex-direction:column;gap:20px;width:100%;display:flex}.card{background-color:var(--surface-card);border-radius:var(--radius-xl);border:1px solid var(--surface-card-border);box-shadow:var(--shadow-sm);flex-direction:column;gap:16px;width:100%;padding:22px;display:flex}.card-title{color:var(--text-main);font-size:1.05rem;font-weight:800}.field-group{flex-direction:column;gap:8px;width:100%;display:flex}.field-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-size:.6875rem;font-weight:700}.input,.select{border-radius:var(--radius-md);border:1px solid var(--surface-card-border);background-color:var(--bg-main);width:100%;height:46px;color:var(--text-main);outline:none;padding:0 16px;font-family:inherit;font-size:.9rem;font-weight:600;transition:all .2s}.input:focus,.select:focus{border-color:var(--accent-gold-hover);background-color:var(--surface-card)}.input-with-btn{align-items:center;gap:8px;width:100%;display:flex}.btn-square-gold{border-radius:var(--radius-md);background-color:var(--accent-gold-container);width:46px;height:46px;color:var(--accent-gold-text);cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:1.1rem;transition:all .2s;display:flex}.btn-square-gold:hover{background-color:var(--accent-gold);color:#1c1917}.qr-container{border-radius:var(--radius-lg);border:1px solid var(--surface-card-border);background-color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;display:flex}.qr-container img{border-radius:8px;max-width:180px;height:auto}.diag-list{flex-direction:column;gap:10px;font-size:.875rem;display:flex}.diag-row{justify-content:space-between;align-items:center;display:flex}.diag-val{align-items:center;gap:6px;font-weight:700;display:flex}.diag-val.hw{color:#16a34a}.diag-val.soft{color:#d97706}.diag-val.unsupported{color:#dc2626}.copy-toast{color:#fff;border-radius:var(--radius-full);box-shadow:var(--shadow-md);z-index:100;white-space:nowrap;background-color:#1c1917;align-items:center;gap:10px;padding:12px 26px;font-size:.875rem;font-weight:700;display:flex;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}.viewer-status-overlay{z-index:50;-webkit-backdrop-filter:blur(16px);opacity:1;visibility:visible;background:#0a0a0fd9;justify-content:center;align-items:center;padding:24px;transition:opacity .4s cubic-bezier(.16,1,.3,1),visibility .4s;display:flex;position:absolute;inset:0}.viewer-status-overlay.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}.viewer-status-card{border:1px solid var(--surface-card-border,#f0ebe1);border-radius:var(--radius-xl,24px);text-align:center;width:100%;max-width:480px;color:var(--text-main,#1c1917);-webkit-backdrop-filter:blur(20px);background:#fdf8e7eb;flex-direction:column;align-items:center;gap:16px;padding:36px 28px;animation:.35s ease-out cardFadeIn;display:flex;box-shadow:0 20px 50px #78716c26,inset 0 1px 1px #fffc}:root[data-theme=dark] .viewer-status-card{color:var(--text-main,#f5f5f4);background:#1c1917e0;border-color:#ffffff26;box-shadow:0 24px 60px #0009,inset 0 1px 1px #ffffff26}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .viewer-status-card{color:var(--text-main,#f5f5f4);background:#1c1917e0;border-color:#ffffff26;box-shadow:0 24px 60px #0009,inset 0 1px 1px #ffffff26}}@keyframes cardFadeIn{0%{opacity:0;transform:translateY(8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.status-icon-wrapper{background:#0000000a;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;margin-bottom:4px;display:flex;position:relative}:root[data-theme=dark] .status-icon-wrapper{background:#ffffff0f}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .status-icon-wrapper{background:#ffffff0f}}.spinner-glow{animation:2s ease-in-out infinite alternate pulseGlow}.spinner-icon{animation:1.5s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulseGlow{0%{box-shadow:0 0 15px #f59e0b33}to{box-shadow:0 0 35px #f59e0b8c}}.radar-pulse{background:#f59e0b14}.radar-wave{opacity:0;border:1.5px solid #f59e0b80;border-radius:50%;animation:2.4s cubic-bezier(.215,.61,.355,1) infinite radarWave;position:absolute;inset:-10px}.wave-1{animation-delay:0s}.wave-2{animation-delay:.8s}.wave-3{animation-delay:1.6s}@keyframes radarWave{0%{opacity:.8;transform:scale(.5)}to{opacity:0;transform:scale(1.8)}}.error-badge{background:#ef44441f;box-shadow:0 0 25px #ef444459}.status-title{letter-spacing:-.01em;margin:0;font-size:1.35rem;font-weight:800}.status-subtitle{color:var(--text-muted,#78716c);margin:0;font-size:.875rem;line-height:1.5}.code-badge{color:var(--accent-gold-text,#854d0e);background:#f59e0b26;border:1px solid #f59e0b4d;border-radius:6px;padding:2px 8px;font-family:monospace;font-size:.825rem}:root[data-theme=dark] .code-badge{color:var(--accent-gold,#f59e0b)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .code-badge{color:var(--accent-gold,#f59e0b)}}.status-pill{border-radius:var(--radius-full,9999px);color:var(--text-main,#1c1917);word-break:break-all;background:#0000000a;border:1px solid #00000014;align-items:center;gap:8px;padding:6px 14px;font-size:.8rem;display:inline-flex}:root[data-theme=dark] .status-pill{color:#e4e4e7;background:#ffffff12;border-color:#ffffff1f}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .status-pill{color:#e4e4e7;background:#ffffff12;border-color:#ffffff1f}}.pulse-dot{background:var(--accent-gold,#f59e0b);width:8px;height:8px;box-shadow:0 0 8px var(--accent-gold,#f59e0b);border-radius:50%;animation:1.4s infinite alternate dotBlink}.pulse-dot.active{background:#10b981;box-shadow:0 0 8px #10b981}.pulse-dot.error{background:#ef4444;box-shadow:0 0 8px #ef4444}@keyframes dotBlink{0%{opacity:.3}to{opacity:1}}.status-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:6px;display:flex}.btn-sm{padding:8px 14px;font-size:.8rem}@media (width<=640px){.floating-bar-wrapper{border-radius:var(--radius-xl);width:calc(100% - 24px);padding:10px 12px;box-shadow:0 10px 36px #0006}.floating-control-bar{grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:8px;width:100%;display:grid}.floating-control-bar .btn{border-radius:var(--radius-lg);justify-content:center;width:100%;height:40px;padding:0 10px;font-size:.8rem}}