:root{--bg: #0f1118;--surface-0: #161924;--surface-1: #1f2333;--surface-2: #262b3f;--border: #353b54;--border-strong: #4a5275;--text: #ece4d4;--text-dim: #9aa1bd;--text-faint: #6a708a;--accent: #f7c873;--accent-2: #ff8a65;--ok: #7ed957;--warn: #ffb547;--off: #6b7280;--danger: #ef5350;--pix: "VT323", monospace;--sans: "Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}#root{width:100vw;height:100vh}canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges}button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer;padding:0}input,textarea{font-family:inherit;color:inherit}.app{display:grid;grid-template-rows:auto 1fr;height:100vh;width:100vw;background:radial-gradient(1200px 600px at 80% -10%,rgba(247,200,115,.06),transparent 70%),radial-gradient(900px 700px at -10% 110%,rgba(255,138,101,.05),transparent 60%),var(--bg)}.topbar{display:flex;align-items:center;gap:14px;padding:10px 16px;background:var(--surface-0);border-bottom:1px solid var(--border);z-index:4}.logo{display:flex;align-items:center;gap:10px;padding-right:14px;border-right:1px solid var(--border)}.logo-mark{width:28px;height:28px;image-rendering:pixelated}.logo-name{font-family:var(--pix);font-size:22px;letter-spacing:1px;color:var(--accent)}.logo-sub{font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:1px}.videostrip{display:flex;gap:8px;flex:1;align-items:center;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;min-width:0}.videostrip::-webkit-scrollbar{height:6px}.videostrip::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.vtile{position:relative;flex:0 0 auto;width:148px;height:88px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;transition:border-color .2s,transform .2s}.vtile.me{border-color:var(--accent)}.vtile.in-range{box-shadow:0 0 0 2px #7ed95766}.vtile.muted-vid .vplaceholder{display:flex}.vtile.sharing{border-color:#7c6af7;width:196px}.vtile video{width:100%;height:100%;object-fit:cover}.vplaceholder{position:absolute;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a3148,#1b1f2e)}.vplaceholder canvas{width:56px;height:56px}.vlabel{position:absolute;bottom:4px;left:6px;right:6px;display:flex;align-items:center;gap:5px;background:#0000008c;padding:2px 6px;border-radius:4px;font-size:11px;pointer-events:none}.vlabel .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vlabel .micicon{width:11px;height:11px;flex:none}.vstatus-dot{width:7px;height:7px;border-radius:50%;flex:none}.vbadge{position:absolute;top:4px;left:4px;font-size:9px;text-transform:uppercase;letter-spacing:1px;padding:2px 5px;border-radius:3px;background:#7ed957d9;color:#0f1118;font-weight:700}.vtile.bot-muted-mic .micicon{opacity:.3}.vmore{flex:0 0 auto;width:36px;height:88px;background:var(--surface-1);border:1px dashed var(--border);border-radius:8px;color:var(--text-faint);font-size:11px;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:4px;text-align:center;line-height:1.1}.topactions{display:flex;gap:8px;flex:none;padding-left:6px;border-left:1px solid var(--border)}.iconbtn{width:36px;height:36px;border-radius:8px;background:var(--surface-1);border:1px solid var(--border);color:var(--text);display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s}.iconbtn:hover{background:var(--surface-2);border-color:var(--border-strong)}.iconbtn.off{background:#ef53501f;border-color:#ef535066;color:var(--danger)}.screen-btn{position:relative}.screen-btn.sharing{background:#7c6af72e;border-color:#7c6af7;color:#9d8df7}.screen-live-dot{position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:#ef5350;animation:blink 1.2s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.stage{position:relative;display:grid;grid-template-columns:220px 1fr 320px;min-height:0;overflow:hidden}.userpanel{background:var(--surface-0);border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 8px}.panel-title{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-faint);font-weight:600}.panel-pill{font-size:10px;background:var(--surface-2);padding:2px 7px;border-radius:99px;color:var(--text-dim)}.me-card{margin:4px 10px 10px;padding:10px;background:var(--surface-1);border:1px solid var(--border);border-radius:10px}.me-row{display:flex;align-items:center;gap:10px}.me-avatar{width:36px;height:36px;flex:none;background:var(--surface-2);border-radius:8px;image-rendering:pixelated}.me-name{font-weight:600;font-size:13px}.me-meta{font-size:11px;color:var(--text-dim);display:flex;align-items:center;gap:5px}.status-select{width:100%;margin-top:8px;padding:6px 8px;background:var(--surface-0);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:12px;cursor:pointer}.ulist{list-style:none;padding:0 6px 12px;margin:0;overflow-y:auto}.ulist li{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:7px;font-size:13px;cursor:default;transition:background .15s}.ulist li:hover{background:var(--surface-1)}.ulist li.near{background:#7ed95714}.ulist .uava{width:28px;height:28px;image-rendering:pixelated;background:var(--surface-2);border-radius:6px}.ulist .uname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ulist .uzone{font-size:10px;color:var(--text-faint)}.status-dot{width:8px;height:8px;border-radius:50%;flex:none}.dot-available{background:var(--ok);box-shadow:0 0 0 2px #7ed9572e}.dot-busy{background:var(--warn);box-shadow:0 0 0 2px #ffb5472e}.dot-away{background:var(--off);box-shadow:0 0 0 2px #6b72802e}.world{position:relative;overflow:hidden;background:#0a0c12}.world-viewport{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.55) 100%),#0a0c12}.world-cam{position:absolute;top:0;left:0;will-change:transform}.world-canvas{display:block;cursor:pointer}.zone-banner{position:absolute;top:14px;left:50%;transform:translate(-50%);background:#0f1118d9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--border);padding:6px 14px;border-radius:99px;font-family:var(--pix);font-size:18px;color:var(--accent);pointer-events:none;z-index:2}.help-overlay{position:absolute;bottom:14px;left:14px;background:#0f1118d9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--border);padding:10px 12px;border-radius:8px;font-size:11px;color:var(--text-dim);z-index:2;line-height:1.55;pointer-events:none}.help-overlay kbd{display:inline-block;background:var(--surface-2);border:1px solid var(--border);border-bottom-width:2px;border-radius:4px;padding:0 5px;font-family:var(--pix);font-size:12px;color:var(--text);margin:0 1px}.proximity-toast{position:absolute;bottom:14px;right:14px;background:#7ed95729;border:1px solid rgba(126,217,87,.5);padding:8px 12px;border-radius:8px;font-size:12px;color:var(--text);z-index:2;pointer-events:none;display:flex;align-items:center;gap:8px;animation:fadein .25s ease-out}@keyframes fadein{0%{opacity:0;transform:translateY(6px)}to{opacity:1}}.chatpanel{background:var(--surface-0);border-left:1px solid var(--border);display:flex;flex-direction:column;min-height:0}.chat-tabs{display:flex;gap:0;padding:0 8px;border-bottom:1px solid var(--border);background:var(--surface-0)}.chat-tab{flex:1;padding:12px 8px;font-size:12px;font-weight:500;color:var(--text-faint);border-bottom:2px solid transparent;text-align:center;transition:color .15s,border-color .15s;position:relative}.chat-tab:hover{color:var(--text-dim)}.chat-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.chat-tab .tab-count{display:inline-block;background:var(--accent-2);color:#0f1118;font-size:9px;font-weight:700;padding:0 5px;border-radius:99px;margin-left:5px;vertical-align:middle;line-height:14px;min-width:14px}.chat-context{padding:8px 14px;font-size:11px;color:var(--text-faint);background:var(--surface-0);border-bottom:1px solid var(--border)}.chat-msgs{flex:1;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.chat-msgs::-webkit-scrollbar{width:6px}.chat-msgs::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.msg{display:flex;gap:9px}.msg .mava{width:28px;height:28px;background:var(--surface-2);border-radius:50%;image-rendering:pixelated;flex:none}.msg .mbody{flex:1;min-width:0}.msg .mhead{display:flex;align-items:baseline;gap:6px;margin-bottom:2px}.msg .mname{font-weight:600;font-size:12.5px}.msg .mtime{font-size:10px;color:var(--text-faint)}.msg .mtext{font-size:13px;line-height:1.45;color:var(--text);word-wrap:break-word}.msg.me .mname{color:var(--accent)}.msg.system{font-size:11px;color:var(--text-faint);justify-content:center;font-style:italic}.msg.system:before,.msg.system:after{content:"";flex:1;height:1px;background:var(--border);align-self:center;max-width:60px}.chat-input-wrap{padding:10px 12px;border-top:1px solid var(--border);background:var(--surface-0)}.chat-input{width:100%;background:var(--surface-1);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:10px 12px;font-size:13px;resize:none;outline:none;transition:border-color .15s}.chat-input:focus{border-color:var(--accent)}.chat-input::placeholder{color:var(--text-faint)}.login-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(900px 600px at 60% 30%,rgba(247,200,115,.07),transparent 70%),radial-gradient(700px 700px at 10% 80%,rgba(255,138,101,.06),transparent 60%),var(--bg);z-index:20}.login-card{width:380px;max-width:92vw;background:var(--surface-0);border:1px solid var(--border);border-radius:16px;padding:28px;box-shadow:0 24px 64px #0000008c;display:flex;flex-direction:column;gap:20px}.login-logo{display:flex;align-items:center;gap:12px}.login-logo canvas{image-rendering:pixelated;width:40px;height:40px}.login-logo-text{display:flex;flex-direction:column}.login-logo-text .logo-name{font-family:var(--pix);font-size:26px;color:var(--accent);letter-spacing:1px;line-height:1}.login-logo-text .logo-sub{font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:1px}.login-avatar-preview{display:flex;align-items:center;justify-content:center;padding:16px;background:var(--surface-1);border:1px solid var(--border);border-radius:10px}.login-avatar-preview canvas{image-rendering:pixelated;width:64px;height:64px}.login-field{display:flex;flex-direction:column;gap:6px}.login-field label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-faint);font-weight:600}.login-field input{background:var(--surface-1);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:10px 12px;font-size:13px;outline:none;transition:border-color .15s}.login-field input:focus{border-color:var(--accent)}.login-field input::placeholder{color:var(--text-faint)}.login-email-hint{font-size:11px;color:var(--text-faint);margin-top:-10px}.login-error{font-size:12px;color:var(--danger);background:#ef53501a;border:1px solid rgba(239,83,80,.3);border-radius:7px;padding:8px 12px}.login-btn{width:100%;padding:11px;font-size:14px;font-weight:600;border-radius:8px}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:10}.modal{width:460px;max-width:92vw;background:var(--surface-0);border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 24px 64px #0009}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border)}.modal-head h2{margin:0;font-size:15px;font-weight:600}.modal-body{padding:18px;display:flex;flex-direction:column;gap:18px}.field-label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-faint);margin-bottom:6px;font-weight:600}.select-row{width:100%;background:var(--surface-1);border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:7px;font-size:13px}.meter{height:6px;background:var(--surface-2);border-radius:3px;overflow:hidden;margin-top:8px}.meter-fill{height:100%;background:linear-gradient(90deg,var(--ok),var(--accent),var(--accent-2));width:0%;transition:width .08s linear}.palette-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}.palette-swatch{aspect-ratio:1;background:var(--surface-1);border:2px solid var(--border);border-radius:6px;cursor:pointer;overflow:hidden;image-rendering:pixelated;transition:transform .12s,border-color .12s}.palette-swatch:hover{transform:scale(1.06)}.palette-swatch.sel{border-color:var(--accent)}.palette-swatch canvas{width:100%;height:100%}.noise-cancel-row{display:flex;align-items:center;justify-content:space-between;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-track{width:38px;height:22px;background:var(--surface-2);border:1px solid var(--border);border-radius:11px;position:relative;flex-shrink:0;cursor:pointer;transition:background .2s,border-color .2s}.toggle-track[data-on=true]{background:var(--ok);border-color:var(--ok)}.toggle-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--text-dim);transition:transform .2s,background .2s}.toggle-track[data-on=true] .toggle-thumb{transform:translate(16px);background:#0f1118}.field-hint{font-size:11px;color:var(--text-faint);margin-top:6px;line-height:1.5}.modal-foot{padding:12px 18px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}.btn-primary{background:var(--accent);color:#0f1118;padding:8px 16px;border-radius:7px;font-weight:600;font-size:13px}.btn-primary:hover{background:#ffd789}.btn-ghost{background:transparent;color:var(--text-dim);padding:8px 14px;border-radius:7px;font-size:13px}.btn-ghost:hover{color:var(--text)}.floatlabels{position:absolute;top:0;left:0;pointer-events:none;overflow:visible}.floatlabel{position:absolute;transform:translate(-50%,-100%);background:#0f1118d9;border:1px solid var(--border);color:var(--text);padding:1px 6px;border-radius:4px;font-family:var(--pix);font-size:13px;line-height:1.15;white-space:nowrap;display:flex;align-items:center;gap:5px}.floatlabel .lbl-dot{width:6px;height:6px;border-radius:50%}.reaction{position:absolute;transform:translate(-50%,-100%);font-size:18px;animation:floatup 1.8s ease-out forwards;pointer-events:none}@keyframes floatup{0%{opacity:0;transform:translate(-50%,-90%)}20%{opacity:1}to{opacity:0;transform:translate(-50%,-180%)}}.screenshare-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;background:#000000bf;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.screenshare-panel{position:relative;width:80vw;height:80vh;background:#000;border-radius:12px;border:1px solid rgba(124,106,247,.45);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 80px #0009}.screenshare-video{flex:1;width:100%;min-height:0;object-fit:contain;background:#000}.screenshare-bar{position:absolute;top:0;left:0;right:0;z-index:1;display:flex;align-items:center;gap:8px;padding:10px 12px;background:linear-gradient(to bottom,rgba(0,0,0,.72) 0%,transparent 100%)}.screenshare-dot{width:8px;height:8px;border-radius:50%;background:#ef5350;flex-shrink:0;animation:blink 1.2s ease-in-out infinite}.screenshare-name{font-size:13px;font-weight:600;color:#fff}.btn-danger-sm{padding:4px 12px;border-radius:6px;background:#ef535033;border:1px solid rgba(239,83,80,.5);color:#ef9090;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .15s}.btn-danger-sm:hover{background:#ef535059}.iconbtn-sm{width:28px;height:28px;border-radius:6px;background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}.iconbtn-sm:hover{background:#ffffff2e}
