:root{--buncss-light: ;--buncss-dark:initial;color-scheme:dark;--bg:#0f1115;--panel:#171a21;--panel-2:#1e222b;--border:#2a2f3a;--text:#e6e9ef;--muted:#8a93a5;--accent:#6ea8fe;--danger:#ff6b6b;--ok:#51cf66}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}#root{display:flex;flex-direction:column;height:100vh}button{background:var(--panel-2);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:8px;padding:8px 14px;font-size:14px}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);border-color:var(--accent);color:#0b0d11;font-weight:600}button.danger{border-color:var(--danger);color:var(--danger)}button:disabled{opacity:.5;cursor:not-allowed}input{background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:8px 12px;font-size:14px}input:focus{outline:none;border-color:var(--accent)}.topbar{display:flex;background:var(--panel);border-bottom:1px solid var(--border);align-items: center;gap:12px;padding:10px 16px}.topbar .title{font-weight:700}.topbar .spacer{flex:1}.status-dot{display:inline-block;border-radius:50%;width:10px;height:10px}.status-dot.ok{background:var(--ok)}.status-dot.pending{background:#f0b429}.status-dot.error{background:var(--danger)}.join-screen{display:flex;flex-direction:column;flex:1;justify-content:center;align-items: center;gap:16px}.join-screen .card{background:var(--panel);border:1px solid var(--border);display:flex;border-radius:12px;flex-direction:column;gap:12px;width:min(420px,90vw);padding:32px}.room-layout{display:flex;flex:1;min-height:0}.chat-pane{display:flex;flex-direction:column;flex:1;min-width:0}.side-pane{border-left:1px solid var(--border);background:var(--panel);display:flex;overflow-y:auto;flex-direction:column;gap:12px;width:240px;padding:12px}.messages{overflow-y:auto;display:flex;flex-direction:column;flex:1;gap:8px;padding:16px}.message .meta{color:var(--muted);margin-bottom:2px;font-size:12px}.message .meta .nick{color:var(--accent);font-weight:600}.message .text{white-space:pre-wrap;word-break:break-word}.composer{display:flex;border-top:1px solid var(--border);background:var(--panel);gap:8px;padding:12px 16px}.composer input{flex:1}.member{display:flex;align-items: center;gap:8px;padding:4px 0;font-size:14px}.member .in-call{color:var(--ok);font-size:12px}.member .you{color:var(--muted);font-size:12px}.section-title{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-size:12px}.call-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));background:var(--panel);border-bottom:1px solid var(--border);gap:8px;padding:12px 16px}.call-tile{position:relative;overflow:hidden;aspect-ratio:16/10;background:#000;border-radius:8px}.call-tile video{object-fit:cover;width:100%;height:100%}.call-tile .label{position:absolute;background:#0009;border-radius:6px;padding:2px 8px;font-size:12px;bottom:6px;left:6px}.call-controls{display:flex;flex-wrap:wrap;gap:8px}.hint{color:var(--muted);font-size:13px}.error-banner{border-bottom:1px solid var(--danger);color:var(--danger);background:#ff6b6b26;padding:8px 16px;font-size:13px}.sync-banner{display:flex;background:var(--panel);border:1px solid var(--border);color:var(--muted);animation:1.6s ease-in-out infinite sync-pulse;border-radius:999px;align-self: center;align-items: center;gap:10px;padding:6px 16px;font-size:13px}@keyframes sync-pulse{0%,to{opacity:1}50%{opacity:.55}}.spinner{border:2px solid var(--border);border-top-color:var(--accent);animation:.8s linear infinite spin;border-radius:50%;width:14px;height:14px}@keyframes spin{to{transform:rotate(360deg)}}button.toggled-off{border-color:var(--danger);color:var(--danger);background:#ff6b6b14}.cam-off-overlay{position:absolute;display:flex;color:var(--muted);justify-content:center;align-items: center;font-size:13px;inset:0}.tile-controls{position:absolute;display:flex;opacity:0;background:#0009;border-radius:6px;align-items: center;gap:6px;padding:3px 8px;transition:opacity .15s;bottom:6px;right:6px}.call-tile:hover .tile-controls{opacity:1}.tile-btn{cursor:pointer;background:0 0;border:none;padding:0;font-size:14px;line-height:1}.tile-controls input[type=range]{accent-color:var(--accent);width:70px}