:root{--bg: #0f1115;--bg-2: #171a21;--bg-3: #1e222b;--line: #2a2f3a;--text: #e7e9ee;--muted: #8b93a3;--accent: #ff5a4d;--accent-2: #4d8dff;--green: #2ecc71}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent}.muted{color:var(--muted)}.error{color:var(--accent);font-size:.85rem}button{cursor:pointer;font:inherit}input,textarea{font:inherit;background:var(--bg-3);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:.7rem .9rem;outline:none}input:focus,textarea:focus{border-color:var(--accent-2)}.splash,.auth{height:100%;display:grid;place-items:center}.auth-card{display:flex;flex-direction:column;gap:.7rem;background:var(--bg-2);padding:2rem;border-radius:18px;width:min(360px,92vw);border:1px solid var(--line)}.auth-card h1{margin:0;font-size:1.6rem}.auth-card button[type=submit]{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:.75rem;font-weight:600}.link{background:none;border:none;color:var(--accent-2);padding:.3rem}.auth-divider{display:flex;align-items:center;gap:.6rem;color:var(--muted);font-size:.8rem}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--line)}.guest-btn{background:var(--bg-3);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:.7rem;font-weight:600;cursor:pointer}.guest-btn:disabled{opacity:.6}.app{display:flex;flex-direction:column;height:100%}.topbars{flex:0 0 auto;display:flex;flex-direction:column;z-index:30}.topbar{display:flex;align-items:center;gap:.7rem;padding:.5rem .8rem;background:var(--bg-2);border-bottom:1px solid var(--line);flex:0 0 auto;z-index:30}.topbar.dmbar{background:var(--bg);padding:.4rem .8rem}.dmbar-label{color:var(--accent-2);font-size:1.05rem;flex:0 0 auto}.tab-count{background:var(--line);color:var(--text);border-radius:999px;font-size:.72rem;font-weight:600;padding:0 .45rem;min-width:1.2rem;text-align:center}.tab.dm{padding-left:.3rem}.tab .tab-avatar{width:22px;height:22px;flex:0 0 22px;font-size:.6rem}.topbar-avatar{background:none;border:none;padding:0;cursor:pointer;border-radius:50%}.topbar-avatar:hover{box-shadow:0 0 0 2px var(--accent-2)}.topbar-title{font-weight:700;font-size:1.05rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-tabs{display:flex;gap:.4rem;flex:1;overflow-x:auto;scrollbar-width:thin}.topbar-tabs::-webkit-scrollbar{height:4px}.tab{display:flex;align-items:center;gap:.3rem;background:var(--bg-3);border:1px solid var(--line);border-radius:999px;padding:.3rem .4rem .3rem .75rem;cursor:pointer;white-space:nowrap;max-width:200px}.tab.active{border-color:var(--accent);background:var(--bg)}.tab-label{overflow:hidden;text-overflow:ellipsis;font-size:.88rem}.tab-close{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.85rem;line-height:1;padding:0 .2rem;border-radius:50%}.tab-close:hover{color:var(--text);background:var(--line)}.members-toggle{background:none;border:none;color:var(--text);cursor:pointer;padding:.3rem;border-radius:8px;display:grid;place-items:center;flex:0 0 auto}.members-toggle:hover,.members-toggle.on{background:var(--bg-3);color:var(--accent-2)}.members-backdrop{position:fixed;inset:0;background:#00000073;opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}.members-backdrop.show{opacity:1;pointer-events:auto}.members-panel{position:fixed;top:0;right:0;bottom:0;width:min(320px,86vw);background:var(--bg-2);border-left:1px solid var(--line);transform:translate(100%);transition:transform .22s ease;z-index:41;display:flex;flex-direction:column}.members-panel.open{transform:translate(0)}.members-head{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1rem;border-bottom:1px solid var(--line);font-weight:600}.members-list{list-style:none;margin:0;padding:.4rem 0;overflow-y:auto;flex:1}.member-row{display:flex;align-items:center;gap:.7rem;padding:.5rem 1rem}.member-row:hover{background:var(--bg-3)}.member-meta{flex:1;min-width:0}.member-name{font-weight:600;font-size:.92rem;display:flex;align-items:center;gap:.3rem}.dm-icon{background:var(--bg-3);border:1px solid var(--line);color:var(--accent-2);border-radius:8px;padding:.35rem;cursor:pointer;display:grid;place-items:center;flex:0 0 auto}.dm-icon:hover{border-color:var(--accent-2);background:var(--bg)}.drawer-backdrop{position:fixed;inset:0;background:#00000073;opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}.drawer-backdrop.show{opacity:1;pointer-events:auto}.drawer{position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);background:var(--bg-2);border-right:1px solid var(--line);transform:translate(-100%);transition:transform .22s ease;z-index:41;display:flex;flex-direction:column}.drawer.open{transform:translate(0)}.drawer-profile{display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:1.3rem 1rem 1rem;background:none;border:none;border-bottom:1px solid var(--line);color:inherit;cursor:pointer}.drawer-profile:hover .drawer-name{color:var(--accent-2)}.drawer-name{font-weight:700;font-size:1.1rem;margin-top:.5rem}.drawer-tabs{display:flex;border-bottom:1px solid var(--line)}.drawer-tabs button{flex:1;background:none;border:none;color:var(--muted);padding:.7rem .4rem;font-size:.85rem;cursor:pointer;border-bottom:2px solid transparent}.drawer-tabs button.active{color:var(--text);border-bottom-color:var(--accent);font-weight:600}.drawer-section{display:flex;flex-direction:column;flex:1;min-height:0}.create-room-btn{margin:.7rem;background:var(--accent);border:none;color:#fff;border-radius:10px;padding:.6rem;font-size:.9rem;font-weight:600;cursor:pointer}.dm-btn{margin:.5rem .7rem;background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.5rem;font-size:.85rem;cursor:pointer}.drawer-extras{display:flex;flex-direction:column;gap:.4rem;padding:.6rem .7rem 0}.extra-btn{background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.55rem;font-size:.85rem;cursor:pointer;text-align:left}.extra-btn:hover:not(:disabled){border-color:var(--accent-2)}.extra-btn:disabled{opacity:.5}.extra-note{padding:.3rem .2rem}.drawer-footer{display:flex;gap:.5rem;justify-content:space-between;padding:.7rem;border-top:1px solid var(--line);margin-top:.4rem}.drawer-footer .link{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.85rem}.room-list-item .badge{vertical-align:middle}.room-count{display:inline-block;vertical-align:middle;margin-left:.4rem;font-size:.68rem;font-weight:600;color:var(--muted);background:var(--bg-3);border-radius:999px;padding:1px 7px}.invite-btn{background:var(--accent-2);border:none;color:#fff;border-radius:8px;padding:.3rem .55rem;font-size:.75rem;cursor:pointer;flex:0 0 auto}.badge.private{background:var(--bg-3);color:var(--muted)}.visibility-pick{display:flex;gap:.5rem}.visibility-pick button{flex:1;display:flex;flex-direction:column;gap:.2rem;align-items:flex-start;background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.6rem;cursor:pointer;text-align:left}.visibility-pick button.active{border-color:var(--accent)}.visibility-pick small{color:var(--muted);font-size:.72rem}.invite-link{font-family:monospace;font-size:.8rem}.invite-hint{background:var(--bg-3);border:1px solid var(--accent-2);border-radius:8px;padding:.5rem .7rem;font-size:.85rem}.list-subhead{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;padding:.6rem .9rem .2rem;cursor:default}.list-subhead:hover{background:none}.sidebar{background:var(--bg-2);border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:.9rem;border-bottom:1px solid var(--line)}.me{display:flex;align-items:center;gap:.6rem;min-width:0;background:none;border:none;color:inherit;padding:0;cursor:pointer;text-align:left}.me:hover .me-name{color:var(--accent-2)}.me-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-btn{background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.45rem .6rem}.icon-btn.rec{background:var(--accent);border-color:var(--accent);animation:pulse 1s infinite}.sidebar-actions{display:flex;gap:.4rem;padding:.7rem}.sidebar-actions button{flex:1;background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.5rem;font-size:.85rem}.avatar{position:relative;width:40px;height:40px;border-radius:50%;flex:0 0 40px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-weight:700;font-size:.8rem;color:#fff}.avatar.group{background:var(--bg-3);color:var(--muted)}.avatar-img{width:100%;height:100%;border-radius:50%;object-fit:cover}.avatar-sm{width:28px;height:28px;flex:0 0 28px;font-size:.65rem}.avatar-lg{width:72px;height:72px;flex:0 0 72px;font-size:1.3rem}.dot{position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;border-radius:50%;background:var(--green);border:2px solid var(--bg-2)}.room-list{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}.room-list li{display:flex;gap:.7rem;align-items:center;padding:.7rem .9rem;cursor:pointer;border-bottom:1px solid var(--line)}.room-list li:hover{background:var(--bg-3)}.room-list li.active{background:var(--bg-3);border-left:3px solid var(--accent)}.room-list li.empty{cursor:default;justify-content:center}.room-meta{min-width:0}.room-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-preview{font-size:.82rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}.chat{display:flex;flex-direction:column;min-width:0;min-height:0;flex:1;background:var(--bg)}.empty-chat{display:grid;place-items:center}.placeholder{text-align:center}.chat-head{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1.1rem;border-bottom:1px solid var(--line);background:var(--bg-2)}.chat-title{font-weight:700}.chat-sub{font-size:.8rem}.call-btn{background:var(--green);border:none;color:#fff;border-radius:50%;width:42px;height:42px;font-size:1.1rem}.call-btn:disabled{opacity:.4}.chat-head-actions{display:flex;align-items:center;gap:.5rem}.audio-join-btn{background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.45rem .85rem;font-size:.9rem;cursor:pointer}.audio-join-btn:hover:not(:disabled){border-color:var(--accent-2)}.audio-join-btn:disabled{opacity:.4;cursor:default}.group-audio-bar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.55rem 1.1rem;background:var(--bg-3);border-bottom:1px solid var(--line)}.ga-label{font-size:.85rem;font-weight:600;color:var(--accent-2);white-space:nowrap}.ga-peers{display:flex;gap:.4rem;flex-wrap:wrap;flex:1;min-width:120px}.ga-peer{font-size:.8rem;padding:.2rem .6rem;border-radius:999px;background:var(--bg-2);border:1px solid var(--line);color:var(--muted)}.ga-peer.talking{color:var(--text);border-color:var(--green)}.ga-mute,.ga-leave{border:1px solid var(--line);background:var(--bg-2);color:var(--text);border-radius:8px;padding:.35rem .7rem;font-size:.85rem;cursor:pointer}.ga-leave{background:var(--accent);border-color:var(--accent);color:#fff}.messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.msg{max-width:75%;align-self:flex-start}.msg.mine{align-self:flex-end}.msg.system{align-self:center;font-size:.8rem}.msg-head{display:flex;align-items:center;gap:.45rem;margin-bottom:2px}.msg-author{font-size:.75rem;color:var(--muted)}.bubble{background:var(--bg-3);padding:.5rem .7rem;border-radius:14px;position:relative}.msg.mine .bubble{background:var(--accent-2);color:#fff}.msg-text{white-space:pre-wrap;word-break:break-word}.msg-time{display:block;font-size:.65rem;opacity:.6;text-align:right;margin-top:2px}.att-image img{max-width:280px;max-height:320px;border-radius:10px;display:block}.att-video{max-width:280px;border-radius:10px;display:block}.att-audio{width:240px}.typing{padding:0 1.1rem .4rem;font-size:.8rem}.composer{display:flex;align-items:flex-end;gap:.5rem;padding:.7rem;border-top:1px solid var(--line);background:var(--bg-2);position:relative}.composer textarea{flex:1;resize:none;max-height:120px}.send-btn{background:var(--accent);border:none;color:#fff;border-radius:50%;width:44px;height:44px;font-size:1.1rem}.send-btn:disabled{opacity:.4}.upload-bar{position:absolute;left:0;top:0;height:3px;width:100%;background:var(--line)}.upload-bar>div{height:100%;background:var(--accent);transition:width .15s}.modal-backdrop{position:fixed;inset:0;background:#00000080;display:grid;place-items:center;z-index:50}.modal{background:var(--bg-2);border:1px solid var(--line);border-radius:16px;padding:1.4rem;width:min(380px,92vw);display:flex;flex-direction:column;gap:.7rem}.modal h3{margin:0}.modal button:not(.link){background:var(--accent);border:none;color:#fff;border-radius:10px;padding:.6rem}.profile-edit{display:flex;align-items:center;gap:1rem}.profile-info{min-width:0}.profile-name{font-weight:700;font-size:1.05rem}.browse-list{list-style:none;margin:0;padding:0;max-height:50vh;overflow-y:auto}.browse-list li{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid var(--line)}.browse-list button{background:var(--accent-2);border:none;color:#fff;border-radius:8px;padding:.4rem .8rem}.call-overlay{position:fixed;inset:0;background:#000000b3;display:grid;place-items:center;z-index:100}.call-card{background:var(--bg-2);border:1px solid var(--line);border-radius:20px;padding:2rem;width:min(320px,90vw);text-align:center}.call-avatar{width:88px;height:88px;border-radius:50%;margin:0 auto 1rem;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-size:1.6rem;font-weight:700;color:#fff}.call-name{font-size:1.2rem;font-weight:700}.call-status{margin-bottom:1.4rem}.call-actions{display:flex;gap:.7rem;justify-content:center}.call-actions button{border:none;border-radius:12px;padding:.7rem 1rem;color:#fff;font-weight:600}.call-accept{background:var(--green)}.call-end{background:var(--accent)}.call-mute{background:var(--bg-3)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.head-btns{display:flex;gap:.4rem}.admin{position:fixed;inset:0;background:var(--bg);z-index:80;display:flex;flex-direction:column}.admin-head{display:flex;align-items:center;gap:1rem;padding:.9rem 1.2rem;border-bottom:1px solid var(--line);background:var(--bg-2)}.admin-head h2{margin:0;font-size:1.1rem}.admin-tabs{display:flex;gap:.4rem;flex:1}.admin-tabs button{background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.45rem .9rem}.admin-tabs button.on{background:var(--accent);border-color:var(--accent);color:#fff}.admin-body{flex:1;overflow-y:auto;padding:1.4rem}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1.6rem}.stat-card{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:1.1rem}.stat-value{font-size:2rem;font-weight:800}.stat-value.good{color:var(--green)}.stat-label{color:var(--muted);margin-top:.2rem}.small{font-size:.78rem}.disk{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:1.1rem;max-width:560px;margin-bottom:1rem}.disk-head{display:flex;justify-content:space-between;margin-bottom:.5rem}.disk-bar{height:12px;background:var(--bg-3);border-radius:8px;overflow:hidden}.disk-bar>div{height:100%;background:var(--green)}.disk-bar>div.danger{background:var(--accent)}.admin-table{width:100%;border-collapse:collapse}.admin-table th,.admin-table td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--line)}.admin-table th{color:var(--muted);font-weight:600;font-size:.82rem}.admin-table .actions{display:flex;gap:.4rem}.admin-table .actions button{background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:.35rem .7rem;font-size:.82rem}.admin-table .actions button.danger{background:var(--accent);border-color:var(--accent);color:#fff}.admin-table .actions button:disabled{opacity:.4}.admin-create-room{display:flex;gap:.5rem;margin-bottom:.4rem}.admin-create-room input{flex:1}.admin-create-room button{background:var(--accent);border:none;color:#fff;border-radius:10px;padding:.5rem 1rem;font-weight:600;cursor:pointer;white-space:nowrap}.admin-create-room button:disabled{opacity:.4;cursor:default}.admin-rooms .small{margin:0 0 1rem}@media(max-width:720px){.admin-head{flex-wrap:wrap;gap:.6rem;padding:.7rem .9rem}.admin-head h2{font-size:1rem;flex:1;min-width:0}.admin-tabs{order:3;flex-basis:100%;gap:.3rem}.admin-tabs button{flex:1;padding:.5rem .3rem;font-size:.82rem;white-space:nowrap}.admin-body{padding:1rem;overflow-x:auto}.admin-table{font-size:.85rem}.admin-table th,.admin-table td{padding:.5rem .45rem}.admin-table .actions{flex-direction:column}}.status-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--muted)}.status-dot.on{background:var(--green)}.badge{display:inline-block;font-size:.68rem;background:var(--accent-2);color:#fff;border-radius:6px;padding:1px 6px;margin-left:.4rem}.badge.you{background:var(--bg-3);color:var(--muted)}