*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0B0E15;--bg-elev: #0E121B;--panel: #131826;--panel2: #182031;--line: #263049;--line-soft: #1B2233;--text: #EAEEF7;--dim: #98A2B8;--faint: #63708C;--accent: #93E85F;--accent2: #C6FF84;--accent-ink: #08210A;--danger: #FF6E6E;--warn: #F2B34A;--ok: #5FD08A}html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:Space Grotesk,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg);color:var(--text);font-size:14px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}input,textarea,button,select{font-family:inherit}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line);border-radius:2px}.app{height:100%;display:flex;flex-direction:column;overflow:hidden}.header{display:flex;align-items:center;padding:7px 10px;background:linear-gradient(180deg,#131826f2,#0b0e15f2);border-bottom:1px solid var(--line);gap:8px;flex-shrink:0}.header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.header-right{display:flex;align-items:center;gap:6px;flex-shrink:0}.header-room{font-size:13px;color:var(--dim);white-space:nowrap}.status-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 8px 3px 6px;background:var(--bg);border:1px solid var(--line);border-radius:20px;font-size:10px;color:var(--dim);white-space:nowrap}.status-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}.dot-ok{background:var(--ok);box-shadow:0 0 4px var(--ok)}.dot-warn{background:var(--warn);box-shadow:0 0 4px var(--warn);animation:pulse 1.5s ease-in-out infinite}.dot-danger{background:var(--danger)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.call-bar{display:flex;align-items:center;padding:6px 10px;background:color-mix(in srgb,var(--bg) 40%,var(--panel));border-bottom:1px solid var(--line-soft);gap:8px;flex-shrink:0;overflow-x:auto}.call-bar-users{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.call-bar-title{font-size:9px;color:var(--faint);font-family:JetBrains Mono,SF Mono,Cascadia Code,Fira Code,monospace;letter-spacing:.3px;text-transform:uppercase;flex-shrink:0}.call-bar-count{font-size:10px;color:var(--accent);font-weight:700;background:color-mix(in srgb,var(--accent) 15%,transparent);padding:0 6px;border-radius:8px;flex-shrink:0}.call-bar-avatars{display:flex;gap:10px;overflow-x:auto;flex:1;min-width:0;padding:2px 0}.call-bar-user{display:flex;align-items:center;gap:5px;flex-shrink:0}.call-bar-name{font-size:12px;color:var(--dim);white-space:nowrap;max-width:80px;overflow:hidden;text-overflow:ellipsis}.call-bar-state{font-size:8px;font-family:JetBrains Mono,SF Mono,Cascadia Code,Fira Code,monospace;padding:1px 4px;border-radius:4px;font-weight:700;flex-shrink:0}.state-mute{background:color-mix(in srgb,var(--warn) 30%,transparent);color:var(--warn)}.state-deaf{background:color-mix(in srgb,var(--danger) 30%,transparent);color:var(--danger)}.call-bar-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.main-scroll{flex:1;overflow-y:auto;display:flex;flex-direction:column}.video-inline{width:100%;max-height:35vh;flex-shrink:0;background:#000;position:relative;border-bottom:1px solid var(--line)}.video-inline .video-back-btn{position:absolute;top:6px;left:6px;display:flex;align-items:center;gap:5px;padding:4px 10px;background:#000000b3;color:var(--dim);border:1px solid var(--line);border-radius:6px;cursor:pointer;font-size:11px;font-family:inherit;z-index:10;transition:all .15s}.video-inline .video-back-btn:hover{background:#000000e6;color:var(--text)}.video-inline .video-player{width:100%;height:100%;max-height:35vh;object-fit:contain;display:block}.video-inline .video-pickers{display:flex;gap:4px;padding:6px;justify-content:center;position:absolute;bottom:6px;left:50%;transform:translate(-50%);background:#00000080;border-radius:8px}.video-inline .video-picker-tab{padding:3px 10px;background:transparent;color:var(--dim);border:1px solid var(--line);border-radius:6px;cursor:pointer;font-size:11px;transition:all .15s}.video-inline .video-picker-tab:hover{background:#ffffff1a}.video-inline .video-picker-tab.active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}.chat-list{flex:1;overflow-y:visible;padding:6px 0}.chat-entry{padding:3px 14px;transition:background .1s}.chat-entry:hover{background:color-mix(in srgb,var(--panel) 50%,transparent)}.chat-text{font-size:13px;line-height:1.5;color:var(--text);word-break:break-word;white-space:pre-wrap}.chat-link{color:var(--accent);text-decoration:underline;text-underline-offset:2px;cursor:pointer;transition:color .15s}.chat-link:hover{color:var(--accent2)}.chat-attachment{cursor:pointer}.chat-thumb{max-width:240px;max-height:200px;border-radius:6px;margin-top:4px;display:block;border:1px solid var(--line)}.composer{display:flex;align-items:flex-end;gap:8px;padding:8px 12px;flex-shrink:0;border-top:1px solid var(--line-soft);background:var(--bg)}.composer-input-wrap{flex:1;display:flex;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 10px;transition:border-color .15s}.composer-input-wrap:focus-within{border-color:var(--accent)}.composer-input{flex:1;border:none;outline:none;background:transparent;color:var(--text);font-size:13px;resize:none;max-height:100px;line-height:1.4}.composer-input::placeholder{color:var(--faint)}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;background:var(--accent);color:var(--accent-ink);border:none;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s}.btn-primary:hover{opacity:.9}.btn-primary:active{transform:scale(.97)}.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 12px;background:transparent;color:var(--dim);border:1px solid var(--line);border-radius:8px;font-size:12px;cursor:pointer;transition:all .15s;white-space:nowrap}.btn-ghost:hover{background:var(--panel2);border-color:var(--faint);color:var(--text)}.btn-ghost-sm{padding:4px 10px;font-size:11px}.btn-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;color:var(--dim);border:1px solid var(--line);border-radius:8px;cursor:pointer;transition:all .15s;flex-shrink:0}.btn-icon:hover{background:var(--panel2);color:var(--text);border-color:var(--faint)}.btn-icon.btn-danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 50%,transparent)}.btn-icon.btn-danger:hover{background:color-mix(in srgb,var(--danger) 15%,transparent);border-color:var(--danger);color:var(--danger)}.btn-send{width:36px;height:36px;padding:0;flex-shrink:0}.login-overlay{height:100%;display:flex;align-items:center;justify-content:center;padding:16px}.login-card{width:100%;max-width:340px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px}.login-brand{display:flex;align-items:center;gap:10px}.wordmark-light{color:var(--text);font-weight:700}.wordmark-vc{color:var(--accent);font-weight:700}.login-tagline{font-size:12px;color:var(--dim);margin:4px 0 20px}.field-group{margin-bottom:10px}.field-label{font-size:10px;color:var(--faint);font-family:JetBrains Mono,SF Mono,Cascadia Code,Fira Code,monospace;letter-spacing:.3px;text-transform:uppercase;margin-bottom:4px}.field-input{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;transition:border-color .15s}.field-input:focus-within{border-color:var(--accent)}.field-icon{color:var(--faint);display:flex;align-items:center;flex-shrink:0;opacity:.6}.field-input input{flex:1;border:none;outline:none;background:transparent;color:var(--text);font-size:13px}.field-input input::placeholder{color:var(--faint)}.login-btn{width:100%;margin-top:6px;padding:10px 18px;font-size:14px}.connecting-banner{display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 16px;background:color-mix(in srgb,var(--warn) 15%,transparent);border-bottom:1px solid color-mix(in srgb,var(--warn) 30%,transparent);font-size:11px;color:var(--warn);flex-shrink:0}.spinner{width:12px;height:12px;border:2px solid color-mix(in srgb,var(--warn) 40%,transparent);border-top-color:var(--warn);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.settings-overlay{height:100%;overflow-y:auto;padding:20px 16px}.settings-panel{width:100%;max-width:440px;margin:0 auto}.settings-header{display:flex;align-items:center;gap:8px;margin-bottom:16px}.settings-header h2{font-size:18px;font-weight:600}.section-head{display:flex;align-items:center;gap:6px;padding:16px 0 8px;font-size:9px;color:var(--accent);font-family:JetBrains Mono,SF Mono,Cascadia Code,Fira Code,monospace;letter-spacing:.3px;text-transform:uppercase}.toggle-row{display:flex;align-items:center;gap:10px;padding:5px 0;cursor:pointer;font-size:13px;color:var(--text);-webkit-user-select:none;user-select:none}.toggle-switch{width:36px;height:20px;border-radius:10px;background:var(--line);position:relative;cursor:pointer;transition:background .2s;flex-shrink:0}.toggle-switch.on{background:var(--accent)}.toggle-thumb{width:16px;height:16px;border-radius:50%;background:var(--text);position:absolute;top:2px;left:2px;transition:transform .2s}.toggle-switch.on .toggle-thumb{transform:translate(16px);background:var(--accent-ink)}.ptt-bind{min-width:60px;padding:4px 12px;border-radius:8px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font-family:JetBrains Mono,monospace;font-size:12px;cursor:pointer;flex-shrink:0;transition:border-color .15s,color .15s}.ptt-bind:hover{border-color:var(--faint)}.ptt-bind.binding{border-color:var(--accent);color:var(--accent)}.video-panel{height:100%;display:flex;flex-direction:column}.video-panel .video-main{flex:1;display:flex;align-items:center;justify-content:center}.video-panel .video-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--faint);font-size:12px}