:root{--bg:#f6f7fb;--panel:#fff;--text:#111827;--muted:#6b7280;--brand:#2563eb;--line:#e5e7eb;--msg:#eef2ff;--mine:#dcfce7}body.dark{--bg:#0f172a;--panel:#111827;--text:#e5e7eb;--muted:#94a3b8;--brand:#60a5fa;--line:#334155;--msg:#1e293b;--mine:#064e3b}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}button,input,textarea{font:inherit}button{background:var(--brand);color:white;border:0;border-radius:10px;padding:.65rem .9rem;cursor:pointer}input,textarea{border:1px solid var(--line);border-radius:10px;padding:.75rem;background:var(--panel);color:var(--text)}.hidden{display:none!important}.join-card{max-width:460px;margin:8vh auto;padding:2rem;background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:0 12px 40px #0002}.join-card label{display:grid;gap:.4rem;margin:1rem 0}.app{height:100dvh;display:grid;grid-template-columns:300px 1fr}.sidebar{background:var(--panel);border-right:1px solid var(--line);padding:1rem;overflow:auto}.room-head{display:flex;justify-content:space-between;gap:.5rem;align-items:center}.room-head small{display:block;color:var(--muted);font-size:.75rem;word-break:break-all}.notice{color:var(--muted);font-size:.85rem;margin-top:1rem}.members{display:grid;gap:.5rem;margin-top:1rem}.member{display:grid;gap:.25rem;padding:.7rem;border:1px solid var(--line);border-radius:12px;background:var(--bg)}.member small{color:var(--muted);word-break:break-all}.member-actions{display:flex;gap:.4rem;flex-wrap:wrap}.member-actions button{font-size:.8rem;padding:.35rem .55rem}.chat{height:100dvh;display:grid;grid-template-rows:auto 1fr auto;background:var(--bg)}.topbar{display:flex;gap:.5rem;align-items:center;padding:.75rem;border-bottom:1px solid var(--line);background:var(--panel)}#sideToggle,#membersToggle{display:none}.messages{overflow:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.message{max-width:min(780px,92%);background:var(--msg);border-radius:16px;padding:.75rem;white-space:pre-wrap;word-break:break-word}.message.mine{align-self:flex-end;background:var(--mine)}.meta{font-size:.78rem;color:var(--muted);margin-bottom:.3rem}.system{align-self:center;color:var(--muted);font-size:.85rem}.composer{display:grid;grid-template-columns:auto 1fr auto;gap:.5rem;padding:.75rem;background:var(--panel);border-top:1px solid var(--line);padding-bottom:calc(.75rem + env(safe-area-inset-bottom))}.composer textarea{resize:none;max-height:140px}.calls{position:fixed;inset:auto 1rem 5.5rem auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:.75rem;box-shadow:0 12px 40px #0004;max-width:420px}.calls video{width:180px;max-width:40vw;border-radius:12px;background:#000;margin:.25rem}@media(max-width:760px){.app{grid-template-columns:1fr}.sidebar{position:fixed;inset:0 25% 0 0;z-index:5;transform:translateX(-105%);transition:.2s;box-shadow:0 0 0 999px #0006}.sidebar.open{transform:translateX(0)}#sideToggle,#membersToggle{display:inline-block}.topbar{overflow:auto}.messages{padding:.75rem}.message{max-width:96%}.calls{left:.5rem;right:.5rem;bottom:5rem}.calls video{width:45%}.join-card{margin:1rem;border-radius:16px}.composer{grid-template-columns:auto 1fr auto}}