*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:125%}:root{--bg: #101010;--surface: #000;--accent: #EC008C;--accent-hover: #ff1a9e;--accent-active: #c40074;--text: #fff;--text-dim: #cfcfcf;--muted: #9a9a9a;--faint: #7a7a7a;--border: #2a2a2a;color-scheme:dark;font-family:Segoe UI,Segoe WP,Frutiger,Helvetica Neue,system-ui,sans-serif}body{background:var(--bg);color:var(--text);height:100dvh;-webkit-font-smoothing:antialiased}.hidden{display:none!important}.view{width:100%;height:100dvh}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#333}::-webkit-scrollbar-track{background:transparent}::selection{background:var(--accent);color:#fff}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}input::placeholder{color:#8a8a8a}.brand-eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}#view-login{height:100dvh;overflow-y:auto;background:var(--surface);padding:46px 42px 42px}.login-inner{max-width:520px}.login-title{margin:6px 0 4px;font-size:3.4rem;font-weight:200;line-height:.95;letter-spacing:-.01em}.login-sub{font-size:.9rem;color:var(--muted);margin-bottom:34px}#login-form label{display:block;margin-bottom:6px;font-size:.82rem;font-weight:600;letter-spacing:.02em;color:#b7b7b7}#login-form input[type=text],#login-form input[type=password],.select-wrap select{display:block;width:100%;padding:.62rem .7rem;margin-bottom:1.3rem;background:#fff;border:2px solid #fff;border-radius:0;color:#000;font-size:1rem;font-family:inherit;outline:none;transition:border-color .12s}#login-form input:focus,.select-wrap select:focus{border-color:var(--accent)}.error{color:var(--accent);font-size:.85rem;margin:-.4rem 0 1rem}.advanced-options{margin-bottom:1.6rem}.advanced-options summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:600;letter-spacing:.02em;color:#b7b7b7;margin-bottom:1.15rem}.advanced-options summary::-webkit-details-marker{display:none}.advanced-options summary:before{content:"▸";font-size:.7rem;transition:transform .12s}.advanced-options[open] summary:before{transform:rotate(90deg)}.checkbox-label{display:block;font-size:.95rem;color:var(--text);margin-bottom:1.15rem;cursor:pointer}.checkbox-label input[type=checkbox]{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:52px;height:26px;margin:0 14px 0 0;border:2px solid #fff;background:transparent;position:relative;vertical-align:middle;cursor:pointer;transition:.12s}.checkbox-label input[type=checkbox]:after{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:8px;background:#fff;transition:.12s}.checkbox-label input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.checkbox-label input[type=checkbox]:checked:after{left:auto;right:4px}.checkbox-label span{vertical-align:middle}.select-wrap{position:relative}.select-wrap select{-moz-appearance:none;appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2rem}.select-wrap:after{content:"▼";position:absolute;right:.7rem;top:50%;transform:translateY(-50%);pointer-events:none;color:#000;font-size:.6rem}#login-form .advanced-options .checkbox-label,#login-form .advanced-options .select-wrap{margin-bottom:1.15rem}#login-form .advanced-options .select-wrap select{margin-bottom:0}#connect-btn{width:100%;padding:.85rem;background:var(--accent);border:none;border-radius:0;color:#fff;font-size:1rem;font-weight:600;letter-spacing:.05em;cursor:pointer;font-family:inherit;transition:background .12s}#connect-btn:hover{background:var(--accent-hover)}#connect-btn:active{background:var(--accent-active)}#connect-btn:disabled{opacity:.5;cursor:not-allowed}.room-layout{position:relative;display:grid;grid-template-columns:2fr 3fr;grid-template-rows:auto 1fr;grid-template-areas:"head head" "users chat";height:100dvh;background:var(--surface)}.app-bar{grid-area:head;padding:32px 480px 18px 38px;display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.app-brand{min-width:0}.app-brand .brand-eyebrow{letter-spacing:.24em;white-space:nowrap}.room-title{margin:2px 0 0;font-size:2.5rem;font-weight:200;line-height:1;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-actions{position:absolute;top:32px;right:38px;display:flex;align-items:center;gap:20px}.ctrl-btn{display:flex;align-items:center;gap:11px;background:none;border:none;cursor:pointer;font-family:inherit}.ctrl-circle{width:50px;height:50px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;border:2px solid #fff;background:transparent;color:#fff;transition:.12s}.ctrl-circle svg{width:22px;height:22px}#mute-btn.active .ctrl-circle,#deafen-btn.active .ctrl-circle{border-color:var(--accent);background:var(--accent)}.ctrl-circle-plain{border-color:#fff}.ctrl-btn-disconnect:hover .ctrl-circle-plain{border-color:var(--accent);color:var(--accent)}.btn-label{font-size:.72rem;letter-spacing:.06em;color:var(--text-dim);white-space:nowrap}.app-actions-divider{width:1px;height:32px;background:var(--border)}.mobile-header-actions{display:none;gap:12px;flex-shrink:0}.mobile-header-btn{width:52px;height:52px;border-radius:50%;flex-shrink:0;border:2px solid #fff;background:none;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}.section-head,.chat-desktop-head{display:flex;align-items:baseline;gap:12px;padding:10px 38px 16px}.section-head h2,.chat-desktop-head h2{margin:0;font-size:1rem;font-weight:600;text-transform:uppercase;color:#fff}.user-count{font-size:1rem;font-weight:600;color:var(--accent)}.users-section{grid-area:users;display:flex;flex-direction:column;min-width:0;min-height:0}#user-list{list-style:none;flex:1;overflow-y:auto;padding:0 38px 10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;align-content:start}.user-tile{height:120px;padding:14px;display:flex;flex-direction:column;justify-content:space-between;gap:12px;overflow:hidden}.user-tile.is-self{box-shadow:inset 0 0 0 3px var(--accent)}.user-tile.is-talking{box-shadow:inset 0 0 0 3px #fff}.user-tile.is-deafened:not(.is-talking){opacity:.5}.tile-top{display:flex;justify-content:space-between;align-items:flex-start}.tile-initial{font-size:1.5rem;font-weight:300;color:#ffffffe6;line-height:1}.tile-status{display:flex;gap:8px;align-items:center}.tile-bottom .user-name{font-size:1rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-tile.is-self .user-name:after{content:"you";display:block;font-size:.68rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:#ffffffb3}.tile-status .icon-muted,.tile-status .icon-deafened{display:none;line-height:0}.tile-status .icon-muted svg,.tile-status .icon-deafened svg{stroke:#fff;width:18px;height:18px}.user-tile.is-muted .icon-muted,.user-tile.is-deafened .icon-deafened{display:inline-flex}.talking-bars{display:none;align-items:flex-end;gap:2px;height:18px}.talking-bars span{width:3px;background:#fff;height:100%;transform-origin:bottom;animation:mbar .8s ease-in-out infinite}.talking-bars span:nth-child(2){animation-delay:.2s}.talking-bars span:nth-child(3){animation-delay:.4s}.user-tile.is-talking .talking-bars{display:flex}@keyframes mbar{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}.chat-panel{grid-area:chat;display:flex;flex-direction:column;min-width:0;min-height:0}.sheet-toggle{display:none}#chat-messages{flex:1;overflow-y:auto;padding:0 38px;display:flex;flex-direction:column;gap:12px}.chat-welcome{overflow-x:auto;border-left:3px solid var(--accent);padding-left:12px}.chat-welcome pre{margin:0;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:12px;line-height:1.15;color:var(--muted);white-space:pre}.message{display:flex;gap:11px;font-size:.95rem;line-height:1.4}.message .timestamp{font-size:.72rem;color:#5a5a5a;flex-shrink:0}.message .from{font-weight:600;flex-shrink:0;color:var(--accent)}.message .body{color:#eaeaea}.chat-event{color:var(--faint)}.chat-event .timestamp{color:#5a5a5a}#chat-form{display:flex;padding:20px 38px}#chat-input{flex:1;padding:.6rem .7rem;background:#fff;border:2px solid #fff;border-radius:0;color:#000;font-size:.95rem;font-family:inherit;outline:none;transition:border-color .12s}#chat-input:focus{border-color:var(--accent)}#chat-form button{width:58px;background:var(--accent);border:none;border-radius:0;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s}#chat-form button:hover{background:var(--accent-hover)}.settings-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#000000b8;display:flex;align-items:center;justify-content:center;padding:20px}.settings-modal{width:min(440px,100%);max-height:calc(100dvh - 32px);overflow-y:auto;background:#0c0c0c;border:1px solid var(--border);display:flex;flex-direction:column}.settings-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 24px 18px;border-bottom:1px solid #1c1c1c}.settings-title{margin:5px 0 0;font-size:1.7rem;font-weight:200;line-height:1;color:#fff}.settings-close-btn{flex-shrink:0;width:34px;height:34px;background:none;border:none;color:#8a8a8a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .12s}.settings-close-btn:hover{color:#fff}.settings-modal-body{display:flex;flex-direction:column;gap:1.15rem;padding:22px 24px}.settings-modal-body .checkbox-label{margin-bottom:0}.settings-field label{display:block;margin-bottom:6px;font-size:.82rem;font-weight:600;letter-spacing:.02em;color:#b7b7b7}.settings-field .select-wrap select{margin-bottom:0}.settings-modal-foot{padding:0 24px 22px}#settings-done-btn{width:100%;padding:.85rem;background:var(--accent);border:none;border-radius:0;color:#fff;font-size:1rem;font-weight:600;letter-spacing:.05em;cursor:pointer;font-family:inherit;transition:background .12s}#settings-done-btn:hover{background:var(--accent-hover)}#settings-done-btn:active{background:var(--accent-active)}@media (max-width: 640px){.room-layout{display:flex;flex-direction:column;height:100dvh;overflow:hidden}.app-bar{order:0;padding:26px 24px 12px;align-items:flex-start}.app-brand .brand-eyebrow{font-size:.68rem}.room-title{font-size:2rem}.mobile-header-actions{display:flex}.app-actions{position:static;order:2;justify-content:center;gap:55px;padding:14px;background:#151515;border-top:1px solid #1f1f1f}.app-actions .ctrl-btn{flex-direction:column;gap:6px}.app-actions .ctrl-circle{width:68px;height:68px}.app-actions-divider,.ctrl-btn-disconnect,.ctrl-btn-settings{display:none}.users-section{order:1;flex:1 1 auto;min-height:0;padding-left:0}.section-head{padding:6px 24px 12px}#user-list{grid-template-columns:1fr 1fr;gap:10px;padding:0 24px 16px}.tile-initial{font-size:2rem;font-weight:200;color:#ffffffeb}.chat-panel{order:3;flex:none;background:#0c0c0c;overflow:hidden;display:flex;flex-direction:column;transition:height .25s ease}.chat-panel.open{height:56%}.chat-desktop-head{display:none}.sheet-toggle{display:block;width:100%;padding:14px 24px;cursor:pointer;background:none;border:none;border-top:2px solid var(--accent);color:inherit;font:inherit;text-align:left;flex-shrink:0}.sheet-head{display:flex;align-items:center;gap:10px}.sheet-title{font-size:1rem;font-weight:600;text-transform:uppercase;color:#fff}.sheet-latest{flex:1;min-width:0;font-size:.84rem;color:#8a8a8a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-panel.open .sheet-latest{display:none}.sheet-chevron{flex-shrink:0;margin-left:auto;transition:transform .25s ease}.chat-panel.open .sheet-chevron{transform:rotate(180deg)}.chat-panel:not(.open) #chat-messages,.chat-panel:not(.open) #chat-form{display:none}.chat-panel #chat-messages{padding:4px 24px 12px}.chat-panel #chat-form{padding:12px 24px 16px}.chat-panel #chat-input{font-size:.9rem;padding:.55rem .7rem}.chat-panel #chat-form button{width:52px}.chat-welcome pre{font-size:10px}}