:root{--bg:#0f1117;--surface:#1a1d27;--border:#2e3040;--text:#c9d1e0;--text-h:#f0f3f9;--accent:#4f8ef7;--accent-hover:#6ea3ff;--danger:#e05c5c;--danger-hover:#f07070;--status-ok:#4ade80;--status-err:#f87171;--video-bg:#050608;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:system-ui,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.5}*,:before,:after{box-sizing:border-box}body{justify-content:center;align-items:flex-start;min-height:100svh;margin:0;padding:32px 16px;display:flex}#app{flex-direction:column;align-items:center;gap:28px;width:100%;max-width:860px;display:flex}h1{color:var(--text-h);letter-spacing:-.5px;margin:0;font-size:2rem;font-weight:600}#banners{flex-direction:column;gap:8px;width:100%;max-width:400px;display:flex}#room-full-banner:not([hidden]),#not-available-banner:not([hidden]),#closed-banner:not([hidden]){color:#fbbf24;background:#1c1a0a;border:1px solid #7a6500;border-radius:8px;align-items:center;gap:8px;padding:10px 14px;font-size:.875rem;font-weight:500;display:flex}#not-available-banner:not([hidden]){color:#d493b8;background:#1a1118;border-color:#6b2c4f}#closed-banner:not([hidden]){color:#93b8d4;background:#0f161f;border-color:#2c4a6b;line-height:1.4}#room-full-banner:before,#not-available-banner:before,#closed-banner:before{content:"●";font-size:.6rem;animation:1.4s ease-in-out infinite blink}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}#intro-text{width:100%;max-width:560px;color:var(--text);font-size:1.26rem;line-height:1.7}#intro-text p{margin:0 0 .8em}#intro-text p:last-child{margin-bottom:0}#intro-text a{color:var(--accent);text-decoration:underline}#intro-text a:hover{color:var(--accent-hover)}.btn{cursor:pointer;border:none;border-radius:8px;padding:10px 22px;font-size:.95rem;font-weight:600;transition:background .2s,opacity .2s}.btn:disabled{opacity:.45;cursor:not-allowed}#session-btn{padding:14px 31px;font-size:1.33rem}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--danger-hover)}#video-panel{flex-direction:column;align-items:center;gap:12px;width:100vw;margin-inline:calc(50% - 50vw);display:flex}.video-stage{background:var(--video-bg);justify-content:center;align-items:center;width:100%;height:min(56.25vw,100svh - 240px);min-height:240px;display:flex;position:relative;overflow:hidden}#remote-video{object-fit:contain;width:100%;height:100%;display:block}.video-pip{aspect-ratio:16/9;background:var(--video-bg);z-index:1;border:2px solid #ffffff8c;border-radius:6px;width:clamp(100px,22vw,220px);position:absolute;bottom:12px;right:12px;overflow:hidden;box-shadow:0 4px 14px #00000080}.video-pip video{object-fit:cover;width:100%;height:100%;display:block}.video-label{color:#fff;background:#0009;border-radius:3px;padding:1px 5px;font-size:.65rem;position:absolute;bottom:4px;left:6px}#status-bar{color:var(--status-ok);text-align:center;min-height:1.4em;font-size:.875rem}#status-bar.error{color:var(--status-err)}#error-log{background:#1a0a0a;border:1px solid #7f2020;border-radius:10px;width:100%;overflow:hidden}.error-log-header{color:var(--status-err);letter-spacing:.5px;text-transform:uppercase;background:#2a0f0f;border-bottom:1px solid #7f2020;justify-content:space-between;align-items:center;padding:8px 14px;font-size:.8rem;font-weight:600;display:flex}.btn-clear{color:var(--text);border:1px solid var(--border);background:0 0;padding:3px 10px;font-size:.75rem}.btn-clear:hover{background:var(--surface)}#error-list{max-height:220px;margin:0;padding:8px 0;font-family:ui-monospace,Consolas,monospace;font-size:.8rem;list-style:none;overflow-y:auto}#error-list li{color:#fca5a5;word-break:break-all;border-bottom:1px solid #2a0f0f;padding:4px 14px}#error-list li:last-child{border-bottom:none}