:root{--msg-text-shadow:0 1px 2px rgba(255, 255, 255, 0.144);--msg-text-stroke:0;--emoji-size-default:22px;--emoji-size-xxs:28px;--emoji-size-xs:32px;--emoji-size-s:35px;--emoji-size-m:42px;--emoji-size-l:48px;--emoji-size-xl:54px;--emoji-size-xxl:61px}.custom-emoji,.yahoo-emoji{-webkit-user-drag:none;user-drag:none}::before{box-sizing:border-box}#mic-timer,.mic-timer,.voice-header-actions .mic-timer,div.voice-header-actions span.mic-timer{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;font-size:11px!important;font-weight:500!important;font-family:'Share Tech Mono',VT323,Consolas,monospace!important;padding:3px 8px!important;border-radius:4px!important;background:rgba(0,0,0,.75)!important;color:#0f8!important;box-shadow:0 0 8px rgba(0,255,136,.3),inset 0 0 10px rgba(0,255,136,.1)!important;white-space:nowrap!important;letter-spacing:1px!important}#mic-duration,.mic-timer #mic-duration,div.voice-header-actions span#mic-duration{min-width:52px!important;text-align:center!important;font-size:12px!important;font-weight:600!important;letter-spacing:1px!important;color:#0f8!important;text-shadow:0 0 6px rgba(0,255,136,.8)!important;background:0 0!important;font-family:'Share Tech Mono',VT323,Consolas,monospace!important}.mic-timer.vulnerable{background:rgba(30,0,0,.75)!important;color:#f33!important;box-shadow:0 0 10px rgba(255,51,51,.4),inset 0 0 15px rgba(255,51,51,.1)!important}.mic-timer.vulnerable::before{color:#f33!important;text-shadow:0 0 4px #f33!important}.mic-timer.vulnerable #mic-duration{color:#f33!important;text-shadow:0 0 8px rgba(255,51,51,.8)!important}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.loading-overlay.active{opacity:1;visibility:visible}.loading-spinner{width:60px;height:60px;border:4px solid rgba(255,255,255,.1);border-top:4px solid var(--accent,#7c5cfc);border-right:4px solid var(--accent,#7c5cfc);border-radius:50%;animation:spin 1s linear infinite;box-shadow:0 0 20px rgba(124,92,252,.3)}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}:root{--bg-primary:#30324c;--bg-secondary:#363858;--bg-tertiary:#3e4065;--bg-hover:#454872;--bg-active:#4e5182;--bg-input:#2a2c48;--bg-card:#343658;--accent:#7c5cfc;--accent-rgb:124,92,252;--accent-hover:#9478ff;--accent-dim:#5a3fd4;--accent-glow:rgba(124, 92, 252, 0.25);--text-primary:#e2e4f0;--text-secondary:#9498b3;--text-muted:#5d6180;--text-link:#82aaff;--border:#484b78;--border-light:#565988;--success:#43b581;--success-rgb:67,181,129;--danger:#f04747;--danger-rgb:240,71,71;--warning:#faa61a;--led-on:#43b581;--led-off:#555;--led-glow:rgba(67, 181, 129, 0.5);--font-main:'Inter','Segoe UI',system-ui,-apple-system,'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji','Noto Sans',sans-serif;--font-mono:'Consolas','Courier New',monospace;--font-heading:'Inter','Segoe UI',system-ui,sans-serif;--radius:8px;--radius-sm:4px;--transition:0.15s ease;--sidebar-width:270px;--right-width:260px;--theme-logo:"⬡";--msg-glow:none;--scanline:none}.reaction-badge{background:0 0;border:1px solid var(--border-light);border-radius:12px;padding:4px 10px;cursor:pointer;transition:background .2s,border-color .2s;color:#fff}[data-theme=daylight] .reaction-badge{color:#000}[data-theme=nord]{--bg-primary:#555e6f;--bg-secondary:#5a6377;--bg-tertiary:#5d657b;--bg-hover:#606a7f;--bg-active:#626d83;--bg-input:#515b6c;--bg-card:#555f75;--accent:#88c0d0;--accent-rgb:136,192,208;--accent-hover:#9ccfdf;--accent-dim:#6a92a3;--accent-glow:rgba(136, 192, 208, 0.25);--text-primary:#eceff4;--text-secondary:#d8dee9;--text-muted:#d5d8dc;--text-link:#c1dee6;--border:#606a7f;--border-light:#626d83;--success:#a3be8c;--success-rgb:163,190,140;--danger:#bf616a;--danger-rgb:191,97,106;--warning:#ebcb8b;--led-on:#a3be8c;--led-glow:rgba(163, 190, 140, 0.5);--font-main:'Inter','Segoe UI',system-ui,sans-serif;--font-heading:'Inter','Segoe UI',system-ui,sans-serif;--font-mono:'Consolas',monospace;--theme-logo:"❄"}[data-theme=nord]{--msg-text-shadow:none}[data-theme=nord] .mention{background:rgba(180,142,173,.2);color:#b48ead}[data-theme=nord] .brand-text{color:#88c0d0}:root .message-area,[data-theme=nord] .message-area{border-color:transparent;box-shadow:0 32px 80px rgba(0,0,0,.65),0 12px 32px rgba(0,0,0,.45)}:root .message-input-pill,[data-theme=nord] .message-input-pill{border-color:transparent}@keyframes scripture-cross-pulse{0%,100%{opacity:.03}50%{opacity:.07}}@keyframes chapel-glass-shift{0%{opacity:.04;filter:hue-rotate(0deg)}33%{opacity:.07;filter:hue-rotate(15deg)}66%{opacity:.05;filter:hue-rotate(-10deg)}100%{opacity:.04;filter:hue-rotate(0deg)}}@keyframes gospel-radiance{0%,100%{opacity:.04;transform:scale(1)}50%{opacity:.08;transform:scale(1.03)}}[data-theme=daylight]{--bg-primary:#D4D0CA;--bg-secondary:#DAD7D2;--bg-tertiary:#CAC6BE;--bg-hover:#CECBC2;--bg-active:#C3BFB4;--bg-input:#E1DFDC;--bg-card:#E1DFDC;--accent:#864e1e;--accent-rgb:134,78,30;--accent-hover:#a25e24;--accent-dim:#603815;--accent-glow:rgba(134, 78, 30, 0.12);--text-primary:#2A2925;--text-secondary:#5f5c53;--text-muted:#605b4d;--text-link:#19608a;--border:#C3BEB3;--border-light:#CFCBC2;--success:#3E8054;--success-rgb:62,128,84;--danger:#BE4A3D;--danger-rgb:190,74,61;--warning:#B4842E;--led-on:#3E8054;--led-off:#C9C4B7;--led-glow:rgba(62, 128, 84, 0.4);--theme-logo:"☀";--scanline:none;--overlay-ink-rgb:42,41,37;--canvas-dark:#252429;--canvas-dark-rgb:37,36,41;--rail-dark:#2B2A30}[data-theme=daylight] body{background:var(--canvas-dark)}[data-theme=daylight] .auth-page{background:linear-gradient(165deg,#f6f4ef 0,#ebe7de 50%,#dfd9cc 100%)}[data-theme=daylight] .auth-bg-pattern{background:radial-gradient(ellipse 80% 60% at 15% 10%,rgba(var(--accent-rgb),.13) 0,transparent 55%),radial-gradient(ellipse 60% 50% at 85% 90%,rgba(var(--accent-rgb),.1) 0,transparent 55%),radial-gradient(ellipse 50% 40% at 55% 45%,rgba(var(--accent-rgb),.05) 0,transparent 60%)}[data-theme=daylight] .server-icon{background:rgba(255,255,255,.08)}[data-theme=daylight] .room-list-modal-inner{border-color:rgba(var(--overlay-ink-rgb),.08);box-shadow:0 16px 40px rgba(var(--overlay-ink-rgb),.12),0 4px 14px rgba(var(--overlay-ink-rgb),.07)}[data-theme=daylight] .room-list-header{border-bottom-color:rgba(var(--overlay-ink-rgb),.07)}[data-theme=daylight] .room-list-search-wrap{border-color:rgba(var(--overlay-ink-rgb),.1);background:var(--bg-input)}[data-theme=daylight] .room-list-item:hover{border-color:var(--border-light)}[data-theme=daylight] .room-list-item-avatar{background:rgba(var(--accent-rgb),.12)}[data-theme=daylight] .room-list-badge{background:rgba(var(--overlay-ink-rgb),.05);border-color:rgba(var(--overlay-ink-rgb),.1);color:var(--text-muted)}[data-theme=daylight] .room-list-user-count{background:rgba(var(--overlay-ink-rgb),.05);border-color:rgba(var(--overlay-ink-rgb),.09)}[data-theme=daylight] .room-list-join-arrow{color:var(--text-muted)}[data-theme=daylight] .auth-card{background:var(--bg-card);border-color:var(--border);box-shadow:0 0 0 1px rgba(var(--overlay-ink-rgb),.04) inset,0 1px 0 rgba(255,255,255,.6) inset,0 24px 56px -18px rgba(var(--overlay-ink-rgb),.22),0 8px 22px rgba(var(--overlay-ink-rgb),.1)}[data-theme=daylight] .auth-logo img{filter:none}[data-theme=daylight] .auth-toggle{background:var(--bg-secondary);border:1px solid var(--border)}[data-theme=daylight] .toggle-btn{color:var(--text-muted)}[data-theme=daylight] .toggle-btn.active{color:#fff}[data-theme=daylight] .toggle-slider{box-shadow:0 1px 6px rgba(var(--accent-rgb),.35)}[data-theme=daylight] .form-group.floating input{background:var(--bg-input);border-color:var(--border);color:var(--text-primary)}[data-theme=daylight] .form-group.floating input:focus{border-color:var(--accent);background:var(--bg-card);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13)}[data-theme=daylight] .form-group.floating label{color:var(--text-muted)}[data-theme=daylight] .form-group.floating input:not([type=hidden]):focus~label,[data-theme=daylight] .form-group.floating input:not([type=hidden]):not(:placeholder-shown)~label{background:var(--bg-input)}[data-theme=daylight] .form-group.floating input:not([type=hidden]):not(:placeholder-shown)~label{color:var(--text-secondary)}[data-theme=daylight] .form-group.floating .input-icon{color:var(--text-secondary)}[data-theme=daylight] .form-group.floating .password-toggle{color:var(--text-secondary)}[data-theme=daylight] .form-group.floating .password-toggle:hover{background:rgba(var(--overlay-ink-rgb),.06)}[data-theme=daylight] .form-group.floating .input-hint{color:var(--text-muted)}[data-theme=daylight] .form-group.floating .input-hint.is-error{color:var(--danger)!important}[data-theme=daylight] .form-group.floating .input-hint.is-success{color:var(--success)!important}[data-theme=daylight] .form-group.floating .input-hint.is-checking{color:var(--text-muted)!important}[data-theme=daylight] .field-checking{border-color:rgba(var(--overlay-ink-rgb),.2)!important}[data-theme=daylight] .warning-box{background:rgba(var(--danger-rgb),.08);border-color:rgba(var(--danger-rgb),.25);border-left-color:var(--danger);color:#7a352b}[data-theme=daylight] .warning-box strong{color:var(--danger)}[data-theme=daylight] .remember-me{color:var(--text-secondary)}[data-theme=daylight] .remember-me .checkmark{border-color:var(--border)}[data-theme=daylight] .age-verify-row{border-color:rgba(var(--accent-rgb),.35);background:rgba(var(--accent-rgb),.06)}[data-theme=daylight] .age-verify-row:hover{border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.1)}[data-theme=daylight] .age-verify-checkmark{border-color:var(--border)}[data-theme=daylight] .age-verify-text{color:var(--text-secondary)}[data-theme=daylight] .age-verify-text strong{color:var(--text-primary)}[data-theme=daylight] .age-verify-row input:checked~.age-verify-text{color:var(--text-primary)}[data-theme=daylight] .btn-primary:hover{box-shadow:0 6px 20px rgba(var(--accent-rgb),.35)}[data-theme=daylight] .auth-recovery-links a{color:var(--text-muted)}[data-theme=daylight] .form-links a{color:var(--text-muted)}[data-theme=daylight] .form-links a:hover{background:rgba(var(--accent-rgb),.08)}[data-theme=daylight] .form-header h3{color:var(--text-primary)}[data-theme=daylight] .form-header p{color:var(--text-secondary)}[data-theme=daylight] .form-header .form-icon{background:rgba(var(--accent-rgb),.1);border-color:rgba(var(--accent-rgb),.25)}[data-theme=daylight] .auth-footer{border-top-color:var(--border-light)}[data-theme=daylight] .auth-version{color:var(--text-muted)}[data-theme=daylight] .mic-perm-row{background:rgba(var(--overlay-ink-rgb),.035);border-color:rgba(var(--overlay-ink-rgb),.09)}[data-theme=daylight] .mic-perm-row--granted{background:rgba(var(--success-rgb),.08);border-color:rgba(var(--success-rgb),.28)}[data-theme=daylight] .mic-perm-row--denied{background:rgba(var(--danger-rgb),.08);border-color:rgba(var(--danger-rgb),.28)}[data-theme=daylight] .mic-perm-row--headsup{background:rgba(180,132,46,.1);border-color:rgba(180,132,46,.35)}[data-theme=daylight] .mic-perm-icon{background:rgba(var(--accent-rgb),.1);border-color:rgba(var(--accent-rgb),.25)}[data-theme=daylight] .mic-perm-content strong{color:var(--text-primary)}[data-theme=daylight] .mic-perm-content span{color:var(--text-secondary)}[data-theme=daylight] .mic-perm-label{color:var(--text-secondary)}[data-theme=daylight] .mic-perm-row--granted .mic-perm-label{color:var(--success)}[data-theme=daylight] .mic-perm-row--denied .mic-perm-label{color:var(--danger)}[data-theme=daylight] .mic-perm-row--headsup .mic-perm-content strong{color:#7a5a12}[data-theme=daylight] .mic-perm-row--headsup .mic-perm-content span{color:rgba(122,90,18,.8)}[data-theme=daylight] .mic-perm-row--denied .mic-perm-content strong{color:var(--danger)}[data-theme=daylight] .mic-perm-row--denied .mic-perm-content span{color:rgba(var(--danger-rgb),.85)}[data-theme=daylight]{--msg-text-shadow:none;--msg-text-stroke:none}[data-theme=daylight] .sidebar{background:var(--bg-secondary)}[data-theme=daylight] .right-sidebar{background:var(--bg-secondary)}[data-theme=daylight] .channel-header{background:var(--bg-secondary);border-bottom:1px solid var(--border)}[data-theme=daylight] .message-row:hover{background:rgba(0,0,0,.03)}[data-theme=daylight] .message-input-container{background:var(--bg-input);border:1px solid var(--border)}[data-theme=daylight] .sidebar-bottom-bar{background:var(--bg-tertiary)}[data-theme=daylight] .server-bar{background:var(--rail-dark)}[data-theme=daylight] .modal{background:var(--bg-primary);border:1px solid var(--border)}[data-theme=daylight] ::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15)!important}[data-theme=daylight] ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25)!important}[data-theme=daylight] ::selection{background:rgba(200,120,32,.22)}[data-theme=daylight] .inline-code{color:#a05c10;background:rgba(200,120,32,.1)}[data-theme=daylight] .code-block{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary)}[data-theme=daylight] .screen-share-tile,[data-theme=daylight] .webcam-tile{background:var(--bg-tertiary)}[data-theme=daylight] .notification-toast{background:var(--bg-card);border:1px solid var(--border);box-shadow:none}[data-theme=daylight] .mod-toast{background:var(--bg-card);border:1px solid var(--border);box-shadow:none}[data-theme=daylight] .channel-ctx-menu,[data-theme=daylight] .channel-header,[data-theme=daylight] .message,[data-theme=daylight] .message-area,[data-theme=daylight] .modal,[data-theme=daylight] .right-sidebar,[data-theme=daylight] .sidebar,[data-theme=daylight] .sidebar-bottom-btn,[data-theme=daylight] .sidebar-bottom-btn:hover,[data-theme=daylight] .theme-popup{box-shadow:none}[data-theme=daylight] .main{border-color:transparent}[data-theme=daylight] .sidebar{border:1px solid var(--border);box-shadow:none}[data-theme=daylight] .channel-header{border:1px solid var(--border);box-shadow:none}[data-theme=daylight] .message-area{border:1px solid var(--border);box-shadow:0 1px 2px rgba(var(--overlay-ink-rgb),.05),0 14px 34px rgba(var(--overlay-ink-rgb),.09)}[data-theme=daylight] .messages{background:var(--bg-primary)}[data-theme=daylight] .right-sidebar{border-left:1px solid var(--border);box-shadow:none}[data-theme=daylight] .sidebar-header{background:0 0;border-bottom:1px solid var(--border)}[data-theme=daylight] .sidebar-section{background:0 0;border-bottom:1px solid var(--border-light)}[data-theme=daylight] .sidebar-bottom{background:0 0;border-top:1px solid var(--border)}[data-theme=daylight] .user-bar{background:rgba(0,0,0,.04);border:1px solid var(--border)}[data-theme=daylight] .user-bar:hover{background:rgba(0,0,0,.07)}[data-theme=daylight] .messages{scrollbar-color:rgba(0,0,0,0.15) transparent}[data-theme=daylight] .messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .messages:hover::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2)}[data-theme=daylight] .message{box-shadow:none}[data-theme=daylight] .message:hover{background:rgba(0,0,0,.028)}[data-theme=daylight] .message-input-pill{background:var(--bg-input);border-color:var(--border);box-shadow:none}[data-theme=daylight] .message-input-pill:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow)}[data-theme=daylight] .input-pill-btn:hover{color:var(--accent);background:var(--accent-glow)}[data-theme=daylight] .btn-send{box-shadow:none}[data-theme=daylight] .btn-send:hover{background:var(--accent-hover);box-shadow:none}[data-theme=daylight] .icon-btn:hover{background:rgba(0,0,0,.06);color:var(--text-primary)}[data-theme=daylight] .sidebar-bottom-btn{background:rgba(0,0,0,.03);border:1px solid var(--border);box-shadow:none}[data-theme=daylight] .sidebar-bottom-btn:hover{background:rgba(0,0,0,.07);box-shadow:none}[data-theme=daylight] .header-actions-box{background:rgba(0,0,0,.04);border-color:var(--border)}[data-theme=daylight] .theme-popup{box-shadow:none}[data-theme=daylight] .panel{background:0 0;border-bottom:1px solid var(--border-light)}[data-theme=daylight] .user-item:hover{background:rgba(0,0,0,.045);box-shadow:none}[data-theme=daylight] .msg-dots-btn:active,[data-theme=daylight] .msg-dots-btn:hover,[data-theme=daylight] .msg-toolbar button:hover{background:rgba(0,0,0,.08)}[data-theme=daylight] .pinned-item{border-bottom-color:var(--border-light)}[data-theme=daylight] .link-preview:hover,[data-theme=daylight] .pinned-item:hover{background:rgba(0,0,0,.035)}[data-theme=daylight] .channel-topic-bar{border:1px solid var(--border)}[data-theme=daylight] .friends-tabs{border-bottom-color:var(--border-light)}[data-theme=daylight] .friends-sub-label::after{background:var(--border-light)}[data-theme=daylight] .friend-item:hover{background:rgba(0,0,0,.04);border-color:var(--border-light)}[data-theme=daylight] .friend-action-btn:hover{background:rgba(0,0,0,.08)}[data-theme=daylight] .emoji-dropdown,[data-theme=daylight] .mention-dropdown,[data-theme=daylight] .room-float-emoji-ac,[data-theme=daylight] .slash-dropdown{border:1px solid var(--border);box-shadow:0 8px 24px rgba(0,0,0,.14),0 2px 8px rgba(0,0,0,.08)}[data-theme=daylight] .donors-close-btn:hover,[data-theme=daylight] .mobile-panel-close:hover,[data-theme=daylight] .profile-popup-close:hover,[data-theme=daylight] .room-services-close:hover,[data-theme=daylight] .subs-admin-close-btn:hover,[data-theme=daylight] .wallet-modal-close:hover{background:rgba(0,0,0,.08);color:var(--text-primary)}*,::after,::before{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background:var(--bg-primary);color:var(--text-primary);line-height:1.5;overflow:hidden;height:100vh}body::after{content:'';position:fixed;inset:0;background:var(--scanline);pointer-events:none;z-index:99999}a{color:var(--text-link);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;cursor:pointer;border:none;outline:0}input,textarea{font-family:inherit;outline:0;border:none}::selection{background:var(--accent);color:#fff}input[type=range]:not(.rgb-slider)::-webkit-slider-runnable-track{background:var(--track-bg,rgba(255,255,255,.25));height:var(--track-h,6px);border-radius:var(--track-r,3px);border:var(--track-border,1px solid rgba(255,255,255,.15))}input[type=range]:not(.rgb-slider)::-moz-range-track{background:var(--track-bg,rgba(255,255,255,.25));height:var(--track-h,6px);border-radius:var(--track-r,3px);border:var(--track-border,1px solid rgba(255,255,255,.15))}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}html.rgb-cycling *,html.rgb-cycling ::after,html.rgb-cycling ::before{transition:none!important;animation:none!important}.led{width:10px;height:10px;border-radius:50%;flex-shrink:0;transition:all .3s ease;border:1px solid rgba(0,0,0,.3)}.led.on{background:var(--led-on);box-shadow:0 0 6px var(--led-glow),inset 0 -1px 2px rgba(0,0,0,.2)}.led.off{background:var(--led-off)}.led.warn{background:var(--warning);box-shadow:0 0 6px rgba(250,166,26,.5)}.led.danger{background:var(--danger);box-shadow:0 0 6px rgba(240,71,71,.5)}.led.pulse{animation:ledPulse 1.5s ease-in-out infinite}@keyframes ledPulse{0%,100%{opacity:1}50%{opacity:.4}}.status-bar{display:flex;align-items:center;gap:16px;padding:5px 16px;background:var(--bg-secondary);border-top:1px solid var(--border);font-size:11px;color:var(--text-muted);flex-shrink:0;min-height:28px;user-select:none;position:relative}.status-item{display:flex;align-items:center;gap:5px;white-space:nowrap}.status-item .label{text-transform:uppercase;letter-spacing:.3px;font-weight:600;font-size:10px}.status-item .value{color:var(--text-secondary);font-family:var(--font-mono);font-size:11px}.status-bar .spacer{flex:1}#status-version-item{position:absolute;left:50%;transform:translateX(-50%);pointer-events:none}#status-version{font-family:var(--font-mono);font-size:11px;color:var(--text-muted)}.status-bar .divider{width:1px;height:14px;background:var(--border)}.status-theme-switcher{display:flex;align-items:center;gap:4px;background:0 0;border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);cursor:pointer;font-size:11px;font-family:var(--font-mono);padding:1px 7px;height:18px;line-height:1;white-space:nowrap;transition:background .12s,border-color .12s,color .12s}.status-theme-switcher:hover{background:var(--bg-hover);border-color:var(--accent);color:var(--accent)}.status-theme-switcher .sts-icon{font-size:12px;line-height:1}.status-theme-switcher .sts-label{font-size:10px;text-transform:uppercase;letter-spacing:.3px;font-weight:600}.accent-selector{display:flex;align-items:center;gap:4px;margin-right:4px}.accent-swatch{width:12px;height:12px;border-radius:50%;border:1.5px solid transparent;cursor:pointer;padding:0;flex-shrink:0;transition:transform .1s,border-color .1s}.accent-swatch:hover{transform:scale(1.25)}.accent-swatch.active{border-color:rgba(0,0,0,.45);transform:scale(1.2)}.nord-accent-swatch{width:12px;height:12px;border-radius:50%;border:1.5px solid transparent;cursor:pointer;padding:0;flex-shrink:0;transition:transform .1s,border-color .1s}.nord-accent-swatch:hover{transform:scale(1.25)}.nord-accent-swatch.active{border-color:rgba(255,255,255,.6);transform:scale(1.2)}[data-desktop-app] #app{height:100vh!important}[data-desktop-app] .status-bar{display:flex!important}.sidebar-bottom{margin-top:auto;position:relative;border-top:1px solid rgba(255,255,255,.055);flex-shrink:0;background:linear-gradient(160deg,rgba(124,92,191,.08) 0,rgba(124,92,191,.02) 60%,transparent 100%)}.sidebar-bottom-bar{display:flex;align-items:center;gap:6px;padding:8px 12px}.sidebar-bottom-btn{background:var(--bg-secondary);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:6px 12px;cursor:pointer;font-size:14px;color:var(--text-secondary);transition:all .15s;line-height:1;box-shadow:0 2px 8px rgba(0,0,0,.25)}.sidebar-bottom-btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--accent);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.35)}.theme-popup{position:absolute;bottom:100%;left:0;right:0;background:var(--bg-secondary);border:1px solid var(--border);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0;padding:12px;z-index:100;box-shadow:0 -4px 20px rgba(0,0,0,.4);max-height:60vh;overflow-y:auto}.theme-popup-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.theme-popup-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted)}.theme-selector{display:flex;flex-wrap:wrap;gap:5px;padding:4px 0}.theme-btn{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);cursor:pointer;transition:all .2s ease;position:relative;display:flex;align-items:center;justify-content:center;font-size:12px;line-height:1}.theme-btn:hover{border-color:var(--text-secondary);transform:scale(1.15)}.theme-btn.active{border-color:var(--accent);box-shadow:0 0 8px var(--accent-glow);transform:scale(1.1)}.theme-btn[data-theme=nord]{background:#454e60;color:#88c0d0}@keyframes rgb-btn-cycle{0%{background-position:0 50%}100%{background-position:200% 50%}}.theme-btn .theme-icon{pointer-events:none}.effect-overlay-section{border-top:1px solid var(--border);margin-top:8px;padding-top:6px}.effect-selector{display:flex;flex-wrap:wrap;gap:5px;padding:4px 0}.effect-btn{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);background:var(--bg-tertiary);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-size:12px;line-height:1;color:var(--text-secondary)}.effect-btn:hover{border-color:var(--text-secondary);transform:scale(1.15)}.effect-btn.active{border-color:var(--accent);box-shadow:0 0 8px var(--accent-glow);transform:scale(1.1)}@keyframes crt-flicker{0%{opacity:.94}50%{opacity:.98}100%{opacity:1}}@keyframes ffx-water{0%,100%{background-position:0 0}50%{background-position:0 100%}}@keyframes ffx-wave-bar{0%,100%{background-position:0 50%}50%{background-position:200% 50%}}@keyframes ice-drip{0%,100%{transform:scaleY(1);opacity:.7}50%{transform:scaleY(1.3);opacity:1}}@keyframes ice-shimmer{0%,100%{opacity:.4}50%{opacity:.9}}[data-theme=nord] .main{position:relative}@keyframes ds-ember{0%{opacity:.5}8%{opacity:.85}15%{opacity:.35}22%{opacity:.7}30%{opacity:.45}45%{opacity:.9}52%{opacity:.3}60%{opacity:.65}70%{opacity:.85}78%{opacity:.4}88%{opacity:.75}100%{opacity:.5}}@keyframes ds-fireline{0%{opacity:.3;filter:blur(4px);height:8px}12%{opacity:.55;filter:blur(6px);height:12px}28%{opacity:.2;filter:blur(3px);height:6px}45%{opacity:.5;filter:blur(5px);height:11px}60%{opacity:.15;filter:blur(3px);height:7px}75%{opacity:.45;filter:blur(6px);height:13px}90%{opacity:.25;filter:blur(4px);height:9px}100%{opacity:.35;filter:blur(5px);height:10px}}@keyframes ds-ambient{0%,100%{opacity:.3}15%{opacity:.55}30%{opacity:.2}50%{opacity:.6}65%{opacity:.25}80%{opacity:.5}}@keyframes bb-vignette{0%,100%{opacity:.5}50%{opacity:1}}@keyframes matrix-rain{0%{transform:translateY(-20px)}100%{transform:translateY(0)}}@keyframes lotr-candle{0%,100%{opacity:.4}25%{opacity:1}50%{opacity:.6}75%{opacity:.9}}[data-fx-custom] .channel-header::after,[data-fx-custom] .main::after,[data-fx-custom] .main::before,[data-fx-custom] .sidebar-header::after,[data-fx-custom] .sidebar::after{content:none!important}[data-fx-custom] .main,[data-fx-custom] .sidebar{position:relative}#fx-layers{position:fixed;inset:0;z-index:99990;pointer-events:none;overflow:hidden}#fx-layers>*{pointer-events:none}.fx-canvas{position:fixed;inset:0;pointer-events:none;z-index:0;width:100%;height:100%}.fx-sidebar-layer{position:absolute;inset:0;pointer-events:none;z-index:0}.fx-main-layer{position:absolute;inset:0;pointer-events:none;z-index:0}.fx-crt{--scanline:none}.fx-crt-vignette{position:fixed;inset:0;background:radial-gradient(ellipse 68% 64% at 50% 50%,rgba(0,0,0,.07) 0,rgba(0,0,0,.07) 20%,rgba(0,0,0,.16) 45%,rgba(0,0,0,.3) 65%,rgba(0,0,0,.42) 82%,rgba(0,0,0,.5) 100%);animation:crt-flicker calc(.08s * var(--fx-mult,1)) infinite alternate;border-radius:22px/18px;box-shadow:inset 0 0 120px rgba(0,0,0,.65),inset 0 0 280px rgba(0,0,0,.3),0 0 12px 2px rgba(0,0,0,.4);z-index:99998;pointer-events:none}.fx-crt-vignette::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.035) 0,rgba(255,255,255,.012) 35%,transparent 55%);border-radius:inherit;pointer-events:none}.fx-crt-scanlines{position:fixed;inset:0;opacity:var(--crt-scanline-opacity, .45);background:repeating-linear-gradient(0deg,transparent 0,transparent 2px,rgba(0,0,0,.4) 2px,rgba(0,0,0,.4) 3px);-webkit-mask-image:radial-gradient(ellipse 85% 75% at 50% 50%,rgba(0,0,0,0.08) 0%,rgba(0,0,0,0.35) 45%,rgba(0,0,0,1) 100%);mask-image:radial-gradient(ellipse 85% 75% at 50% 50%,rgba(0,0,0,0.08) 0%,rgba(0,0,0,0.35) 45%,rgba(0,0,0,1) 100%);border-radius:22px/18px;z-index:99998;pointer-events:none}.fx-matrix-bars{position:absolute;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(0deg,transparent 0,transparent 18px,rgba(0,255,0,.15) 18px,rgba(0,255,0,.15) 20px);animation:matrix-rain calc(1.5s * var(--fx-mult,1)) linear infinite}.fx-fallout-vignette{position:fixed;inset:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,10,0,.55) 100%)}.fx-ffx-water{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,transparent 0,rgba(64,168,224,.25) 15%,transparent 30%,rgba(64,168,224,.2) 50%,transparent 65%,rgba(64,168,224,.15) 80%,transparent 100%);background-size:100% 200%;animation:ffx-water calc(5s * var(--fx-mult,1)) ease-in-out infinite}.fx-ffx-wave{position:fixed;bottom:0;left:0;right:0;height:6px;background:linear-gradient(90deg,transparent,rgba(64,168,224,.6),rgba(100,200,255,.8),rgba(64,168,224,.6),transparent);background-size:200% 100%;animation:ffx-wave-bar calc(3s * var(--fx-mult,1)) ease-in-out infinite;filter:blur(1px)}.fx-ice-shimmer{position:fixed;inset:0;background:radial-gradient(3px 3px at 10% 25%,rgba(200,235,255,.8),transparent),radial-gradient(2px 2px at 25% 60%,rgba(200,235,255,.6),transparent),radial-gradient(3px 3px at 45% 15%,rgba(200,235,255,.7),transparent),radial-gradient(2px 2px at 60% 70%,rgba(200,235,255,.5),transparent),radial-gradient(3px 3px at 75% 35%,rgba(200,235,255,.6),transparent),radial-gradient(2px 2px at 90% 80%,rgba(200,235,255,.7),transparent),radial-gradient(3px 3px at 35% 45%,rgba(200,235,255,.5),transparent),radial-gradient(2px 2px at 80% 10%,rgba(200,235,255,.6),transparent);animation:ice-shimmer calc(4s * var(--fx-mult,1)) ease-in-out infinite}.fx-ice-icicle{position:absolute;bottom:-12px;left:0;right:0;height:12px;pointer-events:none;z-index:2;background:linear-gradient(180deg,rgba(180,230,255,.7),rgba(180,230,255,0));-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 8,0 10,10 12,0 20,0 22,7 24,0 32,0 35,12 38,0 46,0 48,8 50,0 58,0 61,11 64,0 72,0 74,6 76,0 84,0 87,12 90,0 98,0 100,9 102,0 110,0 113,11 116,0 124,0 126,7 128,0 136,0 139,12 142,0 150,0 152,8 154,0 162,0 165,10 168,0 176,0 178,6 180,0 188,0 191,12 194,0 200,0 200,0 0,0'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 8,0 10,10 12,0 20,0 22,7 24,0 32,0 35,12 38,0 46,0 48,8 50,0 58,0 61,11 64,0 72,0 74,6 76,0 84,0 87,12 90,0 98,0 100,9 102,0 110,0 113,11 116,0 124,0 126,7 128,0 136,0 139,12 142,0 150,0 152,8 154,0 162,0 165,10 168,0 176,0 178,6 180,0 188,0 191,12 194,0 200,0 200,0 0,0'/%3E%3C/svg%3E");-webkit-mask-size:200px 12px;mask-size:200px 12px;-webkit-mask-repeat:repeat-x;mask-repeat:repeat-x;animation:ice-drip calc(3s * var(--fx-mult,1)) ease-in-out infinite}.fx-ice-icicle-sb{position:absolute;bottom:-10px;left:0;right:0;height:10px;pointer-events:none;z-index:2;background:linear-gradient(180deg,rgba(180,230,255,.6),rgba(180,230,255,0));-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 8,0 10,10 12,0 20,0 22,7 24,0 32,0 35,12 38,0 46,0 48,8 50,0 58,0 61,11 64,0 72,0 74,6 76,0 84,0 87,12 90,0 98,0 100,9 102,0 110,0 113,11 116,0 124,0 126,7 128,0 136,0 139,12 142,0 150,0 152,8 154,0 162,0 165,10 168,0 176,0 178,6 180,0 188,0 191,12 194,0 200,0 200,0 0,0'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 8,0 10,10 12,0 20,0 22,7 24,0 32,0 35,12 38,0 46,0 48,8 50,0 58,0 61,11 64,0 72,0 74,6 76,0 84,0 87,12 90,0 98,0 100,9 102,0 110,0 113,11 116,0 124,0 126,7 128,0 136,0 139,12 142,0 150,0 152,8 154,0 162,0 165,10 168,0 176,0 178,6 180,0 188,0 191,12 194,0 200,0 200,0 0,0'/%3E%3C/svg%3E");-webkit-mask-size:200px 10px;mask-size:200px 10px;-webkit-mask-repeat:repeat-x;mask-repeat:repeat-x}.fx-ds-ember-glow{position:absolute;bottom:0;left:0;right:0;height:100%;pointer-events:none;z-index:1;background:radial-gradient(ellipse 60% 80% at 50% 100%,rgba(180,70,10,.28) 0,rgba(140,45,5,.15) 20%,rgba(100,30,0,.06) 45%,transparent 80%);animation:ds-ember calc(4s * var(--fx-mult,1)) ease-in-out infinite}.fx-ds-fireline{position:fixed;bottom:0;left:0;right:0;height:10px;background:linear-gradient(90deg,transparent 0,rgba(180,60,5,.25) 15%,rgba(200,110,20,.4) 35%,rgba(210,140,40,.5) 50%,rgba(200,110,20,.4) 65%,rgba(180,60,5,.25) 85%,transparent 100%);filter:blur(5px);animation:ds-fireline calc(3s * var(--fx-mult,1)) ease-in-out infinite alternate}.fx-ds-ambient{position:fixed;bottom:0;left:0;right:0;height:65vh;background:radial-gradient(ellipse 50% 80% at 50% 100%,rgba(180,70,10,.14) 0,rgba(140,45,5,.07) 35%,transparent 85%);animation:ds-ambient calc(5s * var(--fx-mult,1)) ease-in-out infinite}.fx-bb-vignette{position:fixed;inset:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(120,10,10,.35) 100%);animation:bb-vignette calc(4s * var(--fx-mult,1)) ease-in-out infinite}.fx-cyberpunk .brand-text{font-family:'Courier New',monospace;letter-spacing:.15em;text-shadow:0 0 8px rgba(255,0,100,.7),0 0 20px rgba(0,255,255,.3);transition:text-shadow .2s}.fx-cyberpunk .brand-text.scrambling{text-shadow:-2px 0 #f06,2px 0 #0ff,0 0 12px rgba(255,0,100,.9),0 0 30px rgba(0,255,255,.5)}.fx-cyberpunk .scrambling{text-shadow:-1px 0 rgba(255,0,102,.6),1px 0 rgba(0,255,255,.6),0 0 6px rgba(255,0,102,.4)}.fx-cyberpunk #channel-header-name,.fx-cyberpunk #current-user,.fx-cyberpunk .channel-name,.fx-cyberpunk .section-label,.fx-cyberpunk .user-item-name{transition:text-shadow .2s}.fx-lotr-candle{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 100%,rgba(220,170,60,.2),transparent 60%);animation:lotr-candle calc(3s * var(--fx-mult,1)) ease-in-out infinite}.fx-abyss-vignette{position:fixed;inset:0;background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,40,.35) 100%)}.fx-scripture-cross{position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(to bottom,transparent 5%,rgba(200,168,76,.3) 22%,rgba(200,168,76,.5) 40%,rgba(200,168,76,.3) 58%,transparent 80%) center/8% 100% no-repeat,linear-gradient(to right,transparent 20%,rgba(200,168,76,.28) 35%,rgba(200,168,76,.42) 46%,rgba(200,168,76,.42) 54%,rgba(200,168,76,.28) 65%,transparent 80%) center 30%/100% 6% no-repeat,radial-gradient(ellipse 35% 55% at 50% 38%,rgba(200,168,76,.22) 0,transparent 70%);animation:scripture-cross-pulse 8s ease-in-out infinite;mix-blend-mode:screen;filter:brightness(var(--fx-religious-intensity, 1))}.fx-chapel-glass{position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(155deg,transparent 10%,rgba(138,92,240,.24) 22%,rgba(102,51,204,.36) 35%,transparent 55%) no-repeat,linear-gradient(175deg,transparent 15%,rgba(200,80,140,.22) 30%,rgba(220,100,160,.3) 45%,transparent 65%) no-repeat,linear-gradient(195deg,transparent 25%,rgba(200,168,76,.2) 40%,rgba(220,190,100,.28) 55%,transparent 75%) no-repeat,radial-gradient(ellipse 45% 40% at 50% 25%,rgba(138,92,240,.18) 0,transparent 70%);animation:chapel-glass-shift 12s ease-in-out infinite;mix-blend-mode:screen;filter:brightness(var(--fx-religious-intensity, 1))}.fx-gospel-radiance{position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(180deg,rgba(200,168,76,.26) 0,rgba(220,195,120,.18) 15%,transparent 50%) no-repeat,radial-gradient(ellipse 55% 45% at 50% 18%,rgba(139,32,50,.18) 0,rgba(200,168,76,.12) 40%,transparent 70%),radial-gradient(circle at 50% 8%,rgba(255,250,240,.22) 0,transparent 55%);animation:gospel-radiance 10s ease-in-out infinite;filter:brightness(var(--fx-religious-intensity, 1))}.fx-ice-overflow{position:relative!important;overflow:visible!important}#custom-theme-editor{margin-top:8px;padding:8px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius)}#custom-hue-bar{width:100%;height:18px;border-radius:var(--radius-sm);cursor:crosshair;display:block;margin-bottom:6px}#custom-triangle{width:100%;height:180px;cursor:crosshair;display:block;border-radius:var(--radius-sm)}.rgb-theme-editor{margin-top:8px;padding:8px 10px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius)}.rgb-slider-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px;cursor:default}.rgb-slider-row:last-child{margin-bottom:0}.rgb-slider-label{font-size:11px;font-weight:600;color:var(--text-secondary);min-width:50px}.rgb-slider{flex:1;height:4px;accent-color:var(--accent);cursor:pointer}:root{--auth-card-width:440px;--auth-radius:10px;--auth-input-radius:12px;--auth-transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);--auth-accent:#6366f1;--auth-accent-2:#8b5cf6;--auth-accent-glow:rgba(99, 102, 241, 0.25)}.auth-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#070b16;overflow:hidden;position:relative;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.auth-wrapper{width:100%;max-width:var(--auth-card-width);padding:20px;position:relative;z-index:1}.auth-bg-pattern{position:fixed;inset:0;background:radial-gradient(ellipse 80% 60% at 15% 10%,rgba(99,102,241,.14) 0,transparent 55%),radial-gradient(ellipse 60% 50% at 85% 90%,rgba(139,92,246,.11) 0,transparent 55%),radial-gradient(ellipse 50% 40% at 55% 45%,rgba(99,102,241,.06) 0,transparent 60%);z-index:0;pointer-events:none;animation:authBgShift 14s ease-in-out infinite alternate}@keyframes authBgShift{0%{opacity:.7;transform:scale(1)}100%{opacity:1;transform:scale(1.05)}}.auth-card{position:relative;z-index:1;background:rgba(10,14,26,.88);border:1px solid var(--border);border-radius:var(--auth-radius);padding:36px 40px 30px;box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 1px 0 rgba(255,255,255,.09) inset,0 32px 64px -16px rgba(0,0,0,.7),0 8px 24px rgba(0,0,0,.4);transition:box-shadow .4s ease,transform .4s ease}.auth-logo{display:flex;justify-content:center;margin-bottom:22px}.auth-logo img{width:70px;height:70px;object-fit:contain;display:block;background:0 0;border-radius:0;box-shadow:none;padding:0;filter:drop-shadow(0 0 20px rgba(99, 102, 241, .4))}.auth-toggle{display:flex;position:relative;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:13px;padding:4px;margin-bottom:24px;min-height:44px}.toggle-btn{flex:1;padding:9px 12px;background:0 0;border:none;color:rgba(255,255,255,.42);font-size:13px;font-weight:600;font-family:inherit;letter-spacing:.01em;cursor:pointer;position:relative;z-index:1;transition:color .25s ease;border-radius:10px;display:flex;align-items:center;justify-content:center}.toggle-btn.active{color:#fff}.toggle-slider{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);background:linear-gradient(135deg,var(--auth-accent) 0,var(--auth-accent-2) 100%);border-radius:10px;transition:transform .3s cubic-bezier(.4, 0, .2, 1);box-shadow:0 2px 12px rgba(99,102,241,.45)}.toggle-btn[data-tab=register].active~.toggle-slider{transform:translateX(100%)}.mic-permission-block{margin-bottom:16px;border-radius:12px;overflow:hidden}.mic-perm-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.03)}.mic-perm-row--granted{background:rgba(34,197,94,.07);border-color:rgba(34,197,94,.2)}.mic-perm-row--denied{background:rgba(239,68,68,.07);border-color:rgba(239,68,68,.2)}.mic-perm-row--headsup{background:rgba(251,191,36,.08);border-color:rgba(251,191,36,.28);animation:micHeadsupPulse 1s ease-in-out infinite alternate}@keyframes micHeadsupPulse{from{border-color:rgba(251,191,36,.2)}to{border-color:rgba(251,191,36,.55)}}.mic-perm-icon{flex-shrink:0;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(99,102,241,.12);border:1px solid rgba(99,102,241,.22)}.mic-perm-icon svg{width:16px;height:16px;stroke:var(--auth-accent,#6366f1)}.mic-perm-icon--ok{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.25)}.mic-perm-icon--ok svg{stroke:#4ade80}.mic-perm-icon--warn{background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.28)}.mic-perm-icon--warn svg{stroke:#fbbf24}.mic-perm-icon--err{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.25)}.mic-perm-icon--err svg{stroke:#f87171}.mic-perm-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.mic-perm-content strong{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.88);line-height:1.3}.mic-perm-content span{font-size:11.5px;color:rgba(255,255,255,.42);line-height:1.4}.mic-perm-label{flex:1;font-size:12.5px;font-weight:500;color:rgba(255,255,255,.7);line-height:1.4}.mic-perm-row--granted .mic-perm-label{color:#86efac}.mic-perm-row--denied .mic-perm-label{color:#fca5a5}.mic-perm-row--headsup .mic-perm-content strong{color:#fde68a}.mic-perm-row--headsup .mic-perm-content span{color:rgba(253,230,138,.75)}.mic-perm-row--denied .mic-perm-content strong{color:#fecaca}.mic-perm-row--denied .mic-perm-content span{color:#fca5a5}.mic-allow-btn{flex-shrink:0;padding:6px 14px;background:linear-gradient(135deg,var(--auth-accent,#6366f1) 0,var(--auth-accent-2,#8b5cf6) 100%);border:none;border-radius:8px;color:#fff;font-size:12px;font-weight:600;font-family:inherit;cursor:pointer;transition:opacity .2s ease,transform .15s ease;white-space:nowrap}.mic-allow-btn:hover{opacity:.88;transform:translateY(-1px)}.mic-allow-btn:active{transform:translateY(0);opacity:.75}.mic-allow-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.auth-forms-container{position:relative;display:flex;flex-direction:column}.auth-form{display:none;flex-direction:column;gap:14px}.auth-form.hidden{display:none!important}.auth-form.active{display:flex;animation:authFormIn .28s cubic-bezier(.4,0,.2,1)}@keyframes authFormIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.form-group{position:relative}.form-group.floating{position:relative}.form-group.floating input{width:100%;height:54px;padding:18px 44px 6px 46px;background:rgba(255,255,255,.033);border:1.5px solid rgba(255,255,255,.08);border-radius:var(--auth-input-radius);color:#f1f5f9;font-size:14px;font-family:inherit;transition:border-color .22s ease,box-shadow .22s ease,background .22s ease;outline:0;box-sizing:border-box}.form-group.floating input::placeholder{color:transparent}.form-group.floating input:focus{border-color:var(--auth-accent);background:rgba(99,102,241,.05);box-shadow:0 0 0 3px rgba(99,102,241,.13)}.form-group.floating label{position:absolute;left:46px;top:50%;transform:translateY(-50%);font-size:13.5px;font-weight:500;color:rgba(255,255,255,.36);pointer-events:none;transition:all .22s cubic-bezier(.4, 0, .2, 1);transform-origin:left center;padding:0 4px;background:0 0;max-width:calc(100% - 64px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:1}.form-group.floating label::after{content:none}.form-group.floating input:not([type=hidden]):focus~label,.form-group.floating input:not([type=hidden]):not(:placeholder-shown)~label{top:10px;transform:translateY(0) scale(.83);font-size:12px;font-weight:600;background:rgba(10,14,26,.92);padding:0 4px}.form-group.floating input:not([type=hidden]):not(:placeholder-shown)~label{color:rgba(255,255,255,.38)}.form-group.floating input:not([type=hidden]):focus~label{color:var(--auth-accent)}.form-group.floating .input-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:17px;height:17px;opacity:.36;color:rgba(255,255,255,.6);pointer-events:none;transition:opacity .22s ease,color .22s ease;display:flex;align-items:center;justify-content:center;z-index:1}.form-group.floating .input-icon svg{width:17px;height:17px;display:block}.form-group.floating input:not([type=hidden]):focus~.input-icon{opacity:.9;color:var(--auth-accent)}.form-group.floating input:not([type=hidden]):not(:placeholder-shown)~.input-icon{opacity:.52}.form-group.floating .input-hint{display:block;font-size:11px;color:rgba(255,255,255,.26);margin-top:5px;margin-left:46px;transition:color .18s ease}.form-group.floating .input-hint.is-error{color:#f87171!important;font-weight:500}.form-group.floating .input-hint.is-success{color:#4ade80!important;font-weight:500}.form-group.floating .input-hint.is-checking{color:rgba(255,255,255,.4)!important}.form-group.floating .password-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:0 0;border:none;cursor:pointer;opacity:.38;transition:opacity .2s ease,background .2s ease;padding:5px;z-index:10;display:flex;align-items:center;justify-content:center;border-radius:6px;color:rgba(255,255,255,.75);width:30px;height:30px}.form-group.floating .password-toggle:hover{opacity:.9;background:rgba(255,255,255,.07)}.form-group.floating .password-toggle svg{width:17px;height:17px;display:block;pointer-events:none}.form-options{display:flex;justify-content:flex-start;align-items:center;margin:0}.remember-me{display:flex;align-items:center;gap:9px;cursor:pointer;color:rgba(255,255,255,.4);font-size:13px;font-family:inherit;user-select:none}.remember-me input{display:none}.remember-me .checkmark{width:17px;height:17px;border:1.5px solid rgba(255,255,255,.18);border-radius:5px;transition:var(--auth-transition);position:relative;flex-shrink:0}.remember-me input:checked+.checkmark{background:var(--auth-accent);border-color:var(--auth-accent)}.remember-me input:checked+.checkmark::after{content:'';position:absolute;top:2px;left:5px;width:5px;height:8px;border:2px solid #fff;border-top:none;border-left:none;transform:rotate(45deg)}.age-verify-row{display:flex;align-items:center;gap:11px;margin:4px 0 8px;padding:11px 14px;border:1px solid rgba(99,102,241,.28);border-radius:10px;background:rgba(99,102,241,.06);cursor:pointer;user-select:none;transition:var(--auth-transition)}.age-verify-row:hover{border-color:rgba(99,102,241,.5);background:rgba(99,102,241,.1)}.age-verify-row input{display:none}.age-verify-checkmark{width:19px;height:19px;border:1.5px solid rgba(255,255,255,.22);border-radius:6px;transition:var(--auth-transition);position:relative;flex-shrink:0}.age-verify-row input:checked+.age-verify-checkmark{background:var(--auth-accent);border-color:var(--auth-accent)}.age-verify-row input:checked+.age-verify-checkmark::after{content:'';position:absolute;top:2px;left:6px;width:5px;height:9px;border:2px solid #fff;border-top:none;border-left:none;transform:rotate(45deg)}.age-verify-text{display:flex;align-items:center;gap:7px;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.4;flex:1}.age-verify-text svg{width:14px;height:14px;flex-shrink:0;color:var(--auth-accent);opacity:.85}.age-verify-text strong{color:rgba(255,255,255,.8);font-weight:600}.age-verify-row input:checked~.age-verify-text{color:rgba(255,255,255,.75)}.age-verify-row.error{border-color:rgba(239,68,68,.55);background:rgba(239,68,68,.07);animation:shake .35s ease}@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}60%{transform:translateX(5px)}80%{transform:translateX(-3px)}}.btn-primary{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:50px;padding:0 24px;background:linear-gradient(135deg,var(--auth-accent) 0,var(--auth-accent-2) 100%);color:#fff;border:none;border-radius:var(--auth-input-radius);font-size:14px;font-weight:600;font-family:inherit;letter-spacing:.015em;cursor:pointer;position:relative;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;margin-top:4px}.btn-primary::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.16) 0,transparent 55%);opacity:0;transition:opacity .25s ease}.btn-primary::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .5s ease}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 28px rgba(99,102,241,.5)}.btn-primary:hover::before{opacity:1}.btn-primary:hover::after{left:150%}.btn-primary:active{transform:translateY(1px);box-shadow:none}.btn-arrow{width:15px;height:15px;flex-shrink:0;transition:transform .25s ease}.btn-primary:hover .btn-arrow{transform:translateX(3px)}.auth-recovery-links{display:flex;justify-content:center;margin-top:4px}.auth-recovery-links a{color:rgba(255,255,255,.32);text-decoration:none;font-size:12.5px;font-weight:500;transition:color .2s ease;position:relative}.auth-recovery-links a::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:1px;background:var(--auth-accent);transition:width .25s ease}.auth-recovery-links a:hover{color:var(--auth-accent)}.auth-recovery-links a:hover::after{width:100%}.auth-error{position:fixed;top:20px;left:50%;transform:translateX(-50%) translateY(-20px);z-index:200000;padding:12px 20px;background:rgba(10,14,26,.95);border:1px solid rgba(239,68,68,.35);border-left:3px solid #ef4444;border-radius:10px;color:#f8fafc;font-size:13px;font-family:inherit;box-shadow:0 8px 32px rgba(0,0,0,.45);opacity:0;pointer-events:auto;max-width:380px;text-align:center;word-break:break-word}.auth-error.show{animation:toastIn .25s ease,toastOut .5s ease 5s forwards}.form-header{text-align:center;margin-bottom:16px}.form-header .form-icon{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.2);margin:0 auto 14px;color:var(--auth-accent)}.form-header .form-icon svg{width:24px;height:24px;display:block}.form-header h3{font-size:18px;font-weight:700;color:#f8fafc;margin:0 0 6px;letter-spacing:-.02em}.form-header p{font-size:13px;color:rgba(255,255,255,.38);margin:0;line-height:1.5}.form-header .reset-username{display:inline-block;font-weight:700;color:var(--auth-accent)}.warning-box{background:rgba(239,68,68,.07);border:1px solid rgba(239,68,68,.2);border-left:3px solid rgba(239,68,68,.55);border-radius:10px;padding:12px 16px;font-size:12px;color:#fca5a5;line-height:1.55}.warning-box strong{color:#fecaca}.form-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:4px}.form-links a{color:rgba(255,255,255,.32);text-decoration:none;font-size:13px;font-weight:500;transition:color .2s ease;padding:4px 8px;border-radius:6px}.form-links a:hover{color:var(--auth-accent);background:rgba(99,102,241,.08)}#recover-form,#totp-form{display:none}#recover-form.show,#totp-form.show{display:flex;flex-direction:column;gap:14px;animation:authFormIn .28s cubic-bezier(.4,0,.2,1)}.auth-footer{margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.05)}.auth-theme-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:10px}.auth-theme-bar .theme-btn{width:26px;height:26px;font-size:11px;flex-shrink:0}.auth-theme-bar .theme-more{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);color:rgba(255,255,255,.45);font-weight:600;font-size:13px;cursor:pointer}.auth-theme-bar .theme-more:hover{background:rgba(255,255,255,.1);color:var(--auth-accent)}.theme-more-wrapper{position:relative}.theme-more-list{display:none;position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px;background:rgba(10,14,26,.96);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:12px;gap:6px;flex-wrap:wrap;width:max-content;max-width:240px;z-index:100;box-shadow:0 -8px 32px rgba(0,0,0,.5)}.theme-more-list.show{display:flex;animation:themeListIn .18s ease}@keyframes themeListIn{from{opacity:0;transform:translateX(-50%) translateY(6px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}.theme-more-list::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(255,255,255,.08)}.auth-lang-bar{display:flex;justify-content:center}.auth-version{text-align:center;font-size:11px;color:rgba(255,255,255,.3);margin-top:8px;letter-spacing:.03em}.sidebar-version{text-align:center;font-size:10px;color:var(--text-muted);padding:2px 0 8px;opacity:.45;letter-spacing:.05em}.auth-header{display:none}.auth-tab{display:none}.logo-container{display:none}.logo-icon{display:none}.auth-form-content{display:contents}#auth-toast-container{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:2147483647;display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none;width:360px;max-width:calc(100vw - 40px)}.auth-toast{display:flex;align-items:flex-start;gap:12px;padding:14px 14px 16px 14px;background:rgba(10,14,26,.96);border:1px solid rgba(255,255,255,.07);border-radius:14px;box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 1px 0 rgba(255,255,255,.06) inset,0 20px 56px -8px rgba(0,0,0,.72),0 4px 16px rgba(0,0,0,.4);position:relative;overflow:hidden;pointer-events:auto;cursor:default;opacity:0;transform:translateX(28px) scale(.96);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.auth-toast--visible{opacity:1;transform:translateX(0) scale(1);transition:opacity .3s cubic-bezier(.34, 1.56, .64, 1),transform .3s cubic-bezier(.34, 1.56, .64, 1)}.auth-toast--hiding{opacity:0;transform:translateX(28px) scale(.96);transition:opacity .24s ease,transform .24s ease;pointer-events:none}.auth-toast--success{border-color:rgba(34,197,94,.2);box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 20px 56px -8px rgba(0,0,0,.72),0 0 0 1px rgba(34,197,94,.12),0 0 28px rgba(34,197,94,.07)}.auth-toast--error{border-color:rgba(239,68,68,.2);box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 20px 56px -8px rgba(0,0,0,.72),0 0 0 1px rgba(239,68,68,.12),0 0 28px rgba(239,68,68,.07)}.auth-toast--warning{border-color:rgba(234,179,8,.2);box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 20px 56px -8px rgba(0,0,0,.72),0 0 0 1px rgba(234,179,8,.12),0 0 28px rgba(234,179,8,.06)}.auth-toast--info{border-color:rgba(59,130,246,.2);box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 20px 56px -8px rgba(0,0,0,.72),0 0 0 1px rgba(59,130,246,.12),0 0 28px rgba(59,130,246,.06)}.auth-toast__icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-top:1px}.auth-toast__icon svg{width:18px;height:18px;flex-shrink:0}.auth-toast--success .auth-toast__icon{background:rgba(34,197,94,.12);color:#4ade80}.auth-toast--error .auth-toast__icon{background:rgba(239,68,68,.12);color:#f87171}.auth-toast--warning .auth-toast__icon{background:rgba(234,179,8,.12);color:#fbbf24}.auth-toast--info .auth-toast__icon{background:rgba(59,130,246,.12);color:#60a5fa}.auth-toast__body{flex:1;min-width:0}.auth-toast__message{margin:0;font-size:13.5px;font-weight:500;color:#f1f5f9;line-height:1.5;word-break:break-word;padding-top:8px}.auth-toast__close{flex-shrink:0;width:28px;height:28px;border:none;background:rgba(255,255,255,.05);border-radius:7px;cursor:pointer;color:rgba(255,255,255,.32);display:flex;align-items:center;justify-content:center;transition:background .18s ease,color .18s ease;padding:0;margin-top:4px}.auth-toast__close:hover{background:rgba(255,255,255,.1);color:rgba(255,255,255,.65)}.auth-toast__close svg{width:12px;height:12px}.auth-toast__progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:rgba(255,255,255,.04)}.auth-toast__progress-bar{height:100%;width:100%;transform-origin:left;animation:authToastProgress linear forwards}@keyframes authToastProgress{from{transform:scaleX(1)}to{transform:scaleX(0)}}.auth-toast--success .auth-toast__progress-bar{background:rgba(74,222,128,.55)}.auth-toast--error .auth-toast__progress-bar{background:rgba(248,113,113,.55)}.auth-toast--warning .auth-toast__progress-bar{background:rgba(251,191,36,.55)}.auth-toast--info .auth-toast__progress-bar{background:rgba(96,165,250,.55)}@media (max-width:520px){#auth-toast-container{top:12px;left:12px;right:12px;transform:none;width:auto}}.form-group.floating input.field-error{border-color:rgba(239,68,68,.55)!important;box-shadow:0 0 0 3px rgba(239,68,68,.1),0 0 12px rgba(239,68,68,.07)!important}.field-error-msg{display:block;font-size:11.5px;color:#f87171;margin-top:5px;padding:0 2px;font-weight:500;opacity:0;transform:translateY(-3px);transition:opacity .18s ease,transform .18s ease;pointer-events:none;line-height:1.4}.field-error-msg.visible{opacity:1;transform:translateY(0)}.field-success{border-color:rgba(34,197,94,.5)!important;box-shadow:0 0 0 3px rgba(34,197,94,.1),0 0 12px rgba(34,197,94,.06)!important}.field-checking{border-color:rgba(255,255,255,.22)!important}.btn-primary.btn-loading{opacity:.72;cursor:not-allowed;pointer-events:none}.btn-primary.btn-loading span::after{content:'';display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .65s linear infinite;margin-left:8px;vertical-align:middle}#recover-form.active,#totp-form.active{display:flex;flex-direction:column;gap:14px;animation:authFormIn .28s cubic-bezier(.4,0,.2,1)}@media (max-width:480px){:root{--auth-card-width:100%}.auth-card{padding:28px 22px 24px;border-radius:16px}.auth-logo img{width:60px;height:60px}.form-group.floating input{height:52px;font-size:14px}.btn-primary{height:48px;font-size:14px}}#app{display:flex;flex-direction:column;height:100vh;height:100dvh;width:100vw;overflow:hidden}#app-body{display:flex;flex:1;min-height:0}.sidebar{width:var(--sidebar-width);min-width:200px;max-width:400px;background:var(--bg-card);border:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;position:relative;border-radius:0 20px 20px 0;margin:8px 8px 8px 0;box-shadow:32px 0 80px rgba(0,0,0,.65),12px 0 32px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.03) inset}.sidebar-resize-handle{position:absolute;top:0;right:-3px;width:6px;height:100%;cursor:col-resize;z-index:10;background:0 0;transition:background .15s}.sidebar[data-panel-pos=right] .sidebar-resize-handle{right:auto;left:-3px}.sidebar-resize-handle.dragging,.sidebar-resize-handle:hover{background:var(--accent);opacity:.5}.sidebar-header{padding:16px;border-bottom:1px solid rgba(255,255,255,.055);background:linear-gradient(160deg,rgba(124,92,191,.08) 0,rgba(124,92,191,.02) 60%,transparent 100%)}.brand{display:flex;align-items:center;gap:8px;margin-bottom:12px;position:relative;overflow:hidden}.brand::after{content:'';position:absolute;top:-20%;left:0;width:35%;height:140%;background:linear-gradient(90deg,transparent 0,rgba(255,255,255,.07) 50%,transparent 100%);transform:translateX(-200%);animation:brandShimmerSweep 5s ease-in-out 1s infinite;pointer-events:none;z-index:1}.logo-sm{font-size:24px;color:var(--accent)}.brand-icon{width:28px;height:28px;border-radius:6px;object-fit:cover;flex-shrink:0}.sidebar-brand-logo{width:32px;height:32px;background:0 0;padding:0;border-radius:0;box-shadow:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;animation:sidebarLogoPulse 3s ease-in-out infinite}.sidebar-logo-img{width:100%;height:100%;object-fit:contain;border-radius:0}.sidebar-logo-text{display:none}@keyframes sidebarLogoPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.04);opacity:.85}}.sidebar-logo-text{font-size:14px;font-weight:700;color:#fff;font-family:var(--font-heading);letter-spacing:1px}.brand-text{font-size:18px!important;font-weight:700!important;letter-spacing:4px!important;font-family:var(--font-heading)!important;position:relative!important;display:inline-block!important}.brand-text span{display:inline-block!important;font-size:18px!important;font-weight:700!important;letter-spacing:4px!important;font-family:var(--font-heading)!important;background:linear-gradient(90deg,var(--accent) 0,var(--accent-hover) 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}@keyframes brandPremiumWave{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes brandShimmerSweep{0%{transform:translateX(-200%)}28%{transform:translateX(500%)}100%{transform:translateX(500%)}}.user-bar{display:flex;align-items:center;gap:10px;padding:9px 10px;background:rgba(0,0,0,.18);border-radius:10px;border:1px solid rgba(255,255,255,.055);transition:background var(--transition);margin-top:4px}.user-bar:hover{background:rgba(0,0,0,.25)}.user-bar-avatar-wrap{position:relative;flex-shrink:0;width:36px;height:36px}.user-bar-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;user-select:none;overflow:hidden;flex-shrink:0;letter-spacing:0}.user-bar-avatar-img{position:absolute;top:0;left:0;width:36px;height:36px;border-radius:50%;object-fit:cover}.user-bar-avatar-wrap .status-picker-dot{position:absolute!important;bottom:-1px;right:-1px;width:12px!important;height:12px!important;outline:2.5px solid var(--bg-secondary);outline-offset:0;z-index:1}.user-names{display:flex;flex-direction:column;flex:1;overflow:hidden;min-width:0;gap:1px}.current-user{font-size:13px;font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}.login-name{font-size:10px;color:var(--text-muted);opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}.user-bar-custom-status{font-size:10px;color:var(--accent,#7c5cfc);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3;opacity:.85}.user-bar-actions{display:flex;align-items:center;gap:1px;flex-shrink:0;opacity:.55;transition:opacity var(--transition)}.user-bar:hover .user-bar-actions{opacity:1}.notif-bell-wrap{position:relative;display:flex}.brand-notif-bell{margin-left:auto;flex-shrink:0}.sidebar-notif-badge{position:absolute;top:0;right:0;min-width:14px;height:14px;background:var(--danger,#e74c3c);color:#fff;font-size:9px;font-weight:700;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 3px;pointer-events:none;line-height:1}.icon-btn{background:0 0;border:none;color:var(--text-muted);font-size:16px;padding:4px;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition);display:flex;align-items:center;justify-content:center}.icon-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.icon-btn.active{color:var(--accent);background:rgba(var(--accent-rgb,124,92,252),.15)}.icon-btn.small{font-size:13px}.icon-btn.danger:hover{color:var(--danger)}.sidebar-section{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.055);background:linear-gradient(160deg,rgba(124,92,191,.06) 0,rgba(124,92,191,.02) 60%,transparent 100%);margin:8px 12px;border-radius:12px}.sidebar-section.channel-section{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding-bottom:0}.section-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:6px}.input-row{display:flex;gap:6px}.input-row input{flex:1;padding:7px 10px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:13px;min-width:0}.input-row input:focus{border-color:var(--accent)}.admin-controls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;align-items:stretch}.admin-action-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:13px 8px 11px;background:rgba(var(--accent-rgb,124,92,252),.07);border:1px solid rgba(var(--accent-rgb,124,92,252),.16);border-radius:10px;color:var(--accent);cursor:pointer;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .12s ease;width:100%}.admin-action-btn:hover{background:rgba(var(--accent-rgb,124,92,252),.16);border-color:rgba(var(--accent-rgb,124,92,252),.4);box-shadow:0 4px 16px rgba(var(--accent-rgb,124,92,252),.12),inset 0 1px 0 rgba(255,255,255,.05);transform:translateY(-1px);color:var(--accent-hover,var(--accent))}.admin-action-btn:active{transform:translateY(0);box-shadow:none;background:rgba(var(--accent-rgb,124,92,252),.22)}.admin-action-icon{width:18px;height:18px;flex-shrink:0}.admin-action-label{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--text-secondary);line-height:1;white-space:nowrap}.btn-sm{padding:7px 12px;background:var(--bg-tertiary);color:var(--text-secondary);border-radius:var(--radius-sm);font-size:12px;font-weight:600;transition:all var(--transition);white-space:nowrap}.btn-sm:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-sm.btn-accent{background:var(--accent);color:#fff;font-size:16px;padding:7px 10px;line-height:1}.btn-sm.btn-accent:hover{background:var(--accent-hover)}.btn-sm.btn-danger{background:var(--danger,#e74c3c);color:#fff;font-size:16px;padding:7px 10px;line-height:1}.btn-sm.btn-danger:hover{filter:brightness(1.15)}.channel-list{flex:1;overflow-y:auto;padding:4px 0}@media (max-width:768px){#channels-toggle{display:none!important}#channel-list{display:block!important}}.channel-item{display:flex;align-items:center;gap:8px;padding:8px 16px;cursor:pointer;transition:background var(--transition);position:relative}.channel-item:hover{background:var(--bg-hover)}.channel-item.active{background:var(--bg-active)}.temp-channel-create-btn:hover{opacity:.8!important}.channel-item.active::before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:3px;background:var(--accent);border-radius:0 2px 2px 0}.channel-hash{color:var(--text-muted);font-weight:700;font-size:16px;flex-shrink:0}.channel-name{font-size:14px;color:var(--text-secondary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-item.active .channel-name,.channel-item:hover .channel-name{color:var(--text-primary)}.channel-badge{background:var(--danger);color:#fff;font-size:10px;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 5px}.channel-item.private-channel .channel-name{opacity:.6}.channel-item.private-channel .channel-hash{opacity:.6}.channel-item.private-channel:hover .channel-hash,.channel-item.private-channel:hover .channel-name{opacity:1}.channel-item.private-channel.active .channel-hash,.channel-item.private-channel.active .channel-name{opacity:1}.role-channel-access-section{margin-top:16px;border-top:1px solid var(--border);padding-top:12px}.role-channel-access-section h5{margin:0 0 8px}.role-channel-access-list{max-height:260px;overflow-y:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-secondary);padding:4px 0}.rca-channel-row{display:flex;align-items:center;gap:8px;padding:6px 12px;font-size:13px}.rca-channel-row:hover{background:var(--bg-hover)}.rca-channel-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-secondary)}.rca-channel-name.rca-sub{padding-left:16px;opacity:.85}.rca-channel-row label{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--text-muted);white-space:nowrap;cursor:pointer}.rca-reapply-btn{margin-top:8px;font-size:12px}.main{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg-primary);border:1px solid rgba(255,255,255,.07);position:relative;z-index:5}.channel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 12px 12px;background:var(--bg-card);border:1px solid var(--border);min-height:58px;gap:10px;position:relative;z-index:10;border-radius:20px 20px 0 0;margin:8px 8px 0 8px;box-shadow:0 12px 60px rgba(0,0,0,.6),0 6px 24px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.03) inset}.header-hard-image{position:absolute;right:200px}.channel-info{display:flex;align-items:center;gap:10px;min-width:0}.header-actions-box{display:flex;align-items:center;gap:5px;padding:3px 8px;border:1px solid var(--border,rgba(255,255,255,.1));border-radius:8px;background:var(--bg-tertiary,rgba(255,255,255,.03));flex-shrink:0}.header-actions-box .icon-btn{opacity:.7;transition:opacity .15s}.header-actions-box .icon-btn:hover{opacity:1}.header-actions-divider{width:1px;height:18px;background:var(--border,rgba(255,255,255,.12));flex-shrink:0;margin:0 2px}.header-left-actions{display:flex;align-items:center;gap:5px;flex-shrink:0}.join-room-btn{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;background:var(--accent);color:#fff;border:none;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;flex-shrink:0;transition:background .18s,transform .12s,box-shadow .18s;box-shadow:0 2px 12px rgba(var(--accent-rgb,124,92,252),.35);letter-spacing:.01em;white-space:nowrap}.join-room-btn:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 18px rgba(var(--accent-rgb,124,92,252),.5)}.join-room-btn:active{transform:translateY(0);box-shadow:0 1px 6px rgba(var(--accent-rgb,124,92,252),.3)}.join-room-btn svg{flex-shrink:0}.room-list-modal-inner{background:var(--bg-card);border:1px solid rgba(255,255,255,.08);border-radius:20px;width:92%;max-width:580px;height:min(700px,88vh);max-height:min(700px,88vh);min-height:360px;display:flex;flex-direction:column;position:relative;box-shadow:0 24px 80px rgba(0,0,0,.6),0 8px 32px rgba(0,0,0,.3);overflow:hidden;animation:roomModalIn .22s cubic-bezier(.34,1.56,.64,1)}@keyframes roomModalIn{from{opacity:0;transform:scale(.94) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.room-list-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:24px 24px 20px;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0}.room-list-header-left{display:flex;align-items:center;gap:13px;min-width:0}.room-list-icon{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent-hover,#5a3fc0));display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;box-shadow:0 4px 14px rgba(var(--accent-rgb,124,92,252),.45)}.room-list-title{font-size:17px;font-weight:700;color:var(--text-primary);margin:0 0 4px;font-family:var(--font-heading);line-height:1.2;border:none;padding:0;display:block}.room-list-subtitle{font-size:12px;color:var(--text-muted);margin:0;line-height:1.3}#room-list-count{font-weight:600;color:var(--accent)}.room-list-close-btn{width:32px;height:32px;min-width:32px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:var(--text-secondary);font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;flex-shrink:0}.room-list-close-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.room-list-search-wrap{display:flex;align-items:center;gap:10px;margin:14px 20px 10px;padding:0 14px;height:44px;background:var(--bg-primary,rgba(0,0,0,.2));border:1px solid rgba(255,255,255,.09);border-radius:12px;flex-shrink:0;transition:border-color .15s}.room-list-search-wrap:focus-within{border-color:rgba(var(--accent-rgb,124,92,252),.4)}.room-list-search-icon{color:var(--text-muted);flex-shrink:0;display:flex;align-items:center}.room-list-search-input{flex:1;background:0 0;border:none;outline:0;color:var(--text-primary);font-size:13.5px;font-family:inherit;padding:0;min-width:0}.room-list-search-input::placeholder{color:var(--text-muted)}.join-room-body{flex:1;min-height:0;overflow-y:auto;padding:8px 14px 18px;display:flex;flex-direction:column;gap:3px}.join-room-body::-webkit-scrollbar{width:4px}.join-room-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:4px}.room-list-item{display:flex;align-items:center;gap:14px;padding:13px 14px;border-radius:12px;cursor:pointer;transition:background .12s,border-color .12s;border:1px solid transparent;flex-shrink:0}.room-list-item:hover{background:var(--bg-hover);border-color:rgba(255,255,255,.07)}.room-list-item.room-list-item-locked{cursor:not-allowed;opacity:.55}.room-list-item.room-list-item-locked:hover{background:0 0;border-color:transparent}.room-list-item.active{background:rgba(var(--accent-rgb,124,92,252),.1);border-color:rgba(var(--accent-rgb,124,92,252),.22)}.room-list-item-avatar{width:42px;height:42px;min-width:42px;border-radius:12px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:var(--text-secondary)}.room-list-item.active .room-list-item-avatar{background:rgba(var(--accent-rgb,124,92,252),.18);color:var(--accent)}.room-list-item-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block;cursor:zoom-in;transition:transform .18s ease,box-shadow .18s ease}.room-list-item-avatar-img:hover{transform:scale(1.12);box-shadow:0 4px 16px rgba(0,0,0,.35)}.room-list-item-body{flex:1;min-width:0}.room-list-item-name{font-size:14px;font-weight:600;color:var(--text-primary);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35}.room-list-item-topic{font-size:12px;color:var(--text-muted);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.room-list-badges{display:flex;align-items:center;gap:6px;flex-shrink:0}.room-list-badge{font-size:10px;font-weight:600;padding:3px 8px;border-radius:6px;background:rgba(255,255,255,.07);color:var(--text-muted);border:1px solid rgba(255,255,255,.08);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}.room-list-badge.voice{color:#4ade80;border-color:rgba(74,222,128,.25);background:rgba(74,222,128,.1)}.room-list-badge.private{color:#f59e0b;border-color:rgba(245,158,11,.25);background:rgba(245,158,11,.1)}.room-list-user-count{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;color:var(--text-muted);padding:3px 9px;border-radius:6px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);white-space:nowrap}.room-list-join-arrow{color:var(--text-muted);opacity:0;transition:opacity .12s,color .12s;flex-shrink:0}.room-list-item:hover .room-list-join-arrow{opacity:1;color:var(--accent)}.room-list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;padding:40px 20px;color:var(--text-muted);font-size:14px;gap:10px}.room-list-empty-icon{font-size:32px;opacity:.45}@media (max-width:600px){.join-room-btn span{display:none}.join-room-btn{padding:8px 10px}.room-list-modal-inner{border-radius:16px;width:96%;height:min(92vh,600px);max-height:min(92vh,600px)}.room-list-header{padding:18px 18px 16px}.room-list-search-wrap{margin:10px 14px 8px}.join-room-body{padding:6px 10px 14px}.room-list-item{padding:11px 12px;gap:12px}}.support-banner{display:flex;align-items:center;width:100%;min-height:34px;background:linear-gradient(90deg,#1c1200 0,#2a1c00 50%,#1c1200 100%);border-top:1px solid rgba(210,140,20,.35);position:relative;flex-shrink:0;overflow:hidden;animation:supportBannerFadeIn .4s ease}@keyframes supportBannerFadeIn{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}.support-banner-content{position:absolute;top:0;bottom:0;display:flex;align-items:center;gap:8px;background:0 0;border:none;cursor:pointer;padding:0 16px;color:#f0c97a;font-size:13px;font-family:inherit;line-height:1.4;white-space:nowrap;transition:color .15s;animation:supportBannerScroll 22s linear infinite}.support-banner-content:hover{color:#ffd98a;animation-play-state:paused}@keyframes supportBannerScroll{from{left:100%;transform:translateX(0)}to{left:-100%;transform:translateX(-100%)}}.support-banner-icon{font-size:15px;line-height:1;display:inline-block;flex-shrink:0}.support-banner-text{color:#c9a655;font-size:12.5px;letter-spacing:.01em}.support-banner-text strong{color:#f5c55a;font-weight:700;letter-spacing:.02em}.support-banner-dismiss{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:0 0;border:none;color:rgba(200,160,70,.55);font-size:16px;line-height:1;cursor:pointer;padding:4px 6px;border-radius:4px;transition:color .15s,background .15s;font-family:inherit;z-index:1}.support-banner-dismiss:hover{color:rgba(240,200,100,.9);background:rgba(255,200,80,.08)}@media (max-width:600px){.support-banner{min-height:30px}.support-banner-text{font-size:11.5px}.support-banner-content{padding:5px 16px;gap:6px}}.update-banner{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#fff;font-size:12px;font-weight:600;border-radius:20px;text-decoration:none;white-space:nowrap;flex-shrink:0;cursor:pointer;animation:updateFadeIn .4s ease;transition:transform .15s,box-shadow .15s}.update-banner:hover{transform:scale(1.05);box-shadow:0 2px 12px rgba(var(--accent-rgb,88,101,242),.4);color:#fff}.update-pulse{width:8px;height:8px;background:#fff;border-radius:50%;animation:updatePulse 1.5s ease-in-out infinite}@keyframes updatePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}@keyframes updateFadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.force-update-overlay{position:fixed;inset:0;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;z-index:99999;animation:fuOverlayIn .25s ease}@keyframes fuOverlayIn{from{opacity:0}to{opacity:1}}.force-update-card{background:var(--card-bg,#1e1e2e);border:1px solid var(--border-color,rgba(255,255,255,.1));border-radius:20px;padding:40px 36px 32px;max-width:400px;width:calc(100% - 40px);text-align:center;box-shadow:0 32px 80px rgba(0,0,0,.6);animation:fuCardIn .35s cubic-bezier(.34,1.56,.64,1)}@keyframes fuCardIn{from{opacity:0;transform:scale(.88) translateY(24px)}to{opacity:1;transform:scale(1) translateY(0)}}.force-update-icon{width:64px;height:64px;margin:0 auto 20px;background:linear-gradient(135deg,var(--accent,#7c5cfc),var(--accent-hover,#6a4de0));border-radius:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(124,92,252,.4)}.force-update-icon svg{width:30px;height:30px;color:#fff}.force-update-title{font-size:21px;font-weight:700;color:var(--text-primary,#fff);margin:0 0 10px;letter-spacing:-.01em}.force-update-badge{display:inline-block;background:linear-gradient(135deg,var(--accent,#7c5cfc),var(--accent-hover,#6a4de0));color:#fff;font-size:11px;font-weight:700;padding:3px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.06em;text-transform:uppercase}.force-update-desc{font-size:14px;color:var(--text-secondary,rgba(255,255,255,.6));line-height:1.65;margin:0 0 28px}.force-update-btn{width:100%;padding:14px 24px;background:linear-gradient(135deg,var(--accent,#7c5cfc),var(--accent-hover,#6a4de0));color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease;box-shadow:0 4px 20px rgba(124,92,252,.45);display:flex;align-items:center;justify-content:center;gap:8px;font-family:inherit}.force-update-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 28px rgba(124,92,252,.55)}.force-update-btn:active:not(:disabled){transform:translateY(0);opacity:.92}.force-update-btn:disabled{opacity:.65;cursor:not-allowed}.force-update-btn svg{width:18px;height:18px;flex-shrink:0}.force-update-note{font-size:12px;color:var(--text-muted,rgba(255,255,255,.35));margin-top:14px;line-height:1.5}.sub-expired-overlay{position:fixed;inset:0;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;z-index:2147483647;animation:fuOverlayIn .25s ease}.sub-expired-card{background:var(--card-bg,#1e1e2e);border:1px solid var(--border-color,rgba(255,255,255,.1));border-radius:20px;padding:40px 36px 32px;max-width:400px;width:calc(100% - 40px);text-align:center;box-shadow:0 32px 80px rgba(0,0,0,.6);animation:fuCardIn .35s cubic-bezier(.34,1.56,.64,1)}.sub-expired-icon{width:64px;height:64px;margin:0 auto 20px;background:linear-gradient(135deg,var(--warning,#faa61a),#e08e00);border-radius:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(250,166,26,.4)}.sub-expired-icon svg{width:30px;height:30px;color:#fff}.sub-expired-title{font-size:21px;font-weight:700;color:var(--text-primary,#fff);margin:0 0 10px;letter-spacing:-.01em}.sub-expired-badge{display:inline-block;background:linear-gradient(135deg,var(--warning,#faa61a),#e08e00);color:#fff;font-size:11px;font-weight:700;padding:3px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.06em;text-transform:uppercase}.sub-expired-desc{font-size:14px;color:var(--text-secondary,rgba(255,255,255,.6));line-height:1.65;margin:0 0 28px}.sub-expired-btn{width:100%;padding:14px 24px;background:linear-gradient(135deg,var(--warning,#faa61a),#e08e00);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease;box-shadow:0 4px 20px rgba(250,166,26,.45);display:flex;align-items:center;justify-content:center;gap:8px;font-family:inherit}.sub-expired-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 28px rgba(250,166,26,.55)}.sub-expired-btn:active:not(:disabled){transform:translateY(0);opacity:.92}.sub-expired-btn:disabled{opacity:.65;cursor:not-allowed}.sub-expired-btn svg{width:18px;height:18px;flex-shrink:0}.sub-expired-note{font-size:12px;color:var(--text-muted,rgba(255,255,255,.35));margin-top:14px;line-height:1.5}.update-notif{position:fixed;bottom:24px;right:24px;display:flex;align-items:center;gap:12px;background:var(--bg-secondary,#1e2035);border:1px solid var(--border,#2d3050);border-left:3px solid var(--accent,#7c5cfc);border-radius:10px;padding:13px 14px 13px 16px;z-index:99998;box-shadow:0 16px 48px rgba(0,0,0,.55),0 4px 12px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.04) inset;max-width:340px;width:max-content;transform:translateY(18px);opacity:0;transition:transform .3s cubic-bezier(.22, 1, .36, 1),opacity .22s ease;pointer-events:all}.update-notif--visible{transform:translateY(0);opacity:1}.update-notif-icon{width:34px;height:34px;border-radius:50%;background:rgba(var(--accent-rgb,124,92,252),.12);border:1px solid rgba(var(--accent-rgb,124,92,252),.22);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--accent,#7c5cfc)}.update-notif-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.update-notif-title{font-size:13px;font-weight:600;color:var(--text-primary,#e2e4f0);display:flex;align-items:center;gap:6px;line-height:1.3}.update-notif-version{font-size:10px;font-weight:600;color:var(--accent,#7c5cfc);background:rgba(var(--accent-rgb,124,92,252),.12);border:1px solid rgba(var(--accent-rgb,124,92,252),.2);padding:1px 6px;border-radius:4px;letter-spacing:.04em;font-variant-numeric:tabular-nums}.update-notif-sub{font-size:11.5px;color:var(--text-muted,#5d6180);line-height:1.3;white-space:nowrap}.update-notif-btn{padding:6px 14px;background:var(--accent,#7c5cfc);color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;flex-shrink:0;font-family:inherit;transition:background .15s;white-space:nowrap}.update-notif-btn:hover:not(:disabled){background:var(--accent-hover,#9478ff)}.update-notif-btn:disabled{opacity:.55;cursor:not-allowed}.update-notif-close{background:0 0;border:none;color:var(--text-muted,#5d6180);display:flex;align-items:center;justify-content:center;width:20px;height:20px;cursor:pointer;flex-shrink:0;border-radius:4px;transition:color .15s,background .15s;padding:0;align-self:flex-start}.update-notif-close:hover{color:var(--text-secondary,#9498b3);background:var(--bg-hover,#2c2f4a)}.fu-manager{margin-top:16px;padding-top:16px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:10px}.fu-header{display:flex;align-items:center;gap:12px}.fu-header-icon{width:38px;height:38px;background:linear-gradient(135deg,var(--accent,#7c5cfc),var(--accent-hover,#6a4de0));border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.fu-header-title{font-size:14px;font-weight:700;color:var(--text-primary);margin:0 0 3px}.fu-header-desc{font-size:12px;color:var(--text-muted);margin:0}.fu-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.fu-info-card{background:var(--bg-tertiary,#1a1a22);border:1px solid var(--border-light,rgba(255,255,255,.07));border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}.fu-info-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted,rgba(255,255,255,.4))}.fu-info-value{font-size:16px;font-weight:700;color:var(--accent,#7c5cfc)}.fu-panel{background:var(--bg-tertiary,#1a1a22);border:1px solid var(--border-light,rgba(255,255,255,.07));border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}.fu-panel-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid var(--border-light,rgba(255,255,255,.07))}.fu-panel-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary,rgba(255,255,255,.5))}.fu-refresh-btn{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:4px 10px}.fu-empty-text{font-size:12px;color:var(--text-muted);padding:2px 0;margin:0}.fu-version-breakdown{max-height:150px;overflow-y:auto}.fu-version-row{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:6px;font-size:12px}.fu-version-row:hover{background:var(--bg-hover,rgba(255,255,255,.05))}.fu-version-tag{background:var(--accent,#7c5cfc);color:#fff;border-radius:5px;padding:1px 8px;font-size:11px;font-weight:700;flex-shrink:0}.fu-version-tag.outdated{background:#e74c3c}.fu-version-tag.current{background:#27ae60}.fu-version-count{color:var(--text-secondary,rgba(255,255,255,.6));flex:1}.fu-version-bar{height:4px;background:var(--accent,#7c5cfc);border-radius:2px;min-width:4px;transition:width .3s ease}.fu-row-inline{display:flex;gap:8px;align-items:center}.fu-version-input{width:150px!important;min-width:0!important;font-size:13px!important;padding:7px 12px!important}.fu-hint{font-size:11px;color:var(--text-muted);margin:0;line-height:1.45}.fu-field{display:flex;flex-direction:column;gap:5px}.fu-message-input{resize:vertical;min-height:56px;width:100%;box-sizing:border-box;font-size:13px!important;padding:8px 12px!important}.fu-controls-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fu-controls-grid .settings-select{width:100%;font-size:13px;padding:7px 12px;min-width:0;box-sizing:border-box}.fu-countdown-input{width:110px!important;min-width:0!important;font-size:13px!important;padding:7px 12px!important}.fu-action-bar{display:flex;gap:8px;padding-top:2px}.fu-btn-broadcast{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:10px 14px;background:var(--accent,#7c5cfc);color:#fff;border:none;border-radius:var(--radius-sm,8px);font-size:13px;font-weight:600;font-family:var(--font-main);cursor:pointer;transition:background .15s,transform .1s}.fu-btn-broadcast:hover{background:var(--accent-hover,#6a4de0)}.fu-btn-broadcast:active{transform:scale(.97)}.fu-btn-force-all{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:10px 14px;background:0 0;color:var(--danger,#e74c3c);border:1px solid var(--danger,#e74c3c);border-radius:var(--radius-sm,8px);font-size:13px;font-weight:600;font-family:var(--font-main);cursor:pointer;transition:background .15s,color .15s,transform .1s}.fu-btn-force-all:hover{background:var(--danger,#e74c3c);color:#fff}.fu-btn-force-all:active{transform:scale(.97)}.fu-status-msg{font-size:12px;padding:8px 12px;border-radius:6px;background:var(--bg-input,rgba(255,255,255,.05));border:1px solid var(--border-light,rgba(255,255,255,.07));color:var(--text-secondary);line-height:1.4}.desktop-app-banner{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:linear-gradient(135deg,#1abc9c,#16a085);color:#fff;font-size:12px;font-weight:600;border-radius:20px;text-decoration:none;white-space:nowrap;flex-shrink:0;cursor:pointer;animation:updateFadeIn .4s ease;transition:transform .15s,box-shadow .15s;position:relative}.desktop-app-banner:hover{transform:scale(1.05);box-shadow:0 2px 12px rgba(26,188,156,.4);color:#fff}.desktop-app-icon{font-size:13px;line-height:1}.desktop-app-text{pointer-events:none}.desktop-app-dismiss{background:0 0;border:none;color:rgba(255,255,255,.7);font-size:15px;cursor:pointer;padding:0 0 0 4px;line-height:1;transition:color .15s}.desktop-app-dismiss:hover{color:#fff}.android-beta-banner{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:linear-gradient(135deg,#3ddc84,#2bb55e);color:#fff;font-size:12px;font-weight:600;border-radius:20px;border:none;text-decoration:none;white-space:nowrap;flex-shrink:0;cursor:pointer;animation:updateFadeIn .4s ease;transition:transform .15s,box-shadow .15s;position:relative}.android-beta-banner:hover{transform:scale(1.05);box-shadow:0 2px 12px rgba(61,220,132,.4);color:#fff}.android-beta-icon{font-size:13px;line-height:1}.android-beta-text{pointer-events:none}.android-beta-dismiss{background:0 0;border:none;color:rgba(255,255,255,.7);font-size:15px;cursor:pointer;padding:0 0 0 4px;line-height:1;transition:color .15s}.android-beta-dismiss:hover{color:#fff}.android-beta-promo{max-width:460px;text-align:center;padding:36px 32px 28px;border:1px solid var(--border-light);border-radius:16px;animation:desktopPromoIn .35s ease}.android-beta-promo-icon{font-size:48px;width:80px;height:80px;line-height:80px;margin:0 auto 16px;background:linear-gradient(135deg,#3ddc84,#2bb55e);border-radius:18px;display:flex;align-items:center;justify-content:center}.android-beta-promo-title{font-size:22px;font-weight:700;color:var(--text-primary);margin:0 0 4px;display:flex;align-items:center;justify-content:center;gap:8px}.android-beta-promo-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;background:linear-gradient(135deg,#3ddc84,#2bb55e);color:#fff;padding:2px 8px;border-radius:10px}.android-beta-promo-subtitle{font-size:14px;color:var(--text-secondary);margin:0 0 16px}.android-beta-promo-features{list-style:none;padding:0;margin:0 0 16px;text-align:left;display:inline-block}.android-beta-promo-features li{font-size:14px;color:var(--text-primary);padding:4px 0;display:flex;align-items:center;gap:10px}.android-beta-promo-note{font-size:13px;color:var(--text-secondary);margin:0 0 16px}.android-beta-form{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0 0 16px}.android-beta-email-input{width:100%;max-width:320px;padding:10px 14px;font-size:14px;border-radius:8px;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);outline:0;transition:border-color .15s}.android-beta-email-input:focus{border-color:#3ddc84;box-shadow:0 0 0 2px rgba(61,220,132,.2)}.android-beta-submit{padding:10px 24px;font-size:14px;font-weight:600;border-radius:8px;background:linear-gradient(135deg,#3ddc84,#2bb55e);color:#fff;border:none;cursor:pointer;transition:transform .1s,box-shadow .15s}.android-beta-submit:hover{transform:scale(1.03);box-shadow:0 4px 16px rgba(61,220,132,.3)}.android-beta-promo-credit{font-size:12px;color:var(--text-muted);margin:0 0 16px;font-style:italic}.android-beta-promo-actions{display:flex;justify-content:center;gap:10px;margin:0 0 12px}.android-beta-promo-later{padding:10px 20px;font-size:14px;font-weight:500;border-radius:8px;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;transition:background .15s}.android-beta-promo-later:hover{background:var(--bg-tertiary)}.android-beta-promo-dismiss-label{font-size:12px;color:var(--text-muted);display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;user-select:none}.android-beta-promo-dismiss-label input[type=checkbox]{accent-color:#3ddc84;cursor:pointer}.desktop-promo{max-width:440px;text-align:center;padding:36px 32px 28px;border:1px solid var(--border-light);border-radius:16px;animation:desktopPromoIn .35s ease}@keyframes desktopPromoIn{from{opacity:0;transform:scale(.92) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.desktop-promo-icon{font-size:48px;width:80px;height:80px;line-height:80px;margin:0 auto 16px;background:var(--accent);border-radius:18px;display:flex;align-items:center;justify-content:center}.desktop-promo-title{font-size:22px;font-weight:700;color:var(--text-primary);margin:0 0 4px;display:flex;align-items:center;justify-content:center;gap:8px}.desktop-promo-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;background:var(--accent);color:#fff;padding:2px 8px;border-radius:10px}.desktop-promo-subtitle{font-size:14px;color:var(--text-secondary);margin:0 0 20px}.desktop-promo-features{list-style:none;padding:0;margin:0 0 16px;text-align:left;display:inline-block}.desktop-promo-features li{font-size:14px;color:var(--text-primary);padding:4px 0;display:flex;align-items:center;gap:10px}.promo-check{color:var(--accent);font-weight:700;font-size:16px;flex-shrink:0}.desktop-promo-meta{font-size:12px;color:var(--text-muted);margin:0 0 20px}.desktop-promo-actions{display:flex;justify-content:center;gap:10px;margin:0 0 16px}.desktop-promo-install{padding:10px 24px;font-size:14px;font-weight:600;border-radius:8px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border:none;cursor:pointer;transition:background .15s,transform .1s}.desktop-promo-install:hover{background:var(--accent-hover);color:#fff;transform:scale(1.03)}.desktop-promo-later{padding:10px 20px;font-size:14px;font-weight:500;border-radius:8px;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;transition:background .15s}.desktop-promo-later:hover{background:var(--bg-tertiary)}.desktop-promo-dismiss-label{font-size:12px;color:var(--text-muted);display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;user-select:none}.desktop-promo-dismiss-label input[type=checkbox]{accent-color:var(--accent);cursor:pointer}.ch-disabled-badge{position:relative;display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;font-size:.65rem;opacity:.75;overflow:hidden}.ch-disabled-badge::after{content:'';position:absolute;width:2px;height:20px;background:#e74c3c;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg);pointer-events:none}.channel-item{position:relative}.channel-more-btn{background:0 0;border:none;color:var(--text-muted);width:24px;height:24px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s ease,background .15s ease,opacity .15s ease;flex-shrink:0;margin-left:auto;opacity:.7;font-size:14px}.channel-item .channel-more-btn:focus,.channel-item:hover .channel-more-btn{opacity:1}.channel-more-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.channel-more-btn:active{background:var(--bg-active)}.channel-popout-btn{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-secondary);font-size:12px;cursor:pointer;padding:2px 6px;border-radius:var(--radius-sm);opacity:0;pointer-events:none;transition:all .15s;line-height:1;flex-shrink:0;margin-left:4px}.channel-item:hover .channel-popout-btn,.channel-popout-btn:focus{opacity:1;pointer-events:auto}.channel-popout-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:scale(1.1)}.channel-ctx-menu{position:fixed;z-index:10200050;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 4px 16px rgba(0,0,0,.35);min-width:170px;padding:4px}.channel-ctx-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:0 0;border:none;color:var(--text-primary);font-size:13px;cursor:pointer;border-radius:var(--radius-sm);white-space:nowrap;width:100%;text-align:left}.channel-ctx-item:hover{background:var(--bg-hover)}.channel-ctx-item.danger{color:var(--danger)}.channel-ctx-item.danger:hover{background:#3a1515}.ctx-indicator{margin-left:auto;font-size:.85em;padding-left:10px;white-space:nowrap}.channel-functions-panel{position:fixed;background:var(--bg-secondary);border-radius:6px;padding:3px 0;border:1px solid var(--border);box-shadow:0 4px 16px rgba(0,0,0,.35);z-index:10200051;min-width:170px}.cfn-divider{border-top:1px solid var(--border);margin:3px 8px}.cfn-row{display:flex;align-items:center;justify-content:space-between;padding:5px 10px;border-radius:4px;cursor:pointer;user-select:none;transition:background .1s}.cfn-row:hover{background:var(--bg-hover)}.cfn-row.cfn-disabled{opacity:.38;cursor:not-allowed;pointer-events:none}.cfn-row.cfn-disabled .cfn-label{text-decoration:line-through;text-decoration-color:rgba(255,255,255,0.45)}.cfn-label{font-size:12px;color:var(--text-secondary)}.cfn-badge{font-size:10px;font-weight:700;padding:2px 7px;border-radius:3px;min-width:30px;text-align:center;letter-spacing:.3px}.cfn-badge.cfn-on{background:rgba(87,242,135,.15);color:#57f287}.cfn-badge.cfn-off{background:rgba(255,255,255,.06);color:var(--text-muted)}.cfn-input{width:54px;background:var(--bg-primary);border:1px solid var(--accent,var(--border));border-radius:3px;color:var(--text-primary);font-size:11px;padding:2px 5px;text-align:right;outline:0}select.cfn-select.cfn-input{width:auto;max-width:120px;text-align:left}.channel-ctx-item [class=cfn-arrow]{margin-left:auto;font-size:9px;color:var(--text-muted)}.channel-ctx-sep{border:none;border-top:1px solid var(--border);margin:3px 6px}.channel-info h3{font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--font-heading)}.channel-code-tag{font-size:11px;font-family:var(--font-mono);color:var(--text-muted);background:var(--bg-tertiary);padding:2px 8px;border-radius:10px;letter-spacing:.5px}.channel-code-tag:empty{display:none}.channel-creator-tag{font-size:11px;font-weight:600;color:var(--accent);background:rgba(var(--accent-rgb,124,92,252),.1);padding:2px 8px;border-radius:10px;border:1px solid rgba(var(--accent-rgb,124,92,252),.2);letter-spacing:.3px;text-shadow:0 0 4px rgba(var(--accent-rgb,124,92,252),.3)}.welcome-screen{flex:1;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--bg-primary) 0,var(--bg-secondary) 100%);position:relative;overflow:hidden}.premium-layer{position:absolute;top:20px;left:20px;right:20px;bottom:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:24px;pointer-events:none;z-index:0}.welcome-screen::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 50% 50%,var(--accent-alpha,rgba(124,92,252,.1)) 0,transparent 70%);pointer-events:none}.welcome-content{text-align:center;color:var(--text-secondary);position:relative;z-index:1;padding:40px;animation:welcomeFadeIn .8s ease-out;width:100%;height:100%;overflow:hidden}.room-list-content{position:absolute;top:60px;left:60px;right:60px;bottom:60px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:20px;padding:16px;z-index:10;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.2) transparent;opacity:1!important;visibility:visible!important;display:block!important;box-shadow:0 32px 80px rgba(0,0,0,.65),0 12px 32px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.03) inset}.welcome-content .room-list-content.dm-section-pane{position:relative;top:auto;left:auto;right:auto;bottom:auto;margin-top:20px;max-height:400px;width:100%;background:rgba(255,255,255,.03);border-radius:12px;z-index:auto;display:block!important;flex-direction:column;padding:16px}.welcome-channel-reflection::-webkit-scrollbar{width:6px}.welcome-channel-reflection::-webkit-scrollbar-track{background:0 0}.welcome-channel-reflection::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3);border-radius:3px}.welcome-channel-reflection::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.5)}.room-list-content::-webkit-scrollbar{width:4px}.room-list-content::-webkit-scrollbar-track{background:0 0}.room-list-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:2px}.room-list-content::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.4)}.room-list-header{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:10px;font-family:var(--font-heading)}.room-list-title{flex:1;text-align:left}.welcome-room-header-actions{display:flex;align-items:center;gap:6px;margin-left:auto}.welcome-room-action-btn{display:flex;align-items:center;gap:5px;padding:5px 10px;background:rgba(var(--accent-rgb,124,92,252),.08);border:1px solid rgba(var(--accent-rgb,124,92,252),.2);border-radius:7px;color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.3px;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .12s ease;white-space:nowrap}.welcome-room-action-btn:hover{background:rgba(var(--accent-rgb,124,92,252),.18);border-color:rgba(var(--accent-rgb,124,92,252),.45);transform:translateY(-1px)}.welcome-room-action-btn:active{transform:translateY(0);background:rgba(var(--accent-rgb,124,92,252),.25)}.room-actions-container{display:flex;flex-direction:column;gap:8px}.room-action-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 12px;color:var(--text-secondary);font-size:13px;cursor:pointer;transition:all var(--transition);text-align:left;display:flex;align-items:center;gap:8px}.room-action-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:var(--text-primary);transform:translateY(-1px)}.room-action-btn:active{transform:translateY(0)}.reflection-title{color:var(--text-primary);font-size:16px;font-weight:600;margin:0 0 12px 0;text-align:left;font-family:var(--font-heading)}.reflected-channel-list{display:flex;flex-direction:column;gap:6px}.room-channel-item{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;transition:all var(--transition);background:rgba(255,255,255,.02);border-radius:6px;border:1px solid rgba(255,255,255,.03);margin-bottom:2px}.room-channel-number{display:inline-block;width:24px;text-align:right;color:var(--text-muted);font-size:.8rem;flex-shrink:0;opacity:.7}.room-channel-item.active .room-channel-number,.room-channel-item:hover .room-channel-number{opacity:1;color:var(--text-secondary)}.room-channel-item:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08)}.room-channel-item.active{background:var(--accent-alpha);border-color:var(--accent)}.room-channel-hash{color:var(--text-muted);font-weight:700;font-size:13px;flex-shrink:0}.room-channel-name{font-size:13px;color:var(--text-secondary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left!important}.room-channel-item.active .room-channel-name,.room-channel-item:hover .room-channel-name{color:var(--text-primary)}.room-channel-badge{background:var(--danger);color:#fff;font-size:10px;font-weight:700;min-width:14px;height:14px;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 3px}.room-channel-more-btn{background:0 0;border:none;color:var(--text-muted);width:24px;height:24px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s ease,background .15s ease,opacity .15s ease;flex-shrink:0;margin-left:auto;opacity:.7;font-size:14px}.room-channel-item .room-channel-more-btn:focus,.room-channel-item:hover .room-channel-more-btn{opacity:1}.room-channel-more-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.room-channel-more-btn:active{background:var(--bg-active)}.reflected-channel-item:hover{background:rgba(255,255,255,.08)}.reflected-channel-item.active{background:var(--accent-alpha);border-color:var(--accent)}.reflected-channel-hash{color:var(--text-muted);font-weight:700;font-size:14px;flex-shrink:0}.reflected-channel-name{font-size:14px;color:var(--text-secondary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reflected-channel-item.active .reflected-channel-name,.reflected-channel-item:hover .reflected-channel-name{color:var(--text-primary)}.reflected-channel-badge{background:var(--danger);color:#fff;font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px}@media (max-width:768px){.welcome-channel-reflection{top:40px;left:30px;right:30px;max-height:200px;padding:12px}.room-channel-item{padding:6px 10px;gap:6px}.room-channel-hash{font-size:12px}.room-channel-name{font-size:12px}.room-list-content{top:40px;bottom:40px;left:20px;right:20px;padding:12px;z-index:10}.room-list-header{font-size:13px;margin-bottom:8px;padding:14px 14px 12px;gap:8px}.room-list-header-left{gap:10px;min-width:0}.room-list-icon{width:36px;height:36px;border-radius:11px}.room-list-title{font-size:14px}.room-list-subtitle{font-size:11px}.welcome-room-header-actions{gap:5px;flex-shrink:0}.welcome-room-action-btn{padding:4px 9px;font-size:10.5px;gap:4px;border-radius:6px}.room-action-btn{padding:6px 10px;font-size:12px;gap:6px}}@media (max-width:480px){.room-list-content{top:20px;bottom:20px;left:12px;right:12px;padding:10px;border-radius:16px}.room-list-header{padding:10px 12px 10px;gap:6px}.room-list-header-left{gap:9px}.room-list-icon{width:32px;height:32px;border-radius:9px}.room-list-title{font-size:13px;margin-bottom:2px}.room-list-subtitle{font-size:10px}.welcome-room-header-actions{gap:4px}.welcome-room-action-btn{padding:6px;min-width:30px;justify-content:center;border-radius:7px;gap:0}.welcome-room-action-btn span{display:none}}.room-list-content.welcome-room-list{display:flex!important;flex-direction:column;overflow:hidden;padding:0}.welcome-room-list .room-list-header{padding:10px 14px 8px;gap:10px;flex-shrink:0;margin-bottom:0}.welcome-room-list .room-list-header-left{gap:8px}.welcome-room-list .room-list-icon{width:28px;height:28px;border-radius:8px;box-shadow:0 2px 8px rgba(var(--accent-rgb,124,92,252),.3)}.welcome-room-list .room-list-icon svg{width:13px;height:13px}.welcome-room-list .room-list-title{font-size:13px;margin-bottom:1px}.welcome-room-list .room-list-subtitle{font-size:10.5px}.welcome-room-list .room-list-search-wrap{height:32px;margin:5px 12px!important;padding:0 10px;gap:7px;border-radius:8px;flex-shrink:0}.welcome-room-list .room-list-search-input{font-size:12px}.welcome-room-list #welcome-room-items{padding:2px 8px 10px;gap:1px!important}.welcome-room-list .room-list-item{padding:6px 8px;gap:8px;border-radius:8px}.welcome-room-list .room-list-item-avatar{width:28px;height:28px;min-width:28px;border-radius:8px;font-size:11px}.welcome-room-list .room-list-item-avatar-img{border-radius:8px}.welcome-room-list .room-list-item-name{font-size:12.5px}.welcome-room-list .room-list-item-topic{font-size:10px;margin-top:1px}.welcome-room-list .room-list-badges{gap:4px}.welcome-room-list .room-list-user-count{font-size:10px;padding:1px 5px;gap:3px}.welcome-room-list .room-list-user-count svg{width:9px;height:9px}.welcome-room-list .room-list-badge{font-size:9px;padding:1px 5px}.welcome-room-list .room-list-join-arrow{width:13px;height:13px}.welcome-room-list .room-list-item.room-sub-active{background:linear-gradient(rgba(255,255,255,.1) 0,rgba(0,0,0,.08) 100%),var(--room-color);box-shadow:inset 0 -1px 0 rgba(0,0,0,.18);border-color:rgba(0,0,0,.16)}.welcome-room-list .room-list-item.room-sub-active::after,.welcome-room-list .room-list-item.room-sub-active::before{display:none}.welcome-room-list .room-list-item.room-sub-active:hover{background:linear-gradient(rgba(255,255,255,.18) 0,rgba(0,0,0,.05) 100%),var(--room-color);box-shadow:inset 0 -1px 0 rgba(0,0,0,.18),0 2px 12px rgba(var(--room-color-rgb),.4);border-color:rgba(0,0,0,.16)}.welcome-room-list .room-list-item.room-sub-active .room-list-item-name{color:var(--header-fg,#fff);text-shadow:none}.welcome-room-list .room-list-item.room-sub-active .room-list-item-topic{color:var(--header-fg-muted,rgba(255,255,255,.74))}.welcome-room-list .room-list-item.room-sub-active .room-list-item-avatar{background:rgba(255,255,255,.15);color:var(--header-fg,#fff);box-shadow:none}.welcome-room-list .room-list-item.room-sub-active .room-list-user-count{color:var(--header-fg-muted,rgba(255,255,255,.74));background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2)}.welcome-room-list .room-list-item.room-sub-active .room-list-badge{color:var(--header-fg,#fff);background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2)}.welcome-room-list .room-list-item.room-sub-active .room-list-join-arrow{color:var(--header-fg-muted,rgba(255,255,255,.74))}.welcome-room-list .room-list-item.room-sub-active:hover .room-list-join-arrow{opacity:1;color:var(--header-fg,#fff)}.welcome-room-list .room-list-empty{padding:24px 16px;font-size:13px}.welcome-room-list .room-list-empty-icon{font-size:24px}@keyframes welcomeFadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.welcome-logo{position:absolute;top:0;left:50%;transform:translateX(-50%);width:600px;height:600px;background:0 0;display:flex;align-items:center;justify-content:center;animation:logoPulse 2s ease-in-out infinite;padding:0;border-radius:0;overflow:visible;z-index:0;pointer-events:none}.welcome-logo-img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0, 0, 0, .2));opacity:.7}@keyframes logoPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}.welcome-logo-text{font-size:36px;font-weight:700;color:#fff;font-family:var(--font-heading);letter-spacing:2px}.welcome-icon{font-size:72px;color:var(--accent);opacity:.5;margin-bottom:16px}.welcome-greeting{font-size:28px;position:relative;z-index:2;color:var(--text-primary);margin-bottom:12px;font-family:var(--font-heading);font-weight:600;animation:greetingSlide .6s ease-out .2s both}@keyframes greetingSlide{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.welcome-greeting-text{background:linear-gradient(90deg,var(--accent),var(--accent-hover,var(--accent)));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.welcome-username-highlight{font-weight:700;color:var(--accent);text-shadow:0 0 20px var(--accent-glow,rgba(124,92,252,.5))}.desktop-download-banner{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:20;display:inline-flex;align-items:center;gap:10px;background:rgba(20,20,40,.55);border:1px solid rgba(124,92,252,.35);border-radius:999px;padding:6px 10px 6px 14px;white-space:nowrap;font-size:12.5px;color:var(--text-secondary,#9498b3);box-shadow:0 4px 20px rgba(0,0,0,.3),0 0 0 1px rgba(124,92,252,.1) inset;pointer-events:auto}.desktop-download-label{font-weight:500;color:var(--text-primary,#e2e4f0);letter-spacing:.01em}.desktop-download-btn{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(135deg,#7c5cfc,#43b581);color:#fff;border-radius:999px;padding:5px 14px;font-size:12px;font-weight:600;text-decoration:none;transition:opacity .15s,transform .15s;line-height:1}.desktop-download-btn:hover{opacity:.88;transform:translateY(-1px);color:#fff}.desktop-download-btn:active{transform:translateY(0);opacity:1}.desktop-download-cert,.desktop-download-msix{display:inline-flex;align-items:center;margin-left:4px;padding:5px 10px;font-size:11px;font-weight:600;border-radius:999px;border:1px solid rgba(124,92,252,.4);color:var(--text-secondary,#9498b3);text-decoration:none;line-height:1;transition:opacity .15s,color .15s,border-color .15s}.desktop-download-cert:hover,.desktop-download-msix:hover{opacity:.85;color:var(--text-primary,#e2e4f0);border-color:rgba(124,92,252,.7)}.desktop-download-cert{border-style:dashed}@media (max-width:600px){.desktop-download-banner{top:8px;padding:5px 8px 5px 10px;font-size:11px;gap:7px}.desktop-download-label{display:none}.desktop-download-btn{padding:4px 10px;font-size:11px}.desktop-download-cert,.desktop-download-msix{display:none}}.welcome-subtitle{font-size:16px;line-height:2;color:var(--text-secondary);margin-top:20px;display:flex;flex-direction:column;gap:8px;animation:subtitleFade .6s ease-out .4s both}@keyframes subtitleFade{from{opacity:0}to{opacity:1}}.welcome-message{font-size:18px;color:var(--text-primary);font-weight:500}.welcome-fun{font-size:14px;color:var(--accent);font-weight:600;letter-spacing:1px;margin-top:8px}.welcome-content p{font-size:14px;line-height:1.6}.message-area{flex:1;display:flex;flex-direction:column;min-height:0;position:relative;background:#e8ecf0;border-radius:20px;margin:8px 12px 12px;border:1px solid rgba(255,255,255,.07);box-shadow:0 32px 80px rgba(0,0,0,.65),0 12px 32px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.03) inset;overflow:hidden}.messages{flex:1;overflow-y:auto;overflow-anchor:none;padding:14px 12px 8px;display:flex;flex-direction:column;gap:3px;position:relative;background:var(--bg-primary);scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.06) transparent}.messages::-webkit-scrollbar{width:3px}.messages::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:3px}.messages:hover::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15)}.message{display:flex;flex-direction:column;align-items:stretch;width:100%;margin-bottom:2px;padding:6px 12px;border-radius:8px;animation:msg-in .18s cubic-bezier(.34,1.56,.64,1);transition:background .15s ease,box-shadow .15s ease;box-shadow:0 2px 8px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04)}@keyframes msg-in{from{opacity:0;transform:translateY(4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.message:hover{background:rgba(255,255,255,.04);transition:background .15s ease}.message-row{display:flex;align-items:center;gap:8px;padding:0;width:100%;min-width:0}.message-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#fff;flex-shrink:0}.message-avatar-img{width:28px;height:28px;border-radius:50%;object-fit:cover;flex-shrink:0}.user-avatar-wrapper{position:relative;flex-shrink:0;width:26px;height:26px}.user-status-dot{position:absolute;bottom:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:var(--success);border:2px solid var(--bg-secondary);box-sizing:border-box}.user-status-dot.away{background:#faa61a;border-radius:2px 2px 50% 50%}.user-status-dot.dnd{background:var(--danger);border-radius:2px}.user-status-dot.invisible{background:0 0;border:2px solid var(--text-muted)}.user-item.offline .user-status-dot{background:0 0;border:2px solid var(--text-muted)}.user-item-avatar{width:31px;height:31px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#fff;flex-shrink:0}.user-item-avatar-img{width:31px;height:31px;border-radius:50%;object-fit:cover;flex-shrink:0}.avatar-settings{padding:4px 0;position:relative;z-index:1}.settings-section-subtitle{font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:10px;margin-top:16px;padding-bottom:6px;border-bottom:1px solid var(--border)}.avatar-upload-row{display:flex;align-items:center;gap:8px}.avatar-upload-preview{width:48px;height:48px;border-radius:50%;overflow:hidden;flex-shrink:0;border:2px solid var(--border);background:var(--bg-tertiary)}.avatar-upload-preview img{width:100%;height:100%;object-fit:cover;border-radius:50%}.avatar-shape-picker{display:flex;gap:8px;flex-wrap:wrap}.avatar-shape-btn{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary,#2a2a2e);border:2px solid var(--border);border-radius:6px;cursor:pointer;transition:border-color .2s,box-shadow .2s}.avatar-shape-btn:hover{border-color:var(--text-secondary)}.avatar-shape-btn.active{border-color:var(--accent);box-shadow:0 0 8px rgba(var(--accent-rgb,88,101,242),.4)}.shape-preview{width:20px;height:20px;background:var(--accent,#5865f2)}.shape-circle{border-radius:50%}.shape-rounded{border-radius:4px}.shape-squircle{border-radius:28%}.shape-hex{clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.shape-diamond{clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}.avatar-circle{border-radius:50%!important}.avatar-rounded{border-radius:6px!important}.avatar-squircle{border-radius:28%!important}.avatar-hex{clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);border-radius:0!important}.avatar-diamond{clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);border-radius:0!important}#avatar-size-slider{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:var(--bg-tertiary,#2a2a2e);outline:0}#avatar-size-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent,#5865f2);cursor:pointer;border:2px solid var(--bg-primary,#1e1e22)}#avatar-size-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent,#5865f2);cursor:pointer;border:2px solid var(--bg-primary,#1e1e22)}.custom-sound-item{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid var(--border);border:2px solid transparent;border-radius:6px;padding:8px;margin-bottom:4px;cursor:pointer;transition:all .15s}.custom-sound-item:last-child{border-bottom:none}.custom-sound-item.selected{background:var(--bg-hover);border-color:var(--accent)}.custom-sound-name{flex:1;font-size:13px;color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-sound-name-input{flex:1;font-size:12px;padding:2px 6px;border-radius:4px;border:1px solid var(--accent);background:var(--bg-input);color:var(--text-primary);outline:0}.btn-xs{padding:2px 8px;font-size:11px;border-radius:4px;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;transition:background .15s}.btn-xs:hover{background:var(--bg-tertiary)}.sound-modal-tabs{display:flex;gap:4px;margin-bottom:12px;border-bottom:1px solid var(--border);padding-bottom:8px}.sound-tab{padding:5px 12px;font-size:12px;border-radius:var(--radius-sm) var(--radius-sm) 0 0;border:1px solid var(--border);border-bottom:none;background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;transition:background .15s,color .15s}.sound-tab:hover{background:var(--bg-hover);color:var(--text-primary)}.sound-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.sound-tab-content{display:none}.sound-tab-content.active{display:block}.soundboard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px;max-height:280px;overflow-y:auto;padding:4px 0}.soundboard-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 6px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;min-height:60px;transition:background .15s,border-color .15s,transform .1s}.soundboard-btn:hover{background:var(--bg-hover);border-color:var(--accent)}.soundboard-btn:active{transform:scale(.96)}.soundboard-btn .sb-name{font-size:12px;font-weight:600;text-align:center;word-break:break-word}.soundboard-btn .sb-hotkey{font-size:9px;color:var(--text-muted);background:var(--bg-tertiary);padding:1px 6px;border-radius:3px;font-family:var(--font-mono)}.sb-hotkey-row{display:inline-flex;align-items:center;gap:4px}.sb-hotkey-clear{font-size:13px;line-height:1;color:var(--text-muted);cursor:pointer;padding:0 2px;border-radius:3px;transition:color .15s,background .15s}.sb-hotkey-clear:hover{color:var(--danger);background:rgba(240,71,71,.15)}.sb-hotkey-set{font-size:9px;color:var(--accent);cursor:pointer;opacity:.7;transition:opacity .15s}.sb-hotkey-set:hover{opacity:1;text-decoration:underline}.sound-search-row{display:flex;gap:8px;margin-bottom:8px}.sound-assign-list{display:flex;flex-direction:column;gap:4px}.sound-assign-select{min-width:140px}.hotkey-recording{animation:hotkey-pulse .6s ease infinite alternate}@keyframes hotkey-pulse{from{box-shadow:0 0 0 2px var(--accent-glow)}to{box-shadow:0 0 8px 4px var(--accent-glow)}}.message-body{flex:1;min-width:0;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.message-header{display:flex;align-items:center;gap:6px;margin-bottom:0;white-space:nowrap}.message-author-with-status{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;flex-shrink:0}.message-status-indicator{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;transition:background-color .2s ease}.message-status-indicator.status-online{background-color:#43b581;box-shadow:0 0 0 2px rgba(67,181,129,.3)}.room-float-modal .message-status-indicator.status-online{display:none}.message-status-indicator.status-offline{background-color:#747f8d;box-shadow:0 0 0 2px rgba(116,127,141,.3)}.message-status-indicator.status-away{background-color:#faa61a;box-shadow:0 0 0 2px rgba(250,166,26,.3)}.message-status-indicator.status-dnd{background-color:#f04747;box-shadow:0 0 0 2px rgba(240,71,71,.3)}.message-author{font-weight:700;font-size:13px;letter-spacing:.2px;flex-shrink:0}.message-author::after{content:':';margin-left:2px}.message-time{font-size:11px;color:var(--text-muted);display:none;flex-shrink:0}.message:hover .message-time{display:inline}.message-time.msg-ts-visible{display:inline}.system-msg-ts{font-style:normal;color:var(--text-muted);font-size:.85em;margin-right:2px}.message-content{font-size:13px;color:var(--text-primary);word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;text-shadow:var(--msg-text-shadow);-webkit-text-stroke:var(--msg-text-stroke);paint-order:stroke fill;unicode-bidi:plaintext}.chat-colored-text{display:inline;text-shadow:none;-webkit-text-stroke:0}.message-content a{color:var(--text-link)}.message-body .message-content{flex:1 1 auto;min-width:0}.message-compact .message-content{flex:1 0 auto}.inline-message-avatar{width:1.25em;height:1.25em;border-radius:50%;vertical-align:middle;margin-right:4px;object-fit:cover;flex-shrink:0}.inline-message-avatar.avatar-circle{border-radius:50%}.inline-message-avatar.avatar-rounded{border-radius:.25em}.inline-message-avatar.avatar-squircle{border-radius:12%}.inline-message-avatar.avatar-hex{clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);border-radius:0}.inline-message-avatar.avatar-diamond{clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);border-radius:0}.message-compact{display:flex;flex-direction:column;align-items:stretch;gap:2px;position:relative;padding:6px 12px;border-radius:6px;width:100%;margin-bottom:2px;transition:background .15s ease}.message-compact .message-body{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.message-compact:hover{background:rgba(255,255,255,.04);transition:background .15s ease}.message-compact .compact-time{position:static;font-size:10px;color:var(--text-muted);opacity:0;transition:opacity .2s ease;flex-shrink:0;white-space:nowrap}.message-compact:hover .compact-time{opacity:1}.message[data-user-id="0"]{display:flex;align-items:center;justify-content:flex-start}.message[data-user-id="0"] .message-avatar,.message[data-user-id="0"] .message-row>.msg-dots-btn,.message[data-user-id="0"] .message-row>.msg-toolbar,.message[data-user-id="0"] .reactions-row{display:none!important}.message[data-user-id="0"] .message-row{display:contents}.message[data-user-id="0"] .message-body{display:contents}.message[data-user-id="0"] .message-header{display:none}.message[data-user-id="0"] .message-content{text-align:left;width:100%;color:var(--text-muted)}.system-message{padding:4px 8px;font-size:12px;color:var(--text-muted);font-style:italic;text-align:left}.system-message.gift-message{display:flex;align-items:center;gap:10px;margin:6px 4px;padding:8px 14px 8px 8px;border-radius:16px;font-size:13px;font-weight:500;font-style:normal;text-align:left;color:var(--text-primary,#e2e4f0);background:linear-gradient(135deg,rgba(212,160,23,.22),rgba(124,92,252,.14));border:1px solid rgba(212,160,23,.45);box-shadow:0 2px 14px rgba(212,160,23,.16),inset 0 1px 0 rgba(255,255,255,.06);animation:gift-bubble-in .4s cubic-bezier(.34,1.56,.64,1)}.system-message.gift-message .gift-message-icon{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1;background:linear-gradient(135deg,#f6cf6b,#d4a017);box-shadow:0 1px 4px rgba(0,0,0,.3)}.system-message.gift-message .gift-message-text{flex:1 1 auto;min-width:0;line-height:1.5;word-break:break-word}.system-message.gift-message .system-msg-ts{color:inherit;opacity:.65;font-weight:400}@keyframes gift-bubble-in{0%{opacity:0;transform:translateY(6px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion:reduce){.system-message.gift-message{animation:none}}.typing-indicator{padding:0 20px;height:20px;font-size:12px;color:var(--text-muted);display:none;align-items:center;z-index:-1}.message-input-area{display:flex;align-items:flex-end;gap:8px;padding:8px 12px 14px;position:relative;flex-shrink:0;background:var(--bg-primary)}.message-input-pill{flex:1;display:flex;align-items:flex-end;background:var(--bg-input);border:1.5px solid rgba(255,255,255,.07);border-radius:16px;transition:border-color .15s,box-shadow .15s;overflow:hidden;min-height:42px;padding:0 4px 0 2px;gap:0}.message-input-pill:focus-within{border-color:var(--accent,#7c5cbf);box-shadow:0 0 0 3px rgba(124,92,191,.15)}.input-pill-btn{background:0 0;border:none;color:var(--text-muted,#888);width:34px;height:34px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .12s,background .12s;flex-shrink:0;padding:0;align-self:flex-end;margin-bottom:4px}.input-pill-btn:hover{color:var(--accent,#7c5cbf);background:rgba(124,92,191,.1)}.message-input-area textarea,.message-input-area #message-input{flex:1;background:0 0;border:none;outline:0;color:var(--text-primary,#e8e8f0);font-family:inherit;font-size:13.5px;line-height:1.45;padding:11px 4px;resize:none;min-height:42px;max-height:110px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.08) transparent}.message-input-area textarea:focus,.message-input-area #message-input:focus{border-color:var(--accent)}.message-input-area textarea::placeholder{color:var(--text-muted)}.btn-send{width:40px;height:40px;min-width:40px;background:var(--accent,#7c5cbf);border:none;border-radius:13px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .12s,box-shadow .15s;flex-shrink:0;box-shadow:0 3px 12px rgba(90,61,158,.45);padding:0;align-self:flex-end}.btn-send:hover{background:#9270d4;transform:scale(1.06);box-shadow:0 5px 16px rgba(90,61,158,.6)}.btn-send:active{transform:scale(.94);box-shadow:0 2px 8px rgba(90,61,158,.35)}.right-sidebar{width:var(--right-width);min-width:200px;max-width:400px;background:var(--bg-card);border-left:1px solid var(--border);border-radius:20px 0 0 20px;margin:8px 0 8px 8px;display:flex;flex-direction:column;overflow:hidden;position:relative;transition:width .3s cubic-bezier(.4, 0, .2, 1),min-width .3s cubic-bezier(.4, 0, .2, 1),border-width .3s cubic-bezier(.4, 0, .2, 1),opacity .3s cubic-bezier(.4, 0, .2, 1),transform .3s cubic-bezier(.4, 0, .2, 1);transform:translateX(0);box-shadow:-32px 0 80px rgba(0,0,0,.65),-12px 0 32px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.03) inset}.right-sidebar.collapsed{width:0!important;min-width:0!important;border-left-width:0;opacity:0;pointer-events:none;transform:translateX(100%);margin:8px 0 8px 0}.right-sidebar.voice-active{border-left-color:rgba(124,92,191,.4);box-shadow:-32px 0 80px rgba(0,0,0,.7),-12px 0 32px rgba(0,0,0,.5),0 0 0 2px var(--accent,#7c5cbf),0 0 0 1px rgba(255,255,255,.03) inset}.sidebar-collapse-btn{position:fixed;right:0;top:56px;width:20px;height:36px;display:flex;align-items:center;justify-content:center;font-size:11px;background:var(--bg-secondary);border:1px solid var(--border);border-right:none;border-radius:6px 0 0 6px;color:var(--text-muted);cursor:pointer;padding:0;z-index:100;transition:color .15s,background .15s}.sidebar-collapse-btn:hover{color:var(--text-primary);background:var(--bg-tertiary)}.sidebar-collapse-btn.left{position:fixed;left:240px;top:50%;transform:translateY(-50%);z-index:101;border-radius:0 6px 6px 0;font-size:12px;width:20px;height:36px;padding:0;background:var(--bg-secondary);color:var(--text-muted);display:flex;align-items:center;justify-content:center;transition:left .2s ease}@media (max-width:768px){.sidebar-collapse-btn.left{display:none!important}}.sidebar.collapsed{width:0!important;min-width:0!important;overflow:hidden;border-right:none;transition:width .2s ease,min-width .2s ease}.sidebar{transition:width .2s ease,min-width .2s ease}.sidebar.collapsed>*{visibility:hidden}@media (max-width:768px){.sidebar.collapsed{width:280px!important;min-width:280px!important;transform:translateX(-100%)}.sidebar.collapsed>*{visibility:visible}}.right-sidebar-users{flex:1 1 0;overflow-y:auto;min-height:0}.right-sidebar-resize-handle{position:absolute;top:0;left:-3px;width:6px;height:100%;cursor:col-resize;z-index:10;background:0 0;transition:opacity .15s;opacity:0}.right-sidebar-resize-handle.dragging,.right-sidebar-resize-handle:hover{background:var(--accent);opacity:.15}.panel{padding:16px;border-bottom:1px solid var(--border-light);background:linear-gradient(160deg,rgba(124,92,191,.08) 0,rgba(124,92,191,.02) 60%,transparent 100%);margin:8px 12px 0 12px;border-radius:16px}.panel-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:12px;background:linear-gradient(135deg,var(--accent,#7c5cbf) 0,#4f3090 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.user-list{display:flex;flex-direction:column;gap:4px}.muted-text{font-size:12px;color:var(--text-muted);font-style:italic}.user-item{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:12px;position:relative;transition:background .15s,transform .1s,box-shadow .15s;margin:1px 0}.user-item:hover{background:rgba(255,255,255,.08);transform:translateX(2px);box-shadow:0 4px 16px rgba(0,0,0,.3)}.user-item.new-user .user-item-name,.user-item.new-user .user-item-name-text{font-weight:600}.user-dot{width:9px;height:9px;border-radius:50%;background:var(--success);flex-shrink:0}.user-item-name{font-size:15px;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.user-role-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;border:1px solid rgba(0,0,0,.3)}.user-item-tooltip{display:none;position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius);padding:9px 13px;z-index:1000;white-space:nowrap;pointer-events:none;box-shadow:0 6px 20px rgba(0,0,0,.6);font-size:13px;color:var(--text-primary);max-width:242px;opacity:1}.user-item-tooltip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--border-light)}.user-item:hover .user-item-tooltip{display:block}.tooltip-username{font-weight:700;font-size:14px;margin-bottom:2px}.tooltip-role{font-size:12px;opacity:.8}.tooltip-status{font-size:12px;color:var(--text-muted);font-style:italic;margin-top:2px}.profile-popup{position:fixed;z-index:10000020;width:320px;background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius);box-shadow:0 8px 32px rgba(0,0,0,.7);overflow:hidden;animation:profile-popup-in .18s ease-out;opacity:1}.profile-popup-hover{background:color-mix(in srgb,var(--bg-secondary) 65%,transparent);border-color:color-mix(in srgb,var(--border-light) 50%,transparent);box-shadow:0 8px 32px rgba(0,0,0,.4);animation:profile-popup-hover-in .15s ease-out;transition:opacity .2s ease,transform .2s ease;pointer-events:none}.profile-popup-hover .profile-popup-banner{opacity:.7}.profile-popup-hover .profile-popup-close{display:none}.profile-popup-hover .profile-popup-body{background:0 0}.profile-popup-hover .profile-popup-actions{display:none}.profile-popup-fading{opacity:0!important;transform:translateY(4px)!important;pointer-events:none!important;transition:opacity .2s ease,transform .2s ease!important}@keyframes profile-popup-hover-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes profile-popup-in{from{opacity:0;transform:scale(.95) translateY(6px)}to{opacity:1;transform:scale(1) translateY(0)}}.profile-popup-banner{height:60px;position:relative;background:var(--bg-tertiary);cursor:grab}.profile-popup-close{position:absolute;top:6px;right:8px;background:0 0;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;line-height:1;padding:2px 6px;border-radius:4px}.profile-popup-close:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.profile-popup-avatar-wrapper{position:relative;width:72px;height:72px;margin:-36px 0 0 16px}.profile-popup-avatar{width:72px;height:72px;border-radius:50%;border:4px solid var(--bg-primary);object-fit:cover;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;color:#fff}.profile-popup-avatar.avatar-hexagon{border-radius:0;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.profile-popup-avatar.avatar-squircle{border-radius:22%}.profile-popup-avatar.avatar-diamond{border-radius:0;clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}.profile-popup-avatar.avatar-shield{border-radius:0;clip-path:polygon(50% 0%,100% 10%,100% 65%,50% 100%,0% 65%,0% 10%)}.profile-popup-avatar-fallback{background-color:var(--accent)}.profile-popup-status-dot{position:absolute;bottom:2px;right:2px;width:16px;height:16px;border-radius:50%;background:var(--success);border:3px solid var(--bg-primary)}.profile-popup-status-dot.away{background:var(--warning)}.profile-popup-status-dot.dnd{background:var(--danger)}.profile-popup-status-dot.invisible{background:var(--text-muted)}.profile-popup-body{padding:10px 16px 16px;background:var(--bg-secondary)}.profile-popup-names{display:flex;flex-direction:column;gap:1px;margin-bottom:6px}.profile-popup-displayname{font-size:18px;font-weight:700;color:var(--text-primary);line-height:1.2}.un-fx.electric-effect{color:#fff5a0!important;font-weight:700;animation:electric-flicker .12s steps(1) infinite}.un-fx.neon-effect{color:#ff2dce!important;font-weight:700;letter-spacing:.03em;animation:neon-glow 2.4s ease-in-out infinite}.un-fx.glitch-effect{color:#e0f7fa!important;font-weight:700;animation:glitch .65s steps(1) infinite;display:inline-block}.un-fx.rainbow-effect{background:linear-gradient(90deg,#ff4d6d 0,#ff9a3c 16%,#ffe033 30%,#4ade80 46%,#38bdf8 60%,#818cf8 74%,#c084fc 86%,#ff4d6d 100%);background-size:250% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:rb-slide 5s linear infinite;font-weight:700;letter-spacing:.02em;filter:saturate(1.4) brightness(1.15)}.un-fx.pulse-effect{color:#b8d8ff!important;animation:pulse 1.8s ease-in-out infinite;display:inline-block}.un-fx.wave-effect{color:#7dd3fc!important;animation:wave 1.6s cubic-bezier(.45,.05,.55,.95) infinite;display:inline-block}.un-fx.shake-effect{color:#fca5a5!important;animation:shake .4s ease-in-out infinite;display:inline-block}.un-fx.blink-effect{animation:blink 1.8s ease-in-out infinite}.un-fx.fade-effect{color:#c4b5fd!important;animation:fade 2.8s ease-in-out infinite}.un-fx.slide-effect{color:#86efac!important;animation:slide 1.8s ease-in-out infinite;display:inline-block}.un-fx.bounce-effect{color:#fde68a!important;animation:bounce .9s ease-in-out infinite;display:inline-block}.un-fx.spin-effect{color:#a5f3fc!important;animation:spin 1.8s ease-in-out infinite;display:inline-block}.un-fx.fire-effect{position:relative;background:linear-gradient(105deg,#1a0000 0,#cc1500 15%,#ff4500 28%,#ff7c00 42%,#ffb347 55%,#fff1c1 65%,#ffb347 73%,#ff6200 83%,#cc1500 93%,#1a0000 100%);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:fire-flow 4s ease-in-out infinite;font-weight:700;letter-spacing:.01em;filter:contrast(1.3) brightness(1.1)}.un-fx.fire-effect::before{content:attr(data-text);position:absolute;inset:0;z-index:-1;background:inherit;background-size:inherit;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:blur(14px) brightness(1.6) saturate(1.6);opacity:.65;pointer-events:none;animation:fire-flow 3.5s linear infinite}.un-fx.ice-effect{background:linear-gradient(90deg,#7ecfff 0,#cce8ff 22%,#fff 42%,#b0deff 55%,#7ecfff 70%,#cce8ff 84%,#fff 100%);background-size:300% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;letter-spacing:.02em;animation:ice-sweep 3.5s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(130, 210, 255, .75)) drop-shadow(0 0 16px rgba(80, 160, 255, .4))}.un-fx.gold-effect{background:linear-gradient(90deg,#b8860b 0,gold 20%,#fffacd 40%,gold 55%,#daa520 70%,#fffacd 82%,gold 100%);background-size:300% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;letter-spacing:.02em;animation:gold-sheen 3s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(255, 200, 0, .7)) drop-shadow(0 0 16px rgba(180, 130, 0, .4))}.un-fx.chrome-effect{background:linear-gradient(90deg,#4a4a4a 0,#9e9e9e 14%,#d0d0d0 26%,#fff 38%,#c8c8c8 50%,#888 62%,#d4d4d4 74%,#fff 86%,#9e9e9e 100%);background-size:300% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;letter-spacing:.03em;animation:chrome-sweep 4s linear infinite;filter:drop-shadow(0 0 4px rgba(180, 180, 200, .5)) drop-shadow(0 1px 2px rgba(0, 0, 0, .9))}.un-fx.matrix-effect{color:#00ff41!important;font-family:'Courier New',Consolas,monospace;font-weight:700;letter-spacing:.08em;animation:matrix-pulse .9s steps(1) infinite}.un-fx.vaporwave-effect{position:relative;background:linear-gradient(90deg,#f0f,#f6c,#c6f,#6cf,#0ff,#f0f);background-size:300% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:vaporwave-flow 6s linear infinite,vaporwave-glitch 2s ease-in-out infinite;text-shadow:2px 0 rgba(255,0,255,.6),-2px 0 rgba(0,255,255,.6),0 0 6px rgba(255,0,255,.4)}.un-fx.plasma-effect{background:linear-gradient(118deg,#ff9500,#ffb830,#ff6a00,#ff3d00,#fc0,#ff7c00,#ff9500);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:plasma-flow 5s ease-in-out infinite,flicker 7s ease-in-out infinite;filter:contrast(1.25) brightness(1.15) saturate(1.2);font-weight:700}.un-fx.firework-effect{color:gold!important;font-weight:700;animation:firework 1.2s ease-in-out infinite;display:inline-block}@keyframes electric-flicker{0%{color:#fff5a0!important;text-shadow:0 0 4px #fff,0 0 12px #fe0,0 0 24px #fa0,0 0 44px #f60;opacity:1}8%{color:#ffe080!important;text-shadow:0 0 2px #fff,0 0 6px #fe0,0 0 14px #fa0;opacity:.9}12%{color:#fff!important;text-shadow:0 0 8px #fff,0 0 20px #fe0,0 0 36px #fa0,0 0 56px #f40;opacity:1}20%{color:#cc0!important;text-shadow:0 0 2px #fe0;opacity:.6}24%{color:#fff5a0!important;text-shadow:0 0 6px #fff,0 0 16px #fe0,0 0 28px #fa0;opacity:1}70%{color:#fff5a0!important;text-shadow:0 0 4px #fff,0 0 10px #fe0,0 0 22px #fa0;opacity:1}72%{color:#880!important;text-shadow:none;opacity:.45}75%{color:#fff!important;text-shadow:0 0 10px #fff,0 0 22px #fe0,0 0 40px #f80;opacity:1}100%{color:#fff5a0!important;text-shadow:0 0 4px #fff,0 0 12px #fe0,0 0 24px #fa0,0 0 44px #f60;opacity:1}}@keyframes neon-glow{0%,100%{color:#ff2dce!important;text-shadow:0 0 3px #fff,0 0 8px #ff2dce,0 0 18px #ff2dce,0 0 38px #c0a,0 0 64px #806}45%{color:#ff6ee6!important;text-shadow:0 0 2px #fff,0 0 5px #ff6ee6,0 0 12px #ff2dce,0 0 26px #c0a}50%{color:#c09!important;text-shadow:0 0 1px #ff2dce,0 0 6px #c0a}55%{color:#ff6ee6!important;text-shadow:0 0 3px #fff,0 0 10px #ff2dce,0 0 22px #c0a,0 0 44px #806}80%{color:#ff2dce!important;text-shadow:0 0 4px #fff,0 0 14px #ff2dce,0 0 28px #c0a,0 0 50px #806,0 0 80px #504}}@keyframes glitch{0%{transform:translate(0);text-shadow:2px 0 #ff003c,-2px 0 #00f0ff;opacity:1}10%{transform:translate(-3px,1px);text-shadow:4px 0 #ff003c,-3px 0 #00f0ff;opacity:.9}20%{transform:translate(3px,-1px);text-shadow:-2px 0 #ff003c,2px 0 #00f0ff}30%{transform:translate(0);text-shadow:2px 0 #ff003c,-2px 0 #00f0ff}40%{transform:translate(2px,2px) skewX(3deg);text-shadow:-3px 0 #ff003c,3px 0 #00f0ff;opacity:.8}50%{transform:translate(-2px,-1px) skewX(-2deg);text-shadow:5px 0 #ff003c,-5px 0 #00f0ff}60%{transform:translate(0);text-shadow:2px 0 #ff003c,-2px 0 #00f0ff;opacity:1}72%{transform:translate(0);text-shadow:1px 0 #ff003c,-1px 0 #00f0ff}76%{transform:translate(5px,0) skewX(6deg);text-shadow:-6px 0 #ff003c,6px 0 #00f0ff;opacity:.55}80%{transform:translate(-3px,1px);text-shadow:3px 0 #ff003c,-3px 0 #00f0ff;opacity:1}100%{transform:translate(0);text-shadow:2px 0 #ff003c,-2px 0 #00f0ff}}@keyframes rb-slide{0%{background-position:100% 50%}100%{background-position:-150% 50%}}.rb-avatar{background:conic-gradient(from 0deg,#ff4d6d,#ff9a3c,#ffe033,#4ade80,#38bdf8,#818cf8,#c084fc,#ff4d6d);box-shadow:0 0 0 2px #0f0f11,0 0 12px rgba(192,132,252,.45),0 0 26px rgba(56,189,248,.2)}.rb-avatar::after{content:'RB';position:absolute;inset:3px;border-radius:50%;background:#1a1420;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#e2d9f3}.profile-popup::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#ff4d6d,#ff9a3c,#ffe033,#4ade80,#38bdf8,#818cf8,#c084fc,#ff4d6d);background-size:250% 100%;animation:rb-slide 5s linear infinite}@keyframes pulse{0%,100%{transform:scale(1);color:#b8d8ff!important;text-shadow:0 0 6px rgba(100,180,255,.35)}50%{transform:scale(1.1);color:#fff!important;text-shadow:0 0 8px #64b4ff,0 0 20px #39f,0 0 36px rgba(51,153,255,.45)}}@keyframes wave{0%,100%{transform:translateY(0);text-shadow:0 4px 10px rgba(56,182,255,.3)}25%{transform:translateY(-7px);text-shadow:0 10px 18px rgba(56,182,255,.55)}75%{transform:translateY(5px);text-shadow:0 2px 6px rgba(56,182,255,.2)}}@keyframes shake{0%,100%{transform:translateX(0) rotate(0)}15%{transform:translateX(-5px) rotate(-2deg)}30%{transform:translateX(5px) rotate(2deg)}45%{transform:translateX(-3px) rotate(-1deg)}60%{transform:translateX(3px) rotate(1deg)}75%{transform:translateX(-2px) rotate(-.5deg)}90%{transform:translateX(2px) rotate(.5deg)}}@keyframes blink{0%,42%{opacity:1}50%{opacity:.05}100%,58%{opacity:1}}@keyframes fade{0%,100%{opacity:1;color:#c4b5fd!important}50%{opacity:.12;color:#6d5fad!important}}@keyframes slide{0%,100%{transform:translateX(0)}25%{transform:translateX(-9px)}75%{transform:translateX(9px)}}@keyframes bounce{0%{transform:translateY(0);text-shadow:0 8px 12px rgba(250,210,80,.2)}28%{transform:translateY(-11px);text-shadow:0 18px 20px rgba(250,210,80,.35)}48%{transform:translateY(3px);text-shadow:0 4px 8px rgba(250,210,80,.1)}62%{transform:translateY(-6px);text-shadow:0 12px 16px rgba(250,210,80,.25)}78%{transform:translateY(1px);text-shadow:0 6px 10px rgba(250,210,80,.12)}100%{transform:translateY(0);text-shadow:0 8px 12px rgba(250,210,80,.2)}}@keyframes spin{0%,100%{transform:rotate(0)}25%{transform:rotate(13deg)}75%{transform:rotate(-13deg)}}@keyframes fire-flow{0%{background-position:0 50%}25%{background-position:55% 40%}50%{background-position:100% 50%}75%{background-position:55% 60%}100%{background-position:0 50%}}.fire-avatar{background:radial-gradient(circle at 38% 38%,#ff6a00,#1a0000);border:1.5px solid #ff4500;box-shadow:0 0 8px rgba(255,100,0,.55),0 0 20px rgba(255,60,0,.25)}@keyframes ice-sweep{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes gold-sheen{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes chrome-sweep{0%{background-position:0 50%}100%{background-position:200% 50%}}@keyframes matrix-pulse{0%{color:#00ff41!important;text-shadow:0 0 6px #00ff41,0 0 14px #0c3,0 0 28px rgba(0,255,65,.3);opacity:1}15%{color:#0c3!important;text-shadow:0 0 4px #0c3,0 0 10px #092;opacity:.88}25%{color:#00ff41!important;text-shadow:0 0 8px #00ff41,0 0 20px #0c3,0 0 36px rgba(0,255,65,.45);opacity:1}50%{color:#3f6!important;text-shadow:0 0 6px #3f6,0 0 18px #00ff41;opacity:.94}65%{color:#0a2!important;text-shadow:0 0 3px #0a2;opacity:.65}70%{color:#00ff41!important;text-shadow:0 0 10px #00ff41,0 0 24px #0c3,0 0 44px rgba(0,255,65,.5);opacity:1}100%{color:#00ff41!important;text-shadow:0 0 6px #00ff41,0 0 14px #0c3,0 0 28px rgba(0,255,65,.3);opacity:1}}@keyframes vaporwave-flow{0%{background-position:0 50%}100%{background-position:100% 50%}}@keyframes vaporwave-glitch{0%,100%{transform:skewX(0);text-shadow:2px 0 rgba(255,0,255,.6),-2px 0 rgba(0,255,255,.6),0 0 6px rgba(255,0,255,.4)}25%{transform:skewX(-2deg);text-shadow:3px 0 rgba(255,0,255,.7),-3px 0 rgba(0,255,255,.7)}50%{transform:skewX(1deg);text-shadow:1px 0 rgba(255,0,255,.5),-1px 0 rgba(0,255,255,.5),0 0 8px rgba(0,255,255,.4)}75%{transform:skewX(-1deg);text-shadow:4px 0 rgba(255,0,255,.8),-4px 0 rgba(0,255,255,.8)}}@keyframes plasma-flow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes flicker{0%,100%{opacity:1}45%{opacity:.92}50%{opacity:1}70%{opacity:.95}}@keyframes firework{0%,100%{transform:scale(1);color:gold!important;text-shadow:0 0 6px gold,0 0 14px #ff8c00,0 0 26px rgba(255,140,0,.4)}20%{transform:scale(1.12);color:#fff5cc!important;text-shadow:0 0 10px #fff5cc,0 0 22px gold,0 0 40px #ff8c00,0 0 60px rgba(255,100,0,.35)}45%{transform:scale(.96);color:#ff8c00!important;text-shadow:0 0 5px #ff8c00,0 0 12px rgba(255,80,0,.5)}65%{transform:scale(1.08);color:#fc4!important;text-shadow:0 0 8px #fc4,0 0 18px #ff8c00,0 0 34px rgba(255,120,0,.4)}85%{transform:scale(1);color:gold!important;text-shadow:0 0 6px gold,0 0 16px #ff8c00}}.profile-popup-nickname{font-size:14px;font-weight:600;color:var(--accent);line-height:1.2;margin-bottom:2px}.profile-popup-username{font-size:13px;color:var(--text-muted)}.profile-popup-status-text{font-size:13px;color:var(--text-secondary);font-style:italic;padding:4px 8px;background:var(--bg-secondary);border-radius:var(--radius-sm);margin-bottom:8px}.profile-popup-bio{font-size:13px;color:var(--text-secondary);line-height:1.4;margin-bottom:4px;word-break:break-word}.profile-bio-empty{color:var(--text-muted);font-style:italic;font-size:12px}.profile-bio-toggle{background:0 0;border:none;color:var(--accent);cursor:pointer;font-size:12px;padding:2px 0}.profile-bio-toggle:hover{text-decoration:underline}.profile-popup-divider{height:1px;background:var(--border);margin:8px 0}.profile-popup-section-label{display:none;font-size:11px;font-weight:700;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px;letter-spacing:.03em}.profile-popup-roles{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}.profile-popup-role{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;font-size:12px;border:1px solid;border-radius:12px;background:var(--bg-secondary)}.profile-role-dot{display:none}.profile-popup-join-date{font-size:12px;color:var(--text-secondary);margin-bottom:8px}.profile-popup-actions{margin-top:8px}.profile-popup-action-btn{width:100%;padding:8px 12px;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;font-weight:600;transition:background var(--transition),transform .1s}.profile-popup-action-btn:active{transform:scale(.98)}.profile-dm-btn{background:var(--accent);color:#fff}.profile-dm-btn:hover{background:var(--accent-hover)}.profile-edit-btn{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-light)!important}.profile-edit-btn:hover{background:var(--bg-hover)}.profile-nick-btn{background:var(--bg-tertiary);color:var(--text-secondary);margin-top:6px;border:1px solid var(--border-light)!important}.profile-nick-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.edit-profile-modal-box{width:380px;max-width:95vw}.edit-profile-label{display:block;font-size:12px;font-weight:600;text-transform:uppercase;color:var(--text-muted);margin:12px 0 6px;letter-spacing:.03em}.edit-profile-textarea{width:100%;min-height:80px;padding:8px 10px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:13px;font-family:var(--font-main);resize:vertical}.edit-profile-textarea:focus{outline:0;border-color:var(--accent)}.edit-profile-char-count{font-size:11px;color:var(--text-muted);text-align:right;margin-top:2px}.message-author{cursor:pointer}.message-author:hover{text-decoration:underline}.message-avatar,.message-avatar-img{cursor:pointer}.user-item{cursor:pointer}@keyframes toastIn{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{from{opacity:1}to{opacity:0;transform:translateY(-10px)}}.server-bar{width:56px;min-width:56px;background:var(--bg-secondary);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:4px;overflow-y:auto;overflow-x:hidden}.server-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;background:var(--bg-tertiary);position:relative;flex-shrink:0}.server-icon:hover{border-radius:12px;background:var(--accent)}.server-icon.home{border-radius:12px;background:var(--accent)}.server-icon.home.bounce{animation:serverBounce .4s ease}@keyframes serverBounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-6px)}60%{transform:translateY(-3px)}}.server-icon-text{font-size:18px;color:var(--text-primary);pointer-events:none;font-weight:700}.server-icon-img{width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none}.server-icon.add-server{background:0 0;border:2px dashed var(--border-light)}.server-icon.add-server:hover{border-color:var(--accent);background:0 0;border-radius:12px}.server-icon.add-server .server-icon-text{font-size:22px;color:var(--accent)}.server-status-dot{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px;border-radius:50%;border:2px solid var(--bg-secondary)}.server-status-dot.online{background:var(--success)}.server-status-dot.offline{background:var(--text-muted)}.server-status-dot.unknown{background:var(--warning)}.server-separator{width:24px;height:2px;background:var(--border);border-radius:1px;margin:4px 0;flex-shrink:0}.server-remove{position:absolute;top:-4px;right:-4px;width:16px;height:16px;border-radius:50%;background:var(--danger);color:#fff;font-size:12px;line-height:1;display:none;align-items:center;justify-content:center;cursor:pointer;border:1px solid var(--bg-secondary);padding:0}.server-icon.remote:hover .server-remove{display:flex}.server-icon.manage-servers{background:0 0;border:2px dashed var(--border-light);margin-top:2px}.server-icon.manage-servers:hover{border-color:var(--accent);background:0 0;border-radius:12px}.server-icon.manage-servers .server-icon-text{font-size:18px;color:var(--text-secondary);transition:color .15s}.server-icon.manage-servers:hover .server-icon-text{color:var(--accent)}.manage-servers-list{max-height:360px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;margin:12px 0}.manage-servers-list:empty::before{content:'No servers added yet. Click "+ Add Server" below.';color:var(--text-muted);text-align:center;padding:24px 0;font-size:13px}.manage-server-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--bg-tertiary);border-radius:var(--radius);border:1px solid var(--border);transition:background .15s}.manage-server-row:hover{background:var(--bg-hover)}.manage-server-icon{width:32px;height:32px;border-radius:50%;background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px;font-weight:700;color:var(--text-primary);overflow:hidden}.manage-server-icon img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.manage-server-info{flex:1;min-width:0}.manage-server-name{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.manage-server-url{font-size:11px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--font-mono)}.manage-server-status{font-size:11px;padding:2px 6px;border-radius:9px;flex-shrink:0}.manage-server-status.online{background:rgba(67,181,129,.15);color:var(--success)}.manage-server-status.offline{background:rgba(240,71,71,.12);color:var(--text-muted)}.manage-server-status.unknown{background:rgba(250,166,26,.12);color:var(--warning)}.manage-server-actions{display:flex;gap:4px;flex-shrink:0}.manage-server-actions button{background:0 0;border:none;font-size:14px;cursor:pointer;padding:4px 6px;border-radius:var(--radius-sm);color:var(--text-secondary);transition:background .15s,color .15s}.manage-server-actions button:hover{background:var(--bg-active);color:var(--text-primary)}.manage-server-actions button.danger-action:hover{background:#3a1515;color:var(--danger)}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:10200000}.modal-overlay[style*="display: none"],.modal-overlay[style*="display:none"]{content-visibility:hidden}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:32px;width:90%;max-width:600px;max-height:90vh;box-shadow:0 20px 60px rgba(0,0,0,.4),0 8px 32px rgba(0,0,0,.2),var(--modal-ring);resize:both;overflow:auto;min-width:320px;min-height:200px}.modal:has(#custom-emojis-list){max-width:800px}.modal[style*="max-width:380px"]{resize:none}.modal h3{font-size:20px;font-weight:700;color:var(--text-primary);margin-bottom:4px;font-family:var(--font-heading);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--border);margin-bottom:16px}.modal .modal-desc{font-size:13px;color:var(--text-secondary);margin-bottom:20px}.modal .form-group{margin-bottom:14px}.modal .form-textarea{width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:4px;background:var(--bg-primary);color:var(--text-primary);font-family:inherit;font-size:14px;resize:vertical;box-sizing:border-box}.modal .form-textarea:focus{outline:0;border-color:var(--accent)}.modal-divider{border:none;border-top:1px solid var(--border);margin:16px 0}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border)}.create-room-modal{max-width:460px;resize:none}.create-room-modal-header{display:flex;align-items:flex-start;gap:14px;padding-bottom:18px;border-bottom:1px solid var(--border);margin-bottom:20px}.create-room-modal-icon{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--accent),#8b5cf6);color:#fff;font-weight:800;font-size:20px;display:grid;place-items:center;box-shadow:0 10px 24px rgba(88,101,242,.26);flex-shrink:0}.create-room-modal-copy h3{border-bottom:none;padding-bottom:0;margin-bottom:6px}.create-room-modal-copy .modal-desc{margin-bottom:0}.create-room-modal-body{display:flex;flex-direction:column;gap:18px}.create-room-field-group{margin-bottom:0}.create-room-field-group label{display:block;margin-bottom:8px;font-size:.88rem;font-weight:700;color:var(--text-primary)}.create-room-input-wrap{position:relative}.create-room-input-wrap input{width:100%;box-sizing:border-box;padding:12px 14px 12px 36px;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:.95rem;transition:border-color var(--transition),box-shadow var(--transition)}.create-room-input-wrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(88,101,242,.12)}.create-room-input-prefix{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-weight:700}.create-room-options-grid{display:grid;gap:12px}.create-room-option-card{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-secondary);cursor:pointer;transition:transform var(--transition),border-color var(--transition),background var(--transition),box-shadow var(--transition)}.create-room-option-card:hover{transform:translateY(-1px);border-color:rgba(88,101,242,.34)}.create-room-option-card.selected{border-color:var(--accent);background:rgba(88,101,242,.08);box-shadow:0 8px 18px rgba(88,101,242,.12)}.create-room-option-visual{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:rgba(88,101,242,.12);flex-shrink:0;font-size:1rem}.create-room-option-copy{display:flex;flex-direction:column;gap:3px;flex:1}.create-room-option-copy strong{font-size:.95rem;color:var(--text-primary)}.create-room-option-copy small{font-size:.82rem;color:var(--text-muted)}.create-room-option-input{width:18px;height:18px;accent-color:var(--accent);flex-shrink:0}.create-room-duration-row{padding:14px;border-radius:var(--radius-md);border:1px solid var(--border);background:linear-gradient(180deg,rgba(88,101,242,.08),transparent)}.create-room-duration-row label{display:block;margin-bottom:8px;font-size:.88rem;font-weight:700;color:var(--text-primary)}.create-room-duration-input-row{align-items:center;gap:8px}.create-room-duration-input-row input{width:92px;padding:10px 12px;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.9rem}.create-room-duration-input-row input:focus{border-color:var(--accent)}.create-room-modal .modal-actions{margin-top:0;padding-top:18px}.create-room-modal .btn-sm:disabled{opacity:.5;cursor:not-allowed}.signout-modal{text-align:center}.signout-modal-icon{width:56px;height:56px;border-radius:50%;background:rgba(231,76,60,.12);border:1px solid rgba(231,76,60,.2);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--danger,#e74c3c)}.signout-modal .modal-actions{border-top:none;margin-top:20px;padding-top:0}.emoji-modal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;max-height:340px;overflow-y:auto;padding:8px 4px}.emoji-grid-item{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border-radius:8px;background:var(--bg-tertiary);border:1px solid var(--border);transition:background .15s,border-color .15s,transform .15s}.emoji-grid-item:hover{background:var(--bg-hover);border-color:var(--accent);transform:translateY(-2px)}.emoji-grid-item .custom-emoji-preview{width:48px;height:48px;object-fit:contain;border-radius:6px}.emoji-grid-item.size-s .custom-emoji-preview{width:1.4em;height:1.4em}.emoji-grid-item.size-m .custom-emoji-preview{width:1.6em;height:1.6em}.emoji-grid-item.size-l .custom-emoji-preview{width:1.8em;height:1.8em}.emoji-grid-name{font-size:10px;color:var(--text-secondary);text-align:center;word-break:break-all;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.emoji-grid-actions{display:flex;gap:4px;margin-top:4px}.upload-divider{display:flex;align-items:center;gap:12px;color:var(--text-muted);font-size:11px;margin:12px 0}.upload-divider::after,.upload-divider::before{content:'';flex:1;height:1px;background:var(--border)}.emoji-bulk-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px;border:2px dashed var(--border);border-radius:8px;background:0 0;color:var(--text-secondary);cursor:pointer;transition:all .2s;margin-bottom:4px}.emoji-bulk-btn:hover{border-color:var(--accent);background:var(--bg-hover);color:var(--text-primary)}.bulk-icon{font-size:16px}.bulk-hint{display:block;text-align:center;font-size:10px;color:var(--text-muted);margin-top:-4px}.emoji-search-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;margin-bottom:10px;border-radius:8px;background:var(--bg-tertiary);border:1px solid var(--border)}.emoji-search-bar:focus-within{border-color:var(--accent)}.search-icon{font-size:14px;opacity:.6}.emoji-search-input{flex:1;background:0 0;border:none;outline:0;font-size:13px;color:var(--text-primary)}.emoji-search-input::placeholder{color:var(--text-muted)}.emoji-search-clear{display:none;width:20px;height:20px;padding:0;font-size:10px;border:none;background:0 0;color:var(--text-muted);cursor:pointer;border-radius:50%}.emoji-search-clear:hover{background:var(--bg-hover);color:var(--text-primary)}.emoji-search-bar.has-input .emoji-search-clear{display:flex;align-items:center;justify-content:center}.emoji-modal-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:8px}.emoji-modal-header h3{display:flex;align-items:center;gap:8px}.emoji-size-tabs{display:inline-flex;gap:3px;font-size:11px;font-weight:600}.emoji-no-items{text-align:center;padding:32px 16px;color:var(--text-muted)}.emoji-no-items span{display:block;font-size:32px;margin-bottom:8px;opacity:.5}#custom-emojis-list{display:flex;flex-direction:column;gap:6px;max-height:320px;overflow-y:auto;padding:8px;border-radius:12px;background:var(--bg-secondary);border:1px solid var(--border);box-shadow:inset 0 2px 4px rgba(0,0,0,.05)}#custom-emojis-list::-webkit-scrollbar{width:6px}#custom-emojis-list::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:3px}#custom-emojis-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}#custom-emojis-list::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}#custom-emojis-list .custom-sound-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;background:var(--bg-tertiary);border:1px solid var(--border);transition:all .3s cubic-bezier(.4, 0, .2, 1);box-shadow:0 2px 8px rgba(0,0,0,.08);margin-bottom:8px}#custom-emojis-list .custom-sound-item:hover{background:var(--bg-hover);border-color:var(--accent);transform:translateY(-2px) translateX(2px);box-shadow:0 6px 16px rgba(0,0,0,.12)}#custom-emojis-list .custom-emoji-preview{width:48px;height:48px;object-fit:contain;border-radius:10px;flex-shrink:0;border:1px solid rgba(255,255,255,.1);box-shadow:0 1px 4px rgba(0,0,0,.1);transition:transform .2s ease,width .2s ease,height .2s ease}#custom-emojis-list .custom-emoji-preview.size-xxs{width:var(--emoji-size-xxs)!important;height:var(--emoji-size-xxs)!important}#custom-emojis-list .custom-emoji-preview.size-xs{width:var(--emoji-size-xs)!important;height:var(--emoji-size-xs)!important}#custom-emojis-list .custom-emoji-preview.size-s{width:var(--emoji-size-s)!important;height:var(--emoji-size-s)!important}#custom-emojis-list .custom-emoji-preview.size-m{width:var(--emoji-size-m)!important;height:var(--emoji-size-m)!important}#custom-emojis-list .custom-emoji-preview.size-l{width:var(--emoji-size-l)!important;height:var(--emoji-size-l)!important}#custom-emojis-list .custom-emoji-preview.size-xl{width:var(--emoji-size-xl)!important;height:var(--emoji-size-xl)!important}#custom-emojis-list .custom-emoji-preview.size-xxl{width:var(--emoji-size-xxl)!important;height:var(--emoji-size-xxl)!important}#custom-emojis-list .custom-emoji-preview{max-width:64px;max-height:64px}#custom-emojis-list .emoji-item-info{display:flex;flex-direction:column;flex:1;min-width:0;max-width:200px;gap:4px;margin-right:8px}#custom-emojis-list .custom-sound-name{font-size:14px;font-weight:600;color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}#custom-emojis-list .emoji-code-display{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-family:'Fira Code',monospace;color:var(--accent);font-weight:500;background:rgba(52,152,219,.1);padding:2px 6px;border-radius:4px;border:1px solid rgba(52,152,219,.2);background:rgba(var(--accent-rgb),.15);padding:2px 6px;border-radius:10px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:fit-content}#custom-emojis-list .emoji-code-display::before{content:'⌨️';font-size:9px;opacity:.7}#custom-emojis-list .emoji-code-display .muted{color:var(--text-muted);font-family:var(--font-main);font-size:10px;opacity:.7}#custom-emojis-list .emoji-code-display .muted::before{content:none}#custom-emojis-list .emoji-actions{display:flex;gap:2px;flex-shrink:0;align-items:center}#custom-emojis-list .emoji-item-controls{display:flex;align-items:center;gap:6px;flex-shrink:0;flex-wrap:wrap;min-width:200px;justify-content:flex-end;height:32px}#custom-emojis-list .inline-size-selector{display:inline-flex;align-items:center;gap:2px;background:var(--bg-secondary);padding:3px;border-radius:8px;border:1px solid var(--border);flex-shrink:0;height:28px;box-shadow:inset 0 1px 2px rgba(0,0,0,.1)}#custom-emojis-list .inline-size-selector .size-btn-xs{width:24px;height:22px;font-size:9px;padding:0;border-radius:4px;background:0 0;border:1px solid transparent;color:var(--text-muted);transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-weight:600}#custom-emojis-list .inline-size-selector .size-btn-xs:hover{color:var(--text-primary);background:var(--bg-hover);transform:translateY(-1px)}#custom-emojis-list .inline-size-selector .size-btn-xs.active{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.2)}#custom-emojis-list .emoji-delete-btn,#custom-emojis-list .emoji-edit-code-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;font-size:12px;border-radius:6px;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;transition:all .2s ease;box-shadow:0 1px 3px rgba(0,0,0,.1)}#custom-emojis-list .emoji-edit-code-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px);box-shadow:0 4px 6px rgba(0,0,0,.15)}#custom-emojis-list .emoji-delete-btn:hover{background:var(--danger);border-color:var(--danger);color:#fff;transform:translateY(-2px);box-shadow:0 4px 6px rgba(0,0,0,.15)}#custom-emojis-list .emoji-edit-code-btn:hover{opacity:1}#emoji-bulk-input{max-width:110px;font-size:11px;padding:6px 8px}.size-selector{display:inline-flex;gap:6px;align-items:center}.inline-size-selector .size-btn-xs{width:36px;height:36px;font-size:14px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:600;transition:all .2s ease;box-shadow:0 1px 3px rgba(0,0,0,.1)}.inline-size-selector .size-btn-xs:hover{background:var(--bg-hover);transform:translateY(-2px);box-shadow:0 4px 6px rgba(0,0,0,.15)}.inline-size-selector .size-btn-xs:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px);box-shadow:0 4px 6px rgba(0,0,0,.2)}.inline-size-selector .size-btn-xs.active{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px);box-shadow:0 4px 6px rgba(0,0,0,.2)}.inline-size-selector .size-btn-xs[data-size=xxs]{width:32px;height:32px}.inline-size-selector .size-btn-xs[data-size=xs]{width:34px;height:34px}.inline-size-selector .size-btn-xs[data-size="s"]{width:36px;height:36px}.inline-size-selector .size-btn-xs[data-size="m"]{width:40px;height:40px}.inline-size-selector .size-btn-xs[data-size="l"]{width:46px;height:46px}.inline-size-selector .size-btn-xs[data-size=xl]{width:50px;height:50px}.inline-size-selector .size-btn-xs[data-size=xxl]{width:54px;height:54px}.emoji-upload-section{margin-bottom:16px}.emoji-upload-section .bulk-upload-container{margin-top:10px;text-align:center}.emoji-upload-section .bulk-upload-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border:2px dashed var(--border);border-radius:10px;background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500}.emoji-upload-section .bulk-upload-btn:hover{border-color:var(--accent);background:rgba(var(--accent-rgb),.05);color:var(--text-primary);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.1)}.emoji-upload-section .bulk-upload-btn input[type=file]{display:none}.emoji-upload-section .bulk-upload-label{cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:2px dashed var(--border);border-radius:8px;background:var(--bg-tertiary);transition:all .2s}.emoji-upload-section .bulk-upload-label:hover{border-color:var(--accent);background:var(--bg-primary)}#emoji-crop-preview-row{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:16px;background:var(--bg-tertiary);border-radius:12px;border:1px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.08)}#emoji-crop-preview-row #emoji-crop-thumb{width:48px;height:48px;border-radius:10px;object-fit:cover;border:2px solid var(--border);box-shadow:0 1px 4px rgba(0,0,0,.1)}#emoji-crop-preview-row .settings-hint{flex:1;font-size:13px;color:var(--text-secondary)}#emoji-crop-preview-row #emoji-recrop-btn{padding:8px 14px;border-radius:8px;background:var(--accent);color:#fff;border:1px solid var(--accent);cursor:pointer;transition:all .2s ease;font-size:13px;font-weight:500}#emoji-crop-preview-row #emoji-recrop-btn:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 6px rgba(0,0,0,.15)}.emoji-cat-dropdown{position:relative;display:inline-block}.emoji-cat-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;transition:all .25s cubic-bezier(.4, 0, .2, 1);box-shadow:0 2px 4px rgba(0,0,0,.08);font-size:14px;position:relative;user-select:none}.emoji-cat-btn:focus,.emoji-cat-btn:hover{background:var(--bg-hover);border-color:var(--accent);color:var(--text-primary);transform:translateY(-2px) scale(1.05);box-shadow:0 4px 12px rgba(0,0,0,.15);outline:0}.emoji-cat-btn:active{transform:translateY(-1px) scale(1.02);box-shadow:0 2px 6px rgba(0,0,0,.12)}.emoji-cat-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.emoji-cat-dropdown.open .emoji-cat-btn{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px) scale(1.05);box-shadow:0 4px 12px rgba(0,0,0,.2)}.emoji-cat-menu{position:absolute;top:100%;right:0;min-width:140px;background:var(--bg-card);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.18),0 6px 12px rgba(0,0,0,.12);z-index:999999;margin-top:6px;padding:6px 0;opacity:0;visibility:hidden;transform:translateY(-12px) scale(.92);transition:all .3s cubic-bezier(.34, 1.56, .64, 1)}.emoji-cat-menu::before{content:'';position:absolute;top:-8px;right:16px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid var(--border)}.emoji-cat-menu::after{content:'';position:absolute;top:-7px;right:16px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid var(--bg-card)}.emoji-cat-dropdown.open .emoji-cat-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.emoji-cat-dropdown.open .emoji-cat-menu .cat-option{animation:slideInFromTop .3s ease-out forwards}@keyframes slideInFromTop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.cat-option{display:block;width:100%;padding:10px 16px;background:0 0;border:none;color:var(--text-primary);text-align:left;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease;position:relative;border-radius:6px;margin:2px 6px;user-select:none}.cat-option:focus,.cat-option:hover{background:var(--bg-hover);color:var(--accent);transform:translateX(2px);outline:0}.cat-option:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.cat-option.active{background:var(--accent);color:#fff;font-weight:600;box-shadow:0 2px 8px rgba(var(--accent-rgb),.3)}.cat-option.active::before{content:'✓';position:absolute;left:12px;color:#fff;font-weight:700;font-size:12px}.profile-modal{padding:24px;max-width:420px}.profile-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.profile-modal-header h3{font-size:22px;font-weight:700;color:var(--text-primary);font-family:var(--font-heading);margin:0}.profile-section{margin-bottom:20px}.profile-avatar-section{display:flex;flex-direction:column;align-items:center;text-align:center}.profile-avatar-row{display:flex;align-items:center;gap:16px;width:100%}.profile-avatar-preview{width:80px;height:80px;flex-shrink:0;border-radius:50%;overflow:hidden;border:3px solid var(--accent);box-shadow:0 4px 16px rgba(0,0,0,.3);background:var(--bg-tertiary);transition:transform .2s ease}.profile-avatar-preview:hover{transform:scale(1.05)}.profile-avatar-preview img{width:100%;height:100%;object-fit:cover}.profile-avatar-buttons{display:flex;gap:8px;flex:1}.profile-avatar-buttons .btn{flex:1;justify-content:center}.profile-avatar-hint{font-size:12px;color:var(--text-muted);margin-top:8px}.profile-shape-section{margin-top:16px;width:100%}.profile-shape-label{display:block;font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.profile-shape-picker{display:flex;justify-content:center;gap:10px}.profile-shape-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border:2px solid var(--border);border-radius:10px;cursor:pointer;transition:all .2s ease}.profile-shape-btn:hover{border-color:var(--text-secondary);transform:translateY(-2px)}.profile-shape-btn.active{border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow);background:var(--bg-active)}.profile-shape-btn .shape-preview{width:22px;height:22px;background:var(--accent)}.profile-divider{height:1px;background:var(--border);margin:20px 0}.profile-label{display:block;font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:6px}.profile-hint{font-size:12px;color:var(--text-muted);margin-bottom:10px}.profile-input{width:100%;padding:12px 14px;font-size:14px;font-family:var(--font-main);background:var(--bg-input);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);transition:border-color .2s,box-shadow .2s}.profile-input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.profile-input::placeholder{color:var(--text-muted)}.profile-label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.profile-char-count{font-size:12px;color:var(--text-muted);font-family:var(--font-mono)}.profile-textarea{width:100%;padding:12px 14px;font-size:14px;font-family:var(--font-main);background:var(--bg-input);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);resize:vertical;min-height:80px;transition:border-color .2s,box-shadow .2s}.profile-textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.profile-textarea::placeholder{color:var(--text-muted)}.profile-modal-footer{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}.profile-status{font-size:12px;color:var(--text-muted)}.profile-modal-actions{display:flex;gap:10px}.profile-modal .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;font-size:14px;font-weight:600;font-family:var(--font-main);border-radius:8px;cursor:pointer;transition:all .2s ease;border:none}.profile-modal .btn-primary{background:var(--accent);color:#fff}.profile-modal .btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px)}.profile-modal .btn-ghost{background:0 0;color:var(--text-secondary);border:1px solid var(--border)}.profile-modal .btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.profile-modal .btn-accent{background:var(--accent);color:#fff}.profile-modal .btn-accent:hover{background:var(--accent-hover)}.profile-modal .btn-sm{padding:8px 14px;font-size:13px}.profile-modal .btn-icon-before::before{content:'↑';margin-right:6px;font-size:14px}.modal-wizard{max-width:560px;padding:0;overflow:hidden}.wizard-header{text-align:center;padding:32px 28px 20px;border-bottom:1px solid var(--border-light)}.wizard-hex{font-size:2.5rem;display:block;margin-bottom:8px;filter:drop-shadow(0 0 12px var(--accent-glow, rgba(124, 92, 252, .3)))}.wizard-header h2{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.wizard-subtitle{font-size:13px;color:var(--text-secondary)}.wizard-steps{padding:24px 28px;min-height:280px}.wizard-step-indicators{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:24px}.wizard-indicator{width:32px;height:32px;border-radius:50%;background:var(--bg-hover,#2c2f4a);border:2px solid var(--border-light);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--text-secondary);transition:all .2s ease}.wizard-indicator.active{background:var(--accent,#7c5cfc);border-color:var(--accent,#7c5cfc);color:#fff;box-shadow:0 0 12px var(--accent-glow,rgba(124,92,252,.4))}.wizard-indicator.done{background:var(--green,#43b581);border-color:var(--green,#43b581);color:#fff}.wizard-indicator-line{width:32px;height:2px;background:var(--border-light);margin:0 4px}.wizard-step h3{font-size:18px;font-weight:700;color:var(--text-primary);margin-bottom:8px}.wizard-step>p{font-size:13px;color:var(--text-secondary);margin-bottom:16px;line-height:1.6}.wizard-checklist{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.wizard-check{font-size:13px;color:var(--text-primary);padding:8px 12px;background:var(--bg-hover,rgba(255,255,255,.03));border-radius:8px;border:1px solid var(--border-light)}.wizard-info-box{background:var(--bg-hover,rgba(255,255,255,.03));border:1px solid var(--border-light);border-radius:8px;padding:14px;margin-bottom:12px}.wizard-info-box strong{display:block;font-size:12px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.wizard-input{width:100%;padding:10px 12px;background:var(--bg-input,#15172a);border:1px solid var(--border-light);border-radius:6px;color:var(--text-primary);font-size:14px;font-family:inherit;outline:0;transition:border-color .15s ease}.wizard-input:focus{border-color:var(--accent,#7c5cfc);box-shadow:0 0 0 2px var(--accent-glow,rgba(124,92,252,.2))}.wizard-hint{display:block;font-size:12px;color:var(--text-dim,#5d6180);margin-top:6px;line-height:1.5}.wizard-code-display{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--bg-input,#15172a);border:1px solid var(--border-light);border-radius:6px;margin-top:8px;margin-bottom:4px}.wizard-code-display span{font-size:12px;color:var(--text-secondary)}.wizard-code-display code{font-size:16px;font-weight:700;color:var(--accent,#7c5cfc);letter-spacing:.1em;flex:1}.wizard-btn-small{background:var(--bg-hover,#2c2f4a);border:1px solid var(--border-light);border-radius:4px;color:var(--text-primary);font-size:11px;padding:4px 10px;cursor:pointer;transition:all .15s ease}.wizard-btn-small:hover{background:var(--accent,#7c5cfc);color:#fff}.wizard-steps-list{margin:8px 0 0 20px;font-size:13px;color:var(--text-primary);line-height:1.8}.wizard-steps-list code{background:var(--bg-input,#15172a);padding:2px 6px;border-radius:3px;font-size:12px}.wizard-footer{display:flex;align-items:center;padding:16px 28px;border-top:1px solid var(--border-light);gap:8px}.wizard-btn-primary{background:var(--accent,#7c5cfc);color:#fff;border:none;border-radius:6px;padding:10px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s ease;font-family:inherit}.wizard-btn-primary:hover{filter:brightness(1.15);transform:translateY(-1px)}.wizard-btn-secondary{background:var(--bg-hover,#2c2f4a);color:var(--text-primary);border:1px solid var(--border-light);border-radius:6px;padding:10px 20px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s ease;font-family:inherit}.wizard-btn-secondary:hover{background:var(--bg-active,#333660)}.wizard-btn-text{background:0 0;border:none;color:var(--text-dim,#5d6180);font-size:13px;cursor:pointer;padding:8px 12px;transition:color .15s ease;font-family:inherit}.wizard-btn-text:hover{color:var(--text-primary)}.wizard-spinner{width:20px;height:20px;border:2px solid var(--border-light);border-top-color:var(--accent,#7c5cfc);border-radius:50%;animation:wizard-spin .7s linear infinite;display:inline-block;vertical-align:middle;margin-right:8px}@keyframes wizard-spin{to{transform:rotate(360deg)}}.wizard-port-success{padding:12px;background:rgba(67,181,129,.1);border:1px solid rgba(67,181,129,.3);border-radius:8px;color:var(--text-primary);font-size:13px;line-height:1.6}.wizard-port-fail{padding:12px;background:rgba(240,71,71,.08);border:1px solid rgba(240,71,71,.25);border-radius:8px;color:var(--text-primary);font-size:13px;line-height:1.6}.wizard-port-fail ol{margin:8px 0 0 20px;line-height:1.8}.wizard-port-fail code{background:var(--bg-input,#15172a);padding:2px 6px;border-radius:3px;font-size:12px}.chat-image{max-width:180px;max-height:180px;border-radius:var(--radius);margin-top:4px;cursor:pointer;transition:opacity .15s ease;display:block;object-fit:cover}.chat-image:hover{opacity:.85}.e2e-img-loading,.e2e-img-pending{width:180px;height:120px;background:var(--bg-tertiary,rgba(255,255,255,.05));border:1px dashed var(--text-muted);display:flex;align-items:center;justify-content:center}.e2e-img-loading{animation:e2eImgPulse 1.2s ease-in-out infinite}@keyframes e2eImgPulse{0%,100%{opacity:.5}50%{opacity:1}}.e2e-img-failed{opacity:.4;border-color:var(--danger,#e74c3c)}.image-mode-full .chat-image{max-width:min(400px,70%);max-height:300px;object-fit:contain}.image-lightbox{position:fixed;inset:0;z-index:10200100;background:rgba(0,0,0,.88);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;animation:lightbox-fade-in .15s ease;overflow:hidden}.lightbox-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:rgba(0,0,0,.55);flex-shrink:0;z-index:1;gap:8px}.lightbox-zoom-controls{display:flex;align-items:center;gap:4px}.lightbox-ctrl-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:7px;color:rgba(255,255,255,.85);cursor:pointer;transition:background .14s,color .14s,border-color .14s;flex-shrink:0;padding:0}.lightbox-ctrl-btn:hover{background:rgba(255,255,255,.18);color:#fff;border-color:rgba(255,255,255,.28)}.lightbox-ctrl-btn:active{background:rgba(255,255,255,.26)}.lightbox-close-btn{background:rgba(220,60,60,.15);border-color:rgba(220,60,60,.3);color:rgba(255,120,120,.9)}.lightbox-close-btn:hover{background:rgba(220,60,60,.35);border-color:rgba(220,60,60,.55);color:#f88}.lightbox-zoom-level{font-size:12px;font-weight:600;color:rgba(255,255,255,.75);min-width:40px;text-align:center;user-select:none;letter-spacing:.02em}.lightbox-canvas{flex:1;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:grab;min-height:0}.lightbox-canvas.is-dragging{cursor:grabbing}.lightbox-canvas.zoom-fit{cursor:default}.lightbox-img{display:block;max-width:100%;max-height:100%;border-radius:4px;box-shadow:0 16px 64px rgba(0,0,0,.7);object-fit:contain;transform-origin:center center;transition:transform 80ms ease;user-select:none;-webkit-user-drag:none}.lightbox-canvas.is-dragging .lightbox-img{transition:none}@keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}.img-preview-overlay{position:fixed;inset:0;z-index:10200200;background:rgba(0,0,0,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;animation:lightbox-fade-in .15s ease}.img-preview-overlay-inner{position:relative;max-width:min(90vw,800px);max-height:80vh;border-radius:10px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.7)}.img-preview-overlay-inner img{display:block;max-width:100%;max-height:80vh;object-fit:contain}.img-preview-overlay-close{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.65);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}.img-preview-overlay-close:hover{background:rgba(200,50,50,.7)}.image-context-menu{position:fixed;z-index:10200101;background:var(--bg-secondary,#23263a);border:1px solid var(--border,rgba(255,255,255,.12));border-radius:8px;padding:4px 0;min-width:160px;box-shadow:0 8px 32px rgba(0,0,0,.4);animation:lightbox-fade-in .1s ease}.image-context-menu button{display:block;width:100%;padding:8px 14px;background:0 0;border:none;color:var(--text-primary,#e2e4f0);font-size:13px;text-align:left;cursor:pointer;transition:background .12s}.image-context-menu button:hover{background:var(--bg-hover,rgba(124,92,252,.15))}.user-context-menu{position:fixed;z-index:10000020;background:var(--bg-secondary,#23263a);border:1px solid var(--border,rgba(255,255,255,.12));border-radius:8px;padding:4px 0;min-width:200px;overflow:visible;box-shadow:0 8px 32px rgba(0,0,0,.4);animation:lightbox-fade-in .1s ease}.user-ctx-header{padding:8px 14px 6px;font-size:12px;font-weight:700;color:var(--text-primary);border-bottom:1px solid var(--border,rgba(255,255,255,.08));margin-bottom:2px}.user-context-menu>button,.user-ctx-submenu-trigger{display:block;width:100%;padding:7px 14px;background:0 0;border:none;color:var(--text-primary,#e2e4f0);font-size:13px;text-align:left;cursor:pointer;transition:background .12s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-context-menu>button:hover,.user-ctx-submenu-trigger:hover{background:var(--bg-hover,rgba(124,92,252,.15))}.user-ctx-arrow{float:right;opacity:.5;font-size:11px}.user-ctx-submenu-wrapper{position:relative}.user-ctx-submenu{display:none;position:absolute;left:100%;top:0;min-width:180px;max-height:280px;overflow-y:auto;background:var(--bg-secondary,#23263a);border:1px solid var(--border,rgba(255,255,255,.12));border-radius:8px;padding:4px 0;box-shadow:0 8px 32px rgba(0,0,0,.4);z-index:10002}.user-ctx-submenu-wrapper.open .user-ctx-submenu,.user-ctx-submenu-wrapper:hover .user-ctx-submenu{display:block}.user-ctx-submenu button{display:block;width:100%;padding:6px 14px;background:0 0;border:none;color:var(--text-primary,#e2e4f0);font-size:13px;text-align:left;cursor:pointer;transition:background .12s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-ctx-submenu button:hover{background:var(--bg-hover,rgba(124,92,252,.15))}.input-actions-box{display:flex;align-items:center;gap:2px;padding:3px 6px;border:1px solid var(--border,rgba(255,255,255,.1));border-radius:8px;background:var(--bg-tertiary,rgba(255,255,255,.03));flex-shrink:0;position:relative;z-index:1001}.input-actions-divider{width:1px;height:20px;background:var(--border,rgba(255,255,255,.12));flex-shrink:0;margin:0 1px}.upload-icon-clippy{display:none}.btn-upload{width:34px;height:34px;background:0 0;color:var(--text-muted);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;transition:all var(--transition);flex-shrink:0}.btn-upload:hover{color:var(--text-primary);background:var(--bg-tertiary)}.message-input-pill .btn-upload{align-self:center}.message-area.drag-over{outline:2px dashed var(--accent);outline-offset:-4px;background:rgba(124,92,252,.04)}.dm-float-body.drag-over,.room-float-body.drag-over{outline:2px dashed var(--accent);outline-offset:-4px;background:rgba(124,92,252,.04);border-radius:6px}.volume-slider{width:100%;height:14px;margin-top:4px;-webkit-appearance:none;appearance:none;background:0 0;border-radius:2px;outline:0;cursor:pointer}.volume-slider::-webkit-slider-runnable-track{background:rgba(255,255,255,.3);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.15)}.volume-slider::-moz-range-track{background:rgba(255,255,255,.3);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.15)}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--accent);cursor:pointer;margin-top:-4px}.volume-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--accent);cursor:pointer;border:none}.notif-settings{display:flex;flex-direction:column;gap:10px}.select-row,.toggle-row,.volume-row{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--text-secondary);gap:8px}.toggle-row input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px;cursor:pointer}.slider-sm{width:80px;height:14px;-webkit-appearance:none;appearance:none;background:0 0;border-radius:2px;outline:0;cursor:pointer}.slider-sm::-webkit-slider-runnable-track{background:rgba(255,255,255,.25);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.12)}.slider-sm::-moz-range-track{background:rgba(255,255,255,.25);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.12)}.slider-sm::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--accent);cursor:pointer;margin-top:-4px;box-shadow:0 0 4px var(--accent-glow,rgba(124,92,252,.3))}.slider-sm::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--accent);cursor:pointer;border:none;box-shadow:0 0 4px var(--accent-glow,rgba(124,92,252,.3))}.select-row select{background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:3px 6px;font-size:11px;font-family:inherit;cursor:pointer;outline:0}.select-row select:focus{border-color:var(--accent)}.btn-emoji{width:34px;height:34px;background:0 0;color:var(--text-muted);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;transition:all var(--transition);flex-shrink:0;font-size:18px;align-self:center}.btn-emoji:hover{color:var(--text-primary);background:var(--bg-tertiary)}.emoji-picker{position:absolute;bottom:100%;left:0;margin-bottom:8px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:12px;padding:8px;display:flex;flex-direction:column;width:calc((100vw - var(--sidebar-width))/ 1.4);max-height:360px;box-shadow:0 8px 32px rgba(0,0,0,.4);z-index:1000}.emoji-header-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}.emoji-search-row{flex:1 1 0;min-width:0}.emoji-search-row .emoji-search-input{width:100%;box-sizing:border-box}.emoji-recent-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex-shrink:0}.emoji-btn-inline{width:22px;height:22px;font-size:14px;padding:0;margin:0;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.emoji-btn-inline:hover{background:var(--bg-tertiary);transform:scale(1.15)}.emoji-clear-btn{background:0 0;border:none;color:var(--text-muted);cursor:pointer;padding:1px 2px;border-radius:var(--radius-sm);font-size:12px;opacity:.7;transition:all .15s;flex-shrink:0;margin-left:4px}.emoji-clear-btn:hover{background:var(--bg-hover);opacity:1;color:var(--text-primary)}.emoji-btn-inline:hover{background:var(--bg-tertiary);transform:scale(1.15)}.emoji-clear-btn{background:0 0;border:none;color:var(--text-muted);cursor:pointer;padding:2px;border-radius:var(--radius-sm);font-size:12px;opacity:.7;transition:all .15s}.emoji-clear-btn:hover{background:var(--bg-hover);opacity:1;color:var(--text-primary)}.emoji-search-input{width:100%;padding:6px 10px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);font-size:13px;outline:0}.emoji-search-input:focus{border-color:var(--accent)}.emoji-tab-row{display:flex;gap:2px;padding:0 2px 6px;border-bottom:1px solid var(--border);margin-bottom:6px}.emoji-tab{flex:1;padding:4px 0;font-size:16px;text-align:center;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;opacity:.5;transition:opacity var(--transition),background var(--transition)}.emoji-tab:hover{opacity:.8;background:var(--bg-tertiary)}.emoji-tab.active{opacity:1;background:var(--bg-tertiary)}.emoji-tab-icon{width:24px;height:24px;object-fit:contain;vertical-align:middle;margin-top:-3px}.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;overflow-y:scroll;max-height:240px;padding:2px}.emoji-grid .custom-emoji{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important}.emoji-item{width:auto;height:44px;display:flex;align-items:center;justify-content:center;font-size:22px;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;transition:background var(--transition),transform .1s ease}.emoji-item:hover{background:var(--bg-tertiary);transform:scale(1.2)}.custom-emoji{width:var(--emoji-size-default)!important;height:var(--emoji-size-default)!important;min-width:var(--emoji-size-default)!important;min-height:var(--emoji-size-default)!important;vertical-align:middle;object-fit:contain;display:inline-block!important;flex-shrink:0;margin:0 1px}.custom-emoji-preview.size-xxs,.custom-emoji.size-xxs{width:var(--emoji-size-xxs)!important;height:var(--emoji-size-xxs)!important;min-width:var(--emoji-size-xxs)!important;min-height:var(--emoji-size-xxs)!important}.custom-emoji-preview.size-xs,.custom-emoji.size-xs{width:var(--emoji-size-xs)!important;height:var(--emoji-size-xs)!important;min-width:var(--emoji-size-xs)!important;min-height:var(--emoji-size-xs)!important}.custom-emoji-preview.size-s,.custom-emoji.size-s{width:var(--emoji-size-s)!important;height:var(--emoji-size-s)!important;min-width:var(--emoji-size-s)!important;min-height:var(--emoji-size-s)!important}.custom-emoji-preview.size-m,.custom-emoji.size-m{width:var(--emoji-size-m)!important;height:var(--emoji-size-m)!important;min-width:var(--emoji-size-m)!important;min-height:var(--emoji-size-m)!important}.custom-emoji-preview.size-l,.custom-emoji.size-l{width:var(--emoji-size-l)!important;height:var(--emoji-size-l)!important;min-width:var(--emoji-size-l)!important;min-height:var(--emoji-size-l)!important}.custom-emoji-preview.size-xl,.custom-emoji.size-xl{width:var(--emoji-size-xl)!important;height:var(--emoji-size-xl)!important;min-width:var(--emoji-size-xl)!important;min-height:var(--emoji-size-xl)!important}.custom-emoji-preview.size-xxl,.custom-emoji.size-xxl{width:var(--emoji-size-xxl)!important;height:var(--emoji-size-xxl)!important;min-width:var(--emoji-size-xxl)!important;min-height:var(--emoji-size-xxl)!important}.emoji-only-msg{font-size:2em;line-height:1.25}.reaction-custom-emoji{width:1em;height:1em}.emoji-item .custom-emoji-wrapper{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.emoji-item .custom-emoji{width:100%;height:100%;object-fit:contain;display:block}.emoji-item .custom-emoji.size-xs{width:var(--emoji-size-xs)!important;height:var(--emoji-size-xs)!important;min-width:var(--emoji-size-xs)!important;min-height:var(--emoji-size-xs)!important}.emoji-item .custom-emoji.size-m{width:var(--emoji-size-m)!important;height:var(--emoji-size-m)!important;min-width:var(--emoji-size-m)!important;min-height:var(--emoji-size-m)!important}.emoji-item .custom-emoji.size-l{width:var(--emoji-size-l)!important;height:var(--emoji-size-l)!important;min-width:var(--emoji-size-l)!important;min-height:var(--emoji-size-l)!important}.custom-emoji.size-l{width:var(--emoji-size-l)!important;height:var(--emoji-size-l)!important;min-width:var(--emoji-size-l)!important;min-height:var(--emoji-size-l)!important}.custom-emoji.size-xxs{width:var(--emoji-size-xxs)!important;height:var(--emoji-size-xxs)!important;min-width:var(--emoji-size-xxs)!important;min-height:var(--emoji-size-xxs)!important}.custom-emoji.size-xl{width:var(--emoji-size-xl)!important;height:var(--emoji-size-xl)!important;min-width:var(--emoji-size-xl)!important;min-height:var(--emoji-size-xl)!important}.reaction-picker{position:absolute;top:-44px;right:8px;display:flex;gap:2px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:10px;padding:4px 6px;box-shadow:0 4px 20px rgba(0,0,0,.35);z-index:100}.reaction-pick-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:18px;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;transition:background .15s,transform .1s}.reaction-pick-btn:hover{background:var(--bg-tertiary);transform:scale(1.15)}.reaction-more-btn{font-size:16px;font-weight:700;color:var(--text-muted);letter-spacing:1px}.reaction-pick-sep{color:var(--text-muted);font-size:16px;opacity:.4;user-select:none;display:flex;align-items:center;padding:0 1px}.reaction-gear-btn{font-size:14px;color:var(--text-muted);opacity:.6;transition:opacity .15s}.reaction-gear-btn:hover{opacity:1}.quick-emoji-slots{display:flex;gap:4px;padding:4px 8px;border-bottom:1px solid var(--border);margin-bottom:4px}.quick-emoji-slot{border:2px solid transparent;border-radius:var(--radius-sm)}.quick-emoji-slot.active{border-color:var(--accent);background:var(--accent-glow)}.reaction-full-picker{position:absolute;bottom:100%;right:8px;width:320px;max-height:340px;display:flex;flex-direction:column;background:var(--bg-card);border:1px solid var(--border-light);border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.45);z-index:101;margin-bottom:4px;overflow:hidden}.reaction-full-search{padding:8px 10px 4px;flex-shrink:0}.reaction-full-search-input{width:100%;padding:6px 10px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:13px;outline:0}.reaction-full-search-input:focus{border-color:var(--accent)}.reaction-full-grid{flex:1;overflow-y:auto;padding:4px 10px 8px}.reaction-full-category{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;padding:6px 0 2px}.reaction-full-row{display:flex;flex-wrap:wrap;gap:2px}.reaction-full-btn{width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:20px;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;transition:background .12s,transform .1s}.reaction-full-btn:hover{background:var(--bg-tertiary);transform:scale(1.15)}.message,.message-compact{position:relative}.msg-toolbar{position:static;display:none;gap:4px;background:0 0;border:none;border-radius:0;padding:0;box-shadow:none;z-index:10;margin-left:auto;flex-shrink:0;order:10}@media (hover:hover) and (pointer:fine){.message-compact:hover .msg-toolbar,.message:hover .msg-toolbar{display:flex}}.message-compact.editing .msg-toolbar,.message.editing .msg-toolbar{display:none!important}.msg-toolbar button{width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:12px;border-radius:4px;cursor:pointer;background:0 0;border:none;transition:background .15s ease,color .15s ease;opacity:.6;flex-shrink:0;padding:0}.msg-toolbar button:hover{background:rgba(255,255,255,.1);opacity:1}.msg-toolbar button:nth-child(2){display:none!important}.messages>:first-child .msg-toolbar{top:auto;bottom:2px}.messages>:first-child .reaction-picker,.reaction-picker.flip-below{top:auto;bottom:-44px}.messages>:first-child .reaction-full-picker,.reaction-full-picker.flip-below{bottom:auto;top:100%;margin-bottom:0;margin-top:4px}.reply-banner{display:flex;align-items:center;gap:8px;padding:4px 0 4px 40px;font-size:11px;color:var(--text-muted);cursor:pointer;overflow:hidden;width:100%;margin-bottom:4px;position:relative}.reply-banner:hover{text-decoration:underline}.reply-line{width:2px;height:14px;border-radius:1px;flex-shrink:0}.reply-author{font-weight:600;flex-shrink:0}.reply-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-bar{display:flex;align-items:center;gap:8px;padding:6px 20px;background:var(--bg-tertiary);border-top:2px solid var(--accent);font-size:13px;color:var(--text-secondary)}.reply-bar-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-bar-close{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;background:0 0;border:none;color:var(--text-muted);font-size:16px;flex-shrink:0;transition:all var(--transition)}.reply-bar-close:hover{color:var(--text-primary);background:var(--bg-secondary)}.image-queue-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-tertiary);border-top:1px solid var(--border);overflow-x:auto;flex-wrap:nowrap}.upload-progress-bar{display:flex;align-items:center;gap:10px;padding:6px 14px;background:var(--bg-tertiary);border-top:1px solid var(--border)}.upload-progress-track{flex:1;height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden}.upload-progress-fill{height:100%;width:0%;background:var(--accent);border-radius:3px;transition:width .15s ease}.upload-progress-text{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.image-queue-thumb{position:relative;width:64px;height:64px;border-radius:6px;overflow:hidden;border:2px solid var(--border);flex-shrink:0;background:var(--bg-secondary);transition:border-color .15s}.image-queue-thumb:hover{border-color:var(--accent)}.image-queue-thumb img{width:100%;height:100%;object-fit:cover;display:block}.image-queue-remove{position:absolute;top:2px;right:2px;width:18px;height:18px;background:rgba(0,0,0,.7);color:#fff;border:none;border-radius:50%;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}.image-queue-thumb:hover .image-queue-remove{opacity:1}.image-queue-remove:hover{background:var(--danger)}.image-queue-clear-all{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-muted);border-radius:4px;padding:4px 10px;font-size:11px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:all .15s}.image-queue-clear-all:hover{color:var(--danger);border-color:var(--danger)}.mention{background:rgba(124,92,252,.15);color:var(--accent);padding:0 3px;border-radius:4px;font-weight:600;cursor:default}.mention.mention-self{background:rgba(124,92,252,.3)}.mention-dropdown{position:absolute;bottom:100%;left:48px;margin-bottom:4px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:8px;overflow:hidden;min-width:180px;max-width:260px;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:1001}.mention-item{padding:8px 14px;font-size:13px;color:var(--text-primary);cursor:pointer;transition:background var(--transition)}.mention-item.active,.mention-item:hover{background:var(--accent);color:#fff}.emoji-dropdown{position:absolute;bottom:100%;left:0;margin-bottom:4px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:8px;overflow-y:auto;max-height:320px;min-width:260px;max-width:380px;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:1000;padding:4px 0}.emoji-ac-item{display:flex;align-items:center;gap:10px;padding:7px 14px;cursor:pointer;transition:background var(--transition)}.emoji-ac-item.active,.emoji-ac-item:hover{background:var(--accent);color:#fff}.emoji-ac-preview{flex-shrink:0;width:22px;text-align:center}.emoji-ac-preview-char{font-size:1.25rem}.emoji-ac-preview-emoticon{font-family:'Share Tech Mono','Courier New',monospace;font-size:.88rem;font-weight:600;letter-spacing:.02em;min-width:44px;display:inline-block;color:var(--accent)}.emoji-ac-name{font-size:.92rem;opacity:.85}.room-float-emoji-ac{position:absolute;bottom:calc(100% + 6px);left:0;right:0;background:var(--bg-card);border:1px solid var(--border-light);border-radius:10px;overflow:hidden;box-shadow:0 -2px 20px rgba(0,0,0,.28),0 4px 12px rgba(0,0,0,.14);animation:rfEmojiAcIn .12s ease}@keyframes rfEmojiAcIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.room-float-emoji-ac-header{padding:7px 12px 5px;font-size:.7rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--border-light);user-select:none}.room-float-emoji-ac-list{overflow-y:auto;max-height:210px;padding:3px 0}.slash-dropdown{position:absolute;bottom:100%;left:48px;margin-bottom:4px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:8px;overflow-y:auto;max-height:320px;min-width:280px;max-width:400px;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:1002}.slash-item{display:flex;align-items:baseline;gap:8px;padding:8px 14px;font-size:13px;color:var(--text-primary);cursor:pointer;transition:background var(--transition);border-bottom:1px solid var(--border-light)}.slash-item:last-child{border-bottom:none}.slash-item.active,.slash-item:hover{background:var(--accent);color:#fff}.slash-cmd{font-weight:700;color:var(--accent);min-width:82px;flex-shrink:0}.slash-item.active .slash-cmd,.slash-item:hover .slash-cmd{color:#fff}.slash-args{font-size:11px;color:var(--text-muted);font-style:italic;flex-shrink:0}.slash-item.active .slash-args,.slash-item:hover .slash-args{color:rgba(255,255,255,.7)}.slash-desc{font-size:11px;color:var(--text-muted);margin-left:auto;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slash-item.active .slash-desc,.slash-item:hover .slash-desc{color:rgba(255,255,255,.7)}.search-container{display:flex;align-items:center;gap:4px;background:var(--bg-primary);border:1px solid var(--border-light);border-radius:6px;padding:2px 6px;margin-right:8px}.search-input{background:0 0;border:none;color:var(--text-primary);font-size:13px;width:160px;outline:0;padding:4px 2px}.search-input::placeholder{color:var(--text-muted)}.search-results-panel{position:absolute;top:0;right:0;width:340px;max-height:100%;background:var(--bg-card);border-left:1px solid var(--border-light);z-index:100;display:flex;flex-direction:column;overflow:hidden;box-shadow:-4px 0 12px rgba(0,0,0,.2)}.search-results-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid var(--border-light);font-size:13px;font-weight:600;color:var(--text-primary)}.search-results-list{overflow-y:auto;flex:1}.search-result-item{padding:10px 14px;border-bottom:1px solid var(--border-light);cursor:pointer;transition:background var(--transition)}.search-result-item:hover{background:var(--bg-hover)}.search-result-author{font-weight:600;font-size:12px;margin-right:6px}.search-result-time{font-size:10px;color:var(--text-muted)}.search-result-content{font-size:13px;color:var(--text-secondary);margin-top:4px;word-break:break-word;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.search-result-content mark{background:rgba(250,166,26,.35);color:inherit;padding:0 2px;border-radius:2px}@keyframes highlightFlash{0%,100%{background:0 0}30%{background:rgba(250,166,26,.25)}}.highlight-flash{animation:highlightFlash 2s ease}.edited-tag{font-size:9px;color:var(--text-muted);margin-left:4px;font-style:italic;cursor:default;user-select:none;flex-shrink:0}.e2e-tag{font-size:10px;opacity:.4;cursor:default;user-select:none;flex-shrink:0;margin-left:4px}.message-header .e2e-tag{margin-left:4px}.message-compact>.e2e-tag{position:absolute;right:8px;top:50%;transform:translateY(-50%)}.message-header-spacer{display:none}#e2e-recovery-banner{background:var(--bg-tertiary);border-bottom:2px solid var(--accent);padding:8px 16px;z-index:50;flex-shrink:0}.e2e-recovery-inner{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-secondary);flex-wrap:wrap}#e2e-recovery-pw{padding:4px 8px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);font-size:13px;width:180px}#e2e-recovery-dismiss{background:0 0;border:none;color:var(--text-muted);cursor:pointer;font-size:14px;padding:2px 6px}#e2e-recovery-dismiss:hover{color:var(--text-primary)}.e2e-reset-modal{max-width:460px;text-align:center}.e2e-reset-modal h3{color:var(--danger,#f44);margin-bottom:12px}.e2e-reset-warning{background:rgba(255,68,68,.08);border:1px solid rgba(255,68,68,.25);border-radius:var(--radius-md);padding:16px;margin:12px 0;font-size:13px;color:var(--text-secondary);text-align:left;line-height:1.6}.e2e-reset-warning strong{color:var(--danger,#f44)}.e2e-reset-warning ul{margin:8px 0 0 16px;padding:0}.e2e-reset-warning ul li{margin-bottom:4px}.e2e-confirm-type{margin:16px 0 12px}.e2e-confirm-type input{padding:6px 10px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);font-size:13px;width:100%;max-width:260px;text-align:center}.e2e-reset-actions{display:flex;gap:8px;justify-content:center;margin-top:16px}.btn-danger{background:var(--danger,#f44);color:#fff;border:none;padding:6px 18px;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;transition:opacity .15s}.btn-danger:hover{filter:brightness(1.15)}#e2e-reset-confirm-btn{opacity:.4;pointer-events:none}#e2e-reset-confirm-btn.enabled{opacity:1;pointer-events:auto}#e2e-reset-confirm-btn.enabled:hover{filter:brightness(1.15)}.e2e-menu-wrapper{position:relative}.e2e-dropdown{position:absolute;top:100%;right:0;z-index:1000;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:0 8px 24px rgba(0,0,0,.4);min-width:210px;padding:6px 0;margin-top:4px}.e2e-dropdown-item{display:block;width:100%;padding:8px 14px;border:none;background:0 0;color:var(--text-primary);font-size:13px;cursor:pointer;text-align:left;transition:background .12s}.e2e-dropdown-item:hover{background:rgba(255,255,255,.06)}.e2e-dropdown-item.e2e-danger{color:var(--danger,#f44)}.e2e-dropdown-item.e2e-danger:hover{background:rgba(255,68,68,.1)}.e2e-password-modal{max-width:380px;text-align:center}.e2e-password-modal h3{margin-bottom:8px}.e2e-pw-desc{font-size:13px;color:var(--text-muted);margin-bottom:16px;line-height:1.5}.e2e-pw-field{margin-bottom:12px}.e2e-pw-field input{width:100%;padding:10px 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);font-size:14px;text-align:center;letter-spacing:2px}.e2e-pw-field input:focus{border-color:var(--accent);outline:0}.e2e-pw-error{color:var(--danger,#f44);font-size:12px;margin-bottom:10px;padding:6px 10px;background:rgba(255,68,68,.08);border-radius:var(--radius-sm)}.e2e-pw-actions{display:flex;gap:8px;justify-content:center;margin-top:8px}.e2e-pw-actions .btn-accent:disabled{opacity:.4;pointer-events:none}.system-message.e2e-notice{color:var(--text-muted);font-style:italic;font-size:12px;padding:4px 16px;opacity:.7;text-align:center}.system-message.system-presence{display:flex;justify-content:center;padding:5px 8px;font-style:normal;text-align:center}.system-message.system-presence .system-presence-pill{display:inline-flex;align-items:baseline;gap:7px;max-width:92%;padding:4px 13px;border-radius:999px;background:rgba(250,166,26,.1);border:1px solid rgba(250,166,26,.26);color:var(--text-muted);font-size:12px;line-height:1.5}.system-message.system-presence .system-presence-ico{align-self:center;flex:0 0 auto;font-size:11px;line-height:1;opacity:.9}.system-message.system-presence .system-presence-body{min-width:0;word-break:break-word}.system-message.system-presence .system-msg-ts{opacity:.6;font-weight:400}.edit-textarea{width:100%;padding:6px 10px;background:var(--bg-input);border:1px solid var(--accent);border-radius:var(--radius-sm);color:var(--text-primary);font-size:14px;font-family:inherit;resize:none;max-height:120px;line-height:1.4;outline:0}.edit-actions{display:flex;gap:6px;margin-top:4px}.edit-cancel-btn,.edit-save-btn{padding:3px 10px;border-radius:var(--radius-sm);font-size:11px;font-weight:600;cursor:pointer;border:none;transition:all var(--transition)}.edit-save-btn{background:var(--accent);color:#fff}.edit-save-btn:hover{background:var(--accent-hover)}.edit-cancel-btn{background:var(--bg-tertiary);color:var(--text-secondary)}.edit-cancel-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.spoiler{background:var(--text-muted);color:transparent;border-radius:3px;padding:0 4px;cursor:pointer;transition:all .2s ease;user-select:none}.spoiler.revealed{background:var(--bg-tertiary);color:var(--text-primary);user-select:auto}.action-text{color:var(--text-secondary);font-style:italic}.inline-code{background:var(--bg-tertiary);color:var(--accent);padding:1px 5px;border-radius:3px;font-family:var(--font-mono);font-size:.9em}.admin-settings{display:flex;flex-direction:column;gap:10px}.admin-save-bar{display:flex;flex-direction:column;align-items:center;padding:16px 24px 20px;position:sticky;bottom:0;background:var(--bg-card);border-top:1px solid var(--border);z-index:10;margin-top:10px}.btn-admin-save{width:100%;padding:10px 20px;font-size:14px;font-weight:700;border:none;border-radius:var(--radius-sm);cursor:pointer;letter-spacing:.3px;transition:background .15s,transform .1s;background:var(--accent);color:#fff}.btn-admin-save:hover{filter:brightness(1.15)}.btn-admin-save:active{transform:scale(.97)}.btn-full{width:100%;text-align:center}.btn-danger-fill{background:var(--danger)!important;color:#fff!important}.btn-danger-fill:hover{background:#d93636!important}.notif-divider{height:1px;background:var(--border);margin:4px 0}.user-admin-actions{display:none;gap:2px;margin-left:auto;flex-shrink:0}.user-item:hover .user-admin-actions{display:flex}.user-action-btn{width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:12px;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;transition:background var(--transition);padding:0}.user-action-btn:hover{background:var(--bg-tertiary)}.user-gear-menu{position:fixed;z-index:10200020;min-width:160px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 6px 24px rgba(0,0,0,.5);padding:4px;display:flex;flex-direction:column;animation:gear-menu-in .12s ease-out}@keyframes gear-menu-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.gear-menu-item{display:flex;align-items:center;gap:8px;padding:7px 10px;font-size:13px;color:var(--text-secondary);background:0 0;border:none;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;transition:background .1s,color .1s;width:100%;text-align:left}.gear-menu-item:hover{background:var(--bg-hover);color:var(--text-primary)}.gear-menu-danger{color:var(--danger)}.gear-menu-danger:hover{background:rgba(233,69,96,.12);color:var(--danger)}.gear-menu-divider{height:1px;background:var(--border);margin:4px 2px}.transfer-admin-modal{max-width:420px;width:90vw}.transfer-admin-warning{display:flex;align-items:flex-start;gap:12px;padding:14px;background:rgba(233,69,96,.08);border:1px solid rgba(233,69,96,.2);border-radius:var(--radius);margin-bottom:16px}.transfer-admin-warning-icon{font-size:24px;flex-shrink:0;line-height:1}.transfer-admin-warning-text{font-size:13px;color:var(--text-secondary);line-height:1.5}.transfer-admin-warning-text strong{color:var(--text-primary)}.transfer-admin-note{font-size:12px;color:var(--danger);font-weight:600;margin-bottom:16px;text-transform:uppercase;letter-spacing:.5px}.transfer-admin-error{color:var(--danger);font-size:12px;display:none;margin-top:8px;padding:6px 10px;background:rgba(233,69,96,.08);border-radius:var(--radius-sm)}.elu-modal{max-width:300px;width:88vw;padding:0;overflow:hidden}.elu-header{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border)}.elu-header-badge{width:26px;height:26px;border-radius:8px;background:var(--accent-glow,rgba(124,92,252,.18));display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}.elu-header h4{margin:0;flex:1;font-size:14px;font-weight:700;color:var(--text-primary);font-family:var(--font-heading)}.elu-close{width:22px;height:22px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;background:var(--bg-tertiary);border:none;color:var(--text-secondary);border-radius:6px;cursor:pointer;transition:all .2s ease}.elu-close:hover{background:var(--bg-active);color:var(--text-primary)}.elu-body{padding:12px 14px}.elu-body .form-group.floating{margin-bottom:10px}.elu-note{display:flex;align-items:flex-start;gap:6px;font-size:10.5px;color:var(--text-secondary);line-height:1.4;margin:0 0 12px;padding:7px 9px;background:rgba(233,69,96,.07);border:1px solid rgba(233,69,96,.16);border-radius:8px}.elu-note-icon{flex-shrink:0;line-height:1.4}.elu-error{color:var(--danger);font-size:11px;display:none;margin-top:2px;padding:5px 8px;background:rgba(233,69,96,.08);border-radius:var(--radius-sm)}.elu-footer{display:flex;justify-content:flex-end;gap:8px;padding:10px 14px;border-top:1px solid var(--border);background:var(--bg-secondary)}.elu-modal .form-group.floating input{height:44px;padding:13px 36px 4px 34px;font-size:13px}.elu-modal .form-group.floating label{left:34px;font-size:12.5px;max-width:calc(100% - 56px)}.elu-modal .form-group.floating input:not([type=hidden]):focus~label,.elu-modal .form-group.floating input:not([type=hidden]):not(:placeholder-shown)~label{top:8px;font-size:10px}.elu-modal .form-group.floating .input-icon{left:11px;width:14px;height:14px}.elu-modal .form-group.floating .input-icon svg{width:14px;height:14px}.elu-modal .form-group.floating .password-toggle{right:6px;width:24px;height:24px;padding:3px}.elu-modal .form-group.floating .password-toggle svg{width:14px;height:14px}.elu-modal .form-group.floating .input-hint{margin-left:34px;font-size:10px;margin-top:3px}.elu-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s ease;border:1px solid transparent;font-family:inherit}.elu-btn-cancel{background:var(--bg-tertiary);color:var(--text-secondary);border-color:var(--border)}.elu-btn-cancel:hover{background:var(--bg-active);color:var(--text-primary)}.elu-btn-confirm{background:var(--danger);color:#fff;box-shadow:0 2px 8px rgba(233,69,96,.3)}.elu-btn-confirm:hover:not(:disabled){filter:brightness(1.08);box-shadow:0 4px 14px rgba(233,69,96,.4);transform:translateY(-1px)}.elu-btn-confirm:active:not(:disabled){transform:translateY(0)}.elu-btn-confirm:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.elu-btn-spinner{width:11px;height:11px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:elu-spin .6s linear infinite;display:none;flex-shrink:0}.elu-btn-confirm.elu-loading .elu-btn-spinner{display:inline-block}@keyframes elu-spin{to{transform:rotate(360deg)}}.user-item.offline{opacity:.5}.user-dot.away{background:var(--text-muted);border-radius:2px 2px 50% 50%}.modal-wide{max-width:820px;width:95vw;z-index:100002}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;position:sticky;top:0;background:var(--bg-card);z-index:10;border-bottom:1px solid var(--border)}.settings-header h3{font-size:16px;font-weight:700;color:var(--text-primary);font-family:var(--font-heading);margin:0;display:flex;align-items:center;gap:8px}.settings-close-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:16px;background:var(--bg-tertiary);border:none;color:var(--text-secondary);border-radius:8px;cursor:pointer;transition:all .2s ease}.settings-close-btn:hover{background:var(--bg-active);color:var(--text-primary);transform:scale(1.05)}.settings-layout{display:flex;min-height:0;flex:1;overflow:hidden}.settings-nav{width:176px;min-width:176px;padding:10px 6px;overflow-y:auto;border-right:1px solid var(--border);flex-shrink:0;background:var(--bg-secondary)}.settings-nav-group{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);padding:12px 10px 6px;user-select:none}.settings-nav-item{padding:7px 10px;font-size:12.5px;color:var(--text-secondary);border-radius:7px;cursor:pointer;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all .2s ease;display:flex;align-items:center;gap:8px}.settings-nav-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.settings-nav-item.active{background:linear-gradient(135deg,var(--accent) 0,var(--accent-dim) 100%);color:#fff;font-weight:600;box-shadow:0 4px 12px var(--accent-glow)}.settings-body{flex:1;overflow-y:auto;padding:16px 20px;min-width:0;background:var(--bg-card)}.modal-settings{max-width:680px;max-height:86vh;display:flex;flex-direction:column;overflow:hidden;padding:0;border-radius:10px}.settings-section{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border-light)}.settings-section:last-child{border-bottom:none}.settings-section-title{font-size:14px;font-weight:700;color:var(--text-primary);font-family:var(--font-heading);margin-bottom:8px;display:flex;align-items:center;gap:8px}.settings-section-subtitle{font-size:13px;font-weight:600;color:var(--text-primary);font-family:var(--font-heading);margin-bottom:8px;margin-top:12px;display:flex;align-items:center;gap:6px}.settings-desc{font-size:12.5px;color:var(--text-secondary);margin-bottom:12px;line-height:1.5}.settings-hint{font-size:12px;color:var(--text-muted);display:block;margin-top:4px}.app-update-card{display:flex;align-items:center;gap:12px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;padding:12px 14px;transition:border-color .15s ease}.app-update-card:hover{border-color:var(--accent)}.app-update-card-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--accent);color:#fff;flex-shrink:0}.app-update-card-body{flex:1;min-width:0}.app-update-card-title{font-size:14px;font-weight:600;color:var(--text-primary);display:block;margin-bottom:3px}.app-update-card-desc{font-size:12px;color:var(--text-muted);margin:0;line-height:1.5}.app-update-status-msg{margin-top:6px!important}.app-update-btn{display:flex;align-items:center;gap:7px;white-space:nowrap;flex-shrink:0;font-size:13px;font-weight:500;padding:9px 16px;border-radius:8px;cursor:pointer;border:none;transition:background .15s ease,opacity .15s ease}.app-update-btn:active{opacity:.85}.app-version-row{margin-top:12px;padding-top:10px;border-top:1px solid var(--border-light,var(--border))}.app-version-row .settings-hint{opacity:.55}@media (max-width:480px){.app-update-card{flex-wrap:wrap}.app-update-btn{width:100%;justify-content:center}}.settings-number-input,.settings-select,.settings-text-input{padding:10px 14px;font-size:14px;font-family:var(--font-main);background:var(--bg-input);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);transition:all .2s ease;min-width:120px}.settings-number-input:focus,.settings-select:focus,.settings-text-input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.select-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}.select-row span{font-size:14px;color:var(--text-primary);font-weight:500}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;cursor:pointer;border-bottom:1px solid var(--border-light)}.toggle-row:last-child{border-bottom:none}.toggle-row span{font-size:14px;color:var(--text-primary)}.toggle-row input[type=checkbox]{width:44px;height:24px;appearance:none;background:var(--bg-tertiary);border-radius:12px;position:relative;cursor:pointer;transition:all .2s ease;border:1px solid var(--border)}.toggle-row input[type=checkbox]::before{content:'';position:absolute;width:18px;height:18px;border-radius:50%;background:var(--text-secondary);top:2px;left:2px;transition:all .2s ease}.toggle-row input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.toggle-row input[type=checkbox]:checked::before{transform:translateX(20px);background:#fff}.volume-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0}.volume-row span{font-size:14px;color:var(--text-primary);min-width:80px}.volume-row .slider-sm{flex:1;max-width:200px;height:6px;appearance:none;background:var(--bg-tertiary);border-radius:3px;cursor:pointer}.volume-row .slider-sm::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 2px 6px var(--accent-glow)}.density-picker,.font-size-picker{display:flex;gap:8px;flex-wrap:wrap}.density-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 13px;background:var(--bg-tertiary);border:2px solid var(--border);border-radius:9px;cursor:pointer;transition:all .2s ease;min-width:70px}.density-btn:hover{border-color:var(--text-secondary);transform:translateY(-2px)}.density-btn.active{border-color:var(--accent);background:var(--bg-active);box-shadow:0 4px 12px var(--accent-glow)}.density-icon{font-size:18px}.density-label{font-size:12px;color:var(--text-secondary);font-weight:500}.density-btn.active .density-label{color:var(--accent)}.form-group.compact{margin-bottom:10px}.form-group.compact input{width:100%;padding:12px 14px;font-size:14px;font-family:var(--font-main);background:var(--bg-input);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);transition:all .2s ease}.form-group.compact input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.form-group.compact input::placeholder{color:var(--text-muted)}.btn-sm{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 16px;font-size:13px;font-weight:600;font-family:var(--font-main);border-radius:8px;cursor:pointer;transition:all .2s ease;border:none}.btn-sm:hover{transform:translateY(-1px)}.btn-full{width:100%;margin-top:8px}.btn-accent{background:var(--accent);color:#fff}.btn-accent:hover{background:var(--accent-hover)}.btn-outline{background:0 0;border:1px solid var(--border);color:var(--text-primary)}.btn-outline:hover{background:var(--bg-hover);border-color:var(--accent)}.btn-ghost{background:0 0;border:1px solid transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-danger-fill{background:var(--danger);color:#fff}.btn-danger-fill:hover{background:#e04040}.notif-settings{display:flex;flex-direction:column}.notif-divider{height:1px;background:var(--border);margin:12px 0}.password-change-form{display:flex;flex-direction:column;gap:10px}.admin-settings{margin-bottom:16px}.admin-save-bar{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;background:var(--bg-secondary);border-radius:10px;margin-top:16px}.btn-admin-save{padding:12px 24px;font-size:14px}.whitelist-add-row{display:flex;gap:8px;margin-bottom:12px}.whitelist-add-row input{flex:1;padding:10px 12px;font-size:13px;background:var(--bg-input);border:1px solid var(--border);border-radius:8px;color:var(--text-primary)}.whitelist-list{display:flex;flex-direction:column;gap:4px;max-height:150px;overflow-y:auto}.create-account-card{display:flex;align-items:flex-start;gap:12px;padding:12px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px}.create-account-card-icon{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:17px;background:var(--accent-glow,rgba(124,92,252,.25));border-radius:50%}.create-account-card-body{min-width:0}.create-account-card-title{margin:0 0 4px;font-size:13px;font-weight:600;color:var(--text-primary)}.create-account-modal .modal-actions .btn-accent,.create-account-open-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}.create-account-modal .btn-icon,.create-account-open-btn .btn-icon{font-size:15px;font-weight:700;line-height:1}.create-account-badge{font-size:11px;font-weight:600;letter-spacing:.03em;color:var(--accent);background:var(--accent-glow,rgba(124,92,252,.18));padding:3px 9px;border-radius:999px;white-space:nowrap}.create-account-form{display:flex;flex-direction:column}.create-account-form .form-group label{display:block;font-size:11.5px;font-weight:600;color:var(--text-secondary);margin-bottom:6px;text-transform:uppercase;letter-spacing:.03em}.create-account-form .form-group input{width:100%;box-sizing:border-box;padding:9px 12px;font-size:14px}.create-account-form .form-group .settings-hint{display:block;margin-top:5px;transition:color .15s ease}.create-account-form .form-group .settings-hint.is-error{color:#f87171;font-weight:500}.create-account-form .form-group .settings-hint.is-success{color:#4ade80;font-weight:500}.create-account-form .form-group .settings-hint.is-checking{color:rgba(255,255,255,.45)}.create-account-form .form-group input.field-error{border-color:rgba(239,68,68,.55)!important;box-shadow:0 0 0 3px rgba(239,68,68,.1),0 0 12px rgba(239,68,68,.07)!important}.create-account-form .form-group input.field-success{border-color:rgba(34,197,94,.5)!important;box-shadow:0 0 0 3px rgba(34,197,94,.1),0 0 12px rgba(34,197,94,.06)!important}.create-account-form-error{display:block;font-size:12.5px;color:#f87171;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.25);border-radius:var(--radius-sm,6px);padding:8px 10px;margin-top:2px;margin-bottom:10px}.create-account-modal .btn-accent:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.create-account-form .optional-tag{text-transform:none;font-weight:400;color:var(--text-muted);font-size:11px;margin-left:2px}.create-account-grid-row{display:flex;gap:12px}.create-account-grid-row .form-group{flex:1;min-width:0}@media (max-width:480px){.create-account-grid-row{flex-direction:column;gap:0}}.server-icon-upload-area{display:flex;align-items:flex-start;gap:16px;margin-top:12px}.server-icon-preview{width:64px;height:64px;border-radius:12px;background:var(--bg-tertiary);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:32px;color:var(--accent);overflow:hidden}.server-icon-preview img{width:100%;height:100%;object-fit:cover}.server-icon-upload-controls{display:flex;flex-direction:column;gap:8px}.desktop-pref-row{margin-bottom:12px}.plugin-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.plugin-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bg-tertiary);border-radius:8px}.plugin-name{font-size:13px;color:var(--text-primary);font-weight:500}.plugin-status{font-size:11px;color:var(--text-muted)}.shortcut-table{display:flex;flex-direction:column;gap:8px}.shortcut-row{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bg-tertiary);border-radius:8px}.shortcut-label{font-size:13px;color:var(--text-primary)}.shortcut-key{font-size:12px;color:var(--text-muted);font-family:var(--font-mono);background:var(--bg-input);padding:4px 8px;border-radius:4px}.shortcut-btns{display:flex;gap:4px}@media (max-width:640px){.modal-settings{max-width:100%;max-height:100%;border-radius:0}.settings-nav{display:none}.settings-body{padding:16px}}.modal-activities{max-width:520px;max-height:80vh;overflow-y:auto;padding:0}.activities-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 12px;position:sticky;top:0;background:var(--bg-card);z-index:10;border-bottom:1px solid var(--border)}.activities-header h3{font-size:18px;font-weight:700;color:var(--text-primary);margin:0}.activities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;padding:16px 24px 24px}.activity-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 10px;border-radius:8px;background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;transition:all .15s ease;text-align:center}.activity-card:hover{background:var(--bg-hover);border-color:var(--accent);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.15)}.activity-card-icon{font-size:36px;line-height:1}.activity-card-name{font-size:13px;font-weight:600;color:var(--text-primary)}.activity-card-desc{font-size:11px;color:var(--text-muted);line-height:1.3}.activity-card-disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.flash-install-banner{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-md);font-size:13px;color:var(--text-secondary)}.flash-install-banner .btn-sm{pointer-events:auto;flex-shrink:0}.game-iframe-overlay{position:fixed;inset:0;z-index:10200150;background:var(--bg-primary);display:flex;flex-direction:column}.game-iframe-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}.game-iframe-title{font-size:14px;font-weight:700;color:var(--text-primary)}.game-iframe-actions{display:flex;gap:8px}.game-iframe{flex:1;width:100%;border:none;background:var(--bg-primary)}.settings-section{padding:16px 24px;border-bottom:1px solid var(--border)}.settings-section:last-child{border-bottom:none}.settings-section-title{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid var(--border)}.settings-section-subtitle{font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:10px;margin-top:16px;padding-bottom:6px;border-bottom:1px solid var(--border)}.plugin-list{display:flex;flex-direction:column;gap:6px}.plugin-card{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bg-tertiary,rgba(255,255,255,.04));border:1px solid var(--border,rgba(255,255,255,.08));border-radius:8px;transition:background .15s}.plugin-card:hover{background:var(--bg-hover,rgba(255,255,255,.06))}.plugin-card-info{flex:1;min-width:0}.plugin-card-name{font-weight:600;font-size:13px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plugin-card-desc{font-size:11px;color:var(--text-secondary);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plugin-card-meta{font-size:10px;color:var(--text-muted);margin-top:2px}.plugin-empty{font-size:12px;color:var(--text-muted);padding:8px 0}.plugin-empty code{background:var(--bg-tertiary);padding:1px 4px;border-radius:3px;font-size:11px}.plugin-toggle{position:relative;display:inline-block;width:40px;height:22px;flex-shrink:0;margin-left:12px}.plugin-toggle input{opacity:0;width:0;height:0}.plugin-toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:var(--bg-tertiary,#333);border-radius:11px;transition:background .2s}.plugin-toggle-slider::before{content:'';position:absolute;width:16px;height:16px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:transform .2s}.plugin-toggle input:checked+.plugin-toggle-slider{background:var(--accent,#7c5cfc)}.plugin-toggle input:checked+.plugin-toggle-slider::before{transform:translateX(18px)}.settings-number-input{width:70px;padding:4px 6px;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-size:12px}.settings-hint{color:var(--text-muted);font-size:10px;display:block;margin-top:-2px}.settings-hint.error{color:#e94560}.settings-hint.success{color:#43b581}.shortcut-table{display:flex;flex-direction:column;gap:4px;margin-top:10px}.shortcut-row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--radius-sm);background:var(--bg-tertiary);border:1px solid var(--border-color)}.shortcut-row.recording{border-color:var(--accent);background:rgba(107,79,219,.1)}.shortcut-label{flex:1;font-size:12px;color:var(--text-primary)}.shortcut-key{min-width:140px;font-size:11px;font-family:var(--font-mono, monospace);background:var(--bg-secondary);border:1px solid var(--border);border-radius:3px;padding:2px 8px;color:var(--text-secondary);text-align:center}.shortcut-key.recording-label{color:var(--accent);border-color:var(--accent);animation:shortcut-pulse 1s ease infinite}@keyframes shortcut-pulse{0%,100%{opacity:1}50%{opacity:.5}}.shortcut-btns{display:flex;gap:4px}.desktop-pref-row{margin-bottom:12px}.desktop-pref-row .toggle-row{justify-content:flex-start;gap:10px;font-size:13px;color:var(--text-primary);cursor:pointer}.desktop-pref-row .settings-hint{margin:2px 0 0 26px;font-size:11px}.password-change-form{display:flex;flex-direction:column;gap:8px}.password-change-form .form-group.compact{margin:0}.password-change-form input{width:100%;padding:7px 10px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);font-size:13px;outline:0}.password-change-form input:focus{border-color:var(--accent)}.sidebar-settings-panel{flex-shrink:0;border-top:1px solid var(--border);border-bottom:none;padding:10px 16px}.btn-settings-popout{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;font-size:13px;font-weight:500;transition:all .15s ease}.btn-settings-popout:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--accent)}.btn-settings-popout svg{flex-shrink:0;opacity:.7}.btn-settings-popout:hover svg{opacity:1}.aml-member-row{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;background:var(--bg-tertiary);border-radius:var(--radius-sm);gap:10px}.aml-member-row:hover{background:var(--bg-hover)}.aml-member-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.aml-avatar-wrap{position:relative;flex-shrink:0;width:34px;height:34px}.aml-avatar{width:34px;height:34px;object-fit:cover}.aml-avatar-default{display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);color:var(--text-secondary);font-size:14px;font-weight:600}.aml-status-dot{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-radius:50%;border:2px solid var(--bg-tertiary)}.aml-status-dot.aml-online{background:var(--success)}.aml-status-dot.aml-offline{background:var(--text-muted)}.aml-member-info{display:flex;flex-direction:column;gap:3px;min-width:0}.aml-member-name{font-size:13px;font-weight:500;color:var(--text-primary);display:flex;align-items:center;gap:5px;flex-wrap:wrap}.aml-login-name{font-size:11px;color:var(--text-muted);font-weight:400}.aml-admin-text-badge{font-size:10px;padding:1px 5px;border-radius:3px;background:var(--danger);color:#fff;font-weight:600}.aml-admin-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:default;vertical-align:middle}.aml-admin-badge svg{display:block;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) drop-shadow(0 0 4px rgba(255, 255, 255, .22));transition:filter .15s}.aml-admin-badge:hover svg{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .5)) brightness(1.15)}.aml-banned-badge{font-size:10px;padding:1px 5px;border-radius:3px;background:var(--text-muted);color:#fff;font-weight:500;text-decoration:line-through}.aml-senior-enforcer-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:default;vertical-align:middle}.aml-senior-enforcer-badge svg{display:block;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) drop-shadow(0 0 4px rgba(255, 255, 255, .22));transition:filter .15s}.aml-senior-enforcer-badge:hover svg{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .5)) brightness(1.15)}.aml-enforcer-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:default;vertical-align:middle}.aml-enforcer-badge svg{display:block;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) drop-shadow(0 0 4px rgba(255, 255, 255, .22));transition:filter .15s}.aml-enforcer-badge:hover svg{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .5)) brightness(1.15)}.aml-owner-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:default;vertical-align:middle}.aml-owner-badge svg{display:block;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) drop-shadow(0 0 4px rgba(255, 255, 255, .22));transition:filter .15s}.aml-owner-badge:hover svg{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .5)) brightness(1.15)}.role-pin-badge{position:absolute;top:-5px;left:-5px;display:flex;align-items:center;justify-content:center;z-index:2;cursor:default;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .7)) drop-shadow(0 0 4px rgba(255, 255, 255, .3));transition:filter .12s,transform .12s}.role-pin-badge:hover{filter:drop-shadow(0 1px 4px rgba(0, 0, 0, .8)) brightness(1.12);transform:scale(1.2)}.role-pin-badge svg{display:block}.aml-mod-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:default;vertical-align:middle}.aml-mod-badge svg{display:block;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) drop-shadow(0 0 4px rgba(255, 255, 255, .22));transition:filter .15s}.aml-mod-badge:hover svg{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .5)) brightness(1.15)}.aml-dev-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:default;vertical-align:middle}.aml-dev-badge svg{display:block;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) drop-shadow(0 0 4px rgba(255, 255, 255, .22));transition:filter .15s}.aml-dev-badge:hover svg{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .5)) brightness(1.15)}.aml-new-badge{font-size:10px;padding:1px 5px;border-radius:3px;background:var(--accent);color:#fff;font-weight:500}.aml-member-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11px;color:var(--text-muted)}.aml-role-badge{font-size:10px;padding:1px 6px;border-radius:9px;border:1px solid;font-weight:500}.aml-member-joined{font-size:10px;color:var(--text-muted)}.aml-member-channels{font-size:10px;color:var(--text-muted);opacity:.7}.aml-member-rooms{margin-top:2px}.aml-rooms-toggle{display:inline-flex;align-items:center;gap:4px;border:none;background:0 0;padding:0;margin:0;cursor:pointer;font:inherit;font-size:10px;color:var(--text-secondary);opacity:.9}.aml-rooms-toggle:hover{color:var(--text-primary);opacity:1}.aml-rooms-caret{font-size:8px;transition:transform .15s ease}.aml-rooms-toggle[aria-expanded="true"] .aml-rooms-caret{transform:rotate(180deg)}.aml-rooms-list{display:none;flex-wrap:wrap;gap:4px;margin-top:4px}.aml-rooms-list:not([hidden]){display:flex}.aml-room-chip{font-size:10px;line-height:1.4;padding:1px 6px;border-radius:10px;background:var(--bg-hover);color:var(--text-secondary);white-space:nowrap;max-width:180px;overflow:hidden;text-overflow:ellipsis}.aml-member-ip,.aml-member-country{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:1px 7px;border:1px solid var(--border);border-radius:9px;background:var(--bg-secondary);font-size:10px;font-weight:500;line-height:1.7;color:var(--text-secondary);white-space:nowrap;overflow:hidden}
.aml-member-ip{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-weight:400;opacity:.85}
.aml-country-flag{font-size:12px;line-height:1;flex-shrink:0;font-family:'Twemoji Country Flags','Segoe UI Emoji','Apple Color Emoji','Noto Color Emoji',sans-serif}
.aml-country-name{overflow:hidden;text-overflow:ellipsis}.aml-actions{display:flex;align-items:center;gap:3px;flex-shrink:0;opacity:0;transition:opacity .15s}.aml-member-row:hover .aml-actions{opacity:1}.aml-action-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:none;background:0 0;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;padding:0;transition:background .12s}.aml-action-btn:hover{background:var(--bg-hover)}.aml-btn-ban:hover,.aml-btn-delete:hover{background:rgba(244,63,94,.15)}.aml-btn-unban:hover{background:rgba(74,222,128,.15)}.aml-channel-row:hover{background:var(--bg-hover);border-radius:var(--radius-sm)}.bans-list{max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.ban-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;background:var(--bg-tertiary);border-radius:var(--radius-sm)}.ban-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.ban-info strong{font-size:13px;color:var(--text-primary)}.ban-reason{font-size:11px;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ban-date{font-size:10px;color:var(--text-muted)}.btn-unban{flex-shrink:0;background:var(--success)!important;color:#fff!important}.btn-unban:hover{opacity:.85}.ban-actions{display:flex;gap:4px;flex-shrink:0;align-items:center}.btn-delete-user{flex-shrink:0;background:var(--danger)!important;color:#fff!important;font-size:12px;padding:4px 8px!important}.btn-delete-user:hover{opacity:.85}.chat-image[src$=".gif"],.chat-image[src*=".gif?"]{border:1px solid var(--border)}.collapsible-section-toggle{display:flex;align-items:center;gap:4px}.collapse-toggle-arrow{font-size:10px;transition:transform .2s ease;color:var(--text-muted);width:12px;text-align:center;flex-shrink:0}.collapse-toggle-arrow.collapsed{transform:rotate(-90deg)}.collapsible-section-body{overflow:hidden;transition:max-height .25s ease,opacity .2s ease,margin .25s ease;max-height:300px;opacity:1}.collapsible-section-body.collapsed{max-height:0;opacity:0;margin-top:0;margin-bottom:0}.mobile-servers-section{display:none}.mobile-servers-toggle{display:flex;align-items:center;gap:4px}.mobile-servers-row{display:flex;align-items:center;gap:6px;padding:6px 0;overflow:hidden;transition:max-height .25s ease,opacity .2s ease;max-height:60px}.mobile-servers-row.collapsed{max-height:0;opacity:0;padding:0;margin:0}.mobile-servers-scroll{display:flex;align-items:center;gap:6px;overflow-x:auto;overflow-y:hidden;flex:1;min-width:0;scrollbar-width:none;-ms-overflow-style:none;padding:2px 0}.mobile-servers-scroll::-webkit-scrollbar{display:none}.mobile-srv-bubble{width:38px;height:38px;border-radius:50%;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;position:relative;transition:border-radius .2s ease,background .2s ease;border:none;padding:0;color:var(--text-primary);font-size:14px;font-weight:600;text-decoration:none}.mobile-srv-bubble:hover{border-radius:12px;background:var(--accent)}.mobile-srv-bubble img{width:100%;height:100%;border-radius:inherit;object-fit:cover}.mobile-srv-bubble .msrv-status{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-radius:50%;border:2px solid var(--bg-secondary)}.mobile-srv-bubble .msrv-status.online{background:var(--success,#43b581)}.mobile-srv-bubble .msrv-status.offline{background:var(--danger,#f04747)}.mobile-srv-bubble .msrv-status.unknown{background:var(--text-muted,#666)}.mobile-srv-add-btn{width:38px;height:38px;border-radius:50%;background:var(--bg-tertiary);border:2px dashed var(--border-light);color:var(--accent);font-size:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .2s ease}.mobile-srv-add-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.mobile-servers-empty{font-size:11px;color:var(--text-muted);padding:4px 0;white-space:nowrap}.mobile-menu-btn,.mobile-users-btn{display:none;width:40px;height:40px;background:0 0;color:var(--text-secondary);border:none;border-radius:var(--radius-sm);align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition);-webkit-tap-highlight-color:transparent;position:relative;z-index:1000}@media (max-width:768px){.mobile-menu-btn,.mobile-users-btn{display:flex!important}.mobile-menu-btn svg,.mobile-users-btn svg{width:22px;height:22px;flex-shrink:0}}.mobile-menu-btn:hover,.mobile-users-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.mobile-server-dropdown{display:none;position:relative}.mobile-server-btn{background:0 0;border:none;color:var(--accent,#7c5cfc);font-size:20px;cursor:pointer;padding:4px 6px;border-radius:4px;line-height:1;-webkit-tap-highlight-color:transparent}.mobile-server-btn:hover{background:var(--bg-hover)}.mobile-server-menu{display:none;position:absolute;top:100%;left:0;z-index:200;background:var(--bg-secondary,#1e1e2e);border:1px solid var(--border,#444);border-radius:8px;padding:6px;min-width:200px;max-height:60vh;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,.5)}.mobile-server-menu.open{display:block}.mobile-server-menu-header{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;padding:4px 8px 6px;border-bottom:1px solid var(--border,#444);margin-bottom:4px}.mobile-server-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;cursor:pointer;color:var(--text-primary,#eee);font-size:13px;text-decoration:none;transition:background .15s}.mobile-server-item:hover{background:var(--bg-hover,rgba(255,255,255,.06))}.mobile-server-item .msrv-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.mobile-server-item .msrv-dot.online{background:var(--success,#43b581)}.mobile-server-item .msrv-dot.offline{background:var(--danger,#f04747)}.mobile-server-item .msrv-dot.unknown{background:var(--text-dim,#666)}.mobile-server-item .msrv-icon{width:24px;height:24px;border-radius:50%;object-fit:cover;flex-shrink:0}.mobile-server-item .msrv-initial{width:24px;height:24px;border-radius:50%;background:var(--bg-tertiary,#2a2a3a);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--text-muted);flex-shrink:0}.mobile-server-add{display:block;width:100%;background:0 0;border:none;cursor:pointer;color:var(--accent,#7c5cfc);font-size:13px;padding:8px 10px;text-align:left;border-radius:6px;margin-top:2px}.mobile-server-add:hover{background:rgba(124,92,252,.1)}.mobile-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:90;-webkit-tap-highlight-color:transparent}.mobile-overlay.active{display:block}.mobile-panel-close{display:none;z-index:110;width:32px;height:32px;border:none;border-radius:50%;background:rgba(255,255,255,.1);color:var(--text-primary,#eee);font-size:20px;line-height:1;cursor:pointer;align-items:center;justify-content:center;transition:background .15s;-webkit-tap-highlight-color:transparent;flex-shrink:0}.mobile-panel-close:hover{background:rgba(255,255,255,.2)}.mobile-panel-close:not(.mobile-panel-close-right){position:absolute;top:10px;right:10px}.mobile-panel-close-right{position:static;margin-left:auto}.mobile-settings-btn{display:none}@media (max-width:900px){.right-sidebar.collapsed{display:flex}.sidebar-collapse-btn{display:none}.mobile-users-btn{display:flex}.mobile-settings-btn{display:flex}.sidebar-settings-panel{display:none!important}}@media (max-width:768px){.mobile-menu-btn,.mobile-users-btn{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;background:#1a1d23!important}.mobile-menu-btn svg,.mobile-users-btn svg{width:24px!important;height:24px!important;stroke:#ffffff!important;stroke-width:2.5!important;opacity:1!important}.right-sidebar{display:flex!important;position:fixed!important;right:0;top:0;bottom:0;width:85vw!important;min-width:200px;max-width:320px;z-index:200!important;transform:translateX(100%)!important;transition:transform .25s ease!important;opacity:1!important;pointer-events:auto!important}#app-body.mobile-right-open .right-sidebar,#app-body.mobile-right-open .right-sidebar.collapsed{transform:translateX(0)!important;opacity:1!important;pointer-events:auto!important;width:85vw!important;min-width:85vw!important}#app-body.mobile-right-open .mobile-users-btn{background:rgba(99,102,241,.4)!important}.mobile-server-dropdown{display:none}.mobile-servers-section{display:block}.mobile-panel-close{display:flex}.server-bar{width:0;min-width:0;overflow:hidden;border:none;padding:0}.main{width:100%;min-width:0}.welcome-screen{width:100%;justify-content:center;align-items:center}.welcome-content{max-width:90vw;padding:0 16px}.sidebar{position:fixed!important;left:0;top:0;bottom:0;width:280px;min-width:280px;z-index:100;transform:translateX(-100%);transition:transform .25s ease;box-shadow:4px 0 24px rgba(0,0,0,.4);padding-bottom:max(env(safe-area-inset-bottom,0px),16px)}#app-body.mobile-sidebar-open .sidebar{transform:translateX(0)}#app-body.mobile-sidebar-open .server-bar{position:fixed;left:280px;top:0;bottom:0;width:52px;min-width:52px;z-index:100;overflow-y:auto;transform:translateX(-332px);transition:transform .25s ease;border-right:1px solid var(--border);padding:8px 0}#app-body.mobile-sidebar-open .server-bar{transform:translateX(0)}.right-sidebar{display:flex!important;position:fixed;right:0;top:0;bottom:0;width:260px;min-width:260px;z-index:100;transform:translateX(100%);transition:transform .25s ease;box-shadow:-4px 0 24px rgba(0,0,0,.4);padding-bottom:max(env(safe-area-inset-bottom,0px),16px)}#app-body.mobile-right-open .right-sidebar{transform:translateX(0)}.channel-header{padding:8px 12px;min-height:48px;gap:8px;display:flex!important;align-items:center!important}.mobile-menu-btn{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;width:40px!important;height:40px!important;min-width:40px!important;padding:8px!important;margin:0!important;position:relative!important;z-index:9999!important;cursor:pointer!important;background:0 0!important;border:none!important}.mobile-menu-btn *,.mobile-users-btn *{pointer-events:none!important}.mobile-users-btn{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:8px!important;margin:0!important;position:relative!important;z-index:10000!important;cursor:pointer!important;background:0 0!important;border:none!important;-webkit-tap-highlight-color:rgba(99,102,241,0.3)!important;tap-highlight-color:rgba(99,102,241,0.3)!important}.mobile-users-btn:active{background:rgba(99,102,241,.2)!important;transform:scale(.95)!important}.voice-controls{overflow:visible!important;position:relative!important;z-index:9999!important}.channel-info h3{font-size:14px}.channel-code-tag{font-size:10px;padding:1px 6px}#copy-code-btn,#delete-channel-btn,#pinned-toggle-btn,#search-toggle-btn{display:none!important}.header-actions-divider{display:none}.header-actions-box{display:none!important}.messages{padding:12px}.message-input-area{padding:8px 12px 12px;gap:6px}.gif-picker{max-width:360px}.screen-share-container{max-height:40vh}.webcam-container{max-height:160px}.webcam-tile{width:120px;height:90px}.status-bar{display:none}[data-desktop-app] .status-bar{display:flex!important}}@media (max-width:480px){#app{padding-top:env(safe-area-inset-top,0);padding-bottom:env(safe-area-inset-bottom,0);padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}.sidebar{width:85vw;min-width:85vw}#app-body.mobile-sidebar-open .server-bar{display:none}.mobile-server-dropdown{display:none}.right-sidebar{width:85vw;min-width:85vw}.channel-header{padding:6px 8px;min-height:44px;gap:4px;overflow:hidden}.channel-info{flex:1 1 0;min-width:0;overflow:hidden}.channel-info h3{font-size:13px;max-width:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-code-tag{display:none!important}.android-beta-banner{display:none!important}.update-banner{padding:3px 8px;font-size:11px}.update-pulse{width:6px;height:6px}.desktop-app-banner{display:none!important}@keyframes slideUpSheet{from{transform:translateY(100%)}to{transform:translateY(0)}}.messages{padding:8px}.message-row{gap:8px;padding:0}.message-avatar{width:24px;height:24px;font-size:12px}.message-avatar-img{width:24px;height:24px}.user-item-avatar,.user-item-avatar-img{width:20px;height:20px;font-size:9px}.user-avatar-wrapper{width:20px;height:20px}.user-status-dot{width:8px;height:8px;bottom:-2px;right:-2px}.message-author{font-size:13px}.message-content{font-size:14px;line-height:1.45;word-break:break-word}.message-time{font-size:10px}.chat-image{max-width:140px;max-height:140px}.image-mode-full .chat-image{max-width:100%;max-height:250px}.message-input-area{padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));gap:4px;flex-wrap:nowrap;align-items:flex-end}.input-actions-box{border-radius:16px;padding:2px 2px;gap:1px;flex-shrink:0;order:0;border:none;background:0 0}.input-actions-box .input-actions-divider{display:none}.input-actions-box .btn-emoji,.input-actions-box .btn-gif,.input-actions-box .btn-upload{width:28px;height:28px;min-width:28px;min-height:28px;font-size:14px;border-radius:50%;flex-shrink:0}.input-actions-box .btn-gif{width:auto;padding:0 5px;border-radius:var(--radius-sm);height:22px;min-height:22px;font-size:11px}.message-input-area textarea,.message-input-area #message-input{padding:6px 10px;font-size:16px;border-radius:20px;min-height:34px;flex:1 1 0;min-width:0;order:1}.message-input-area .btn-send{width:34px;height:34px;min-width:34px;min-height:34px;border-radius:50%;flex-shrink:0;order:2}.gif-picker{left:4px;right:4px;bottom:56px;max-width:none;width:auto;max-height:50vh}.gif-picker-grid{max-height:40vh}.emoji-picker{left:4px;right:4px;bottom:56px;max-width:none;width:auto}.emoji-grid{max-height:200px;grid-template-columns:repeat(6,1fr)}.emoji-grid .custom-emoji{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important}.emoji-item{width:auto;height:48px;font-size:22px}.mention-dropdown{left:8px;right:8px;max-width:none;min-width:0}.mention-item{padding:12px 14px;font-size:14px}.reply-bar{padding:6px 8px;font-size:12px}.reply-banner{padding-left:46px}.reaction-badge{padding:4px 10px;font-size:14px;background:0 0}.reaction-picker{gap:4px;padding:6px 8px}.reaction-pick-btn{width:38px;height:38px;font-size:20px}.reaction-full-picker{width:calc(100vw - 32px);max-width:320px;right:0}.screen-share-container{max-height:35vh;min-height:120px}.webcam-container{max-height:130px}.webcam-tile{width:100px;height:75px}.status-bar{display:none}[data-desktop-app] .status-bar{display:flex!important}.welcome-icon{font-size:48px}.welcome-content h2{font-size:18px}.welcome-content p{font-size:13px}.modal{padding:20px;width:95%;max-height:85vh;overflow-y:auto}.modal h3{font-size:18px}.modal-settings{max-height:80vh}.settings-nav{display:none}.settings-body{overflow-y:auto}.typing-indicator{padding:0 8px;font-size:11px}.search-container{flex:1}.search-input{font-size:14px}.stream-audio-controls{opacity:1}.stream-vol-slider{width:50px}}@media (max-width:360px){.channel-info h3{font-size:12px;max-width:90px}.message-avatar{width:20px;height:20px;font-size:11px}.message-avatar-img{width:20px;height:20px}.user-item-avatar,.user-item-avatar-img{width:18px;height:18px;font-size:8px}.user-avatar-wrapper{width:18px;height:18px}.user-status-dot{width:7px;height:7px;bottom:-2px;right:-2px}.message-row{gap:6px;padding:0}.message-content{font-size:13px}.status-bar .status-item:nth-child(n+3){display:none}.sidebar{width:80vw;min-width:80vw}.right-sidebar{width:80vw;min-width:80vw}}.ios-keyboard-open .message-input-area{padding-bottom:6px!important}@media (hover:none) and (pointer:coarse){body,html{overscroll-behavior-y:contain}.message,.message-compact{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.msg-selected .message-content{-webkit-user-select:text;user-select:text}.channel-item{padding:12px 16px;min-height:44px}.btn-sm{min-height:44px;padding:10px 14px}.icon-btn{min-width:40px;min-height:40px;font-size:18px}.theme-btn{width:36px;height:36px}.toggle-row input[type=checkbox]{width:20px;height:20px}.server-icon{width:44px;height:44px}.message-compact:hover,.message:hover{background:0 0}.message-compact:hover .compact-time{display:none!important}.message-compact:hover .msg-toolbar,.message:hover .msg-toolbar{display:none!important}.msg-toolbar{display:none!important;z-index:50}.msg-selected .msg-toolbar{display:flex!important}.msg-selected{background:rgba(255,255,255,.06);border-radius:var(--radius)}.msg-toolbar button{background:var(--bg-tertiary);border-radius:var(--radius);min-width:34px;min-height:34px;font-size:16px}.message-compact .compact-time{display:none!important}.messages,.modal,.right-sidebar,.sidebar{-webkit-overflow-scrolling:touch}}@media (pointer:coarse){.message-compact:hover .msg-toolbar,.message:hover .msg-toolbar{display:none!important}.msg-toolbar{display:none!important}.msg-selected .msg-toolbar{display:flex!important}}@media (max-height:500px) and (orientation:landscape){.status-bar{display:none}[data-desktop-app] .status-bar{display:flex!important}.channel-header{min-height:40px;padding:4px 8px}.messages{padding:4px 8px}.message-input-area{padding:4px 8px 6px}.welcome-icon{font-size:36px}.welcome-content h2{font-size:16px}}.user-group-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);padding:8px 6px 4px;user-select:none}.user-group-label.offline-label{margin-top:8px;border-top:1px solid var(--border);padding-top:10px}.user-score-badge{font-size:10px;color:var(--accent);background:var(--bg-tertiary);padding:1px 6px;border-radius:8px;margin-left:auto;flex-shrink:0;font-weight:600;opacity:.8}.eula-notice{margin-top:16px;padding:12px 14px;background:var(--bg-primary);border-radius:var(--radius-sm);border:1px solid var(--border)}.eula-check-row{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--text-secondary);cursor:pointer}.eula-check-row+.eula-check-row{margin-top:10px}.eula-check-row input[type=checkbox]{margin-top:2px;accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}.eula-check-row a{color:var(--accent);text-decoration:underline}.eula-check-row a:hover{color:var(--accent-hover)}.eula-modal{max-width:700px;max-height:80vh;display:flex;flex-direction:column}.eula-content{overflow-y:auto;max-height:55vh;padding:16px;background:var(--bg-primary);border-radius:var(--radius-sm);border:1px solid var(--border);margin:12px 0;font-size:13px;line-height:1.7;color:var(--text-secondary)}.eula-content p{margin:8px 0}.eula-content ol{padding-left:20px}.eula-content ol li{margin:10px 0}.eula-content ul{padding-left:20px;margin:6px 0}.eula-content ul li{margin:4px 0;list-style:disc}.eula-content h4{margin:18px 0 6px;font-size:14px;font-weight:700;color:var(--text-primary);letter-spacing:.3px}.eula-content strong{color:var(--text-primary)}.eula-content em{color:var(--text-muted)}.eula-footer{margin-top:12px;padding-top:10px;border-top:1px solid var(--border);text-align:center;color:var(--danger)}.btn-game{margin-top:20px;padding:10px 24px;background:var(--bg-hover);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius);font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition)}.btn-game:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.tts-tag{font-size:10px;color:var(--accent);margin-left:6px;opacity:.7}.webcam-container{display:none;flex-direction:column;background:color-mix(in srgb,var(--bg-primary) 90%,#000);border-bottom:2px solid var(--accent);max-height:25vh;min-height:100px;position:relative}.webcam-header{display:flex;align-items:center;justify-content:space-between;padding:4px 10px;font-size:12px;font-weight:600;color:var(--text-secondary);background:color-mix(in srgb,var(--bg-secondary) 60%,transparent)}.webcam-header-controls{display:flex;align-items:center;gap:6px}.webcam-header .icon-btn.small{font-size:11px;padding:2px 6px;background:0 0;border:none;color:var(--text-secondary);cursor:pointer;border-radius:4px}.webcam-header .icon-btn.small:hover{background:var(--bg-hover);color:var(--text-primary)}.webcam-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:4px;overflow-y:auto;max-height:calc(25vh - 32px)}.webcam-tile{position:relative;border-radius:6px;overflow:hidden;background:#111;box-shadow:0 2px 8px rgba(0,0,0,.3);transition:transform .15s ease,box-shadow .15s ease;cursor:pointer;max-width:25vw;min-width:120px;flex-shrink:0}.webcam-tile:hover{box-shadow:0 4px 14px rgba(0,0,0,.45)}.webcam-tile video{width:100%;height:auto;object-fit:cover;display:block;max-height:21vh}.webcam-tile-label{position:absolute;bottom:0;left:0;right:0;padding:3px 8px;font-size:10px;font-weight:600;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.7));text-align:center;pointer-events:none}.webcam-tile .stream-close-btn,.webcam-tile .stream-fullscreen-btn,.webcam-tile .stream-minimize-btn,.webcam-tile .stream-popout-btn{position:absolute;background:rgba(0,0,0,.6);color:#fff;border:none;border-radius:4px;font-size:13px;padding:2px 6px;cursor:pointer;opacity:0;transition:opacity .15s ease;z-index:3}.webcam-tile:hover .stream-close-btn,.webcam-tile:hover .stream-fullscreen-btn,.webcam-tile:hover .stream-minimize-btn,.webcam-tile:hover .stream-popout-btn{opacity:1}.webcam-tile .stream-popout-btn{top:4px;left:4px}.webcam-tile .stream-fullscreen-btn{top:4px;left:32px}.webcam-tile .stream-minimize-btn{top:4px;right:28px}.webcam-tile .stream-close-btn{top:4px;right:4px}.webcam-grid.layout-vertical{flex-direction:column;align-items:center}.webcam-grid.layout-side-by-side .webcam-tile{flex:0 1 calc(50% - 4px);max-width:calc(50% - 4px)}.webcam-grid.layout-grid-2x2 .webcam-tile{flex:0 1 calc(50% - 4px);max-width:calc(50% - 4px)}.webcam-container.webcam-focus-mode{max-height:none!important;min-height:0!important;flex:1 1 auto!important;height:100%}.webcam-container.webcam-focus-mode .webcam-grid{max-height:none!important;flex:1;height:100%}.webcam-container.webcam-focus-mode .webcam-tile:not(.webcam-focused){display:none}.webcam-container.webcam-focus-mode .webcam-tile.webcam-focused{flex:1;width:100%;max-width:none!important;min-height:0;height:100%}.webcam-container.webcam-focus-mode .webcam-tile.webcam-focused video{width:100%;height:100%;max-height:none!important;object-fit:contain}.webcam-tile.webcam-popped-out{height:28px!important;min-height:0;overflow:hidden;opacity:.5}.webcam-tile.webcam-popped-out video{display:none}.webcam-tile.webcam-popped-out::after{content:'⧉ Popped out';display:flex;align-items:center;justify-content:center;height:100%;font-size:11px;color:var(--text-muted)}.webcam-pip-overlay{width:320px;min-height:240px}.screen-share-container{display:none;flex-direction:column;background:#000;border-bottom:2px solid var(--accent);max-height:50vh;min-height:180px;position:relative}.screen-share-indicator{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;font-size:11px;border-radius:12px;background:var(--accent);color:#fff;border:none;cursor:pointer;margin-left:8px;animation:pulse-glow 2s ease-in-out infinite;white-space:nowrap}.screen-share-indicator:hover{filter:brightness(1.2)}@keyframes pulse-glow{0%,100%{opacity:1}50%{opacity:.7}}.screen-share-header{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;background:var(--bg-tertiary);font-size:12px;font-weight:600;color:var(--text-secondary)}.screen-share-header .icon-btn{color:var(--text-muted)}.screen-share-header-controls{display:flex;align-items:center;gap:8px}.stream-size-slider{width:100px;height:18px;-webkit-appearance:none;appearance:none;background:0 0;border-radius:2px;cursor:pointer;vertical-align:middle;outline:0}.stream-size-slider::-webkit-slider-runnable-track{background:rgba(255,255,255,.3);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.2)}.stream-size-slider::-moz-range-track{background:rgba(255,255,255,.3);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.2)}.stream-size-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer;margin-top:-4px;box-shadow:0 0 6px var(--accent-glow,rgba(124,92,252,.4))}.stream-size-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer;border:none}.stream-size-label{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-muted);user-select:none;white-space:nowrap}.screen-share-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2px;max-height:calc(50vh - 32px);overflow-y:auto;background:#000}.screen-share-grid.layout-vertical{grid-template-columns:1fr}.screen-share-grid.layout-side-by-side{grid-template-columns:repeat(2,1fr)}.screen-share-grid.layout-grid-2x2{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}.stream-layout-picker{position:relative}.stream-layout-btn{background:0 0;border:none;color:var(--text-muted,#aaa);cursor:pointer;font-size:16px;padding:2px 6px;border-radius:4px;line-height:1}.stream-layout-btn:hover{background:rgba(255,255,255,.1);color:#fff}.stream-layout-menu{display:none;position:absolute;top:100%;right:0;z-index:50;background:var(--bg-tertiary,#2a2a3a);border:1px solid var(--border,#444);border-radius:6px;padding:4px;min-width:110px;box-shadow:0 4px 16px rgba(0,0,0,.4)}.stream-layout-menu.open{display:flex;flex-direction:column;gap:2px}.stream-layout-opt{background:0 0;border:none;color:var(--text-secondary,#bbb);cursor:pointer;padding:5px 10px;border-radius:4px;text-align:left;font-size:12px;white-space:nowrap}.stream-layout-opt:hover{background:rgba(255,255,255,.08);color:#fff}.stream-layout-opt.active{background:var(--accent,#7c5cfc);color:#fff}.screen-share-tile{position:relative;background:#111}.screen-share-tile video{width:100%;display:block;object-fit:contain;max-height:45vh;background:#000}video:-webkit-full-screen,video:fullscreen{max-height:unset!important;max-width:unset!important;width:100%!important;height:100%!important;object-fit:contain!important;background:#000}.file-video-wrap:-webkit-full-screen,.file-video-wrap:fullscreen{display:flex!important;align-items:center!important;justify-content:center!important;background:#000!important;max-width:unset!important;width:100%!important;height:100%!important}.file-video-wrap:-webkit-full-screen .file-video,.file-video-wrap:fullscreen .file-video{max-width:100%!important;max-height:100%!important;width:100%!important;height:100%!important;object-fit:contain!important;margin:0!important}.screen-share-tile-label{position:absolute;bottom:4px;left:6px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;padding:2px 8px;border-radius:4px;pointer-events:none}.stream-audio-controls{position:absolute;bottom:4px;right:6px;display:flex;align-items:center;gap:4px;background:rgba(0,0,0,.75);padding:3px 8px;border-radius:6px;opacity:1;z-index:2}.stream-mute-btn{background:0 0;border:none;color:#fff;cursor:pointer;font-size:14px;padding:2px 4px;border-radius:4px;line-height:1}.stream-mute-btn:hover{background:rgba(255,255,255,.15)}.stream-mute-btn.muted{color:var(--danger,#e74c3c)}.stream-vol-slider{--track-bg:rgba(255, 255, 255, 0.2);width:60px;height:14px;-webkit-appearance:none;appearance:none;background:0 0;border-radius:2px;cursor:pointer;outline:0;vertical-align:middle}.stream-vol-slider::-webkit-slider-runnable-track{background:rgba(255,255,255,.3);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.15)}.stream-vol-slider::-moz-range-track{background:rgba(255,255,255,.3);height:6px;border-radius:3px;border:1px solid rgba(255,255,255,.15)}.stream-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent,#7c5cfc);cursor:pointer;margin-top:-5px;box-shadow:0 0 4px rgba(124,92,252,.4)}.stream-vol-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent,#7c5cfc);cursor:pointer;border:none}.stream-vol-pct{color:rgba(255,255,255,.7);font-size:10px;min-width:28px;text-align:center;user-select:none}.stream-audio-badge{position:absolute;top:4px;right:6px;background:rgba(0,0,0,.65);color:var(--accent,#7c5cfc);font-size:10px;padding:2px 6px;border-radius:4px;pointer-events:none;display:flex;align-items:center;gap:3px}.stream-no-audio-badge{position:absolute;top:4px;right:6px;background:rgba(0,0,0,.75);color:var(--text-muted,#888);font-size:10px;padding:2px 8px;border-radius:4px;pointer-events:none;display:flex;align-items:center;gap:3px;opacity:.85}.stream-viewer-badge{position:absolute;bottom:30px;right:6px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;padding:2px 8px;border-radius:10px;pointer-events:none;display:flex;align-items:center;gap:4px;z-index:5}.stream-viewer-badge .viewer-eye{font-size:12px}.stream-focus-mode{max-height:none!important;flex:999 1 0;min-height:0;overflow:hidden}.stream-focus-mode .screen-share-grid{max-height:none!important;flex:1 1 0;min-height:0;overflow:hidden;height:100%}.stream-focus-mode .screen-share-tile:not(.stream-focused){display:none}.stream-focus-mode .screen-share-tile.stream-focused{width:100%;height:100%;overflow:hidden}.stream-focus-mode .screen-share-tile.stream-focused video{max-height:100%;width:100%;height:100%;object-fit:contain}.stream-popout-btn{position:absolute;top:4px;left:6px;background:rgba(0,0,0,.7);color:#fff;border:none;cursor:pointer;font-size:16px;padding:2px 6px;border-radius:4px;opacity:0;transition:opacity .2s;z-index:3;line-height:1}.screen-share-tile:hover .stream-popout-btn{opacity:1}.stream-popout-btn:hover{background:rgba(255,255,255,.2)}.stream-fullscreen-btn{position:absolute;top:4px;left:36px;background:rgba(0,0,0,.7);color:#fff;border:none;cursor:pointer;font-size:16px;padding:2px 6px;border-radius:4px;opacity:0;transition:opacity .2s;z-index:3;line-height:1}.screen-share-tile:hover .stream-fullscreen-btn{opacity:1}.stream-fullscreen-btn:hover{background:rgba(255,255,255,.2)}.stream-minimize-btn{position:absolute;top:4px;right:30px;background:rgba(0,0,0,.7);color:#fff;border:none;cursor:pointer;font-size:14px;padding:2px 6px;border-radius:4px;opacity:0;transition:opacity .2s;z-index:3;line-height:1}.screen-share-tile:hover .stream-minimize-btn{opacity:1}.stream-minimize-btn:hover{background:rgba(255,255,255,.2)}.stream-close-btn{position:absolute;top:4px;right:6px;background:rgba(0,0,0,.7);color:#fff;border:none;cursor:pointer;font-size:14px;padding:2px 6px;border-radius:4px;opacity:0;transition:opacity .2s;z-index:3;line-height:1}.screen-share-tile:hover .stream-close-btn{opacity:1}.stream-close-btn:hover{background:rgba(220,53,69,.7)}.screen-share-tile.stream-popped-out{height:28px!important;min-height:0!important;overflow:hidden;flex:none!important}.screen-share-tile.stream-popped-out video{display:none}.screen-share-tile.stream-popped-out .stream-controls{display:none}.screen-share-tile.stream-popped-out::after{content:'⧉ Popped out — click to restore';position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:28px;color:var(--text-muted);font-size:11px;font-weight:500;background:var(--bg-tertiary)}.screen-share-container.all-streams-popped{min-height:0!important;max-height:none!important;height:auto!important}.screen-share-container.all-streams-popped .screen-share-grid{max-height:none!important}.stream-pip-overlay{width:336px;min-height:288px}.stream-pip-overlay .stream-pip-video{flex:1;overflow:hidden;background:#000;min-height:240px}.stream-pip-overlay video{width:100%;height:100%;object-fit:contain;display:block}@media (max-width:768px){.stream-pip-overlay{width:280px;bottom:12px;right:12px}}.sb-pip-overlay{position:fixed;bottom:24px;right:24px;width:400px;z-index:10200120;background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.45);overflow:hidden;display:flex;flex-direction:column;resize:both;min-width:260px;min-height:220px}.sb-pip-body{flex:1;overflow:hidden;padding:8px 10px;display:flex;flex-direction:column;gap:8px;min-height:0}.sb-pip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px;overflow-y:auto;flex:1;min-height:80px}@media (max-width:768px){.sb-pip-overlay{width:280px;bottom:12px;right:12px}}.whitelist-add-row{display:flex;gap:6px;margin-bottom:8px}.whitelist-add-row input{flex:1;min-width:0}.settings-text-input{padding:6px 10px;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:13px}.settings-text-input:focus{outline:0;border-color:var(--accent)}.whitelist-list{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.whitelist-item{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;background:var(--bg-primary);border-radius:var(--radius-sm);font-size:13px}.whitelist-username{color:var(--text-primary);font-weight:500}.btn-danger-sm{padding:2px 8px!important;font-size:11px;background:var(--danger)!important;color:#fff!important;border-radius:var(--radius-sm);cursor:pointer;min-height:0;line-height:1.4}.btn-danger-sm:hover{opacity:.85}.message-compact.pinned,.message.pinned{border-left:3px solid var(--accent);background:rgba(124,92,252,.04)}.pinned-tag{font-size:10px;margin-left:4px;opacity:.7;cursor:default;flex-shrink:0}.message-compact.archived,.message.archived{border-left:3px solid #27ae60;background:rgba(39,174,96,.04)}.archived-tag{font-size:10px;margin-left:4px;opacity:.7;cursor:default;flex-shrink:0}.message-compact.announcement,.message.announcement{border-left:3px solid #d4a017;background:rgba(212,160,23,.05)}.announcement-badge{background:#d4a017!important;color:#fff!important}.pinned-panel{background:var(--bg-secondary);border-bottom:1px solid var(--border);max-height:300px;overflow-y:auto}.pinned-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;font-size:13px;font-weight:600;color:var(--text-secondary);border-bottom:1px solid var(--border-color);position:sticky;top:0;background:var(--bg-secondary)}.pinned-list{padding:4px 0}.pinned-item{padding:8px 12px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.03);transition:background var(--transition)}.pinned-item:hover{background:rgba(255,255,255,.04)}.pinned-item-header{display:flex;align-items:baseline;gap:8px;margin-bottom:2px}.pinned-item-author{font-weight:600;font-size:13px}.pinned-item-time{font-size:11px;color:var(--text-muted)}.pinned-item-content{font-size:13px;color:var(--text-primary);line-height:1.4;max-height:60px;overflow:hidden;text-overflow:ellipsis}.pinned-item-footer{font-size:10px;color:var(--text-muted);margin-top:4px}.code-block{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--radius-sm);margin:6px 0;position:relative;overflow:hidden}.code-block pre{margin:0;padding:10px 12px;overflow-x:auto;font-size:13px;line-height:1.5}.code-block code{font-family:Consolas,Monaco,'Courier New',monospace;color:var(--text-primary);background:0 0;padding:0}.code-block-lang{position:absolute;top:4px;right:8px;font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.inline-code{font-family:Consolas,Monaco,'Courier New',monospace;background:var(--bg-tertiary);padding:1px 5px;border-radius:3px;font-size:.9em;color:var(--accent)}.chat-blockquote{border-left:3px solid var(--text-muted);padding:2px 0 2px 10px;margin:4px 0;color:var(--text-secondary);font-style:italic}.chat-heading{font-weight:700;margin:4px 0 2px;line-height:1.3;color:var(--text-primary)}.chat-h1{font-size:1.5em}.chat-h2{font-size:1.25em}.chat-h3{font-size:1.1em}.chat-hr{border:none;border-top:1px solid var(--border-color);margin:6px 0}.chat-list{margin:4px 0;padding-left:22px}.chat-list li{margin:1px 0;line-height:1.45}ol.chat-list{list-style-type:decimal}ul.chat-list{list-style-type:disc}.link-preview{display:flex;gap:10px;margin-top:6px;padding:10px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-left:3px solid var(--accent);border-radius:var(--radius-sm);text-decoration:none;color:inherit;max-width:480px;overflow:hidden;transition:background var(--transition)}.link-preview:hover{background:rgba(255,255,255,.04)}.link-preview-image{width:80px;height:80px;object-fit:cover;border-radius:4px;flex-shrink:0}.link-preview-text{display:flex;flex-direction:column;gap:2px;min-width:0;overflow:hidden}.link-preview-site{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px}.link-preview-title{font-size:13px;font-weight:600;color:var(--text-link);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.link-preview-desc{font-size:12px;color:var(--text-secondary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.link-preview--gallery{flex-direction:column;max-width:400px;gap:6px}.link-preview-gallery{display:grid;grid-template-columns:1fr 1fr;gap:2px;border-radius:4px;overflow:hidden;width:100%}.link-preview-gallery-img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.link-preview-gallery[data-count="3"] .link-preview-gallery-img:first-child{grid-column:1/-1;aspect-ratio:2/1}.link-preview-yt{margin-top:6px;max-width:480px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border-color);border-left:3px solid red;background:#000;aspect-ratio:16/9}.link-preview-yt iframe{display:block;width:100%;height:100%;border:0}.channel-topic-bar{padding:6px 16px;font-size:12px;color:var(--text-secondary);background:var(--bg-card);border:1px solid rgba(255,255,255,.07);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:28px;line-height:28px;margin:0 8px 8px 8px;position:relative;z-index:10;border-radius:0 0 20px 20px;box-shadow:none}.channel-topic-bar:hover{color:var(--text-primary)}.user-dot.dnd{background-color:var(--danger)!important;box-shadow:0 0 4px var(--danger);border-radius:2px}.user-dot.away{background-color:#faa61a!important;box-shadow:0 0 4px rgba(250,166,26,.4);border-radius:2px 2px 50% 50%}.user-dot.invisible{background-color:transparent!important;border:2px solid var(--text-muted);box-shadow:none;box-sizing:border-box}.user-status-text{font-size:11px;color:var(--text-muted);margin-left:4px;max-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1}.status-picker-dot{cursor:pointer;transition:transform .15s}.status-picker-dot:hover{transform:scale(1.4)}.status-picker{position:fixed;left:10px;right:auto;bottom:auto;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;padding:6px 0;min-width:200px;width:220px;z-index:600;box-shadow:0 4px 12px rgba(0,0,0,.4)}.status-option{padding:6px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-primary)}.status-option:hover{background:var(--bg-hover)}.status-option .user-dot{position:static;flex-shrink:0}.status-text-row{padding:6px 12px;border-top:1px solid var(--border);margin-top:4px;padding-top:8px}.status-text-row input{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:4px 8px;color:var(--text-primary);font-size:12px;outline:0}.status-text-row input:focus{border-color:var(--accent)}.dm-section-label{margin-top:0!important;padding-top:4px}.dm-toggle{display:flex;align-items:center;gap:4px;width:100%;user-select:none;transition:color .15s}.dm-toggle:hover{color:var(--text-secondary)}.dm-toggle-arrow{display:inline-block;transition:transform .2s ease;font-size:10px}.dm-toggle-arrow.collapsed{transform:rotate(-90deg)}.dm-unread-count{font-size:9px;font-weight:700;background:var(--accent);color:#fff;padding:1px 5px;border-radius:8px;margin-left:auto}.dm-item .channel-hash{color:var(--accent)}.dm-category-header{display:flex;align-items:center;gap:4px;padding:4px 10px 2px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted,#888);user-select:none;cursor:pointer;transition:color .15s}.dm-category-header:hover{color:var(--text-secondary)}.dm-category-arrow{display:inline-block;transition:transform .2s ease;font-size:9px}.dm-category-arrow.collapsed{transform:rotate(-90deg)}.user-dm-btn{font-size:12px!important;opacity:0;transition:opacity .15s}.user-item:hover .user-dm-btn{opacity:.7}.user-dm-btn:hover{opacity:1!important}.file-attachment{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;padding:10px 14px;max-width:400px;margin:4px 0}.file-download-link{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--text-primary);transition:color .15s}.file-download-link:hover{color:var(--accent)}.file-icon{font-size:24px;flex-shrink:0}.file-name{font-weight:500;word-break:break-all}.file-size{color:var(--text-muted);font-size:12px;flex-shrink:0}.file-download-arrow{margin-left:auto;font-size:16px;opacity:.5}.file-download-link:hover .file-download-arrow{opacity:1}.file-info{display:flex;align-items:center;gap:6px;margin-bottom:6px;font-size:13px}.file-attachment audio{width:100%;height:32px}.file-video{max-width:100%;max-height:300px;border-radius:4px;margin-top:4px;background:#0a0a0a;object-fit:contain}.file-video-wrap{position:relative;display:inline-block;max-width:100%}.file-download-link.risky-file .file-name{color:var(--error,#e74c3c)}.risky-download-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:10200110;animation:fadeIn .15s ease}.risky-download-modal{background:var(--bg-secondary,#2b2d31);border:1px solid var(--border,#3a3c42);border-radius:12px;padding:28px 32px;max-width:420px;width:90%;text-align:center;box-shadow:0 8px 32px rgba(0,0,0,.5)}.risky-download-icon{font-size:48px;margin-bottom:8px}.risky-download-modal h3{margin:0 0 12px;color:var(--error,#e74c3c);font-size:18px}.risky-download-modal p{margin:0 0 8px;color:var(--text-primary,#dbdee1);font-size:14px;word-break:break-all}.risky-download-desc{color:var(--text-muted,#949ba4)!important;font-size:13px!important;line-height:1.5;word-break:normal!important}.risky-download-actions{display:flex;gap:10px;justify-content:center;margin-top:20px}.risky-download-cancel{padding:8px 20px;border-radius:6px;border:1px solid var(--border,#3a3c42);background:var(--bg-tertiary,#232428);color:var(--text-primary,#dbdee1);cursor:pointer;font-size:14px;transition:background .15s}.risky-download-cancel:hover{background:var(--bg-primary,#1e1f22)}.risky-download-confirm{padding:8px 20px;border-radius:6px;border:none;background:var(--error,#e74c3c);color:#fff;cursor:pointer;font-size:14px;font-weight:600;transition:filter .15s}.risky-download-confirm:hover{filter:brightness(1.15)}.user-bar{position:relative}.sub-channel-item{padding:3px 16px 3px 38px!important}.sub-channel-item .channel-hash{font-size:12px;opacity:.55}.sub-channel-item .channel-name{font-size:12px;opacity:.8}.private-channel .channel-name{opacity:.65;font-style:italic}.private-channel .channel-hash{font-size:12px}.sub-panel-parent-section{margin-bottom:16px}.sub-panel-parent-section:last-child{margin-bottom:0}.sub-panel-parent-header{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;opacity:.5;margin:0 0 8px;font-weight:600}.sub-panel-group-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;opacity:.4;margin:8px 0 4px;font-weight:600;color:var(--accent,#7289da)}.sub-panel-group-label.unsubbed{color:var(--text-muted,#72767d)}.sub-panel-grid{display:flex;flex-wrap:wrap;gap:6px}.sub-panel-tile{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:6px;background:rgba(255,255,255,.04);cursor:pointer;transition:background .15s,opacity .15s;min-width:0;max-width:100%}.sub-panel-tile:hover{background:rgba(255,255,255,.08)}.sub-panel-tile.subbed{border-left:2px solid var(--accent,#7289da)}.sub-panel-tile.unsubbed{opacity:.5;border-left:2px solid transparent}.sub-panel-tile.unsubbed:hover{opacity:.75}.sub-panel-tile-name{font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sub-panel-toggle{display:flex;align-items:center;gap:4px;cursor:pointer;flex-shrink:0}.sub-panel-toggle input[type=checkbox]{display:none}.sub-panel-toggle-label{font-size:.85rem;user-select:none}.sub-panel-badge{font-size:.65rem;font-weight:700;background:var(--accent,#7289da);color:#fff;padding:1px 5px;border-radius:8px;flex-shrink:0;min-width:16px;text-align:center}.user-role-badge{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:1px 5px;border-radius:3px;background:rgba(255,255,255,.06);margin-left:4px;white-space:nowrap;flex-shrink:0;display:none}.msg-role-badge{font-size:9px;vertical-align:middle;margin-left:4px;display:none}.admin-msg-badge{display:none}.sub-tier-badge{display:inline-block;font-size:13px;line-height:1;vertical-align:middle;filter:drop-shadow(0 0 5px rgba(255, 255, 255, .3)) drop-shadow(0 0 2px rgba(0, 0, 0, .4))}.sub-tier-badge--list{font-size:19px;filter:drop-shadow(0 0 4px rgba(255, 255, 255, .35)) drop-shadow(0 0 1px rgba(0, 0, 0, .4))}.crown-badge-img{display:inline-block;width:27px;height:20px;object-fit:contain;vertical-align:middle;filter:drop-shadow(0 0 1px rgba(0, 0, 0, .4)) brightness(1.08)}.bot-badge{display:inline-block;font-size:8px;font-weight:700;letter-spacing:.3px;padding:2px 4px;border-radius:2px;background:var(--accent-color,#5865f2);color:#fff;vertical-align:middle;margin-left:4px;flex-shrink:0}.webhook-message .message-avatar{border:2px solid var(--accent-color,#5865f2)}.webhook-item{background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;padding:10px;margin-bottom:8px}.webhook-item-header{display:flex;align-items:center;gap:8px;margin-bottom:6px}.webhook-item-name{font-weight:600;font-size:13px;color:var(--text-primary)}.webhook-item-channel{font-size:12px;color:var(--text-muted);background:var(--bg-tertiary);padding:1px 6px;border-radius:4px}.webhook-item-status{font-size:11px;font-weight:600;margin-left:auto}.webhook-item-status.status-online{color:#2ecc71}.webhook-item-status.status-offline{color:#e74c3c}.webhook-item-url{display:flex;align-items:center;gap:6px;margin-bottom:6px}.webhook-url-text{font-size:10px;font-family:monospace;color:var(--text-muted);background:var(--bg-primary);padding:3px 6px;border-radius:4px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:all}.webhook-item-actions{display:flex;gap:6px}.btn-xs{padding:2px 8px;font-size:11px;border-radius:4px;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.btn-xs:hover{background:var(--bg-hover);color:var(--text-primary)}.channel-collapse-arrow{display:flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:10px;color:var(--text-muted);cursor:pointer;user-select:none;flex-shrink:0;transition:transform .15s ease,color .15s;position:absolute;left:2px;top:50%;transform:translateY(-50%)}.channel-collapse-arrow:hover{color:var(--accent)}.channel-collapse-arrow.collapsed{transform:translateY(-50%) rotate(-90deg)}.cat-collapse-arrow{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;font-size:10px;color:inherit;transition:transform .15s ease;flex-shrink:0}.cat-collapse-arrow.collapsed{transform:rotate(-90deg)}.role-editor-layout{display:flex;gap:0;min-height:420px;max-height:65vh;margin:16px 0;background:var(--bg-tertiary,#252840);border-radius:12px;overflow:hidden}.role-sidebar{width:200px;background:var(--bg-secondary,#1e2035);border-right:1px solid var(--border,#2d3050);padding:16px 12px;flex-shrink:0;display:flex;flex-direction:column}.role-list-sidebar{display:flex;flex-direction:column;gap:6px;max-height:calc(100% - 50px);overflow-y:auto;padding-right:4px}.role-sidebar-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;transition:all .15s ease;background:0 0;border:1px solid transparent}.role-sidebar-item:hover{background:var(--bg-hover,#2c2f4a);border-color:var(--border,#2d3050)}.role-sidebar-item.active{background:var(--accent,#7c5cfc);color:#fff;box-shadow:0 2px 8px rgba(124,92,252,.3)}.role-color-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;box-shadow:0 0 6px currentColor;vertical-align:middle}.role-detail{flex:1;min-width:0;overflow-y:auto;padding:20px;background:var(--bg-tertiary,#252840)}.role-detail-form{display:flex;flex-direction:column;gap:20px}.role-form-header{display:flex;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--border,#2d3050)}.role-preview-avatar{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.3)}.role-preview-info{display:flex;flex-direction:column;gap:4px}.role-preview-name{font-size:18px;font-weight:600}.role-preview-level{font-size:12px;color:var(--text-muted,#5d6180);text-transform:uppercase;letter-spacing:1px}.role-form-section{display:flex;flex-direction:column;gap:8px}.role-form-section.flex-1{flex:1}.role-form-row{display:flex;gap:16px;align-items:flex-end}.form-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted,#5d6180);margin-bottom:4px}.form-hint{font-size:11px;color:var(--text-muted,#5d6180);margin-top:4px;line-height:1.4}.form-section-title{font-size:13px;font-weight:600;color:var(--text-secondary,#9498b3);margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--border,#2d3050)}.color-picker-wrapper{display:flex;align-items:center;gap:8px}.color-picker-input{width:48px;height:36px;border:none;border-radius:8px;cursor:pointer;background:0 0;padding:0}.color-picker-input::-webkit-color-swatch-wrapper{padding:0}.color-picker-input::-webkit-color-swatch{border:2px solid var(--border,#2d3050);border-radius:6px}.permissions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;padding:12px;background:var(--bg-secondary,#1e2035);border-radius:10px;border:1px solid var(--border,#2d3050)}.permission-toggle{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg-tertiary,#252840);border-radius:6px;cursor:pointer;transition:background .15s}.permission-toggle:hover{background:var(--bg-hover,#2c2f4a)}.permission-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent,#7c5cfc);cursor:pointer}.permission-label{font-size:12px;color:var(--text-primary,#e2e4f0)}.role-channel-access-panel{background:var(--bg-secondary,#1e2035);border-radius:8px;padding:12px;border:1px solid var(--border,#2d3050)}.role-channel-access-list{max-height:150px;overflow-y:auto;margin-bottom:12px}.role-channel-item{display:flex;align-items:center;gap:8px;padding:8px;border-radius:6px;font-size:13px;cursor:pointer}.role-channel-item:hover{background:var(--bg-hover,#2c2f4a)}.rca-reapply-btn{width:100%}.role-editor-layout .form-input{width:100%;padding:10px 12px;background:var(--bg-input,#15172a);border:1px solid var(--border,#2d3050);border-radius:8px;color:var(--text-primary,#e2e4f0);font-size:14px;transition:all .15s ease;outline:0}.role-editor-layout .form-input:focus{border-color:var(--accent,#7c5cfc);box-shadow:0 0 0 3px rgba(124,92,252,.2)}.role-editor-layout .form-input::placeholder{color:var(--text-muted,#5d6180)}.role-editor-layout .form-select{width:100%;padding:10px 12px;background:var(--bg-input,#15172a);border:1px solid var(--border,#2d3050);border-radius:8px;color:var(--text-primary,#e2e4f0);font-size:14px;cursor:pointer;outline:0;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239498b3' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}.role-editor-layout .form-select:focus{border-color:var(--accent,#7c5cfc);box-shadow:0 0 0 3px rgba(124,92,252,.2)}.role-editor-layout .toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bg-secondary,#1e2035);border-radius:8px;cursor:pointer;font-size:13px;color:var(--text-primary,#e2e4f0);transition:background .15s}.role-editor-layout .toggle-row:hover{background:var(--bg-hover,#2c2f4a)}.role-editor-layout .toggle-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent,#7c5cfc);cursor:pointer}.role-preview-item{display:flex;align-items:center;gap:6px;padding:4px 0;font-size:13px}.donate-btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;background:0 0;border:none;padding:0;font-size:inherit}.donate-btn:hover{filter:brightness(1.2)}.donors-modal-box{position:relative;max-width:500px;width:92%;max-height:80vh;padding:36px 32px 28px;text-align:center;border-radius:16px;background:var(--bg-secondary,#2b2d31);box-shadow:0 8px 32px rgba(0,0,0,.45);animation:donorsSlideIn .3s ease;overflow-y:auto}@keyframes donorsSlideIn{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.donors-close-btn{position:absolute;top:12px;right:16px;background:0 0;border:none;color:var(--text-muted,#888);font-size:22px;cursor:pointer;padding:4px 8px;border-radius:6px;line-height:1;transition:color .15s,background .15s}.donors-close-btn:hover{color:var(--text-primary,#fff);background:rgba(255,255,255,.08)}.donors-heart-icon{font-size:48px;margin-bottom:8px;animation:donorsPulse 1.5s ease-in-out infinite}@keyframes donorsPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}.donors-title{font-size:26px;font-weight:700;color:var(--text-primary,#fff);margin:0 0 8px}.donors-subtitle{color:var(--text-muted,#aaa);font-size:13.5px;line-height:1.5;margin:0 0 20px;padding:0 8px}.donors-tiers{display:flex;flex-direction:column;gap:20px;margin-bottom:4px}.donors-tier{display:flex;flex-direction:column;text-align:center}.donors-tier-title{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;margin:0 0 10px;flex-shrink:0}.donors-tier-title::after,.donors-tier-title::before{content:'';flex:1;height:1px;background:rgba(255,255,255,.1)}.donors-sponsor-title{color:#f8c53a}.donors-donor-title{color:#f0a040}.donors-grid{display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;gap:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:14px 14px;max-height:140px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}.donor-chip{background:rgba(255,255,255,.06);padding:5px 14px;border-radius:20px;font-size:13px;color:var(--text-primary,#ddd);border:1px solid rgba(255,255,255,.08);transition:background .15s,border-color .15s}.donor-chip:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15)}.donor-chip.donor-sponsor{border-color:rgba(248,197,58,.3);background:rgba(248,197,58,.08);color:#f8c53a;font-weight:600}.donors-note{color:var(--text-muted,#777);font-size:11.5px;margin:14px 0 18px;font-style:italic}.donors-sort-toggle{display:flex;justify-content:center;gap:4px;margin:10px 0 6px}.donors-sort-btn{padding:5px 14px;border-radius:8px;border:1px solid var(--border-color,#444);background:0 0;color:var(--text-muted,#999);font-size:12px;cursor:pointer;transition:background .15s,color .15s}.donors-sort-btn:hover{background:var(--bg-hover,rgba(255,255,255,.06))}.donors-sort-btn.active{background:var(--accent-color,#5865f2);color:#fff;border-color:transparent}.donors-kofi-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 24px;border-radius:10px;background:linear-gradient(135deg,#ff5e5b 0,#e24444 100%);color:#fff;font-size:14px;font-weight:600;text-decoration:none;transition:transform .15s,box-shadow .15s;box-shadow:0 3px 12px rgba(226,68,68,.35)}.donors-kofi-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(226,68,68,.45)}.density-picker{display:flex;gap:8px;padding:8px 0}.density-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px;background:var(--bg-primary);border:2px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);cursor:pointer;transition:all .2s;font-size:12px}.density-btn:hover{background:var(--bg-hover);border-color:var(--text-muted)}.density-btn.active{border-color:var(--accent);color:var(--text-primary);background:var(--bg-hover)}.density-icon{font-size:18px}.density-label{font-weight:600}[data-density=compact] .message-row{padding:0;gap:8px}[data-density=compact] .message-avatar,[data-density=compact] .message-avatar-img{width:28px;height:28px;font-size:11px}[data-density=compact] .message-compact{padding:4px 8px}[data-density=compact] .message-compact .compact-time{font-size:9px}[data-density=compact] .message-content{font-size:13px}[data-density=compact] .message-author{font-size:12px}[data-density=compact] .message-time{font-size:10px}[data-density=spacious] .message-row{padding:0;gap:14px}[data-density=spacious] .message-avatar,[data-density=spacious] .message-avatar-img{width:44px;height:44px;font-size:17px}[data-density=spacious] .message-compact{padding:4px 8px}[data-density=spacious] .message-content{font-size:15px;line-height:1.5}[data-density=spacious] .message-author{font-size:14px}.font-size-picker{display:flex;gap:8px;padding:8px 0}[data-fontsize=small] .message-content{font-size:11px;line-height:1.35}[data-fontsize=small] .message-author{font-size:11px}[data-fontsize=small] .message-time{font-size:8.5px}[data-fontsize=small] .message-input{font-size:11px}[data-fontsize=small] .ch-name,[data-fontsize=small] .channel-item span{font-size:11px}[data-fontsize=small] .user-list-item span{font-size:11px}[data-fontsize=small] .sidebar-title{font-size:9px}[data-fontsize=small] .user-item-name{font-size:11px}[data-fontsize=small] .section-label{font-size:9px}[data-fontsize=small] .panel-title{font-size:9px}[data-fontsize=small] .current-user{font-size:11px}[data-fontsize=small] .login-name{font-size:8.5px}[data-fontsize=small] .settings-section-title{font-size:11px}[data-fontsize=small] .settings-section-subtitle{font-size:10.5px}[data-fontsize=small] .muted-text{font-size:10px}[data-fontsize=small] .channel-info{font-size:11px}[data-fontsize=small] .density-label{font-size:10px}[data-fontsize=small] .modal-body,[data-fontsize=small] .modal-title{font-size:11px}[data-fontsize=small] .inline-code,[data-fontsize=small] code{font-size:10.5px}[data-fontsize=small] .compact-time{font-size:8px}[data-fontsize=large] .message-content{font-size:18px;line-height:1.55}[data-fontsize=large] .message-author{font-size:16px}[data-fontsize=large] .message-time{font-size:12.5px}[data-fontsize=large] .message-input{font-size:17px}[data-fontsize=large] .ch-name,[data-fontsize=large] .channel-item span{font-size:16px}[data-fontsize=large] .user-list-item span{font-size:16px}[data-fontsize=large] .sidebar-title{font-size:13px}[data-fontsize=large] .user-item-name{font-size:16px}[data-fontsize=large] .section-label{font-size:13px}[data-fontsize=large] .panel-title{font-size:13px}[data-fontsize=large] .current-user{font-size:16px}[data-fontsize=large] .login-name{font-size:12px}[data-fontsize=large] .settings-section-title{font-size:17px}[data-fontsize=large] .settings-section-subtitle{font-size:15px}[data-fontsize=large] .muted-text{font-size:15px}[data-fontsize=large] .channel-info{font-size:16px}[data-fontsize=large] .density-label{font-size:14px}[data-fontsize=large] .modal-body,[data-fontsize=large] .modal-title{font-size:17px}[data-fontsize=large] .inline-code,[data-fontsize=large] code{font-size:16px}[data-fontsize=large] .message-input-area{min-height:48px}[data-fontsize=large] .compact-time{font-size:11px}[data-fontsize=x-large] .message-content{font-size:22px;line-height:1.6}[data-fontsize=x-large] .message-author{font-size:19px}[data-fontsize=x-large] .message-time{font-size:14px}[data-fontsize=x-large] .message-input{font-size:21px}[data-fontsize=x-large] .ch-name,[data-fontsize=x-large] .channel-item span{font-size:19px}[data-fontsize=x-large] .user-list-item span{font-size:19px}[data-fontsize=x-large] .sidebar-title{font-size:15px}[data-fontsize=x-large] .message-input-area{min-height:56px}[data-fontsize=x-large] .user-item-name{font-size:19px}[data-fontsize=x-large] .section-label{font-size:15px}[data-fontsize=x-large] .panel-title{font-size:15px}[data-fontsize=x-large] .current-user{font-size:19px}[data-fontsize=x-large] .login-name{font-size:14px}[data-fontsize=x-large] .settings-section-title{font-size:20px}[data-fontsize=x-large] .settings-section-subtitle{font-size:18px}[data-fontsize=x-large] .muted-text{font-size:17px}[data-fontsize=x-large] .channel-info{font-size:19px}[data-fontsize=x-large] .density-label{font-size:16px}[data-fontsize=x-large] .modal-body,[data-fontsize=x-large] .modal-title{font-size:21px}[data-fontsize=x-large] .inline-code,[data-fontsize=x-large] code{font-size:19px}[data-fontsize=x-large] .compact-time{font-size:12.5px}[data-fontsize=small] .settings-hint{font-size:8.5px}[data-fontsize=small] .settings-nav-item{font-size:10px}[data-fontsize=small] .settings-nav-group{font-size:8.5px}[data-fontsize=small] .btn-sm{font-size:10px}[data-fontsize=small] .btn-sm.btn-accent,[data-fontsize=small] .btn-sm.btn-danger{font-size:13px}[data-fontsize=small] .select-row,[data-fontsize=small] .toggle-row,[data-fontsize=small] .volume-row{font-size:10px}[data-fontsize=small] .select-row select{font-size:9.5px}[data-fontsize=small] .settings-text-input{font-size:11px}[data-fontsize=small] .settings-number-input{font-size:10px}[data-fontsize=small] .custom-sound-name{font-size:11px}[data-fontsize=small] .password-change-form input{font-size:11px}[data-fontsize=small] .status-bar{font-size:10px}[data-fontsize=small] .status-bar .label,[data-fontsize=small] .status-bar .value{font-size:10px}[data-fontsize=small] .context-menu{font-size:11px}[data-fontsize=small] .online-overlay-title{font-size:9px}[data-fontsize=large] .settings-hint{font-size:13px}[data-fontsize=large] .settings-nav-item{font-size:15px}[data-fontsize=large] .settings-nav-group{font-size:12px}[data-fontsize=large] .btn-sm{font-size:15px}[data-fontsize=large] .btn-sm.btn-accent,[data-fontsize=large] .btn-sm.btn-danger{font-size:18px}[data-fontsize=large] .select-row,[data-fontsize=large] .toggle-row,[data-fontsize=large] .volume-row{font-size:15px}[data-fontsize=large] .select-row select{font-size:14px}[data-fontsize=large] .settings-text-input{font-size:16px}[data-fontsize=large] .settings-number-input{font-size:15px}[data-fontsize=large] .custom-sound-name{font-size:16px}[data-fontsize=large] .password-change-form input{font-size:16px}[data-fontsize=large] .status-bar{font-size:14px}[data-fontsize=large] .status-bar .label,[data-fontsize=large] .status-bar .value{font-size:14px}[data-fontsize=large] .context-menu{font-size:16px}[data-fontsize=large] .online-overlay-title{font-size:14px}[data-fontsize=x-large] .settings-hint{font-size:15px}[data-fontsize=x-large] .settings-nav-item{font-size:17px}[data-fontsize=x-large] .settings-nav-group{font-size:14px}[data-fontsize=x-large] .btn-sm{font-size:17px}[data-fontsize=x-large] .btn-sm.btn-accent,[data-fontsize=x-large] .btn-sm.btn-danger{font-size:21px}[data-fontsize=x-large] .select-row,[data-fontsize=x-large] .toggle-row,[data-fontsize=x-large] .volume-row{font-size:17px}[data-fontsize=x-large] .select-row select{font-size:16px}[data-fontsize=x-large] .settings-text-input{font-size:19px}[data-fontsize=x-large] .settings-number-input{font-size:17px}[data-fontsize=x-large] .custom-sound-name{font-size:19px}[data-fontsize=x-large] .password-change-form input{font-size:19px}[data-fontsize=x-large] .status-bar{font-size:16px}[data-fontsize=x-large] .status-bar .label,[data-fontsize=x-large] .status-bar .value{font-size:16px}[data-fontsize=x-large] .context-menu{font-size:19px}[data-fontsize=x-large] .online-overlay-title{font-size:16px}.status-online-trigger{cursor:pointer;border-radius:4px;padding:2px 6px;margin:-2px -6px;transition:background .15s}.status-online-trigger:hover{background:rgba(255,255,255,.08)}.online-overlay{position:fixed;z-index:10200060;width:220px;max-height:350px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 -4px 24px rgba(0,0,0,.4);display:flex;flex-direction:column;overflow:hidden}.online-overlay-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--border)}.online-overlay-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted)}.online-overlay-list{overflow-y:auto;padding:6px 0;max-height:300px}.online-overlay-group{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);padding:6px 12px 4px}.online-overlay-group.offline{opacity:.6}.online-overlay-user{display:flex;align-items:center;gap:8px;padding:4px 12px;font-size:13px}.online-overlay-user.offline{opacity:.45}.online-overlay-user:hover{background:rgba(255,255,255,.04)}.online-overlay-avatar,.online-overlay-avatar-img{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff}.online-overlay-avatar-img{object-fit:cover}.online-overlay-username{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500;color:var(--text-primary)}.online-overlay-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.online-overlay-status-dot.online{background:#43b581}.online-overlay-status-dot.offline{background:#72767d}.sidebar-mod-container{display:flex;flex-direction:column;min-height:0;flex:1}.mod-mode-active .mod-draggable{cursor:move;position:relative;outline:1px dashed transparent;transition:outline-color .15s ease,background-color .15s ease}.mod-mode-active .mod-draggable:hover{outline-color:var(--accent);background:color-mix(in srgb,var(--bg-secondary) 82%,var(--accent) 18%)}.mod-mode-active .mod-drag-over{outline-color:var(--accent)}.mod-mode-active .mod-drop-above::before,.mod-mode-active .mod-drop-below::after{content:'';position:absolute;left:10px;right:10px;height:2px;background:var(--accent);border-radius:2px}.mod-mode-active .mod-drop-above::before{top:2px}.mod-mode-active .mod-drop-below::after{bottom:2px}.mod-mode-active .mod-dragging{opacity:.6}.mod-panel-target{position:relative}.mod-panel-handle{position:absolute;top:8px;right:8px;width:24px;height:24px;border:1px solid var(--border-light);background:var(--bg-card);color:var(--text-secondary);border-radius:6px;cursor:grab;z-index:40;font-size:14px;display:none}.mod-mode-on .mod-panel-handle{display:inline-flex;align-items:center;justify-content:center}.mod-panel-handle.dragging{cursor:grabbing;opacity:.8}.mod-snap-zone{position:fixed;z-index:10200061;pointer-events:auto;border:2px dashed var(--accent);color:var(--text-primary);background:color-mix(in srgb,var(--bg-secondary) 76%,var(--accent) 24%);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.mod-snap-zone.active{background:color-mix(in srgb,var(--bg-secondary) 56%,var(--accent) 44%)}.mod-snap-zone.left{left:0;top:0;width:80px;height:100vh}.mod-snap-zone.right{right:0;top:0;width:80px;height:100vh}.mod-snap-zone.top{left:0;top:0;width:100vw;height:56px}.mod-snap-zone.bottom{left:0;bottom:0;width:100vw;height:56px}.mod-snap-zone.center{left:50%;top:50%;width:160px;height:80px;transform:translate(-50%,-50%);border-radius:12px}.mod-snap-zone.right-sidebar{right:0;top:30%;width:80px;height:40vh;border-radius:8px 0 0 8px}.mod-snap-zone.left-sidebar{left:0;top:30%;width:80px;height:40vh;border-radius:0 8px 8px 0}#app[data-status-pos=top] #status-bar{order:-1;border-top:none;border-bottom:1px solid var(--border)}#app[data-status-pos=bottom] #status-bar{order:10;border-top:1px solid var(--border);border-bottom:none}#app-body .server-bar[data-panel-pos=right]{order:5;border-right:none;border-left:1px solid var(--border)}#app-body .sidebar[data-panel-pos=right]{order:4;border-right:none;border-left:1px solid var(--border)}#app-body .server-bar[data-panel-pos=left]{order:0}#app-body .sidebar[data-panel-pos=left]{order:1}#app-body .main{order:2}#app-body .right-sidebar{order:3}#app-body .right-sidebar[data-panel-pos=left]{order:1;border-left:none;border-right:1px solid var(--border)}#app-body .right-sidebar[data-panel-pos=left] .right-sidebar-resize-handle{left:auto;right:-3px;cursor:col-resize}#app-body .right-sidebar[data-panel-pos=right]{order:3}.mod-float{position:fixed!important;z-index:500;border-radius:10px;border:1px solid var(--border-light)!important;box-shadow:0 8px 32px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.04);resize:both;overflow:auto}.right-sidebar.mod-float{top:80px;right:24px;width:280px;height:420px;max-width:50vw;max-height:70vh}.mod-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(12px);opacity:0;z-index:10000;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-size:12px;font-weight:500;box-shadow:0 8px 32px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.3),0 0 0 1px rgba(255,255,255,.05) inset;transition:transform .2s ease,opacity .2s ease}.mod-toast.show{transform:translateX(-50%) translateY(0);opacity:1}.sidebar-split{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}.sidebar-split .channel-section,.sidebar-split .friends-pane{flex:1 1 60%;min-height:80px;overflow:hidden;display:flex;flex-direction:column;padding:6px 10px 0;border-bottom:none}.sidebar-split .channel-section .channel-list{flex:1;min-height:0;overflow-y:auto}.channels-toggle{display:flex;align-items:center;gap:4px;width:100%;transition:color .15s}.channels-toggle:hover{color:var(--text-secondary)}.channels-toggle #organize-channels-btn:hover,.dm-toggle #organize-dms-btn:hover{opacity:1!important;background:var(--bg-hover)}.channels-toggle-arrow{display:inline-block;transition:transform .2s ease;font-size:10px}.channels-toggle-arrow.collapsed{transform:rotate(-90deg)}.sidebar-split-handle{height:0;cursor:row-resize;position:relative;flex-shrink:0;z-index:5;border-top:1px solid var(--border);margin:0 12px;padding:4px 0;box-sizing:content-box;transition:border-color .15s}.btn-poll{background:0 0;border:none;cursor:pointer;font-size:16px;padding:2px 4px;opacity:.7;transition:opacity .15s}.btn-poll:hover{opacity:1}.poll-widget{background:var(--bg-secondary,#2b2d31);border:1px solid var(--border,#3f4147);border-radius:8px;padding:12px;margin-top:6px;max-width:400px}.poll-question{font-weight:600;font-size:.95rem;margin-bottom:8px;color:var(--text-primary,#fff)}.poll-options{display:flex;flex-direction:column;gap:4px}.poll-option{position:relative;display:flex;align-items:center;justify-content:space-between;background:var(--bg-tertiary,#232428);border:1px solid transparent;border-radius:6px;padding:8px 10px;cursor:pointer;overflow:hidden;transition:border-color .15s,background .15s;color:var(--text-primary,#fff);font-size:.875rem;text-align:left;width:100%}.poll-option:hover{border-color:var(--accent,#5865f2)}.poll-option.poll-voted{border-color:var(--accent,#5865f2)}.poll-option-bar{position:absolute;left:0;top:0;height:100%;background:var(--accent,#5865f2);opacity:.15;border-radius:5px;transition:width .3s ease;pointer-events:none}.poll-voted .poll-option-bar{opacity:.25}.poll-option-text{position:relative;z-index:1;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.poll-option-count{position:relative;z-index:1;margin-left:8px;font-size:.8rem;color:var(--text-muted,#949ba4);white-space:nowrap}.poll-footer{margin-top:8px;font-size:.75rem;color:var(--text-muted,#949ba4)}.poll-settings-info{display:inline;font-size:.75rem;color:var(--text-muted,#949ba4)}.poll-options-list{display:flex;flex-direction:column;gap:6px}.poll-option-row{display:flex;gap:6px;align-items:center}.poll-option-row .poll-option-input{flex:1;padding:6px 10px;background:var(--bg-tertiary,#1e1f22);border:1px solid var(--border,#3f4147);border-radius:4px;color:var(--text-primary,#fff);font-size:.875rem}.poll-option-row .poll-option-input:focus{border-color:var(--accent,#5865f2);outline:0}.poll-option-remove{background:0 0;border:none;color:var(--text-muted,#949ba4);cursor:pointer;font-size:18px;padding:2px 6px;border-radius:4px}.poll-option-remove:hover{color:var(--danger,#ed4245);background:rgba(237,66,69,.1)}.poll-settings-row{display:flex;gap:16px;flex-wrap:wrap}.poll-checkbox-label{display:flex;align-items:center;gap:6px;font-size:.875rem;color:var(--text-secondary,#b5bac1);cursor:pointer}.poll-checkbox-label input[type=checkbox]{accent-color:var(--accent,#5865f2)}.sidebar-split-handle.dragging,.sidebar-split-handle:hover{border-color:var(--accent)}.sidebar-split .dm-section-pane{flex:0 1 40%;min-height:60px;overflow:hidden;display:flex;flex-direction:column;padding:0 16px;border-bottom:none;transition:flex .25s ease,min-height .25s ease,opacity .2s ease}.dm-list-scroll{flex:1;min-height:0;overflow-y:auto;padding:4px 0}.organize-toolbar{display:flex;align-items:center;gap:8px;margin:12px 0 8px}.organize-toolbar-label{font-size:.85rem;font-weight:600;color:var(--text-muted);flex-shrink:0}.organize-select{padding:5px 8px;border-radius:var(--radius-sm,6px);border:1px solid var(--border,rgba(255,255,255,.12));background:var(--bg-input,rgba(255,255,255,.06));color:var(--text-primary,#eee);font-size:.82rem;cursor:pointer;outline:0;min-width:0}.organize-select:focus{border-color:var(--accent)}.organize-select option{background:var(--bg-secondary,#1e1e2e);color:var(--text-primary,#eee)}.organize-list{border:1px solid var(--border,rgba(255,255,255,.1));border-radius:8px;max-height:280px;overflow-y:auto;margin:6px 0}.organize-tag-header{display:flex;align-items:center;gap:6px;padding:6px 12px;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;opacity:.5;background:rgba(255,255,255,.02);font-weight:600;user-select:none}.organize-tag-header.selected{background:rgba(107,79,219,.22);opacity:1;cursor:pointer}.organize-tag-header:hover:not(.selected){background:rgba(255,255,255,.04);opacity:.7;cursor:pointer}.organize-tag-header .tag-sort-select{margin-left:auto;padding:1px 4px;font-size:.65rem;border-radius:4px;border:1px solid var(--border,rgba(255,255,255,.1));background:var(--bg-input,rgba(255,255,255,.04));color:var(--text-muted);cursor:pointer;outline:0}.organize-tag-header .tag-sort-select option{background:var(--bg-secondary,#1e1e2e);color:var(--text-primary,#eee)}.organize-item{padding:8px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.04);transition:background .12s}.organize-item:hover{background:rgba(255,255,255,.04)}.organize-item.selected{background:rgba(107,79,219,.22)}.organize-item .organize-tag-badge{opacity:.45;font-size:.72rem;background:rgba(255,255,255,.07);padding:1px 7px;border-radius:4px;flex-shrink:0;white-space:nowrap}.organize-drill-hint{font-size:.65rem;opacity:.3;flex-shrink:0;margin-left:2px;transition:opacity .12s}.organize-has-subs:hover .organize-drill-hint{opacity:.8}.organize-has-subs{cursor:default}.organize-has-subs:hover{background:rgba(255,255,255,.06)}.organize-controls{display:flex;gap:6px;align-items:center;margin:8px 0;flex-wrap:wrap}.organize-spacer{flex:1;min-width:8px}.organize-tag-group{display:flex;gap:5px;align-items:center}.organize-tag-input{width:110px;height:30px;font-size:.82rem;padding:4px 10px;border-radius:var(--radius-sm,6px);border:1px solid var(--border,rgba(255,255,255,.12));background:var(--bg-input,rgba(255,255,255,.06));color:var(--text-primary,#eee);outline:0;transition:border-color .15s}.organize-tag-input:focus{border-color:var(--accent)}.organize-tag-input::placeholder{color:var(--text-muted,#888);opacity:.5}.organize-tag-btn{padding:5px 8px!important;font-size:.78rem!important}.organize-tag-btn.danger{color:var(--danger,#f44)!important}.channel-roles-layout{display:flex;gap:16px;max-height:62vh;min-height:280px}.channel-roles-left{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden;min-height:0}.channel-roles-right{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden;min-height:0;border-left:1px solid var(--border,rgba(255,255,255,.1));padding-left:16px}.channel-roles-section-title{font-size:.72rem;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted,#888);margin:0 0 6px;font-weight:600}.channel-roles-member-list{display:flex;flex-direction:column;gap:2px;overflow-y:auto;flex:1;min-height:0;padding:2px 0}.channel-roles-member{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:var(--radius-sm,6px);cursor:pointer;transition:background .12s;user-select:none}.channel-roles-member:hover{background:rgba(255,255,255,.06)}.channel-roles-member.selected{background:rgba(var(--accent-rgb,88,101,242),.18);outline:1px solid var(--accent)}.channel-roles-member-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;background:var(--bg-floating,#333);flex-shrink:0;margin-top:2px}.channel-roles-member-avatar.square{border-radius:6px}.channel-roles-member-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.channel-roles-member-name{font-size:.88rem;font-weight:500;color:var(--text-primary,#eee);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-roles-member-login{font-size:.72rem;color:var(--text-muted,#888)}.channel-roles-no-role{font-size:.72rem;color:var(--text-muted);font-style:italic}.channel-roles-member-badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}.channel-roles-badge{display:inline-flex;align-items:center;gap:4px;font-size:.7rem;padding:2px 8px;border-radius:9px;background:rgba(255,255,255,.08);color:var(--text-primary,#eee);white-space:nowrap;position:relative}.channel-roles-badge.badge-admin{background:rgba(231,76,60,.2);color:#e74c3c}.channel-roles-badge .badge-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.channel-roles-badge .badge-scope{font-size:.6rem;opacity:.6;margin-left:2px}.channel-roles-badge .revoke-btn{cursor:pointer;opacity:0;margin-left:4px;font-size:.7rem;transition:opacity .15s}.channel-roles-badge:hover .revoke-btn{opacity:.6}.channel-roles-badge .revoke-btn:hover{opacity:1;color:var(--danger,#f44)}.channel-roles-actions{border-top:1px solid var(--border,rgba(255,255,255,.1));padding-top:10px}.channel-roles-selected-name{font-size:.88rem;margin:0 0 6px;color:var(--text-primary,#eee)}.channel-roles-current{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px;min-height:22px}.channel-roles-assign-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.channel-roles-assign-row .organize-select{flex:1;min-width:120px}.channel-roles-no-members{text-align:center;padding:24px;color:var(--text-muted,#888);font-size:.88rem}.channel-roles-role-list{display:flex;flex-direction:column;gap:2px;overflow-y:auto;max-height:150px;flex-shrink:0;padding:2px 0}.channel-roles-role-item{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--radius-sm,6px);cursor:pointer;transition:background .12s;user-select:none;font-size:.84rem;color:var(--text-primary,#eee)}.channel-roles-role-item:hover{background:rgba(255,255,255,.06)}.channel-roles-role-item.active{background:rgba(var(--accent-rgb,88,101,242),.18);outline:1px solid var(--accent)}.channel-roles-role-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-roles-role-level{font-size:.7rem;color:var(--text-muted,#888);flex-shrink:0}.channel-roles-role-detail{margin-top:8px;border-top:1px solid var(--border,rgba(255,255,255,.1));padding-top:8px;overflow-y:auto;flex:1;min-height:0}.cr-role-form{display:flex;flex-direction:column;gap:4px}.cr-role-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted,#888);font-weight:600;margin-bottom:2px}.cr-role-inline{display:flex;gap:12px;align-items:flex-end}.cr-role-inline>div{display:flex;flex-direction:column;gap:2px}.cr-role-perms{display:flex;flex-direction:column;gap:1px;max-height:180px;overflow-y:auto;padding:2px 0}.cr-perm-toggle{display:flex;align-items:center;gap:6px;padding:3px 4px;font-size:.78rem;color:var(--text-primary,#eee);cursor:pointer;border-radius:var(--radius-sm,4px);transition:background .1s}.cr-perm-toggle:hover{background:rgba(255,255,255,.05)}.cr-perm-toggle input[type=checkbox]{accent-color:var(--accent);width:14px;height:14px;cursor:pointer}.cr-role-btns{display:flex;gap:6px;margin-top:6px}@media (max-width:640px){.channel-roles-layout{flex-direction:column;max-height:70vh}.channel-roles-right{border-left:none;border-top:1px solid var(--border,rgba(255,255,255,.1));padding-left:0;padding-top:12px}}.assign-role-field-label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted,#888);font-weight:600;margin-bottom:4px}.assign-role-hint{font-size:.75rem;color:var(--text-muted,#888);margin:0 0 6px;opacity:.7;line-height:1.3}.assign-role-select{width:100%;padding:8px 10px;font-size:.88rem}.assign-role-select option{padding:4px 8px}.server-icon-upload-area{display:flex;align-items:flex-start;gap:12px;margin-top:8px}.server-icon-preview{width:52px;height:52px;border-radius:12px;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border:2px solid var(--border)}.server-icon-preview img{width:100%;height:100%;object-fit:cover}.server-icon-preview .server-icon-text{font-size:22px;color:var(--accent)}.server-icon-upload-controls{display:flex;flex-direction:column;gap:2px}.server-bar .server-icon.home img{width:100%;height:100%;border-radius:inherit;object-fit:cover}.import-format-info{background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;padding:8px 12px;margin-bottom:12px;font-size:12px}.import-format-row{margin:3px 0}.import-dropzone{border:2px dashed var(--border);border-radius:8px;padding:32px 16px;text-align:center;cursor:pointer;transition:border-color .2s,background .2s}.import-dropzone.drag-over,.import-dropzone:hover{border-color:var(--accent-color,#5865f2);background:color-mix(in srgb,var(--accent-color,#5865f2) 8%,transparent)}.import-dropzone-content{display:flex;flex-direction:column;align-items:center;gap:4px}.import-dropzone-icon{font-size:28px}.import-dropzone a{color:var(--accent-color,#5865f2);text-decoration:underline}.import-progress-bar{height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden;margin-top:10px}.import-progress-fill{height:100%;width:0%;background:var(--accent-color,#5865f2);border-radius:3px;transition:width .3s}.import-info-bar{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;font-size:13px}.import-format-badge{display:inline-block;font-size:10px;font-weight:700;padding:2px 6px;border-radius:3px;background:#5865f2;color:#fff;letter-spacing:.3px}.import-format-badge.official{background:#57f287;color:#000}.import-channel-list{max-height:300px;overflow-y:auto;border:1px solid var(--border);border-radius:6px;margin-top:8px}.import-channel-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border-bottom:1px solid var(--border);font-size:13px}.import-channel-row:last-child{border-bottom:none}.import-channel-row label{display:flex;align-items:center;gap:6px;flex:1;min-width:0;cursor:pointer}.import-channel-row .import-ch-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-channel-row .import-ch-name input[type=text]{width:100%;padding:2px 6px;font-size:12px;background:var(--bg-primary);border:1px solid var(--border);border-radius:4px;color:var(--text-primary)}.import-channel-row .import-ch-count{font-size:11px;color:var(--text-muted);white-space:nowrap}.import-tabs{display:flex;gap:4px;margin-bottom:12px;border-bottom:1px solid var(--border)}.import-tab{background:0 0;border:none;padding:6px 14px;font-size:12px;color:var(--text-muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s,border-color .2s}.import-tab:hover{color:var(--text-primary)}.import-tab.active{color:var(--accent-color,#5865f2);border-bottom-color:var(--accent-color,#5865f2)}.import-token-input{flex:1;padding:6px 10px;font-size:12px;background:var(--bg-primary);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:monospace}.import-token-help{margin-top:8px;font-size:12px}.import-token-help summary{cursor:pointer;color:var(--text-muted);font-size:11px}.import-token-help summary:hover{color:var(--text-primary)}.import-token-steps{margin-top:8px;padding:10px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;font-size:11px;line-height:1.5}.import-token-steps ol{padding-left:18px;margin:4px 0}.import-token-steps kbd{padding:1px 5px;border:1px solid var(--border);border-radius:3px;background:var(--bg-primary);font-size:10px}.import-token-snippet{display:block;padding:6px 8px;background:var(--bg-primary);border:1px solid var(--border);border-radius:4px;font-size:10px;word-break:break-all;user-select:all;margin-top:4px}.import-server-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;max-height:280px;overflow-y:auto}.import-server-card{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:border-color .2s,background .2s;text-align:left;color:var(--text-primary);font-size:12px}.import-server-card:hover{border-color:var(--accent-color,#5865f2);background:color-mix(in srgb,var(--accent-color,#5865f2) 8%,var(--bg-secondary))}.import-server-icon{width:32px;height:32px;border-radius:50%;flex-shrink:0;object-fit:cover}.import-server-icon-placeholder{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}.import-server-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-channel-category{padding:6px 10px 3px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:1px solid var(--border)}.import-thread-row{padding-left:28px;background:color-mix(in srgb,var(--bg-secondary) 40%,transparent)}.import-type-badge{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;opacity:.6}.discord-badge{display:inline-block;font-size:8px;font-weight:700;letter-spacing:.3px;padding:2px 4px;border-radius:2px;background:#5865f2;color:#fff;vertical-align:middle;margin-left:4px;flex-shrink:0}.imported-message .message-avatar{border:2px solid #5865f2}.role-assign-center-box{max-width:980px!important;width:94vw;max-height:82vh;display:flex;flex-direction:column}.role-assign-center-subtitle{font-size:13px;font-style:normal;color:var(--text-secondary,#9498b3);margin-bottom:14px}.rac-layout{display:flex;border:1px solid var(--border,#333);border-radius:12px;overflow:hidden;flex:1;min-height:360px;max-height:56vh;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}.rac-pane{display:flex;flex-direction:column;overflow:hidden;border-right:1px solid var(--border,#333)}.rac-pane:last-child{border-right:none}.rac-channels-pane,.rac-users-pane{background:var(--bg-secondary,#1e2035)}.rac-users-pane{flex:0 0 230px;min-width:190px}.rac-channels-pane{flex:0 0 230px;min-width:190px}.rac-config-pane{flex:1;min-width:260px;background:var(--bg-tertiary,#252840)}.rac-pane-header{padding:12px 14px;border-bottom:1px solid var(--border,#333);display:flex;flex-direction:column;gap:8px;flex-shrink:0}.rac-pane-title{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--text-muted,#888)}.rac-search{width:100%;padding:8px 10px;font-size:13px;border-radius:8px;border:1px solid var(--border,#444);background:var(--bg-input,#16213e);color:var(--text-primary,#e0e0e0);outline:0;box-sizing:border-box;transition:border-color .15s,box-shadow .15s}.rac-search:focus{border-color:var(--accent,#6b4fdb);box-shadow:0 0 0 3px var(--accent-glow,rgba(124,92,252,.25))}.rac-pane-list{flex:1;overflow-y:auto;padding:6px}.rac-placeholder{padding:28px 14px;text-align:center;color:var(--text-muted,#888);font-size:13px;line-height:1.5}.rac-user-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;transition:background .15s;font-size:13px;margin-bottom:2px}.rac-user-item:hover{background:var(--bg-hover,rgba(255,255,255,.05))}.rac-user-item.active{background:rgba(var(--accent-rgb,107,79,219),.16);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb,107,79,219),.4)}.rac-user-avatar{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.25)}.rac-user-avatar img{width:100%;height:100%;border-radius:inherit;object-fit:cover}.rac-user-info{display:flex;flex-direction:column;overflow:hidden;min-width:0;gap:1px}.rac-user-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;color:var(--text-primary,#e0e0e0)}.rac-user-level{font-size:11px;color:var(--text-muted,#888);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rac-channel-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;cursor:pointer;transition:background .15s;font-size:13px;color:var(--text-secondary,#ccc);margin-bottom:2px}.rac-channel-item:hover{background:var(--bg-hover,rgba(255,255,255,.05))}.rac-channel-item.active{background:rgba(var(--accent-rgb,107,79,219),.16);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb,107,79,219),.4);color:var(--text-primary,#e0e0e0)}.rac-channel-item.rac-server-wide{font-weight:700;border-bottom:1px solid var(--border,#333);margin-bottom:6px;padding-bottom:9px}.rac-channel-item.rac-sub{margin-left:14px;font-size:12.5px;opacity:.92}.rac-channel-icon{opacity:.55;font-size:.8rem;width:14px;text-align:center;flex-shrink:0}.rac-channel-current-role{margin-left:auto;font-size:10.5px;padding:2px 8px;border-radius:20px;background:var(--bg-tertiary,rgba(255,255,255,.06));color:var(--text-secondary,#888);white-space:nowrap;font-weight:600}.rac-channel-item.active .rac-channel-current-role{background:rgba(var(--accent-rgb,107,79,219),.25);color:var(--text-primary,#e0e0e0)}.rac-config-body{flex:1;overflow-y:auto;padding:16px}.rac-config-section{margin-bottom:16px}.rac-config-section:last-child{margin-bottom:0}.rac-config-label{font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;color:var(--text-muted,#888);margin-bottom:6px}.rac-config-row{display:flex;gap:10px;align-items:center;margin-bottom:8px;flex-wrap:wrap}.rac-level-input{width:72px;padding:7px 9px;font-size:13px;border-radius:8px;border:1px solid var(--border,#444);background:var(--bg-input,#16213e);color:var(--text-primary,#e0e0e0);text-align:center;transition:border-color .15s,box-shadow .15s}.rac-level-input:focus{outline:0;border-color:var(--accent,#6b4fdb);box-shadow:0 0 0 3px var(--accent-glow,rgba(124,92,252,.25))}.rac-role-select{flex:1;min-width:160px;padding:8px 10px;font-size:13px;border-radius:8px;border:1px solid var(--border,#444);background:var(--bg-input,#16213e);color:var(--text-primary,#e0e0e0);cursor:pointer;transition:border-color .15s,box-shadow .15s}.rac-role-select:focus{outline:0;border-color:var(--accent,#6b4fdb);box-shadow:0 0 0 3px var(--accent-glow,rgba(124,92,252,.25))}.rac-perms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;padding:10px;background:var(--bg-secondary,#1e2035);border-radius:10px;border:1px solid var(--border,#2d3050)}.rac-perm-item{display:flex;align-items:center;gap:8px;font-size:12px;padding:7px 9px;border-radius:6px;color:var(--text-secondary,#ccc);cursor:pointer;transition:background .15s,color .15s}.rac-perm-item:hover:not(.disabled){background:var(--bg-hover,rgba(255,255,255,.05))}.rac-perm-item input[type=checkbox]{accent-color:var(--accent,#6b4fdb);width:14px;height:14px;flex-shrink:0;cursor:pointer}.rac-perm-item.checked{background:rgba(var(--accent-rgb,107,79,219),.12);color:var(--text-primary,#e0e0e0)}.rac-perm-item.disabled{opacity:.4;pointer-events:none}.rac-current-role{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:20px;border:1px solid var(--border,#2d3050);background:var(--bg-secondary,rgba(255,255,255,.06));font-size:13px;font-weight:600}.rac-current-role .rac-role-dot{width:8px;height:8px;border-radius:50%;box-shadow:0 0 6px currentColor}.rac-changed-badge{font-size:10.5px;padding:2px 8px;border-radius:20px;background:rgba(230,126,34,.15);color:#e67e22;margin-left:8px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}.rac-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.rac-footer-right{display:flex;gap:8px;margin-left:auto}@media (max-width:700px){.rac-layout{flex-direction:column;max-height:62vh}.rac-pane{border-right:none;border-bottom:1px solid var(--border,#333)}.rac-pane:last-child{border-bottom:none}.rac-channels-pane,.rac-users-pane{flex:0 0 auto;max-height:150px}.rac-config-pane{min-height:200px}}@media (max-width:600px){#all-members-modal .modal{width:96vw!important;max-width:96vw!important;padding:14px 10px;max-height:88vh!important}#all-members-modal .modal h3{font-size:16px;margin-bottom:2px}.aml-member-row{padding:6px 8px;gap:8px;flex-wrap:nowrap}.aml-avatar-wrap{width:30px;height:30px}.aml-avatar{width:30px;height:30px}.aml-avatar-default{font-size:12px}.aml-status-dot{width:8px;height:8px;border-width:1.5px}.aml-member-name{font-size:12px;gap:4px}.aml-login-name{font-size:10px}.aml-admin-badge,.aml-banned-badge,.aml-new-badge{font-size:9px;padding:0 4px}.aml-member-meta{gap:4px;font-size:10px;flex-direction:row;flex-wrap:wrap}.aml-role-badge{font-size:9px;padding:0 5px}.aml-member-channels,.aml-member-joined{font-size:9px}.aml-actions{opacity:1;gap:2px}.aml-action-btn{width:26px;height:26px;font-size:12px}}@media (max-width:600px){.role-assign-center-box{width:97vw!important;max-width:97vw!important;padding:12px 8px!important;max-height:92vh!important}.role-assign-center-box h3{font-size:15px;margin-bottom:2px}.role-assign-center-subtitle{font-size:12px;margin-bottom:8px}.rac-pane-header{padding:8px 10px;gap:6px}.rac-pane-title{font-size:10px}.rac-search{padding:6px 8px;font-size:12.5px}.rac-channel-item,.rac-user-item{padding:7px 8px;font-size:12.5px}.rac-perms-grid{grid-template-columns:1fr;gap:4px;padding:8px}.rac-perm-item{font-size:12px;padding:6px 8px}.rac-footer{flex-wrap:wrap;gap:6px}.rac-footer .btn-sm{min-height:36px;font-size:12px;padding:6px 10px}.rac-config-body{padding:10px}.rac-level-input{width:58px;font-size:12.5px}.rac-role-select{font-size:12.5px}}@media (max-width:480px){.reaction-picker{position:fixed!important;left:8px!important;right:8px!important;top:auto!important;bottom:60px!important;width:auto!important;max-width:none!important;justify-content:center;flex-wrap:wrap;gap:4px;padding:8px;border-radius:12px;z-index:10001}.reaction-pick-btn{width:36px;height:36px;font-size:18px}.reaction-full-picker{position:fixed!important;left:8px!important;right:8px!important;bottom:60px!important;top:auto!important;width:auto!important;max-width:none!important;max-height:50vh;z-index:10002}}.sidebar-section.channel-section{transition:padding .2s ease}#channels-pane:has(#channel-list[style*="display: none"]),#channels-pane:has(#channel-list[style*="display:none"]),.sidebar-section.channel-section:has(.channel-list:empty){padding-top:8px;padding-bottom:0}.channels-toggle{margin-bottom:0!important}#channels-pane .section-label{margin-bottom:4px}#channels-pane[style*="flex: 0 0 auto"] .section-label,#channels-pane[style*="flex:0 0 auto"] .section-label{margin-bottom:0}@media (max-width:768px){.mobile-servers-section{padding:4px 16px 4px;border-bottom:1px solid var(--border)}.mobile-servers-section .section-label{margin-bottom:2px;font-size:10px}.mobile-servers-row{padding:3px 0;max-height:44px}.mobile-srv-bubble{width:32px;height:32px;font-size:12px}.mobile-srv-add-btn{width:32px;height:32px;font-size:16px}.mobile-servers-section.start-collapsed .mobile-servers-row{max-height:0;opacity:0;padding:0}.sidebar-section{padding:8px 12px}.sidebar-section.channel-section{padding:6px 12px 0}.sidebar-split .channel-section{padding:6px 12px 0}.sidebar-split .friends-pane{padding:5px 10px 4px}.sidebar-split .dm-section-pane{padding:0 12px}.section-label{margin-bottom:4px;font-size:10px}.sidebar-header{padding:10px 12px}.brand-text{font-size:14px;letter-spacing:2px}}@media (max-width:768px){.right-sidebar{padding-top:48px}.right-sidebar .sidebar-settings-panel{padding-bottom:max(env(safe-area-inset-bottom,0px),8px)}}@media (max-width:600px){.modal{padding-bottom:max(env(safe-area-inset-bottom,0px),20px)!important}#all-members-modal .modal{padding-bottom:max(env(safe-area-inset-bottom,0px),16px)!important}}#msg-more-btn{display:none!important}.msg-dots-btn{display:none;position:static;width:24px;height:24px;border:none;border-radius:4px;background:0 0;color:var(--text-muted);font-size:14px;line-height:1;cursor:pointer;align-items:center;justify-content:center;box-shadow:none;-webkit-tap-highlight-color:transparent;pointer-events:auto;transition:background .15s,color .15s;padding:0;flex-shrink:0;opacity:.6;margin-left:4px}.msg-dots-btn:active{background:rgba(255,255,255,.1);opacity:1}.msg-dots-btn:hover{background:rgba(255,255,255,.1);opacity:1}@media (pointer:coarse){.message .msg-dots-btn,.message-compact .msg-dots-btn{display:flex}.message,.message-compact{position:relative}.msg-selected .msg-dots-btn{display:none!important}}@media (pointer:coarse){.msg-selected .msg-toolbar{position:absolute;top:4px;right:4px;left:auto}.msg-selected{position:relative}.msg-selected.message-compact .compact-time{display:none!important}.msg-selected.message-compact{padding-bottom:22px!important}.msg-selected.message-compact::after{content:attr(data-time-short);display:block;position:absolute;bottom:3px;left:8px;font-size:10px;color:var(--text-muted);opacity:.8;pointer-events:none}}#quick-switcher-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:999998;display:flex;align-items:flex-start;justify-content:center;padding-top:min(20vh,160px)}.quick-switcher-box{background:var(--bg-secondary,#2b2d31);border-radius:var(--radius-lg,12px);width:min(480px,90vw);box-shadow:0 8px 32px rgba(0,0,0,.5);overflow:hidden;border:1px solid var(--border,#3f4147)}#quick-switcher-input{width:100%;padding:14px 16px;font-size:15px;background:0 0;border:none;border-bottom:1px solid var(--border,#3f4147);color:var(--text-primary,#dbdee1);outline:0;box-sizing:border-box}#quick-switcher-input::placeholder{color:var(--text-muted,#949ba4)}#quick-switcher-results{max-height:340px;overflow-y:auto;padding:4px}.quick-switcher-item{display:flex;align-items:center;padding:8px 12px;border-radius:var(--radius-sm,6px);cursor:pointer;color:var(--text-secondary,#b5bac1);font-size:14px;gap:8px}.quick-switcher-item.selected,.quick-switcher-item:hover{background:var(--bg-hover,#35373c);color:var(--text-primary,#dbdee1)}.qs-badge{margin-left:auto;background:var(--danger,#ed4245);color:#fff;font-size:11px;font-weight:700;padding:1px 6px;border-radius:10px;min-width:16px;text-align:center}.server-icon .server-unread-dot{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;background:var(--danger,#ed4245);border-radius:50%;border:2px solid var(--bg-secondary,#2b2d31);pointer-events:none;display:none}.server-icon .server-unread-dot.active{display:block}.move-selection-mode .messages .message,.move-selection-mode .messages .message-compact{cursor:pointer;user-select:none}.move-selection-mode .messages .move-selected{background:var(--accent-alpha,rgba(88,101,242,.15));border-left:3px solid var(--accent,#5865f2);padding-left:calc(var(--msg-padding-left,12px) - 3px)}.move-selection-mode .msg-dots-btn,.move-selection-mode .msg-toolbar{display:none!important}.move-msg-toolbar{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:10px 18px;background:var(--bg-secondary,#2b2d31);border:1px solid var(--border,#3f4147);border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,.4);z-index:1000;font-size:14px;color:var(--text-primary,#dbdee1)}.move-msg-toolbar .btn-sm{min-width:80px}.move-msg-toolbar .btn-sm:disabled{opacity:.5;cursor:not-allowed}.move-msg-channel-list{max-height:300px;overflow-y:auto;margin:12px 0;display:flex;flex-direction:column;gap:2px}.move-msg-channel-item{display:block;width:100%;padding:10px 14px;background:0 0;border:none;border-radius:6px;color:var(--text-primary,#dbdee1);font-size:14px;text-align:left;cursor:pointer;transition:background .15s}.move-msg-channel-item:hover{background:var(--bg-hover,#36373d)}.move-msg-empty{padding:20px;text-align:center;color:var(--text-muted,#949ba4)}.profile-popup-displayname.hard-brand{font-weight:900!important;font-size:20px!important;letter-spacing:2px!important;text-transform:uppercase!important;animation:hard-brand-glow 2s ease-in-out infinite alternate!important}@keyframes hard-brand-glow{0%{text-shadow:0 0 10px rgba(255,255,255,.8),0 0 20px rgba(255,107,107,.6),0 0 30px rgba(78,205,196,.5)}100%{text-shadow:0 0 15px #fff,0 0 25px rgba(255,107,107,.8),0 0 40px rgba(78,205,196,.7),0 0 50px rgba(69,183,209,.6)}}@media (max-width:768px){.profile-popup-displayname.hard-brand{font-size:18px!important;letter-spacing:1.5px!important}}.channels-toggle .section-label-text{display:none}@media (max-width:768px){.channels-toggle .section-label-text{display:flex}}#gif-btn{display:none!important}.emoji-filter-section{background:var(--bg-secondary);border-radius:var(--radius-md);padding:16px;margin-bottom:16px;border:1px solid var(--border)}.emoji-search-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}.emoji-search-bar{flex:1;position:relative;display:flex;align-items:center;background:var(--bg-primary);border:1px solid var(--border);border-radius:10px;padding:10px 14px;transition:all .2s ease;box-shadow:0 1px 4px rgba(0,0,0,.05)}.emoji-search-bar:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15),0 2px 8px rgba(0,0,0,.1);background:var(--bg-secondary)}.emoji-search-bar .search-icon{color:var(--text-muted);margin-right:10px;font-size:16px;opacity:.7}.emoji-search-input{flex:1;border:none;background:0 0;outline:0;font-size:14px;color:var(--text-primary)}.emoji-search-input::placeholder{color:var(--text-muted)}.emoji-search-clear{background:0 0;border:none;color:var(--text-muted);cursor:pointer;padding:2px;border-radius:2px;transition:all var(--transition);font-size:12px;margin-left:8px}.emoji-search-clear:hover{background:var(--bg-tertiary);color:var(--text-primary)}.emoji-stats{display:flex;align-items:center;gap:8px}.emoji-count{font-size:12px;color:var(--text-muted);font-weight:500;padding:4px 8px;background:var(--bg-tertiary);border-radius:var(--radius-xs);border:1px solid var(--border)}.emoji-category-filter{display:flex;gap:8px;flex-wrap:wrap}.emoji-category-tab{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease;background:var(--bg-primary);color:var(--text-secondary);border:1px solid var(--border);min-width:80px;justify-content:center}.emoji-category-tab:hover{background:var(--bg-tertiary);color:var(--text-primary);transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}.emoji-category-tab.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 2px 8px rgba(var(--accent-rgb),.3)}.emoji-category-tab .category-icon{font-size:14px}.emoji-category-tab .category-label{font-size:12px;font-weight:600}.emoji-category-selector{flex-shrink:0;height:24px}.emoji-category-select{font-size:9px;padding:1px 3px;border-radius:3px;border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);min-width:60px;height:24px;max-width:70px}.emoji-category-select:focus{outline:0;border-color:var(--accent)}.dm-float-modal{position:fixed;right:20px;bottom:20px;width:360px;min-width:280px;max-width:520px;min-height:60px;max-height:560px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;box-shadow:0 32px 80px rgba(0,0,0,.65),0 12px 32px rgba(0,0,0,.45),var(--modal-ring);display:flex;flex-direction:column;z-index:9000010;overflow:hidden;resize:both;transition:box-shadow .2s ease,transform .3s ease,left .3s ease,bottom .3s ease,opacity .3s ease}.dm-float-modal.dragging{transition:none;touch-action:none}.dm-float-modal.dm-float-slide-out{animation:dm-slide-out .3s ease-in}@keyframes dm-slide-out{from{opacity:1;transform:translateX(-50%) translateY(0)}to{opacity:0;transform:translateX(-50%) translateY(50px)}}@media (min-width:769px){.dm-float-modal.dm-float-slide-out{animation:dm-slide-out-desktop .3s ease-in}}@keyframes dm-slide-out-desktop{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.dm-float-modal:focus-within{box-shadow:0 32px 80px rgba(0,0,0,.7),0 12px 32px rgba(0,0,0,.5),0 0 0 2px var(--accent,#7c5cbf),0 0 0 1px rgba(255,255,255,.03) inset}.dm-float-modal.dm-float-minimized{width:60px!important;height:60px!important;min-width:60px!important;max-width:60px!important;min-height:60px!important;max-height:60px!important;resize:none;border-radius:50%;padding:0}.dm-float-header{display:flex;align-items:center;padding:12px 14px 12px 12px;background:linear-gradient(160deg,rgba(124,92,191,.14) 0,rgba(124,92,191,.04) 60%,transparent 100%);border-bottom:1px solid rgba(255,255,255,.055);cursor:grab;user-select:none;border-radius:10px 10px 0 0;flex-shrink:0;gap:10px;min-height:58px;position:relative}.dm-float-header:active{cursor:grabbing}.dm-float-modal.dm-float-minimized .dm-float-header{border-bottom:none;border-radius:50%;min-height:60px;padding:11px;justify-content:center;cursor:grab}.dm-float-modal.dm-float-minimized .dm-float-actions,.dm-float-modal.dm-float-minimized .dm-float-title{display:none}.dm-float-modal.dm-float-minimized .dm-float-avatar{width:38px;height:38px}.dm-float-avatar-wrap{position:relative;flex-shrink:0}.dm-float-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--accent,#7c5cbf) 0,#4f3090 100%);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;box-shadow:0 2px 10px rgba(0,0,0,.35),0 0 0 2px rgba(124,92,191,.2)}.dm-float-online-dot{position:absolute;bottom:1px;right:1px;width:10px;height:10px;background:#22c55e;border-radius:50%;border:2px solid var(--bg-card,#1e2030);box-shadow:0 0 6px rgba(34,197,94,.5)}.dm-float-title{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}.dm-float-title-top{display:flex;align-items:center;gap:6px;min-width:0}.dm-float-username{font-weight:700;font-size:14px;letter-spacing:-.01em;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dm-float-subtitle{font-size:11px;color:var(--text-muted,#666);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.75;letter-spacing:.01em}.dm-float-unread-dot{display:inline-flex;align-items:center;justify-content:center;background:red;color:#fff;border-radius:10px;font-size:10px;font-weight:700;min-width:18px;height:18px;padding:0 5px;flex-shrink:0;animation:dm-pulse 1.8s ease-in-out infinite;position:absolute;right:14px;top:12px}@keyframes dm-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.12)}}.dm-float-modal.dm-float-minimized .dm-float-unread-dot{top:7px;right:7px;z-index:1000010;min-width:16px;height:16px;font-size:9px;padding:0 4px;border-radius:8px;border:2px solid var(--bg,#fff)}.dm-float-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.dm-float-btn{background:0 0;border:none;color:var(--text-muted,#888);width:28px;height:28px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s,transform .1s;flex-shrink:0;padding:0}.dm-float-btn:hover{background:rgba(255,255,255,.09);color:var(--text-primary,#e8e8f0);transform:scale(1.08)}.dm-float-btn-close:hover{background:rgba(239,68,68,.16);color:#f87171;transform:scale(1.08)}.dm-float-system-note{text-align:center;font-size:11px;font-weight:600;color:#f5a623;background:rgba(245,166,35,.1);border:1px solid rgba(245,166,35,.25);border-radius:10px;padding:5px 10px;margin:6px auto;max-width:85%;opacity:0;animation:dmSystemNoteIn .2s ease forwards,dmSystemNoteOut .3s ease 3.5s forwards}@keyframes dmSystemNoteIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes dmSystemNoteOut{from{opacity:1}to{opacity:0}}.dm-float-btn-addfriend.state-add{color:var(--accent,#7c5cfc)}.dm-float-btn-addfriend.state-add:hover{background:rgba(124,92,252,.16);color:var(--accent,#7c5cfc);transform:scale(1.08)}.dm-float-btn-addfriend.state-pending{color:var(--text-muted,#888);cursor:default}.dm-float-btn-addfriend.state-pending:hover{background:0 0;color:var(--text-muted,#888);transform:none}.dm-float-btn-addfriend.state-accept{color:#4caf50}.dm-float-btn-addfriend.state-accept:hover{background:rgba(76,175,80,.16);color:#4caf50;transform:scale(1.08)}.dm-float-queue-btn{background:rgba(124,92,191,.1);border:1.5px solid rgba(124,92,191,.4);color:var(--accent,#7c5cbf);height:22px;padding:0 6px;border-radius:11px;cursor:pointer;display:flex;align-items:center;gap:3px;font-size:10px;font-weight:700;transition:background .12s,border-color .12s,transform .1s;flex-shrink:0;animation:dm-pulse 1.8s ease-in-out infinite}.dm-float-queue-btn:hover{background:rgba(124,92,191,.22);border-color:rgba(124,92,191,.75);transform:scale(1.06);animation:none}.dm-float-queue-count{line-height:1}.dm-float-body{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.dm-float-messages{flex:1;overflow-y:auto;overflow-x:hidden;padding:14px 12px 8px;display:flex;flex-direction:column;gap:3px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.06) transparent}.dm-float-messages::-webkit-scrollbar{width:3px}.dm-float-messages::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:3px}.dm-float-messages:hover::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15)}.dm-float-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;margin:auto;padding:28px 16px;text-align:center;pointer-events:none}.dm-float-empty-icon{font-size:36px;opacity:.3;margin-bottom:2px;filter:grayscale(.3)}.dm-float-empty p{font-size:13px;font-weight:600;color:var(--text-secondary,#a0a0b8);margin:0;opacity:.8}.dm-float-empty span{font-size:12px;color:var(--text-muted,#666);opacity:.6}.dm-float-system-message{padding:6px 10px;font-size:11px;color:var(--text-muted);font-style:italic;text-align:center;margin:4px 0;border-radius:8px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);animation:dm-msg-in .18s cubic-bezier(.34,1.56,.64,1)}.dm-float-system-message.dnd-blocked{background:linear-gradient(135deg,rgba(255,193,7,.08),rgba(255,193,7,.04));border:1px solid rgba(255,193,7,.15);color:#ffd54f;font-weight:500;box-shadow:0 2px 8px rgba(255,193,7,.1)}.dm-float-system-message.dnd-blocked::before{content:"🔔 ";opacity:.7}.dm-float-msg.dnd-auto-response .dm-float-msg-content{background:linear-gradient(135deg,rgba(255,193,7,.08),rgba(255,193,7,.04))!important;border:1px solid rgba(255,193,7,.15)!important;font-style:italic;opacity:.8}.dm-float-msg.dnd-auto-response .dm-float-msg-content::before{content:"🤖 ";opacity:.6}.dm-float-history-loading{text-align:center;font-size:11px;color:var(--text-muted,#888);padding:6px 0 2px;opacity:.7}.dm-float-date-sep{text-align:center;font-size:10px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:var(--text-muted,#666);margin:10px 0 6px;position:relative;opacity:.7}.dm-float-date-sep::after,.dm-float-date-sep::before{content:'';position:absolute;top:50%;width:calc(50% - 44px);height:1px;background:rgba(255,255,255,.05)}.dm-float-date-sep::before{left:0}.dm-float-date-sep::after{right:0}.dm-float-msg{display:flex;flex-direction:column;max-width:82%;align-self:flex-start;margin-bottom:3px;animation:dm-msg-in .18s cubic-bezier(.34,1.56,.64,1)}@keyframes dm-msg-in{from{opacity:0;transform:translateY(8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.dm-float-msg-own{align-self:flex-end}.dm-float-msg-meta{display:flex;align-items:center;gap:5px;margin-bottom:3px;padding:0 4px}.dm-float-msg-own .dm-float-msg-meta{flex-direction:row-reverse}.dm-float-msg-name{font-size:11px;font-weight:700;color:var(--accent,#7c5cbf);white-space:nowrap;letter-spacing:.01em}.dm-float-msg-own .dm-float-msg-name{color:var(--text-muted,#666);opacity:.8}.dm-float-msg-time{font-size:10px;color:var(--text-muted,#666);white-space:nowrap;opacity:.65}.dm-float-msg-content{background:var(--bg-secondary,#16172a);border:1px solid rgba(255,255,255,.055);border-radius:4px 16px 16px 16px;padding:8px 12px;font-size:13px;line-height:1.5;color:var(--text-primary,#e8e8f0);word-break:break-word;overflow-wrap:anywhere;box-shadow:0 1px 4px rgba(0,0,0,.25)}.dm-float-msg-own .dm-float-msg-content{background:linear-gradient(135deg,var(--accent,#7c5cbf) 0,#5a3d9e 100%);border:1px solid rgba(255,255,255,.12);border-radius:16px 4px 16px 16px;color:#fff;box-shadow:0 3px 10px rgba(90,61,158,.45)}[data-theme="daylight"] .dm-float-msg-own .dm-float-msg-content{background:rgba(var(--accent-rgb),0.12);border:1px solid rgba(var(--accent-rgb),0.35);color:var(--accent);box-shadow:0 1px 3px rgba(var(--accent-rgb),0.15)}[data-theme="daylight"] .dm-float-msg-own .dm-read-status{color:var(--text-muted)}.dm-read-status{font-size:10px;color:rgba(255,255,255,.5);cursor:default}.dm-float-msg:not(.dm-float-msg-own) .dm-read-status{color:var(--text-muted,#666)}.dm-float-msg-wrap{display:flex;flex-direction:row;align-items:flex-end;gap:8px;align-self:flex-start;max-width:90%;margin-bottom:3px;animation:dm-msg-in .18s cubic-bezier(.34,1.56,.64,1)}.dm-float-msg-wrap-own{flex-direction:row-reverse;align-self:flex-end}.dm-float-msg-wrap-grouped{margin-top:2px;margin-bottom:2px;animation:none}.dm-float-msg-wrap .dm-float-msg{align-self:unset;margin-bottom:0;animation:none;max-width:none;flex:1;min-width:0}.dm-float-av-col{width:32px;flex-shrink:0;display:flex;align-items:flex-end;justify-content:center}.dm-float-av-circle{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--accent,#7c5cbf),#4f3090);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff;overflow:hidden;flex-shrink:0;cursor:pointer;transition:transform .14s,box-shadow .14s;box-shadow:0 2px 8px rgba(0,0,0,.35);letter-spacing:-.5px;user-select:none}.dm-float-av-circle:hover{transform:scale(1.1);box-shadow:0 4px 14px rgba(0,0,0,.45)}.dm-float-av-img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;pointer-events:none}.dm-float-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.dm-float-msg-wrap-grouped .dm-float-msg-content{position:relative}.dm-float-msg-wrap-grouped:hover .dm-float-grouped-time{opacity:.55}.dm-float-grouped-time{font-size:9px;color:var(--text-muted,#666);white-space:nowrap;position:absolute;left:-44px;top:50%;transform:translateY(-50%);opacity:0;transition:opacity .15s;pointer-events:none}.dm-float-unread-marker{display:flex;align-items:center;gap:10px;margin:14px 0 10px;position:relative}.dm-float-unread-marker::after,.dm-float-unread-marker::before{content:'';flex:1;height:1px;background:rgba(239,68,68,.35)}.dm-float-unread-marker-label{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:rgba(239,68,68,.9);white-space:nowrap;padding:3px 10px;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.28);border-radius:10px}.dm-msg-ctx-menu{position:fixed;z-index:999999;background:var(--bg-primary,#0f1020);border:1px solid var(--border);border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.65),0 2px 8px rgba(0,0,0,.35);padding:6px;min-width:210px;animation:dm-ctx-in .14s cubic-bezier(.34,1.56,.64,1);user-select:none}@keyframes dm-ctx-in{from{opacity:0;transform:scale(.88) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}.dm-ctx-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:none;background:0 0;border-radius:9px;font-size:13px;color:var(--text-primary,#e8e8f0);cursor:pointer;text-align:left;transition:background .1s,color .1s;font-family:inherit}.dm-ctx-item:hover{background:rgba(255,255,255,.08)}.dm-ctx-item svg{opacity:.65;flex-shrink:0}.dm-ctx-item:hover svg{opacity:.9}.dm-ctx-item.dm-ctx-danger{color:#f87171}.dm-ctx-item.dm-ctx-danger svg{opacity:.85}.dm-ctx-item.dm-ctx-danger:hover{background:rgba(239,68,68,.12)}.dm-ctx-divider{height:1px;background:rgba(255,255,255,.07);margin:4px 6px}.dm-edit-textarea{width:100%;box-sizing:border-box;background:var(--bg-input,rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.15);border-radius:8px;color:var(--text-primary,#e8e8f0);font-size:13px;font-family:inherit;padding:6px 10px;resize:none;outline:0;line-height:1.5;max-height:120px;overflow-y:auto}.dm-edit-textarea:focus{border-color:rgba(124,92,191,.55)}.dm-edit-actions{display:flex;gap:6px;margin-top:5px}.dm-edit-cancel-btn,.dm-edit-save-btn{padding:4px 12px;border-radius:6px;border:none;font-size:12px;font-family:inherit;cursor:pointer;transition:opacity .15s}.dm-edit-save-btn{background:#7c5cbf;color:#fff}.dm-edit-save-btn:hover{opacity:.85}.dm-edit-cancel-btn{background:rgba(255,255,255,.08);color:var(--text-primary,#e8e8f0)}.dm-edit-cancel-btn:hover{background:rgba(255,255,255,.13)}.dm-edited-tag{font-size:10px;color:var(--text-muted,rgba(232,232,240,.4));margin-left:5px;font-style:italic}.dm-float-emoji-picker{position:relative;flex-direction:column;background:var(--bg-card,#1e2030);border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:8px;max-height:320px;box-shadow:0 -4px 24px rgba(0,0,0,.3);flex-shrink:0;margin:0 8px 6px;z-index:10}.dm-float-emoji-picker .emoji-tab-row{overflow-x:auto;scrollbar-width:none}.dm-float-emoji-picker .emoji-tab-row::-webkit-scrollbar{display:none}.dm-float-emoji-picker .emoji-grid{grid-template-columns:repeat(8,1fr);max-height:180px}.dm-float-emoji-picker .emoji-grid .custom-emoji{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important}[id^=room-float-emoji-picker]{padding:10px 10px 8px}[id^=room-float-emoji-picker] .rep-search{display:block;width:100%;box-sizing:border-box;padding:8px 12px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);font-size:13px;outline:0;margin-bottom:8px;transition:border-color .15s}[id^=room-float-emoji-picker] .rep-search:focus{border-color:var(--accent)}[id^=room-float-emoji-picker] .rep-search::placeholder{color:var(--text-muted)}[id^=room-float-emoji-picker] .rep-recent{display:flex;align-items:center;gap:4px;padding:2px 0 8px;margin-bottom:6px;border-bottom:1px solid var(--border)}[id^=room-float-emoji-picker] .rep-recent-label{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.7px;white-space:nowrap;flex-shrink:0}[id^=room-float-emoji-picker] .rep-recent-list{display:flex;gap:1px;flex:1;padding:0 4px}[id^=room-float-emoji-picker] .rep-recent-item{width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:22px;background:0 0;border:none;border-radius:6px;cursor:pointer;padding:0;transition:background .1s,transform .1s;flex-shrink:0}[id^=room-float-emoji-picker] .rep-recent-item:hover{background:var(--bg-tertiary);transform:scale(1.15)}[id^=room-float-emoji-picker] .rep-recent-item img{width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;object-fit:contain}[id^=room-float-emoji-picker] .rep-clear{margin-left:auto;flex-shrink:0;background:0 0;border:none;color:var(--text-muted);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;opacity:.5;transition:opacity .15s,background .15s}[id^=room-float-emoji-picker] .rep-clear:hover{opacity:1;background:var(--bg-hover);color:var(--text-primary)}[id^=room-float-emoji-picker] .emoji-tab-row{overflow-x:auto;overflow-y:clip;scrollbar-width:none;padding-bottom:8px;min-height:52px}[id^=room-float-emoji-picker] .emoji-tab-row::-webkit-scrollbar{display:none}[id^=room-float-emoji-picker] .emoji-tab{height:44px;min-width:44px;padding:6px;font-size:20px;display:flex;align-items:center;justify-content:center}[id^=room-float-emoji-picker] .emoji-tab-icon{width:30px;height:30px;object-fit:contain;display:block}[id^=room-float-emoji-picker] .emoji-grid{grid-template-columns:repeat(5,1fr);max-height:220px}[id^=room-float-emoji-picker] .emoji-item{height:52px;font-size:28px}[id^=room-float-emoji-picker] .emoji-grid .custom-emoji{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important}[id^=room-float-emoji-picker] .rep-size-bar{margin-top:8px;border-top:1px solid var(--border);padding-top:8px}[id^=room-float-emoji-picker] .rep-size-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:8px}[id^=room-float-emoji-picker] .rep-size-toggle-label{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px}[id^=room-float-emoji-picker] .rep-size-toggle-btn{width:34px;height:18px;border-radius:9px;background:var(--bg-tertiary);border:1px solid var(--border);padding:0;cursor:pointer;position:relative;transition:background .2s,border-color .2s;flex-shrink:0}[id^=room-float-emoji-picker] .rep-size-toggle-btn span{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--text-muted);transition:transform .2s,background .2s}[id^=room-float-emoji-picker] .rep-size-toggle-btn.active{background:var(--accent);border-color:var(--accent)}[id^=room-float-emoji-picker] .rep-size-toggle-btn.active span{transform:translateX(16px);background:#fff}[id^=room-float-emoji-picker] .rep-size-edit-panel{margin-top:8px;padding-top:8px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px}[id^=room-float-emoji-picker] .rep-edit-header{display:flex;align-items:center;gap:8px}[id^=room-float-emoji-picker] .rep-edit-preview-wrap{width:66px;height:66px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px;background:var(--bg-secondary);border:1px solid var(--border)}[id^=room-float-emoji-picker] .rep-edit-preview-img{object-fit:contain;transition:width .12s,height .12s}[id^=room-float-emoji-picker] .rep-edit-emoji-name{font-size:11px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}[id^=room-float-emoji-picker] .rep-edit-control-row{display:flex;align-items:center;gap:5px}[id^=room-float-emoji-picker] .rep-size-cancel-btn{padding:5px 8px;background:var(--bg-tertiary);color:var(--text-muted);border:1px solid var(--border);border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:opacity .15s;flex-shrink:0}[id^=room-float-emoji-picker] .rep-size-cancel-btn:hover{opacity:.8}[id^=room-float-emoji-picker] .emoji-grid.rep-edit-mode .emoji-item:has(.custom-emoji){cursor:crosshair;position:relative}[id^=room-float-emoji-picker] .emoji-grid.rep-edit-mode .emoji-item:has(.custom-emoji):hover{outline:2px solid var(--accent);border-radius:4px}[id^=room-float-emoji-picker] .emoji-item.rep-editing{outline:2px solid var(--accent);border-radius:4px;background:var(--bg-secondary)}[id^=room-float-emoji-picker] .rep-size-slider-row{display:flex;align-items:center;gap:8px}[id^=room-float-emoji-picker] .rep-size-value{font-size:10px;font-weight:700;color:var(--accent);min-width:28px;text-align:center;flex-shrink:0}[id^=room-float-emoji-picker] .rep-size-slider{flex:1;-webkit-appearance:none;appearance:none;height:4px;border-radius:2px;background:var(--bg-tertiary);outline:0;cursor:pointer}[id^=room-float-emoji-picker] .rep-size-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer}[id^=room-float-emoji-picker] .rep-size-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer;border:none}[id^=room-float-emoji-picker] .rep-size-save-btn{flex-shrink:0;padding:5px 10px;background:var(--accent);color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:opacity .15s;white-space:nowrap}[id^=room-float-emoji-picker] .rep-size-save-btn:hover{opacity:.85}.dm-float-input-area{position:relative;display:flex;align-items:flex-end;gap:8px;padding:8px 12px 14px;background:0 0;flex-shrink:0}.dm-float-input-pill{flex:1;display:flex;align-items:flex-end;background:var(--bg-secondary,#16172a);border:1.5px solid rgba(255,255,255,.07);border-radius:16px;transition:border-color .15s,box-shadow .15s;overflow:hidden;min-height:42px;padding:0 4px 0 2px;gap:0}.dm-float-input-pill:focus-within{border-color:var(--accent,#7c5cbf);box-shadow:0 0 0 3px rgba(124,92,191,.15)}.dm-float-pill-btn{background:0 0;border:none;color:var(--text-muted,#888);width:34px;height:34px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .12s,background .12s;flex-shrink:0;padding:0;align-self:flex-end;margin-bottom:4px}.dm-float-pill-btn:hover{color:var(--accent,#7c5cbf);background:rgba(124,92,191,.1)}.dm-float-textarea{flex:1;background:0 0;border:none;outline:0;color:var(--text-primary,#e8e8f0);font-family:inherit;font-size:13.5px;line-height:1.45;padding:11px 4px;resize:none;min-height:42px;max-height:110px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.08) transparent}#dm-float-fmt-toolbar{padding:2px 4px 4px}.dm-float-textarea::placeholder{color:var(--text-muted,#666);opacity:.55}.dm-float-send-btn{width:40px;height:40px;min-width:40px;background:var(--accent,#7c5cbf);border:none;border-radius:13px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .12s,box-shadow .15s;flex-shrink:0;box-shadow:0 3px 12px rgba(90,61,158,.45);padding:0;align-self:flex-end}.dm-float-send-btn:hover{background:#9270d4;transform:scale(1.06);box-shadow:0 5px 16px rgba(90,61,158,.6)}.dm-float-send-btn:active{transform:scale(.94);box-shadow:0 2px 8px rgba(90,61,158,.35)}.dm-float-file-queue-bar{display:flex;align-items:center;gap:8px;padding:8px 12px 4px;background:0 0;flex-shrink:0;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.dm-float-file-queue-bar::-webkit-scrollbar{display:none}.dm-float-file-thumb{position:relative;width:56px;height:56px;border-radius:8px;overflow:hidden;border:1.5px solid rgba(255,255,255,.1);flex-shrink:0;background:var(--bg-secondary);transition:border-color .15s}.dm-float-file-thumb:hover{border-color:var(--accent)}.dm-float-file-thumb img{width:100%;height:100%;object-fit:cover;display:block}.dm-float-file-chip{display:flex;align-items:center;gap:5px;background:var(--bg-secondary);border:1.5px solid rgba(255,255,255,.08);border-radius:8px;padding:5px 8px;max-width:200px;flex-shrink:0;min-width:0}.dm-float-file-chip-icon{font-size:13px;flex-shrink:0}.dm-float-file-chip-name{font-size:11.5px;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}.dm-float-file-remove{position:absolute;top:2px;right:2px;width:18px;height:18px;background:rgba(0,0,0,.7);color:#fff;border:none;border-radius:50%;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s,background .15s;padding:0;flex-shrink:0}.dm-float-file-thumb:hover .dm-float-file-remove{opacity:1}.room-float-file-thumb:hover .room-float-file-remove{opacity:1}.dm-float-file-remove:hover,.room-float-file-remove:hover{background:var(--danger,#e05050)}.room-float-file-remove{position:absolute;top:2px;right:2px;width:18px;height:18px;background:rgba(0,0,0,.7);color:#fff;border:none;border-radius:50%;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s,background .15s;padding:0;flex-shrink:0}.dm-float-file-chip-remove{position:static;width:16px;height:16px;font-size:12px;opacity:.6;flex-shrink:0}.dm-float-file-chip-remove:hover{opacity:1}[data-theme=daylight] .dm-float-modal{border:1px solid var(--border);box-shadow:0 16px 48px rgba(0,0,0,.13),0 6px 18px rgba(0,0,0,.08),var(--modal-ring)}[data-theme=daylight] .dm-float-modal:focus-within{box-shadow:0 16px 48px rgba(0,0,0,.15),0 6px 18px rgba(0,0,0,.09),0 0 0 2px var(--accent)}[data-theme=daylight] .dm-float-header{background:linear-gradient(160deg,rgba(var(--accent-rgb),.14) 0,rgba(var(--accent-rgb),.04) 60%,transparent 100%);border-bottom:1px solid var(--border-light)}[data-theme=daylight] .dm-float-btn:hover{background:rgba(0,0,0,.07);color:var(--text-primary)}[data-theme=daylight] .dm-float-queue-btn{background:rgba(var(--accent-rgb),.1);border:1.5px solid rgba(var(--accent-rgb),.4);color:var(--accent)}[data-theme=daylight] .dm-float-queue-btn:hover{background:rgba(var(--accent-rgb),.2);border-color:rgba(var(--accent-rgb),.65)}[data-theme=daylight] .dm-float-messages{scrollbar-color:rgba(0,0,0,0.12) transparent}[data-theme=daylight] .dm-float-messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .dm-float-messages:hover::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2)}[data-theme=daylight] .dm-float-system-message{background:rgba(0,0,0,.03);border:1px solid var(--border-light)}[data-theme=daylight] .dm-float-date-sep::after,[data-theme=daylight] .dm-float-date-sep::before{background:var(--border-light)}[data-theme=daylight] .dm-float-msg-content{border-color:var(--border-light);box-shadow:0 1px 4px rgba(0,0,0,.08)}[data-theme=daylight] .dm-read-status{color:var(--text-muted)}[data-theme=daylight] .dm-msg-ctx-menu{border:1px solid var(--border);box-shadow:0 12px 32px rgba(0,0,0,.16),0 2px 8px rgba(0,0,0,.08)}[data-theme=daylight] .dm-ctx-item:hover{background:rgba(0,0,0,.06)}[data-theme=daylight] .dm-ctx-divider{background:var(--border-light)}[data-theme=daylight] .dm-edit-textarea{border:1px solid var(--border)}[data-theme=daylight] .dm-edit-textarea:focus{border-color:var(--accent)}[data-theme=daylight] .dm-edit-save-btn{background:var(--accent)}[data-theme=daylight] .dm-edit-cancel-btn{background:rgba(0,0,0,.06);color:var(--text-primary)}[data-theme=daylight] .dm-edit-cancel-btn:hover{background:rgba(0,0,0,.1)}[data-theme=daylight] .dm-float-emoji-picker{border:1px solid var(--border);box-shadow:0 -4px 20px rgba(0,0,0,.1)}[data-theme=daylight] .dm-float-input-pill{border-color:var(--border)}[data-theme=daylight] .dm-float-input-pill:focus-within{box-shadow:0 0 0 3px var(--accent-glow)}[data-theme=daylight] .dm-float-pill-btn:hover{background:var(--accent-glow)}[data-theme=daylight] .dm-float-textarea{scrollbar-color:rgba(0,0,0,0.12) transparent}[data-theme=daylight] .dm-float-send-btn:hover{background:var(--accent-hover);box-shadow:0 5px 16px rgba(var(--accent-rgb),.4)}[data-theme=daylight] .dm-float-send-btn:active{box-shadow:0 2px 8px rgba(var(--accent-rgb),.3)}[data-theme=daylight] .dm-float-file-chip,[data-theme=daylight] .dm-float-file-thumb{border-color:var(--border)}.room-float-file-queue-bar{display:flex;align-items:center;gap:8px;padding:8px 12px 4px;background:0 0;flex-shrink:0;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.room-float-file-queue-bar::-webkit-scrollbar{display:none}.room-float-file-thumb{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;border:1.5px solid rgba(255,255,255,.1);flex-shrink:0;background:var(--bg-secondary);transition:border-color .15s}.room-float-file-thumb:hover{border-color:var(--accent)}.room-float-file-thumb img{width:100%;height:100%;object-fit:cover;display:block}.room-float-file-chip{display:flex;align-items:center;gap:5px;background:var(--bg-secondary);border:1.5px solid rgba(255,255,255,.08);border-radius:8px;padding:5px 8px;max-width:220px;flex-shrink:0;min-width:0}.room-float-file-chip-icon{font-size:13px;flex-shrink:0}.room-float-file-chip-name{font-size:11.5px;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}.room-float-file-chip-remove{position:static;width:16px;height:16px;font-size:12px;opacity:.6;flex-shrink:0}.room-float-file-chip-remove:hover{opacity:1}@media (max-width:480px){.dm-float-modal{width:calc(100vw - 16px);right:8px;bottom:70px;max-width:unset;min-width:unset;resize:none;border-radius:10px}}#section-dm-features .toggle-row,#section-media-perms .toggle-row{margin-top:6px}#section-dm-features small,#section-media-perms small{padding-left:2px}.notification-center-modal.modal{position:fixed;inset:0;background:0 0;border:none;border-radius:0;box-shadow:none;padding:0;margin:0;width:auto;min-width:0;min-height:0;max-width:none;max-height:none;resize:none;overflow:visible;z-index:10200115;display:none}.notification-center-modal.is-open{display:block}.nc-panel{--nc-pad:18px;position:fixed;top:0;left:0;width:390px;max-width:100vw;height:100%;background:var(--bg-primary);border-right:1px solid var(--border);display:flex;flex-direction:column;box-shadow:24px 0 60px -12px rgba(0,0,0,.5);transform:translateX(-100%);transition:transform .3s cubic-bezier(.32,.72,0,1)}.notification-center-modal.is-open .nc-panel{transform:translateX(0)}.nc-header{padding:18px var(--nc-pad) 12px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.nc-header-title{display:flex;align-items:center;gap:9px;font-weight:650;font-size:15px;color:var(--text-primary);letter-spacing:-.01em}.nc-header-title svg{color:var(--accent);flex-shrink:0}.nc-close{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:0 0;border:none;border-radius:9px;color:var(--text-muted);cursor:pointer;transition:background .15s,color .15s;flex-shrink:0}.nc-close:hover{background:var(--bg-hover);color:var(--text-primary)}.nc-tabs{display:flex;gap:3px;margin:0 var(--nc-pad) 10px;padding:3px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;flex-shrink:0}.nc-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;padding:6px 8px;border:none;background:0 0;color:var(--text-muted);font-size:12px;font-weight:600;font-family:inherit;border-radius:9px;cursor:pointer;transition:background .15s,color .15s;white-space:nowrap}.nc-tab:hover{color:var(--text-secondary)}.nc-tab.active{background:var(--bg-primary);color:var(--text-primary);box-shadow:0 1px 3px rgba(0,0,0,.16)}.nc-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;border-radius:999px;line-height:1}.nc-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:6px 8px}.nc-list::-webkit-scrollbar{width:8px}.nc-list::-webkit-scrollbar-track{background:0 0}.nc-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px;border:2px solid var(--bg-primary)}.nc-list::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.nc-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:76px 24px;color:var(--text-muted);text-align:center}.nc-empty svg{opacity:.2}.nc-empty span{font-size:13px}.nc-item{position:relative;display:flex;align-items:flex-start;gap:12px;padding:12px 10px;border-radius:12px;cursor:pointer;transition:background .12s}.nc-item+.nc-item{margin-top:2px}.nc-item:hover{background:var(--bg-hover)}.nc-item.unread{background:rgba(var(--accent-rgb,124,92,252),.06)}.nc-item.unread:hover{background:rgba(var(--accent-rgb,124,92,252),.1)}.nc-item.unread::before{content:"";position:absolute;left:1px;top:50%;transform:translateY(-50%);width:3px;height:22px;border-radius:2px;background:var(--accent)}.nc-item-icon{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.nc-icon-dm{background:rgba(124,92,252,.15);color:#9b78ff}.nc-icon-mention{background:rgba(240,165,0,.15);color:#f0a500}.nc-icon-voice{background:rgba(6,182,212,.15);color:#06b6d4}.nc-icon-system{background:rgba(100,116,139,.15);color:#94a3b8}.nc-icon-invite{background:rgba(59,130,246,.15);color:#60a5fa}.nc-icon-friend{background:rgba(236,72,153,.15);color:#f472b6}.nc-icon-transaction{background:rgba(34,197,94,.15);color:#4ade80}.nc-icon-default{background:rgba(100,116,139,.12);color:#94a3b8}.nc-item-body{flex:1;min-width:0;padding-top:1px}.nc-item-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nc-item-msg{font-size:12.5px;color:var(--text-secondary);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.nc-item-time{font-size:11px;color:var(--text-muted);margin-top:5px}.nc-item-aside{display:flex;flex-direction:column;align-items:center;gap:6px;flex-shrink:0}.nc-unread-dot{width:7px;height:7px;background:var(--accent);border-radius:50%;flex-shrink:0;margin-top:4px}.nc-dismiss{display:flex;align-items:center;justify-content:center;width:22px;height:22px;background:0 0;border:none;border-radius:7px;color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity .15s,background .15s,color .15s;padding:0}.nc-item:hover .nc-dismiss{opacity:1}.nc-dismiss:hover{background:rgba(231,76,60,.14);color:var(--danger,#e74c3c)}.nc-footer{padding:12px var(--nc-pad);border-top:1px solid var(--border);display:flex;gap:8px;flex-shrink:0}.nc-footer button{flex:1;padding:9px 12px;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-secondary);border-radius:9px;font-size:12px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,color .15s,border-color .15s}#mark-all-read-btn:hover{background:rgba(var(--accent-rgb,124,92,252),.12);color:var(--accent);border-color:var(--accent)}#clear-all-btn:hover{background:rgba(231,76,60,.1);color:var(--danger,#e74c3c);border-color:var(--danger,#e74c3c)}@media (max-width:480px){.nc-panel{width:100%}}.notification-toast-container{position:fixed;top:20px;right:20px;z-index:2147483647;pointer-events:none}.notification-toast{background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.3),0 0 0 1px rgba(255,255,255,.05) inset;min-width:300px;max-width:400px;margin-bottom:12px;pointer-events:auto;transform:translateX(400px);opacity:0;transition:all .3s ease-out;overflow:hidden}.notification-toast.show{transform:translateX(0);opacity:1}.notification-toast.removing{transform:translateX(400px);opacity:0}.notification-toast.priority-2{border-left:4px solid var(--danger);background:linear-gradient(90deg,rgba(240,71,71,.12),var(--bg-secondary))}.notification-toast.priority-1{border-left:4px solid var(--warning);background:linear-gradient(90deg,rgba(250,166,26,.12),var(--bg-secondary))}.toast-content{padding:12px 16px;display:flex;align-items:flex-start;gap:12px}.toast-title{font-weight:600;color:var(--text-primary);margin-bottom:4px;font-size:.95em}.toast-message{color:var(--text-secondary);font-size:.9em;line-height:1.4;flex:1;word-wrap:break-word}.toast-close{background:0 0;border:none;color:var(--text-muted);font-size:1.2em;cursor:pointer;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:all .15s;flex-shrink:0;margin-top:-2px}.toast-close:hover{background:var(--bg-hover);color:var(--text-primary)}.dm-unread-count,.mention-badge{background:var(--danger);color:#fff;font-size:.7em;font-weight:600;padding:2px 6px;border-radius:10px;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;position:absolute;top:-4px;right:-4px;z-index:1}#notifications-toggle-btn{position:relative}#notifications-toggle-btn::after{content:'';position:absolute;top:-2px;right:-2px;width:8px;height:8px;background:var(--danger);border-radius:50%;display:none}#notifications-toggle-btn.has-unread::after{display:block}@media (max-width:768px){.notification-toast-container{top:10px;right:10px;left:10px}.notification-toast{min-width:unset;max-width:unset}}
.friend-presence-toast-container{position:fixed;bottom:16px;right:16px;z-index:2147483647;display:flex;flex-direction:column-reverse;gap:8px;pointer-events:none;max-width:224px}
.friend-toast{display:grid;grid-template-rows:1fr;opacity:0;transform:translateX(20px) scale(.97);transition:grid-template-rows .28s cubic-bezier(.4,0,.2,1),opacity .28s ease,transform .28s cubic-bezier(.4,0,.2,1);pointer-events:auto}
.friend-toast.show{opacity:1;transform:translateX(0) scale(1)}
.friend-toast.removing{grid-template-rows:0fr;opacity:0;transform:translateX(14px) scale(.96)}
.friend-toast-inner{overflow:hidden;min-height:0}
.friend-toast-card{position:relative;display:flex;align-items:center;gap:9px;min-width:176px;max-width:224px;padding:9px 26px 9px 11px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:18px;box-shadow:0 8px 24px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.25),0 0 0 1px rgba(var(--accent-rgb),.14) inset,0 0 18px -6px rgba(var(--accent-rgb),.4);overflow:hidden}
.friend-toast-avatar{position:relative;flex-shrink:0;width:30px;height:30px}
.friend-toast-avatar-img,.friend-toast-avatar-fallback{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;object-fit:cover;font-weight:700;font-size:.85em;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-hover));box-shadow:0 0 0 2px var(--bg-secondary)}
.friend-toast-dot{position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:var(--success);box-shadow:0 0 0 2px var(--bg-secondary);animation:friend-toast-pulse 1.8s ease-out infinite}
.friend-toast-dot-offline{background:var(--text-muted);animation:none}
.friend-toast-body{flex:1;min-width:0}
.friend-toast-name{font-weight:600;font-size:.85em;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.friend-toast-name .friend-toast-accent{color:var(--accent);font-weight:600}
.friend-toast-sub{font-size:.74em;color:var(--text-secondary);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.friend-toast-close{position:absolute;top:5px;right:5px;width:16px;height:16px;border:none;background:0 0;color:var(--text-muted);font-size:.95em;line-height:1;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .15s,background .15s,color .15s}
.friend-toast-card:hover .friend-toast-close{opacity:1}
.friend-toast-close:hover{background:var(--bg-hover);color:var(--text-primary)}
.friend-toast-progress{position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--accent),var(--accent-hover));transform:scaleX(1);transform-origin:left;transition:transform linear}
@keyframes friend-toast-pulse{0%{box-shadow:0 0 0 2px var(--bg-secondary),0 0 0 0 rgba(var(--accent-rgb),.55)}70%{box-shadow:0 0 0 2px var(--bg-secondary),0 0 0 7px rgba(var(--accent-rgb),0)}100%{box-shadow:0 0 0 2px var(--bg-secondary),0 0 0 0 rgba(var(--accent-rgb),0)}}
@media (max-width:768px){.friend-presence-toast-container{right:10px;bottom:10px;left:10px;max-width:unset}.friend-toast-card{min-width:unset;max-width:unset}}.swal2-container{z-index:99999!important;inset:0!important;position:fixed!important;display:flex!important;justify-content:center!important;align-items:center!important}.swal2-backdrop-show{background:rgba(4,6,14,.72)!important}.swal2-popup.premium-popup{border-radius:18px!important;background:rgba(10,14,26,.96)!important;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 0 0 1px rgba(255,255,255,.04) inset,0 1px 0 rgba(255,255,255,.08) inset,0 24px 56px -12px rgba(0,0,0,.75)!important;border:1px solid rgba(255,255,255,.07)!important;padding:28px 28px 24px!important;overflow:hidden!important;position:fixed!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;margin:0!important;width:90vw!important;max-width:380px!important;max-height:90vh!important;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif!important}.swal2-popup.premium-popup.swal2-error{border-color:rgba(239,68,68,.3)!important;box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 24px 56px -12px rgba(0,0,0,.75),0 0 0 1px rgba(239,68,68,.2),0 0 32px rgba(239,68,68,.1)!important}.swal2-popup.premium-popup.swal2-success{border-color:rgba(34,197,94,.3)!important;box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 24px 56px -12px rgba(0,0,0,.75),0 0 0 1px rgba(34,197,94,.18),0 0 32px rgba(34,197,94,.1)!important}.swal2-popup.premium-popup.swal2-warning{border-color:rgba(234,179,8,.3)!important;box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 24px 56px -12px rgba(0,0,0,.75),0 0 0 1px rgba(234,179,8,.18),0 0 32px rgba(234,179,8,.09)!important}.swal2-popup.premium-popup.swal2-info{border-color:rgba(59,130,246,.3)!important;box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,0 24px 56px -12px rgba(0,0,0,.75),0 0 0 1px rgba(59,130,246,.18),0 0 32px rgba(59,130,246,.09)!important}.swal2-title.premium-title{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif!important;font-size:1.1rem!important;font-weight:700!important;color:#f8fafc!important;letter-spacing:-.02em!important;margin:0 0 6px!important;padding:0!important;line-height:1.3!important}.swal2-html-content.premium-content{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif!important;color:rgba(255,255,255,.58)!important;font-size:.845rem!important;line-height:1.55!important;margin:0!important}.swal2-icon.premium-icon{margin:0 auto 16px!important;width:52px!important;height:52px!important;border-width:2px!important}.swal2-icon.swal2-error.premium-icon{filter:drop-shadow(0 0 12px rgba(239, 68, 68, .45));border-color:rgba(239,68,68,.7)!important}.swal2-icon.swal2-success.premium-icon{filter:drop-shadow(0 0 12px rgba(34, 197, 94, .45));border-color:rgba(34,197,94,.7)!important}.swal2-icon.swal2-warning.premium-icon{filter:drop-shadow(0 0 12px rgba(234, 179, 8, .45));border-color:rgba(234,179,8,.7)!important}.swal2-icon.swal2-info.premium-icon{filter:drop-shadow(0 0 12px rgba(59, 130, 246, .45));border-color:rgba(59,130,246,.7)!important}.swal2-icon.swal2-error.premium-icon .swal2-x-mark-line-left,.swal2-icon.swal2-error.premium-icon .swal2-x-mark-line-right{background-color:#f87171!important}.swal2-icon.swal2-success.premium-icon .swal2-success-line-long,.swal2-icon.swal2-success.premium-icon .swal2-success-line-tip{background-color:#4ade80!important}.swal2-icon.swal2-success.premium-icon .swal2-success-ring{border-color:rgba(34,197,94,.3)!important}.swal2-icon.swal2-warning.premium-icon .swal2-icon-content{color:#fbbf24!important;font-size:2rem!important}.swal2-icon.swal2-info.premium-icon .swal2-icon-content{color:#60a5fa!important;font-size:2rem!important}.swal2-container.swal2-center .swal2-popup.premium-popup .swal2-actions{gap:10px!important;margin-top:20px!important}.swal2-popup.premium-popup .swal2-styled{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif!important;font-weight:600!important;font-size:.82rem!important;letter-spacing:.02em!important;padding:10px 22px!important;border-radius:10px!important;border:none!important;transition:all .22s cubic-bezier(.4, 0, .2, 1)!important;position:relative;overflow:hidden}.swal2-popup.premium-popup .swal2-styled::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.14) 0,transparent 55%);opacity:0;transition:opacity .22s ease}.swal2-popup.premium-popup .swal2-styled:hover::after{opacity:1}.swal2-popup.premium-popup .swal2-styled:active{transform:scale(.96)!important}.swal2-popup.premium-popup .swal2-styled.swal2-confirm{background:linear-gradient(135deg,#6366f1 0,#8b5cf6 100%)!important;color:#fff!important;box-shadow:0 4px 16px rgba(99,102,241,.38)!important}.swal2-popup.premium-popup .swal2-styled.swal2-confirm:hover{box-shadow:0 6px 22px rgba(99,102,241,.55)!important;transform:translateY(-1px)!important}.swal2-popup.premium-popup .swal2-styled.swal2-cancel{background:rgba(255,255,255,.08)!important;color:rgba(255,255,255,.65)!important;border:1px solid rgba(255,255,255,.12)!important}.swal2-popup.premium-popup .swal2-styled.swal2-cancel:hover{background:rgba(255,255,255,.14)!important;color:#fff!important;transform:translateY(-1px)!important}.swal2-popup.premium-popup .swal2-input,.swal2-popup.premium-popup .swal2-select,.swal2-popup.premium-popup .swal2-textarea{font-family:Inter,sans-serif!important;background:rgba(255,255,255,.05)!important;border:1.5px solid rgba(255,255,255,.1)!important;border-radius:10px!important;color:#f1f5f9!important;padding:12px 16px!important;font-size:.9rem!important;transition:all .2s ease!important;box-shadow:none!important}.swal2-popup.premium-popup .swal2-input:focus,.swal2-popup.premium-popup .swal2-select:focus,.swal2-popup.premium-popup .swal2-textarea:focus{outline:0!important;border-color:#6366f1!important;box-shadow:0 0 0 3px rgba(99,102,241,.15)!important;background:rgba(99,102,241,.06)!important}.swal2-popup.premium-popup .swal2-close{color:rgba(255,255,255,.38)!important;font-size:1.4rem!important;width:32px!important;height:32px!important;border-radius:8px!important;transition:all .2s ease!important}.swal2-popup.premium-popup .swal2-close:hover{color:rgba(255,255,255,.85)!important;background:rgba(255,255,255,.08)!important;transform:none!important}.swal2-popup.premium-popup .swal2-timer-progress-bar{background:linear-gradient(90deg,#6366f1,#8b5cf6)!important;height:2px!important;border-radius:0!important;bottom:0!important}#auth-error{display:none!important}@media (max-width:480px){.swal2-popup.premium-popup{padding:22px 20px 20px!important;width:calc(100vw - 24px)!important;max-width:none!important;border-radius:14px!important}.swal2-title.premium-title{font-size:1rem!important}.swal2-html-content.premium-content{font-size:.82rem!important}}.swal2-popup.premium-popup.auto-close{animation:premiumFadeOut 5s ease-in-out forwards!important}@keyframes premiumFadeOut{0%,75%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(.97)}}.swal2-show{animation:swalFadeIn .22s cubic-bezier(.4,0,.2,1)!important}.swal2-hide{animation:swalFadeOut .18s cubic-bezier(.4,0,.2,1)!important}@keyframes swalFadeIn{from{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes swalFadeOut{from{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.95)}}.read-more-messages-btn{display:block;width:calc(100% - 32px);margin:8px 16px;padding:8px 16px;background:var(--bg-secondary,#2f3136);color:var(--text-secondary,#b9bbbe);border:1px solid var(--border-color,#40444b);border-radius:6px;font-size:.85em;cursor:pointer;text-align:center;transition:background .15s,color .15s;font-weight:500}.read-more-messages-btn:hover:not(:disabled){background:var(--bg-hover,#40444b);color:var(--text-primary,#dcddde)}.read-more-messages-btn:disabled{opacity:.6;cursor:default}.room-table-name{text-align:left}.user-device-badge{display:inline-flex;align-items:center;justify-content:center;margin-left:5px;vertical-align:middle;flex-shrink:0;transition:filter .2s ease}.device-icon{width:18px;height:18px;flex-shrink:0;fill:currentColor}.user-device-badge.device-desktop{color:#5b8dee;filter:drop-shadow(0 -1px 0 rgba(255, 255, 255, .45)) drop-shadow(0 1px 1px rgba(0, 0, 0, .4)) drop-shadow(0 2px 6px rgba(91, 141, 238, .6))}.user-device-badge.device-mobile{color:#26d97f;filter:drop-shadow(0 -1px 0 rgba(255, 255, 255, .45)) drop-shadow(0 1px 1px rgba(0, 0, 0, .4)) drop-shadow(0 2px 6px rgba(38, 217, 127, .6))}.user-device-badge.device-tablet{color:#a29bfe;filter:drop-shadow(0 -1px 0 rgba(255, 255, 255, .45)) drop-shadow(0 1px 1px rgba(0, 0, 0, .4)) drop-shadow(0 2px 6px rgba(162, 155, 254, .6))}.device-type-text{font-size:9px;font-weight:600;margin-left:3px;white-space:nowrap}.user-device-ping{font-size:9px;font-weight:600;opacity:.6;flex-shrink:0;white-space:nowrap;color:var(--text-muted)}.message-input-pill{flex-direction:column;align-items:stretch}.fmt-input-row{display:flex;align-items:flex-end;gap:4px;padding:0 4px 4px}@font-face{font-family:'Twemoji Country Flags';src:url('/fonts/TwemojiCountryFlags.woff2') format('woff2');font-display:swap;unicode-range:U+1F1E6-1F1FF,U+1F3F4,U+E0060-E007F}
@font-face{font-family:'Great Vibes';src:url('/fonts/GreatVibes-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Priestacy;src:url('/fonts/Priestacy.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Rustic Roadway';src:url('/fonts/RusticRoadway.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}.fmt-cursive-label{font-family:'Great Vibes',cursive;font-size:14px;font-weight:400;line-height:1}.fmt-toolbar{display:flex;align-items:center;gap:2px;padding:4px 8px 2px;overflow-x:auto;scrollbar-width:none}.fmt-toolbar::-webkit-scrollbar{display:none}.fmt-btn{background:0 0;border:1px solid transparent;border-radius:5px;color:var(--text-muted);cursor:pointer;font-size:11px;font-weight:600;min-width:22px;height:22px;padding:0 4px;display:inline-flex;align-items:center;justify-content:center;transition:color var(--transition),background var(--transition),border-color var(--transition);flex-shrink:0;user-select:none}.fmt-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.fmt-btn.active{color:var(--accent);background:rgba(var(--accent-rgb),.12);border-color:rgba(var(--accent-rgb),.3)}.fmt-divider{width:1px;height:14px;background:var(--border);margin:0 3px;flex-shrink:0}.fmt-color-btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:2px 5px;height:22px;min-width:22px}.fmt-color-letter{font-size:11px;font-weight:700;line-height:1}.fmt-color-bar{width:14px;height:3px;border-radius:2px;background:var(--text-muted);transition:background .15s}.fmt-color-picker{display:none;flex-direction:column;gap:12px;position:fixed;background:var(--bg-card);border:1px solid var(--border-light);border-radius:14px;padding:12px;box-shadow:0 12px 40px rgba(0,0,0,.15),0 0 1px rgba(0,0,0,.1);z-index:10200001;width:220px;animation:fmt-cp-in .12s ease}.fmt-color-picker.open{display:flex}@keyframes fmt-cp-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.fmt-cp-header{display:flex;align-items:center;justify-content:space-between;padding:0 2px;gap:8px}.fmt-cp-title{font-size:11px;font-weight:700;color:var(--text-primary);text-transform:uppercase;letter-spacing:.6px;flex:1}.fmt-cp-name{font-size:10px;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70px;text-align:right;padding:2px 6px;background:var(--bg-secondary);border-radius:4px}.fmt-cp-custom{display:flex;gap:6px;align-items:center;padding:8px 0}.fmt-cp-custom>div:first-child{display:flex;gap:6px;align-items:center;flex:1}.fmt-color-input{width:40px;height:32px;border:1px solid var(--border-light);border-radius:7px;cursor:pointer;padding:3px;transition:all .15s ease;flex-shrink:0}.fmt-color-input:hover{border-color:var(--accent);box-shadow:0 0 0 2px rgba(124,92,191,.1)}.fmt-color-hex{width:70px;height:32px;border:1px solid var(--border-light);border-radius:7px;background:var(--bg-secondary);color:var(--text-primary);font-size:11px;font-family:'Courier New',monospace;padding:6px 8px;text-transform:uppercase;transition:all .15s ease}.fmt-color-hex:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 2px rgba(124,92,191,.15)}.fmt-color-hex::placeholder{color:var(--text-muted)}.fmt-cp-section-label{font-size:9px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-top:2px;margin-bottom:6px}.fmt-cp-recent{display:grid;grid-template-columns:repeat(auto-fill,minmax(24px,1fr));gap:5px;min-height:24px}.fmt-cp-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.fmt-add-color-btn{width:32px;height:32px;border-radius:7px;border:1px solid var(--border-light);background:var(--bg-secondary);color:var(--text-secondary);font-size:18px;font-weight:600;cursor:pointer;padding:0;flex-shrink:0;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.fmt-add-color-btn:hover{background:var(--bg-tertiary);border-color:var(--accent);color:var(--accent);transform:scale(1.05)}.fmt-add-color-btn:active{transform:scale(.95)}.fmt-cp-custom-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(32px,1fr));gap:4px}.fmt-custom-color-wrapper{position:relative;width:28px;height:28px}.fmt-remove-color-btn{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;background:var(--danger);border:none;color:#fff;font-size:12px;font-weight:700;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .1s ease}.fmt-custom-color-wrapper:hover .fmt-remove-color-btn{opacity:1}.fmt-remove-color-btn:hover{background:var(--danger-dark,#c20f0f)}.fmt-cp-section{display:flex;flex-direction:column;gap:6px;padding:2px 0}.fmt-picker-swatch{width:32px;height:32px;border-radius:7px;border:2px solid transparent;cursor:pointer;padding:0;flex-shrink:0;transition:all .15s ease;outline-offset:2px;background-clip:border-box}.fmt-picker-swatch:hover{transform:scale(1.1);border-color:rgba(124,92,191,.4);box-shadow:0 2px 8px rgba(0,0,0,.12)}.fmt-picker-swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--bg-card),0 0 0 4px var(--accent);transform:scale(1.05)}.fmt-picker-swatch-none{background:conic-gradient(var(--bg-tertiary) 0deg 170deg,var(--danger) 170deg 190deg,var(--bg-tertiary) 190deg 360deg)}.fmt-cp-recent .fmt-picker-swatch{width:24px;height:24px;border-radius:5px}.message-input-pill{position:relative}@media (max-width:480px){.fmt-btn{min-width:20px;height:20px;font-size:10px}.fmt-toolbar{padding:3px 6px 2px}.fmt-color-picker{right:4px;width:200px}.fmt-picker-swatch{width:24px;height:24px}.fmt-color-hex{width:80px}}.sidebar-section.friends-pane{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding:4px 8px 4px}.friends-tabs{display:flex;border-bottom:1px solid rgba(255,255,255,.05);margin-bottom:2px}.friends-tab{flex:1;background:0 0;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;padding:2px 0 5px;font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);cursor:pointer;user-select:none;display:flex;align-items:center;justify-content:center;gap:5px;transition:color .15s,border-color .15s}.friends-tab.active{color:var(--text-primary);border-bottom-color:var(--accent,#7c5cfc)}.friends-pending-badge{background:var(--accent,#7c5cfc);color:#fff;border-radius:20px;padding:1px 5px;font-size:.6rem;font-weight:700;min-width:16px;text-align:center;box-shadow:0 0 8px rgba(var(--accent-rgb,124,92,252),.45);flex-shrink:0}.friends-sub-label{font-size:.55rem;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);padding:4px 2px 2px;font-weight:700;display:flex;align-items:center;gap:6px;opacity:.7}.friends-sub-label::after{content:'';flex:1;height:1px;background:rgba(255,255,255,.06)}#friends-list-section,#friends-requests-section{overflow-y:auto;flex:1;min-height:0}.friend-item{display:flex;align-items:center;gap:6px;padding:3px 4px;border-radius:6px;border:1px solid transparent;transition:background .15s ease,border-color .15s ease;cursor:default}.friend-item:hover{background:rgba(255,255,255,.048);border-color:rgba(255,255,255,.05)}.friend-item.friend-pending{background:rgba(var(--accent-rgb,124,92,252),.07);border-color:rgba(var(--accent-rgb,124,92,252),.18)}.friend-item.friend-pending:hover{background:rgba(var(--accent-rgb,124,92,252),.12);border-color:rgba(var(--accent-rgb,124,92,252),.26)}.friend-item.friend-pending-sent{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.06);opacity:.7}.friend-pending-sent .friend-action-btn{opacity:1}.friend-pending-sent .friend-cancel-btn:hover{color:#ff6b6b}.friend-avatar-wrap{position:relative;flex-shrink:0}.friend-avatar{width:24px;height:24px;border-radius:50%;background:var(--accent,#7c5cfc);color:#fff;font-size:.65rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}.friend-avatar-img{object-fit:cover;background:0 0}.friend-status-dot{position:absolute;bottom:-1px;right:-1px;width:8px;height:8px;border-radius:50%;border:2px solid var(--bg-primary,#191b28)}.friend-status-dot.online{background:#3ba55d;box-shadow:0 0 4px rgba(59,165,93,.5)}.friend-status-dot.offline{background:#4e5058}.friend-status-dot.away{background:#faa61a;border-radius:2px 2px 50% 50%}.friend-status-dot.dnd{background:var(--danger);border-radius:2px}.friend-status-dot.invisible{background:0 0;border:2px solid #4e5058}.friend-name-wrap{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.friend-name-wrap .friend-name{flex:none}.friend-status-text{font-size:9px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friend-name{flex:1;font-size:.75rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.05px}.friend-item.offline .friend-name{opacity:.42}.friend-pending-label{font-size:.66rem;color:var(--text-muted);white-space:nowrap}.friend-action-btn{background:0 0;border:none;cursor:pointer;width:19px;height:19px;display:flex;align-items:center;justify-content:center;border-radius:4px;font-size:.65rem;color:var(--text-muted);opacity:0;transition:opacity .15s ease,background .15s ease,color .15s ease,transform .1s ease;flex-shrink:0;padding:0}.friend-item:hover .friend-action-btn{opacity:1}.friend-item.friend-pending .friend-action-btn{opacity:1}.friend-action-btn:hover{background:rgba(255,255,255,.1);color:var(--text-primary);transform:scale(1.12)}.friend-accept-btn{color:#3ba55d;font-size:.82rem;font-weight:700}.friend-accept-btn:hover{background:rgba(59,165,93,.15);color:#3ba55d}.friend-decline-btn:hover,.friend-remove-btn:hover{background:rgba(240,71,71,.15);color:#f04747}.friend-self-tag{flex-shrink:0;font-size:.58rem;font-weight:600;color:var(--text-muted,#999);opacity:.5;margin-left:auto;margin-right:2px;pointer-events:none}.friend-unread-badge{flex-shrink:0;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--accent,#7c5cfc);color:#fff;font-size:.62rem;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;pointer-events:none}.friends-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px 12px;text-align:center;font-size:.74rem;color:var(--text-muted);line-height:1.5}.friends-empty-icon{font-size:1.5rem;opacity:.35;display:block}.sidebar-split .friends-pane{flex:1 1 0;min-height:0;overflow:hidden;display:flex;flex-direction:column}.room-float-modal{position:fixed;right:25px;bottom:100px;width:760px;min-width:740px;max-width:900px;height:600px;min-height:400px;max-height:680px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;box-shadow:0 32px 80px rgba(0,0,0,.65),0 12px 32px rgba(0,0,0,.45),var(--modal-ring);display:flex;flex-direction:column;z-index:10000010;overflow:hidden;transition:box-shadow .2s ease,transform .3s ease,left .3s ease,bottom .3s ease,opacity .3s ease}.room-float-resize-handle{position:absolute;top:0;bottom:0;width:6px;cursor:ew-resize;z-index:10;border-radius:20px;transition:background .15s ease}.room-float-resize-left{left:0}.room-float-resize-right{right:0}.room-float-resize-top{top:0;bottom:auto;left:6px;right:6px;width:auto;height:6px;cursor:ns-resize;border-radius:20px 20px 0 0}.room-float-resize-bottom{top:auto;bottom:0;left:6px;right:6px;width:auto;height:6px;cursor:ns-resize;border-radius:0 0 20px 20px}.room-float-resize-handle:active,.room-float-resize-handle:hover{background:rgba(255,255,255,.07)}.room-float-modal.room-float-minimized .room-float-resize-handle{display:none}.room-float-modal.dragging{transition:none;touch-action:none}.room-float-modal.room-float-slide-out{animation:room-slide-out-desktop .3s ease-in}@keyframes room-slide-out-desktop{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.room-float-modal:focus-within{box-shadow:0 32px 80px rgba(0,0,0,.7),0 12px 32px rgba(0,0,0,.5),0 0 0 2px var(--accent,#3d9e6e),0 0 0 1px rgba(255,255,255,.03) inset}.room-float-modal.room-float-minimized{width:200px!important;height:40px!important;min-width:140px!important;max-width:240px!important;min-height:40px!important;max-height:40px!important;resize:none;border-radius:10px 10px 0 0;padding:0;bottom:0!important;transition:left .2s ease,box-shadow .2s ease}.room-float-header{display:flex;align-items:center;padding:12px 14px 12px 12px;background:linear-gradient(160deg,rgba(var(--accent-rgb),.16) 0,rgba(var(--accent-rgb),.05) 60%,transparent 100%);border-bottom:1px solid rgba(var(--accent-rgb),.15);cursor:grab;user-select:none;border-radius:10px 10px 0 0;flex-shrink:0;gap:10px;min-height:54px;position:relative}.room-float-header:active{cursor:grabbing}.room-float-header.has-sub-color .room-float-roomname{color:var(--header-fg);font-weight:800;text-shadow:0 1px 3px rgba(0,0,0,.22)}.room-float-header.has-sub-color .room-float-subtitle{color:var(--header-fg-muted);opacity:1}.room-float-header.has-sub-color .room-float-meta-item{color:var(--header-fg-muted);opacity:1}.room-float-header.has-sub-color .room-float-chip{background:rgba(0,0,0,.18);border-color:rgba(0,0,0,.22);color:var(--header-fg-muted)}.room-float-header.has-sub-color .room-float-chip-value{color:var(--header-fg)}.room-float-header.has-sub-color .room-float-meta-divider{background:var(--header-divider)}.room-float-header.has-sub-color .room-float-icon{background:rgba(0,0,0,.18);border-color:rgba(0,0,0,.22);color:var(--header-fg);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}.room-float-header.has-sub-color .room-float-avatar{border-color:rgba(0,0,0,.22);box-shadow:0 0 0 2px rgba(255,255,255,.14)}.room-float-header.has-sub-color .room-float-btn{color:var(--header-fg-muted)}.room-float-header.has-sub-color .room-float-btn:hover{background:var(--header-btn-hover);color:var(--header-fg);transform:scale(1.08)}.room-float-header.has-sub-color .room-float-btn-close:hover{background:rgba(0,0,0,.22);color:var(--header-fg)}.room-float-header.has-sub-color .room-float-unread-dot{box-shadow:0 0 0 2px rgba(0,0,0,.3)}.room-float-modal.room-float-minimized .room-float-header{border-bottom:none;border-radius:10px 10px 0 0;min-height:40px;height:40px;padding:0 6px 0 8px;justify-content:flex-start;cursor:pointer;gap:6px}.room-float-modal.room-float-minimized .room-float-chips,.room-float-modal.room-float-minimized .room-float-meta-divider,.room-float-modal.room-float-minimized .room-float-subtitle{display:none}.room-float-modal.room-float-minimized .room-float-roomname{flex:1;min-width:0}.room-float-modal.room-float-minimized .room-float-actions{display:flex;gap:0}.room-float-modal.room-float-minimized .room-float-btn-minimize,.room-float-modal.room-float-minimized .room-float-btn-switch{display:none}.room-float-modal.room-float-minimized:hover{box-shadow:0 -4px 20px rgba(0,0,0,.4),0 0 0 1px var(--accent,#3d9e6e)}.room-float-icon-wrap{position:relative;flex-shrink:0}.room-float-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.3) 0,rgba(var(--accent-rgb),.4) 100%);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:var(--accent);flex-shrink:0;border:1px solid rgba(var(--accent-rgb),.3)}.room-float-title{display:flex;flex-direction:row;align-items:center;gap:6px;min-width:0;flex:1}.room-float-title-top{display:flex;align-items:center;gap:6px;min-width:0}.room-float-roomname{font-weight:700;font-size:14px;letter-spacing:-.01em;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-float-subtitle{font-size:11px;color:var(--text-muted,#666);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.75;letter-spacing:.01em}.room-float-meta-divider{width:1px;align-self:stretch;background:var(--border-color,rgba(255,255,255,.15));flex-shrink:0}.room-float-meta{display:flex;flex-direction:column;gap:1px;min-width:0}.room-float-meta-item{font-size:10px;color:var(--text-muted,#888);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.85;letter-spacing:.01em}.room-float-chips{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0}.room-float-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;background:rgba(var(--accent-rgb),.08);border:1px solid rgba(var(--accent-rgb),.18);color:var(--text-muted,#888);font-size:10.5px;font-weight:600;line-height:1.3;white-space:nowrap;cursor:default;transition:background .15s,border-color .15s}.room-float-chip-icon{font-size:11px;line-height:1}.room-float-chip-owner .room-float-chip-icon{text-shadow:0 1px 2px rgba(0,0,0,.5)}.room-float-chip-value{color:var(--text-primary,#e8e8f0);font-weight:700;letter-spacing:.01em}.room-float-chip-owner{max-width:160px}.room-float-chip-owner .room-float-chip-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-float-unread-dot{display:inline-flex;align-items:center;justify-content:center;background:red;color:#fff;border-radius:10px;font-size:10px;font-weight:700;min-width:18px;height:18px;padding:0 5px;flex-shrink:0;animation:dm-pulse 1.8s ease-in-out infinite;position:absolute;right:14px;top:12px}.room-float-modal.room-float-minimized .room-float-icon{width:22px;height:22px;font-size:11px;border-radius:5px;flex-shrink:0}.room-float-avatar{width:34px;height:34px;border-radius:10px;object-fit:cover;border:1px solid rgba(var(--accent-rgb),.3);background:rgba(var(--accent-rgb),.15);display:block;flex-shrink:0;cursor:zoom-in;transition:transform .18s ease,box-shadow .18s ease}.room-float-avatar:hover{transform:scale(1.15);box-shadow:0 4px 16px rgba(0,0,0,.4)}.room-float-modal.room-float-minimized .room-float-avatar{width:22px;height:22px;border-radius:5px}.room-avatar-panel{display:flex;flex-direction:column;align-items:center;gap:16px;padding:20px 16px}.room-avatar-preview-wrap{display:flex;flex-direction:column;align-items:center;gap:8px}.room-avatar-preview{width:80px;height:80px;border-radius:16px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.2) 0,rgba(var(--accent-rgb),.35) 100%);border:2px solid rgba(var(--accent-rgb),.3);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.room-avatar-preview .room-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:14px;display:block}.room-avatar-preview .room-avatar-placeholder{font-size:32px;color:var(--accent);font-weight:700;line-height:1}.room-avatar-preview-label{font-size:11px;color:var(--text-muted,#888);letter-spacing:.03em}.room-avatar-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center}.room-avatar-upload-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:8px;background:var(--accent,#3d9e6e);color:#fff;font-size:13px;font-weight:500;cursor:pointer;border:none;transition:opacity .15s;user-select:none}.room-avatar-upload-btn:hover{opacity:.85}.room-avatar-remove-btn{padding:7px 14px;border-radius:8px;background:0 0;border:1px solid rgba(255,80,80,.5);color:#f87171;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s}.room-avatar-remove-btn:hover{background:rgba(255,80,80,.12);border-color:rgba(255,80,80,.8)}.room-avatar-hint{font-size:11px;color:var(--text-muted,#888);text-align:center}.room-avatar-status{font-size:12px;text-align:center;padding:4px 12px;border-radius:6px}.room-avatar-status-info{color:var(--accent,#3d9e6e);background:rgba(var(--accent-rgb),.12)}.room-avatar-status-success{color:#4ade80;background:rgba(74,222,128,.1)}.room-avatar-status-error{color:#f87171;background:rgba(248,113,113,.1)}.avatar-crop-overlay{position:fixed;inset:0;z-index:10000000;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;animation:lightbox-fade-in .15s ease}.avatar-crop-box{background:var(--bg-secondary,#1e2030);border:1px solid var(--border,rgba(255,255,255,.1));border-radius:14px;padding:20px;max-width:520px;width:calc(100vw - 40px);box-shadow:0 20px 60px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:0}.avatar-crop-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.avatar-crop-title{font-size:14px;font-weight:600;color:var(--text-primary)}.avatar-crop-close{background:0 0;border:none;color:var(--text-secondary);cursor:pointer;font-size:20px;line-height:1;padding:2px 6px;border-radius:4px;transition:background .12s,color .12s}.avatar-crop-close:hover{background:rgba(255,255,255,.08);color:var(--text-primary)}.avatar-crop-canvas-wrap{border-radius:8px;overflow:hidden;background:#0a0a0f;line-height:0;user-select:none}.avatar-crop-canvas{display:block;width:100%;height:auto;touch-action:none}.avatar-crop-hint{font-size:11.5px;color:var(--text-secondary);text-align:center;margin:10px 0 14px}.avatar-crop-actions{display:flex;gap:10px;justify-content:flex-end}.avatar-crop-btn-full{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:var(--text-primary);border-radius:7px;padding:8px 16px;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s}.avatar-crop-btn-full:hover{background:rgba(255,255,255,.13)}.avatar-crop-btn-crop{background:var(--accent,#7c5cfc);border:none;color:#fff;border-radius:7px;padding:8px 18px;font-size:13px;font-weight:600;cursor:pointer;transition:filter .15s}.avatar-crop-btn-crop:hover{filter:brightness(1.12)}.room-float-modal.room-float-minimized .room-float-unread-dot{top:-8px;right:6px;z-index:10000020;min-width:16px;height:16px;font-size:9px;padding:0 4px;border-radius:8px;border:2px solid var(--bg-card,#1a1b2e)}.room-float-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.room-float-btn{background:0 0;border:none;color:var(--text-muted,#888);width:28px;height:28px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s,transform .1s;flex-shrink:0;padding:0}.room-float-btn:hover{background:rgba(255,255,255,.09);color:var(--text-primary,#e8e8f0);transform:scale(1.08)}.room-float-btn-close:hover{background:rgba(239,68,68,.16);color:#f87171;transform:scale(1.08)}.room-float-btn-cam.sharing,.room-float-btn-screen.sharing{color:#f87171}.room-menubar{display:flex;align-items:center;background:rgba(0,0,0,.18);border-bottom:1px solid rgba(255,255,255,.06);padding:0 6px;flex-shrink:0;height:26px;gap:0;position:relative;z-index:10}.room-float-modal.room-float-minimized .room-menubar,.room-float-modal.room-float-minimized .room-toolbar{display:none}.room-menu-item{position:relative}.room-menu-label{background:0 0;border:none;color:var(--text-muted,#999);font-size:11.5px;padding:2px 8px;cursor:pointer;border-radius:4px;height:22px;display:flex;align-items:center;line-height:1;transition:background .1s,color .1s;white-space:nowrap;user-select:none}.room-menu-item.open .room-menu-label,.room-menu-label:hover{background:rgba(255,255,255,.1);color:var(--text-primary,#e8e8f0)}.room-menu-dropdown{display:none;position:absolute;top:100%;left:0;min-width:170px;background:var(--bg-card,#1a1b2e);border:1px solid var(--border);border-radius:7px;box-shadow:0 8px 24px rgba(0,0,0,.5);padding:3px;z-index:99999;flex-direction:column;gap:1px}.room-menu-item.open .room-menu-dropdown{display:flex}.room-menu-action{background:0 0;border:none;color:var(--text-muted,#888);font-size:12px;padding:6px 10px;border-radius:5px;cursor:pointer;text-align:left;white-space:nowrap;transition:background .1s,color .1s}.room-menu-action:hover{background:rgba(var(--accent-rgb),.15);color:var(--text-primary,#e8e8f0)}.room-menu-action-checkbox{display:flex;align-items:center;gap:6px}.room-menu-check{display:inline-block;width:11px;flex-shrink:0;text-align:center}.room-menu-separator{height:1px;background:rgba(255,255,255,.07);margin:3px 6px}.room-menu-kape-btn{position:relative;background-color:rgba(var(--accent-rgb),.12);border:1px solid rgba(var(--accent-rgb),.35);color:var(--accent);font-size:11px;font-weight:600;padding:0 10px;cursor:pointer;border-radius:5px;height:19px;display:flex;align-items:center;gap:4px;line-height:1;white-space:nowrap;user-select:none;margin-left:auto;letter-spacing:.02em;box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:background-color .3s ease,border-color .3s ease,color .3s ease,transform .18s ease}.room-menu-kape-btn::before{content:'';position:absolute;inset:-1px;border-radius:6px;box-shadow:0 0 10px rgba(var(--accent-rgb),.4),0 0 3px rgba(var(--accent-rgb),.2);opacity:.3;animation:kapeGlow 2.8s ease-in-out infinite;pointer-events:none;transition:opacity .3s ease}@keyframes kapeGlow{0%,100%{opacity:.2}50%{opacity:.7}}.room-menu-kape-btn:hover{background-color:rgba(var(--accent-rgb),.22);border-color:rgba(var(--accent-rgb),.65);color:var(--accent-hover);transform:translateY(-.5px)}.room-menu-kape-btn:hover::before{animation:none;opacity:1}.room-menu-kape-btn:active{background-color:rgba(var(--accent-rgb),.3);transform:translateY(.5px)}.room-menu-kape-btn:active::before{opacity:.3}.room-float-topic-bar{display:flex;align-items:flex-start;gap:6px;padding:5px 10px;min-height:26px;background:rgba(0,0,0,.14);border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0;min-width:0}.room-float-modal.room-float-minimized .room-float-topic-bar{display:none!important}.room-float-topic-icon{flex-shrink:0;color:var(--text-muted,#888);display:flex;align-items:center;opacity:.7;padding-top:2px}.room-float-topic-text{font-size:11px;color:var(--text-muted,#999);white-space:normal;overflow-y:auto;overflow-x:hidden;flex:1;min-width:0;line-height:1.45;word-break:break-word;max-height:32px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.12) transparent}.room-float-topic-text::-webkit-scrollbar{width:3px}.room-float-topic-text::-webkit-scrollbar-track{background:0 0}.room-float-topic-text::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px}.room-float-topic-text:hover::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22)}.room-set-topic-modal{position:fixed;inset:0;z-index:10000000;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center}.room-set-topic-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:18px 20px 16px;width:360px;max-width:90vw;box-shadow:0 12px 40px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:12px}.room-set-topic-header{display:flex;align-items:center;justify-content:space-between}.room-set-topic-title{font-size:13.5px;font-weight:600;color:var(--text-primary,#e8e8f0)}.room-set-topic-close{background:0 0;border:none;color:var(--text-muted,#888);font-size:18px;cursor:pointer;line-height:1;padding:0 2px;border-radius:4px;transition:color .15s}.room-set-topic-close:hover{color:var(--text-primary,#e8e8f0)}.room-set-topic-input{width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text-primary,#e8e8f0);font-size:13px;padding:8px 10px;outline:0;box-sizing:border-box;transition:border-color .15s;resize:none;font-family:inherit;line-height:1.5;height:82px}.room-set-topic-input:focus{border-color:rgba(var(--accent-rgb),.5)}.room-set-topic-input::placeholder{color:var(--text-muted,#888)}.room-set-topic-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.room-set-topic-hint{font-size:11px;color:var(--text-muted,#777)}.room-set-topic-btns{display:flex;gap:6px}.room-set-topic-btn{font-size:12px;padding:5px 14px;border-radius:6px;border:none;cursor:pointer;font-weight:500;transition:background .15s,color .15s}.room-set-topic-clear{background:rgba(255,255,255,.07);color:var(--text-muted,#aaa)}.room-set-topic-clear:hover{background:rgba(255,255,255,.13);color:var(--text-primary,#e8e8f0)}.room-set-topic-save{background:rgba(var(--accent-rgb),.2);color:var(--accent,#a78bfa);border:1px solid rgba(var(--accent-rgb),.35)}.room-set-topic-save:hover{background:rgba(var(--accent-rgb),.32);color:var(--accent-hover,#c4b5fd)}.buy-kape-modal{position:fixed;inset:0;z-index:10000000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.72);animation:buyKapeFadeIn .2s ease}@keyframes buyKapeFadeIn{from{opacity:0}to{opacity:1}}.buy-kape-box{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.07);animation:buyKapeSlideUp .28s cubic-bezier(.34,1.56,.64,1);max-width:min(480px,90vw);max-height:85vh}@keyframes buyKapeSlideUp{from{transform:scale(.88) translateY(16px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.buy-kape-img{display:block;width:100%;height:auto;max-height:85vh;object-fit:contain}.buy-kape-close{position:absolute;top:10px;right:10px;width:30px;height:30px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.14);border-radius:50%;color:#fff;font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .15s,transform .15s;padding:0}.buy-kape-close:hover{background:rgba(255,255,255,.18);transform:scale(1.1)}.room-toolbar{display:flex;align-items:center;background:rgba(0,0,0,.14);border-bottom:1px solid rgba(255,255,255,.06);padding:6px 10px;flex-shrink:0;height:44px;gap:6px}.room-toolbar-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);color:var(--text-secondary,#b6b6c6);height:30px;padding:0 12px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;transition:background .14s ease,color .14s ease,border-color .14s ease,box-shadow .14s ease;white-space:nowrap;user-select:none;flex-shrink:0}.room-toolbar-btn:hover{background:rgba(255,255,255,.11);color:var(--text-primary,#e8e8f0);border-color:rgba(255,255,255,.18);box-shadow:0 2px 8px rgba(0,0,0,.18)}.room-toolbar-btn.active{background:rgba(var(--accent-rgb),.18);color:var(--accent,#3d9e6e);border-color:rgba(var(--accent-rgb),.35)}.room-toolbar-btn-owner{background:rgba(var(--accent-rgb),.07);border-color:rgba(var(--accent-rgb),.18);color:var(--accent)}.room-toolbar-btn-owner:hover{background:rgba(var(--accent-rgb),.15);border-color:rgba(var(--accent-rgb),.35);color:var(--accent-hover)}.room-toolbar-icon{font-size:14px;line-height:1;display:flex;align-items:center}.room-toolbar-btn-owner .room-toolbar-icon{text-shadow:0 1px 2px rgba(0,0,0,.5)}.room-toolbar-icon-img{width:14px;height:14px;display:block;object-fit:contain}.room-toolbar-icon-img-light{display:none}[data-theme=daylight] .room-toolbar-icon-img-dark{display:none}[data-theme=daylight] .room-toolbar-icon-img-light{display:block}.cam-badge-icon-light{display:none}[data-theme=daylight] .cam-badge-icon-dark{display:none}[data-theme=daylight] .cam-badge-icon-light{display:inline}.room-toolbar-label{font-size:12px;font-weight:500;line-height:1;letter-spacing:.01em}.room-toolbar-separator{width:1px;height:20px;background:rgba(255,255,255,.1);margin:0 5px;flex-shrink:0}.room-toolbar-btn-cam.sharing,.room-toolbar-btn-screen.sharing{background:rgba(var(--accent-rgb),.12);color:var(--accent);border-color:rgba(var(--accent-rgb),.3)}.room-toolbar-btn-view-screen{background:rgba(88,130,255,.1);border-color:rgba(88,130,255,.28);color:rgba(140,175,255,.9);max-width:260px}.room-toolbar-btn-view-screen:hover{background:rgba(88,130,255,.2);color:#a8c4ff;border-color:rgba(88,130,255,.5)}.room-view-screen-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}.room-view-screen-name{letter-spacing:.12em;font-weight:700}.room-screen-count-badge{display:inline-flex;align-items:center;justify-content:center;background:rgba(88,130,255,.25);border:1px solid rgba(88,130,255,.45);color:#a8c4ff;border-radius:10px;font-size:10px;font-weight:700;min-width:16px;height:16px;padding:0 4px;margin-left:4px;letter-spacing:0;vertical-align:middle}.room-screen-picker-popup{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.12);border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.3);min-width:220px;max-width:300px;overflow:hidden;animation:roomPickerIn .12s ease}@keyframes roomPickerIn{from{opacity:0;transform:translateY(6px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.room-screen-picker-header{display:flex;align-items:center;gap:7px;padding:9px 12px 8px;border-bottom:1px solid rgba(255,255,255,.07)}.room-screen-picker-icon{font-size:14px;flex-shrink:0}.room-screen-picker-title{font-size:12px;font-weight:600;color:var(--text-primary,#e0e0e0);letter-spacing:.06em;flex:1}.room-screen-picker-close{background:0 0;border:none;color:var(--text-muted,#888);font-size:13px;cursor:pointer;padding:1px 4px;border-radius:4px;line-height:1}.room-screen-picker-close:hover{background:rgba(231,76,60,.18);color:#e74c3c}.room-screen-picker-list{padding:6px 0}.room-screen-picker-row{display:flex;align-items:center;gap:8px;padding:7px 12px;transition:background .1s}.room-screen-picker-row:hover{background:rgba(255,255,255,.05)}.room-screen-picker-name{flex:1;font-size:12px;font-weight:600;color:var(--text-primary,#ddd);letter-spacing:.04em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-screen-picker-live{display:inline-flex;align-items:center;gap:3px;font-size:9px;font-weight:700;letter-spacing:.08em;color:#e74c3c;background:rgba(231,76,60,.15);border:1px solid rgba(231,76,60,.3);border-radius:4px;padding:1px 5px;flex-shrink:0}.room-screen-picker-live::before{content:"";width:5px;height:5px;border-radius:50%;background:#e74c3c;box-shadow:0 0 4px rgba(231,76,60,.8);animation:roomPickerLivePulse 1.6s ease-in-out infinite}@keyframes roomPickerLivePulse{0%,100%{opacity:1}50%{opacity:.35}}.room-screen-picker-watch{font-size:11px;font-weight:600;padding:4px 10px;border-radius:6px;border:1px solid rgba(88,130,255,.4);background:rgba(88,130,255,.12);color:#a8c4ff;cursor:pointer;transition:background .12s,border-color .12s;flex-shrink:0;white-space:nowrap}.room-screen-picker-watch:hover{background:rgba(88,130,255,.25);border-color:rgba(88,130,255,.65)}.room-screen-picker-watch.watching{background:rgba(67,181,129,.15);border-color:rgba(67,181,129,.4);color:#43b581}.room-screen-picker-watch.watching:hover{background:rgba(67,181,129,.25);border-color:rgba(67,181,129,.6)}.room-screen-picker-close:focus-visible,.room-screen-picker-watch:focus-visible{outline:2px solid #8cafff;outline-offset:1px}@media (prefers-color-scheme:light){.room-screen-picker-popup{background:#fff;border-color:rgba(0,0,0,.12);box-shadow:0 8px 32px rgba(0,0,0,.18),0 2px 8px rgba(0,0,0,.1)}.room-screen-picker-row:hover{background:rgba(0,0,0,.04)}}.room-screen-viewer-close{background:0 0!important;border:none!important;color:var(--text-muted,#aaa)!important;font-size:13px!important;padding:1px 5px!important;font-weight:400!important;letter-spacing:normal!important}.room-screen-viewer-close:hover{background:rgba(231,76,60,.2)!important;color:#e74c3c!important}.room-shortcuts-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:99999999;background:rgba(0,0,0,.5)}.room-shortcuts-box{display:flex;flex-direction:column;background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:12px;width:min(440px,calc(100vw - 40px));max-height:calc(100vh - 64px);box-shadow:0 16px 48px rgba(0,0,0,.6);overflow:hidden}.room-shortcuts-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border,rgba(255,255,255,.08))}.room-shortcuts-title{font-size:14px;font-weight:600;color:var(--text-primary,#e8e8f0)}.room-shortcuts-close{width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text-secondary,#ccc);font-size:18px;line-height:1;border-radius:6px;cursor:pointer}.room-shortcuts-close:hover{background:rgba(255,255,255,.12);color:var(--text-primary,#e8e8f0)}.room-shortcuts-body{padding:4px 18px 12px;overflow-y:auto}.room-shortcuts-group{margin-top:12px}.room-shortcuts-group-label{margin:12px 0 4px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted,#888)}.room-shortcuts-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05)}.room-shortcuts-row:last-child{border-bottom:none}.room-shortcuts-desc{font-size:12px;color:var(--text-secondary,#ccc)}.room-shortcuts-keys{display:flex;align-items:center;gap:4px;flex-shrink:0}.room-shortcuts-plus{font-size:10px;color:var(--text-muted,#888)}.room-shortcuts-key{min-width:20px;padding:2px 7px;background:var(--bg-input,rgba(255,255,255,.07));border:1px solid var(--border,rgba(255,255,255,.12));border-bottom-width:2px;border-radius:5px;color:var(--text-primary,#e8e8f0);font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:600;text-align:center;white-space:nowrap}.room-shortcuts-footer{display:flex;justify-content:flex-end;padding:12px 18px;border-top:1px solid var(--border,rgba(255,255,255,.08))}.room-shortcuts-ok{padding:7px 18px;background:var(--accent,#6c5ce7);border:1px solid var(--accent,#6c5ce7);border-radius:6px;color:#fff;font-size:12px;font-weight:600;cursor:pointer}.room-shortcuts-ok:hover{background:var(--accent-hover,#5a4bd4)}.room-menu-label-services{color:gold;font-weight:600;letter-spacing:.02em}.room-menu-label-services:hover{background:rgba(255,215,0,.12);color:gold}.room-menu-label-owner{color:var(--accent)}.room-menu-label-owner:hover{background:rgba(var(--accent-rgb),.12);color:var(--accent)}.room-menu-label-invite{color:var(--text-muted,#999)}.room-menu-label-invite:hover{background:rgba(255,255,255,.08);color:var(--text-secondary,#b6b6c6)}.room-services-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:99999999;background:rgba(0,0,0,.7);padding:16px}.room-services-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:24px;width:100%;max-width:780px;max-height:90vh;overflow-y:auto;box-shadow:0 24px 64px rgba(0,0,0,.7)}.room-services-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.room-services-title{font-size:1.05rem;font-weight:700;color:var(--text-primary,#e8e8f0)}.room-services-close{background:0 0;border:none;color:var(--text-muted,#888);font-size:1.3rem;cursor:pointer;padding:2px 6px;border-radius:4px;line-height:1}.room-services-close:hover{color:var(--text-primary,#e8e8f0);background:rgba(255,255,255,.07)}.svc-confirm-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100000000;background:rgba(0,0,0,.72);padding:16px}.svc-confirm-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:28px 26px 22px;width:100%;max-width:340px;text-align:center;box-shadow:0 24px 64px rgba(0,0,0,.7);animation:svcConfirmPop .18s ease-out}@keyframes svcConfirmPop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}.svc-confirm-icon{font-size:2.1rem;margin-bottom:8px}.svc-confirm-title{margin:0 0 10px;font-size:1.05rem;font-weight:700;color:var(--text-primary,#e8e8f0)}.svc-confirm-body{margin:0 0 22px;font-size:.85rem;line-height:1.5;color:var(--text-secondary,#b0b0c0)}.svc-confirm-cost{font-weight:700;color:gold}.svc-confirm-actions{display:flex;gap:10px}.svc-confirm-btn{flex:1;border:none;border-radius:8px;padding:10px 12px;font-size:.85rem;font-weight:600;cursor:pointer;transition:filter .15s,opacity .15s}.svc-confirm-btn-cancel{background:rgba(255,255,255,.08);color:var(--text-primary,#e8e8f0)}.svc-confirm-btn-cancel:hover{background:rgba(255,255,255,.14)}.svc-confirm-btn-ok{background:var(--accent,#7c5cfc);color:#fff}.svc-confirm-btn-ok:hover{filter:brightness(1.1)}.svc-confirm-btn-danger{background:#ef4444;color:#fff}.svc-confirm-btn-danger:hover{filter:brightness(1.1)}.room-services-subtitle{font-size:.8rem;color:var(--text-muted,#888);margin:0 0 16px}.svc-disabled-notice{background:rgba(255,100,100,.1);border:1px solid rgba(255,100,100,.3);border-radius:8px;padding:10px 14px;font-size:.8rem;color:#f88;margin-bottom:14px}.svc-tier-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.svc-tier-card{border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;background:rgba(255,255,255,.02);transition:border-color .2s}.svc-tier-card:hover{border-color:var(--tier-color,rgba(255,255,255,.15))}.svc-tier-card-active{border-color:var(--tier-color)!important;box-shadow:0 0 0 1px var(--tier-color)}.svc-tier-header{display:flex;align-items:center;gap:8px;padding:12px 14px}.svc-tier-badge{font-size:1.08rem}.svc-tier-name{font-weight:700;font-size:.95rem}.svc-tier-features{list-style:none;margin:0;padding:10px 14px;flex:1;display:flex;flex-direction:column;gap:5px}.svc-tier-features li{font-size:.75rem;color:var(--text-secondary,#b0b0c0);padding-left:14px;position:relative}.svc-tier-features li::before{content:"✓";position:absolute;left:0;color:var(--tier-color,#888);font-size:.7rem}.svc-tier-footer{padding:10px 14px}.svc-tier-price{display:block;font-size:1.1rem;font-weight:700;color:var(--text-primary,#e8e8f0);margin-bottom:8px}.svc-tier-price-period{font-size:.7rem;font-weight:400;color:var(--text-muted,#888)}.svc-tier-btn-group{display:flex;flex-direction:column;gap:6px}.svc-tier-btn-pay{border:1.5px solid;font-weight:700;opacity:.92;display:flex;align-items:center;justify-content:center;gap:5px}.svc-tier-btn-pay:hover{opacity:1;filter:brightness(1.08)}.svc-tier-btn-gcash{background:#007dff!important;border-color:#007dff!important;color:#fff!important}.svc-tier-btn-gcash:hover{background:#0068d6!important}.svc-gcash-logo{width:18px;height:18px;object-fit:contain;flex-shrink:0}.wallet-chip-wrap{padding:6px 10px 2px}.wallet-chip{display:flex;align-items:center;gap:7px;width:100%;padding:8px 12px;background:linear-gradient(135deg,rgba(255,215,0,.12),rgba(255,165,0,.08));border:1.5px solid rgba(255,215,0,.35);border-radius:10px;cursor:pointer;color:gold;font-weight:700;font-size:.88rem;transition:background .2s,border-color .2s,transform .15s}.wallet-chip:hover{background:rgba(255,215,0,.18);border-color:rgba(255,215,0,.6);transform:translateY(-1px)}.wallet-chip-icon{font-size:1.1rem}.wallet-chip-balance{flex:1;text-align:left}.wallet-chip-label{font-size:.7rem;font-weight:600;letter-spacing:.5px;opacity:.7;background:rgba(255,215,0,.15);padding:2px 6px;border-radius:4px}@keyframes wallet-pulse{0%,100%{box-shadow:none}50%{box-shadow:0 0 0 3px rgba(255,215,0,.4)}}.wallet-chip-pulse{animation:wallet-pulse .5s ease}.admin-page-links{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px 10px 4px}.admin-page-link{display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 8px;border-radius:8px;font-size:.72rem;font-weight:600;color:var(--text-muted,#5d6180);text-decoration:none;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);transition:background .15s,color .15s,border-color .15s;white-space:nowrap;letter-spacing:.01em}.admin-page-link:hover{background:rgba(124,92,252,.1);border-color:rgba(124,92,252,.25);color:var(--accent,#7c5cfc)}.admin-page-link svg{flex-shrink:0;opacity:.55;transition:opacity .15s}.admin-page-link:hover svg{opacity:1}.svc-wallet-chip-btn{background:rgba(255,215,0,.1);border:1.5px solid rgba(255,215,0,.35);border-radius:8px;color:gold;font-weight:700;font-size:.8rem;padding:4px 10px;cursor:pointer;display:flex;align-items:center;gap:4px;margin-right:6px}.svc-wallet-chip-btn:hover{background:rgba(255,215,0,.2)}.svc-wallet-balance{font-size:.82rem}.wallet-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.75);display:flex;align-items:center;justify-content:center;z-index:2147483647;padding:16px}.wallet-modal{background:var(--bg-secondary,#1a1a2e);border:1px solid rgba(255,215,0,.2);border-radius:18px;width:100%;max-width:440px;box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 0 1px rgba(255,215,0,.08);overflow:hidden}.wallet-modal-header{display:flex;align-items:center;gap:12px;padding:20px 20px 0}.wallet-modal-logo{font-size:2rem}.wallet-modal-title{font-size:1.1rem;font-weight:800;color:gold}.wallet-modal-balance-row{font-size:.8rem;color:var(--text-muted,#888);margin-top:2px}.wallet-modal-balance{color:gold;font-weight:700}.wallet-modal-close{margin-left:auto;background:0 0;border:none;color:var(--text-muted,#888);font-size:1.4rem;cursor:pointer;padding:4px 8px;border-radius:6px;line-height:1}.wallet-modal-close:hover{color:#fff;background:rgba(255,255,255,.08)}.wallet-tabs{display:flex;gap:4px;padding:14px 20px 0;border-bottom:1px solid rgba(255,255,255,.06)}.wallet-tab{padding:8px 16px;border-radius:8px 8px 0 0;border:none;background:0 0;color:var(--text-muted,#888);font-size:.83rem;font-weight:600;cursor:pointer;transition:color .15s,background .15s}.wallet-tab.active{background:rgba(255,215,0,.1);color:gold}.wallet-tab:hover:not(.active){color:#fff}.wallet-tab-panel{display:none;padding:18px 20px 20px}.wallet-tab-panel.active{display:block}.wallet-section-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted,#888);margin:0 0 10px}.wallet-chips-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.wallet-preset-chip{padding:10px 4px;border-radius:10px;border:2px solid rgba(255,215,0,.25);background:rgba(255,215,0,.06);color:gold;font-weight:700;font-size:.82rem;cursor:pointer;transition:all .15s;text-align:center}.wallet-preset-chip:hover{border-color:rgba(255,215,0,.6);background:rgba(255,215,0,.12);transform:translateY(-2px)}.wallet-preset-chip.active{border-color:gold;background:rgba(255,215,0,.2);box-shadow:0 0 0 2px rgba(255,215,0,.25)}.wallet-preset-custom{border-style:dashed;color:var(--text-muted,#888)}.wallet-preset-custom.active{color:gold}.wallet-custom-input-wrap{display:flex;align-items:center;gap:6px;margin-bottom:10px}.wallet-peso-sign{color:gold;font-weight:700;font-size:1.1rem}.wallet-custom-input{flex:1;padding:9px 12px;border-radius:8px;border:1.5px solid rgba(255,215,0,.3);background:rgba(255,255,255,.04);color:var(--text-primary,#e8e8f0);font-size:.95rem;outline:0}.wallet-custom-input:focus{border-color:gold}.wallet-selected-amount{font-size:.82rem;color:var(--text-muted,#888);margin-bottom:4px}.wallet-selected-amount strong{color:gold}.wallet-method-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.wallet-method-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 10px;border-radius:12px;border:2px solid;font-weight:700;font-size:.85rem;cursor:pointer;transition:all .15s}.wallet-method-gcash{background:rgba(0,125,255,.1);border-color:rgba(0,125,255,.4);color:#fff}.wallet-method-gcash:hover{background:rgba(0,125,255,.22);border-color:#007dff}.wallet-method-card{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15);color:var(--text-primary,#e8e8f0)}.wallet-method-card:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.35)}.wallet-method-logo{height:20px;object-fit:contain}.wallet-method-error{color:#f87171;font-size:.78rem;margin-top:8px}.wallet-method-note{color:var(--text-muted,#888);font-size:.78rem;text-align:center;margin:12px 0 0;line-height:1.4}.gcash-steps{display:flex;flex-direction:column;gap:10px;padding:16px 20px}.gcash-step-box{display:flex;align-items:flex-start;gap:12px}.gcash-step-num{width:26px;height:26px;border-radius:50%;background:#007dff;color:#fff;font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.gcash-step-body{flex:1}.gcash-step-label{font-size:.76rem;color:var(--text-muted,#888);margin-bottom:3px}.gcash-step-amount{font-size:1.8rem;font-weight:900;color:#007dff;line-height:1.1}.gcash-step-number{font-size:1.3rem;font-weight:800;letter-spacing:3px;color:var(--text-primary,#e8e8f0)}.gcash-step-name{font-size:.78rem;color:var(--text-muted,#888)}.gcash-step-ref{font-size:1.2rem;font-weight:800;font-family:monospace;color:#f59e0b;letter-spacing:2px}.gcash-txn-input{width:100%;box-sizing:border-box;padding:9px 12px;margin-top:6px;border-radius:8px;border:1.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--text-primary,#e8e8f0);font-size:.9rem;outline:0}.gcash-txn-input:focus{border-color:#007dff}.gcash-submit-error{color:#f87171;font-size:.78rem;margin-top:4px}.gcash-wait-note{font-size:.72rem;color:var(--text-muted,#888);text-align:center;padding:8px 20px 16px;margin:0}.wallet-history-list{display:flex;flex-direction:column;gap:6px;max-height:320px;overflow-y:auto}.wallet-history-loading{color:var(--text-muted,#888);font-size:.83rem;text-align:center;padding:20px}.wallet-history-row{display:flex;align-items:center;gap:10px;padding:9px 12px;background:rgba(255,255,255,.03);border-radius:10px;border:1px solid rgba(255,255,255,.06);transition:background .15s ease,border-color .15s ease}.wallet-history-row:hover{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.1)}.wallet-history-icon{flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;font-size:.9rem}.wallet-history-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.wallet-history-desc{font-size:.78rem;font-weight:600;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wallet-history-meta{display:flex;align-items:center;gap:5px;font-size:.66rem;color:var(--text-muted,#888)}.wallet-history-ref{font-family:monospace;letter-spacing:.2px}.wallet-history-dot{opacity:.5}.wallet-history-right{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;gap:2px}.wallet-history-amount{font-size:.84rem;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}.wallet-history-bal{font-size:.64rem;color:var(--text-muted,#888);font-variant-numeric:tabular-nums;white-space:nowrap}.wallet-receipt-sub{text-align:center;font-size:.82rem;color:var(--text-muted,#888);margin:2px 0 16px;padding:0 20px}.wallet-receipt-box{margin:0 20px 16px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07)}.wallet-receipt-row{display:flex;align-items:center;justify-content:space-between;padding:5px 0}.wallet-receipt-label{font-size:.76rem;color:var(--text-muted,#888)}.wallet-receipt-value{font-size:.84rem;font-weight:700;color:var(--text-primary,#e8e8f0)}.wallet-receipt-divider{height:1px;background:rgba(255,255,255,.08);margin:8px 0}.wallet-receipt-ref-row{display:flex;align-items:center;justify-content:space-between;padding:4px 0 0}.wallet-receipt-ref-wrap{display:flex;align-items:center;gap:6px}.wallet-receipt-ref{font-family:monospace;font-size:.95rem;font-weight:800;letter-spacing:1.5px;color:#f59e0b}.wallet-receipt-copy-btn{border:none;background:rgba(245,158,11,.12);color:#f59e0b;width:24px;height:24px;border-radius:6px;cursor:pointer;font-size:.85rem;display:flex;align-items:center;justify-content:center;line-height:1}.wallet-receipt-copy-btn:hover{background:rgba(245,158,11,.22)}.wallet-confirm-icon{font-size:3rem;text-align:center;padding:20px 0 4px}.gcash-instr-box{background:rgba(0,125,255,.07);border:1px solid rgba(0,125,255,.2);border-radius:10px;padding:14px 16px}.gcash-instr-step{font-size:.78rem;color:var(--text-muted,#888);margin-bottom:4px;margin-top:10px}.gcash-instr-box .gcash-instr-step:first-child{margin-top:0}.gcash-instr-amount{font-size:2rem;font-weight:800;color:#007dff;letter-spacing:-1px}.gcash-instr-number{font-size:1.4rem;font-weight:700;color:var(--text-primary,#e8e8f0);letter-spacing:2px}.gcash-instr-name{font-size:.8rem;color:var(--text-muted,#888);margin-top:2px}.gcash-instr-ref{font-size:1.1rem;font-weight:700;color:#f59e0b;letter-spacing:2px;font-family:monospace}.gcash-instr-hint{font-size:.72rem;color:var(--text-muted,#888);margin-top:6px}.gcash-txn-ref-input{width:100%;box-sizing:border-box;padding:9px 12px;border-radius:8px;border:1.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--text-primary,#e8e8f0);font-size:.9rem;outline:0;margin-top:6px}.gcash-txn-ref-input:focus{border-color:#007dff}[data-theme=daylight] .wallet-chip{background:linear-gradient(135deg,rgba(200,120,32,.12),rgba(200,120,32,.06));border-color:rgba(200,120,32,.4);color:#a05c10}[data-theme=daylight] .wallet-chip:hover{background:rgba(200,120,32,.18);border-color:rgba(200,120,32,.6)}[data-theme=daylight] .wallet-chip-label{background:rgba(200,120,32,.16)}[data-theme=daylight] .admin-page-link{background:var(--bg-card);border-color:var(--border-light)}[data-theme=daylight] .svc-wallet-chip-btn{background:rgba(200,120,32,.1);border-color:rgba(200,120,32,.4);color:#a05c10}[data-theme=daylight] .svc-wallet-chip-btn:hover{background:rgba(200,120,32,.18)}[data-theme=daylight] .wallet-modal{border-color:rgba(200,120,32,.25);box-shadow:0 16px 48px rgba(0,0,0,.16),0 0 0 1px rgba(200,120,32,.08)}[data-theme=daylight] .wallet-modal-balance,[data-theme=daylight] .wallet-modal-title{color:#a05c10}[data-theme=daylight] .wallet-tabs{border-bottom-color:var(--border-light)}[data-theme=daylight] .wallet-tab:hover:not(.active){color:var(--text-primary)}[data-theme=daylight] .wallet-tab.active{background:rgba(200,120,32,.12);color:#a05c10}[data-theme=daylight] .wallet-preset-chip{color:#a05c10;background:rgba(200,120,32,.05);border-color:rgba(200,120,32,.3)}[data-theme=daylight] .wallet-preset-chip:hover{background:rgba(200,120,32,.12);border-color:rgba(200,120,32,.55)}[data-theme=daylight] .wallet-preset-chip.active{border-color:#c87820;background:rgba(200,120,32,.18);box-shadow:0 0 0 2px rgba(200,120,32,.22)}[data-theme=daylight] .wallet-preset-custom.active{color:#a05c10}[data-theme=daylight] .wallet-peso-sign,[data-theme=daylight] .wallet-selected-amount strong{color:#a05c10}[data-theme=daylight] .wallet-custom-input{background:var(--bg-input);border-color:var(--border)}[data-theme=daylight] .wallet-custom-input:focus{border-color:#c87820}[data-theme=daylight] .wallet-method-card{background:var(--bg-input);border-color:var(--border)}[data-theme=daylight] .wallet-method-card:hover{background:var(--bg-hover);border-color:var(--border-light)}[data-theme=daylight] .wallet-method-gcash{background:rgba(0,125,255,.07);color:#0057b3}[data-theme=daylight] .wallet-method-gcash:hover{background:rgba(0,125,255,.15)}[data-theme=daylight] .gcash-txn-input,[data-theme=daylight] .gcash-txn-ref-input{background:var(--bg-input);border-color:var(--border)}[data-theme=daylight] .wallet-history-row{background:var(--bg-card);border-color:var(--border-light)}[data-theme=daylight] .wallet-receipt-box{background:var(--bg-card);border-color:var(--border-light)}[data-theme=daylight] .wallet-receipt-divider{background:var(--border-light)}.gcash-admin-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px;border-radius:10px;background:rgba(0,125,255,.03);border:1px solid rgba(0,125,255,.08);transition:background .12s,border-color .12s}.gcash-admin-card:hover{background:rgba(0,125,255,.06);border-color:rgba(0,125,255,.15)}.gcash-card-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.gcash-card-info{display:flex;flex-direction:column;gap:4px;min-width:0}.gcash-card-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.gcash-tier-badge{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#007dff;background:rgba(0,125,255,.1);border:1px solid rgba(0,125,255,.22);padding:2px 8px;border-radius:5px;white-space:nowrap;flex-shrink:0}.gcash-card-username{font-size:.85rem;font-weight:600;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gcash-card-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.gcash-meta-label{font-size:.7rem;color:var(--text-muted,#888);text-transform:uppercase;letter-spacing:.04em}.gcash-ref-value{font-family:monospace;font-size:.76rem;font-weight:600;color:#f59e0b;letter-spacing:.5px}.gcash-txn-value{font-family:monospace;font-size:.76rem;color:var(--text-secondary,#b0b0c0);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gcash-txn-awaiting{color:var(--text-muted,#888);font-style:italic;font-family:inherit}.gcash-meta-sep{color:rgba(255,255,255,.15);font-size:.7rem}.gcash-card-right{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex-shrink:0}.gcash-amount-date{font-size:.78rem;font-weight:500;color:var(--text-secondary,#b0b0c0);white-space:nowrap}.gcash-card-actions{display:flex;align-items:center;gap:6px}.gcash-status-badge{display:inline-flex;align-items:center;font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:2px 8px;border-radius:20px;white-space:nowrap;border:1px solid}.gcash-status-badge.status-pending{background:rgba(136,136,136,.1);color:#999;border-color:rgba(136,136,136,.2)}.gcash-status-badge.status-submitted{background:rgba(245,158,11,.1);color:#f59e0b;border-color:rgba(245,158,11,.28)}.gcash-status-badge.status-approved{background:rgba(34,197,94,.1);color:#22c55e;border-color:rgba(34,197,94,.28)}.gcash-status-badge.status-rejected{background:rgba(248,113,113,.1);color:#f87171;border-color:rgba(248,113,113,.28)}.gcash-action-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:6px;font-size:.72rem;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,transform .1s;white-space:nowrap;border:1px solid}.gcash-action-btn:active{transform:scale(.96)}.gcash-approve-btn{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.28);color:#22c55e}.gcash-approve-btn:hover{background:rgba(34,197,94,.16);border-color:rgba(34,197,94,.5)}.gcash-reject-btn{background:rgba(248,113,113,.08);border-color:rgba(248,113,113,.28);color:#f87171}.gcash-reject-btn:hover{background:rgba(248,113,113,.16);border-color:rgba(248,113,113,.5)}.subs-admin-tab-gcash{color:#007dff!important}.subs-admin-tab-gcash.active{border-bottom-color:#007dff!important}.subs-admin-tab-gcash .subs-admin-tab-badge{background:rgba(0,125,255,.1);color:#007dff}.subs-admin-tab-gcash.active .subs-admin-tab-badge{background:rgba(0,125,255,.18);color:#007dff}#subs-list-gcash{gap:6px}.wallet-rich-row{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:12px;padding:10px 14px;border-radius:9px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.04);transition:background .12s,border-color .12s}.wallet-rich-row:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.08)}.wallet-rich-rank{font-size:.78rem;font-weight:700;color:var(--text-muted,#888);text-align:center;font-variant-numeric:tabular-nums}.wallet-rich-rank.wallet-rank-gold{color:#f59e0b}.wallet-rich-rank.wallet-rank-silver{color:#94a3b8}.wallet-rich-rank.wallet-rank-bronze{color:#c2845a}.wallet-rich-username{font-size:.85rem;font-weight:600;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wallet-rich-balance{font-size:.85rem;font-weight:700;color:#22c55e;white-space:nowrap;font-variant-numeric:tabular-nums}.svc-tier-btn{width:100%;padding:8px;border-radius:8px;font-size:.77rem;font-weight:600;cursor:pointer;transition:background .2s,opacity .2s}.svc-tier-btn-claim{background:0 0;border:1.5px solid}.svc-tier-btn-claim:hover{background:rgba(255,255,255,.06)}.svc-tier-btn-active{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.15);color:var(--text-muted,#888);cursor:default;text-shadow:0 1px 2px rgba(0,0,0,.5)}.svc-tier-btn-disabled{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--text-muted,#888);cursor:default;opacity:.6}.svc-tier-capacity{margin-left:auto;font-size:.7rem;font-weight:600;opacity:.85;white-space:nowrap}.svc-type-tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:0}.svc-type-tab{background:0 0;border:none;border-bottom:2px solid transparent;color:var(--text-muted,#888);font-size:.88rem;font-weight:600;padding:8px 16px;cursor:pointer;transition:color .15s,border-color .15s;margin-bottom:-1px}.svc-type-tab[data-tab=crown],.svc-type-tab[data-tab=badge]{text-shadow:0 1px 2px rgba(0,0,0,.5)}.svc-type-tab:hover{color:var(--text-primary,#e8e8f0)}.svc-type-tab.active{color:var(--text-primary,#e8e8f0);border-bottom-color:var(--accent,#7c5cfc)}.svc-type-panel{display:none}.svc-type-panel.active{display:block}.svc-duration-bar{display:flex;gap:4px;margin-bottom:18px;background:rgba(255,255,255,.03);border-radius:10px;padding:4px;border:1px solid rgba(255,255,255,.06)}.svc-duration-pill{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 4px;border-radius:7px;background:0 0;border:1px solid transparent;color:var(--text-muted,#888);cursor:pointer;transition:all .18s;line-height:1.2}.svc-duration-pill:hover{color:var(--text-primary,#e8e8f0);background:rgba(255,255,255,.05)}.svc-duration-pill.active{background:rgba(124,92,252,.15);border-color:rgba(124,92,252,.45);color:var(--text-primary,#e8e8f0)}.svc-duration-main{font-size:.78rem;font-weight:600;white-space:nowrap}.svc-duration-save{font-size:.62rem;font-weight:700;color:#4ade80;letter-spacing:.01em;white-space:nowrap}.svc-duration-pill.active .svc-duration-save{color:#6ee7b7}.subs-admin-open-btn{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:var(--text-secondary,#b0b0c0);font-size:.8rem;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s}.subs-admin-open-btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);color:var(--text-primary,#e8e8f0)}.subs-admin-modal{width:620px;max-width:96vw;max-height:80vh;display:flex;flex-direction:column;padding:0;overflow:hidden;border-radius:14px;background:var(--bg-elevated,#1e1e2a);border:1px solid rgba(255,255,255,.07)}.subs-admin-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 16px;border-bottom:1px solid rgba(255,255,255,.07);gap:12px;flex-shrink:0}.subs-admin-header-info{display:flex;align-items:center;gap:12px}.subs-admin-header-icon{width:36px;height:36px;border-radius:10px;background:rgba(124,92,252,.12);border:1px solid rgba(124,92,252,.2);display:flex;align-items:center;justify-content:center;color:var(--accent,#7c5cfc);flex-shrink:0}.subs-admin-title{margin:0;font-size:1rem;font-weight:700;color:var(--text-primary,#e8e8f0);line-height:1.2}.subs-admin-subtitle{margin:2px 0 0;font-size:.75rem;color:var(--text-muted,#888);line-height:1.3}.subs-admin-header-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.subs-admin-action-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);color:var(--text-secondary,#b0b0c0);font-size:.78rem;font-weight:600;cursor:pointer;transition:background .15s,color .15s}.subs-admin-action-btn:hover{background:rgba(255,255,255,.09);color:var(--text-primary,#e8e8f0)}.subs-admin-close-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:0 0;border:none;color:var(--text-muted,#888);font-size:.9rem;cursor:pointer;transition:background .15s,color .15s}.subs-admin-close-btn:hover{background:rgba(255,255,255,.07);color:var(--text-primary,#e8e8f0)}.subs-admin-search-bar{display:flex;align-items:center;gap:0;margin:0 22px 0;padding:10px 0 10px;border-bottom:1px solid rgba(255,255,255,.07);position:relative}.subs-admin-search-icon{position:absolute;left:12px;color:var(--text-muted,#888);pointer-events:none;flex-shrink:0}.subs-admin-search-input{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:7px 34px 7px 34px;color:var(--text-primary,#e8e8f0);font-size:.82rem;outline:0;transition:border-color .15s,background .15s;width:100%}.subs-admin-search-input::placeholder{color:var(--text-muted,#888)}.subs-admin-search-input:focus{border-color:rgba(124,92,252,.45);background:rgba(255,255,255,.06)}.subs-admin-search-clear{position:absolute;right:8px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.06);border:none;color:var(--text-muted,#888);cursor:pointer;transition:background .15s,color .15s}.subs-admin-search-clear:hover{background:rgba(255,255,255,.12);color:var(--text-primary,#e8e8f0)}.subs-admin-tabs{display:flex;gap:0;padding:0 22px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0}.subs-admin-tab{display:inline-flex;align-items:center;gap:7px;padding:11px 16px;background:0 0;border:none;border-bottom:2px solid transparent;color:var(--text-muted,#888);font-size:.83rem;font-weight:600;cursor:pointer;margin-bottom:-1px;transition:color .15s,border-color .15s}.subs-admin-tab:hover{color:var(--text-secondary,#b0b0c0)}.subs-admin-tab.active{color:var(--text-primary,#e8e8f0);border-bottom-color:var(--accent,#7c5cfc)}.subs-admin-tab-badge{min-width:18px;height:18px;padding:0 5px;border-radius:20px;background:rgba(255,255,255,.08);color:var(--text-muted,#888);font-size:.7rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s}.subs-admin-tab.active .subs-admin-tab-badge{background:rgba(124,92,252,.18);color:var(--accent,#7c5cfc)}.subs-admin-body{flex:1;overflow:hidden}.subs-admin-panel{display:none;height:100%}.subs-admin-panel.active{display:flex;flex-direction:column}.subs-admin-list{flex:1;overflow-y:auto;padding:10px 22px;display:flex;flex-direction:column;gap:2px}.subs-admin-row{display:grid;grid-template-columns:10px 80px 1fr auto auto;align-items:center;gap:10px;padding:10px 14px;border-radius:9px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.04);transition:background .12s,border-color .12s}.subs-admin-row:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.08)}.subs-admin-tier-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.subs-admin-tier-label{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}.subs-admin-username{font-size:.85rem;font-weight:600;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.subs-admin-expiry{font-size:.73rem;color:var(--text-muted,#888);white-space:nowrap}.subs-admin-expiry.expired{color:#ff6b6b}.subs-admin-revoke-btn{padding:4px 10px;border-radius:6px;background:rgba(255,100,100,.08);border:1px solid rgba(255,100,100,.18);color:#f88;font-size:.72rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}.subs-admin-revoke-btn:hover{background:rgba(255,100,100,.16);border-color:rgba(255,100,100,.35)}.subs-admin-empty{padding:32px 0;text-align:center;color:var(--text-muted,#888);font-size:.83rem}.subs-admin-loading{padding:32px 0;text-align:center;color:var(--text-muted,#888);font-size:.83rem}@keyframes room-sub-shimmer{0%{background-position:200% center}100%{background-position:-200% center}}.room-list-item.room-sub-active{position:relative;overflow:hidden;background:linear-gradient(105deg,rgba(var(--room-color-rgb),.11) 0,rgba(var(--room-color-rgb),.04) 50%,transparent 80%);box-shadow:inset 3px 0 0 var(--room-color),0 0 0 1px rgba(var(--room-color-rgb),.14);border-color:rgba(var(--room-color-rgb),.14);transition:background .15s,box-shadow .15s,border-color .15s}.room-list-item.room-sub-active::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0,rgba(var(--room-color-rgb),.09) 50%,transparent 100%);background-size:200% 100%;animation:room-sub-shimmer 4s linear infinite;pointer-events:none;border-radius:12px}.room-list-item.room-sub-active:hover{background:linear-gradient(105deg,rgba(var(--room-color-rgb),.17) 0,rgba(var(--room-color-rgb),.07) 50%,transparent 80%);box-shadow:inset 3px 0 0 var(--room-color),0 0 0 1px rgba(var(--room-color-rgb),.22),0 4px 20px rgba(var(--room-color-rgb),.1);border-color:rgba(var(--room-color-rgb),.22)}.room-list-item.room-sub-active.active{background:linear-gradient(105deg,rgba(var(--room-color-rgb),.16) 0,rgba(var(--room-color-rgb),.07) 50%,transparent 80%);box-shadow:inset 3px 0 0 var(--room-color),0 0 0 1px rgba(var(--room-color-rgb),.25);border-color:rgba(var(--room-color-rgb),.25)}.room-list-item[data-sub-color] .room-list-item-avatar{transition:box-shadow .2s}.room-list-item-name.room-sub-name{font-weight:700}.room-sub-tier-badge{display:flex;align-items:center;justify-content:center;flex-shrink:0;filter:drop-shadow(0 2px 6px rgba(0, 0, 0, .8))}.room-sub-tier-badge img{display:block;height:38px;width:auto;object-fit:contain}.svc-crown-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:4px}.svc-crown-item{display:flex;flex-direction:column;align-items:center;gap:7px;padding:16px 10px 14px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.02);text-align:center;cursor:default;transition:border-color .2s,background .2s,box-shadow .2s}.svc-crown-item:hover{border-color:var(--crown-color);background:rgba(var(--crown-rgb),.07);box-shadow:0 0 0 1px var(--crown-color),0 4px 20px rgba(var(--crown-rgb),.15)}.svc-crown-icon-wrap{width:39px;height:39px;display:flex;align-items:center;justify-content:center;border-radius:50%}.svc-crown-icon-img{display:block;width:32px;height:32px;object-fit:contain}.svc-crown-name{font-weight:700;font-size:.82rem;letter-spacing:.02em}.svc-crown-priority{font-size:.68rem;color:var(--crown-color);font-weight:600;opacity:.85}.svc-crown-label{font-size:.68rem;color:var(--text-muted,#888);line-height:1.3}.svc-crown-subtabs,.svc-giftroom-subtabs{display:flex;gap:4px;margin-bottom:12px;border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:0}.svc-crown-subtab,.svc-giftroom-subtab{background:0 0;border:none;border-bottom:2px solid transparent;color:var(--text-muted,#888);font-size:.83rem;font-weight:600;padding:6px 14px;cursor:pointer;transition:color .15s,border-color .15s;margin-bottom:-1px}.svc-giftroom-subtab[data-giftroom-tab=crown]{text-shadow:0 1px 2px rgba(0,0,0,.5)}.svc-crown-subtab:hover,.svc-giftroom-subtab:hover{color:var(--text-primary,#e8e8f0)}.svc-crown-subtab.active,.svc-giftroom-subtab.active{color:var(--text-primary,#e8e8f0);border-bottom-color:var(--accent,#7c5cfc)}.svc-crown-subpanel,.svc-giftroom-subpanel{display:none}.svc-crown-subpanel.active,.svc-giftroom-subpanel.active{display:block}.svc-giftroom-target{margin-bottom:14px;display:flex;flex-direction:column;gap:6px}.svc-giftroom-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted,#888)}.svc-giftroom-select{background:var(--bg-secondary,#1c1c26);color:var(--text-primary,#e8e8f0);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:9px 12px;font-size:.88rem;font-weight:600;cursor:pointer}.svc-giftroom-select:focus{outline:0;border-color:var(--accent,#7c5cfc)}.svc-giftroom-hint{font-size:.76rem;color:var(--text-muted,#888)}.svc-crown-footer-note{margin-top:14px;font-size:.77rem;color:var(--text-muted,#888);text-align:center;padding:0 8px}.svc-crown-footer-note strong{color:var(--text-secondary,#b0b0c0)}.svc-crown-item-active{border-color:var(--crown-color)!important;box-shadow:0 0 0 1px var(--crown-color),0 4px 20px rgba(var(--crown-rgb),.18)}.svc-crown-btn-wrap{width:100%;margin-top:2px}.svc-crown-btn-wrap .svc-tier-btn{font-size:.7rem;padding:7px 6px}.svc-crown-price{font-size:.82rem;font-weight:700;color:var(--text-primary,#e8e8f0);margin-top:-2px}.svc-badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(152px,1fr));gap:10px}.svc-badge-section-label{grid-column:1/-1;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted,#888);padding:4px 2px 2px;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:2px}.svc-badge-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 10px 14px;border-radius:14px;border:1.5px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);text-align:center;transition:border-color .2s,background .2s,transform .15s;cursor:default}.svc-badge-card:hover{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05);transform:translateY(-2px)}.svc-badge-card-active{border-color:rgba(124,92,252,.6)!important;background:rgba(124,92,252,.08)!important;box-shadow:0 0 0 1px rgba(124,92,252,.4)}.svc-badge-card-owned{border-color:rgba(56,189,120,.45)!important;background:rgba(56,189,120,.05)!important}.svc-badge-card-displaying{border-color:rgba(124,92,252,.6)!important;background:rgba(124,92,252,.07)!important;box-shadow:0 0 0 1px rgba(124,92,252,.3)}.svc-badge-owned-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center;width:100%;margin:2px 0}.svc-badge-owned-chip{font-size:.65rem;font-weight:700;letter-spacing:.04em;color:#38bd78;background:rgba(56,189,120,.12);border:1px solid rgba(56,189,120,.3);border-radius:20px;padding:2px 8px;text-transform:uppercase}.svc-badge-card-displaying .svc-badge-owned-chip{color:#a78bfa;background:rgba(124,92,252,.14);border-color:rgba(124,92,252,.4)}.svc-badge-expiry{font-size:.62rem;color:var(--text-muted,#888)}.svc-tier-btn-extend{background:rgba(56,189,120,.12)!important;border-color:rgba(56,189,120,.4)!important;color:#38bd78!important;font-weight:600}.svc-tier-btn-extend:hover{background:rgba(56,189,120,.22)!important}.svc-badge-emoji{font-size:2.27rem;line-height:1;filter:drop-shadow(0 3px 10px rgba(0, 0, 0, .35))}.svc-badge-name{font-size:.88rem;font-weight:700;color:var(--text-primary,#e8e8f0);letter-spacing:.01em}.svc-badge-desc{font-size:.7rem;color:var(--text-muted,#888);line-height:1.3;min-height:2.6em}.svc-badge-footer{width:100%;margin-top:4px}.svc-badge-price{display:block;font-size:1rem;font-weight:700;color:var(--text-primary,#e8e8f0);margin-bottom:6px}.svc-tier-btn-switch{background:rgba(124,92,252,.15)!important;border-color:rgba(124,92,252,.5)!important;color:#a78bfa!important;font-weight:600}.svc-tier-btn-switch:hover{background:rgba(124,92,252,.25)!important}.room-list-item.room-sub-active::before{content:'';position:absolute;inset:0;border-radius:12px;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 10% 50%,rgba(var(--room-color-rgb),.28) 0,transparent 65%)}@keyframes tier-champion-glow{0%,100%{opacity:.45}20%{opacity:.78}38%{opacity:.3}55%{opacity:.65}72%{opacity:.28}87%{opacity:.6}}.room-list-item.room-sub-active[data-sub-tier=champion]::before{animation:tier-champion-glow 1.3s ease-in-out infinite}@keyframes tier-sovereign-glow{0%,100%{opacity:.28}50%{opacity:.55}}.room-list-item.room-sub-active[data-sub-tier=sovereign]::before{animation:tier-sovereign-glow 3s ease-in-out infinite}@keyframes tier-legend-glow{0%,100%{opacity:.18}40%{opacity:.52}65%{opacity:.3}}.room-list-item.room-sub-active[data-sub-tier=legend]::before{animation:tier-legend-glow 2.4s ease-in-out infinite}@keyframes tier-elite-glow{0%,100%{opacity:.2}33%{opacity:.48}66%{opacity:.28}}.room-list-item.room-sub-active[data-sub-tier=elite]::before{animation:tier-elite-glow 4s ease-in-out infinite}@keyframes tier-premium-glow{0%,100%{opacity:.22}50%{opacity:.48}}.room-list-item.room-sub-active[data-sub-tier=premium]::before{animation:tier-premium-glow 3.5s ease-in-out infinite}@keyframes tier-vip-glow{0%,100%{opacity:.28}25%{opacity:.58}50%{opacity:.22}75%{opacity:.52}}.room-list-item.room-sub-active[data-sub-tier=vip]::before{animation:tier-vip-glow 2s ease-in-out infinite}@keyframes tier-celestial-glow{0%,100%{opacity:.22}40%{opacity:.55}70%{opacity:.32}}.room-list-item.room-sub-active[data-sub-tier=celestial]::before{animation:tier-celestial-glow 2s ease-in-out infinite}@keyframes tier-mythic-glow{0%,100%{opacity:.28}45%{opacity:.62}}.room-list-item.room-sub-active[data-sub-tier=mythic]::before{animation:tier-mythic-glow 2.8s ease-in-out infinite}@keyframes tier-apex-glow{0%,100%{opacity:.5}15%{opacity:.88}30%{opacity:.3}50%{opacity:.8}68%{opacity:.25}82%{opacity:.72}}.room-list-item.room-sub-active[data-sub-tier=apex]::before{animation:tier-apex-glow 1.1s ease-in-out infinite}.room-opts-rename-section{margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07)}.room-opts-rename-header{display:flex;align-items:center;gap:8px}.room-opts-rename-tier-badge{font-size:.65rem;font-weight:700;padding:2px 7px;border-radius:20px;border:1px solid;letter-spacing:.03em;text-transform:uppercase}.room-opts-rename-row{display:flex;gap:8px;margin-top:10px}.room-opts-rename-input{flex:1;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 12px;font-size:.85rem;color:var(--text-primary,#e8e8f0);outline:0;transition:border-color .15s}.room-opts-rename-input:focus{border-color:rgba(255,255,255,.25)}.room-opts-rename-btn{padding:8px 16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:8px;color:var(--text-primary,#e8e8f0);font-size:.82rem;font-weight:600;cursor:pointer;transition:background .15s;white-space:nowrap}.room-opts-rename-btn:hover{background:rgba(255,255,255,.12)}.room-opts-rename-status{display:block;font-size:.75rem;margin-top:6px;min-height:16px;color:var(--text-muted,#888)}.room-opts-rename-status.saving{color:var(--text-muted,#888)}.room-opts-rename-status.error{color:#ff7878}.room-options-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:99999999;background:rgba(0,0,0,.55);animation:roomOptsFadeIn .18s ease}@keyframes roomOptsFadeIn{from{opacity:0}to{opacity:1}}.room-options-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:14px;width:min(440px,92vw);max-height:78vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,.65);animation:roomOptsSlideUp .22s cubic-bezier(.34,1.56,.64,1)}@keyframes roomOptsSlideUp{from{transform:translateY(14px) scale(.97);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.room-options-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0}.room-options-title{font-size:13px;font-weight:600;color:var(--text-primary,#e8e8f0);text-shadow:0 1px 2px rgba(0,0,0,.5)}.room-options-close{background:0 0;border:none;color:var(--text-muted,#888);font-size:18px;cursor:pointer;padding:0 2px;line-height:1;transition:color .15s}.room-options-close:hover{color:var(--text-primary,#e8e8f0)}.room-options-tabs{display:flex;gap:4px;padding:10px 14px 0;flex-shrink:0}.room-options-tab{background:0 0;border:1px solid transparent;border-radius:6px;color:var(--text-muted,#888);font-size:12px;padding:5px 12px;cursor:pointer;transition:background .13s,color .13s,border-color .13s}.room-options-tab:hover{background:rgba(255,255,255,.06);color:var(--text-secondary,#ccc)}.room-options-tab.active{background:rgba(var(--accent-rgb),.15);border-color:rgba(var(--accent-rgb),.3);color:var(--accent,#3d9e6e)}.room-options-panels{flex:1;overflow:hidden;display:flex;flex-direction:column}.room-options-panel{display:none;flex:1;overflow-y:auto;padding:10px 14px 14px}.room-options-panel.active{display:flex;flex-direction:column;gap:6px}.room-options-empty,.room-options-loading{color:var(--text-muted,#888);font-size:12px;text-align:center;padding:24px 0}.room-options-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:8px}.room-options-item-info{display:flex;flex-direction:column;gap:2px;min-width:0}.room-options-item-name{font-size:12.5px;font-weight:600;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-options-item-reason{font-size:11px;color:var(--text-muted,#888);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-options-item-date{font-size:10.5px;color:var(--text-muted,#666)}.room-options-action-btn{background:rgba(var(--accent-rgb),.12);border:1px solid rgba(var(--accent-rgb),.25);color:var(--accent,#3d9e6e);font-size:11px;padding:4px 10px;border-radius:5px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background .13s,border-color .13s}.room-options-action-btn:hover{background:rgba(var(--accent-rgb),.22);border-color:rgba(var(--accent-rgb),.45)}.room-options-reenable-btn{background:rgba(var(--accent-rgb),.1);border:1px solid rgba(var(--accent-rgb),.2);color:var(--accent,#3d9e6e)}.room-options-reenable-btn:hover{background:rgba(var(--accent-rgb),.2)}.room-setting-disabled,.room-setting-disabled:hover,button.room-setting-disabled,button.room-setting-disabled:hover{opacity:.32!important;cursor:not-allowed!important;pointer-events:none!important;filter:grayscale(.4)}.room-options-settings{display:flex;flex-direction:column;gap:0;padding:0}.room-opts-settings-header{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted,#888);padding:2px 0 6px}.room-opts-settings-desc{font-size:11.5px;color:var(--text-muted,#888);margin:0 0 10px;line-height:1.5}.room-opts-settings-list{display:flex;flex-direction:column;gap:6px}.room-opts-setting-row{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:8px;cursor:pointer;transition:background .13s;gap:10px;user-select:none}.room-opts-setting-row:hover{background:rgba(255,255,255,.06)}.room-opts-setting-info{display:flex;align-items:center;gap:10px;min-width:0}.room-opts-setting-icon{font-size:15px;flex-shrink:0;width:22px;text-align:center}.room-opts-setting-text{display:flex;flex-direction:column;gap:1px;min-width:0}.room-opts-setting-label{font-size:12.5px;font-weight:600;color:var(--text-primary,#e8e8f0)}.room-opts-setting-desc{font-size:10.5px;color:var(--text-muted,#888);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-opts-toggle-wrap{position:relative;display:flex;align-items:center;flex-shrink:0}.room-opts-toggle-input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.room-opts-toggle-slider{display:inline-block;width:36px;height:20px;background:rgba(255,255,255,.12);border-radius:20px;transition:background .2s;position:relative;flex-shrink:0}.room-opts-toggle-slider::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .2s,background .2s}.room-opts-toggle-input:checked+.room-opts-toggle-slider{background:var(--accent,#3d9e6e)}.room-opts-toggle-input:checked+.room-opts-toggle-slider::after{transform:translateX(16px)}.room-opts-settings-footer{display:flex;align-items:center;gap:10px;padding:14px 0 2px}.room-opts-save-btn{background:var(--accent,#3d9e6e);color:#fff;border:none;border-radius:7px;font-size:12px;font-weight:600;padding:7px 18px;cursor:pointer;transition:opacity .13s}.room-opts-save-btn:hover{opacity:.85}.room-opts-save-status{font-size:11.5px;color:var(--text-muted,#888)}.room-opts-save-status.saving{color:var(--accent,#3d9e6e)}.room-disabled-overlay{position:absolute;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;z-index:9999;border-radius:inherit;pointer-events:all}.room-disabled-overlay-inner{display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px 24px;text-align:center;max-width:280px}.room-disabled-overlay-icon{font-size:36px;line-height:1}.room-disabled-overlay-title{font-size:14px;font-weight:700;color:#f0f0f0;line-height:1.3}.room-disabled-overlay-desc{font-size:11.5px;color:rgba(255,255,255,.55);line-height:1.5}.user-context-menu>button.user-ctx-warn{color:var(--accent,#3d9e6e)}.user-context-menu>button.user-ctx-warn:hover{background:rgba(var(--accent-rgb),.1)}.room-disable-dialog-note{font-size:11.5px;color:var(--text-muted,#888);margin:4px 0 10px;line-height:1.5}.room-mod-confirm-disable{background:#e05c5c;color:#fff;border:none}.room-mod-confirm-disable:hover{background:#c94848}.add-currency-dialog-box{width:min(400px,94vw)}.add-currency-type-row{display:flex;gap:10px}.add-currency-type-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.1);border-radius:10px;cursor:pointer;transition:background .13s,border-color .13s;color:var(--text-secondary,#ccc)}.add-currency-type-btn:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}.add-currency-type-active{background:rgba(124,92,252,.15)!important;border-color:rgba(124,92,252,.55)!important;color:var(--accent,#7c5cfc)!important}.add-currency-type-icon{font-size:22px;line-height:1}.add-currency-type-label{font-size:13px;font-weight:700;color:var(--text-primary,#e8e8f0)}.add-currency-type-active .add-currency-type-label{color:var(--accent,#7c5cfc)}.add-currency-type-sub{font-size:10px;color:var(--text-muted,#888);text-transform:uppercase;letter-spacing:.05em}.add-currency-amount-row{display:flex;align-items:center;gap:8px;background:var(--bg-input,rgba(255,255,255,.06));border:1px solid var(--border,rgba(255,255,255,.12));border-radius:7px;padding:0 10px;transition:border-color .14s}.add-currency-amount-row:focus-within{border-color:var(--accent,#7c5cfc)}.add-currency-prefix{font-size:14px;font-weight:600;color:var(--text-muted,#888);user-select:none;white-space:nowrap}.add-currency-amount-input{background:0 0!important;border:none!important;padding:8px 0!important;flex:1;min-width:0}.add-currency-amount-input:focus{border-color:transparent!important;outline:0}.add-currency-confirm-btn{background:rgba(39,174,96,.15);border:1px solid rgba(39,174,96,.4);color:#2ecc71}.add-currency-confirm-btn:hover:not(:disabled){background:rgba(39,174,96,.28);border-color:rgba(39,174,96,.6)}.add-currency-confirm-btn:disabled{opacity:.55;cursor:not-allowed}.user-context-menu>button.user-ctx-wallet{color:#f0c040}.user-context-menu>button.user-ctx-wallet:hover{background:rgba(240,192,64,.12)}.user-context-menu>button.user-ctx-gift,.user-ctx-submenu-trigger.user-ctx-gift{color:#a78bfa}.user-context-menu>button.user-ctx-gift:hover,.user-ctx-submenu-trigger.user-ctx-gift:hover{background:rgba(167,139,250,.12)}.gift-window-overlay{position:fixed;inset:0;z-index:10200005;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(8,10,20,.55);animation:gift-window-fade .16s ease}@keyframes gift-window-fade{from{opacity:0}to{opacity:1}}@keyframes gift-window-pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}.gift-window{--gw-accent:var(--accent,#a78bfa);position:relative;display:flex;flex-direction:column;width:min(440px,100%);max-height:min(680px,92vh);background:var(--bg-secondary,#1a1d2e);border:1px solid var(--border-light,rgba(255,255,255,.1));border-radius:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 24px 70px -14px rgba(0,0,0,.62),0 0 0 1px color-mix(in srgb,var(--gw-accent) 16%,transparent);overflow:hidden;animation:gift-window-pop .18s cubic-bezier(.2,.9,.3,1)}.gift-window.gift-window-dragging{animation:none;box-shadow:0 34px 96px -12px rgba(0,0,0,.72),0 0 0 1px color-mix(in srgb,var(--gw-accent) 34%,transparent)}.gift-window-bar{display:flex;align-items:center;gap:11px;padding:12px 12px 12px 14px;cursor:grab;user-select:none;background:linear-gradient(180deg,color-mix(in srgb,var(--gw-accent) 13%,transparent),color-mix(in srgb,var(--gw-accent) 4%,transparent));border-bottom:1px solid var(--border,rgba(255,255,255,.07))}.gift-window-bar:active{cursor:grabbing}.gift-window-bar-icon{display:flex;align-items:center;justify-content:center;width:30px;height:30px;flex-shrink:0;font-size:16px;line-height:1;border-radius:9px;background:color-mix(in srgb,var(--gw-accent) 20%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gw-accent) 32%,transparent)}.gift-window-bar-titles{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.gift-window-bar-title{font-size:13.5px;font-weight:700;letter-spacing:.01em;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gift-window-bar-sub{font-size:11px;color:var(--text-muted,#8b8b9a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gift-window-bar-sub b{color:var(--text-secondary,#c7c7d1);font-weight:600}.gift-window-close{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:none;border-radius:7px;background:transparent;color:var(--text-muted,#8b8b9a);font-size:13px;line-height:1;cursor:pointer;transition:background .12s,color .12s}.gift-window-close:hover{background:rgba(255,255,255,.09);color:var(--text-primary,#fff)}.gift-window-body{flex:1;overflow-y:auto;padding:15px 16px 6px;display:flex;flex-direction:column;gap:16px}.gift-window-body::-webkit-scrollbar{width:9px}.gift-window-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.13);border-radius:5px;border:2px solid transparent;background-clip:content-box}.gift-window-meta{display:flex;flex-wrap:wrap;gap:5px 14px;font-size:11px;color:var(--text-muted,#8b8b9a)}.gift-window-meta b{color:var(--text-secondary,#c7c7d1);font-weight:700}.gift-chip{display:inline-block;padding:1px 8px;border-radius:999px;font-size:10.5px;font-weight:700;background:color-mix(in srgb,var(--chip-c,#888) 16%,transparent);color:var(--chip-c,#888);border:1px solid color-mix(in srgb,var(--chip-c,#888) 34%,transparent)}.gift-chip-none{font-style:italic;color:var(--text-muted,#8b8b9a);font-size:11.5px}.gift-window-group{display:flex;flex-direction:column;gap:9px}.gift-window-group-label{font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted,#8b8b9a)}.gift-window-tiers{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.gift-tier{position:relative;display:flex;align-items:center;gap:10px;padding:10px;text-align:left;background:rgba(255,255,255,.035);border:1.5px solid var(--border,rgba(255,255,255,.08));border-radius:11px;cursor:pointer;transition:border-color .13s,background .13s,transform .1s,box-shadow .13s}.gift-tier:hover:not(:disabled){border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.06);transform:translateY(-1px)}.gift-tier:disabled{opacity:.4;cursor:not-allowed}.gift-tier.is-selected{border-color:var(--gw-accent);background:color-mix(in srgb,var(--gw-accent) 13%,transparent);box-shadow:0 0 0 1px var(--gw-accent),0 8px 22px -8px color-mix(in srgb,var(--gw-accent) 55%,transparent)}.gift-tier-mark{display:flex;align-items:center;justify-content:center;width:26px;height:26px;flex-shrink:0}.gift-tier-swatch{width:22px;height:22px;border-radius:50%;box-shadow:0 2px 9px -1px color-mix(in srgb,var(--sw,#888) 60%,transparent),inset 0 0 0 1px rgba(255,255,255,.18)}.gift-tier-mark img{max-width:26px;max-height:26px;object-fit:contain}.gift-tier-emoji{font-size:20px;line-height:1}.gift-tier-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.gift-tier-name{font-size:12px;font-weight:700;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gift-tier-price{font-size:10.5px;font-weight:600;color:var(--text-muted,#8b8b9a);white-space:nowrap}.gift-tier-price b{color:var(--gw-accent);font-weight:800}.gift-tier-flag{position:absolute;top:-7px;right:8px;font-size:8px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:999px;background:var(--bg-secondary,#1a1d2e);border:1px solid var(--border-light,rgba(255,255,255,.16));color:var(--text-muted,#8b8b9a)}.gift-window-durs{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:7px}.gift-dur{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:44px;padding:7px 4px;background:rgba(255,255,255,.035);border:1.5px solid var(--border,rgba(255,255,255,.08));border-radius:10px;cursor:pointer;transition:border-color .13s,background .13s}.gift-dur:hover{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.06)}.gift-dur b{font-size:11.5px;font-weight:700;color:var(--text-primary,#e8e8f0);white-space:nowrap}.gift-dur small{font-size:9px;font-weight:600;color:var(--text-muted,#8b8b9a);white-space:nowrap}.gift-dur.is-active{border-color:var(--gw-accent);background:color-mix(in srgb,var(--gw-accent) 15%,transparent)}.gift-dur.is-active b{color:var(--gw-accent)}.gift-dur.is-active small{color:color-mix(in srgb,var(--gw-accent) 78%,var(--text-muted,#888))}.gift-window-foot{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--border,rgba(255,255,255,.07));background:rgba(0,0,0,.16)}.gift-window-total{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.gift-window-total-label{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted,#8b8b9a)}.gift-window-total-value{font-size:16px;font-weight:800;color:var(--text-primary,#e8e8f0);line-height:1.15}.gift-window-total-value.is-short{color:#f87171}.gift-window-total-hint{font-size:10px;color:var(--text-muted,#8b8b9a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gift-window-total-hint.is-short{color:#f87171}.gift-window-actions{display:flex;gap:8px;flex-shrink:0}.gift-window-btn{padding:9px 16px;border-radius:9px;font-size:12.5px;font-weight:700;cursor:pointer;border:1px solid transparent;transition:filter .12s,background .12s,opacity .12s}.gift-window-btn-ghost{background:transparent;border-color:var(--border-light,rgba(255,255,255,.14));color:var(--text-secondary,#c7c7d1)}.gift-window-btn-ghost:hover{background:rgba(255,255,255,.07)}.gift-window-btn-go{background:var(--gw-accent);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35);min-width:114px}.gift-window-btn-go:not(:disabled):hover{filter:brightness(1.09)}.gift-window-btn-go:disabled{opacity:.5;cursor:not-allowed;background:var(--text-muted,#666);color:rgba(255,255,255,.72);text-shadow:none}[data-theme=daylight] .gift-window-overlay{background:rgba(28,32,46,.34)}[data-theme=daylight] .gift-tier,[data-theme=daylight] .gift-dur{background:rgba(0,0,0,.035);border-color:rgba(0,0,0,.1)}[data-theme=daylight] .gift-tier:hover:not(:disabled),[data-theme=daylight] .gift-dur:hover{background:rgba(0,0,0,.06);border-color:rgba(0,0,0,.2)}[data-theme=daylight] .gift-window-foot{background:rgba(0,0,0,.04)}[data-theme=daylight] .gift-window-close:hover{background:rgba(0,0,0,.08);color:var(--text-primary)}@media (max-width:520px){.gift-window-overlay{padding:10px}.gift-window{width:100%;max-height:90vh}.gift-window-tiers{grid-template-columns:1fr}}.wallet-chip-tc-wrap{display:flex;align-items:center;gap:5px;margin-top:4px;padding:4px 10px;background:rgba(167,139,250,.1);border:1px solid rgba(167,139,250,.3);border-radius:20px;cursor:default;user-select:none}.wallet-chip-tc-icon{font-size:10px;font-weight:800;letter-spacing:.5px;color:#a78bfa;background:rgba(167,139,250,.2);padding:2px 5px;border-radius:4px}.wallet-chip-tc-balance{font-size:12px;font-weight:700;color:#c4b5fd}.room-float-body{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.room-float-typing{padding:2px 14px 2px;font-size:.72rem;color:var(--text-muted,#666);min-height:16px;flex-shrink:0;font-style:italic}.room-float-messages{flex:1;overflow-y:auto;overflow-x:hidden;padding:6px 8px 4px;display:flex;flex-direction:column;gap:1px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.06) transparent}.room-float-messages::-webkit-scrollbar{width:3px}.room-float-messages::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:3px}.room-float-messages:hover::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15)}.room-float-messages .message-avatar{width:28px;height:28px;font-size:11px;min-width:28px}.room-float-messages .message-content img,.room-float-messages .message-content video{max-width:100%;height:auto}.room-float-messages .msg-toolbar{display:none!important}.room-float-messages .message:hover .msg-toolbar,.room-float-messages .msg-selected .msg-toolbar{display:none!important}.room-float-messages .message:hover .message-time:not(.msg-ts-visible){display:none!important}.room-float-messages .msg-selected .msg-dots-btn{opacity:1}.room-float-messages .msg-toolbar button[data-action=archive],.room-float-messages .msg-toolbar button[data-action=pin],.room-float-messages .msg-toolbar button[data-action=unarchive],.room-float-messages .msg-toolbar button[data-action=unpin]{display:none!important}.room-float-messages .message,.room-float-messages .message-compact{position:relative}.room-float-messages .msg-toolbar{position:absolute;right:6px;top:50%;transform:translateY(-50%);margin-left:0;background:var(--bg-secondary,rgba(30,30,40,.85));border-radius:6px;padding:2px 3px;box-shadow:0 1px 4px rgba(0,0,0,.25)}.room-float-messages .message,.room-float-messages .message-compact{padding:3px 8px;margin-bottom:1px}.room-float-messages .message-content{font-size:12px}.room-float-messages .message-author{font-size:12px}.room-float-messages .message-compact .compact-time,.room-float-messages .message-time{font-size:10px}.room-float-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;margin:auto;padding:28px 16px;text-align:center}.room-float-empty-icon{font-size:2.2rem;font-weight:900;color:rgba(var(--accent-rgb),.5);line-height:1}.room-float-empty p{font-size:14px;font-weight:600;color:var(--text-primary,#e8e8f0);margin:0}.room-float-empty span{font-size:12px;color:var(--text-muted,#666)}.room-float-date-sep{text-align:center;font-size:11px;color:var(--text-muted,#666);padding:6px 0 4px;position:relative;opacity:.6}.room-float-reply-bar{display:flex;align-items:stretch;gap:10px;padding:7px 14px;background:rgba(var(--accent-rgb),.08);border-top:1px solid rgba(var(--accent-rgb),.15);font-size:12px;color:var(--text-muted,#888);flex-shrink:0}.room-float-reply-accent{width:3px;border-radius:2px;background:rgba(var(--accent-rgb),.65);flex-shrink:0}.room-float-reply-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;overflow:hidden}.room-float-reply-label{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--text-muted,#888);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-float-reply-label strong{color:var(--text-primary,#e6e6e6);font-weight:700}.room-float-reply-icon{font-size:11px;opacity:.75;flex-shrink:0;line-height:1}.room-float-reply-preview{font-size:12px;color:var(--text-secondary,#b5b5b5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:italic}.room-float-reply-cancel{background:0 0;border:none;color:var(--text-muted,#888);cursor:pointer;font-size:13px;padding:2px 4px;border-radius:4px;flex-shrink:0;line-height:1;align-self:center}.room-float-reply-cancel:hover{color:#f87171}.room-float-music-bar{display:flex;align-items:center;gap:8px;padding:5px 12px;background:rgba(var(--accent-rgb),.06);border-top:1px solid rgba(var(--accent-rgb),.18);flex-shrink:0;font-size:12px;transition:opacity .2s}.room-float-music-bar.mic-active{pointer-events:none;opacity:.4}.room-float-music-viz{display:flex;align-items:flex-end;gap:2px;height:16px;flex-shrink:0}.room-float-music-viz span{display:block;width:3px;border-radius:2px;background:var(--accent,#5865f2);animation:rfm-bar 1.2s ease-in-out infinite}.room-float-music-viz span:first-child{animation-delay:0s;animation-duration:1s}.room-float-music-viz span:nth-child(2){animation-delay:.2s;animation-duration:1.3s}.room-float-music-viz span:nth-child(3){animation-delay:.1s;animation-duration:.9s}.room-float-music-viz span:nth-child(4){animation-delay:.35s;animation-duration:1.1s}.room-float-music-viz span:nth-child(5){animation-delay:.15s;animation-duration:1.4s}@keyframes rfm-bar{0%,100%{height:3px;opacity:.5}50%{height:14px;opacity:1}}.room-float-music-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.room-float-music-title{color:var(--text-primary);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-float-music-upnext{color:var(--text-muted,#888);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-float-music-btns{display:flex;align-items:center;gap:4px;flex-shrink:0}.room-float-music-btn{background:rgba(255,255,255,.06);border:none;color:var(--text-muted,#888);cursor:pointer;font-size:13px;width:24px;height:24px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:background .15s,color .15s}.room-float-music-btn:hover{background:rgba(255,255,255,.12);color:var(--text-primary)}.room-float-music-mute-btn .rfm-vol-off{display:none}.room-float-music-mute-btn.muted .rfm-vol-on{display:none}.room-float-music-mute-btn.muted .rfm-vol-off{display:inline}.room-float-music-mute-btn.muted{color:var(--text-muted,#888);opacity:.55}.room-float-music-sharer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 12px;background:rgba(var(--accent-rgb),.07);border-top:1px solid rgba(var(--accent-rgb),.12);flex-shrink:0;font-size:11.5px}.room-float-music-sharer-label{flex:1;min-width:0;color:rgba(255,255,255,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-float-music-sharer-name{font-weight:700;color:rgba(255,255,255,.88)}.room-float-music-sharer-stop{background:rgba(231,76,60,.1);border:1px solid rgba(231,76,60,.28);color:#e74c3c;border-radius:4px;padding:2px 8px;font-size:10.5px;font-weight:600;cursor:pointer;flex-shrink:0;transition:background .12s,border-color .12s;white-space:nowrap}.room-float-music-sharer-stop:hover{background:rgba(231,76,60,.22);border-color:rgba(231,76,60,.5)}.rfm-player-panel{display:flex;flex-direction:column;background:#0d0e12;border:1px solid rgba(255,255,255,.06);border-radius:16px;box-shadow:0 32px 80px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.03);overflow:hidden}.rfm-player-panel.mic-active{opacity:.5}.rfm-player-panel.mic-active .rfm-panel-controls-row,.rfm-player-panel.mic-active .rfm-panel-queue-section,.rfm-player-panel.mic-active .rfm-panel-search-row,.rfm-player-panel.mic-active .rfm-panel-tabs{pointer-events:none}.rfm-panel-header{display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 14px;height:40px;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0;cursor:grab;user-select:none}.rfm-panel-header:active{cursor:grabbing}.rfm-panel-header-left{display:flex;align-items:center;gap:8px}.rfm-panel-header-icon{color:rgba(255,255,255,.18);flex-shrink:0}.rfm-panel-header-title{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.28)}.rfm-panel-close{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:0 0;border:none;color:rgba(255,255,255,.18);border-radius:6px;cursor:pointer;transition:background .12s,color .12s;flex-shrink:0}.rfm-panel-close:hover{background:rgba(255,255,255,.07);color:rgba(255,255,255,.7)}.rfm-panel-hero{display:flex;align-items:center;gap:14px;padding:14px 16px 14px;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0}.rfm-panel-artwork{position:relative;width:66px;height:66px;border-radius:10px;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center}.rfm-artwork-bg{position:absolute;inset:0;background:linear-gradient(140deg,rgba(var(--accent-rgb,88,101,242),.65) 0,rgba(var(--accent-rgb,88,101,242),.18) 100%);transition:background .35s}.rfm-artwork-bg--dj{background:linear-gradient(140deg,rgba(245,158,11,.65) 0,rgba(217,119,6,.22) 100%)}.rfm-artwork-icon{position:relative;z-index:1;color:rgba(255,255,255,.22)}.rfm-panel-viz{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);display:flex;align-items:flex-end;gap:2px;height:12px;z-index:2}.rfm-panel-viz span{display:block;width:3px;border-radius:2px;background:rgba(255,255,255,.65);animation:rfm-bar 1.2s ease-in-out infinite}.rfm-panel-viz span:first-child{animation-delay:0s;animation-duration:1s}.rfm-panel-viz span:nth-child(2){animation-delay:.2s;animation-duration:1.3s}.rfm-panel-viz span:nth-child(3){animation-delay:.1s;animation-duration:.9s}.rfm-panel-viz span:nth-child(4){animation-delay:.35s;animation-duration:1.1s}.rfm-panel-viz span:nth-child(5){animation-delay:.15s;animation-duration:1.4s}.rfm-panel-hero-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.rfm-panel-eyebrow{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent,#5865f2);opacity:.85}.rfm-panel-now-title{font-size:14px;font-weight:700;color:rgba(255,255,255,.92);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rfm-panel-now-by{font-size:11px;color:rgba(255,255,255,.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rfm-panel-tabs{display:flex;padding:8px 14px 4px;gap:4px;flex-shrink:0}.rfm-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;height:28px;font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-radius:7px;border:1px solid transparent;cursor:pointer;transition:background .14s,color .14s,border-color .14s;background:rgba(255,255,255,.04);color:rgba(255,255,255,.28)}.rfm-tab:hover{background:rgba(255,255,255,.07);color:rgba(255,255,255,.55)}.rfm-tab--room.rfm-tab--active{background:rgba(var(--accent-rgb,88,101,242),.11);border-color:rgba(var(--accent-rgb,88,101,242),.22);color:var(--accent,#5865f2)}.rfm-tab--dj.rfm-tab--active{background:rgba(245,158,11,.11);border-color:rgba(245,158,11,.22);color:#f59e0b}.rfm-panel-controls-row{padding:10px 16px 10px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.05)}.rfm-ctrl-set{display:flex;align-items:center;justify-content:center;gap:8px}.rfm-ctrl{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:9px;color:rgba(255,255,255,.5);cursor:pointer;transition:background .13s,color .13s,border-color .13s;flex-shrink:0}.rfm-ctrl:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.13);color:rgba(255,255,255,.88)}.rfm-ctrl:disabled{opacity:.2;cursor:default;pointer-events:none}.rfm-ctrl-mute .rfm-vol-off{display:none}.rfm-ctrl-mute.muted .rfm-vol-on{display:none}.rfm-ctrl-mute.muted .rfm-vol-off{display:block}.rfm-ctrl-mute.muted{color:rgba(255,255,255,.2)}.rfm-ctrl-stop{color:rgba(231,76,60,.6);border-color:rgba(231,76,60,.12)}.rfm-ctrl-stop:hover{background:rgba(231,76,60,.1);border-color:rgba(231,76,60,.25);color:#e74c3c}.rfm-ctrl-stop-push{margin-left:auto}.rfm-ctrl-playpause{width:46px;height:46px;background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.25);color:#f59e0b;border-radius:50%}.rfm-ctrl-playpause:hover{background:rgba(245,158,11,.22);border-color:rgba(245,158,11,.5);color:#f59e0b}.rfm-ctrl-dj-stop{color:rgba(231,76,60,.6);border-color:rgba(231,76,60,.12)}.rfm-ctrl-dj-stop:hover{background:rgba(231,76,60,.1);border-color:rgba(231,76,60,.25);color:#e74c3c}.rfm-player-panel--dj .rfm-panel-eyebrow{color:#f59e0b}.rfm-panel-queue-section{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.rfm-panel-queue-header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px 6px;flex-shrink:0}.rfm-panel-queue-label{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.18)}.rfm-panel-queue-count{font-size:10px;color:rgba(255,255,255,.16);font-weight:500}.rfm-panel-queue-body{flex:1;overflow-y:auto;padding:2px 0 8px}.rfm-panel-queue-body::-webkit-scrollbar{width:3px}.rfm-panel-queue-body::-webkit-scrollbar-track{background:0 0}.rfm-panel-queue-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.rfm-panel-queue-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:100%;min-height:80px;color:rgba(255,255,255,.14);font-size:12px}.rfm-panel-queue-item{display:flex;align-items:center;gap:10px;padding:7px 16px;transition:background .1s}.rfm-panel-queue-item:hover{background:rgba(255,255,255,.03)}.rfm-panel-queue-pos{font-size:11px;font-weight:600;color:rgba(255,255,255,.14);min-width:16px;text-align:center;flex-shrink:0;font-variant-numeric:tabular-nums}.rfm-panel-queue-info{display:flex;flex-direction:column;min-width:0;gap:2px}.rfm-panel-queue-title{font-size:12.5px;font-weight:500;color:rgba(255,255,255,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rfm-panel-queue-by{font-size:10.5px;color:rgba(255,255,255,.25);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-float-music-queue-btn.active{color:var(--accent,#5865f2);background:rgba(var(--accent-rgb,88 101 242),.15)}[data-theme=daylight] .rfm-player-panel{background:var(--bg-card);border-color:rgba(var(--overlay-ink-rgb),.09);box-shadow:0 20px 56px rgba(var(--overlay-ink-rgb),.14),0 0 0 1px rgba(var(--overlay-ink-rgb),.04)}[data-theme=daylight] .rfm-panel-header{border-bottom-color:rgba(0,0,0,.07)}[data-theme=daylight] .rfm-panel-header-title{color:rgba(0,0,0,.3)}[data-theme=daylight] .rfm-panel-header-icon{color:rgba(0,0,0,.18)}[data-theme=daylight] .rfm-panel-close{color:rgba(0,0,0,.2)}[data-theme=daylight] .rfm-panel-close:hover{background:rgba(0,0,0,.06);color:rgba(0,0,0,.65)}[data-theme=daylight] .rfm-panel-hero{border-bottom-color:rgba(0,0,0,.07)}[data-theme=daylight] .rfm-panel-now-title{color:rgba(0,0,0,.87)}[data-theme=daylight] .rfm-panel-now-by{color:rgba(0,0,0,.38)}[data-theme=daylight] .rfm-tab{background:rgba(0,0,0,.04);color:rgba(0,0,0,.28)}[data-theme=daylight] .rfm-tab:hover{background:rgba(0,0,0,.07);color:rgba(0,0,0,.55)}[data-theme=daylight] .rfm-panel-controls-row{border-bottom-color:rgba(0,0,0,.07)}[data-theme=daylight] .rfm-ctrl{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.07);color:rgba(0,0,0,.45)}[data-theme=daylight] .rfm-ctrl:hover{background:rgba(0,0,0,.08);color:rgba(0,0,0,.8)}[data-theme=daylight] .rfm-ctrl-playpause{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.28);color:#b45309}[data-theme=daylight] .rfm-ctrl-playpause:hover{background:rgba(245,158,11,.18);color:#b45309}[data-theme=daylight] .rfm-panel-queue-label{color:rgba(0,0,0,.2)}[data-theme=daylight] .rfm-panel-queue-count{color:rgba(0,0,0,.2)}[data-theme=daylight] .rfm-panel-queue-title{color:rgba(0,0,0,.7)}[data-theme=daylight] .rfm-panel-queue-by{color:rgba(0,0,0,.32)}[data-theme=daylight] .rfm-panel-queue-pos{color:rgba(0,0,0,.18)}[data-theme=daylight] .rfm-panel-queue-item:hover{background:rgba(0,0,0,.025)}[data-theme=daylight] .rfm-panel-queue-empty{color:rgba(0,0,0,.18)}.rfm-panel-search-row{display:flex;align-items:center;gap:6px;padding:7px 12px 7px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.05)}.rfm-panel-search-input-wrap{flex:1;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:0 8px;height:30px;transition:border-color .12s,background .12s}.rfm-panel-search-input-wrap:focus-within{border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.07)}.rfm-search-icon{color:rgba(255,255,255,.2);flex-shrink:0}.rfm-panel-search-input{flex:1;background:0 0;border:none;outline:0;color:rgba(255,255,255,.82);font-size:12px;min-width:0}.rfm-panel-search-input::placeholder{color:rgba(255,255,255,.22)}.rfm-panel-search-clear{display:flex;align-items:center;justify-content:center;width:16px;height:16px;background:rgba(255,255,255,.1);border:none;border-radius:50%;color:rgba(255,255,255,.4);cursor:pointer;flex-shrink:0;padding:0;transition:background .12s,color .12s}.rfm-panel-search-clear:hover{background:rgba(255,255,255,.18);color:rgba(255,255,255,.75)}.rfm-panel-search-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);border-radius:8px;color:rgba(255,255,255,.45);cursor:pointer;flex-shrink:0;transition:background .12s,color .12s}.rfm-panel-search-btn:hover{background:rgba(255,255,255,.11);color:rgba(255,255,255,.82)}.rfm-player-panel--dj .rfm-panel-search-btn:hover{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.2);color:#f59e0b}.rfm-panel-result-item{display:flex;align-items:center;gap:10px;padding:6px 12px;transition:background .1s}.rfm-panel-result-item:hover{background:rgba(255,255,255,.04)}.rfm-result-thumb{width:38px;height:38px;border-radius:6px;overflow:hidden;flex-shrink:0;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center}.rfm-result-thumb img{width:100%;height:100%;object-fit:cover}.rfm-result-thumb-placeholder{color:rgba(255,255,255,.2)}.rfm-result-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.rfm-result-title{font-size:12px;font-weight:500;color:rgba(255,255,255,.78);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}.rfm-result-channel{font-size:10.5px;color:rgba(255,255,255,.28);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rfm-result-add{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:7px;color:rgba(255,255,255,.35);cursor:pointer;flex-shrink:0;transition:background .12s,color .12s,border-color .12s}.rfm-result-add:hover{background:rgba(var(--accent-rgb,88,101,242),.14);border-color:rgba(var(--accent-rgb,88,101,242),.28);color:var(--accent,#5865f2)}.rfm-result-add--added{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.25);color:#22c55e}.rfm-player-panel--dj .rfm-result-add:hover{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.25);color:#f59e0b}.rfm-result-more{display:block;width:calc(100% - 24px);margin:6px 12px;padding:7px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:7px;color:rgba(255,255,255,.3);font-size:11px;cursor:pointer;transition:background .12s,color .12s;text-align:center}.rfm-result-more:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.65)}.rfm-result-more:disabled{opacity:.35;cursor:default;pointer-events:none}.rfm-panel-search-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px 16px;color:rgba(255,255,255,.2);font-size:12px;text-align:center}[data-theme=daylight] .rfm-panel-search-row{border-bottom-color:rgba(0,0,0,.07)}[data-theme=daylight] .rfm-panel-search-input-wrap{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.08)}[data-theme=daylight] .rfm-panel-search-input-wrap:focus-within{background:rgba(0,0,0,.08);border-color:rgba(0,0,0,.15)}[data-theme=daylight] .rfm-panel-search-input{color:rgba(0,0,0,.82)}[data-theme=daylight] .rfm-panel-search-input::placeholder{color:rgba(0,0,0,.28)}[data-theme=daylight] .rfm-search-icon{color:rgba(0,0,0,.22)}[data-theme=daylight] .rfm-panel-search-btn{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.08);color:rgba(0,0,0,.4)}[data-theme=daylight] .rfm-panel-search-btn:hover{background:rgba(0,0,0,.09);color:rgba(0,0,0,.75)}[data-theme=daylight] .rfm-panel-result-item:hover{background:rgba(0,0,0,.03)}[data-theme=daylight] .rfm-result-title{color:rgba(0,0,0,.75)}[data-theme=daylight] .rfm-result-channel{color:rgba(0,0,0,.35)}[data-theme=daylight] .rfm-result-add{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.08);color:rgba(0,0,0,.35)}[data-theme=daylight] .rfm-result-more{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.08);color:rgba(0,0,0,.35)}[data-theme=daylight] .rfm-result-more:hover{background:rgba(0,0,0,.07);color:rgba(0,0,0,.65)}[data-theme=daylight] .rfm-panel-search-empty{color:rgba(0,0,0,.2)}.room-float-input-area{position:relative;display:flex;flex-direction:column;gap:5px;padding:6px 12px 14px;background:linear-gradient(0deg,rgba(var(--accent-rgb),.06) 0,transparent 100%);border-top:1px solid rgba(var(--accent-rgb),.08);flex-shrink:0}.room-float-sender-row{display:flex;align-items:center;gap:5px;padding:0 4px;user-select:none;pointer-events:none}.room-float-sender-name{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--text-muted,#888);line-height:1;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.room-float-input-row{display:flex;align-items:flex-end;gap:8px}.room-float-input-pill{flex:1;display:flex;align-items:flex-end;background:var(--bg-secondary,#16172a);border:1.5px solid rgba(var(--accent-rgb),.15);border-radius:16px;transition:border-color .15s,box-shadow .15s;overflow:hidden;min-height:42px;padding:0 4px 0 2px;gap:0}.room-float-input-pill:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow,rgba(var(--accent-rgb),.12))}.room-float-pill-btn{background:0 0;border:none;color:var(--text-muted,#888);width:34px;height:34px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .12s,background .12s;flex-shrink:0;padding:0;align-self:flex-end;margin-bottom:4px}.room-float-pill-btn:hover{color:var(--accent);background:rgba(var(--accent-rgb),.1)}.room-float-textarea{flex:1;background:0 0;border:none;outline:0;color:var(--text-primary,#e8e8f0);font-family:inherit;font-size:13.5px;line-height:1.45;padding:11px 4px;resize:none;min-height:42px;max-height:110px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.08) transparent;white-space:pre-wrap;word-break:break-word}.rt-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:4px 2px}.rt-fmt-group{display:flex;align-items:center;gap:4px}.rt-fmt-btn{width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:12px;border-radius:6px;cursor:pointer;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--text-primary,#e8e8f0);transition:background .13s,border-color .13s}.rt-fmt-btn.active{background:rgba(var(--accent-rgb),.22);border-color:rgba(var(--accent-rgb),.5);color:var(--accent,#3d9e6e)}.rt-toolbar{overflow:visible}.rt-dropdown{position:relative}.rt-dropdown-trigger{display:flex;align-items:center;gap:5px;height:26px;padding:0 8px;border-radius:7px;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);color:var(--text-primary,#e8e8f0);font-size:11.5px;font-weight:600;transition:background .15s ease,border-color .15s ease,color .15s ease}.rt-dropdown-trigger:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2)}.rt-dropdown.open .rt-dropdown-trigger{background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.55);color:var(--accent,#3d9e6e)}.rt-caret{opacity:.55;flex-shrink:0;transition:transform .18s ease,opacity .15s ease}.rt-dropdown.open .rt-caret{opacity:.9;transform:rotate(180deg)}.rt-size-trigger-label{min-width:8px;text-align:center;font-weight:700}.rt-color-trigger-dot{width:13px;height:13px;border-radius:50%;background:var(--text-primary,#e8e8f0);border:1.5px solid rgba(255,255,255,.4);box-shadow:0 0 0 1px rgba(0,0,0,.15) inset;flex-shrink:0}.rt-dropdown-menu{position:absolute;bottom:calc(100% + 8px);left:0;z-index:30;background:var(--bg-card,#232438);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 10px 32px rgba(0,0,0,.35),0 2px 8px rgba(0,0,0,.25);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px) scale(.97);transform-origin:bottom left;pointer-events:none;transition:opacity .15s ease,transform .15s ease,visibility .15s;max-height:min(320px,70vh);overflow-y:auto}.rt-dropdown.open .rt-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1);pointer-events:auto}.rt-dropdown-menu-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted,#8a8dab);padding:3px 8px 7px}.rt-size-menu{min-width:154px}.rt-dropdown-item{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:7px 8px;border-radius:8px;border:none;background:0 0;color:var(--text-primary,#e8e8f0);font-size:12.5px;cursor:pointer;transition:background .12s ease}.rt-dropdown-item:hover{background:rgba(255,255,255,.07)}.rt-dropdown-item.active{background:rgba(var(--accent-rgb),.14);color:var(--accent,#3d9e6e)}.rt-size-item-preview{width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:rgba(255,255,255,.06);font-weight:700;flex-shrink:0;line-height:1}.rt-dropdown-item.active .rt-size-item-preview{background:rgba(var(--accent-rgb),.22)}.rt-size-item-text{flex:1}.rt-check{opacity:0;flex-shrink:0;color:var(--accent,#3d9e6e)}.rt-dropdown-item.active .rt-check{opacity:1}.rt-color-menu{min-width:182px}.rt-color-swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:10px}.rt-swatch{position:relative;width:23px;height:23px;border-radius:50%;border:none;cursor:pointer;padding:0;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .13s ease,box-shadow .13s ease}.rt-swatch:hover{transform:scale(1.15)}.rt-swatch.active::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--accent,#3d9e6e)}.rt-swatch-none{background:repeating-linear-gradient(45deg,rgba(255,255,255,.16),rgba(255,255,255,.16) 3px,transparent 3px,transparent 6px);border:1.5px solid rgba(255,255,255,.3)}.rt-custom-color-row{display:flex;align-items:center;gap:9px;padding:7px 4px 3px;margin-top:2px;border-top:1px solid rgba(255,255,255,.08);cursor:pointer}.rt-custom-color-swatch-wrap{width:23px;height:23px;border-radius:50%;overflow:hidden;border:1.5px solid rgba(255,255,255,.3);box-shadow:0 1px 3px rgba(0,0,0,.3);flex-shrink:0}.rt-custom-color{width:200%;height:200%;margin:-50%;padding:0;border:none;cursor:pointer;background:0 0}.rt-custom-color-label{font-size:12px;color:var(--text-primary,#e8e8f0);font-weight:500}.rt-editor{white-space:pre-wrap;word-break:break-word}.rt-editor.is-empty:before{content:attr(data-placeholder);color:var(--text-muted,#888);pointer-events:none}.rt-editor.is-empty[data-pf='vibes']:before{font-family:'Great Vibes',cursive}.rt-editor.is-empty[data-pf='priestacy']:before{font-family:'Priestacy',cursive}.rt-editor.is-empty[data-pf='rustic']:before{font-family:'Rustic Roadway',cursive}.rt-editor-disabled{opacity:.55;pointer-events:none}.room-float-textarea::placeholder{color:var(--text-muted,#666);opacity:.55}.room-float-send-btn{width:40px;height:40px;min-width:40px;background:var(--accent);border:none;border-radius:13px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .12s,box-shadow .15s;flex-shrink:0;box-shadow:0 3px 12px var(--accent-glow,rgba(var(--accent-rgb),.45));padding:0;align-self:flex-end}.room-float-send-btn:hover{background:var(--accent-hover,var(--accent));transform:scale(1.06);box-shadow:0 5px 16px var(--accent-glow,rgba(var(--accent-rgb),.6))}.room-float-send-btn:active{transform:scale(.94);box-shadow:0 2px 8px rgba(var(--accent-rgb),.35)}.room-float-freeze-btn{margin-left:auto;color:var(--text-muted,#888);transition:color .15s,background .15s,box-shadow .15s}.room-float-freeze-btn:hover{color:#7dd3f8;background:rgba(125,211,248,.1)}.room-float-freeze-btn.frozen{color:#7dd3f8;background:rgba(125,211,248,.12);box-shadow:inset 0 0 0 1px rgba(125,211,248,.35)}.room-float-freeze-btn.frozen svg{filter:drop-shadow(0 0 4px rgba(125, 211, 248, .6))}.room-float-content{display:flex;flex-direction:row;flex:1;min-height:0;overflow:hidden}.room-float-main{display:flex;flex-direction:column;flex:1;min-width:400px;overflow:hidden}.room-float-sidebar-resize-handle{position:absolute;left:0;top:0;bottom:0;width:6px;cursor:ew-resize;z-index:10;border-radius:20px;transition:background .15s ease}.room-float-sidebar-resize-handle:active,.room-float-sidebar-resize-handle:hover{background:rgba(255,255,255,.07)}.room-float-modal.room-float-minimized .room-float-sidebar-resize-handle{display:none}.room-float-sidebar{position:relative;width:240px;min-width:336px;display:flex;flex-direction:column;border-left:1px solid rgba(255,255,255,.07);overflow:hidden;flex-shrink:0;background:var(--bg-card)}.room-float-modal.room-float-minimized .room-float-sidebar{display:none}.room-float-sidebar-voice{flex-shrink:1;overflow-y:auto;min-height:0;max-height:40%;border-bottom:1px solid rgba(255,255,255,.055)}.room-float-sidebar-voice .panel{padding:8px 10px}.room-float-sidebar-voice .user-list{max-height:100px;overflow-y:auto}#room-float-sb-members .panel,.room-float-sb-members .panel{padding:2px 0;margin:0;background:0 0;border:none;border-radius:0}.room-float-sidebar-cnt{background:rgba(255,255,255,.1);color:var(--text-muted);-webkit-text-fill-color:var(--text-muted);font-size:10px;font-weight:700;padding:1px 5px;border-radius:8px}.room-float-sidebar-cnt:empty{display:none}.room-float-sidebar-users{flex:1;overflow-y:auto;overflow-x:hidden;padding:0;display:flex;flex-direction:column;gap:4px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.06) transparent}.room-float-sidebar-users::-webkit-scrollbar{width:3px}.room-float-sidebar-users::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:3px}.room-float-sidebar .user-item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.room-float-sidebar .user-item-tooltip{display:none!important}.room-float-sidebar .voice-badge.hand-raised{display:none!important}.room-float-sidebar .user-item{gap:5px;padding:0;border-radius:6px;margin:0;transition:background-color .16s ease,box-shadow .16s ease}.room-float-sidebar .user-item:hover{transform:none;background:rgba(255,255,255,.06);box-shadow:none}.room-float-sidebar .user-item.kbd-nav-selected,.room-float-sidebar .user-item.kbd-nav-selected:hover{background:rgba(var(--accent-rgb,108,92,231),.24);box-shadow:inset 3px 0 0 var(--accent,#6c5ce7)}.room-float-sidebar .user-item.has-raised-hand{background:rgba(184,134,11,.16);box-shadow:inset 2px 0 0 rgba(184,134,11,.75)}.room-float-sidebar .user-item.has-raised-hand:hover{background:rgba(184,134,11,.24)}.room-float-sidebar .user-item.kbd-nav-selected.has-raised-hand,.room-float-sidebar .user-item.kbd-nav-selected.has-raised-hand:hover{background:linear-gradient(90deg,rgba(184,134,11,.34),rgba(var(--accent-rgb,108,92,231),.22) 66%);box-shadow:inset 3px 0 0 #b8860b}.room-float-sidebar .user-avatar-wrapper{display:flex;align-items:center;justify-content:center;width:16px;min-width:16px;height:16px;overflow:visible}.room-float-sidebar .user-avatar-wrapper:has(.role-pin-badge){display:flex;width:16px;height:16px;min-width:16px;overflow:visible}.room-float-sidebar .role-pin-badge svg{width:auto;height:14px}.room-float-sidebar .user-avatar-wrapper>.user-item-avatar,.room-float-sidebar .user-avatar-wrapper>.user-item-avatar-img,.room-float-sidebar .user-avatar-wrapper>.user-status-dot{display:none!important}.room-float-sidebar .role-pin-badge{position:relative;top:0;left:0}.room-float-sidebar .user-item.offline{opacity:.45}.room-float-sidebar .user-indicators{gap:1px;width:18px;min-width:18px;justify-content:center;margin-right:-2px}.room-float-sidebar .user-item .voice-badge.cam-active{width:18px;height:18px;font-size:12px}.room-float-sidebar .raise-hand-indicator{width:22px;height:20px;margin-right:-3px;font-size:18px;line-height:1}.room-float-sidebar .raise-hand-indicator-img{width:12px;height:12px}.room-float-sidebar .user-admin-actions{gap:2px}.room-float-sidebar .user-action-btn{width:20px;height:20px;font-size:11px;padding:0}.room-float-sidebar .user-score-badge{font-size:10px;padding:0 3px}.room-float-sidebar .user-device-badge{display:none}.room-float-sidebar .aml-admin-badge,.room-float-sidebar .aml-enforcer-badge,.room-float-sidebar .aml-owner-badge{vertical-align:middle}.room-float-sidebar .sub-tier-badge--list{font-size:17px}.room-float-sidebar .sub-tier-badge{filter:none}.room-float-sidebar .crown-badge-img{width:24px;height:18.7px;filter:brightness(1.08)}.room-float-sidebar .aml-admin-badge svg,.room-float-sidebar .aml-admin-badge:hover svg,.room-float-sidebar .aml-dev-badge svg,.room-float-sidebar .aml-dev-badge:hover svg,.room-float-sidebar .aml-enforcer-badge svg,.room-float-sidebar .aml-enforcer-badge:hover svg,.room-float-sidebar .aml-mod-badge svg,.room-float-sidebar .aml-mod-badge:hover svg,.room-float-sidebar .aml-owner-badge svg,.room-float-sidebar .aml-owner-badge:hover svg,.room-float-sidebar .aml-senior-enforcer-badge svg,.room-float-sidebar .aml-senior-enforcer-badge:hover svg,.room-float-sidebar .role-pin-badge,.room-float-sidebar .role-pin-badge:hover{filter:none}.room-float-sidebar .aml-enforcer-badge svg,.room-float-sidebar .aml-owner-badge svg,.room-float-sidebar .aml-senior-enforcer-badge svg{width:11px;height:12px}.room-float-sidebar .aml-admin-badge{font-size:17px}.raise-hand-indicator{flex-shrink:0;width:22px;height:22px;margin-right:3px;display:inline-flex;align-items:center;justify-content:center}.raise-hand-indicator-img{width:16px;height:16px;object-fit:contain;display:block}.raise-hand-indicator--empty{visibility:hidden}.room-queue-divider{flex:0 0 auto;height:0;margin:2px 8px;border-top:1px solid var(--border-light,rgba(255,255,255,.14))}.user-item .voice-badge svg{width:17px;height:17px}.room-float-sidebar .mic-level-section{flex-shrink:0}.room-float-modal .voice-badge.mic-owner{border:none;background:0 0;color:inherit;animation:none;box-shadow:none;padding:0}.room-float-modal .mic-level-section{gap:6px}.room-float-modal .mic-level-section .voice-panel-btn{width:20px;height:20px;font-size:9px;border-radius:8px}.room-float-modal .mic-level-section .audio-visualizer{height:20px!important}.room-float-modal .mic-level-section .room-volume-label{font-size:8px}.room-float-modal .mic-level-section .listener-volume-slider{width:56px}.room-float-sidebar .mic-and-queue{flex-shrink:0}.mic-and-queue .voice-header-btn.lock-ready{background:linear-gradient(145deg,var(--accent),var(--accent-dim));border-color:var(--accent);color:#fff;animation:jump-activation-glow 2s ease-in-out infinite}.mic-and-queue .voice-header-btn.lock-ready:hover{background:linear-gradient(145deg,var(--accent-hover),var(--accent));box-shadow:0 0 12px rgba(var(--accent-rgb),.6)}.mic-and-queue .voice-header-btn.lock-owner{background:linear-gradient(145deg,var(--success),var(--success-dim,var(--success)));border-color:var(--success);color:#fff;opacity:1;animation:jump-activated-pulse 1.5s ease-in-out infinite}.mic-and-queue .voice-header-btn.lock-owner:hover{background:linear-gradient(145deg,var(--success-hover,var(--success)),var(--success));box-shadow:0 0 12px rgba(var(--success-rgb,67,181,129),.6)}.room-float-voice-section{border-bottom:1px solid rgba(255,255,255,.055);flex-shrink:0}.room-float-voice-hdr{display:flex;align-items:center;gap:6px;width:100%;padding:6px 14px;background:0 0;border:none;color:var(--text-muted);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;text-align:left;transition:color .15s}.room-float-voice-hdr:hover{color:var(--text-primary)}.room-float-voice-hdr-icon{font-size:13px}.room-float-voice-hdr-label{flex:1}.room-float-voice-cnt{background:var(--accent,#3d9e6e);color:#fff;font-size:10px;font-weight:700;padding:1px 5px;border-radius:8px;min-width:16px;text-align:center;display:none}.room-float-voice-cnt:not(:empty){display:inline-block}.room-float-voice-hdr-chev{font-size:11px;transition:transform .15s}.room-float-voice-expanded{padding:4px 12px 8px;display:flex;flex-direction:column;gap:6px}.room-float-voice-users{display:flex;flex-wrap:wrap;gap:4px;min-height:20px}.room-float-vuser{font-size:12px;color:var(--text-secondary);background:rgba(255,255,255,.05);border-radius:4px;padding:2px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px;transition:color .15s,background .15s}.room-float-vuser.talking{color:var(--accent);background:rgba(var(--accent-rgb),.12)}.room-float-voice-empty{font-size:11px;color:var(--text-muted);font-style:italic}.room-float-voice-queue{display:flex;align-items:center;gap:5px;font-size:11px}.room-float-queue-lbl{color:var(--text-muted);font-weight:600;text-transform:uppercase;font-size:10px;letter-spacing:.04em}.room-float-queue-names{color:var(--text-secondary);font-size:11px}.room-float-voice-ctrls{display:flex;flex-wrap:wrap;gap:4px}.room-float-voice-join-btn{padding:4px 12px;background:var(--accent,#3d9e6e);color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s}.room-float-voice-join-btn:hover{opacity:.85}.room-float-voice-join-btn:active{transform:scale(.96)}.room-float-vctrl-btn{padding:4px 8px;background:rgba(255,255,255,.06);color:var(--text-muted);border:1px solid rgba(255,255,255,.08);border-radius:6px;font-size:11px;cursor:pointer;transition:background .15s,color .15s;white-space:nowrap}.room-float-vctrl-btn:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.room-float-vctrl-btn.active{background:rgba(var(--accent-rgb),.18);color:var(--accent);border-color:rgba(var(--accent-rgb),.3)}.room-float-vleave-btn{padding:4px 10px;background:rgba(231,76,60,.12);color:#e74c3c;border:1px solid rgba(231,76,60,.2);border-radius:6px;font-size:11px;cursor:pointer;margin-left:auto;transition:background .15s}.room-float-vleave-btn:hover{background:rgba(231,76,60,.22)}.room-float-modal[data-room-sub]{border-color:rgba(var(--room-accent-rgb),.22)}.room-float-modal[data-room-sub]:focus-within{box-shadow:0 32px 80px rgba(0,0,0,.7),0 12px 32px rgba(0,0,0,.5),0 0 0 2px rgba(var(--room-accent-rgb),.52),0 0 0 1px rgba(255,255,255,.03) inset,0 0 48px rgba(var(--room-accent-rgb),.07)}.room-float-modal[data-room-sub].room-float-minimized:hover{box-shadow:0 -4px 20px rgba(0,0,0,.4),0 0 0 1px var(--room-accent)}.room-float-modal[data-room-sub] .room-menubar{background:rgba(var(--room-accent-rgb),.05)}.room-float-modal[data-room-sub] .room-menu-action:hover{background:rgba(var(--room-accent-rgb),.14)}.room-float-modal[data-room-sub] .room-menu-kape-btn{background-color:rgba(var(--room-accent-rgb),.12);border-color:rgba(var(--room-accent-rgb),.38);color:var(--room-accent)}.room-float-modal[data-room-sub] .room-menu-kape-btn::before{box-shadow:0 0 10px rgba(var(--room-accent-rgb),.45),0 0 3px rgba(var(--room-accent-rgb),.22)}.room-float-modal[data-room-sub] .room-menu-kape-btn:hover{background-color:rgba(var(--room-accent-rgb),.22);border-color:rgba(var(--room-accent-rgb),.65);color:var(--room-accent)}.room-float-modal[data-room-sub] .room-toolbar{background:rgba(var(--room-accent-rgb),.04)}.room-float-modal[data-room-sub] .room-toolbar-btn.active{background:rgba(var(--room-accent-rgb),.18);color:var(--room-accent);border-color:rgba(var(--room-accent-rgb),.36)}.room-float-modal[data-room-sub] .room-toolbar-btn-owner{background:rgba(var(--room-accent-rgb),.08);border-color:rgba(var(--room-accent-rgb),.2);color:var(--room-accent)}.room-float-modal[data-room-sub] .room-toolbar-btn-owner:hover{background:rgba(var(--room-accent-rgb),.16);border-color:rgba(var(--room-accent-rgb),.38);color:var(--room-accent)}.room-float-modal[data-room-sub] .room-toolbar-btn-cam.sharing,.room-float-modal[data-room-sub] .room-toolbar-btn-screen.sharing{background:rgba(var(--room-accent-rgb),.12);color:var(--room-accent);border-color:rgba(var(--room-accent-rgb),.3)}.room-float-modal[data-room-sub] .room-toolbar-separator{background:rgba(var(--room-accent-rgb),.14)}.room-float-modal[data-room-sub] .room-float-topic-bar{background:rgba(var(--room-accent-rgb),.06);border-bottom-color:rgba(var(--room-accent-rgb),.12)}.room-float-modal[data-room-sub] .room-float-topic-icon{color:var(--room-accent);opacity:.85}.room-float-modal[data-room-sub] .room-float-input-area{background:linear-gradient(0deg,rgba(var(--room-accent-rgb),.07) 0,transparent 100%);border-top-color:rgba(var(--room-accent-rgb),.12)}.room-float-modal[data-room-sub] .room-float-input-pill{border-color:rgba(var(--room-accent-rgb),.22)}.room-float-modal[data-room-sub] .room-float-input-pill:focus-within{border-color:var(--room-accent);box-shadow:0 0 0 3px rgba(var(--room-accent-rgb),.15)}.room-float-modal[data-room-sub] .room-float-pill-btn:hover{color:var(--room-accent);background:rgba(var(--room-accent-rgb),.1)}.room-float-modal[data-room-sub] .room-float-send-btn{background:var(--room-accent);box-shadow:0 3px 12px rgba(var(--room-accent-rgb),.45)}.room-float-modal[data-room-sub] .room-float-send-btn:hover{background:var(--room-accent);box-shadow:0 5px 18px rgba(var(--room-accent-rgb),.62)}.room-float-modal[data-room-sub] .room-float-send-btn:active{box-shadow:0 2px 8px rgba(var(--room-accent-rgb),.35)}.room-float-modal[data-room-sub] .room-float-reply-bar{background:rgba(var(--room-accent-rgb),.08);border-top-color:rgba(var(--room-accent-rgb),.18)}.room-float-modal[data-room-sub] .room-float-reply-accent{background:rgba(var(--room-accent-rgb),.65)}.room-float-modal[data-room-sub] .room-float-music-bar{background:rgba(var(--room-accent-rgb),.07);border-top-color:rgba(var(--room-accent-rgb),.18)}.room-float-modal[data-room-sub] .room-float-music-viz span{background:var(--room-accent)}.room-float-modal[data-room-sub] .room-float-empty-icon{color:rgba(var(--room-accent-rgb),.55)}.room-float-modal[data-room-sub] .room-float-messages::-webkit-scrollbar-thumb{background:rgba(var(--room-accent-rgb),.15)}.room-float-modal[data-room-sub] .room-float-messages:hover::-webkit-scrollbar-thumb{background:rgba(var(--room-accent-rgb),.3)}.room-float-modal[data-room-sub] .room-float-sidebar{border-left-color:rgba(var(--room-accent-rgb),.16)}.room-float-modal[data-room-sub] .room-float-sidebar-voice{border-bottom-color:rgba(var(--room-accent-rgb),.12)}.room-float-modal[data-room-sub] .room-float-voice-cnt{background:var(--room-accent)}@media (max-width:768px){.room-float-modal{width:calc(100vw - 16px)!important;min-width:unset!important;max-width:unset!important;left:50%!important;right:auto!important;bottom:70px!important;top:auto!important;transform:translateX(-50%)!important;resize:none!important;border-radius:10px}.room-float-resize-handle,.room-float-sidebar-resize-handle{display:none!important}.room-float-sidebar{display:flex!important;position:absolute!important;right:0;top:0;bottom:0;z-index:20;width:82%!important;min-width:unset!important;transform:translateX(102%);transition:transform .28s cubic-bezier(.4, 0, .2, 1);border-left:none!important;box-shadow:-6px 0 24px rgba(0,0,0,.45);border-radius:0 0 18px 0!important}.room-float-sidebar.mobile-open{transform:translateX(0)!important}.room-float-content{position:relative;overflow:hidden}.room-float-mobile-overlay{display:none;position:absolute;inset:0;z-index:19;background:rgba(0,0,0,.42);border-radius:0 0 18px 18px}.room-float-mobile-overlay.active{display:block}.room-float-voice-tab{display:flex!important;position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:15;background:var(--bg-tertiary);border:1px solid rgba(255,255,255,.12);border-right:none;border-radius:8px 0 0 8px;padding:12px 6px;font-size:14px;cursor:pointer;align-items:center;justify-content:center;color:var(--text-muted);transition:background .15s,color .15s,opacity .2s;box-shadow:-2px 0 8px rgba(0,0,0,.3);line-height:1}.room-float-voice-tab:hover{background:var(--bg-hover);color:var(--text)}.room-menubar{display:none!important}.room-float-meta{max-width:140px;overflow:hidden}.room-float-meta-item{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.room-float-meta-divider{display:none}.room-float-chips{max-width:100%;gap:4px}.room-float-chip{font-size:9.5px;padding:2px 6px}.room-float-chip-owner{max-width:110px}.room-float-header{cursor:default}.room-toolbar{padding:5px 8px;gap:5px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.room-toolbar::-webkit-scrollbar{display:none}.room-toolbar-btn{padding:0 10px}}.room-float-voice-tab{display:none}.room-float-mobile-overlay{display:none}[data-theme=daylight] .room-float-modal{border:1px solid var(--border);box-shadow:0 16px 48px rgba(var(--overlay-ink-rgb),.13),0 6px 18px rgba(var(--overlay-ink-rgb),.08),var(--modal-ring)}[data-theme=daylight] .room-float-messages{background:var(--bg-card)}[data-theme=daylight] .room-float-typing{background:var(--bg-card)}[data-theme=daylight] .fmt-toolbar{background:var(--bg-primary)}[data-theme=daylight] .room-float-modal[data-room-sub] .room-float-input-area{background:linear-gradient(0deg,rgba(var(--room-accent-rgb),.07) 0,transparent 100%),var(--bg-card)}[data-theme=daylight] .room-float-modal:focus-within{box-shadow:0 16px 48px rgba(0,0,0,.15),0 6px 18px rgba(0,0,0,.09),0 0 0 2px var(--accent)}[data-theme=daylight] .room-float-modal.room-float-minimized:hover{box-shadow:0 -4px 20px rgba(0,0,0,.1),0 0 0 1px var(--accent)}[data-theme=daylight] .room-float-resize-handle:active,[data-theme=daylight] .room-float-resize-handle:hover{background:rgba(0,0,0,.08)}[data-theme=daylight] .room-float-btn:hover{background:rgba(0,0,0,.07);color:var(--text-primary)}[data-theme=daylight] .room-menubar{background:var(--bg-secondary);border-bottom:1px solid var(--border)}[data-theme=daylight] .room-menu-label{color:var(--text-secondary)}[data-theme=daylight] .room-menu-item.open .room-menu-label,[data-theme=daylight] .room-menu-label:hover{background:rgba(0,0,0,.07);color:var(--text-primary)}[data-theme=daylight] .room-menu-dropdown{border:1px solid var(--border);box-shadow:0 8px 24px rgba(0,0,0,.12),0 2px 6px rgba(0,0,0,.07)}[data-theme=daylight] .room-menu-action{color:var(--text-muted)}[data-theme=daylight] .room-menu-separator{background:var(--border-light)}[data-theme=daylight] .room-toolbar{background:var(--bg-secondary);border-bottom:1px solid var(--border)}[data-theme=daylight] .room-toolbar-btn{background:rgba(0,0,0,.04);border-color:var(--border);color:var(--text-secondary)}[data-theme=daylight] .room-toolbar-btn:hover{background:rgba(0,0,0,.08);color:var(--text-primary);border-color:var(--border)}[data-theme=daylight] .room-toolbar-separator{background:var(--border)}[data-theme=daylight] .room-float-topic-bar{background:var(--bg-card);border-bottom:1px solid var(--border-light)}[data-theme=daylight] .room-float-topic-text{scrollbar-color:rgba(0,0,0,0.12) transparent}[data-theme=daylight] .room-float-topic-text::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12)}[data-theme=daylight] .room-float-topic-text:hover::-webkit-scrollbar-thumb{background:rgba(0,0,0,.22)}[data-theme=daylight] .room-float-messages{scrollbar-color:rgba(0,0,0,0.08) transparent}[data-theme=daylight] .room-float-messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .room-float-messages:hover::-webkit-scrollbar-thumb{background:rgba(0,0,0,.18)}[data-theme=daylight] .room-float-messages .msg-toolbar{box-shadow:0 1px 4px rgba(0,0,0,.1)}[data-theme=daylight] .room-float-input-area{background:linear-gradient(0deg,rgba(var(--accent-rgb),.04) 0,transparent 100%);border-top:1px solid var(--border-light)}[data-theme=daylight] .room-float-freeze-btn:hover{color:#0284c7;background:rgba(2,132,199,.1)}[data-theme=daylight] .room-float-freeze-btn.frozen{color:#0284c7;background:rgba(2,132,199,.1);box-shadow:inset 0 0 0 1px rgba(2,132,199,.35)}[data-theme=daylight] .room-float-freeze-btn.frozen svg{filter:drop-shadow(0 0 3px rgba(2, 132, 199, .5))}[data-theme=daylight] .room-float-input-pill{background:var(--bg-input);border-color:var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06)}[data-theme=daylight] .room-float-input-pill:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}[data-theme=daylight] .room-float-textarea{scrollbar-color:rgba(0,0,0,0.08) transparent}[data-theme=daylight] .room-float-sidebar{background:var(--bg-card);border-left:1px solid var(--border)}[data-theme=daylight] .room-float-sidebar-resize-handle:active,[data-theme=daylight] .room-float-sidebar-resize-handle:hover{background:rgba(0,0,0,.06)}[data-theme=daylight] .room-float-sidebar .panel{background:var(--bg-card);border:1px solid var(--border-light);box-shadow:0 1px 4px rgba(0,0,0,.05)}[data-theme=daylight] .room-float-sidebar .panel-title{background:0 0;-webkit-background-clip:unset;background-clip:unset;-webkit-text-fill-color:var(--text-muted);color:var(--text-muted);font-weight:600;letter-spacing:.5px}[data-theme=daylight] .room-float-sidebar-users{scrollbar-color:rgba(0,0,0,0.08) transparent}[data-theme=daylight] .room-float-sidebar-users::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .room-float-sidebar .user-item:hover{background:rgba(0,0,0,.05)}[data-theme=daylight] .room-float-sidebar-cnt{background:var(--bg-tertiary);color:var(--text-secondary);-webkit-text-fill-color:var(--text-secondary)}[data-theme=daylight] .room-float-voice-section{border-bottom:1px solid var(--border)}[data-theme=daylight] .room-float-sidebar-voice{border-bottom:1px solid var(--border)}[data-theme=daylight] .room-float-vuser{background:rgba(0,0,0,.04)}[data-theme=daylight] .room-float-vctrl-btn{background:rgba(0,0,0,.04);border-color:var(--border);color:var(--text-muted)}[data-theme=daylight] .room-float-vctrl-btn:hover{background:rgba(0,0,0,.08);color:var(--text-primary)}[data-theme=daylight] .room-float-sidebar .audio-visualizer{background:rgba(200,120,32,.04);border-color:var(--border);box-shadow:none}[data-theme=daylight] .room-float-sidebar .audio-bars span{background:rgba(0,0,0,.13);opacity:1;box-shadow:none}[data-theme=daylight] .room-float-sidebar .audio-bars span.active[data-zone=low]{background:linear-gradient(to top,#3b8fd4,#60acee);box-shadow:none}[data-theme=daylight] .room-float-sidebar .audio-bars span.active[data-zone=mid]{background:linear-gradient(to top,#2a9a5c,#4ec47a);box-shadow:none}[data-theme=daylight] .room-float-sidebar .audio-bars span.active[data-zone=high]{background:linear-gradient(to top,#c47010,#e8952a);box-shadow:none}[data-theme=daylight] .room-float-sidebar .audio-bars span.active.speaking[data-zone=low]{background:linear-gradient(to top,#3b8fd4,#60acee);box-shadow:0 0 5px rgba(59,143,212,.3)}[data-theme=daylight] .room-float-sidebar .audio-bars span.active.speaking[data-zone=mid]{background:linear-gradient(to top,#2a9a5c,#4ec47a);box-shadow:0 0 5px rgba(42,154,92,.3)}[data-theme=daylight] .room-float-sidebar .audio-bars span.active.speaking[data-zone=high]{background:linear-gradient(to top,#c47010,#e8952a);box-shadow:0 0 5px rgba(196,112,16,.3)}[data-theme=daylight] .room-float-sidebar .mic-level-fill{background:linear-gradient(to right,rgba(200,120,32,.22) 0,rgba(200,120,32,.1) 60%,rgba(200,80,32,.22) 100%);opacity:1}[data-theme=daylight] .room-float-sidebar .mic-level-peak{background:var(--accent);box-shadow:none;opacity:.65}[data-theme=daylight] .room-float-music-btn{background:rgba(0,0,0,.05)}[data-theme=daylight] .room-float-music-btn:hover{background:rgba(0,0,0,.09)}[data-theme=daylight] .room-float-music-sharer-label{color:var(--text-secondary)}[data-theme=daylight] .room-float-music-sharer-name{color:var(--text-primary)}[data-theme=daylight] .room-set-topic-box{border:1px solid var(--border);box-shadow:0 12px 40px rgba(0,0,0,.13)}[data-theme=daylight] .room-set-topic-input{background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary)}[data-theme=daylight] .room-set-topic-clear{background:rgba(0,0,0,.05);color:var(--text-muted)}[data-theme=daylight] .room-set-topic-clear:hover{background:rgba(0,0,0,.09);color:var(--text-primary)}[data-theme=daylight] .room-shortcuts-box{border:1px solid var(--border);box-shadow:0 16px 48px rgba(0,0,0,.13)}[data-theme=daylight] .room-shortcuts-row{border-bottom:1px solid var(--border-light)}[data-theme=daylight] .room-shortcuts-key{background:rgba(0,0,0,.04)}[data-theme=daylight] .room-shortcuts-close{background:rgba(0,0,0,.05);color:var(--text-primary)}[data-theme=daylight] .room-shortcuts-close:hover{background:rgba(0,0,0,.09)}[data-theme=daylight] .svc-confirm-box{border:1px solid var(--border);box-shadow:0 16px 48px rgba(0,0,0,.13)}[data-theme=daylight] .svc-confirm-btn-cancel{background:rgba(0,0,0,.05);color:var(--text-primary)}[data-theme=daylight] .svc-confirm-btn-cancel:hover{background:rgba(0,0,0,.09)}[data-theme=daylight] .room-options-box{border:1px solid var(--border);box-shadow:0 24px 64px rgba(0,0,0,.14)}[data-theme=daylight] .room-options-header{border-bottom:1px solid var(--border-light)}[data-theme=daylight] .room-options-tab:hover{background:rgba(0,0,0,.05);color:var(--text-secondary)}[data-theme=daylight] .room-options-item{background:var(--bg-secondary);border:1px solid var(--border-light)}[data-theme=daylight] .avatar-crop-close:hover{background:rgba(0,0,0,.07)}[data-theme=daylight] .avatar-crop-btn-full{background:rgba(0,0,0,.05);border:1px solid var(--border);color:var(--text-primary)}[data-theme=daylight] .avatar-crop-btn-full:hover{background:rgba(0,0,0,.09)}.room-cam-overlay{position:fixed;background:var(--bg-primary);border:1px solid var(--border);border-radius:10px;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.05);display:flex;flex-direction:column;user-select:none;min-width:140px;min-height:120px}.room-cam-overlay-header{position:relative;display:flex;align-items:center;align-self:stretch;gap:6px;padding:0 0 0 12px;height:34px;flex-shrink:0;cursor:grab;background:var(--bg-secondary);border-bottom:1px solid var(--bg-primary)}.room-cam-overlay-header:active{cursor:grabbing}.room-cam-overlay-kind-icon{flex-shrink:0;font-size:12px;line-height:1;pointer-events:none}.room-cam-overlay-title{flex:1;min-width:0;font-size:12px;font-weight:600;letter-spacing:.1px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.room-cam-overlay-header-btns{display:flex;align-items:stretch;align-self:stretch;flex-shrink:0}.room-cam-overlay-close{display:flex;align-items:center;justify-content:center;width:34px;height:100%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;font-size:12px;line-height:1;flex-shrink:0;transition:background .12s ease,color .12s ease;border-top-right-radius:10px}.room-cam-overlay-close svg{pointer-events:none}.room-cam-overlay-close:hover{background:var(--danger);color:#fff}.room-cam-overlay-video-wrap{position:relative;align-self:stretch;flex:1;min-height:0;background:#000;overflow:hidden;line-height:0}.room-cam-overlay-video{width:100%;height:100%;display:block;object-fit:contain}.room-cam-overlay-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:rgba(255,255,255,.75);font-size:12.5px;background:rgba(10,10,18,.55);pointer-events:none}.room-cam-overlay-loading::before{content:"";width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.18);border-top-color:var(--accent);animation:room-cam-spin .8s linear infinite}@keyframes room-cam-spin{to{transform:rotate(360deg)}}.room-cam-resize-handle{position:absolute;z-index:1}.room-cam-resize-e{right:0;top:8px;bottom:8px;width:5px;cursor:ew-resize}.room-cam-resize-w{left:0;top:8px;bottom:8px;width:5px;cursor:ew-resize}.room-cam-resize-s{bottom:0;left:8px;right:8px;height:5px;cursor:ns-resize}.room-cam-resize-n{top:0;left:8px;right:8px;height:5px;cursor:ns-resize}.room-cam-resize-se{right:0;bottom:0;width:12px;height:12px;cursor:se-resize}.room-cam-resize-sw{left:0;bottom:0;width:12px;height:12px;cursor:sw-resize}.room-cam-resize-ne{right:0;top:0;width:12px;height:12px;cursor:ne-resize}.room-cam-resize-nw{left:0;top:0;width:12px;height:12px;cursor:nw-resize}.room-cam-stopped-banner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.68);gap:10px;z-index:5}.room-cam-stopped-icon{font-size:26px;opacity:.55;line-height:1}.room-cam-stopped-text{font-size:11.5px;font-weight:600;color:rgba(255,255,255,.7);letter-spacing:.04em;text-align:center;padding:0 14px;line-height:1.4}.room-cam-viewer-btn{display:flex;align-items:center;justify-content:center;align-self:stretch;width:auto;min-width:34px;height:100%;padding:0 8px;gap:3px;background:transparent;border:none;color:var(--text-muted);cursor:pointer;font-size:11px;font-weight:700;line-height:1;flex-shrink:0;transition:background .12s ease,color .12s ease}
.room-media-pin-btn{display:flex;align-items:center;justify-content:center;align-self:stretch;width:30px;min-width:30px;padding:0 4px;background:transparent;border:none;color:var(--text-muted);cursor:pointer;font-size:11px;line-height:1;flex-shrink:0;opacity:.75;transition:background .12s ease,color .12s ease,opacity .12s ease}
.room-media-pin-btn:hover{background:rgba(var(--accent-rgb),.18);color:var(--text-primary);opacity:1}
.room-media-pin-btn.is-pinned{color:var(--accent);opacity:1;background:rgba(var(--accent-rgb),.14)}
/* A pinned camera / screen panel must sit above everything — including the
   room modal, which is a composited backdrop-filter layer that Chromium will
   otherwise paint over a higher-z-index sibling. When pinned the panel is
   promoted to the browser top layer via the Popover API (showPopover) — that
   wins unconditionally, no z-index games. The [data-pinned] rule below serves
   as the fallback for browsers without the Popover API (high z-index + own
   stacking context). It must NOT set `inset`/`margin`: the panel is
   position:fixed and carries its own inline top/left (set on create + drag),
   which already beat the UA [popover] `inset:0`. An `inset:auto !important`
   here overrode those inline coords and threw the pinned panel to its static
   position — off-screen on iOS Safari, where the pin appeared to do nothing.
   Only `padding:0` is needed to neutralise the UA [popover] `padding:.25em`. */
.room-cam-overlay[data-pinned="1"],
.room-screen-overlay[data-pinned="1"]{z-index:2147483000!important;isolation:isolate;margin:0;padding:0}.room-cam-viewer-btn:hover{background:rgba(var(--accent-rgb),.18);color:var(--text-primary)}.room-cam-viewer-eye{font-size:11px}.room-cam-viewer-count{min-width:10px;text-align:center}.room-cam-viewer-popup{position:absolute;top:34px;right:0;min-width:140px;max-width:200px;max-height:180px;overflow-y:auto;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 24px rgba(0,0,0,.45);z-index:10;padding:6px 0}.room-cam-viewer-item{padding:5px 12px;font-size:12px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-cam-viewer-item:hover{background:rgba(var(--accent-rgb),.1)}.room-cam-viewer-popup-empty{padding:8px 12px;font-size:11px;color:var(--text-muted);text-align:center}.room-screen-overlay{position:fixed;background:#0a0b18;border:1px solid rgba(88,130,255,.28);border-radius:10px;overflow:hidden;box-shadow:0 8px 40px rgba(0,0,0,.8),0 0 0 1px rgba(88,130,255,.08);display:flex;flex-direction:column;user-select:none;min-width:200px;min-height:140px}.room-screen-overlay-header{display:flex;align-items:center;gap:7px;padding:6px 10px;background:linear-gradient(90deg,rgba(88,130,255,.12) 0,rgba(255,255,255,.04) 100%);border-bottom:1px solid rgba(88,130,255,.15);cursor:grab;flex-shrink:0}.room-screen-overlay-header:active{cursor:grabbing}.room-screen-overlay-icon{font-size:12px;line-height:1;pointer-events:none;flex-shrink:0}.room-screen-overlay-title{font-size:11px;font-weight:600;color:rgba(255,255,255,.75);letter-spacing:.03em;pointer-events:none;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-screen-overlay-live{font-size:9px;font-weight:700;letter-spacing:.08em;color:#ff4d4d;background:rgba(255,77,77,.15);border:1px solid rgba(255,77,77,.35);border-radius:3px;padding:1px 5px;flex-shrink:0;pointer-events:none}.room-screen-overlay-stop{background:rgba(231,76,60,.12);border:1px solid rgba(231,76,60,.3);color:#e05050;cursor:pointer;font-size:10px;font-weight:600;padding:2px 8px;border-radius:4px;line-height:1.4;flex-shrink:0;transition:background .15s,color .15s;letter-spacing:.02em}.room-screen-overlay-mute{background:0 0;border:none;color:rgba(255,255,255,.75);cursor:pointer;font-size:12px;padding:2px 4px;border-radius:4px;line-height:1;flex-shrink:0}.room-screen-overlay-mute:hover{background:rgba(255,255,255,.12)}.room-screen-overlay-vol{width:50px;height:12px;-webkit-appearance:none;appearance:none;background:0 0;cursor:pointer;outline:0;vertical-align:middle;flex-shrink:0}.room-screen-overlay-vol::-webkit-slider-runnable-track{background:rgba(255,255,255,.3);height:4px;border-radius:2px}.room-screen-overlay-vol::-moz-range-track{background:rgba(255,255,255,.3);height:4px;border-radius:2px}.room-screen-overlay-vol::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#5882ff;cursor:pointer;margin-top:-4px}.room-screen-overlay-vol::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#5882ff;cursor:pointer;border:none}.room-screen-overlay-stop:hover{background:rgba(231,76,60,.28);color:#ff6b6b;border-color:rgba(231,76,60,.55)}.room-screen-overlay-video-wrap{background:#000;flex:1;overflow:hidden;line-height:0;position:relative}.room-screen-overlay-video{width:100%;height:100%;display:block;object-fit:contain}.room-screen-overlay-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:rgba(255,255,255,.75);font-size:12.5px;font-weight:500;letter-spacing:.02em;background:rgba(10,10,16,.55)}.room-screen-overlay-spinner{width:22px;height:22px;border:2.5px solid rgba(255,255,255,.18);border-top:2.5px solid #8cafff;border-right:2.5px solid #8cafff;border-radius:50%;animation:spin 1s linear infinite;flex-shrink:0}.room-screen-overlay-loading-error{color:#ff9b9b;cursor:pointer}.room-screen-overlay-loading-error .room-screen-overlay-spinner{display:none}.room-screen-overlay-loading-error .room-screen-overlay-loading-text::after{content:" — Retry";color:#a8c4ff;text-decoration:underline;text-underline-offset:2px}.room-screen-overlay-loading-error:hover .room-screen-overlay-loading-text::after{color:#cddcff}.room-access-denied-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100000010;background:rgba(0,0,0,.6);animation:lightbox-fade-in .18s ease}.room-access-denied-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(231,76,60,.35);border-radius:14px;padding:32px 28px 24px;width:min(360px,90vw);display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:0 20px 60px rgba(0,0,0,.7);animation:roomOptsSlideUp .22s cubic-bezier(.34,1.56,.64,1);text-align:center}.room-access-denied-icon{font-size:38px;line-height:1;margin-bottom:4px}.room-access-denied-title{font-size:15px;font-weight:700;color:var(--text-primary,#e8e8f0);line-height:1.4}.room-access-denied-channel{font-size:13px;color:var(--accent,#7c5cfc);font-weight:600}.room-access-denied-reason{font-size:12px;color:var(--text-muted,#888);background:rgba(255,255,255,.04);border-radius:6px;padding:6px 12px;max-width:100%;word-break:break-word}.room-access-denied-close{margin-top:8px;background:rgba(231,76,60,.15);border:1px solid rgba(231,76,60,.35);color:#e74c3c;border-radius:8px;padding:8px 28px;font-size:13px;font-weight:600;cursor:pointer;transition:background .14s,border-color .14s}.room-access-denied-close:hover{background:rgba(231,76,60,.26);border-color:rgba(231,76,60,.55)}.room-limit-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100000010;background:rgba(0,0,0,.6);animation:lightbox-fade-in .18s ease}.room-limit-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(124,92,252,.35);border-radius:14px;padding:32px 28px 24px;width:min(360px,90vw);display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:0 20px 60px rgba(0,0,0,.7);animation:roomOptsSlideUp .22s cubic-bezier(.34,1.56,.64,1);text-align:center}.room-limit-icon{font-size:38px;line-height:1;margin-bottom:4px}.room-limit-title{font-size:15px;font-weight:700;color:var(--text-primary,#e8e8f0);line-height:1.4}.room-limit-reason{font-size:12px;color:var(--text-muted,#888);background:rgba(255,255,255,.04);border-radius:6px;padding:6px 12px;max-width:100%;word-break:break-word}.room-limit-actions{display:flex;gap:10px;margin-top:8px}.room-limit-btn{border-radius:8px;padding:8px 20px;font-size:13px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:background .14s,border-color .14s}.room-limit-btn-primary{background:rgba(124,92,252,.18);border-color:rgba(124,92,252,.4);color:var(--accent,#7c5cfc)}.room-limit-btn-primary:hover{background:rgba(124,92,252,.28);border-color:rgba(124,92,252,.6)}.room-limit-btn-secondary{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15);color:var(--text-secondary,#ccc)}.room-limit-btn-secondary:hover{background:rgba(255,255,255,.1)}.room-mod-dialog-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100000015;background:rgba(0,0,0,.6);animation:lightbox-fade-in .15s ease}.room-mod-dialog-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:14px;width:min(380px,92vw);display:flex;flex-direction:column;gap:0;box-shadow:0 24px 64px rgba(0,0,0,.65);animation:roomOptsSlideUp .2s cubic-bezier(.34,1.56,.64,1);overflow:hidden}.room-mod-dialog-header{padding:14px 16px;font-size:13px;font-weight:700;color:var(--text-primary,#e8e8f0);border-bottom:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.02)}.room-mod-dialog-body{padding:16px;display:flex;flex-direction:column;gap:10px}.room-mod-dialog-body p{margin:0;font-size:13px;color:var(--text-secondary,#ccc)}.room-mod-dialog-label{font-size:11px;color:var(--text-muted,#888);font-weight:600;text-transform:uppercase;letter-spacing:.04em}.room-mod-dialog-reason{background:var(--bg-input,rgba(255,255,255,.06));border:1px solid var(--border,rgba(255,255,255,.12));border-radius:7px;color:var(--text-primary,#e8e8f0);font-size:13px;padding:8px 10px;outline:0;transition:border-color .14s;width:100%;box-sizing:border-box}.room-mod-dialog-reason:focus{border-color:var(--accent,#7c5cfc)}.room-mod-dialog-footer{display:flex;gap:8px;justify-content:flex-end;padding:12px 16px;border-top:1px solid rgba(255,255,255,.07)}.room-mod-cancel-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--text-secondary,#ccc);border-radius:7px;padding:7px 18px;font-size:13px;cursor:pointer;transition:background .13s}.room-mod-cancel-btn:hover{background:rgba(255,255,255,.1)}.room-mod-confirm-btn{border-radius:7px;padding:7px 18px;font-size:13px;font-weight:600;cursor:pointer;transition:background .13s,border-color .13s}.room-mod-confirm-kick{background:rgba(243,156,18,.15);border:1px solid rgba(243,156,18,.35);color:#f39c12}.room-mod-confirm-kick:hover{background:rgba(243,156,18,.26);border-color:rgba(243,156,18,.55)}.room-mod-confirm-ban{background:rgba(231,76,60,.15);border:1px solid rgba(231,76,60,.35);color:#e74c3c}.room-mod-confirm-ban:hover{background:rgba(231,76,60,.26);border-color:rgba(231,76,60,.55)}.user-ctx-separator{height:1px;background:rgba(255,255,255,.08);margin:4px 8px}.user-context-menu>button.user-ctx-danger{color:#e74c3c}.user-context-menu>button.user-ctx-danger:hover{background:rgba(231,76,60,.12)}.room-options-item-meta{font-size:10.5px;color:var(--text-muted,#777)}.room-options-item-target{color:var(--text-primary,#ddd);font-weight:600}.room-options-logs-more{display:flex;justify-content:center;padding:10px 0 2px}.room-toolbar-btn-karaoke{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.07);color:var(--text-muted)}.room-toolbar-btn-karaoke:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.14);color:var(--text-primary)}.room-toolbar-btn-karaoke.active{background:rgba(var(--accent-rgb),.18);border-color:rgba(var(--accent-rgb),.4);color:var(--accent)}@keyframes karaokeSlideIn{from{opacity:0;transform:scale(.97) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes karaokeSpinner{to{transform:rotate(360deg)}}.room-karaoke-popup{background:var(--bg-card,#0f1019);border:1px solid rgba(255,255,255,.08);border-radius:12px;box-shadow:0 24px 64px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.04);display:flex;flex-direction:column;overflow:hidden;min-width:380px;min-height:360px;animation:karaokeSlideIn .2s cubic-bezier(.16,1,.3,1);position:relative}.room-karaoke-header{display:flex;align-items:center;gap:10px;padding:0 6px 0 14px;height:46px;background:rgba(255,255,255,.025);border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;cursor:grab;user-select:none}.room-karaoke-header:active{cursor:grabbing}.room-karaoke-title{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:rgba(255,255,255,.5);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0}.room-karaoke-header-search{flex:1;display:flex;align-items:center;position:relative;max-width:260px;margin-left:auto}.room-karaoke-input{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:var(--text-primary,#e8e8f0);border-radius:7px;padding:6px 34px 6px 11px;font-size:12.5px;outline:0;transition:border-color .15s,background .15s}.room-karaoke-input::placeholder{color:rgba(255,255,255,.25)}.room-karaoke-input:focus{border-color:rgba(var(--accent-rgb),.45);background:rgba(255,255,255,.08)}.room-karaoke-search-icon-btn{position:absolute;right:5px;top:50%;transform:translateY(-50%);background:0 0;border:none;color:rgba(255,255,255,.3);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:color .12s;line-height:1}.room-karaoke-search-icon-btn:hover{color:rgba(255,255,255,.7)}.room-karaoke-close{background:0 0;border:none;color:rgba(255,255,255,.3);cursor:pointer;padding:8px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:background .12s,color .12s;flex-shrink:0;line-height:1}.room-karaoke-close:hover{background:rgba(255,255,255,.07);color:rgba(255,255,255,.8)}.room-karaoke-content{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.room-karaoke-content>.room-karaoke-panel{display:flex;flex-direction:column;flex:1;min-height:0}.room-karaoke-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:32px 24px}.room-karaoke-empty p{font-size:13px;font-weight:500;color:rgba(255,255,255,.25);margin:0}.room-karaoke-empty span{font-size:11.5px;color:rgba(255,255,255,.14)}.room-karaoke-loading{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;color:rgba(255,255,255,.35);font-size:12.5px}.room-karaoke-spinner{width:15px;height:15px;border:2px solid rgba(var(--accent-rgb),.15);border-top-color:rgba(var(--accent-rgb),.65);border-radius:50%;animation:karaokeSpinner .7s linear infinite;flex-shrink:0}.room-karaoke-no-results{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:32px 24px}.room-karaoke-no-results p{font-size:13px;font-weight:500;color:rgba(255,255,255,.25);margin:0}.room-karaoke-no-results span{font-size:11.5px;color:rgba(255,255,255,.14)}.room-karaoke-results{flex:1;overflow-y:auto;min-height:0;padding:4px 0}.room-karaoke-results::-webkit-scrollbar{width:3px}.room-karaoke-results::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.room-karaoke-item{display:flex;align-items:center;gap:11px;padding:8px 14px;cursor:pointer;transition:background .1s}.room-karaoke-item:hover{background:rgba(255,255,255,.04)}.room-karaoke-thumb{width:68px;height:45px;border-radius:5px;overflow:hidden;flex-shrink:0;background:rgba(255,255,255,.05)}.room-karaoke-thumb img{width:100%;height:100%;object-fit:cover;display:block}.room-karaoke-thumb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.2)}.room-karaoke-item-info{flex:1;min-width:0}.room-karaoke-item-title{font-size:12px;font-weight:500;color:rgba(255,255,255,.85);line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.room-karaoke-item-channel{font-size:10.5px;color:rgba(255,255,255,.3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-karaoke-play-btn{background:rgba(var(--accent-rgb),.14);border:1px solid rgba(var(--accent-rgb),.28);color:var(--accent);border-radius:5px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;flex-shrink:0;display:flex;align-items:center;gap:5px;transition:background .12s,border-color .12s,opacity .12s;white-space:nowrap;opacity:0}.room-karaoke-play-btn:hover{background:rgba(var(--accent-rgb),.28);border-color:rgba(var(--accent-rgb),.55)}.room-karaoke-footer{border-top:1px solid rgba(255,255,255,.05);padding:8px 14px;display:flex;justify-content:center;flex-shrink:0}.room-karaoke-more-btn{background:0 0;border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.35);border-radius:6px;padding:6px 18px;font-size:11.5px;cursor:pointer;transition:background .12s,color .12s,border-color .12s}.room-karaoke-more-btn:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.7)}.room-karaoke-player-wrap{display:flex;flex-direction:column;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.06)}.room-karaoke-player-iframe-wrap{height:210px;background:#000;overflow:hidden;flex-shrink:0}.room-karaoke-player-iframe-wrap iframe{display:block;width:100%;height:100%;border:none}.room-karaoke-player-bar{display:flex;align-items:center;gap:8px;padding:7px 12px;background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.06);flex-shrink:0}.room-karaoke-now-playing-wrap{flex:1;min-width:0}.room-karaoke-now-playing-label{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(var(--accent-rgb),.7);margin-bottom:2px}.room-karaoke-now-playing{font-size:12px;font-weight:500;color:rgba(255,255,255,.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-karaoke-next-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.55);border-radius:6px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px;flex-shrink:0;transition:background .12s,color .12s,border-color .12s;white-space:nowrap}.room-karaoke-next-btn:hover{background:rgba(var(--accent-rgb),.14);border-color:rgba(var(--accent-rgb),.35);color:var(--accent)}.room-karaoke-tabs{display:flex;align-items:center;gap:2px;padding:6px 10px 0;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;background:rgba(255,255,255,.01)}.room-karaoke-tab{background:0 0;border:none;border-bottom:2px solid transparent;color:rgba(255,255,255,.35);padding:5px 10px 7px;font-size:11.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px;transition:color .12s,border-color .12s;margin-bottom:-1px;letter-spacing:.01em}.room-karaoke-tab:hover{color:rgba(255,255,255,.6)}.room-karaoke-tab.active{color:rgba(255,255,255,.9);border-bottom-color:var(--accent)}.room-karaoke-tab-count{background:rgba(var(--accent-rgb),.2);color:var(--accent);border-radius:10px;padding:1px 6px;font-size:10px;font-weight:700;min-width:16px;text-align:center;line-height:1.5}.room-karaoke-panel{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.room-karaoke-item-actions{display:flex;align-items:center;gap:5px;flex-shrink:0;opacity:0;transition:opacity .12s}.room-karaoke-item:hover .room-karaoke-item-actions{opacity:1}.room-karaoke-queue-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.4);border-radius:5px;padding:5px 8px;font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:4px;transition:background .12s,color .12s,border-color .12s;white-space:nowrap}.room-karaoke-queue-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.75)}.room-karaoke-play-btn{background:rgba(var(--accent-rgb),.14);border:1px solid rgba(var(--accent-rgb),.28);color:var(--accent);border-radius:5px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;flex-shrink:0;display:flex;align-items:center;gap:5px;transition:background .12s,border-color .12s;white-space:nowrap}.room-karaoke-play-btn:hover{background:rgba(var(--accent-rgb),.28);border-color:rgba(var(--accent-rgb),.55)}.room-karaoke-queue-list{flex:1;overflow-y:auto;min-height:0;padding:4px 0 8px}.room-karaoke-queue-list::-webkit-scrollbar{width:3px}.room-karaoke-queue-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.room-karaoke-queue-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:36px 24px;text-align:center}.room-karaoke-queue-empty p{font-size:13px;font-weight:500;color:rgba(255,255,255,.2);margin:0}.room-karaoke-queue-empty span{font-size:11.5px;color:rgba(255,255,255,.12)}.room-karaoke-queue-now{padding:8px 14px 4px}.room-karaoke-queue-now-label,.room-karaoke-queue-section-label{font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.22);padding:6px 14px 4px}.room-karaoke-queue-now-label{padding:2px 0 6px;color:rgba(var(--accent-rgb),.6)}.room-karaoke-queue-item{display:flex;align-items:center;gap:9px;padding:6px 14px;transition:background .1s}.room-karaoke-queue-item:hover{background:rgba(255,255,255,.03)}.room-karaoke-queue-item:hover .room-karaoke-item-actions{opacity:1}.room-karaoke-queue-item--current{background:rgba(var(--accent-rgb),.04)}.room-karaoke-queue-pos{font-size:10px;font-weight:700;color:rgba(255,255,255,.18);width:14px;text-align:center;flex-shrink:0}.room-karaoke-queue-thumb{width:54px;height:36px;border-radius:4px;overflow:hidden;flex-shrink:0;background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;position:relative}.room-karaoke-queue-thumb img{width:100%;height:100%;object-fit:cover;display:block}.room-karaoke-queue-remove{background:0 0;border:none;color:rgba(255,255,255,.2);cursor:pointer;padding:5px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:color .12s,background .12s;flex-shrink:0}.room-karaoke-queue-remove:hover{color:rgba(255,100,100,.8);background:rgba(255,100,100,.08)}@keyframes karaokeBar1{0%,100%{height:4px}50%{height:12px}}@keyframes karaokeBar2{0%,100%{height:10px}33%{height:3px}66%{height:14px}}@keyframes karaokeBar3{0%,100%{height:7px}40%{height:14px}80%{height:3px}}.room-karaoke-queue-playing-icon{display:flex;align-items:flex-end;gap:2px;height:16px}.room-karaoke-queue-playing-icon span{display:block;width:3px;border-radius:2px;background:var(--accent)}.room-karaoke-queue-playing-icon span:first-child{animation:karaokeBar1 .9s ease-in-out infinite}.room-karaoke-queue-playing-icon span:nth-child(2){animation:karaokeBar2 .85s ease-in-out infinite}.room-karaoke-queue-playing-icon span:nth-child(3){animation:karaokeBar3 1s ease-in-out infinite}.room-karaoke-resize-handle{position:absolute;bottom:0;right:0;width:16px;height:16px;cursor:se-resize;z-index:2;opacity:.35;background:linear-gradient(135deg,transparent 55%,rgba(255,255,255,.5) 55%,rgba(255,255,255,.5) 62%,transparent 62%),linear-gradient(135deg,transparent 67%,rgba(255,255,255,.5) 67%,rgba(255,255,255,.5) 74%,transparent 74%);border-bottom-right-radius:12px;transition:opacity .15s}.room-karaoke-popup:hover .room-karaoke-resize-handle{opacity:.6}@media (max-width:600px){.room-karaoke-popup{min-width:unset;width:calc(100vw - 24px)!important}.room-karaoke-header-search{max-width:none}.room-karaoke-thumb{width:58px;height:38px}}.room-ytmusic-track-card{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:28px 24px 20px;min-height:0;background:rgba(0,0,0,.12)}.room-ytmusic-track-art{width:160px;height:160px;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.05);flex-shrink:0;box-shadow:0 6px 28px rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center}.room-ytmusic-track-art img{width:100%;height:100%;object-fit:cover;display:block}.room-ytmusic-track-meta{text-align:center;min-width:0;width:100%;padding:0 8px}.room-ytmusic-track-title{font-size:14px;font-weight:600;color:rgba(255,255,255,.92);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px}.room-ytmusic-track-artist{font-size:12px;color:rgba(255,255,255,.42);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-ytmusic-popup .ntt-genre-chips{border-bottom:1px solid rgba(255,255,255,.06);padding:6px 10px 6px}.ytmusic-autoplay-bar{display:flex;align-items:center;justify-content:center;padding:6px 12px 8px;border-top:1px solid rgba(255,255,255,.06)}.ytmusic-autoplay-label{display:flex;align-items:center;gap:5px;font-size:11px;color:rgba(255,255,255,.45);cursor:pointer;user-select:none}.ytmusic-autoplay-label input[type=checkbox]{accent-color:#fbbf24;cursor:pointer}.ytmusic-autoplay-label:has(input:checked){color:#fbbf24}.room-ytmusic-header{gap:8px}.room-ytmusic-title .room-ytmusic-icon{color:#ff4e45;flex-shrink:0}.room-ytmusic-title{color:rgba(255,255,255,.82);font-size:12.5px}.room-ytmusic-dj-toggle{display:flex;align-items:center;gap:4px;margin-left:auto;background:0 0;border:1px solid rgba(255,255,255,.12);border-radius:5px;color:rgba(255,255,255,.35);cursor:pointer;font-size:10px;font-weight:600;letter-spacing:.05em;padding:3px 7px;transition:background .12s,color .12s,border-color .12s;flex-shrink:0;line-height:1}.room-ytmusic-dj-toggle:hover{background:rgba(255,255,255,.06);color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.22)}.room-ytmusic-dj-toggle.active{background:rgba(250,191,36,.15);border-color:rgba(250,191,36,.5);color:#fbbf24}.room-ytmusic-dj-toggle.active:hover{background:rgba(250,191,36,.22)}.room-ytmusic-dj-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 10px 5px 12px;border-top:1px solid rgba(250,191,36,.2);background:rgba(250,191,36,.06);flex-shrink:0;min-height:32px}.room-ytmusic-dj-now{display:flex;align-items:center;gap:6px;color:#fbbf24;font-size:11px;font-weight:500;min-width:0;overflow:hidden}.room-ytmusic-dj-now span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-ytmusic-dj-controls{display:flex;align-items:center;gap:4px;flex-shrink:0}.room-ytmusic-dj-btn{display:flex;align-items:center;justify-content:center;background:0 0;border:none;color:rgba(250,191,36,.7);cursor:pointer;padding:4px;border-radius:4px;transition:background .1s,color .1s;line-height:1}.room-ytmusic-dj-btn:hover{background:rgba(250,191,36,.12);color:#fbbf24}.room-ytmusic-queue-preview{border-top:1px solid rgba(255,255,255,.06);flex-shrink:0;padding:6px 0 4px}.room-ytmusic-queue-preview-header{display:flex;align-items:center;gap:5px;padding:0 12px 4px;font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.28)}.room-ytmusic-queue-item{display:flex;align-items:center;gap:8px;padding:4px 12px}.room-ytmusic-queue-pos{font-size:10px;font-weight:600;color:rgba(255,255,255,.2);min-width:12px;text-align:center;flex-shrink:0}.room-ytmusic-queue-info{display:flex;flex-direction:column;min-width:0;gap:1px}.room-ytmusic-queue-title{font-size:11.5px;font-weight:500;color:rgba(255,255,255,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-ytmusic-queue-by{font-size:10px;color:rgba(255,255,255,.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-ytmusic-search-row{position:relative;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0}.room-ytmusic-search-row .room-karaoke-input{width:100%;padding:8px 38px 8px 13px;font-size:13px;border-radius:8px;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}.room-ytmusic-search-row .room-karaoke-input:focus{border-color:rgba(255,78,69,.45);background:rgba(255,255,255,.09)}.room-ytmusic-search-row .room-karaoke-search-icon-btn{position:absolute;right:18px;top:50%;transform:translateY(-50%)}.room-ytmusic-genres{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;padding:7px 12px!important}.room-ytmusic-genres::-webkit-scrollbar{display:none}.room-ytmusic-genres .ntt-genre-chip.active{background:rgba(255,78,69,.15);border-color:rgba(255,78,69,.4);color:#ff8f8e}.room-ytmusic-queue-btn{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.55);border-radius:6px;padding:6px 11px;font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px;transition:background .12s,border-color .12s,color .12s,transform .1s;white-space:nowrap;flex-shrink:0;line-height:1}.room-ytmusic-queue-btn:hover{background:rgba(255,78,69,.16);border-color:rgba(255,78,69,.38);color:#ff8f8e}.room-ytmusic-queue-btn:active{transform:scale(.96)}.ytmusic-results-locked .room-karaoke-item{pointer-events:none;opacity:.45}.room-ytmusic-back-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);color:rgba(255,255,255,.45);border-radius:6px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px;transition:background .12s,color .12s,border-color .12s;white-space:nowrap;flex-shrink:0;line-height:1}.room-ytmusic-back-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.75)}.room-ytmusic-add-queue-btn{background:rgba(255,78,69,.13);border:1px solid rgba(255,78,69,.32);color:#ff8f8e;border-radius:6px;padding:5px 12px;font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px;transition:background .12s,border-color .12s;white-space:nowrap;flex-shrink:0;line-height:1}.room-ytmusic-add-queue-btn:hover{background:rgba(255,78,69,.23);border-color:rgba(255,78,69,.5)}.room-ytmusic-add-queue-btn:active{transform:scale(.97)}.room-toolbar-btn-ntt{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.07);color:var(--text-muted)}.room-toolbar-btn-ntt:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.14);color:var(--text-primary)}.room-toolbar-btn-ntt.active{background:rgba(251,191,36,.18);border-color:rgba(251,191,36,.42);color:#fbbf24}.ntt-status-badge{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:20px;background:rgba(255,255,255,.07);color:rgba(255,255,255,.35);flex-shrink:0;margin-left:auto}.ntt-status-badge.active{background:rgba(34,197,94,.15);color:#4ade80}.ntt-status-badge.paused{background:rgba(251,191,36,.15);color:#fbbf24}.ntt-panel{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.ntt-search-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0}.ntt-ready-content{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding:16px;gap:14px;min-height:0}.ntt-ready-content::-webkit-scrollbar{width:3px}.ntt-ready-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.ntt-song-preview{display:flex;align-items:center;gap:13px;padding:11px 13px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:10px}.ntt-preview-art{width:62px;height:62px;border-radius:8px;overflow:hidden;background:rgba(255,255,255,.06);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.2)}.ntt-preview-art img{width:100%;height:100%;object-fit:cover;display:block}.ntt-preview-meta{flex:1;min-width:0}.ntt-preview-title{font-size:13px;font-weight:600;color:rgba(255,255,255,.9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}.ntt-preview-artist{font-size:11.5px;color:rgba(255,255,255,.4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ntt-settings-block{display:flex;flex-direction:column;gap:10px;padding:12px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:9px}.ntt-settings-block-title{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.25);margin-bottom:4px}.ntt-setting-row{display:flex;align-items:center;gap:10px;font-size:12px;color:rgba(255,255,255,.55)}.ntt-setting-row label{display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none}.ntt-setting-row input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:#fbbf24}.ntt-number-input{width:60px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:5px;color:var(--text-primary,#e8e8f0);padding:4px 8px;font-size:12px;outline:0;text-align:center}.ntt-number-input:focus{border-color:rgba(251,191,36,.45)}.ntt-setting-hint{font-size:10.5px;color:rgba(255,255,255,.22);margin-left:auto}.ntt-ready-actions{display:flex;gap:8px;padding:12px 16px;border-top:1px solid rgba(255,255,255,.06);flex-shrink:0}.ntt-btn{border-radius:7px;padding:7px 14px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid transparent;display:flex;align-items:center;gap:5px;transition:background .12s,border-color .12s,opacity .12s;white-space:nowrap;flex-shrink:0}.ntt-btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.ntt-btn-back{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.55)}.ntt-btn-back:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.8)}.ntt-btn-start{flex:1;justify-content:center;background:rgba(251,191,36,.16);border-color:rgba(251,191,36,.38);color:#fbbf24}.ntt-btn-start:hover{background:rgba(251,191,36,.26);border-color:rgba(251,191,36,.58);color:#fcd34d}.ntt-game-content{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.ntt-game-search{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.ntt-ctrl-btn.ntt-btn-search-song:hover{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.25);color:#fbbf24}.ntt-current-song{display:flex;align-items:center;gap:11px;padding:10px 13px;background:rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0}.ntt-current-art{width:46px;height:46px;border-radius:7px;overflow:hidden;background:rgba(255,255,255,.06);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.2)}.ntt-current-art img{width:100%;height:100%;object-fit:cover;display:block}.ntt-current-meta{flex:1;min-width:0}.ntt-answer-label{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(251,191,36,.55);margin-bottom:2px}.ntt-current-title{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.ntt-current-artist{font-size:11px;color:rgba(255,255,255,.38);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ntt-paused-badge{font-size:9.5px;font-weight:700;letter-spacing:.05em;padding:2px 7px;border-radius:20px;background:rgba(251,191,36,.15);color:#fbbf24;flex-shrink:0}.ntt-scoreboard{flex:1;overflow-y:auto;min-height:0;padding:6px 0}.ntt-scoreboard::-webkit-scrollbar{width:3px}.ntt-scoreboard::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.ntt-scoreboard-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:8px;color:rgba(255,255,255,.2);font-size:12px;text-align:center;padding:24px;min-height:80px}.ntt-scoreboard-hdr{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.22);padding:4px 14px 6px;border-bottom:1px solid rgba(255,255,255,.04)}.ntt-score-row{display:flex;align-items:center;gap:9px;padding:6px 14px}.ntt-score-rank{font-size:11px;font-weight:700;color:rgba(255,255,255,.2);width:18px;text-align:center;flex-shrink:0}.ntt-score-rank.gold{color:#f59e0b}.ntt-score-rank.silver{color:#9ca3af}.ntt-score-rank.bronze{color:#b45309}.ntt-score-name{flex:1;min-width:0;font-size:12px;color:rgba(255,255,255,.78);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ntt-score-pts{font-size:13px;font-weight:700;color:#fbbf24;flex-shrink:0}.ntt-pts-label{font-size:10px;font-weight:400;color:rgba(255,255,255,.28);margin-left:2px}.ntt-controls{display:flex;gap:5px;padding:8px 11px;border-top:1px solid rgba(255,255,255,.05);flex-shrink:0;flex-wrap:wrap;align-items:center}.ntt-ctrl-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:6px;color:rgba(255,255,255,.52);padding:5px 10px;font-size:11.5px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:4px;white-space:nowrap;transition:background .12s,color .12s,border-color .12s}.ntt-ctrl-btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.8)}.ntt-ctrl-btn.ntt-btn-pause:hover,.ntt-ctrl-btn.ntt-btn-resume:hover{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.25);color:#fbbf24}.ntt-ctrl-btn.ntt-btn-end{background:rgba(239,68,68,.06);border-color:rgba(239,68,68,.15);color:rgba(239,68,68,.65)}.ntt-ctrl-btn.ntt-btn-end:hover{background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.35);color:#ef4444}.ntt-settings-bar{display:flex;align-items:center;gap:8px;padding:6px 11px;border-top:1px solid rgba(255,255,255,.04);flex-shrink:0;flex-wrap:wrap}.ntt-settings-bar label{display:flex;align-items:center;gap:5px;font-size:11px;color:rgba(255,255,255,.38);cursor:pointer;user-select:none;white-space:nowrap}.ntt-settings-bar input[type=checkbox]{width:12px;height:12px;cursor:pointer;accent-color:#fbbf24}.ntt-settings-bar .ntt-number-input{width:46px;padding:3px 6px}.ntt-settings-bar .ntt-ctrl-btn{padding:3px 8px;font-size:10.5px}.ntt-settings-bar-sep{color:rgba(255,255,255,.12);font-size:13px}.ntt-pregame-queue{border-top:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02);flex-shrink:0}.ntt-queue-section{border-top:1px solid rgba(255,255,255,.06);margin-top:6px;flex-shrink:0}.ntt-queue-hdr{display:flex;align-items:center;justify-content:space-between;padding:6px 12px 4px}.ntt-queue-hdr-label{font-size:10.5px;font-weight:600;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.05em}.ntt-queue-clear-btn{background:0 0;border:none;color:rgba(255,255,255,.25);font-size:10px;cursor:pointer;padding:2px 5px;border-radius:3px;transition:color .15s,background .15s}.ntt-queue-clear-btn:hover{color:rgba(239,68,68,.8);background:rgba(239,68,68,.08)}.ntt-queue-list{max-height:130px;overflow-y:auto;padding:2px 0}.ntt-queue-list::-webkit-scrollbar{width:3px}.ntt-queue-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.ntt-queue-item{display:flex;align-items:center;gap:8px;padding:5px 12px;transition:background .1s}.ntt-queue-item:hover{background:rgba(255,255,255,.03)}.ntt-queue-item-thumb{width:28px;height:28px;border-radius:3px;overflow:hidden;flex-shrink:0;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center}.ntt-queue-item-thumb img{width:100%;height:100%;object-fit:cover;display:block}.ntt-queue-item-title{flex:1;min-width:0;font-size:11.5px;color:rgba(255,255,255,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ntt-queue-remove{background:0 0;border:none;color:rgba(255,255,255,.2);font-size:14px;line-height:1;cursor:pointer;padding:2px 4px;border-radius:3px;flex-shrink:0;transition:color .15s,background .15s}.ntt-queue-remove:hover{color:rgba(239,68,68,.8);background:rgba(239,68,68,.08)}.ntt-pregame-start-area{display:flex;align-items:center;gap:8px;padding:7px 12px 9px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.04)}.ntt-queue-setting{display:flex;align-items:center;gap:4px;font-size:11px;color:rgba(255,255,255,.38);cursor:pointer;user-select:none;white-space:nowrap}.ntt-queue-setting input[type=checkbox]{width:12px;height:12px;cursor:pointer;accent-color:#fbbf24}.ntt-pregame-start-area .ntt-btn-start{margin-left:auto}.ntt-result-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}.ntt-queue-add-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.45);font-size:10.5px;padding:4px 8px;border-radius:5px;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,border-color .15s;opacity:0}.room-karaoke-item:hover .ntt-queue-add-btn{opacity:1}.ntt-queue-add-btn:hover{background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.3);color:#fbbf24}.ntt-queue-add-btn:disabled{opacity:.5;cursor:default}.ntt-announcement-msg{margin:3px 8px;padding:5px 10px;background:linear-gradient(135deg,rgba(251,191,36,.07),rgba(251,191,36,.03));border:1px solid rgba(251,191,36,.2);border-radius:7px;font-size:10px;font-weight:700;color:rgba(255,255,255,.82);white-space:pre-line;line-height:1.55;animation:nttAnnouncePop .28s cubic-bezier(.16,1,.3,1)}.ntt-announcement-msg.gameover{background:linear-gradient(135deg,rgba(251,191,36,.11),rgba(251,191,36,.04));border-color:rgba(251,191,36,.32)}.ntt-announcement-msg.started{background:rgba(255,255,255,.02);border-color:rgba(255,255,255,.08);color:rgba(255,255,255,.42);font-size:10px;font-weight:600}.ntt-announcement-msg.ended{background:rgba(255,255,255,.02);border-color:rgba(255,255,255,.08);color:rgba(255,255,255,.42);font-size:10px;font-weight:600}.ntt-announcement-msg.hint{background:linear-gradient(135deg,rgba(99,179,237,.06),rgba(99,179,237,.02));border-color:rgba(99,179,237,.2);padding:5px 10px 6px}.ntt-hint-label{font-size:8px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:rgba(99,179,237,.6);margin-bottom:3px}.ntt-hint-text{font-family:'Courier New',Courier,monospace;font-size:10px;font-weight:700;letter-spacing:.12em;color:rgba(255,255,255,.9);word-break:break-all}.ntt-active-notice{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:40px 28px;gap:14px;text-align:center}.ntt-active-notice-icon{color:rgba(255,255,255,.35)}.ntt-active-notice-text{font-size:14px;font-weight:600;color:rgba(255,255,255,.75);letter-spacing:.01em}.ntt-active-notice-sub{font-size:12px;color:rgba(255,255,255,.38);line-height:1.6}@keyframes nttAnnouncePop{from{opacity:0;transform:scale(.97) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}.msg-toolbar .ntt-approve-btn{display:none;color:#4ade80;font-weight:700;font-size:13px}.msg-toolbar .ntt-approve-btn:hover{color:#86efac}@media (hover:hover) and (pointer:fine){.ntt-gm-active .message-compact:hover .msg-toolbar .ntt-approve-btn,.ntt-gm-active .message:hover .msg-toolbar .ntt-approve-btn{display:flex!important}}.ntt-gm-active .msg-selected .msg-toolbar .ntt-approve-btn{display:flex!important}@media (max-width:600px){.room-ntt-popup{min-width:unset;width:calc(100vw - 24px)!important}}.ntt-genre-chips{display:flex;flex-wrap:wrap;gap:5px;padding:6px 12px 4px}.ntt-genre-chip{padding:3px 9px;font-size:11px;font-weight:500;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:rgba(255,255,255,.55);cursor:pointer;transition:background .15s,border-color .15s,color .15s;line-height:1.4}.ntt-genre-chip:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.22);color:rgba(255,255,255,.8)}.ntt-genre-chip.active{background:rgba(251,191,36,.15);border-color:rgba(251,191,36,.4);color:#fbbf24}.trivia-status-badge{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:3px 8px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.3);flex-shrink:0;margin-left:auto;transition:background .2s,color .2s,border-color .2s}.trivia-status-badge.active{background:rgba(99,214,133,.12);border-color:rgba(99,214,133,.35);color:#63d685}.trivia-status-badge.paused{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.3);color:#fbbf24}.trivia-panel{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.trivia-setup-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:18px;min-height:0}.trivia-setup-body::-webkit-scrollbar{width:3px}.trivia-setup-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.trivia-setup-section-label{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.25);margin-bottom:10px}.trivia-category-chips{display:flex;flex-wrap:wrap;gap:6px}.trivia-cat-chip{padding:5px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:rgba(255,255,255,.4);font-size:11.5px;font-weight:500;cursor:pointer;transition:background .12s,border-color .12s,color .12s;user-select:none;white-space:nowrap}.trivia-cat-chip:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.65);border-color:rgba(255,255,255,.2)}.trivia-cat-chip.active{background:rgba(99,102,241,.15);border-color:rgba(99,102,241,.45);color:#a5b4fc}.trivia-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.trivia-setting-item{display:flex;flex-direction:column;gap:6px}.trivia-setting-label{font-size:11.5px;color:rgba(255,255,255,.45);font-weight:500}.trivia-setting-hint-inline{font-size:10px;color:rgba(255,255,255,.25);font-weight:400}.trivia-number-input{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text-primary,#e8e8f0);padding:6px 10px;font-size:13px;outline:0;text-align:center;box-sizing:border-box}.trivia-number-input:focus{border-color:rgba(99,102,241,.45)}.trivia-setting-hint{font-size:11px;color:rgba(255,255,255,.22)}.trivia-setup-start-area{margin-top:auto;padding-top:4px}.trivia-btn{border-radius:8px;padding:9px 16px;font-size:12.5px;font-weight:600;cursor:pointer;border:1px solid transparent;display:inline-flex;align-items:center;gap:6px;transition:background .12s,border-color .12s,opacity .12s;white-space:nowrap}.trivia-btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.trivia-btn-start{width:100%;justify-content:center;background:rgba(99,102,241,.16);border-color:rgba(99,102,241,.4);color:#a5b4fc}.trivia-btn-start:hover{background:rgba(99,102,241,.28);border-color:rgba(99,102,241,.6);color:#c7d2fe}.trivia-game-body{flex:1;display:flex;flex-direction:column;gap:12px;padding:14px;overflow-y:auto;min-height:0}.trivia-game-body::-webkit-scrollbar{width:3px}.trivia-game-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px}.trivia-progress-bar-wrap{height:3px;background:rgba(255,255,255,.06);border-radius:3px;overflow:hidden;flex-shrink:0;margin-bottom:2px}.trivia-progress-bar{height:100%;background:linear-gradient(90deg,rgba(99,102,241,.7),rgba(139,92,246,.7));border-radius:3px;transition:width .5s ease}.trivia-question-card{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:14px 15px 12px;display:flex;flex-direction:column;gap:10px;flex-shrink:0}.trivia-q-meta{display:flex;align-items:center;justify-content:space-between;gap:8px}.trivia-q-cat{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(99,102,241,.75);background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.25);padding:2px 8px;border-radius:20px}.trivia-q-num{font-size:10.5px;color:rgba(255,255,255,.28);font-weight:500;flex-shrink:0}.trivia-q-text{font-size:14px;font-weight:600;color:rgba(255,255,255,.92);line-height:1.5}.trivia-hint-row{display:flex;align-items:flex-start;gap:6px}.trivia-hint-label{font-size:10.5px;font-weight:700;color:rgba(251,191,36,.6);flex-shrink:0}.trivia-hint-text{font-size:11px;color:rgba(255,255,255,.38);font-style:italic}.trivia-timer-row{display:flex;align-items:center;gap:6px;padding-top:4px;border-top:1px solid rgba(255,255,255,.05)}.trivia-timer-icon{font-size:11px}.trivia-timer-val{font-size:12px;font-weight:700;color:rgba(255,255,255,.45);font-variant-numeric:tabular-nums;min-width:28px;transition:color .2s}.trivia-timer-val.trivia-timer-urgent{color:#f87171}.trivia-paused-badge{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#fbbf24;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.25);padding:2px 8px;border-radius:20px}.trivia-scoreboard{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:10px;overflow:hidden;flex-shrink:0}.trivia-score-hdr{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.2);padding:9px 12px 6px;border-bottom:1px solid rgba(255,255,255,.05)}.trivia-score-list{max-height:130px;overflow-y:auto}.trivia-score-list::-webkit-scrollbar{width:3px}.trivia-score-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.07);border-radius:2px}.trivia-score-row{display:flex;align-items:center;gap:8px;padding:7px 12px;border-bottom:1px solid rgba(255,255,255,.03);transition:background .1s}.trivia-score-row:last-child{border-bottom:none}.trivia-score-row.first{background:rgba(99,102,241,.06)}.trivia-score-rank{font-size:13px;min-width:22px;flex-shrink:0;text-align:center}.trivia-score-name{font-size:12px;font-weight:500;color:rgba(255,255,255,.7);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trivia-score-pts{font-size:12px;font-weight:700;color:rgba(99,102,241,.85);flex-shrink:0}.trivia-score-empty{font-size:11.5px;color:rgba(255,255,255,.18);padding:12px;text-align:center}.trivia-game-controls{display:flex;align-items:center;gap:6px;padding:10px 14px;border-top:1px solid rgba(255,255,255,.06);flex-shrink:0}.trivia-ctrl-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:7px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:rgba(255,255,255,.5);font-size:11.5px;font-weight:500;cursor:pointer;transition:background .12s,color .12s,border-color .12s;white-space:nowrap;flex-shrink:0}.trivia-ctrl-btn:hover{background:rgba(255,255,255,.09);color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.18)}.trivia-btn-pause:hover,.trivia-btn-resume:hover{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.3);color:#fbbf24}.trivia-btn-skip{margin-left:auto}.trivia-btn-skip:hover{background:rgba(99,102,241,.1);border-color:rgba(99,102,241,.3);color:#a5b4fc}.trivia-btn-end{color:rgba(248,113,113,.6)}.trivia-btn-end:hover{background:rgba(248,113,113,.1);border-color:rgba(248,113,113,.3);color:#f87171}.trivia-announcement-msg{display:block;margin:3px 8px;padding:5px 10px;background:rgba(99,102,241,.08);border:1px solid rgba(99,102,241,.2);border-left:3px solid rgba(99,102,241,.5);border-radius:0 7px 7px 0;font-size:10px;font-weight:700;color:rgba(255,255,255,.7);line-height:1.55;white-space:pre-wrap;word-break:break-word}.trivia-announcement-msg.question{background:rgba(99,102,241,.06);border-color:rgba(99,102,241,.18);border-left-color:rgba(99,102,241,.55);color:rgba(255,255,255,.85)}.trivia-announcement-msg.win{background:rgba(99,214,133,.07);border-color:rgba(99,214,133,.18);border-left-color:rgba(99,214,133,.5);color:rgba(255,255,255,.75)}.trivia-announcement-msg.gameover{background:rgba(251,191,36,.07);border-color:rgba(251,191,36,.2);border-left-color:rgba(251,191,36,.5);color:rgba(255,255,255,.8)}.trivia-announcement-msg.started{background:rgba(99,102,241,.1);border-color:rgba(99,102,241,.25);border-left-color:#6366f1;color:rgba(255,255,255,.85)}.trivia-announcement-msg strong{color:rgba(255,255,255,.95)}.room-toolbar-btn-trivia.trivia-game-on{color:#a5b4fc}.room-toolbar-btn-trivia.trivia-game-on .room-toolbar-icon::after{content:'';display:inline-block;width:6px;height:6px;background:#63d685;border-radius:50%;vertical-align:top;margin-left:-4px}@media (max-width:600px){.room-trivia-popup{min-width:unset;width:calc(100vw - 24px)!important}.trivia-settings-grid{grid-template-columns:1fr}}.audit-panel{margin-top:0!important;padding-top:0!important;border-top:none!important}.audit-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0 10px;border-bottom:1px solid var(--border,#2d3050);margin-bottom:12px}.audit-header-left{display:flex;align-items:center;gap:8px}.audit-header-icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;flex-shrink:0;background:rgba(var(--accent-rgb,124,92,252),.12);color:var(--accent)}.audit-title{font-size:13px;font-weight:700;color:var(--text-primary);margin:0 0 1px;line-height:1.2}.audit-subtitle{font-size:11px;color:var(--text-muted);margin:0}.audit-header-actions{display:flex;gap:5px;flex-shrink:0}.audit-action-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 9px;border-radius:6px;font-size:11px;font-weight:500;border:1px solid var(--border,#2d3050);background:var(--bg-tertiary,#252840);color:var(--text-secondary);cursor:pointer;transition:background .12s,color .12s,border-color .12s;white-space:nowrap}.audit-action-btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-light,#383b5e)}.audit-action-btn--export{color:var(--accent);border-color:rgba(var(--accent-rgb,124,92,252),.3);background:rgba(var(--accent-rgb,124,92,252),.06)}.audit-action-btn--export:hover{background:rgba(var(--accent-rgb,124,92,252),.14);border-color:rgba(var(--accent-rgb,124,92,252),.5)}.audit-action-btn.spinning svg{animation:audit-spin .7s linear infinite}@keyframes audit-spin{to{transform:rotate(360deg)}}.audit-stats-grid{display:flex;margin-bottom:10px;background:var(--bg-tertiary,#252840);border:1px solid var(--border,#2d3050);border-radius:7px;overflow:hidden}.audit-stat-card{display:flex;align-items:center;gap:7px;padding:7px 12px;flex:1;min-width:0;border-right:1px solid var(--border,#2d3050)}.audit-stat-card:last-child{border-right:none}.audit-stat-card-icon{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:5px;flex-shrink:0}.audit-stat-card-icon--blue{background:rgba(52,152,219,.15);color:#3498db}.audit-stat-card-icon--red{background:rgba(231,76,60,.15);color:#e74c3c}.audit-stat-card-icon--amber{background:rgba(243,156,18,.15);color:#f39c12}.audit-stat-card-icon--neutral{background:rgba(var(--accent-rgb,124,92,252),.12);color:var(--accent)}.audit-stat-card-body{display:flex;flex-direction:column;min-width:0}.audit-stat-card-num{font-size:13px;font-weight:700;color:var(--text-primary);line-height:1.1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.audit-stat-card-label{font-size:10px;color:var(--text-muted);margin-top:1px;white-space:nowrap}.audit-toolbar{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-bottom:8px}.audit-search-wrap{position:relative;flex:1;min-width:140px}.audit-search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.audit-search-input{width:100%;height:28px;padding:0 8px 0 28px;box-sizing:border-box;background:var(--bg-input,#15172a);border:1px solid var(--border,#2d3050);border-radius:6px;color:var(--text-primary);font-size:11.5px;outline:0;transition:border-color .15s}.audit-search-input::placeholder{color:var(--text-muted)}.audit-search-input:focus{border-color:var(--accent)}.audit-filter-controls{display:contents}.audit-select{height:28px;padding:0 7px;background:var(--bg-input,#15172a);border:1px solid var(--border,#2d3050);border-radius:6px;color:var(--text-primary);font-size:11.5px;outline:0;cursor:pointer;transition:border-color .15s}.audit-select:focus{border-color:var(--accent)}.audit-date-range{display:flex;align-items:center;gap:4px}.audit-date-input{height:28px;padding:0 6px;width:112px;box-sizing:border-box;background:var(--bg-input,#15172a);border:1px solid var(--border,#2d3050);border-radius:6px;color:var(--text-primary);font-size:11.5px;outline:0;transition:border-color .15s}.audit-date-input:focus{border-color:var(--accent)}.audit-date-input::-webkit-calendar-picker-indicator{filter:invert(.6);cursor:pointer}.audit-date-sep{color:var(--text-muted);font-size:11px}.audit-filter-btn{height:28px;padding:0 10px;border-radius:6px;font-size:11px;font-weight:500;cursor:pointer;border:1px solid transparent;transition:background .12s,border-color .12s;white-space:nowrap}.audit-filter-btn--apply{background:var(--accent);color:#fff;border-color:var(--accent)}.audit-filter-btn--apply:hover{opacity:.88}.audit-filter-btn--clear{background:var(--bg-tertiary,#252840);color:var(--text-secondary);border-color:var(--border,#2d3050)}.audit-filter-btn--clear:hover{background:var(--bg-hover);color:var(--text-primary)}.audit-tabs{display:flex;gap:1px;flex-wrap:wrap;margin-bottom:8px;padding:2px;background:var(--bg-tertiary,#252840);border:1px solid var(--border,#2d3050);border-radius:7px;width:fit-content;max-width:100%}.audit-tab{padding:3px 10px;border-radius:5px;font-size:11px;font-weight:500;border:none;background:0 0;color:var(--text-muted);cursor:pointer;transition:background .12s,color .12s;white-space:nowrap}.audit-tab:hover{background:var(--bg-hover);color:var(--text-primary)}.audit-tab.active{background:var(--bg-active,#333660);color:var(--text-primary);box-shadow:0 1px 2px rgba(0,0,0,.2)}.audit-table-head{display:none}.audit-log-container{max-height:55vh;overflow-y:auto;border:1px solid var(--border,#2d3050);border-radius:7px;background:var(--bg-secondary,#1e2035);scrollbar-width:thin;scrollbar-color:var(--border-light,#383b5e) transparent}.audit-log-container::-webkit-scrollbar{width:4px}.audit-log-container::-webkit-scrollbar-track{background:0 0}.audit-log-container::-webkit-scrollbar-thumb{background:var(--border-light,#383b5e);border-radius:3px}.audit-loading{display:flex;align-items:center;justify-content:center;gap:8px;padding:28px;color:var(--text-muted);font-size:12px}.audit-spinner{display:inline-block;width:13px;height:13px;border:2px solid var(--border-light,#383b5e);border-top-color:var(--accent);border-radius:50%;animation:audit-spin .7s linear infinite}.audit-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:32px 20px;color:var(--text-muted);text-align:center}.audit-empty-state svg{opacity:.25}.audit-empty-state p{font-size:12px;margin:0}.audit-empty-state strong{color:var(--text-secondary)}.audit-row{display:grid;grid-template-columns:3px 20px 1fr auto;align-items:center;gap:0 8px;padding:6px 12px 6px 0;border-bottom:1px solid var(--border,rgba(45,48,80,.5));transition:background .1s;min-height:32px}.audit-row:last-child{border-bottom:none}.audit-row:hover{background:var(--bg-hover,rgba(44,47,74,.5))}.audit-row-sev-bar{width:3px;align-self:stretch;border-radius:0 2px 2px 0;min-height:32px}.audit-row--critical .audit-row-sev-bar{background:#e74c3c}.audit-row--warning .audit-row-sev-bar{background:#f39c12}.audit-row--info .audit-row-sev-bar{background:0 0}.audit-row--critical{background:rgba(231,76,60,.025)}.audit-row--warning{background:rgba(243,156,18,.015)}.audit-row-icon{font-size:13px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;line-height:1}.audit-row-main{display:flex;flex-direction:row;align-items:baseline;flex-wrap:wrap;gap:2px 5px;min-width:0;overflow:hidden}.audit-row-top{display:contents}.audit-row-who{display:contents}.audit-row-detail{display:contents}.audit-row-action{font-size:11.5px;font-weight:600;color:var(--text-primary);text-transform:capitalize;white-space:nowrap}.audit-sev-pill{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:1px 5px;border-radius:20px;white-space:nowrap}.audit-sev-pill--critical{background:rgba(231,76,60,.18);color:#e74c3c}.audit-sev-pill--warning{background:rgba(243,156,18,.18);color:#f0a500}.audit-sev-pill--info{background:rgba(52,152,219,.14);color:#5ba8d4}.audit-cat-pill{font-size:9px;color:var(--text-muted);background:rgba(255,255,255,.05);padding:1px 5px;border-radius:20px;text-transform:capitalize;white-space:nowrap}.audit-actor{font-size:11.5px;font-weight:600;color:var(--accent);white-space:nowrap}.audit-arrow{color:var(--text-muted);font-size:10px}.audit-target{font-size:11.5px;font-weight:600;color:var(--text-primary);white-space:nowrap}.audit-target--channel{color:#82aaff}.audit-muted{color:var(--text-muted);font-style:italic;font-size:11px;white-space:nowrap}.audit-meta-list{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:2px 4px}.audit-meta-sep{color:var(--border-light,#4a4e6e);font-size:10px;margin:0 1px}.audit-meta-key{color:var(--text-muted);font-size:10px;text-transform:uppercase;letter-spacing:.04em}.audit-meta-val{color:var(--text-secondary);font-size:11px}.audit-meta-quote::before{content:'"'}.audit-meta-quote::after{content:'"'}.audit-meta-tag{background:rgba(255,255,255,.05);color:var(--text-muted);padding:1px 5px;border-radius:3px;font-size:10px;white-space:nowrap}.audit-row-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0}.audit-row-time{font-size:10.5px;color:var(--text-muted);white-space:nowrap;cursor:default}.audit-ip{font-size:9.5px;font-family:'Courier New',monospace;color:var(--text-muted);background:rgba(255,255,255,.04);padding:1px 5px;border-radius:3px;white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis}.audit-pagination{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px;padding:5px 10px;background:var(--bg-tertiary,#252840);border:1px solid var(--border,#2d3050);border-radius:6px}.audit-page-btn{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:5px;font-size:11px;font-weight:500;border:1px solid var(--border,#2d3050);background:var(--bg-secondary,#1e2035);color:var(--text-secondary);cursor:pointer;transition:background .12s,color .12s}.audit-page-btn:hover:not(:disabled){background:var(--bg-hover);color:var(--text-primary)}.audit-page-btn:disabled{opacity:.4;cursor:not-allowed}.audit-page-info{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text-secondary)}.audit-page-info strong{color:var(--text-primary)}.audit-total-count{color:var(--text-muted);font-size:10px;padding:1px 6px;background:rgba(255,255,255,.05);border-radius:20px}@media (max-width:680px){.audit-stats-grid{flex-direction:column}.audit-stat-card{border-right:none;border-bottom:1px solid var(--border,#2d3050)}.audit-stat-card:last-child{border-bottom:none}.audit-toolbar{flex-wrap:wrap}.audit-search-wrap{flex:1 1 100%}.audit-filter-controls{display:flex;flex-wrap:wrap;gap:5px;flex:1 1 100%}.audit-row{grid-template-columns:3px 18px 1fr auto}.audit-header{flex-direction:column;align-items:flex-start}.audit-tabs{width:100%}}#right-sidebar{display:none!important;width:0!important;min-width:0!important;margin:0!important;padding:0!important;border:none!important;overflow:hidden!important;pointer-events:none!important}[data-theme=daylight] .room-float-meta-divider{background:var(--border)}@media (max-width:768px){[data-theme=daylight] .room-float-voice-tab{border:1px solid var(--border);border-right:none;box-shadow:-2px 0 8px rgba(0,0,0,.1)}}[data-theme=daylight] .room-karaoke-popup{border:1px solid var(--border);box-shadow:0 16px 48px rgba(0,0,0,.13),0 6px 18px rgba(0,0,0,.08)}[data-theme=daylight] .room-karaoke-header{background:var(--bg-secondary);border-bottom:1px solid var(--border)}[data-theme=daylight] .room-karaoke-title{color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-close{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-close:hover{background:rgba(0,0,0,.06);color:var(--text-primary)}[data-theme=daylight] .room-karaoke-input{background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary)}[data-theme=daylight] .room-karaoke-input::placeholder{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-input:focus{background:var(--bg-input);border-color:var(--accent)}[data-theme=daylight] .room-karaoke-search-icon-btn{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-search-icon-btn:hover{color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-empty p,[data-theme=daylight] .room-karaoke-no-results p{color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-empty span,[data-theme=daylight] .room-karaoke-no-results span{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-loading{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-results::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .room-karaoke-item:hover{background:rgba(0,0,0,.04)}[data-theme=daylight] .room-karaoke-thumb{background:var(--bg-tertiary)}[data-theme=daylight] .room-karaoke-thumb-placeholder{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-item-title{color:var(--text-primary)}[data-theme=daylight] .room-karaoke-item-channel{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-footer{border-top:1px solid var(--border)}[data-theme=daylight] .room-karaoke-more-btn{border:1px solid var(--border);color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-more-btn:hover{background:rgba(0,0,0,.04);border-color:var(--border-light);color:var(--text-primary)}[data-theme=daylight] .room-karaoke-player-bar{background:var(--bg-secondary);border-top:1px solid var(--border)}[data-theme=daylight] .room-karaoke-now-playing{color:var(--text-primary)}[data-theme=daylight] .room-karaoke-next-btn{border-color:var(--border);color:var(--text-secondary);background:var(--bg-tertiary)}[data-theme=daylight] .room-karaoke-next-btn:hover{background:rgba(0,0,0,.04);border-color:var(--accent);color:var(--accent)}[data-theme=daylight] .room-karaoke-tabs{background:var(--bg-secondary);border-bottom:1px solid var(--border)}[data-theme=daylight] .room-karaoke-tab{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-tab:hover{color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-tab.active{color:var(--text-primary)}[data-theme=daylight] .room-karaoke-queue-item:hover{background:rgba(0,0,0,.03)}[data-theme=daylight] .room-karaoke-queue-item--current{background:rgba(0,0,0,.03)}[data-theme=daylight] .room-karaoke-queue-pos{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-queue-thumb{background:var(--bg-tertiary)}[data-theme=daylight] .room-karaoke-queue-remove{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-queue-now-label{color:var(--accent);opacity:.7}[data-theme=daylight] .room-karaoke-queue-section-label{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-queue-empty p{color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-queue-empty span{color:var(--text-muted)}[data-theme=daylight] .room-karaoke-queue-btn{background:var(--bg-tertiary);border-color:var(--border);color:var(--text-secondary)}[data-theme=daylight] .room-karaoke-resize-handle{background:linear-gradient(135deg,transparent 55%,rgba(0,0,0,.2) 55%,rgba(0,0,0,.2) 62%,transparent 62%),linear-gradient(135deg,transparent 67%,rgba(0,0,0,.2) 67%,rgba(0,0,0,.2) 74%,transparent 74%)}[data-theme=daylight] .room-ytmusic-track-card{background:var(--bg-secondary)}[data-theme=daylight] .room-ytmusic-track-art{background:var(--bg-tertiary);box-shadow:0 6px 28px rgba(0,0,0,.13)}[data-theme=daylight] .room-ytmusic-track-title{color:var(--text-primary)}[data-theme=daylight] .room-ytmusic-track-artist{color:var(--text-muted)}[data-theme=daylight] .room-ytmusic-popup .ntt-genre-chips{border-bottom:1px solid var(--border)}[data-theme=daylight] .ytmusic-autoplay-bar{border-top:1px solid var(--border)}[data-theme=daylight] .ytmusic-autoplay-label{color:var(--text-secondary)}[data-theme=daylight] .room-ytmusic-search-row{border-bottom:1px solid var(--border)}[data-theme=daylight] .room-ytmusic-queue-btn{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.1);color:var(--text-secondary)}[data-theme=daylight] .room-ytmusic-queue-btn:hover{background:rgba(255,78,69,.1);border-color:rgba(255,78,69,.28);color:#cc3030}[data-theme=daylight] .room-ytmusic-back-btn{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.1);color:var(--text-secondary)}[data-theme=daylight] .room-ytmusic-back-btn:hover{background:rgba(0,0,0,.08);color:var(--text-primary)}[data-theme=daylight] .ntt-status-badge{background:var(--bg-tertiary);color:var(--text-muted)}[data-theme=daylight] .ntt-search-bar{border-bottom:1px solid var(--border)}[data-theme=daylight] .ntt-ready-content::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .ntt-song-preview{background:var(--bg-secondary);border:1px solid var(--border)}[data-theme=daylight] .ntt-preview-art{background:var(--bg-tertiary);color:var(--text-muted)}[data-theme=daylight] .ntt-preview-title{color:var(--text-primary)}[data-theme=daylight] .ntt-preview-artist{color:var(--text-muted)}[data-theme=daylight] .ntt-settings-block{background:var(--bg-secondary);border:1px solid var(--border)}[data-theme=daylight] .ntt-settings-block-title{color:var(--text-muted)}[data-theme=daylight] .ntt-setting-row{color:var(--text-secondary)}[data-theme=daylight] .ntt-number-input{background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary)}[data-theme=daylight] .ntt-setting-hint{color:var(--text-muted)}[data-theme=daylight] .ntt-ready-actions{border-top:1px solid var(--border)}[data-theme=daylight] .ntt-btn-back{background:rgba(0,0,0,.04);border-color:var(--border);color:var(--text-secondary)}[data-theme=daylight] .ntt-btn-back:hover{background:rgba(0,0,0,.08);border-color:var(--border-light);color:var(--text-primary)}[data-theme=daylight] .ntt-current-song{background:var(--bg-secondary);border-bottom:1px solid var(--border)}[data-theme=daylight] .ntt-current-art{background:var(--bg-tertiary);color:var(--text-muted)}[data-theme=daylight] .ntt-current-title{color:var(--text-primary)}[data-theme=daylight] .ntt-current-artist{color:var(--text-muted)}[data-theme=daylight] .ntt-scoreboard::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .ntt-scoreboard-empty{color:var(--text-muted)}[data-theme=daylight] .ntt-scoreboard-hdr{color:var(--text-muted);border-bottom:1px solid var(--border)}[data-theme=daylight] .ntt-score-rank{color:var(--text-muted)}[data-theme=daylight] .ntt-score-name{color:var(--text-secondary)}[data-theme=daylight] .ntt-pts-label{color:var(--text-muted)}[data-theme=daylight] .ntt-controls{border-top:1px solid var(--border)}[data-theme=daylight] .ntt-ctrl-btn{background:rgba(0,0,0,.04);border:1px solid var(--border);color:var(--text-secondary)}[data-theme=daylight] .ntt-ctrl-btn:hover{background:rgba(0,0,0,.08);border-color:var(--border-light);color:var(--text-primary)}[data-theme=daylight] .ntt-settings-bar{border-top:1px solid var(--border)}[data-theme=daylight] .ntt-settings-bar label{color:var(--text-secondary)}[data-theme=daylight] .ntt-settings-bar-sep{color:var(--border)}[data-theme=daylight] .ntt-genre-chip{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary)}[data-theme=daylight] .ntt-genre-chip:hover{background:var(--bg-hover);border-color:var(--border-light);color:var(--text-primary)}[data-theme=daylight] .ntt-pregame-queue,[data-theme=daylight] .ntt-queue-section{border-top:1px solid var(--border);background:var(--bg-secondary)}[data-theme=daylight] .ntt-queue-hdr-label{color:var(--text-muted)}[data-theme=daylight] .ntt-queue-clear-btn{color:var(--text-muted)}[data-theme=daylight] .ntt-queue-list::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .ntt-queue-item:hover{background:rgba(0,0,0,.04)}[data-theme=daylight] .ntt-queue-item-thumb{background:var(--bg-tertiary)}[data-theme=daylight] .ntt-queue-item-title{color:var(--text-secondary)}[data-theme=daylight] .ntt-queue-remove{color:var(--text-muted)}[data-theme=daylight] .ntt-pregame-start-area{border-top:1px solid var(--border)}[data-theme=daylight] .ntt-queue-setting{color:var(--text-secondary)}[data-theme=daylight] .ntt-queue-add-btn{background:rgba(0,0,0,.04);border:1px solid var(--border);color:var(--text-secondary)}[data-theme=daylight] .ntt-announcement-msg{color:var(--text-secondary)}[data-theme=daylight] .ntt-announcement-msg.started{background:var(--bg-secondary);border-color:var(--border);color:var(--text-muted)}[data-theme=daylight] .ntt-announcement-msg.ended{background:var(--bg-secondary);border-color:var(--border);color:var(--text-muted)}[data-theme=daylight] .ntt-announcement-msg.hint{background:rgba(66,153,225,.06);border-color:rgba(66,153,225,.2)}[data-theme=daylight] .ntt-hint-label{color:rgba(49,130,206,.75)}[data-theme=daylight] .ntt-hint-text{color:var(--text-primary)}[data-theme=daylight] .ntt-active-notice-text{color:var(--text-secondary)}[data-theme=daylight] .ntt-active-notice-sub{color:var(--text-muted)}[data-theme=daylight] .ntt-active-notice-icon{color:var(--text-muted)}[data-theme=daylight] .trivia-status-badge{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-muted)}[data-theme=daylight] .trivia-game-body::-webkit-scrollbar-thumb,[data-theme=daylight] .trivia-score-list::-webkit-scrollbar-thumb,[data-theme=daylight] .trivia-setup-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}[data-theme=daylight] .trivia-setup-section-label{color:var(--text-muted)}[data-theme=daylight] .trivia-cat-chip{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary)}[data-theme=daylight] .trivia-cat-chip:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-light)}[data-theme=daylight] .trivia-setting-label{color:var(--text-secondary)}[data-theme=daylight] .trivia-setting-hint,[data-theme=daylight] .trivia-setting-hint-inline{color:var(--text-muted)}[data-theme=daylight] .trivia-number-input{background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary)}[data-theme=daylight] .trivia-progress-bar-wrap{background:var(--bg-tertiary)}[data-theme=daylight] .trivia-question-card{background:var(--bg-secondary);border:1px solid var(--border)}[data-theme=daylight] .trivia-q-num{color:var(--text-muted)}[data-theme=daylight] .trivia-q-text{color:var(--text-primary)}[data-theme=daylight] .trivia-hint-text{color:var(--text-secondary)}[data-theme=daylight] .trivia-timer-row{border-top:1px solid var(--border)}[data-theme=daylight] .trivia-timer-val{color:var(--text-secondary)}[data-theme=daylight] .trivia-scoreboard{background:var(--bg-secondary);border:1px solid var(--border)}[data-theme=daylight] .trivia-score-hdr{color:var(--text-muted);border-bottom:1px solid var(--border)}[data-theme=daylight] .trivia-score-row{border-bottom:1px solid var(--border-light)}[data-theme=daylight] .trivia-score-name{color:var(--text-secondary)}[data-theme=daylight] .trivia-score-empty{color:var(--text-muted)}[data-theme=daylight] .trivia-game-controls{border-top:1px solid var(--border)}[data-theme=daylight] .trivia-ctrl-btn{border:1px solid var(--border);background:rgba(0,0,0,.04);color:var(--text-secondary)}[data-theme=daylight] .trivia-ctrl-btn:hover{background:rgba(0,0,0,.08);color:var(--text-primary);border-color:var(--border-light)}[data-theme=daylight] .trivia-announcement-msg{color:var(--text-secondary)}[data-theme=daylight] .trivia-announcement-msg.question{color:var(--text-primary)}[data-theme=daylight] .trivia-announcement-msg.gameover,[data-theme=daylight] .trivia-announcement-msg.started,[data-theme=daylight] .trivia-announcement-msg.win{color:var(--text-secondary)}[data-theme=daylight] .trivia-announcement-msg strong{color:var(--text-primary)}[data-theme=daylight] .trivia-status-badge.active{color:#15803d}[data-theme=daylight] .trivia-status-badge.paused{color:#92400e}[data-theme=daylight] .trivia-paused-badge{color:#92400e}[data-theme=daylight] .trivia-cat-chip.active{color:#3730a3}[data-theme=daylight] .trivia-btn-start{color:#3730a3}[data-theme=daylight] .trivia-btn-start:hover{color:#312e81}[data-theme=daylight] .trivia-hint-label{color:#92400e}[data-theme=daylight] .trivia-btn-pause:hover{color:#92400e}[data-theme=daylight] .trivia-btn-resume:hover{color:#92400e}[data-theme=daylight] .trivia-btn-skip:hover{color:#3730a3}[data-theme=daylight] .trivia-btn-end{color:#b91c1c}[data-theme=daylight] .trivia-btn-end:hover{color:#991b1b}[data-theme=daylight] .trivia-q-cat{color:#3730a3}[data-theme=daylight] .trivia-score-pts{color:#3730a3}[data-theme=daylight] .room-toolbar-btn-trivia.trivia-game-on{color:#3730a3}.room-toolbar-btn-invite{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.07);color:var(--text-muted)}.room-toolbar-btn-invite:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.14);color:var(--text-primary)}.room-invite-popup{position:fixed;background:var(--bg-card,#1e1e2e);border:1px solid var(--border-light,rgba(255,255,255,.08));border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.2);z-index:10200001;min-width:240px;max-width:300px;overflow:hidden;animation:roomInvitePopupIn .12s ease}@keyframes roomInvitePopupIn{from{opacity:0;transform:translateY(6px) scale(.97)}to{opacity:1;transform:none}}.room-invite-popup-header{padding:9px 13px 7px;font-size:10.5px;font-weight:700;color:var(--text-muted,#888);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid rgba(255,255,255,.06)}.room-invite-popup-empty{padding:18px 14px;font-size:12.5px;color:var(--text-muted,#888);text-align:center}.room-invite-popup-list{max-height:280px;overflow-y:auto;padding:4px 0}.room-invite-friend-item{display:flex;align-items:center;gap:9px;padding:6px 12px;transition:background .1s}.room-invite-friend-item:hover{background:rgba(255,255,255,.05)}.room-invite-avatar-wrap{position:relative;flex-shrink:0}.room-invite-friend-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#fff;background:var(--accent,#3d9e6e);flex-shrink:0}img.room-invite-friend-avatar{display:block}.room-invite-status-dot{position:absolute;bottom:-1px;right:-1px;width:8px;height:8px;border-radius:50%;border:2px solid var(--bg-card,#1e1e2e);background:#666}.room-invite-status-dot.online{background:#57f287}.room-invite-status-dot.away{background:#faa61a}.room-invite-status-dot.dnd{background:#ed4245}.room-invite-friend-name{flex:1;font-size:12.5px;color:var(--text-primary,#e8e8f0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-invite-send-btn{background:rgba(88,130,255,.1);border:1px solid rgba(88,130,255,.25);color:rgba(140,175,255,.9);border-radius:5px;padding:3px 10px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .12s,opacity .12s;flex-shrink:0}.room-invite-send-btn:hover:not(:disabled){background:rgba(88,130,255,.22);border-color:rgba(88,130,255,.42);color:#c0d8ff}.room-invite-send-btn.sent,.room-invite-send-btn:disabled{opacity:.45;cursor:default}.room-invite-notif-header{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:14px}.room-invite-notif-icon{font-size:30px;line-height:1}.room-invite-notif-title{font-size:17px;font-weight:700;color:var(--text-primary,#e8e8f0);margin:0}.room-invite-notif-desc{font-size:14px;color:var(--text-muted,#999);margin:0 0 12px;line-height:1.5}.room-invite-notif-room{display:inline-flex;align-items:center;gap:6px;background:rgba(88,130,255,.08);border:1px solid rgba(88,130,255,.22);border-radius:8px;padding:8px 18px}.room-invite-notif-room-hash{font-size:15px;color:rgba(140,175,255,.85);font-weight:700}.room-invite-notif-room-name{font-size:15px;font-weight:600;color:var(--text-primary,#e8e8f0)}.badge-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px;margin-bottom:16px}.badge-picker-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 10px 12px;background:var(--bg-tertiary);border:2px solid var(--border);border-radius:12px;cursor:pointer;position:relative;transition:border-color .18s ease,background .18s ease,transform .15s ease,box-shadow .18s ease;user-select:none}.badge-picker-card:hover{border-color:var(--text-secondary);transform:translateY(-2px)}.badge-picker-card.selected{border-color:var(--accent);background:var(--bg-active);box-shadow:0 4px 14px var(--accent-glow,rgba(88,130,255,.18))}.badge-picker-icon{font-size:22px;line-height:1}.badge-picker-name{font-size:11px;font-weight:600;color:var(--text-secondary);text-align:center;line-height:1.2}.badge-picker-card.selected .badge-picker-name{color:var(--accent)}.badge-picker-check{position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;background:var(--border);display:flex;align-items:center;justify-content:center;color:transparent;transition:background .18s ease,color .18s ease}.badge-picker-card.selected .badge-picker-check{background:var(--accent);color:#fff}@keyframes badgePickerShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}.badge-picker-card--shake{animation:badgePickerShake .38s ease;border-color:var(--danger,#e74c3c)!important}.badge-picker-actions{display:flex;flex-direction:column;gap:6px}.badge-hint-warn{color:var(--warning,#f39c12)!important}.badge-picker-header{display:flex;align-items:center;justify-content:flex-end;margin-bottom:10px}.badge-picker-count{font-size:11px;font-weight:600;color:var(--text-secondary);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:20px;padding:3px 10px;letter-spacing:.02em}.svc-my-wallet{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(135deg,rgba(255,215,0,.08) 0,rgba(255,215,0,.03) 100%);border:1px solid rgba(255,215,0,.2);border-radius:12px;padding:13px 16px;margin-bottom:22px}.svc-my-wallet-info{display:flex;align-items:center;gap:10px}.svc-my-wallet-ic{font-size:1.5rem;line-height:1}.svc-my-wallet-text{display:flex;flex-direction:column;gap:1px}.svc-my-wallet-bal{font-size:1.1rem;font-weight:800;color:gold;line-height:1.2}.svc-my-wallet-lbl{font-size:.68rem;color:rgba(255,215,0,.55);text-transform:uppercase;letter-spacing:.5px}.svc-my-topup-btn{flex-shrink:0;background:rgba(255,215,0,.1)!important;border:1px solid rgba(255,215,0,.35)!important;color:gold!important;border-radius:8px!important;font-size:.78rem!important;font-weight:600!important;padding:6px 14px!important;cursor:pointer;transition:background .15s,border-color .15s}.svc-my-topup-btn:hover{background:rgba(255,215,0,.2)!important;border-color:rgba(255,215,0,.6)!important}.svc-my-section-lbl{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted,#888);margin-bottom:10px;display:flex;align-items:center;gap:6px}.svc-my-badge-count-hint{font-size:.68rem;font-weight:500;text-transform:none;letter-spacing:0;color:var(--text-muted,#666);opacity:.8}.svc-my-plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}.svc-my-plan-card{background:var(--bg-secondary,#1e1e2e);border:1px solid var(--border-light,rgba(255,255,255,.08));border-radius:11px;padding:11px 13px;display:flex;flex-direction:column;gap:5px;transition:border-color .2s,box-shadow .2s;min-height:70px}.svc-my-plan-card--on{border-color:color-mix(in srgb,var(--pc,#00bcd4) 45%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--pc,#00bcd4) 16%,transparent),inset 0 0 16px color-mix(in srgb,var(--pc,#00bcd4) 5%,transparent)}.svc-my-plan-row{display:flex;align-items:center;gap:6px}.svc-my-plan-icon{font-size:.88rem;flex-shrink:0;text-shadow:0 1px 2px rgba(0,0,0,.5)}.svc-my-plan-lbl{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary,#aaa);flex:1}.svc-my-plan-chip{font-size:.6rem;font-weight:600;padding:2px 6px;border-radius:20px;background:var(--bg-tertiary);color:var(--text-muted,#666);border:1px solid rgba(255,255,255,.07);white-space:nowrap;flex-shrink:0}.svc-my-plan-chip--on{background:rgba(67,181,129,.12);color:#43b581;border-color:rgba(67,181,129,.28)}.svc-my-plan-tier{font-size:.9rem;font-weight:800;line-height:1.2}.svc-my-plan-exp{font-size:.65rem;color:var(--text-muted,#666)}.svc-my-plan-empty{font-size:.75rem;color:var(--text-muted,#555);opacity:.5;margin-top:2px}.svc-my-badge-desc{font-size:.78rem;color:var(--text-muted,#888);margin:0 0 12px;line-height:1.4}.svc-my-badge-picker{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.svc-my-badge-opt{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--bg-secondary,#1e1e2e);border:1px solid var(--border-light,rgba(255,255,255,.08));border-radius:10px;padding:10px 12px 8px;cursor:pointer;min-width:66px;transition:border-color .15s,background .15s,transform .12s;user-select:none}.svc-my-badge-opt:hover{border-color:rgba(255,255,255,.2);background:var(--bg-hover,rgba(255,255,255,.04));transform:translateY(-1px)}.svc-my-badge-opt--on{border-color:#5865f2;background:rgba(88,101,242,.12);box-shadow:0 0 0 1px rgba(88,101,242,.3)}.svc-my-badge-em{font-size:1.35rem;line-height:1;display:block}.svc-my-badge-nm{font-size:.6rem;font-weight:600;color:var(--text-secondary,#aaa);text-align:center;line-height:1.2;max-width:60px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.svc-my-badge-opt--on .svc-my-badge-nm{color:#8ea1e1}.svc-my-badge-chk{position:absolute;top:4px;right:5px;font-size:.6rem;font-weight:800;color:#5865f2;opacity:0;transition:opacity .12s}.svc-my-badge-opt--on .svc-my-badge-chk{opacity:1}@keyframes svc-my-badge-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-4px)}50%{transform:translateX(4px)}80%{transform:translateX(-3px)}}.svc-my-badge-opt--shake{animation:svc-my-badge-shake .38s ease}.svc-my-badge-actions{display:flex;align-items:center;gap:12px}.svc-my-badge-save-btn{background:rgba(88,101,242,.15);border:1px solid rgba(88,101,242,.4);color:#8ea1e1;border-radius:8px;font-size:.8rem;font-weight:700;padding:7px 18px;cursor:pointer;transition:background .15s,border-color .15s,transform .12s}.svc-my-badge-save-btn:hover{background:rgba(88,101,242,.28);border-color:rgba(88,101,242,.65);color:#c5ccf5;transform:translateY(-1px)}.svc-my-badge-status{font-size:.75rem;color:#43b581}.svc-my-no-badges{font-size:.8rem;color:var(--text-muted,#666);font-style:italic;padding:8px 0 4px}@media (max-width:500px){.svc-my-plans-grid{grid-template-columns:1fr 1fr}}.rank-badge{display:inline-flex;align-items:center;gap:2px;font-size:9.5px;font-weight:800;letter-spacing:.3px;padding:2px 5px 2px 4px;border-radius:10px;background:linear-gradient(135deg,var(--rb-bg,#6366f1),var(--rb-end,#4f46e5));color:#fff;vertical-align:middle;box-shadow:0 0 5px var(--rb-glow,#6366f1) 55;white-space:nowrap;flex-shrink:0;line-height:1;position:relative;overflow:hidden;cursor:default;user-select:none}.rank-badge::before{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:rgba(255,255,255,.25);transform:skewX(-20deg);pointer-events:none}.rank-badge__num{font-size:8.5px;opacity:.9}.rank-badge--pulse{animation:rb-pulse 2.8s ease-in-out infinite}@keyframes rb-pulse{0%,100%{box-shadow:0 0 5px var(--rb-glow,#6366f1) 55}50%{box-shadow:0 0 12px 3px var(--rb-glow,#6366f1) 99}}.rank-badge--receiver{margin-left:2px}.lt-badge-inline{display:inline-flex;align-items:center;flex-direction:column;align-items:center;gap:1px;padding:2px 5px;height:auto;line-height:1;border-radius:6px;background:linear-gradient(135deg,var(--lt-bg,#6366f1),var(--lt-end,#4f46e5));box-shadow:0 0 6px var(--lt-glow,rgba(99,102,241,.45)),inset 0 1px 0 rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.12);vertical-align:middle;white-space:nowrap;flex-shrink:0;margin-left:3px;position:relative;overflow:hidden;cursor:default;user-select:none}.lt-badge-inline::before{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:rgba(255,255,255,.22);transform:skewX(-18deg);pointer-events:none}.lt-inline-stars{display:inline-flex;justify-content:center;gap:1px;line-height:1}.lt-inline-star{font-size:9px;color:rgba(255,255,255,.25);line-height:1}.lt-inline-star--on{color:rgba(255,255,255,.95);text-shadow:0 0 4px rgba(255,255,255,.7)}.lt-inline-name{font-size:9px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3);line-height:1}.lt-inline-level{font-size:8px;font-weight:700;color:rgba(255,255,255,.8);line-height:1}.lt-badge-inline--pulse{animation:lt-inline-pulse 2.6s ease-in-out infinite}@keyframes lt-inline-pulse{0%,100%{box-shadow:0 0 6px var(--lt-glow,rgba(99,102,241,.45))}50%{box-shadow:0 0 14px 3px var(--lt-glow,rgba(99,102,241,.45))}}.sidebar-bottom-btn--leaderboard{position:relative}.sidebar-bottom-btn--leaderboard::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(245,158,11,0);animation:lb-btn-pulse 3s ease-in-out infinite}@keyframes lb-btn-pulse{0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,0)}50%{box-shadow:0 0 8px 2px rgba(245,158,11,.45)}}.lb-overlay{position:fixed;inset:0;z-index:10300000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.75);animation:lb-fade-in .2s ease}@keyframes lb-fade-in{from{opacity:0}to{opacity:1}}.lb-panel{position:relative;width:min(820px,96vw);max-height:88vh;border-radius:20px;background:radial-gradient(ellipse at 50% 0,var(--accent-glow) 0,var(--bg-card) 45%,var(--bg-card) 100%);border:1px solid var(--border-light);box-shadow:0 24px 60px rgba(0,0,0,.22),0 4px 16px rgba(0,0,0,.1);overflow:hidden;display:flex;flex-direction:column;animation:lb-slide-up .28s cubic-bezier(.34,1.56,.64,1)}@keyframes lb-slide-up{from{transform:translateY(32px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.lb-header{position:relative;z-index:1;display:flex;align-items:flex-start;gap:12px;padding:22px 24px 14px;border-bottom:1px solid var(--border-light)}.lb-title-icon{font-size:32px;line-height:1;flex-shrink:0;animation:lb-trophy-glow 2.2s ease-in-out infinite}@keyframes lb-trophy-glow{0%,100%{filter:drop-shadow(0 0 6px rgba(245, 158, 11, .6))}50%{filter:drop-shadow(0 0 20px rgba(245, 158, 11, 1))}}.lb-title-wrap{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.lb-title{margin:0;font-size:1.3rem;font-weight:800;color:var(--text-primary);background:linear-gradient(90deg,#f59e0b 0,#ec4899 35%,#8b5cf6 65%,#06b6d4 100%);background-size:250% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:lb-shimmer 5s linear infinite;letter-spacing:.4px}@keyframes lb-shimmer{0%{background-position:0}100%{background-position:250%}}.lb-legend{display:flex;flex-wrap:wrap;gap:6px 10px}.lb-legend-item{display:inline-flex;align-items:center;gap:4px;font-size:.68rem;color:var(--text-muted);cursor:default}.lb-legend-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.lb-legend-name{font-weight:600}.lb-close{margin-left:auto;flex-shrink:0;background:0 0;border:none;color:var(--text-muted);font-size:22px;line-height:1;cursor:pointer;padding:4px 8px;border-radius:8px;transition:color .15s,background .15s}.lb-close:hover{color:var(--text-primary);background:var(--bg-hover)}.lb-body{position:relative;z-index:1;display:flex;gap:0;padding:18px 22px 18px;overflow-y:auto;flex:1;min-height:0}.lb-col{display:flex;flex-direction:column;gap:6px;min-width:0}.lb-col{flex:1}.lb-col-header{display:flex;align-items:center;gap:8px;font-size:.73rem;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;padding-bottom:10px;border-bottom:1px solid var(--border-light);margin-bottom:2px}.lb-col-header--patron{color:#f59e0b}.lb-list{display:flex;flex-direction:column;gap:5px}.lb-row{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:12px;background:var(--bg-secondary);border:1px solid var(--border-light);transition:background .15s,border-color .15s;animation:lb-row-in .32s ease both}.lb-row:hover{background:var(--bg-hover);border-color:var(--border)}.lb-row--top3{background:linear-gradient(100deg,color-mix(in srgb,var(--lb-color,#6366f1) 16%,var(--bg-card)),var(--bg-secondary));border-color:color-mix(in srgb,var(--lb-color,#6366f1) 45%,var(--border-light));box-shadow:0 2px 10px color-mix(in srgb,var(--lb-glow,#6366f1) 30%,transparent)}.lb-row:first-child{animation-delay:.04s}.lb-row:nth-child(2){animation-delay:.08s}.lb-row:nth-child(3){animation-delay:.12s}.lb-row:nth-child(4){animation-delay:.16s}.lb-row:nth-child(5){animation-delay:.2s}.lb-row:nth-child(6){animation-delay:.24s}.lb-row:nth-child(7){animation-delay:.28s}.lb-row:nth-child(8){animation-delay:.32s}.lb-row:nth-child(9){animation-delay:.36s}.lb-row:nth-child(10){animation-delay:.4s}@keyframes lb-row-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.lb-medal{font-size:1.05rem;min-width:24px;text-align:center;flex-shrink:0;line-height:1}.lb-rank-num{font-size:.72rem;font-weight:700;color:var(--text-muted)}.lb-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#fff;flex-shrink:0;text-shadow:0 1px 2px rgba(0,0,0,.25);box-shadow:0 0 0 2px rgba(0,0,0,.08),0 2px 6px rgba(0,0,0,.12);overflow:hidden}.lb-avatar--img{background:0 0!important;text-shadow:none;padding:0}.lb-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;overflow:hidden}.lb-name{font-size:.84rem;font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-tc-small{font-size:.7rem;color:var(--text-secondary);font-variant-numeric:tabular-nums;white-space:nowrap}.lb-tc-breakdown{font-size:.63rem;color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lt-badge{flex-shrink:0;display:flex;flex-direction:column;gap:4px;padding:5px 9px 6px;border-radius:10px;background:linear-gradient(135deg,var(--lt-bg,#6366f1),var(--lt-end,#4f46e5));box-shadow:0 2px 8px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.25);min-width:86px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.25)}.lt-badge::before{content:'';position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg);animation:lt-shine 3.5s ease-in-out infinite}@keyframes lt-shine{0%,100%,60%{left:-70%}40%{left:130%}}.lt-badge-top{display:flex;align-items:center;gap:4px}.lt-stars{display:flex;gap:1px;line-height:1}.lt-star{font-size:8px;color:rgba(255,255,255,.28);transition:color .2s}.lt-star--on{color:rgba(255,255,255,.95);text-shadow:0 0 5px rgba(255,255,255,.8)}.lt-name{font-size:.7rem;font-weight:800;color:#fff;letter-spacing:.6px;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.35);line-height:1}.lt-badge-bottom{display:flex;align-items:center;gap:5px}.lt-bar-track{flex:1;height:3px;border-radius:3px;background:rgba(0,0,0,.3);overflow:hidden}.lt-bar-fill{height:100%;border-radius:3px;background:rgba(255,255,255,.75);transition:width .6s cubic-bezier(.4, 0, .2, 1)}.lt-level{font-size:.65rem;font-weight:700;color:rgba(255,255,255,.88);white-space:nowrap;letter-spacing:.2px}.lb-empty{font-size:.82rem;color:var(--text-muted);text-align:center;padding:28px 0;font-style:italic}.lb-footer{position:relative;z-index:1;text-align:center;font-size:.7rem;color:var(--text-muted);padding:10px 24px 15px;border-top:1px solid var(--border-light)}@media (max-width:580px){.lb-body{flex-direction:column;padding:12px 14px}.lb-col{flex:unset}.lt-badge{min-width:74px}}.pp-gift-section{padding:0 0 6px}.pp-tier-card{background:linear-gradient(145deg,var(--pt-bg),var(--pt-end));border-radius:14px;padding:14px 16px 12px;margin-bottom:8px;box-shadow:0 4px 20px var(--pt-glow),0 1px 0 rgba(255,255,255,.08) inset;border:1px solid rgba(255,255,255,.12);position:relative;overflow:hidden}.pp-tier-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);pointer-events:none}.pp-tier-card::after{content:'';position:absolute;bottom:-30px;right:-20px;width:90px;height:90px;border-radius:50%;background:rgba(255,255,255,.05);pointer-events:none}.pp-tier-header{display:flex;align-items:center;gap:6px;margin-bottom:12px}.pp-tier-icon{font-size:13px;line-height:1}.pp-tier-label{flex:1;font-size:9px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;color:rgba(255,255,255,.65)}.pp-tier-rank-pill{background:rgba(0,0,0,.28);color:#fff;font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px;border:1px solid rgba(255,255,255,.18);letter-spacing:.5px}.pp-tier-body{text-align:center;margin-bottom:12px}.pp-tier-stars{font-size:20px;letter-spacing:3px;line-height:1;margin-bottom:5px}.pp-tier-star{color:rgba(255,255,255,.92);text-shadow:0 0 10px rgba(255,255,255,.75),0 0 20px rgba(255,255,255,.3)}.pp-tier-star--off{color:rgba(255,255,255,.15);text-shadow:none}.pp-tier-name{font-size:22px;font-weight:900;color:#fff;letter-spacing:3px;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.35);line-height:1}.pp-tier-prog-wrap{margin-bottom:8px}.pp-tier-bar-track{height:5px;background:rgba(0,0,0,.3);border-radius:999px;overflow:hidden;margin-bottom:5px}.pp-tier-bar-fill{height:100%;background:linear-gradient(90deg,rgba(255,255,255,.5),rgba(255,255,255,.9));border-radius:999px;box-shadow:0 0 6px rgba(255,255,255,.5);transition:width .7s cubic-bezier(.4, 0, .2, 1)}.pp-tier-prog-labels{display:flex;justify-content:space-between;font-size:9px;color:rgba(255,255,255,.5)}.pp-tier-level{font-weight:700;color:rgba(255,255,255,.85)}.pp-tier-max{font-weight:600}.pp-tier-stat{text-align:center;font-size:10px;color:rgba(255,255,255,.6);font-weight:600;letter-spacing:.3px;border-top:1px solid rgba(255,255,255,.1);padding-top:8px;margin-top:2px}.pp-receiver-row{display:flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--pr-bg),var(--pr-end));border-radius:10px;padding:8px 12px;box-shadow:0 0 12px var(--pr-glow);border:1px solid rgba(255,255,255,.1)}.pp-receiver-icon{font-size:14px;line-height:1}.pp-receiver-text{flex:1;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:rgba(255,255,255,.8)}.pp-receiver-medal{font-size:13px;font-weight:800;color:#fff;letter-spacing:.5px}.lt-mini-badge{display:inline-flex;align-items:center;justify-content:center;gap:1px;min-width:40px;padding:1px 5px;border-radius:20px;background:linear-gradient(135deg,var(--lt-bg),var(--lt-end));box-shadow:0 1px 3px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.25);border:1px solid rgba(255,255,255,.25);font-size:7.6px;font-weight:800;color:#fff;letter-spacing:.3px;text-shadow:0 1px 2px rgba(0,0,0,.5);vertical-align:middle;margin-left:2px;white-space:nowrap;flex-shrink:0;cursor:default;user-select:none;line-height:1.6}.lt-mini-star{font-size:1.2em;color:#fff;text-shadow:0 0 3px rgba(255,255,255,.7),0 1px 2px rgba(0,0,0,.4);margin-right:1px}
.lt-mini--pulse{animation:lt-mini-pulse 1.8s ease-in-out infinite}
@keyframes lt-mini-pulse{0%,100%{box-shadow:0 1px 3px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.25),0 0 0 0 var(--lt-glow)}50%{box-shadow:0 1px 3px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.25),0 0 6px 2px var(--lt-glow)}}[data-theme=daylight] .sub-tier-badge{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .25))}[data-theme=daylight] .sub-tier-badge--list{filter:drop-shadow(0 1px 4px rgba(0, 0, 0, .28))}[data-theme=daylight] .crown-badge-img{filter:drop-shadow(0 1px 4px rgba(0, 0, 0, .28)) brightness(.96)}[data-theme=daylight] .room-float-sidebar .sub-tier-badge{filter:none}[data-theme=daylight] .room-float-sidebar .crown-badge-img{filter:brightness(.96)}[data-theme=daylight] .svc-crown-item{border-color:var(--border);background:rgba(0,0,0,.025)}[data-theme=daylight] .svc-crown-item:hover{background:rgba(var(--crown-rgb),.08);box-shadow:0 0 0 1px var(--crown-color),0 3px 14px rgba(var(--crown-rgb),.18)}[data-theme=daylight] .svc-crown-item-active{box-shadow:0 0 0 1px var(--crown-color),0 3px 14px rgba(var(--crown-rgb),.22)}[data-theme=daylight] .svc-crown-icon-wrap{background:rgba(var(--crown-rgb,255,215,0),.15)!important}[data-theme=daylight] .svc-crown-subtabs,[data-theme=daylight] .svc-giftroom-subtabs{border-bottom-color:var(--border)}[data-theme=daylight] .svc-giftroom-select{background:var(--bg-secondary);color:var(--text-primary);border-color:var(--border)}[data-theme=daylight] .svc-badge-card{border-color:var(--border);background:rgba(0,0,0,.025)}[data-theme=daylight] .svc-badge-card:hover{border-color:rgba(0,0,0,.25);background:rgba(0,0,0,.05)}[data-theme=daylight] .svc-badge-section-label{border-bottom-color:var(--border)}[data-theme=daylight] .svc-badge-emoji{filter:drop-shadow(0 2px 6px rgba(0, 0, 0, .22))}[data-theme=daylight] .aml-admin-badge svg,[data-theme=daylight] .aml-dev-badge svg,[data-theme=daylight] .aml-enforcer-badge svg,[data-theme=daylight] .aml-mod-badge svg,[data-theme=daylight] .aml-owner-badge svg,[data-theme=daylight] .aml-senior-enforcer-badge svg{filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .35))}[data-theme=daylight] .room-float-sidebar .aml-admin-badge svg,[data-theme=daylight] .room-float-sidebar .aml-dev-badge svg,[data-theme=daylight] .room-float-sidebar .aml-enforcer-badge svg,[data-theme=daylight] .room-float-sidebar .aml-mod-badge svg,[data-theme=daylight] .room-float-sidebar .aml-owner-badge svg,[data-theme=daylight] .room-float-sidebar .aml-senior-enforcer-badge svg{filter:none}[data-theme=daylight] .role-pin-badge{filter:drop-shadow(0 1px 3px rgba(0, 0, 0, .35))}[data-theme=daylight] .role-pin-badge:hover{filter:drop-shadow(0 2px 5px rgba(0, 0, 0, .45)) brightness(1.08)}[data-theme=daylight] .room-float-sidebar .role-pin-badge,[data-theme=daylight] .room-float-sidebar .role-pin-badge:hover{filter:none}@keyframes signoutRingPulse{0%{transform:scale(.85);opacity:.55}70%{transform:scale(1.22);opacity:0}100%{opacity:0}}#rename-modal .profile-modal{overflow:visible;padding:18px;max-width:360px;min-height:0}#rename-modal .profile-modal-header{position:relative;z-index:1;margin-bottom:0}#rename-modal .profile-modal-header h3{font-size:16px;margin-bottom:0}.profile-modal-banner{height:44px;margin:12px -18px 0;background:linear-gradient(135deg,var(--accent) 0,color-mix(in srgb,var(--accent) 55%,#000) 100%);position:relative;overflow:hidden}.profile-modal-banner::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 0,rgba(255,255,255,.25),transparent 55%)}#rename-modal .profile-section{margin-bottom:12px}#rename-modal .profile-avatar-section{position:relative;z-index:2;margin-top:0;margin-bottom:10px}#rename-modal .profile-avatar-row{transform:translateY(-16px);margin-bottom:-16px;align-items:center;gap:10px}#rename-modal .profile-avatar-preview{border:3px solid var(--bg-card);box-shadow:0 4px 12px rgba(0,0,0,.4);position:relative;transition:transform .2s ease,box-shadow .2s ease}#rename-modal .profile-avatar-preview:hover{transform:scale(1.06);box-shadow:0 6px 16px rgba(0,0,0,.5)}#rename-modal .profile-avatar-preview::after,#rename-modal .profile-avatar-preview::before{content:"";position:absolute;opacity:0;transition:opacity .2s ease;pointer-events:none}#rename-modal .profile-avatar-preview::before{inset:0;background:rgba(0,0,0,.45)}#rename-modal .profile-avatar-preview::after{top:50%;left:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border:2px solid #fff;border-radius:50%}#rename-modal .profile-avatar-preview:hover::after,#rename-modal .profile-avatar-preview:hover::before{opacity:1}#rename-modal .profile-avatar-buttons{margin-bottom:0}#rename-modal .profile-avatar-buttons .btn-ghost{height:32px;padding:0 12px;font-size:12px;background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary)}#rename-modal .profile-avatar-buttons .btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}#rename-modal .profile-avatar-buttons .btn-accent{height:32px;padding:0 12px;font-size:12px}#rename-modal .profile-avatar-hint{margin-top:0;font-size:11px}#rename-modal .profile-shape-section{margin-top:10px}#rename-modal .profile-shape-label{margin-bottom:6px;font-size:11px}#rename-modal .profile-shape-picker{gap:6px}#rename-modal .profile-shape-btn{width:32px;height:32px;border-radius:8px}#rename-modal .profile-shape-btn .shape-preview{transform:scale(.8)}#rename-modal .profile-shape-btn.active{box-shadow:0 0 0 3px var(--accent-glow),0 0 12px var(--accent-glow)}#rename-modal .profile-divider{margin:10px 0}#rename-modal .profile-label{margin-bottom:4px;font-size:13px}#rename-modal .profile-hint{margin-bottom:6px;font-size:11px}#rename-modal .profile-input{padding:9px 12px;font-size:13px}#rename-modal .profile-textarea{padding:9px 12px;font-size:13px;min-height:44px;height:44px}#rename-modal .profile-label-row{margin-bottom:4px}#rename-modal .profile-input:focus,#rename-modal .profile-textarea:focus{box-shadow:0 0 0 3px var(--accent-glow)}#rename-modal .profile-modal-footer{margin-top:14px;padding-top:12px}#signout-confirm-modal .modal{max-width:336px;padding:26px 24px 22px;text-align:center;resize:none;min-width:0;min-height:0}#signout-confirm-modal .signout-modal-icon{position:relative;width:46px;height:46px;margin:0 auto 14px;background:radial-gradient(circle,rgba(231,76,60,.18),rgba(231,76,60,.05) 70%)}#signout-confirm-modal .signout-modal-icon svg{width:21px;height:21px}#signout-confirm-modal .signout-modal-icon::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(231,76,60,.25);animation:signoutRingPulse 2.2s ease-out .3s infinite}#signout-confirm-modal h3{font-size:16.5px;border-bottom:none;padding-bottom:0;margin-bottom:6px;justify-content:center}#signout-confirm-modal .modal-desc{font-size:12.5px;line-height:1.5;padding:0 6px;text-align:center;margin-bottom:0;color:var(--text-secondary)}#signout-confirm-modal .modal-actions{margin-top:20px;justify-content:center;gap:10px;border-top:none;padding-top:0}#signout-confirm-modal #signout-cancel-btn,#signout-confirm-modal #signout-confirm-btn{min-width:0;flex:1;max-width:122px;padding:9px 14px;border-radius:9px;font-size:12.5px;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}#signout-confirm-modal #signout-confirm-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(231,76,60,.35)}#signout-confirm-modal #signout-cancel-btn:hover{transform:translateY(-1px)}#all-members-modal .modal{padding:0;overflow:hidden;border-radius:10px;height:640px}.aml-modal-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:23px 16px;background:linear-gradient(135deg,var(--accent) 0,color-mix(in srgb,var(--accent) 55%,#000) 100%);position:relative;overflow:hidden}.aml-modal-header::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 0,rgba(255,255,255,.22),transparent 55%);pointer-events:none}.aml-modal-heading{display:flex;align-items:center;gap:10px;position:relative;z-index:1;min-width:0}.aml-modal-icon{width:32px;height:32px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);border-radius:9px}.aml-modal-heading h3{font-size:15.5px;font-weight:700;color:#fff;font-family:var(--font-heading);margin:0;line-height:1.25}.aml-modal-subtitle{font-size:11px;color:rgba(255,255,255,.8);margin:1px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.aml-modal-header-right{display:flex;align-items:center;gap:8px;position:relative;z-index:1;flex-shrink:0}.aml-count-badge{font-size:11px;font-weight:600;color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:3px 9px;white-space:nowrap}.aml-modal-header-right .settings-close-btn{width:25px;height:25px;font-size:13px;background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.28)}.aml-modal-header-right .settings-close-btn:hover{background:rgba(255,255,255,.28);color:#fff;transform:scale(1.05)}.aml-toolbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 16px 8px}.aml-search-wrap{position:relative;flex:1;min-width:150px}.aml-search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:12px;opacity:.55;pointer-events:none}.aml-search-input{width:100%;padding:6px 10px 6px 28px;font-size:12.5px;font-family:var(--font-main);background:var(--bg-input);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);transition:border-color .2s,box-shadow .2s}.aml-search-input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.aml-search-input::placeholder{color:var(--text-muted)}.aml-filter-select{font-size:12px;font-weight:500;padding:6px 9px;border-radius:8px;background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;transition:border-color .2s}.aml-filter-select:focus{outline:0;border-color:var(--accent)}.aml-list{overflow-y:auto;flex:1;min-height:0;display:flex;flex-direction:column;gap:4px;padding:2px 16px 14px}#all-members-modal .modal-actions{padding:9px 16px;margin:0;border-top:1px solid var(--border);background:var(--bg-card)}.aml-member-row{padding:6px 9px;gap:8px;border:1px solid var(--border);transition:background .15s ease,border-color .15s ease,transform .15s ease}.aml-member-row:hover{border-color:var(--border-light);transform:translateY(-1px)}.aml-member-left{gap:8px}.aml-avatar-wrap{width:32px;height:32px}.aml-avatar{width:32px;height:32px;border-radius:50%}.aml-avatar-default{border-radius:50%;font-size:13px}.aml-member-name{font-size:12.5px}.aml-member-info{gap:1px}.aml-status-msg{font-size:11px;color:var(--text-secondary);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;margin-top:0}@media (prefers-reduced-motion:reduce){#all-members-modal,#all-members-modal .modal,#rename-modal,#rename-modal .modal,#settings-modal,#settings-modal .modal,#signout-confirm-modal,#signout-confirm-modal .modal,#signout-confirm-modal .signout-modal-icon::before{animation:none!important}}.message.whisper-message{background:rgba(var(--accent-rgb),.07);border-left:3px solid var(--accent,#7c5cfc);border-radius:8px;padding-left:9px}.message.whisper-message:hover{background:rgba(var(--accent-rgb),.12)}.message.whisper-message .message-content{font-style:italic}.whisper-tag{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;color:var(--accent,#7c5cfc);background:rgba(var(--accent-rgb),.14);padding:1px 7px;border-radius:999px;letter-spacing:.2px;white-space:nowrap}.whisper-tag-name{font-weight:700}.room-float-whisper-bar{display:flex;align-items:center;gap:8px;padding:5px 14px;background:rgba(var(--accent-rgb),.1);border-top:1px solid rgba(var(--accent-rgb),.2);font-size:12px;color:var(--accent,#7c5cfc);flex-shrink:0}.room-float-whisper-label{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}.room-float-whisper-label strong{font-weight:700}.room-float-whisper-cancel{background:0 0;border:none;color:var(--accent,#7c5cfc);cursor:pointer;font-size:13px;padding:2px 4px;border-radius:4px;flex-shrink:0;line-height:1}.room-float-whisper-cancel:hover{color:#f87171}.room-float-modal.room-float-whisper-active .room-float-input-pill{box-shadow:0 0 0 1px rgba(var(--accent-rgb),.5) inset}.room-float-modal.room-float-whisper-active .room-float-textarea::placeholder{color:var(--accent,#7c5cfc);opacity:.75}.user-context-menu>button.user-ctx-whisper{color:var(--accent,#7c5cfc)}.user-context-menu>button.user-ctx-whisper:hover{background:rgba(var(--accent-rgb),.12)}.user-ctx-submenu>button.user-ctx-danger{color:#e74c3c}.user-ctx-submenu>button.user-ctx-danger:hover{background:rgba(231,76,60,.12)}.user-ctx-submenu>button.user-ctx-warn{color:var(--accent,#3d9e6e)}.user-ctx-submenu>button.user-ctx-warn:hover{background:rgba(var(--accent-rgb),.1)}.user-ctx-submenu>button.user-ctx-wallet{color:#f0c040}.user-ctx-submenu>button.user-ctx-wallet:hover{background:rgba(240,192,64,.12)}.restriction-badges-overlay{position:absolute;top:-4px;left:4px;display:flex;z-index:2;pointer-events:auto}.restriction-badge{display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;border-radius:50%;background:var(--danger,#e74c3c);color:#fff;font-size:8px;line-height:1;font-weight:700;box-shadow:0 1px 2px rgba(0,0,0,.6)}.profile-remove-name-btn{background:0 0;border:none;padding:0;font-size:12px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:color .15s ease}.profile-remove-name-btn:hover:not(:disabled){color:var(--danger,#f04747);text-decoration:underline}.profile-remove-name-btn:disabled{opacity:.5;cursor:default}.create-room-category-toggle{display:flex;gap:8px}.create-room-category-option{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 12px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-muted);font-size:.85rem;font-weight:600;cursor:pointer;transition:border-color var(--transition),background var(--transition),color var(--transition),box-shadow var(--transition)}.create-room-category-option:hover{border-color:rgba(var(--accent-rgb),.4);color:var(--text)}.create-room-category-option.selected{border-color:rgba(var(--accent-rgb),.5);background:rgba(var(--accent-rgb),.1);color:var(--accent);box-shadow:0 0 0 1px rgba(var(--accent-rgb),.12) inset}.room-list-tabs{display:flex;align-items:center;gap:4px;margin:0 20px 14px;padding:4px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:12px}.room-list-tab{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;padding:7px 10px;border-radius:9px;border:1px solid transparent;background:0 0;color:var(--text-muted);font-size:.78rem;font-weight:600;letter-spacing:.01em;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease}.room-list-tab-icon{font-size:.9em;line-height:1;opacity:.85}.room-list-tab:hover{color:var(--text);background:rgba(255,255,255,.04)}.room-list-tab.active{background:var(--bg-card,rgba(255,255,255,.07));border-color:rgba(var(--accent-rgb),.35);color:var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.18),0 0 0 1px rgba(var(--accent-rgb),.1) inset}.room-list-tab.active .room-list-tab-icon{opacity:1}.room-list-badge{display:inline-flex;align-items:center;gap:3px}.room-list-badge.adult{color:#f0665f;border-color:rgba(240,102,95,.28);background:rgba(240,102,95,.1)}.room-list-badge.general{color:#4ade80;border-color:rgba(74,222,128,.25);background:rgba(74,222,128,.1)}.room-float-cat-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:21px;height:21px;border-radius:6px;font-size:12px;font-weight:800;line-height:1;font-family:var(--font-heading, inherit);border:1px solid rgba(0,0,0,.18);box-shadow:0 0 0 1px rgba(0,0,0,.22),0 1px 3px rgba(0,0,0,.35)}.room-float-cat-badge.cat-general{color:#0b3820;background:#4ade80;text-shadow:0 1px 0 rgba(255,255,255,.25)}.room-float-cat-badge.cat-adult{color:#fff;background:#e6453d;text-shadow:0 1px 1px rgba(0,0,0,.3)}.room-float-cat-badge.cat-private{color:#3a2400;background:#f5a623;text-shadow:0 1px 0 rgba(255,255,255,.2)}.trivia-manage-btn{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:20px;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);font-size:10.5px;font-weight:600;cursor:pointer;transition:background .12s,border-color .12s,color .12s;flex-shrink:0}.trivia-manage-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(var(--accent-rgb),.1)}.trivia-manage-panel{justify-content:space-between}.trivia-manage-body{flex:1;min-height:0;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:18px}.trivia-manage-section{display:flex;flex-direction:column}.trivia-manage-footer{flex-shrink:0;padding:10px 16px;border-top:1px solid var(--border-light);display:flex}.trivia-manage-footer .trivia-ctrl-btn{width:100%;justify-content:center}.trivia-batch-list{display:flex;flex-direction:column;gap:6px;max-height:190px;overflow-y:auto}.trivia-batch-empty{padding:14px 10px;text-align:center;font-size:11.5px;color:var(--text-muted);border:1px dashed var(--border);border-radius:var(--radius-sm)}.trivia-batch-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--border);background:var(--bg-tertiary);border-radius:var(--radius-sm)}.trivia-batch-info{display:flex;flex-direction:column;gap:2px;min-width:0}.trivia-batch-name{font-size:12.5px;font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trivia-batch-meta{font-size:10.5px;color:var(--text-muted)}.trivia-batch-delete{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:26px;height:26px;border-radius:var(--radius-sm);border:1px solid var(--border);background:0 0;color:var(--text-muted);cursor:pointer;transition:background .12s,border-color .12s,color .12s}.trivia-batch-delete:hover{border-color:rgba(var(--danger-rgb),.4);background:rgba(var(--danger-rgb),.1);color:var(--danger)}.trivia-upload-hint{font-size:10.5px;line-height:1.5;color:var(--text-muted);margin:0 0 10px}.trivia-upload-hint code{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;padding:1px 4px;font-size:10px}.trivia-template-link{background:0 0;border:none;padding:0;color:var(--accent);font-size:10.5px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.trivia-template-link:hover{color:var(--accent-hover)}.trivia-batch-name-input{width:100%;padding:8px 10px;margin-bottom:8px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);font-size:12px;box-sizing:border-box}.trivia-batch-name-input:focus{outline:0;border-color:var(--accent)}.trivia-file-drop{display:flex;align-items:center;gap:8px;padding:12px 10px;margin-bottom:10px;border:1px dashed var(--border);border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-muted);font-size:11.5px;font-weight:500;cursor:pointer;transition:border-color .12s,color .12s}.trivia-file-drop:hover{border-color:var(--accent);color:var(--accent)}.trivia-upload-status{min-height:14px;margin-top:8px;font-size:11px;font-weight:500}.trivia-upload-status.success{color:var(--success)}.trivia-upload-status.error{color:var(--danger)}.user-blocked-hidden{display:none!important}.dm-system-hidden{display:none!important}.connections-modal-inner{display:flex;flex-direction:column;width:460px;max-width:460px;min-height:420px;padding:26px}.connections-modal-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px}.connections-modal-heading{display:flex;align-items:center;gap:12px}.connections-modal-icon-badge{flex-shrink:0;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--accent,#7c5cfc),var(--accent-hover,#9478ff));box-shadow:0 4px 14px rgba(var(--accent-rgb,124,92,252),.4)}.connections-modal-header h3{margin:0;font-size:1.05rem;font-weight:700;color:var(--text-primary);line-height:1.25}.connections-modal-subtitle{margin:2px 0 0;font-size:.72rem;color:var(--text-muted);line-height:1.3}.connections-modal-close-btn{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:var(--bg-input);border:none;color:var(--text-muted);cursor:pointer;border-radius:50%;transition:background .15s ease,color .15s ease,transform .15s ease}.connections-modal-close-btn:hover{background:var(--bg-hover);color:var(--text-primary);transform:rotate(90deg)}.connections-tabs{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;background:var(--bg-input);border-radius:11px;padding:3px;margin-bottom:16px}.connections-tab{display:flex;align-items:center;justify-content:center;gap:5px;background:0 0;border:none;padding:8px 4px;border-radius:8px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:var(--text-muted);cursor:pointer;transition:background .16s ease,color .16s ease;white-space:nowrap}.connections-tab svg{flex-shrink:0;opacity:.85}.connections-tab:hover{color:var(--text-secondary)}.connections-tab.active{background:rgba(var(--accent-rgb,124,92,252),.16);color:var(--accent,#7c5cfc)}.connections-tab.active svg{opacity:1}.connections-tab-count{background:var(--accent,#7c5cfc);color:#fff;font-size:.58rem;font-weight:700;border-radius:20px;padding:1px 5px;min-width:15px;text-align:center;line-height:1.4}.connections-panel{display:flex;flex-direction:column;min-height:0;flex:1}.connections-scroll{max-height:340px;overflow-y:auto;display:flex;flex-direction:column;gap:3px;padding:1px}.connections-sub-label{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);margin:14px 0 6px;padding-left:2px}.connections-sub-label:first-child{margin-top:0}.connections-row{cursor:pointer;padding:7px 8px;border-radius:10px;gap:10px}.connections-row .friend-avatar-wrap{position:relative}.connections-row .friend-avatar{width:30px;height:30px;font-size:.72rem;box-shadow:0 0 0 2px var(--bg-card)}.connections-row-name{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.connections-row-name-text{font-size:.8rem;font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.connections-row-time{font-size:.65rem;color:var(--text-muted);font-weight:500}.connections-remove-btn{flex-shrink:0;border-radius:20px;padding:5px 12px;font-size:.66rem;font-weight:600;background:0 0;border:1px solid var(--border-light);color:var(--text-secondary);transition:background .14s ease,border-color .14s ease,color .14s ease}.connections-remove-btn:hover{background:rgba(var(--accent-rgb,124,92,252),.12);border-color:var(--accent,#7c5cfc);color:var(--accent,#7c5cfc)}.connections-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;min-height:180px;padding:20px 24px;flex:1}.connections-empty-sm{min-height:80px;padding:12px 24px}.connections-empty-icon-wrap{width:56px;height:56px;border-radius:50%;background:rgba(var(--accent-rgb,124,92,252),.12);display:flex;align-items:center;justify-content:center;margin-bottom:2px}.connections-empty-icon-wrap-sm{width:40px;height:40px;margin-bottom:0}.connections-empty-icon{font-size:1.6rem;line-height:1}.connections-empty-icon-wrap-sm .connections-empty-icon{font-size:1.15rem}.connections-empty-title{font-size:.82rem;font-weight:700;color:var(--text-primary)}.connections-empty-desc{font-size:.72rem;color:var(--text-muted);line-height:1.5;max-width:260px}.room-float-btn-favorite.active{color:var(--accent,#7c5cfc);background:rgba(var(--accent-rgb,124,92,252),.16)}.room-float-btn-favorite.active svg{fill:currentColor}.room-float-header.has-sub-color .room-float-btn-favorite.active{color:var(--header-fg);background:var(--header-btn-hover)}@keyframes connHeartPop{0%{transform:scale(1)}35%{transform:scale(1.35)}60%{transform:scale(.9)}100%{transform:scale(1)}}.room-float-btn-favorite.connections-heart-pop svg{animation:connHeartPop .38s cubic-bezier(.34,1.56,.64,1)}@media (max-width:600px){.connections-modal-inner{width:100%;max-width:100%}}.friends-add-btn{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:22px;height:22px;margin-bottom:-1px;background:0 0;border:none;border-radius:6px;color:var(--text-muted);cursor:pointer;transition:background .15s ease,color .15s ease}.friends-add-btn:hover{background:rgba(var(--accent-rgb,124,92,252),.14);color:var(--accent,#7c5cfc)}.add-friend-modal-inner{display:flex;flex-direction:column;width:400px;max-width:400px;min-height:320px;padding:26px}.add-friend-search-row{margin-bottom:14px}.add-friend-results{max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:3px;padding:1px;flex:1}.add-friend-action-btn{flex-shrink:0;border-radius:20px;padding:5px 12px;font-size:.66rem;font-weight:600;cursor:pointer;background:0 0;border:1px solid var(--border-light);color:var(--text-secondary);transition:background .14s ease,border-color .14s ease,color .14s ease}.add-friend-action-btn.state-add{background:var(--accent,#7c5cfc);border-color:var(--accent,#7c5cfc);color:#fff}.add-friend-action-btn.state-add:hover{background:var(--accent-hover,#9478ff);border-color:var(--accent-hover,#9478ff)}.add-friend-action-btn.state-accept{border-color:var(--accent,#7c5cfc);color:var(--accent,#7c5cfc)}.add-friend-action-btn.state-accept:hover{background:rgba(var(--accent-rgb,124,92,252),.12)}.add-friend-action-btn.state-friends,.add-friend-action-btn.state-pending{opacity:.6;cursor:default}.add-friend-action-btn:disabled{pointer-events:none}@media (max-width:600px){.add-friend-modal-inner{width:100%;max-width:100%}}.dm-float-pill-btn.dm-float-buzz:hover{color:#f5a623;background:rgba(245,166,35,.14)}.dm-float-pill-btn.dm-float-buzz:disabled{opacity:.35;cursor:default;pointer-events:none}.dm-float-pill-btn.dm-float-buzz.buzz-sent svg{animation:dmBuzzIconPulse .5s ease}@keyframes dmBuzzIconPulse{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.9)}100%{transform:scale(1)}}.dm-float-modal.dm-buzz-shake{animation:dmBuzzShake .6s linear both}@keyframes dmBuzzShake{0%,100%{translate:0 0;rotate:0deg}6%{translate:-6px -3px;rotate:-1.4deg}12%{translate:6px 3px;rotate:1.3deg}18%{translate:-8px 2px;rotate:-1.7deg}24%{translate:8px -3px;rotate:1.6deg}30%{translate:-7px 3px;rotate:-1.2deg}36%{translate:6px -2px;rotate:1.1deg}42%{translate:-5px 2px;rotate:-.9deg}48%{translate:4px -2px;rotate:.75deg}56%{translate:-3px 1px;rotate:-.55deg}64%{translate:3px -1px;rotate:.4deg}72%{translate:-2px 1px;rotate:-.25deg}82%{translate:2px 0;rotate:.15deg}92%{translate:-1px 0;rotate:0deg}}.dm-float-modal.dm-buzz-flash .dm-float-header{animation:dmBuzzFlash .6s ease}@keyframes dmBuzzFlash{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 2px #f5a623,0 0 18px rgba(245,166,35,.6)}}.dm-float-msg-wrap-buzz .dm-float-msg{background:linear-gradient(135deg,rgba(245,166,35,.18),rgba(245,90,35,.09));border-radius:14px;padding:3px 6px}.dm-float-msg-wrap-buzz .dm-float-msg-content{font-size:19px;font-weight:800;letter-spacing:.5px;color:#f5a623;text-shadow:0 0 12px rgba(245,166,35,.5);animation:dmBuzzTextWiggle .45s ease 2}@keyframes dmBuzzTextWiggle{0%,100%{transform:rotate(0) scale(1)}25%{transform:rotate(-4deg) scale(1.08)}75%{transform:rotate(4deg) scale(1.08)}}.theme-btn-disabled{opacity:.35;pointer-events:none;filter:grayscale(60%)}.greeter-modal{position:fixed;inset:0;z-index:100000000;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center}.greeter-modal-box{background:var(--bg-card,#1a1b2e);border:1px solid rgba(255,255,255,.1);border-radius:14px;width:min(480px,92vw);max-height:86vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,.65)}.greeter-modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0}.greeter-modal-title{font-size:14px;font-weight:600;color:var(--text-primary,#e8e8f0)}.greeter-modal-close{background:0 0;border:none;color:var(--text-muted,#888);font-size:19px;cursor:pointer;padding:0 2px;line-height:1;transition:color .15s}.greeter-modal-close:hover{color:var(--text-primary,#e8e8f0)}.greeter-modal-body{padding:14px 16px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.greeter-enable-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-primary,#e8e8f0);cursor:pointer}.greeter-hint{font-size:11.5px;line-height:1.5;color:var(--text-muted,#888);margin:0}.greeter-hint code{background:rgba(255,255,255,.08);border-radius:4px;padding:1px 5px;font-size:11px}.greeter-builder{display:flex;flex-direction:column;gap:8px;padding:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:10px}.greeter-builder-row{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.greeter-fmt-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.greeter-fmt-group{display:flex;align-items:center;gap:4px}.greeter-fmt-btn{width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:13px;border-radius:6px;cursor:pointer;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--text-primary,#e8e8f0);transition:background .13s,border-color .13s}.greeter-fmt-btn.active{background:rgba(var(--accent-rgb),.22);border-color:rgba(var(--accent-rgb),.5);color:var(--accent,#3d9e6e)}.greeter-rich-input{width:100%;min-height:90px;max-height:220px;overflow-y:auto;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text-primary,#e8e8f0);font-size:14px;line-height:1.5;font-family:inherit;padding:10px 12px;outline:0;box-sizing:border-box;white-space:pre-wrap;word-break:break-word;transition:border-color .15s}.greeter-rich-input:focus{border-color:var(--accent,#3d9e6e)}.greeter-rich-input.is-empty:before{content:attr(data-placeholder);color:var(--text-muted,#888);pointer-events:none}.greeter-char-count{font-size:10.5px;color:var(--text-muted,#888);white-space:nowrap}.greeter-char-count.over-limit{color:#f87171}.greeter-segment-input:focus{border-color:var(--accent,#3d9e6e)}.greeter-color-swatches{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.greeter-swatch{width:20px;height:20px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;transition:transform .12s,border-color .12s}.greeter-swatch:hover{transform:scale(1.15)}.greeter-swatch.selected{border-color:var(--text-primary,#e8e8f0);transform:scale(1.15)}.greeter-swatch-none{background:repeating-linear-gradient(45deg,rgba(255,255,255,.12),rgba(255,255,255,.12) 3px,transparent 3px,transparent 6px);border:2px solid rgba(255,255,255,.25)}.greeter-custom-color{width:22px;height:22px;padding:0;border:none;border-radius:50%;overflow:hidden;cursor:pointer;background:0 0}.greeter-custom-color::-webkit-color-swatch-wrapper{padding:0}.greeter-custom-color::-webkit-color-swatch{border:2px solid rgba(255,255,255,.25);border-radius:50%}.greeter-builder-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.greeter-quick-btn,.greeter-add-btn{font-size:11.5px;font-weight:600;padding:5px 10px;border-radius:6px;cursor:pointer;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--text-primary,#e8e8f0);transition:background .13s,border-color .13s}.greeter-quick-btn:hover{background:rgba(255,255,255,.09)}.greeter-add-btn{margin-left:auto;background:rgba(var(--accent-rgb),.15);border-color:rgba(var(--accent-rgb),.35);color:var(--accent,#3d9e6e)}.greeter-add-btn:hover{background:rgba(var(--accent-rgb),.25)}.greeter-emoji-picker{margin-top:2px}.greeter-segments-list{display:flex;flex-wrap:wrap;gap:6px;min-height:34px;padding:8px;background:rgba(255,255,255,.02);border:1px dashed rgba(255,255,255,.1);border-radius:8px}.greeter-segments-empty{font-size:11.5px;color:var(--text-muted,#888);padding:4px}.greeter-chip-wrap{display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:3px 3px 3px 10px}.greeter-chip{font-size:12.5px;font-weight:500;color:var(--text-primary,#e8e8f0);white-space:pre-wrap;max-width:180px;overflow:hidden;text-overflow:ellipsis}.greeter-chip-btn{background:0 0;border:none;color:var(--text-muted,#888);font-size:13px;width:18px;height:18px;line-height:1;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s}.greeter-chip-btn:hover:not(:disabled){background:rgba(255,255,255,.12);color:var(--text-primary,#e8e8f0)}.greeter-chip-btn:disabled{opacity:.3;cursor:default}.greeter-chip-remove:hover:not(:disabled){background:rgba(248,113,113,.2);color:#f87171}.greeter-image-section{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:10px}.greeter-image-upload-btn{font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:6px;cursor:pointer;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--text-primary,#e8e8f0);transition:background .13s}.greeter-image-upload-btn:hover{background:rgba(255,255,255,.09)}.greeter-image-hint{font-size:11px;color:var(--text-muted,#888)}.greeter-image-preview{display:flex;align-items:center;gap:8px;margin-left:auto}.greeter-image-preview img{width:40px;height:40px;object-fit:cover;border-radius:6px;border:1px solid rgba(255,255,255,.1)}.greeter-image-remove-btn{font-size:11px;color:#f87171;background:0 0;border:none;cursor:pointer;padding:2px 4px;text-decoration:underline}.greeter-image-status{font-size:11.5px;padding:4px 10px;border-radius:6px;width:100%}.greeter-image-status-info{color:var(--accent,#3d9e6e);background:rgba(var(--accent-rgb),.12)}.greeter-image-status-success{color:#4ade80;background:rgba(74,222,128,.1)}.greeter-image-status-error{color:#f87171;background:rgba(248,113,113,.1)}.greeter-preview-section{display:flex;flex-direction:column;gap:6px}.greeter-preview-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted,#888)}.greeter-preview-bubble{background:rgba(255,255,255,.02);border-radius:8px;min-height:20px}.greeter-preview-bubble .greeter-announcement{margin:0}.greeter-preview-empty{display:block;font-size:12px;color:var(--text-muted,#888);font-style:italic;padding:10px 12px}.greeter-modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid rgba(255,255,255,.07);flex-shrink:0}.greeter-announcement{display:flex;align-items:flex-start;gap:8px;margin:6px 6px;padding:8px 10px;border-radius:8px;background:rgba(var(--accent-rgb),.07);border:1px solid rgba(var(--accent-rgb),.22);border-left:3px solid var(--accent,#27ae60)}.greeter-announcement-icon{flex:0 0 auto;width:20px;height:20px;border-radius:50%;background:var(--accent,#27ae60);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;line-height:1}.greeter-announcement-body{flex:1;min-width:0}.greeter-announcement-head{display:flex;align-items:center;gap:6px;margin-bottom:2px}.greeter-announcement-tag{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent,#27ae60)}.greeter-announcement-text{font-size:13px;line-height:1.42;color:var(--text-primary,#e2e8f0);word-break:break-word;white-space:pre-wrap}.greeter-announcement-banner{display:block;width:100%;max-height:160px;object-fit:cover;border-radius:6px;margin:6px 0 0;cursor:pointer}
/* Shared window/modal frame: a faint inner highlight ring paired with the
   1px var(--border) hairline every window and modal now carries, so they
   read as one clean system. Light themes flip the ring to a dark hairline
   so it stays visible on near-white surfaces. */
:root{--modal-ring:inset 0 0 0 1px rgba(255,255,255,.05)}
[data-theme=daylight]{--modal-ring:inset 0 0 0 1px rgba(0,0,0,.04)}
/* ═══════════════════════════════════════════════════════════════════════
   Room Options modal — refined, consistent-height design
   Overrides the base .room-options-* rules in style.css so every tab
   (Avatar / Settings / Disabled / Banned / Kicked / Logs) shares one
   fixed modal size instead of resizing to fit its content.
   ═══════════════════════════════════════════════════════════════════════ */

.room-options-modal {
  padding: 20px;
  background: rgba(6, 8, 15, .62)}

.room-options-box {
  width: min(472px, 100%);
  height: min(560px, 82vh);
  max-height: min(560px, 82vh);
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, .09);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, 0) 140px),
    var(--bg-card, #1a1b2e);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .06) inset,
    0 32px 80px -12px rgba(0, 0, 0, .6),
    0 12px 32px rgba(0, 0, 0, .38);
  overflow: hidden;
}

/* ── Header ───────────────────────────────────────────────────────────── */
.room-options-header {
  padding: 15px 14px 14px 18px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.room-options-title {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .01em;
  color: var(--text-primary, #e8e8f0);
  text-shadow: none;
}

.room-options-close {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  font-size: 19px;
  color: var(--text-muted, #888);
  transition: background .14s, color .14s, transform .12s;
}

.room-options-close:hover {
  background: rgba(255, 255, 255, .08);
  color: var(--text-primary, #e8e8f0);
}

.room-options-close:active {
  transform: scale(.92);
}

/* ── Tab strip ────────────────────────────────────────────────────────── */
.room-options-tabs {
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.room-options-tabs::-webkit-scrollbar {
  display: none;
}

.room-options-tab {
  flex: 0 0 auto;
  white-space: nowrap;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--text-muted, #888);
  transition: background .14s, color .14s, border-color .14s;
}

.room-options-tab:hover {
  background: rgba(255, 255, 255, .055);
  color: var(--text-secondary, #ccc);
}

.room-options-tab.active {
  background: rgba(var(--accent-rgb), .16);
  border-color: rgba(var(--accent-rgb), .34);
  color: var(--accent, #3d9e6e);
  box-shadow: 0 1px 6px rgba(var(--accent-rgb), .14);
}

.room-options-tab:focus-visible {
  outline: 2px solid rgba(var(--accent-rgb), .6);
  outline-offset: 1px;
}

/* ── Panels ───────────────────────────────────────────────────────────── */
.room-options-panel {
  padding: 16px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .16) transparent;
}

.room-options-panel::-webkit-scrollbar {
  width: 10px;
}

.room-options-panel::-webkit-scrollbar-track {
  background: transparent;
}

.room-options-panel::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .14);
  border-radius: 10px;
  border: 3px solid transparent;
  background-clip: padding-box;
}

.room-options-panel::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, .24);
  background-clip: padding-box;
}

.room-options-panel.active {
  gap: 8px;
}

.room-options-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

/* ── Empty / loading — centred within the fixed height ────────────────── */
.room-options-empty,
.room-options-loading {
  margin: auto;
  padding: 32px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  letter-spacing: .01em;
  text-align: center;
  color: var(--text-muted, #888);
}

.room-options-loading::before {
  content: "";
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .13);
  border-top-color: rgba(var(--accent-rgb), .9);
  animation: roomOptsSpin .7s linear infinite;
}

@keyframes roomOptsSpin {
  to { transform: rotate(360deg); }
}

/* ── List item cards ─────────────────────────────────────────────────── */
.room-options-item {
  padding: 11px 12px;
  border-radius: 11px;
  background: rgba(255, 255, 255, .028);
  border: 1px solid rgba(255, 255, 255, .055);
  transition: background .14s, border-color .14s;
}

.room-options-item:hover {
  background: rgba(255, 255, 255, .05);
  border-color: rgba(255, 255, 255, .1);
}

.room-options-item-name {
  font-size: 13px;
}

.room-options-item-meta,
.room-options-item-reason {
  font-size: 11px;
}

/* ── Action buttons ──────────────────────────────────────────────────── */
.room-options-action-btn {
  min-height: 29px;
  display: inline-flex;
  align-items: center;
  padding: 5px 13px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 600;
  transition: background .14s, border-color .14s, transform .1s;
}

.room-options-action-btn:hover {
  transform: translateY(-1px);
}

.room-options-action-btn:active {
  transform: translateY(0);
}

/* ── Settings tab ────────────────────────────────────────────────────── */
.room-options-settings {
  flex: 1;
}

.room-opts-settings-header {
  font-size: 10.5px;
  letter-spacing: .07em;
  padding: 4px 0 7px;
}

.room-opts-settings-header:not(:first-child) {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .06);
}

.room-opts-settings-desc {
  font-size: 11.5px;
  margin-bottom: 12px;
}

.room-opts-settings-list {
  gap: 7px;
}

.room-opts-setting-row {
  padding: 10px 12px;
  border-radius: 11px;
  background: rgba(255, 255, 255, .028);
  border: 1px solid rgba(255, 255, 255, .055);
}

.room-opts-setting-row:hover {
  background: rgba(255, 255, 255, .055);
}

.room-opts-setting-label {
  font-size: 12.5px;
}

.room-opts-toggle-slider {
  width: 38px;
  height: 21px;
}

.room-opts-toggle-slider::after {
  width: 15px;
  height: 15px;
}

.room-opts-toggle-input:checked + .room-opts-toggle-slider::after {
  transform: translateX(17px);
}

.room-opts-toggle-input:focus-visible + .room-opts-toggle-slider {
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .3);
}

.room-opts-settings-footer {
  margin-top: 16px;
  padding: 14px 0 4px;
  border-top: 1px solid rgba(255, 255, 255, .07);
}

.room-opts-save-btn {
  border-radius: 9px;
  padding: 9px 20px;
  font-size: 12px;
  box-shadow: 0 4px 14px rgba(var(--accent-rgb), .28);
  transition: filter .13s, transform .1s, box-shadow .13s;
}

.room-opts-save-btn:hover {
  opacity: 1;
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.room-opts-save-btn:active {
  transform: translateY(0);
}

/* ── Avatar tab — centred in the fixed height ────────────────────────── */
.room-avatar-panel {
  flex: 1;
  justify-content: center;
  gap: 18px;
  padding: 16px;
}

.room-avatar-preview {
  width: 92px;
  height: 92px;
  border-radius: 22px;
  box-shadow: 0 12px 32px -8px rgba(var(--accent-rgb), .45);
}

.room-avatar-preview .room-avatar-img {
  border-radius: 20px;
}

.room-avatar-preview .room-avatar-placeholder {
  font-size: 38px;
}

.room-avatar-preview-label {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.room-avatar-upload-btn {
  padding: 8px 18px;
  border-radius: 9px;
  font-weight: 600;
  box-shadow: 0 4px 14px rgba(var(--accent-rgb), .26);
  transition: filter .15s, transform .1s;
}

.room-avatar-upload-btn:hover {
  opacity: 1;
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.room-avatar-remove-btn {
  border-radius: 9px;
}

/* ── Rename section ──────────────────────────────────────────────────── */
.room-opts-rename-section {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, .06);
}

.room-opts-rename-input {
  border-radius: 9px;
  padding: 9px 12px;
}

.room-opts-rename-input:focus {
  border-color: rgba(var(--accent-rgb), .5);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .14);
}

.room-opts-rename-btn {
  border-radius: 9px;
}

/* ── Light themes (cloudy / daylight) ────────────────────────────────── */
[data-theme=daylight] .room-options-modal {
  background: rgba(38, 42, 52, .42);
}

[data-theme=daylight] .room-options-box {
  background: var(--bg-card);
  border: 1px solid var(--border);
  box-shadow:
    0 24px 64px -12px rgba(var(--overlay-ink-rgb, 20, 20, 30), .28),
    0 8px 24px rgba(var(--overlay-ink-rgb, 20, 20, 30), .12);
}

[data-theme=daylight] .room-options-header,[data-theme=daylight] .room-options-tabs {
  border-bottom-color: var(--border-light);
}

[data-theme=daylight] .room-options-close:hover,[data-theme=daylight] .room-options-tab:hover {
  background: rgba(0, 0, 0, .05);
  color: var(--text-secondary);
}

[data-theme=daylight] .room-options-item,[data-theme=daylight] .room-opts-setting-row {
  background: var(--bg-secondary);
  border: 1px solid var(--border-light);
}

[data-theme=daylight] .room-options-item:hover,[data-theme=daylight] .room-opts-setting-row:hover {
  background: var(--bg-hover);
}

[data-theme=daylight] .room-options-loading::before {
  border-color: rgba(0, 0, 0, .12);
  border-top-color: rgba(var(--accent-rgb), .9);
}

[data-theme=daylight] .room-options-panel {
  scrollbar-color: rgba(0, 0, 0, .2) transparent;
}

[data-theme=daylight] .room-options-panel::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, .18);
  background-clip: padding-box;
}

[data-theme=daylight] .room-opts-settings-header:not(:first-child),[data-theme=daylight] .room-opts-settings-footer,[data-theme=daylight] .room-opts-rename-section {
  border-color: var(--border-light);
}

/* ===== Services — light-theme redesign =====================================
   The Services surface (#room-services-modal / .svc-*) was authored dark-first
   (black scrims, white-alpha borders, 0/0/.5 text shadows). The app now ships
   only the light "daylight" theme, so this block re-skins every dark-specific
   value against the theme variables and tightens the visual system. Appended
   last so it wins the cascade; selectors are limited to .svc-* / .room-services-*
   / #room-services-modal so nothing else is touched. Mirrored in
   tauri-native/src/css/style.css. */

.room-services-modal {
  background: rgba(24, 20, 14, .38)}

.room-services-box {
  --svc-surface: var(--bg-secondary, #dad7d2);
  --svc-card: var(--bg-card, #e1dfdc);
  --svc-line: var(--border, #c3beb3);
  --svc-line-soft: var(--border-light, #cfcbc2);
  background: var(--svc-surface);
  border: 1px solid var(--svc-line);
  border-radius: 16px;
  padding: 20px 22px 22px;
  max-width: 860px;
  box-shadow: 0 20px 50px -14px rgba(32, 24, 14, .38), var(--modal-ring, inset 0 0 0 1px rgba(0,0,0,.04));
}
.room-services-box::-webkit-scrollbar { width: 10px; }
.room-services-box::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, .16);
  border-radius: 6px;
  border: 3px solid transparent;
  background-clip: padding-box;
}

.room-services-header {
  position: sticky;
  top: -20px;
  z-index: 2;
  margin: -20px -22px 12px;
  padding: 14px 22px 12px;
  background: var(--svc-surface);
  border-bottom: 1px solid var(--svc-line-soft);
}
.room-services-title {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .01em;
  color: var(--text-primary, #2a2925);
}
.room-services-close {
  color: var(--text-muted, #605b4d);
  border-radius: 6px;
}
.room-services-close:hover {
  color: var(--text-primary, #2a2925);
  background: rgba(0, 0, 0, .06);
}
.room-services-subtitle { color: var(--text-secondary, #5f5c53); }

/* Tabs — segmented, quiet */
.svc-type-tabs {
  gap: 2px;
  border-bottom: 1px solid var(--svc-line-soft);
}
.svc-type-tab {
  color: var(--text-secondary, #5f5c53);
  font-size: .82rem;
  padding: 8px 13px;
  text-shadow: none;
}
.svc-type-tab[data-tab=crown], .svc-type-tab[data-tab=badge] { text-shadow: none; }
.svc-type-tab:hover { color: var(--text-primary, #2a2925); }
.svc-type-tab.active {
  color: var(--accent, #864e1e);
  border-bottom-color: var(--accent, #864e1e);
}

/* Duration pills */
.svc-duration-bar {
  background: rgba(0, 0, 0, .04);
  border: 1px solid var(--svc-line-soft);
  border-radius: 10px;
}
.svc-duration-pill { color: var(--text-secondary, #5f5c53); }
.svc-duration-pill:hover {
  color: var(--text-primary, #2a2925);
  background: rgba(0, 0, 0, .05);
}
.svc-duration-pill.active {
  background: var(--bg-card, #e1dfdc);
  border-color: var(--svc-line);
  color: var(--text-primary, #2a2925);
  box-shadow: 0 1px 3px rgba(32, 24, 14, .12);
}
.svc-duration-save { color: var(--success, #3e8054); }
.svc-duration-pill.active .svc-duration-save { color: var(--success, #3e8054); }

.svc-disabled-notice {
  background: rgba(180, 132, 46, .14);
  border: 1px solid rgba(180, 132, 46, .4);
  color: var(--warning, #8a5a1e);
}

/* Tier / crown / badge cards */
.svc-tier-card, .svc-crown-item, .svc-badge-card {
  background: var(--svc-card);
  border: 1px solid var(--svc-line);
  border-radius: 13px;
  box-shadow: 0 1px 2px rgba(32, 24, 14, .05);
  transition: border-color .18s, box-shadow .18s, transform .12s;
}
.svc-tier-card:hover, .svc-crown-item:hover, .svc-badge-card:hover {
  border-color: var(--tier-color, var(--accent, #864e1e));
  box-shadow: 0 6px 18px -8px rgba(32, 24, 14, .28);
  transform: translateY(-1px);
}
.svc-tier-card-active, .svc-crown-item-active, .svc-badge-card-displaying {
  border-color: var(--tier-color, var(--accent)) !important;
  box-shadow: 0 0 0 2px var(--tier-color, var(--accent)) inset !important;
}
.svc-tier-header { border-bottom-width: 1px !important; }
.svc-tier-name, .svc-crown-name { text-shadow: none; }
.svc-tier-features li { color: var(--text-secondary, #5f5c53); }
.svc-tier-price, .svc-crown-price, .svc-badge-price {
  color: var(--text-primary, #2a2925);
}
.svc-tier-price-period { color: var(--text-muted, #605b4d); }
.svc-tier-capacity { opacity: 1; }
.svc-badge-emoji, .svc-crown-name, .svc-badge-name { text-shadow: none; }
.svc-badge-name { color: var(--text-primary, #2a2925); }
.svc-badge-desc, .svc-crown-label, .svc-crown-priority { color: var(--text-secondary, #5f5c53); }
.svc-badge-section-label { color: var(--text-muted, #605b4d); }

/* Buttons */
.svc-tier-btn { padding: 9px 8px; font-weight: 700; letter-spacing: .01em; }
.svc-tier-btn-pay { opacity: 1; }
/* Badge & ID pay buttons carry no inline colour (unlike user / crown / gift),
   so they need an explicit fill to read on the light surface. */
.svc-badge-grid .svc-tier-btn-pay:not(.svc-tier-btn-extend) {
  background: var(--accent, #864e1e) !important;
  border-color: var(--accent, #864e1e) !important;
  color: #fff !important;
}
.svc-badge-grid .svc-tier-btn-pay:not(.svc-tier-btn-extend):hover { filter: brightness(1.07); }
.svc-tier-btn-extend {
  background: rgba(62, 128, 84, .14) !important;
  border-color: rgba(62, 128, 84, .42) !important;
  color: var(--success, #3e8054) !important;
}
.svc-tier-btn-extend:hover { background: rgba(62, 128, 84, .24) !important; }
.svc-badge-emoji { filter: drop-shadow(0 2px 6px rgba(32, 24, 14, .16)); }
.svc-tier-btn-pay:hover { filter: brightness(.96); }
.svc-tier-btn-active {
  background: var(--bg-tertiary, #cac6be);
  border: 1.5px solid var(--svc-line);
  color: var(--text-secondary, #5f5c53);
  text-shadow: none;
}
.svc-tier-btn-disabled {
  background: var(--bg-tertiary, #cac6be);
  border: 1px solid var(--svc-line-soft);
  color: var(--text-muted, #605b4d);
  opacity: 1;
}
.svc-tier-insufficient {
  background: rgba(190, 74, 61, .1) !important;
  border-color: rgba(190, 74, 61, .32) !important;
  color: var(--danger, #be4a3d) !important;
}

/* Crown sub-tabs / gift sub-tabs — pill row */
.svc-crown-subtab, .svc-giftroom-subtab {
  background: rgba(0, 0, 0, .04);
  border: 1px solid var(--svc-line-soft);
  color: var(--text-secondary, #5f5c53);
}
.svc-crown-subtab:hover, .svc-giftroom-subtab:hover { color: var(--text-primary, #2a2925); }
.svc-crown-subtab.active, .svc-giftroom-subtab.active {
  background: var(--bg-card, #e1dfdc);
  border-color: var(--svc-line);
  color: var(--accent, #864e1e);
}
.svc-crown-icon-wrap { border-radius: 12px; }
.svc-crown-footer-note { color: var(--text-muted, #605b4d); }

/* Gift-room target selector */
.svc-giftroom-target {
  background: rgba(0, 0, 0, .03);
  border: 1px solid var(--svc-line-soft);
  border-radius: 10px;
}
.svc-giftroom-label { color: var(--text-secondary, #5f5c53); }
.svc-giftroom-select {
  background: var(--bg-input, #e1dfdc);
  border: 1px solid var(--svc-line);
  color: var(--text-primary, #2a2925);
}
.svc-giftroom-select:focus { border-color: var(--accent, #864e1e); }
.svc-giftroom-hint { color: var(--text-muted, #605b4d); }

/* Gift Room — inline result banner (success / failure after a gift). */
.svc-giftroom-status {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 12px 0 2px;
  padding: 9px 13px;
  border-radius: 10px;
  border: 1px solid transparent;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.35;
  animation: svcGiftStatusIn .18s ease-out;
}
.svc-giftroom-status:empty { display: none; }
.svc-giftroom-status--pending {
  background: rgba(122, 94, 18, .10);
  border-color: rgba(122, 94, 18, .26);
  color: #7a5e12;
}
.svc-giftroom-status--ok {
  background: rgba(62, 128, 84, .12);
  border-color: rgba(62, 128, 84, .32);
  color: var(--success, #3e8054);
}
.svc-giftroom-status--err {
  background: rgba(190, 74, 61, .12);
  border-color: rgba(190, 74, 61, .34);
  color: var(--danger, #be4a3d);
}
@keyframes svcGiftStatusIn { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }

/* ⚙️ Settings tab */
.svc-my-plan-card, .svc-my-badge-opt {
  background: var(--svc-card);
  border: 1px solid var(--svc-line);
}
.svc-my-plan-icon { text-shadow: none; }
.svc-my-plan-lbl { color: var(--text-secondary, #5f5c53); }
.svc-my-plan-chip {
  background: var(--bg-tertiary, #cac6be);
  border: 1px solid var(--svc-line-soft);
  color: var(--text-muted, #605b4d);
}
.svc-my-plan-chip--on {
  background: rgba(62, 128, 84, .14);
  color: var(--success, #3e8054);
  border-color: rgba(62, 128, 84, .3);
}
.svc-my-plan-exp, .svc-my-plan-empty, .svc-my-section-lbl,
.svc-my-badge-desc, .svc-my-badge-count-hint, .svc-my-no-badges {
  color: var(--text-muted, #605b4d);
}
.svc-my-badge-opt:hover {
  border-color: var(--svc-line);
  background: var(--bg-hover, #cecbc2);
}
.svc-my-badge-opt--on {
  border-color: var(--accent, #864e1e);
  background: var(--accent-glow, rgba(134, 78, 30, .12));
  box-shadow: 0 0 0 1px var(--accent, #864e1e);
}
.svc-my-badge-nm { color: var(--text-secondary, #5f5c53); }
.svc-my-badge-opt--on .svc-my-badge-nm,
.svc-my-badge-chk, .svc-my-badge-opt--on .svc-my-badge-chk { color: var(--accent, #864e1e); }
.svc-my-badge-save-btn {
  background: var(--accent-glow, rgba(134, 78, 30, .12));
  border: 1px solid var(--accent, #864e1e);
  color: var(--accent, #864e1e);
}
.svc-my-badge-save-btn:hover {
  background: var(--accent, #864e1e);
  color: #fff;
}
.svc-my-badge-status { color: var(--success, #3e8054); }

/* TC-coins wallet card (⚙️ Settings tab) — redundant with the header chip. */
.svc-my-wallet { display: none !important; }

/* Wallet chip — muted bronze, pushed to the far right of the header. */
.svc-wallet-chip-btn {
  margin-left: auto;
  background: rgba(154, 107, 0, .12);
  border-color: rgba(154, 107, 0, .38);
  color: #7a5500;
}
.svc-wallet-chip-btn:hover { background: rgba(154, 107, 0, .2); }

.svc-confirm-modal { background: rgba(24, 20, 14, .42); }
.svc-confirm-box {
  background: var(--bg-card, #e1dfdc);
  border: 1px solid var(--border, #c3beb3);
  box-shadow: 0 22px 56px -16px rgba(32, 24, 14, .44), var(--modal-ring, inset 0 0 0 1px rgba(0,0,0,.04));
}
.svc-confirm-title { color: var(--text-primary, #2a2925); }
.svc-confirm-body { color: var(--text-secondary, #5f5c53); }
.svc-confirm-cost { color: #7a5500; }
.svc-confirm-btn-cancel {
  background: rgba(0, 0, 0, .06);
  color: var(--text-primary, #2a2925);
}
.svc-confirm-btn-cancel:hover { background: rgba(0, 0, 0, .1); }
.svc-confirm-btn-ok { background: var(--accent, #864e1e); color: #fff; }
.svc-confirm-btn-ok:hover { filter: brightness(1.08); }

/* ── Top Up: method buttons + pay button (payments v2) ── */
.wallet-method-btn { flex-direction: column; gap: 4px; position: relative; }
.wallet-method-btn .wm-price { font-size: .8rem; font-weight: 800; opacity: .95; }
.wallet-method-btn:disabled { opacity: .4; cursor: not-allowed; filter: grayscale(.6); }
.wallet-method-btn.active { box-shadow: 0 0 0 2px currentColor inset; transform: translateY(-1px); }
.wallet-method-paypal { background: rgba(0, 112, 186, .12); border-color: rgba(0, 112, 186, .4); color: #fff; }
.wallet-method-paypal:hover { background: rgba(0, 112, 186, .22); border-color: #0070ba; }
[data-theme=daylight] .wallet-method-paypal { background: rgba(0, 112, 186, .08); color: #005a97; }
.wallet-method-wise { background: rgba(0, 181, 120, .12); border-color: rgba(0, 181, 120, .4); color: #fff; }
.wallet-method-wise:hover { background: rgba(0, 181, 120, .22); border-color: #00b578; }
[data-theme=daylight] .wallet-method-wise { background: rgba(0, 181, 120, .08); color: #007a4d; }
.wallet-pay-btn {
  width: 100%; margin-top: 12px; padding: 13px; border: 0; border-radius: 12px;
  font-weight: 800; font-size: .9rem; cursor: pointer; color: #1a1a1a;
  background: linear-gradient(90deg, gold, orange); transition: filter .15s;
}
.wallet-pay-btn:hover { filter: brightness(1.06); }
.wallet-pay-btn:disabled { opacity: .5; cursor: not-allowed; filter: grayscale(.5); }

/* ============================================================
   Landscape auth (sign-in / sign-up) — two-panel layout
   ============================================================ */
:root { --auth-card-width: 920px; }

/* Page + card canvas follow the active theme (matches in-app room modal) */
.auth-page { background: var(--bg-primary); }

.auth-card {
  display: flex;
  padding: 0;
  overflow: hidden;
  /* same canvas shade as the in-app room modal */
  background: var(--bg-card);
  border-color: var(--border);
}

/* Left brand / marketing panel */
.auth-brand {
  flex: 0 0 340px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 42px 34px;
  position: relative;
  background: var(--bg-card);
  border-right: 1px solid var(--border);
}
.auth-brand::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70% 50% at 18% 12%, rgba(var(--accent-rgb), .12), transparent 62%),
    radial-gradient(ellipse 65% 45% at 92% 100%, rgba(var(--accent-rgb), .06), transparent 58%);
}
.auth-brand-inner { position: relative; z-index: 1; }
.auth-brand-logo {
  width: 56px;
  height: 56px;
  object-fit: contain;
  margin-bottom: 22px;
  filter: drop-shadow(0 4px 16px rgba(var(--accent-rgb), .35));
}
.auth-brand-name {
  margin: 0 0 10px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: .13em;
  color: var(--text-primary);
}
.auth-brand-tagline {
  margin: 0 0 30px;
  max-width: 26ch;
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-secondary);
}
.auth-brand-features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.auth-brand-features li {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 500;
  color: var(--text-secondary);
}
.auth-brand-features svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-top: 1px;
  stroke: var(--accent);
  opacity: .95;
}
.auth-brand-foot {
  position: relative;
  z-index: 1;
  margin: 26px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-muted);
}

/* Right form panel */
.auth-main {
  flex: 1;
  min-width: 0;
  padding: 32px 40px 26px;
}
.auth-main .auth-logo { display: none; }

/* Floating-label notch matches the new card canvas */
.form-group.floating input:not([type=hidden]):focus ~ label,
.form-group.floating input:not([type=hidden]):not(:placeholder-shown) ~ label {
  background: var(--bg-card);
}

/* Softer "off-white" text instead of pure #fff — easier on the eyes
   (reduces halation/glare on dark canvas), follows the theme. */
.auth-main .form-group.floating input,
.auth-main .form-header h3,
.auth-brand-name {
  color: var(--text-primary);
}
.auth-error { color: var(--text-primary); }
.toggle-btn.active,
.btn-primary,
.mic-allow-btn { color: #eef0f4; }

/* Sign-up form: two-column grid so everything is visible at once */
@media (min-width: 901px) {
  #register-form.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 16px;
    row-gap: 13px;
    align-content: start;
  }
  #register-form.active > .form-group.floating:first-child,
  #register-form.active > .age-verify-row,
  #register-form.active > .btn-primary {
    grid-column: 1 / -1;
  }
}

/* Collapse to single-column card on smaller viewports */
@media (max-width: 900px) {
  :root { --auth-card-width: 440px; }
  .auth-card { display: block; }
  .auth-brand { display: none; }
  .auth-main { padding: 32px 32px 24px; }
  .auth-main .auth-logo { display: flex; }
}

/* ── "Who's watching me" — camera / screen viewer list ─────────────────────
   Web: a compact movable window (.svm-window), dragged by its header. Native
   reuses the inner .svm-row / .svm-avatar / .svm-empty parts inside its
   own #viewers-popout-view pop-out OS window. */
.svm-window {
  position: fixed; z-index: 2147483600;
  width: 224px; max-height: min(58vh, 440px);
  display: flex; flex-direction: column;
  background: var(--bg-card, var(--bg-elevated, var(--card-bg, #201f1c)));
  color: var(--text-primary, #f2efe9);
  border: 1px solid var(--border, rgba(255, 255, 255, .1));
  border-radius: 10px;
  box-shadow: 0 12px 32px -10px rgba(0, 0, 0, .5),
              var(--modal-ring, inset 0 0 0 1px rgba(255, 255, 255, .04));
  overflow: hidden;
  animation: svmPop .12s ease-out;
}
@keyframes svmPop { from { opacity: 0; transform: translateY(4px) } to { opacity: 1; transform: none } }
.svm-window-header {
  display: flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 3px 0 10px; flex-shrink: 0;
  border-bottom: 1px solid var(--border, rgba(255, 255, 255, .08));
  cursor: grab; user-select: none; -webkit-user-select: none; touch-action: none;
}
.svm-window-header:active { cursor: grabbing; }
.svm-title {
  flex: 1; min-width: 0; pointer-events: none;
  font-size: 10.5px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase;
  color: var(--text-secondary, #9c978e);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.svm-close {
  border: 0; background: transparent; cursor: pointer; flex-shrink: 0;
  color: var(--text-secondary, #9c978e); font-size: 12px; line-height: 1;
  width: 20px; height: 20px; border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s, color .12s;
}
.svm-close:hover { background: rgba(127, 127, 127, .16); color: var(--text-primary, #f2efe9); }
.svm-body { flex: 1; min-height: 0; padding: 3px; overflow-y: auto; }
.svm-list { display: flex; flex-direction: column; }
.svm-row {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 8px; border-radius: 6px;
}
.svm-row:hover { background: rgba(127, 127, 127, .1); }
.svm-avatar {
  width: 20px; height: 20px; flex: 0 0 20px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 9px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, var(--accent, #c9822f), #6d4bd0);
}
.svm-name {
  font-size: 12px; font-weight: 500; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.svm-empty {
  padding: 5px 8px 7px; font-size: 11px;
  color: var(--text-secondary, #8f8a82);
}

/* ===== All Members panel — modern redesign ===== */
.aml-modal { border-radius: 14px; }

.aml-modal-header {
  padding: 20px 20px 18px;
  background: linear-gradient(135deg, var(--accent) 0%, color-mix(in srgb, var(--accent) 42%, #000) 100%);
}

.aml-modal-icon {
  width: 36px; height: 36px; font-size: 17px; border-radius: 11px;
}

.aml-modal-heading h3 { font-size: 16.5px; letter-spacing: -0.2px; }

.aml-stats-row {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 12px 16px 0;
}

.aml-stat-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 10px 5px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 600; color: var(--text-secondary);
  background: var(--bg-tertiary); border: 1px solid var(--border);
  line-height: 1.3; white-space: nowrap;
}

.aml-stat-pill b { font-weight: 700; color: var(--text-primary); }

.aml-stat-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; display: inline-block;
}

.aml-stat-online .aml-stat-dot { background: var(--success); box-shadow: 0 0 6px rgba(var(--success-rgb), 0.65); }
.aml-stat-offline .aml-stat-dot { background: var(--text-muted); }
.aml-stat-new .aml-stat-dot { background: var(--warning); }
.aml-stat-banned .aml-stat-dot { background: var(--danger); }

.aml-toolbar { padding: 12px 16px 10px; }

.aml-filter-pills {
  display: flex; gap: 3px; padding: 3px;
  background: var(--bg-input); border: 1px solid var(--border);
  border-radius: 9px; overflow-x: auto; scrollbar-width: none;
}

.aml-filter-pills::-webkit-scrollbar { display: none; }

.aml-filter-pill {
  border: none; background: transparent; color: var(--text-secondary);
  font-size: 11.5px; font-weight: 600; padding: 5px 11px; border-radius: 7px;
  cursor: pointer; white-space: nowrap; font-family: var(--font-main);
  transition: background 0.15s ease, color 0.15s ease;
}

.aml-filter-pill:hover { color: var(--text-primary); background: var(--bg-hover); }

.aml-filter-pill.active {
  background: var(--accent); color: #fff;
  box-shadow: 0 2px 8px rgba(var(--accent-rgb), 0.4);
}

.aml-list {
  scrollbar-width: thin; scrollbar-color: var(--border-light) transparent;
}

.aml-list::-webkit-scrollbar { width: 8px; }
.aml-list::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 8px; }
.aml-list::-webkit-scrollbar-track { background: transparent; }

.aml-member-row {
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.aml-member-row:hover {
  background: var(--bg-hover);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16);
}

.aml-avatar-wrap {
  border-radius: 50%;
  box-shadow: 0 0 0 2px var(--ring-color, var(--border-light));
  transition: box-shadow 0.15s ease;
}

.aml-status-dot.aml-online {
  box-shadow: 0 0 0 2px var(--bg-tertiary), 0 0 6px rgba(var(--success-rgb), 0.7);
}

.aml-role-badge { border-radius: 999px; padding: 2px 9px; font-weight: 600; }

.aml-actions { opacity: 0.55; }
.aml-member-row:hover .aml-actions,
.aml-member-row:focus-within .aml-actions { opacity: 1; }

@media (hover: none) {
  .aml-actions { opacity: 0.85; }
}

.aml-action-btn { border-radius: 8px; transition: background 0.12s ease, transform 0.12s ease; }
.aml-action-btn:hover { transform: translateY(-1px); }

.aml-skeleton-list { display: flex; flex-direction: column; gap: 6px; padding: 2px 0; }

.aml-skel-row {
  display: flex; align-items: center; gap: 10px;
  padding: 9px; border-radius: 10px; border: 1px solid var(--border);
}

.aml-skel-avatar,
.aml-skel-line {
  border-radius: 6px;
  background: linear-gradient(90deg, var(--bg-tertiary) 25%, var(--bg-hover) 37%, var(--bg-tertiary) 63%);
  background-size: 400% 100%;
  animation: aml-shimmer 1.4s ease infinite;
}

.aml-skel-avatar { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; }
.aml-skel-lines { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.aml-skel-line { height: 8px; }
.aml-skel-line-1 { width: 42%; }
.aml-skel-line-2 { width: 65%; }

@keyframes aml-shimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

.aml-empty-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; padding: 44px 20px; text-align: center;
  flex: 1; min-height: 0;
}

.aml-empty-icon { font-size: 30px; opacity: 0.5; }

@media (max-width: 560px) {
  .aml-stats-row { padding: 10px 12px 0; }
  .aml-toolbar { padding: 10px 12px 8px; }
  .aml-list { padding: 2px 12px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .aml-skel-avatar, .aml-skel-line { animation: none; }
}

/* header spacing polish */
.aml-modal-header {
  padding: 22px 22px 20px;
  gap: 16px;
}

.aml-modal-heading { gap: 14px; }

.aml-modal-subtitle { margin-top: 4px; line-height: 1.45; }

.aml-modal-header-right { gap: 10px; }

.aml-stats-row { padding: 16px 20px 0; gap: 8px; }

.aml-toolbar { padding: 14px 20px 12px; }

.aml-list { padding: 2px 20px 16px; }

@media (max-width: 560px) {
  .aml-modal-header { padding: 18px 16px 16px; gap: 12px; }
}

/* member meta: joined date + IP/flag on their own line for consistent row height */
.aml-member-meta-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aml-member-meta-secondary {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 10px;
  color: var(--text-muted);
}

/* icon set */
.aml-icon { display: block; flex-shrink: 0; }

.aml-modal-icon { color: #fff; }

.aml-search-icon { display: flex; color: var(--text-muted); }

.aml-search-icon svg { display: block; }

.aml-action-btn { color: var(--text-secondary); }
.aml-action-btn:hover { color: var(--text-primary); }
.aml-btn-ban:hover,
.aml-btn-delete:hover { color: var(--danger); }
.aml-btn-unban:hover { color: var(--success); }

.aml-empty-icon {
  display: flex; color: var(--text-muted); opacity: 0.7;
}

.aml-room-chip {
  display: inline-flex; align-items: center; gap: 4px;
}

.aml-rooms-toggle .aml-icon,
.aml-room-chip .aml-icon { opacity: 0.85; }

/* per-action colors */
.aml-action-btn {
  background: transparent;
  transition: background 0.15s ease, color 0.15s ease, transform 0.12s ease, box-shadow 0.15s ease;
}

.aml-btn-dm { color: var(--accent); background: rgba(var(--accent-rgb), 0.12); }
.aml-btn-dm:hover { background: rgba(var(--accent-rgb), 0.22); color: var(--accent); box-shadow: 0 2px 8px rgba(var(--accent-rgb), 0.3); }

.aml-btn-pass { color: #a78bfa; background: rgba(167, 139, 250, 0.12); }
.aml-btn-pass:hover { background: rgba(167, 139, 250, 0.22); color: #a78bfa; box-shadow: 0 2px 8px rgba(167, 139, 250, 0.3); }

.aml-btn-nick { color: #22b8c4; background: rgba(34, 184, 196, 0.12); }
.aml-btn-nick:hover { background: rgba(34, 184, 196, 0.22); color: #22b8c4; box-shadow: 0 2px 8px rgba(34, 184, 196, 0.3); }

.aml-btn-uname { color: #ec4899; background: rgba(236, 72, 153, 0.12); }
.aml-btn-uname:hover { background: rgba(236, 72, 153, 0.22); color: #ec4899; box-shadow: 0 2px 8px rgba(236, 72, 153, 0.3); }

.aml-btn-coins { color: #eab308; background: rgba(234, 179, 8, 0.14); }
.aml-btn-coins:hover { background: rgba(234, 179, 8, 0.24); color: #eab308; box-shadow: 0 2px 8px rgba(234, 179, 8, 0.32); }

.aml-member-coins {
  display: inline-flex; align-items: center; gap: 3px;
  font-variant-numeric: tabular-nums;
  color: var(--text-secondary);
  background: rgba(234, 179, 8, 0.14);
  border: 1px solid rgba(234, 179, 8, 0.28);
  border-radius: 999px;
  padding: 1px 7px;
}

.aml-btn-role { color: #f5a623; background: rgba(245, 166, 35, 0.14); }
.aml-btn-role:hover { background: rgba(245, 166, 35, 0.24); color: #f5a623; box-shadow: 0 2px 8px rgba(245, 166, 35, 0.32); }

.aml-btn-addch { color: var(--success); background: rgba(var(--success-rgb), 0.12); }
.aml-btn-addch:hover { background: rgba(var(--success-rgb), 0.22); color: var(--success); box-shadow: 0 2px 8px rgba(var(--success-rgb), 0.3); }

.aml-btn-remch { color: #f97316; background: rgba(249, 115, 22, 0.12); }
.aml-btn-remch:hover { background: rgba(249, 115, 22, 0.22); color: #f97316; box-shadow: 0 2px 8px rgba(249, 115, 22, 0.3); }

.aml-btn-ban { color: var(--danger); background: rgba(var(--danger-rgb), 0.12); }
.aml-btn-ban:hover { background: rgba(var(--danger-rgb), 0.24); color: var(--danger); box-shadow: 0 2px 8px rgba(var(--danger-rgb), 0.32); }

.aml-btn-unban { color: var(--success); background: rgba(var(--success-rgb), 0.12); }
.aml-btn-unban:hover { background: rgba(var(--success-rgb), 0.24); color: var(--success); box-shadow: 0 2px 8px rgba(var(--success-rgb), 0.32); }

.aml-btn-delete { color: var(--danger); background: rgba(var(--danger-rgb), 0.14); }
.aml-btn-delete:hover { background: rgba(var(--danger-rgb), 0.28); color: var(--danger); box-shadow: 0 2px 8px rgba(var(--danger-rgb), 0.35); }

.aml-action-btn:hover { transform: translateY(-1px) scale(1.06); }

/* ── All Members: visibility hardening ──
   .aml-member-row never sets its own background (it inherits --bg-tertiary),
   which on light themes (daylight / cloudy) is ~identical to the modal's
   --bg-card — rows, default avatars and the faint action bar all vanish.
   Ink the surfaces relative to --text-primary so they read on every theme. */
.aml-member-row {
  background: color-mix(in srgb, var(--text-primary) 6%, var(--bg-card));
  border: 1px solid color-mix(in srgb, var(--text-primary) 14%, transparent);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.aml-member-row:hover {
  background: color-mix(in srgb, var(--text-primary) 12%, var(--bg-card));
  border-color: color-mix(in srgb, var(--text-primary) 22%, transparent);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16);
}
.aml-avatar-default {
  background: color-mix(in srgb, var(--text-primary) 12%, var(--bg-card));
  color: var(--text-primary);
}
.aml-avatar-wrap {
  box-shadow: 0 0 0 2px var(--ring-color, color-mix(in srgb, var(--text-primary) 20%, transparent));
}
.aml-member-name { color: var(--text-primary); }
.aml-actions { opacity: 1; }

/* ── Cancel pending friend request affordances ── */
.add-friend-action-btn.state-pending[data-event="cancel-friend-request"] { cursor: pointer; opacity: .85; }
.add-friend-action-btn.state-pending[data-event="cancel-friend-request"]:hover { color: #ff6b6b; border-color: #ff6b6b; opacity: 1; }
.dm-float-btn-addfriend[data-state="pending_sent"] { cursor: pointer; }
.dm-float-btn-addfriend[data-state="pending_sent"]:hover { color: #ff6b6b; transform: scale(1.08); }

/* ═══════════════════════════════════════════════════════════════════════════
   MOBILE LAYOUT POLISH — 2026-09  (web app only)
   One consolidated layer for phone/tablet. Appended last so it wins over the
   older scattered @media rules without editing them. Everything is gated behind
   max-width media queries — the desktop layout is untouched.
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Slide-in drawers: opaque active foreground, above the scrim ────────── */
  .sidebar,
  .right-sidebar {
    margin: 0 !important;
    height: 100dvh !important;
    width: min(86vw, 340px) !important;
    min-width: 0 !important;
    max-width: none !important;
    /* an open full-height drawer is the active surface — solid, not glass:
       backdrop-filter here only samples the dark scrim behind it and makes the
       whole panel read as greyed-out/disabled */background: color-mix(in srgb, var(--text-primary) 5%, var(--bg-card)) !important;
    z-index: 1050 !important;
    overscroll-behavior: contain;
    transition: transform .25s cubic-bezier(.4, 0, .2, 1) !important;
  }
  .sidebar {
    border-radius: 0 18px 18px 0;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .05), 14px 0 48px rgba(0, 0, 0, .55);
    padding-left: env(safe-area-inset-left, 0);
  }
  .right-sidebar {
    border-radius: 18px 0 0 18px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .05), -14px 0 48px rgba(0, 0, 0, .55);
    padding-right: env(safe-area-inset-right, 0);
  }
  .right-sidebar.collapsed {
    transform: translateX(100%) !important;
    opacity: 1 !important;
  }
  #app-body.mobile-right-open .right-sidebar,
  #app-body.mobile-right-open .right-sidebar.collapsed {
    transform: translateX(0) !important;
    width: min(86vw, 340px) !important;
    min-width: 0 !important;
  }
  .sidebar-header {
    padding-top: max(16px, env(safe-area-inset-top, 0));
  }
  /* calm the always-on decorative motion on mobile */
  .brand::after,
  .sidebar-brand-logo {
    animation: none !important;
  }
  /* bottom icon bar — comfortable tap targets */
  .sidebar-bottom-bar {
    gap: 8px;
    padding: 8px 12px max(8px, env(safe-area-inset-bottom, 0));
    flex-wrap: wrap;
  }
  .sidebar-bottom-btn {
    min-width: 40px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* ── Dim scrim: full-strength black, and always just BELOW the drawer ───── */
  .mobile-overlay {
    background: rgba(0, 0, 0, .5);
    z-index: 1040 !important;
  }

  /* ── Channel header: flush to the screen edges, flat ───────────────────── */
  .channel-header {
    margin: 0 !important;
    border-radius: 0 !important;
    border-width: 0 0 1px 0 !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .25) !important;padding-top: max(8px, env(safe-area-inset-top, 0)) !important;
  }

  /* ── Room pop-out window ────────────────────────────────────────────────────
     Kill backdrop-filter on the room modal in BOTH states. On mobile it never
     needs the glass (full-screen sheet = opaque; minimized = a tiny bar), and a
     backdrop-filter element is a composited layer that Chromium paints OVER
     higher-z-index siblings — that is exactly what greys out / blocks the open
     left drawer while a room window is up. (Same rationale as the pinned-media
     top-layer fix.) */
  .room-float-modal,
  .dm-float-modal {}

  /* ── Room pop-out window → true full-screen sheet (not when minimized) ──── */
  .room-float-modal:not(.room-float-minimized) {
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100dvw !important;
    height: 100dvh !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    transform: none !important;
    border-radius: 0 !important;
    overscroll-behavior: contain;
    background: var(--bg-card) !important;
  }
  /* ── Full-screen room header → maximally compact on phones ──────────────────
     One tight 44px row: small icon · room name · online count · minimize · close.
     Category badge, meta divider, owner/camera/hand chips, favourite + pop-out
     buttons are all dropped — they're noise on a phone and steal the row. */
  .room-float-modal:not(.room-float-minimized) .room-float-header {
    border-radius: 0 !important;
    min-height: 0 !important;
    height: calc(44px + env(safe-area-inset-top, 0px)) !important;
    padding: env(safe-area-inset-top, 0px) 6px 0 8px !important;
    gap: 7px !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-icon {
    width: 26px !important;
    height: 26px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-title {
    gap: 6px !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-roomname {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: -.01em !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-subtitle,
  .room-float-modal:not(.room-float-minimized) .room-float-cat-badge,
  .room-float-modal:not(.room-float-minimized) .room-float-meta-divider,
  .room-float-modal:not(.room-float-minimized) .room-float-chip-owner,
  .room-float-modal:not(.room-float-minimized) [id^="room-float-camera-count-"],
  .room-float-modal:not(.room-float-minimized) [id^="room-float-hand-count-"],
  .room-float-modal:not(.room-float-minimized) .room-float-btn-favorite,
  .room-float-modal:not(.room-float-minimized) .room-float-btn-popout {
    display: none !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-chips {
    gap: 0 !important;
    flex: 0 0 auto !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-chips .room-float-chip {
    padding: 2px 7px !important;
    font-size: 10px !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-actions {
    gap: 0 !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-actions .room-float-btn {
    width: 30px !important;
    height: 30px !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-float-input-area {
    padding-bottom: max(10px, env(safe-area-inset-bottom, 0)) !important;
  }
  .room-float-sidebar {
    width: min(86vw, 340px) !important;
    border-radius: 0 !important;
  }
  .room-float-mobile-overlay {
    border-radius: 0 !important;
    background: rgba(0, 0, 0, .5);
  }

  /* ── Room menu bar → kept on phones as a slim scrollable strip ───────────
     It used to be `display:none` on mobile. Restore it in its natural DOM
     slot (right under the header) but hold it to one ~30px line and let the
     items — File · View · Rooms · Tools · Help · 👑 · ✉️ · ✨ — scroll
     sideways rather than wrap or run off the screen. */
  .room-float-modal:not(.room-float-minimized) .room-menubar {
    display: flex !important;
    height: 30px !important;
    min-height: 30px !important;
    flex: 0 0 auto !important;
    padding: 0 4px !important;
    gap: 1px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-menubar::-webkit-scrollbar {
    display: none !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-menu-item {
    flex: 0 0 auto !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-menu-label {
    font-size: 11px !important;
    padding: 3px 7px !important;
    height: 24px !important;
  }
  /* the bar scrolls horizontally, so pin open dropdowns to the viewport just
     below the header + bar instead of letting a rightmost menu overflow off-
     screen (header is 44px + safe-area, this strip is 30px). */
  .room-float-modal:not(.room-float-minimized) .room-menu-dropdown {
    position: fixed !important;
    top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    right: 8px !important;
    min-width: 0 !important;
    max-height: 60vh !important;
    overflow-y: auto !important;
  }
  /* Services is relocated by JS onto the toolbar, right after Trivia, on
     phones — dress it as a gold chip so it sits with the game buttons. */
  .room-float-modal:not(.room-float-minimized) .room-toolbar .room-menu-services-item {
    flex: 0 0 auto !important;
    margin-left: 2px !important;
  }
  .room-float-modal:not(.room-float-minimized) .room-toolbar .room-menu-label-services {
    height: 32px !important;
    padding: 0 10px !important;
    border-radius: 9px !important;
    background: rgba(255, 215, 0, .1) !important;
    border: 1px solid rgba(255, 215, 0, .28) !important;
  }

  /* ── Room toolbar → clean icon-only rail on mobile ─────────────────────── */
  .room-toolbar {
    justify-content: safe center;
    gap: 4px !important;
    height: auto !important;
    padding: 7px max(8px, env(safe-area-inset-right, 0)) 7px max(8px, env(safe-area-inset-left, 0)) !important;
    background: rgba(0, 0, 0, .18);
  }
  .room-toolbar-btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
    padding: 0 !important;
    max-width: none !important;
    border-radius: 9px;
    justify-content: center;
    gap: 0;
  }
  .room-toolbar-btn:active {
    transform: scale(.9);
  }
  .room-toolbar-btn .room-toolbar-label,
  .room-toolbar-btn .room-view-screen-label {
    display: none !important;
  }
  .room-toolbar-icon {
    font-size: 17px;
  }
  .room-toolbar-icon-img {
    width: 17px;
    height: 17px;
  }
  .room-toolbar-separator {
    height: 22px;
    margin: 0 3px;
    background: rgba(255, 255, 255, .12);
  }

  /* ── Settings modal → full-screen on mobile ────────────────────────────── */
  .modal.modal-settings {
    inset: 0 !important;
    width: 100dvw !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }

  /* ── Hide channel-header actions that don't belong on phones ───────────────
     Camera / Share Screen / Join Room / mobile Members button. IDs (plus
     !important) to beat the several .mobile-users-btn { display:flex!important }
     rules that otherwise force the members button visible. */
  #voice-cam-btn,
  #screen-share-btn,
  #header-join-room-btn,
  #mobile-users-btn {
    display: none !important;
  }

  /* ── Mobile hamburger → black icon (beats .mobile-menu-btn svg{stroke:#fff}) */
  #mobile-menu-btn {
    color: #000 !important;
  }
  #mobile-menu-btn svg {
    stroke: #000 !important;
  }

  /* ── Minimized room window → compact docked pill ─────────────────────────────
     On phones the desktop 200×40 tab (anchored bottom, spaced 204px apart via an
     inline `left` from _repositionMinimizedTabs) runs off-screen the moment a
     second room is minimized. Re-anchor it here: fixed 8px from the left, stacked
     upward one 52px row per room using `--min-i` (0-based index that JS sets).
     Everything is !important to beat the base rule's !important width/height/bottom.
     Colours use rgba(var(--*-rgb)) — not color-mix — for old-webview support. */
  .room-float-modal.room-float-minimized {
    left: 8px !important;
    right: auto !important;
    top: auto !important;
    bottom: calc(8px + (var(--min-i, 0) * 52px)) !important;
    transform: none !important;
    width: 64vw !important;
    min-width: 176px !important;
    max-width: 244px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    margin-bottom: env(safe-area-inset-bottom, 0px);
    padding: 0 !important;
    border-radius: 23px !important;
    background:
      linear-gradient(180deg,
        rgba(var(--room-accent-rgb, var(--accent-rgb, 124, 92, 252)), .16),
        rgba(var(--room-accent-rgb, var(--accent-rgb, 124, 92, 252)), .07)),
      var(--bg-card) !important;
    border: 1px solid rgba(var(--room-accent-rgb, var(--accent-rgb, 124, 92, 252)), .42) !important;
    box-shadow:
      0 12px 30px rgba(0, 0, 0, .38),
      0 3px 8px rgba(0, 0, 0, .26),
      inset 0 1px 0 rgba(255, 255, 255, .08) !important;
    overflow: visible !important;
    transition: transform .14s ease, box-shadow .2s ease, bottom .22s ease !important;
  }
  .room-float-modal.room-float-minimized:active {
    transform: scale(.96) !important;
  }
  .room-float-modal.room-float-minimized:hover {
    box-shadow:
      0 14px 34px rgba(0, 0, 0, .44),
      0 3px 8px rgba(0, 0, 0, .26),
      0 0 0 1px rgba(var(--room-accent-rgb, var(--accent-rgb, 124, 92, 252)), .6) !important;
  }

  .room-float-modal.room-float-minimized .room-float-header {
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 6px 0 7px !important;
    border-radius: 23px !important;
    background: transparent !important;
    border-bottom: none !important;
    gap: 9px !important;
  }

  .room-float-modal.room-float-minimized .room-float-icon-wrap { display: flex !important; }
  .room-float-modal.room-float-minimized .room-float-icon {
    width: 30px !important;
    height: 30px !important;
    font-size: 13px !important;
    border-radius: 9px !important;
  }

  .room-float-modal.room-float-minimized .room-float-roomname {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: -.01em !important;
    color: var(--text-primary, #1c1c22) !important;
  }

  /* strip everything that doesn't fit the pill */
  .room-float-modal.room-float-minimized .room-float-cat-badge,
  .room-float-modal.room-float-minimized .room-float-subtitle,
  .room-float-modal.room-float-minimized .room-float-chips,
  .room-float-modal.room-float-minimized .room-float-meta-divider,
  .room-float-modal.room-float-minimized .room-float-btn-favorite,
  .room-float-modal.room-float-minimized .room-float-btn-popout {
    display: none !important;
  }

  /* actions → a single round close button */
  .room-float-modal.room-float-minimized .room-float-actions {
    gap: 0 !important;
    margin-left: 1px !important;
  }
  .room-float-modal.room-float-minimized .room-float-btn-close {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    color: var(--text-secondary, #6b6b78) !important;
  }
  .room-float-modal.room-float-minimized .room-float-btn-close:hover {
    background: rgba(239, 68, 68, .16) !important;
    color: #f87171 !important;
  }

  /* unread count → tucked onto the room icon */
  .room-float-modal.room-float-minimized .room-float-unread-dot {
    top: -5px !important;
    left: 21px !important;
    right: auto !important;
    min-width: 16px !important;
    height: 16px !important;
    font-size: 9px !important;
    padding: 0 4px !important;
    border: 2px solid var(--bg-card, #fff) !important;
  }

  /* ── Hide the desktop-download banner on phones ─────────────────────────── */
  .desktop-download-banner {
    display: none !important;
  }
}

/* ── Room list avatar: default fill = the surface it sits on ────────────────
   When a room has no owner sub-colour the avatar tile blends into the panel
   instead of reading as an accent chip. Match the modal canvas (var(--bg-card)).
   Higher-specificity selector so it wins over the plain .room-list-item-avatar
   background rules. */
.room-list-item .room-list-item-avatar {
  background: var(--bg-card);
  color: var(--text-secondary);
}

/* ── Settings nav: stay visible on phones as a horizontal tab strip ──────── */
@media (max-width: 640px) {
  .settings-layout {
    flex-direction: column;
  }
  #settings-nav.settings-nav {
    display: flex !important;
    flex-direction: row;
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    gap: 4px;
    padding: 8px 10px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    border-right: none;
    border-bottom: 1px solid var(--border);
    background: var(--bg-secondary);
  }
  #settings-nav.settings-nav::-webkit-scrollbar { display: none; }
  #settings-nav .settings-nav-group { display: none; }
  #settings-nav .settings-nav-item {
    flex: 0 0 auto;
    white-space: nowrap;
    margin-bottom: 0;
    padding: 7px 12px;
  }
  .settings-body [id^="section-"] {
    scroll-margin-top: 12px;
  }
}

@media (max-width: 480px) {
  /* generic modals → bottom sheet (centered overlay becomes bottom-anchored) */
  .modal-overlay {
    align-items: flex-end;
  }
  .modal {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    max-height: 90dvh !important;
    resize: none !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0)) !important;
    animation: slideUpSheet .2s ease;
  }
  /* dense full-screen modals keep their own shell */
  .modal.modal-settings,
  .modal.modal-activities {
    border-radius: 0 !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    padding-bottom: 0 !important;
    animation: none;
  }
  /* keep the confirm/cancel row reachable in a long sheet */
  .modal .modal-actions {
    position: sticky;
    bottom: 0;
    background: var(--bg-card);
    margin: 16px -20px 0;
    padding: 14px 20px calc(14px + env(safe-area-inset-bottom, 0));
    z-index: 4;
  }

  /* messages + composer respect notches in landscape */
  .messages {
    padding-left: max(8px, env(safe-area-inset-left, 0));
    padding-right: max(8px, env(safe-area-inset-right, 0));
  }
  .message-input-area {
    padding-left: max(8px, env(safe-area-inset-left, 0));
    padding-right: max(8px, env(safe-area-inset-right, 0));
  }
}

/* ============================================================
   Emoji picker — personal Favorites star
   ============================================================ */
.emoji-item.has-fav-star{position:relative}
.emoji-fav-star{position:absolute;top:-3px;right:-3px;width:15px;height:15px;display:flex;align-items:center;justify-content:center;font-size:11px;line-height:1;color:#f5b301;opacity:0;cursor:pointer;background:var(--bg-card,var(--bg-secondary));border:1px solid var(--border);border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:opacity .12s ease,transform .12s ease;z-index:3}
.emoji-item.has-fav-star:hover .emoji-fav-star,.emoji-fav-star.is-fav{opacity:1}
.emoji-fav-star:hover{transform:scale(1.22)}
.emoji-fav-star.is-fav{color:#f5b301;border-color:rgba(245,179,1,.5)}

/* ============================================================
   Emoji Management modal — modern layout
   ============================================================ */
#emoji-modal .modal.emoji-mgr{width:min(720px,94vw);max-width:none;margin:0 auto;padding:0;display:flex;flex-direction:column;max-height:88vh;overflow:hidden;border-radius:var(--radius-lg,16px)}
#emoji-modal .emoji-mgr [hidden]{display:none!important}

.emoji-mgr-head{display:flex;align-items:center;gap:14px;padding:20px 24px;border-bottom:1px solid var(--border)}
.emoji-mgr-head-icon{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:22px;border-radius:12px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.22),rgba(var(--accent-rgb),.08));border:1px solid rgba(var(--accent-rgb),.25)}
.emoji-mgr-head-text{flex:1;min-width:0}
.emoji-mgr-head-text h3{margin:0;font-size:16px;font-weight:700;color:var(--text-primary);letter-spacing:-.01em}
.emoji-mgr-head-text p{margin:3px 0 0;font-size:12px;line-height:1.45;color:var(--text-muted)}
.emoji-mgr-count{flex-shrink:0;align-self:flex-start;font-size:11px;font-weight:600;color:var(--text-secondary);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:999px;padding:4px 10px;white-space:nowrap}

.emoji-mgr-body{flex:1;min-height:0;overflow-y:auto;padding:20px 24px;display:flex;flex-direction:column;gap:20px}
.emoji-mgr-body::-webkit-scrollbar{width:10px}
.emoji-mgr-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:999px;border:3px solid transparent;background-clip:content-box}
.emoji-mgr-body::-webkit-scrollbar-thumb:hover{background:var(--text-muted);background-clip:content-box}

.emoji-mgr-dropzone{display:flex;flex-direction:column;align-items:center;gap:4px;padding:22px;text-align:center;cursor:pointer;border:1.5px dashed var(--border);border-radius:14px;background:var(--bg-tertiary);transition:border-color .18s ease,background .18s ease,transform .18s ease}
.emoji-mgr-dropzone:hover{border-color:var(--accent);background:rgba(var(--accent-rgb),.06);transform:translateY(-1px)}
.emoji-mgr-dropzone-icon{font-size:24px;line-height:1}
.emoji-mgr-dropzone-title{font-size:13px;font-weight:600;color:var(--text-primary)}
.emoji-mgr-dropzone-hint{font-size:11.5px;color:var(--text-muted)}

.emoji-mgr-crop-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--bg-tertiary);border:1px solid var(--border)}
.emoji-mgr-crop-row img{width:40px;height:40px;border-radius:9px;object-fit:cover;border:1px solid var(--border)}
.emoji-mgr-crop-row .settings-hint{flex:1;font-size:12px;margin:0}

.emoji-mgr-section{display:flex;flex-direction:column;gap:12px}
.emoji-mgr-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.emoji-mgr-section-title{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted)}

/* Category manager */
.emoji-cat-manager{display:flex;flex-direction:column;gap:6px}
.emoji-cat-manager:empty{display:none}
.emoji-cat-row{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:11px;background:var(--bg-tertiary);border:1px solid var(--border);transition:border-color .15s ease,background .15s ease}
.emoji-cat-row:hover{border-color:var(--text-muted)}
.emoji-cat-row-icon{width:26px;height:26px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;border-radius:8px;background:var(--bg-secondary);border:1px solid var(--border)}
.emoji-cat-row-icon .emoji-tab-icon{width:18px;height:18px;margin:0;object-fit:contain}
.emoji-cat-name-input{flex:1;min-width:0;padding:6px 9px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text-primary);font-size:13px;font-weight:600;transition:border-color .15s ease,background .15s ease}
.emoji-cat-name-input:hover{background:var(--bg-secondary)}
.emoji-cat-name-input:focus{outline:0;border-color:var(--accent);background:var(--bg-primary)}
.emoji-cat-row>button{width:28px;height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;font-size:12px;line-height:1;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}
.emoji-cat-row:hover>button{border-color:var(--border);background:var(--bg-secondary)}
.emoji-cat-row>button:hover:not(:disabled){color:var(--text-primary);border-color:var(--accent);background:var(--bg-hover)}
.emoji-cat-row>button:disabled{opacity:.3;cursor:default}
.emoji-cat-row>.emoji-cat-del:hover:not(:disabled){color:#fff;background:var(--danger);border-color:var(--danger)}
.emoji-cat-add-wrap{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.emoji-cat-add-wrap[hidden]{display:none}
.emoji-cat-add-wrap input{flex:1;min-width:160px;max-width:260px;padding:8px 11px;border:1px solid var(--border);border-radius:9px;background:var(--bg-primary);color:var(--text-primary);font-size:13px}
.emoji-cat-add-wrap input:focus{outline:0;border-color:var(--accent)}

/* Library search bar (sits in the section header) */
.emoji-mgr-section .emoji-search-bar{flex:0 1 260px;margin:0;padding:7px 12px;border-radius:9px}
.emoji-mgr-section .emoji-search-bar .emoji-search-input{font-size:13px}

/* Emoji library list */
.emoji-mgr-list{display:flex;flex-direction:column;gap:6px;max-height:340px;overflow-y:auto;padding:4px;border-radius:12px;background:var(--bg-secondary);border:1px solid var(--border)}
.emoji-mgr-list::-webkit-scrollbar{width:9px}
.emoji-mgr-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:999px;border:2px solid transparent;background-clip:content-box}
.emoji-mgr-empty{text-align:center;padding:40px 20px;color:var(--text-muted);margin:0}
.emoji-mgr-list .custom-sound-item{margin:0;padding:8px 10px;gap:10px;border-radius:10px;border:1px solid transparent;background:transparent;box-shadow:none;transform:none;transition:background .14s ease,border-color .14s ease}
.emoji-mgr-list .custom-sound-item:hover{background:var(--bg-tertiary);border-color:var(--border);transform:none;box-shadow:none}
.emoji-mgr-list .custom-emoji-preview{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;flex-shrink:0;border-radius:8px;background:var(--bg-primary);border:1px solid var(--border);padding:3px;box-shadow:none;object-fit:contain}
.emoji-mgr-list .emoji-item-info{gap:3px}
.emoji-mgr-list .custom-sound-name{font-size:12.5px;font-weight:600}
.emoji-mgr-list .emoji-item-controls{opacity:.55;transition:opacity .14s ease}
.emoji-mgr-list .custom-sound-item:hover .emoji-item-controls,.emoji-mgr-list .emoji-cat-dropdown.open{opacity:1}

.emoji-mgr-foot{margin:0;padding:14px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}

@media (max-width:560px){
  #emoji-modal .modal.emoji-mgr{width:100vw;max-height:100vh;border-radius:0}
  .emoji-mgr-head,.emoji-mgr-body,.emoji-mgr-foot{padding-left:16px;padding-right:16px}
  .emoji-mgr-section .emoji-search-bar{flex-basis:100%}
  .emoji-mgr-list .emoji-item-controls{opacity:1}
}

/* ============================================================
   Settings ▸ Admin ▸ TURN / Voice Relay  (v3.7.93)
   ============================================================ */
#section-turn .turn-panel{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:16px;
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:14px;
}
#section-turn .turn-panel__head{
  display:flex;
  align-items:center;
  gap:12px;
}
#section-turn .turn-panel__icon{
  flex:0 0 auto;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  color:var(--accent);
  background:rgba(var(--accent-rgb),.14);
}
#section-turn .turn-panel__titles{
  flex:1;
  min-width:0;
}
#section-turn .turn-panel__title{
  margin:0;
  font-family:var(--font-heading);
  font-size:14px;
  font-weight:700;
  letter-spacing:.2px;
  color:var(--text-primary);
}
#section-turn .turn-panel__sub{
  margin:3px 0 0;
  font-size:11.5px;
  line-height:1.45;
  color:var(--text-secondary);
}
#section-turn .turn-status-pill{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px 4px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
  color:var(--text-secondary);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
}
#section-turn .turn-status-pill::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:currentColor;
}
#section-turn .turn-status-pill[data-state="active"]{
  color:var(--success);
  background:rgba(var(--success-rgb),.12);
  border-color:rgba(var(--success-rgb),.4);
}
#section-turn .turn-status-pill[data-state="stun"]{
  color:var(--warning);
  background:rgba(250,166,26,.12);
  border-color:rgba(250,166,26,.4);
}
#section-turn .turn-note{
  margin:0;
  font-size:11.5px;
  line-height:1.55;
  color:var(--text-muted);
}
#section-turn .turn-panel code{
  font-family:var(--font-mono);
  font-size:.9em;
  padding:1px 5px;
  border-radius:5px;
  color:var(--text-secondary);
  background:var(--bg-input);
  border:1px solid var(--border);
}
#section-turn .turn-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
#section-turn .turn-field__label{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
#section-turn .turn-field__label label{
  font-size:12px;
  font-weight:600;
  color:var(--text-primary);
}
#section-turn .turn-field__tag{
  font-size:10.5px;
  color:var(--text-muted);
}
#section-turn .turn-field__tag code{
  padding:0 3px;
  font-size:.92em;
}
#section-turn .turn-src-chip{
  margin-left:auto;
  padding:2px 7px;
  border-radius:999px;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:var(--text-muted);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
}
#section-turn .turn-src-chip:empty{
  display:none;
}
#section-turn .turn-src-chip[data-src="saved"]{
  color:var(--accent);
  background:rgba(var(--accent-rgb),.12);
  border-color:rgba(var(--accent-rgb),.4);
}
#section-turn .turn-input{
  width:100%;
  box-sizing:border-box;
  padding:9px 11px;
  font-family:var(--font-main);
  font-size:13px;
  color:var(--text-primary);
  background:var(--bg-input);
  border:1px solid var(--border);
  border-radius:9px;
  outline:none;
  transition:border-color var(--transition),box-shadow var(--transition);
}
#section-turn .turn-input::placeholder{
  color:var(--text-muted);
}
#section-turn .turn-input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-glow);
}
#section-turn .turn-input--mono{
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.5;
  min-height:64px;
  resize:vertical;
}
#section-turn .turn-hint{
  font-size:11px;
  line-height:1.55;
  color:var(--text-muted);
}
#section-turn .turn-fieldset{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:16px 12px 12px;
  border:1px solid var(--border);
  border-radius:11px;
  background:var(--bg-primary);
}
#section-turn .turn-fieldset__legend{
  position:absolute;
  top:0;
  left:12px;
  transform:translateY(-50%);
  padding:2px 8px;
  font-size:10px;
  font-weight:700;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:var(--text-secondary);
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:6px;
}
#section-turn .turn-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:10px;
}
#section-turn .turn-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}
#section-turn .turn-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:8px 14px;
  font-family:var(--font-main);
  font-size:12.5px;
  font-weight:600;
  border:1px solid transparent;
  border-radius:9px;
  cursor:pointer;
  transition:transform .12s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
#section-turn .turn-btn svg{
  flex:0 0 auto;
}
#section-turn .turn-btn:active{
  transform:scale(.97);
}
#section-turn .turn-btn:disabled{
  opacity:.6;
  cursor:progress;
  transform:none;
}
#section-turn .turn-btn--primary{
  color:#fff;
  background:linear-gradient(135deg,var(--accent) 0,var(--accent-dim) 100%);
  box-shadow:0 4px 12px var(--accent-glow);
}
#section-turn .turn-btn--primary:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 18px var(--accent-glow);
}
#section-turn .turn-btn--ghost{
  color:var(--text-primary);
  background:var(--bg-tertiary);
  border-color:var(--border);
}
#section-turn .turn-btn--ghost:hover{
  background:var(--bg-hover);
  border-color:var(--accent);
}
#section-turn .turn-btn--muted{
  color:var(--text-muted);
  background:transparent;
}
#section-turn .turn-btn--muted:hover{
  color:var(--danger);
  background:rgba(var(--danger-rgb),.1);
}
#section-turn .turn-save-msg{
  font-size:11px;
  font-weight:500;
}
#section-turn .turn-test-result{
  padding:10px 12px;
  font-family:var(--font-mono);
  font-size:11.5px;
  line-height:1.55;
  white-space:pre-wrap;
  color:var(--text-secondary);
  background:var(--bg-input);
  border:1px solid var(--border);
  border-left:3px solid var(--accent);
  border-radius:9px;
}


/* ============================================================
   Settings — UI Refresh  (v3.7.94)
   Modernises the modal shell (header, nav rail, body) and every
   section that still uses the plain toggle-row / select-row /
   admin-settings primitives, bringing them in line with the
   card language already used by App / TURN / Audit / Force-Update.
   Everything is scoped under .modal-settings and kept at class
   specificity so per-theme overrides keep the upper hand, and
   the mobile @media rules (which use !important) still win.
   ============================================================ */

/* ---- Shell ------------------------------------------------- */
.modal.modal-settings{
  max-width:768px;
  border-radius:16px;
  box-shadow:0 28px 70px -18px rgba(0,0,0,.55);
}
.modal-settings .settings-layout{ background:var(--bg-card); }

.modal-settings .settings-header{
  padding:15px 20px;
  background:var(--bg-card);
  background:color-mix(in srgb, var(--bg-card) 86%, transparent);border-bottom:1px solid var(--border);
}
.modal-settings .settings-header h3{ font-size:16px; letter-spacing:.2px; }
.modal-settings .settings-close-btn{ border-radius:9px; }
.modal-settings .settings-close-btn:hover{ transform:none; }

/* ---- Nav rail -------------------------------------------- */
.modal-settings .settings-nav{
  width:194px; min-width:194px;
  padding:12px 10px;
  background:var(--bg-secondary);
  border-right:1px solid var(--border);
  scrollbar-width:thin;
}
.modal-settings .settings-nav::-webkit-scrollbar{ width:6px; }
.modal-settings .settings-nav::-webkit-scrollbar-thumb{
  background:var(--border-light,var(--border)); border-radius:3px;
}
.modal-settings .settings-nav-group{
  font-weight:700;
  letter-spacing:.09em;
  color:var(--text-muted);
  padding:15px 10px 6px;
}
.modal-settings .settings-nav-group:first-child{ padding-top:4px; }
.modal-settings .settings-nav-item{
  position:relative;
  padding:8px 12px;
  margin-bottom:2px;
  font-weight:500;
  border-radius:9px;
  color:var(--text-secondary);
  transition:background .15s ease, color .15s ease;
}
.modal-settings .settings-nav-item::before{
  content:"";
  position:absolute; left:2px; top:50%;
  width:3px; height:0;
  border-radius:3px;
  background:var(--accent);
  transform:translateY(-50%);
  transition:height .18s ease;
}
.modal-settings .settings-nav-item:hover{
  background:var(--bg-hover,var(--bg-tertiary));
  color:var(--text-primary);
}
.modal-settings .settings-nav-item.active{
  background:rgba(var(--accent-rgb),.14);
  color:var(--accent);
  font-weight:600;
  box-shadow:none;
}
.modal-settings .settings-nav-item.active::before{ height:18px; }

/* ---- Body + section cards ------------------------------- */
.modal-settings .settings-body{
  padding:20px;
  background:var(--bg-card);
  scrollbar-width:thin;
}
.modal-settings .settings-body::-webkit-scrollbar{ width:9px; }
.modal-settings .settings-body::-webkit-scrollbar-thumb{
  background:var(--border-light,var(--border));
  border-radius:5px;
  border:2px solid var(--bg-card);
}

.modal-settings .settings-body > .settings-section{
  margin:0 0 14px;
  padding:16px 18px;
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:14px;
  scroll-margin-top:16px;
}
.modal-settings .settings-body > .settings-section:last-child{ margin-bottom:0; }
.modal-settings .settings-body > .settings-section:target,
.modal-settings .settings-body > .settings-section.flash{
  border-color:var(--accent);
}

.modal-settings .settings-section-title{
  font-weight:700;
  margin:0 0 6px;
  padding-left:10px;
  border-left:3px solid var(--accent);
  line-height:1.25;
}
.modal-settings .settings-desc{
  color:var(--text-secondary);
  line-height:1.5;
  margin:0 0 12px;
}
.modal-settings .settings-hint{ line-height:1.5; }

/* ---- Admin mega-panel: transparent wrapper, children are cards ---- */
.modal-settings #admin-mod-panel{
  background:none;
  border:none;
  padding:0;
}
.modal-settings #admin-mod-panel > .settings-section-title{
  margin-bottom:12px;
}
.modal-settings #admin-mod-panel .admin-settings{
  margin:0 0 12px;
  padding:14px 16px;
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:12px;
}
.modal-settings #admin-mod-panel .admin-settings:last-of-type{ margin-bottom:0; }
.modal-settings #admin-mod-panel .settings-section-subtitle{
  margin:0 0 10px;
  padding-bottom:8px;
  border-bottom:1px solid var(--border);
  font-weight:700;
  color:var(--text-primary);
}
.modal-settings .admin-save-bar{
  background:var(--bg-card);
  background:color-mix(in srgb, var(--bg-card) 92%, transparent);border-top:1px solid var(--border);
}
.modal-settings .btn-admin-save{
  border-radius:10px;
  background:linear-gradient(135deg, var(--accent) 0, var(--accent-dim) 100%);
  box-shadow:0 4px 14px var(--accent-glow);
}
.modal-settings .btn-admin-save:hover{ filter:brightness(1.08); }

/* ---- Toggle rows + switch ------------------------------- */
.modal-settings .toggle-row{
  padding:10px 0;
  border-bottom:1px solid var(--border);
}
.modal-settings .toggle-row:last-child{ border-bottom:none; }
.modal-settings .toggle-row span{ font-weight:500; }
.modal-settings .toggle-row input[type=checkbox]{
  flex:0 0 auto;
  background:var(--bg-tertiary);
  border:1px solid var(--border);
  transition:background .2s ease, border-color .2s ease;
}
.modal-settings .toggle-row input[type=checkbox]::before{
  background:var(--text-muted);
  box-shadow:0 1px 3px rgba(0,0,0,.35);
  transition:transform .2s cubic-bezier(.4,0,.2,1), background .2s ease;
}
.modal-settings .toggle-row input[type=checkbox]:checked{
  background:var(--accent);
  border-color:var(--accent);
}
.modal-settings .toggle-row input[type=checkbox]:checked::before{ background:#fff; }
.modal-settings .toggle-row input[type=checkbox]:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px var(--accent-glow);
}

/* ---- Selects / text / number inputs --------------------- */
.modal-settings .settings-select,
.modal-settings .settings-text-input,
.modal-settings .settings-number-input{
  padding:8px 12px;
  background:var(--bg-input);
  border:1px solid var(--border);
  border-radius:9px;
  color:var(--text-primary);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.modal-settings .select-row select{
  padding:6px 10px;
  border-radius:8px;
  background:var(--bg-input);
  border:1px solid var(--border);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.modal-settings .settings-select:focus,
.modal-settings .settings-text-input:focus,
.modal-settings .settings-number-input:focus,
.modal-settings .select-row select:focus{
  outline:0;
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-glow);
}
.modal-settings .settings-number-input{ max-width:110px; }
.modal-settings .select-row,
.modal-settings .volume-row{ padding:8px 0; }
.modal-settings .select-row span,
.modal-settings .volume-row span{ font-weight:500; }

/* ---- Sliders ------------------------------------------- */
.modal-settings input[type=range].slider-sm{
  height:6px;
  border-radius:999px;
  background:var(--bg-tertiary);
}
.modal-settings input[type=range].slider-sm::-webkit-slider-thumb{
  width:16px; height:16px;
  border-radius:50%;
  background:var(--accent);
  border:2px solid var(--bg-card);
  box-shadow:0 1px 5px rgba(0,0,0,.3);
}

/* ---- Segmented pickers (density / font / lite / image) - */
.modal-settings .density-picker,
.modal-settings .font-size-picker{
  gap:8px;
  padding:4px 0 0;
}
.modal-settings .density-btn{
  flex:1 1 auto;
  min-width:72px;
  padding:10px 12px;
  background:var(--bg-input);
  border:1.5px solid var(--border);
  border-radius:11px;
  transition:border-color .15s ease, background .15s ease;
}
.modal-settings .density-btn:hover{
  border-color:var(--text-muted);
  background:var(--bg-hover,var(--bg-tertiary));
  transform:none;
}
.modal-settings .density-btn.active{
  border-color:var(--accent);
  background:rgba(var(--accent-rgb),.12);
  box-shadow:none;
}
.modal-settings .density-btn.active .density-label{
  color:var(--accent);
  font-weight:600;
}
.modal-settings .density-label{ color:var(--text-secondary); }

/* ---- Dividers ----------------------------------------- */
.modal-settings .notif-divider{
  background:var(--border);
  margin:10px 0;
}

/* ---- Password / 2FA / recovery forms ------------------ */
.modal-settings .password-change-form input,
.modal-settings #section-2fa input,
.modal-settings #section-recovery input{
  padding:9px 12px;
  border-radius:9px;
  border:1px solid var(--border);
  background:var(--bg-input);
  color:var(--text-primary);
}
.modal-settings .password-change-form input:focus,
.modal-settings #section-2fa input:focus,
.modal-settings #section-recovery input:focus{
  outline:0;
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-glow);
}
.modal-settings #totp-backup-codes,
.modal-settings #recovery-codes-list{
  border:1px dashed var(--border);
  border-radius:10px;
}
.modal-settings .settings-warning-box{
  border-radius:10px;
}

/* ---- Whitelist / Gatekeeper lists --------------------- */
.modal-settings .whitelist-add-row input{
  padding:9px 12px;
  border-radius:9px;
}
.modal-settings .whitelist-list{
  max-height:200px;
  padding:5px;
  gap:4px;
  background:var(--bg-input);
  border:1px solid var(--border);
  border-radius:10px;
}
.modal-settings .whitelist-item{
  background:var(--bg-secondary);
  border-radius:8px;
  padding:7px 10px;
}
.modal-settings .gk-search-results{
  border-radius:10px !important;
}

/* ---- Plugins & Themes -------------------------------- */
.modal-settings .plugin-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}

/* ---- Desktop shortcut rows --------------------------- */
.modal-settings .shortcut-row{
  padding:9px 12px;
  background:var(--bg-input);
  border:1px solid var(--border);
  border-radius:10px;
}
.modal-settings .shortcut-key{
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:6px;
}

/* ---- Generic full-width action buttons in settings --- */
.modal-settings .settings-body .btn-full{ border-radius:9px; }

/* keep phones tight + drop the vertical active-bar on the horizontal rail */
@media (max-width:768px){
  .modal-settings .settings-body{ padding:14px; }
  .modal-settings .settings-body > .settings-section{ padding:14px 15px; border-radius:12px; }
  .modal-settings .settings-nav-item::before{ display:none; }
}

/* Sections that already ship their own self-framed panel keep it —
   don't wrap them in a second admin card. */
.modal-settings #admin-mod-panel .admin-settings#section-turn,
.modal-settings #admin-mod-panel .admin-settings#section-audit-logs{
  background:none;
  border:none;
  padding:0;
  margin:0 0 12px;
  border-radius:0;
}
.modal-settings #section-create-account .create-account-card{
  background:var(--bg-input);
}

/* ═══ Premium Message Highlight service ═══════════════════════════════════
   A dynamic catalog of accent tiers (service_tiers sub_type 'highlight'). Each
   tier's colour is published live as --hl--<tierkey> on :root by
   app-room-modal._applyPremiumHighlightColors() (refreshed on
   service-catalog-updated). A subscriber's messages get class .premium-highlight
   plus an inline --premium-highlight: var(--hl--<their-tier>, #F5B301), so an
   admin colour edit repaints just that tier's messages with zero per-message JS.
   The tint is translucent (`color-mix` … transparent) so it reads correctly
   on every named theme, light or dark, without per-theme overrides. */
:root{ --premium-highlight:#F5B301; }

/* Room / main-chat message: soft corner glow + gradient wash, a glowing
   a 1px tier-coloured ring (::after).
   Static — no looping animation, per the lean-rendering baseline. */
.message.premium-highlight{
  position:relative;
  padding-left:16px;
  border-radius:12px;
  background:
    radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--premium-highlight) 20%, transparent) 0%, transparent 58%),
    linear-gradient(90deg,
      color-mix(in srgb, var(--premium-highlight) 12%, transparent),
      color-mix(in srgb, var(--premium-highlight) 4%, transparent) 62%,
      transparent);
  box-shadow:0 6px 16px -10px color-mix(in srgb, var(--premium-highlight) 70%, transparent);
}
/* ::after = the 1px tier ring. The ring is a real border on an
   inset overlay rather than an inset box-shadow on .message, because theme
   rules such as [data-theme=daylight] .message{box-shadow:none} fight over
   .message box-shadow and wiped the ring in the native room window. */
.message.premium-highlight::after{
  content:"";
  position:absolute; inset:0;
  box-sizing:border-box;
  border:1px solid color-mix(in srgb, var(--premium-highlight) 32%, transparent);
  border-radius:inherit;
  pointer-events:none;
}

/* DM window bubbles: the wrap carries .premium-highlight + --premium-highlight,
   the bubble (.dm-float-msg-content) gets a tier-tinted gradient, a tier border
   and a soft glow. */
.dm-float-msg-wrap.premium-highlight .dm-float-msg-content{
  position:relative;
  background:linear-gradient(135deg,
    color-mix(in srgb, var(--premium-highlight) 24%, var(--bg-secondary,#16172a)),
    color-mix(in srgb, var(--premium-highlight) 8%, var(--bg-secondary,#16172a)));
  border:1px solid color-mix(in srgb, var(--premium-highlight) 55%, transparent);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--premium-highlight) 30%, transparent),
    0 4px 14px -4px color-mix(in srgb, var(--premium-highlight) 55%, transparent);
}
.dm-float-msg-wrap-own.premium-highlight .dm-float-msg-content{
  background:linear-gradient(135deg,
    color-mix(in srgb, var(--premium-highlight) 48%, #1a1426),
    color-mix(in srgb, var(--premium-highlight) 22%, #120e1c));
  color:#fff;
}
[data-theme="daylight"] .dm-float-msg-wrap.premium-highlight .dm-float-msg-content,
[data-theme="daylight"] .dm-float-msg-wrap-own.premium-highlight .dm-float-msg-content{
  background:linear-gradient(135deg,
    color-mix(in srgb, var(--premium-highlight) 20%, #fff),
    color-mix(in srgb, var(--premium-highlight) 7%, #fff));
  color:var(--text-primary);
  box-shadow:0 2px 8px -3px color-mix(in srgb, var(--premium-highlight) 45%, transparent);
}

/* Manage Services + Services-modal preview: a self-contained highlighted bubble */
.svc-highlight-preview{ margin:10px 0 4px; padding:2px; }
.svc-highlight-preview .message{ margin:0; animation:none; }
.svc-highlight-preview .message-header{ display:flex; gap:6px; align-items:baseline; font-size:.82rem; margin-bottom:2px; }
.svc-highlight-preview .message-time{ opacity:.6; font-size:.72rem; }
.svc-highlight-preview .message-content{ font-size:.9rem; }

/* ═══ Terms of Use — registration agreement gate ═══════════════════════════
   A pre-registration dialog that must be OPENED and SCROLLED TO THE END
   before the "I have read and agree" box in the Create Account form can be
   ticked. The overlay markup lives at the end of <body> (outside .auth-card,
   whose backdrop-filter would otherwise clip a position:fixed child).
   Theme-safe: colours come from the active theme's CSS vars, neutral tints
   use grey so they read on both light and dark. */
.tou-agree-link{
  display:inline; padding:0; margin:0; border:0; background:none;
  font:inherit; font-weight:600;
  color:var(--accent,#6366f1);
  text-decoration:underline; text-underline-offset:2px;
  cursor:pointer;
}
.tou-agree-link:hover{ color:var(--accent-2,var(--auth-accent-2,#8b5cf6)); }
.age-verify-row.tou-agree-row{ cursor:pointer; }
.age-verify-row.tou-agree-row.is-agreed{
  border-color:rgba(34,197,94,.5);
  background:rgba(34,197,94,.09);
}
.age-verify-row.tou-agree-row.is-agreed .age-verify-text{ color:var(--text-primary); }

.tou-modal-overlay{
  position:fixed; inset:0; z-index:2147483000;
  display:none; align-items:center; justify-content:center;
  padding:20px;
  background:rgba(6,8,15,.62)}
.tou-modal-overlay.is-open{ display:flex; animation:touFade .16s ease-out; }
@keyframes touFade{ from{opacity:0} to{opacity:1} }

.tou-modal{
  display:flex; flex-direction:column;
  width:min(680px,100%); max-height:min(86vh,780px);
  overflow:hidden;
  background:var(--bg-card,#1b1a17);
  color:var(--text-primary,#f2efe9);
  border:1px solid var(--border,rgba(128,128,128,.3));
  border-radius:16px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.6);
  animation:touPop .18s cubic-bezier(.2,.8,.2,1);
}
@keyframes touPop{ from{opacity:0;transform:translateY(12px) scale(.98)} to{opacity:1;transform:none} }

.tou-modal-head{
  display:flex; align-items:center; gap:14px;
  padding:20px 22px;
  border-bottom:1px solid var(--border,rgba(128,128,128,.25));
}
.tou-modal-head-icon{
  flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px; color:#fff;
  background:linear-gradient(135deg,var(--auth-accent,#6366f1),var(--auth-accent-2,#8b5cf6));
}
.tou-modal-head-icon svg{ width:22px; height:22px; }
.tou-modal-head-text{ flex:1; min-width:0; }
.tou-modal-head-text h2{ margin:0; font-size:17px; font-weight:700; letter-spacing:.01em; color:var(--text-primary,#f2efe9); }
.tou-modal-head-text p{ margin:3px 0 0; font-size:12px; color:var(--text-secondary,#9c978e); }
.tou-modal-close{
  flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  width:32px; height:32px; border:0; border-radius:9px;
  background:transparent; color:var(--text-secondary,#9c978e);
  cursor:pointer; font-size:20px; line-height:1;
}
.tou-modal-close:hover{ background:rgba(128,128,128,.18); color:var(--text-primary,#fff); }

.tou-modal-progress{ flex:0 0 auto; height:3px; background:rgba(128,128,128,.22); }
.tou-modal-progress span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--auth-accent,#6366f1),var(--auth-accent-2,#8b5cf6));
  transition:width .12s linear;
}

.tou-modal-body{
  flex:1 1 auto; overflow-y:auto;
  padding:20px 24px 26px;
  font-size:13.5px; line-height:1.62;
  color:var(--text-secondary,#c9c4ba);
  -webkit-overflow-scrolling:touch; scrollbar-width:thin;
}
.tou-modal-body:focus{ outline:none; }
.tou-modal-body .tou-lead{ margin:0 0 12px; color:var(--text-primary,#f2efe9); }
.tou-section{ margin:20px 0 0; }
.tou-section h3{ margin:0 0 8px; font-size:14px; font-weight:700; color:var(--text-primary,#f2efe9); }
.tou-section p{ margin:0 0 9px; }
.tou-section ol,.tou-section ul{ margin:0 0 4px; padding-left:20px; }
.tou-section li{ margin:0 0 8px; }
.tou-section strong{ color:var(--text-primary,#f2efe9); }
.tou-signoff{
  margin:26px 0 0; padding-top:16px;
  border-top:1px solid var(--border,rgba(128,128,128,.25));
  font-weight:700; letter-spacing:.16em; color:var(--text-primary,#f2efe9);
}
.tou-signoff span{
  display:block; margin-top:4px;
  font-weight:500; font-size:12px; letter-spacing:.02em;
  color:var(--text-secondary,#9c978e);
}
#tou-end-sentinel{ height:1px; }

.tou-modal-foot{
  flex:0 0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; flex-wrap:wrap;
  padding:14px 20px 16px;
  border-top:1px solid var(--border,rgba(128,128,128,.25));
  background:var(--bg-card,#1b1a17);
}
.tou-foot-hint{
  margin:0; font-size:11.5px; color:var(--text-muted,#8a857b);
  display:flex; align-items:center; gap:6px;
}
.tou-modal-overlay.is-complete .tou-foot-hint{ color:#22c55e; }
.tou-foot-btns{ display:flex; gap:9px; margin-left:auto; }
.tou-btn-secondary,.tou-btn-primary{
  height:38px; padding:0 18px; border-radius:10px;
  font-size:13px; font-weight:600; font-family:inherit; cursor:pointer;
}
.tou-btn-secondary{
  background:transparent; color:var(--text-secondary,#c9c4ba);
  border:1px solid var(--border,rgba(128,128,128,.35));
}
.tou-btn-secondary:hover{ background:rgba(128,128,128,.15); }
.tou-btn-primary{
  border:0; color:#fff;
  background:linear-gradient(135deg,var(--auth-accent,#6366f1),var(--auth-accent-2,#8b5cf6));
}
.tou-btn-primary:disabled{ opacity:.45; cursor:not-allowed; }

@media (max-width:560px){
  .tou-modal{ max-height:92vh; }
  .tou-modal-foot{ justify-content:center; }
  .tou-foot-btns{ width:100%; }
  .tou-btn-primary{ flex:1; }
}

@font-face{font-family:'Segoe Print';src:url('/fonts/segoepr.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}

/* ── Rich-text font picker (composer + inline edit toolbars) ─────────────
   Replaces the old click-to-cycle "cursive" button with a dropdown menu.
   Shared by the web app and tauri-native (appended to both style.css files). */
.rt-cursive-btn{ min-width:32px; gap:2px; position:relative; }
.rt-cursive-btn::after{
  content:"\25BE"; font-size:8px; line-height:1;
  opacity:.55; margin-left:1px; transition:opacity var(--transition,.15s ease);
}
.rt-cursive-btn:hover::after{ opacity:.9; }
.rt-cursive-btn.active{ color:var(--accent,#7c5cfc); border-color:transparent; }
.rt-cursive-btn.menu-open{
  color:var(--accent,#7c5cfc);
  background:rgba(var(--accent-rgb,124,92,252),.12);
}
.rt-cursive-btn .fmt-cursive-label{ font-size:15px; }

.rt-font-menu{
  position:fixed; z-index:10200002; display:none;
  flex-direction:column; gap:0; padding:4px;
  min-width:162px; max-height:52vh; overflow-y:auto;
  background:var(--bg-card,#343658);
  border:1px solid var(--border-light,#565988);
  border-radius:11px;
  box-shadow:0 10px 30px rgba(0,0,0,.32), 0 0 0 1px rgba(0,0,0,.1);
  animation:rt-font-menu-in .12s cubic-bezier(.2,.8,.2,1)}
.rt-font-menu.open{ display:flex; }
@keyframes rt-font-menu-in{
  from{ opacity:0; transform:translateY(5px) scale(.97); }
  to{ opacity:1; transform:none; }
}
.rt-font-menu-head{
  font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-muted,#5d6180); padding:3px 8px 5px;
}
.rt-font-opt{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  width:100%; padding:6px 8px; border:0; border-radius:7px;
  background:0 0; color:var(--text-primary,#e2e4f0);
  font-size:13.5px; line-height:1.1; cursor:pointer; text-align:left;
  transition:background .12s ease, color .12s ease;
}
.rt-font-opt:hover{ background:var(--bg-hover,#454872); }
.rt-font-opt.active{
  background:rgba(var(--accent-rgb,124,92,252),.16);
  color:var(--accent,#7c5cfc);
}
.rt-font-opt .rt-font-opt-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rt-font-opt .rt-font-check{ opacity:0; font-size:10px; flex-shrink:0; transition:opacity .12s ease; }
.rt-font-opt.active .rt-font-check{ opacity:1; }
@media (max-width:480px){
  .rt-font-menu{ min-width:150px; }
  .rt-font-opt{ font-size:13.5px; padding:8px 9px; }
}

/* ── Manage Fonts modal (Settings ▸ Admin ▸ Fonts) ─────────────────────── */
.font-mgr .emoji-mgr-body{ gap:18px; }
.font-mgr-dropzone{ margin-bottom:10px; }
.font-mgr-add-row{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.font-mgr-add-row #font-label-input{
  flex:1 1 180px; min-width:0; padding:8px 10px; border-radius:8px;
  border:1px solid var(--border-light,#565988);
  background:var(--bg-input,var(--bg-secondary,#2a2c48)); color:var(--text-primary,#e2e4f0); font-size:13px;
}
.font-mgr-select{
  padding:8px 10px; border-radius:8px; border:1px solid var(--border-light,#565988);
  background:var(--bg-input,var(--bg-secondary,#2a2c48)); color:var(--text-primary,#e2e4f0); font-size:13px;
}
.font-mgr-status{ margin-top:8px; }
.font-mgr-list{ display:flex; flex-direction:column; gap:8px; }
.font-mgr-empty{ text-align:center; padding:18px; }
.font-mgr-row{
  display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:12px;
  border:1px solid var(--border-light,#565988); background:var(--bg-secondary,#363858);
  transition:opacity .15s ease, border-color .15s ease;
}
.font-mgr-row.is-disabled{ opacity:.5; }
.font-mgr-preview{
  flex-shrink:0; width:54px; height:46px; display:flex; align-items:center; justify-content:center;
  font-size:27px; line-height:1; border-radius:9px;
  background:var(--bg-card,#343658); color:var(--text-primary,#e2e4f0); overflow:hidden;
}
.font-mgr-row-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.font-mgr-label-input{
  width:100%; padding:5px 8px; border-radius:7px; border:1px solid transparent;
  background:0 0; color:var(--text-primary,#e2e4f0); font-size:14px; font-weight:600;
}
.font-mgr-label-input:hover{ border-color:var(--border-light,#565988); }
.font-mgr-label-input:focus{ border-color:var(--accent,#7c5cfc); background:var(--bg-input,var(--bg-card,#343658)); outline:none; }
.font-mgr-row-meta{
  font-size:11px; color:var(--text-muted,#5d6180); text-transform:uppercase;
  letter-spacing:.04em; padding-left:8px;
}
.font-mgr-row-actions{ display:flex; align-items:center; gap:4px; flex-shrink:0; }
.font-mgr-btn{
  width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--border-light,#565988); border-radius:7px;
  background:var(--bg-card,#343658); color:var(--text-secondary,#9498b3); cursor:pointer; font-size:13px;
  transition:background .12s, color .12s, border-color .12s;
}
.font-mgr-btn:hover:not(:disabled){ background:var(--bg-hover,#454872); color:var(--text-primary,#e2e4f0); }
.font-mgr-btn:disabled{ opacity:.35; cursor:not-allowed; }
.font-mgr-del:hover:not(:disabled){ background:rgba(229,83,75,.15); color:#e5534b; border-color:rgba(229,83,75,.4); }
.font-mgr-toggle{ position:relative; width:36px; height:20px; flex-shrink:0; cursor:pointer; }
.font-mgr-toggle input{ position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.font-mgr-toggle span{ position:absolute; inset:0; border-radius:999px; background:var(--border-light,#565988); transition:background .15s ease; }
.font-mgr-toggle span::after{ content:""; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:#fff; transition:transform .15s ease; }
.font-mgr-toggle input:checked+span{ background:var(--accent,#7c5cfc); }
.font-mgr-toggle input:checked+span::after{ transform:translateX(16px); }
@media (max-width:480px){
  .font-mgr-preview{ width:44px; height:38px; font-size:22px; }
  .font-mgr-row-meta{ display:none; }
}

/* ── Room window size mode: Default / Compact (near the favorite button) ── */
.room-float-size-group{ display:flex; align-items:center; gap:1px; background:rgba(255,255,255,.06); border-radius:8px; padding:2px; margin-right:2px; flex-shrink:0; }
.room-float-size-btn{ background:0 0; border:none; color:var(--text-muted,#888); width:24px; height:22px; border-radius:6px; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; flex-shrink:0; transition:background .12s,color .12s; }
.room-float-size-btn:hover{ background:rgba(255,255,255,.1); color:var(--text-primary,#e8e8f0); }
.room-float-size-btn.active{ background:var(--accent,#3d9e6e); color:#fff; }
.room-float-header.has-sub-color .room-float-size-group{ background:rgba(0,0,0,.18); }
.room-float-header.has-sub-color .room-float-size-btn{ color:var(--header-fg-muted); }
.room-float-header.has-sub-color .room-float-size-btn.active{ background:rgba(0,0,0,.32); color:var(--header-fg); }
.room-float-modal.room-float-minimized .room-float-size-group{ display:none; }

/* Compact = the whole window's contents proportionately smaller — literally
   everything still there, just scaled down together — not a hand-picked
   patchwork of paddings/font-sizes (drifts out of ratio and easy to miss a
   spot) and not `zoom` on .room-float-modal itself either — zoom rescales
   an element's OWN position values too, and the drag/resize code above
   (_roomModalDragStart etc. in app-room-modal.js / native.js) reads real
   screen coordinates via getBoundingClientRect and writes them straight
   back as style.left/top/width/height; with zoom on that same element
   those writes get scaled a second time on render, so the window leaps to
   a new spot the instant you press down on the header. `transform` never
   touches the element's own position/size the way zoom does, so it's
   applied one level in on .room-float-scale (everything except the
   edge/corner resize-handle strips, which stay real-sized and outside the
   transform so the resize math is untouched) — it renders at its natural
   full size and is visually shrunk; width/height:125% (the inverse of the
   .8 scale) cancels that shrink for layout purposes so it still exactly
   fills the smaller outer box, no gap, nothing clipped. Applies to a
   native pop-out room window too (.standalone) — setRoomSizeMode
   (native.js) resizes that window's real OS size by this same .8 factor,
   so this transform turns its now-smaller box into an exact miniature of
   the full layout instead of the same-size content reflowing into less
   room; only skipped while minimized (that pill has its own fixed
   dimensions already). */
.room-float-scale{ display:flex; flex-direction:column; flex:1; min-height:0; overflow:hidden; }
.room-float-modal.room-float-size-compact:not(.room-float-minimized):not(.standalone){ width:608px; min-width:480px; height:480px; min-height:340px; }
.room-float-modal.room-float-size-compact:not(.room-float-minimized) .room-float-scale{ flex:none; width:125%; height:125%; transform:scale(.8); transform-origin:top left; }
@media (max-width:768px){
  /* The mobile room window is already a full-screen sheet (see the
     max-width:768px block further up sizing it via `inset:0 !important`);
     shrinking its contents would just leave a blank margin around a
     smaller sheet inside that fixed frame instead of shrinking the frame
     itself, so compact mode is a no-op there — but NOT for a native
     pop-out (.standalone): its window is a real desktop window that's
     deliberately narrower than 768px in compact mode (see native.js), not
     a phone viewport, and already reasserts the desktop layout regardless
     of width (see the .standalone rules in native.css), so it keeps the
     transform. */
  .room-float-modal.room-float-size-compact:not(.standalone) .room-float-scale{ flex:1!important; width:auto!important; height:auto!important; transform:none!important; }
}

/* ── Desktop-app download banner: redesign pass ──────────────────────────────
   Wins over the generated/minified rules earlier in this file by cascade
   order alone (equal selector specificity, later wins) — same approach as
   the rest of this hand-authored tail. Markup/classes are unchanged (see
   public/app.html and the mac/msix template blocks in server.js's /app
   route) so panel-float.js's native-app detection (which hides this whole
   element inside the Tauri build) keeps working untouched. */
.desktop-download-banner{
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 16px 7px 10px;
  white-space: nowrap;
  font-size: 12.5px;
  color: var(--text-secondary, #9498b3);
  background: linear-gradient(180deg, rgba(34, 32, 58, .74), rgba(19, 18, 34, .74));
  border-radius: 999px;box-shadow:
    0 14px 34px -12px rgba(8, 6, 20, .6),
    0 0 0 1px rgba(124, 92, 252, .32),
    inset 0 1px 0 rgba(255, 255, 255, .08);
  pointer-events: auto;
}

/* Icon gets its own little gradient "app tile" instead of a bare glyph
   floating in the pill — reads as a product mark, not a stray icon. */
.desktop-download-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, #7c5cfc, #4f8cf7);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 3px 10px rgba(124, 92, 252, .45);
}

.desktop-download-label{
  font-weight: 600;
  color: var(--text-primary, #e2e4f0);
  letter-spacing: .01em;
}

.desktop-download-btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #7c5cfc, #43b581);
  color: #fff;
  border-radius: 999px;
  padding: 6px 15px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  line-height: 1;
  box-shadow: 0 4px 14px -2px rgba(124, 92, 252, .55), inset 0 1px 0 rgba(255, 255, 255, .2);
  transition: opacity .15s, transform .15s, box-shadow .15s;
}
.desktop-download-btn:hover{
  opacity: .95;
  transform: translateY(-1px);
  color: #fff;
  box-shadow: 0 7px 20px -2px rgba(124, 92, 252, .7), inset 0 1px 0 rgba(255, 255, 255, .24);
}
.desktop-download-btn:active{
  transform: translateY(0);
  opacity: 1;
  box-shadow: 0 2px 8px -2px rgba(124, 92, 252, .5), inset 0 1px 0 rgba(255, 255, 255, .16);
}

.desktop-download-cert,
.desktop-download-msix{
  display: inline-flex;
  align-items: center;
  margin-left: 2px;
  padding: 6px 11px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 999px;
  border: 1px solid rgba(124, 92, 252, .4);
  color: var(--text-secondary, #9498b3);
  text-decoration: none;
  line-height: 1;
  transition: opacity .15s, color .15s, border-color .15s, background-color .15s;
}
.desktop-download-cert:hover,
.desktop-download-msix:hover{
  opacity: 1;
  color: var(--text-primary, #e2e4f0);
  border-color: rgba(124, 92, 252, .75);
  background-color: rgba(124, 92, 252, .12);
}
.desktop-download-cert{ border-style: dashed; }

@media (max-width: 600px){
  .desktop-download-banner{ top: 10px; padding: 5px 12px 5px 8px; font-size: 11px; gap: 7px; }
  .desktop-download-icon{ width: 20px; height: 20px; border-radius: 7px; }
  .desktop-download-label{ display: none; }
  .desktop-download-btn{ padding: 5px 12px; font-size: 11px; }
  .desktop-download-cert, .desktop-download-msix{ display: none; }
}

/* A DM this device can't decrypt is otherwise a dead end for the reader —
   this turns the placeholder into a one-click retry instead of silent,
   unexplained garbage text. See _fixDecryptionClicked in app-platform.js. */
.e2e-decrypt-fail{
  cursor: pointer;
  color: var(--warning, #faa61a);
  font-style: italic;
  border-bottom: 1px dashed currentColor;
}
.e2e-decrypt-fail:hover{ opacity: .85; }
.e2e-decrypt-fail .e2e-fix-hint{
  font-style: normal;
  opacity: .75;
  font-size: .9em;
}

/* Friends-only DM lock — shown in place of the composer when the DM partner
   only accepts messages from friends and the viewer isn't one. Server also
   rejects the send (see isBlockedByFriendsOnly in socketHandlers.js); this is
   the visible explanation. Toggled by _updateDmFriendsOnlyNotice. */
.dm-float-friends-only{
  display: none;
  align-items: flex-start;
  gap: 8px;
  margin: 6px 10px 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--bg-tertiary, rgba(127,127,127,.12));
  border: 1px solid var(--border-color, rgba(127,127,127,.25));
  color: var(--text-secondary, #b5bac1);
  font-size: 12.5px;
  line-height: 1.4;
}
.dm-float-friends-only .dm-fo-lock{ font-size: 14px; line-height: 1.3; flex-shrink: 0; }
.dm-float-friends-only .dm-fo-text{ flex: 1; min-width: 0; }
.dm-float-modal.dm-friends-locked .dm-float-friends-only{ display: flex; }
.dm-float-modal.dm-friends-locked .dm-float-input-area,
.dm-float-modal.dm-friends-locked .dm-float-fmt-toolbar{ display: none !important; }

/* Reaction hover tooltip — reveals who reacted with an emoji. A single
   body-level fixed node (.reaction-tip-pop) positioned in JS by
   _ensureReactionTip (app-utilities.js): reaction badges sit at the right
   edge of .message-row inside scroll containers that clip on BOTH axes, so a
   child/absolute tooltip can't work — it's viewport-clamped and flips above/
   below to fit. Native parity: tauri-native/src/css/native.css + native.js. */
.reaction-tip-pop{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483647;
  max-width: 260px;
  padding: 7px 11px;
  border-radius: 10px;
  background: var(--bg-card, #23262e);
  border: 1px solid var(--border-light, rgba(255,255,255,.09));
  box-shadow: 0 10px 28px -10px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.22);
  color: var(--text-primary, #fff);
  font: 500 11.5px/1.45 var(--font-main, system-ui, sans-serif);
  letter-spacing: .01em;
  text-align: left;
  overflow-wrap: anywhere;
  pointer-events: none;
  opacity: 0;
  transform: translateY(3px) scale(.97);
  transition: opacity .12s ease, transform .12s ease;
}
.reaction-tip-pop.show{ opacity: 1; transform: none; }
.reaction-tip-pop::after{
  content: "";
  position: absolute;
  left: var(--tip-arrow, 50%);
  margin-left: -6px;
  border: 6px solid transparent;
}
.reaction-tip-pop:not([data-below="1"])::after{ top: 100%; border-top-color: var(--bg-card, #23262e); }
.reaction-tip-pop[data-below="1"]::after{ bottom: 100%; border-bottom-color: var(--bg-card, #23262e); }
.reaction-tip-pop .reaction-tip-name{ font-weight: 600; }

/* ============================================================
   Settings ▸ Admin ▸ Redis Backend  (v4.7.109)
   Dedicated modern panel for the Docker/local ↔ Upstash switcher.
   Theme-driven (nord + daylight) — every colour is a token. Markup
   in public/app.html (#section-redis .rds-*), behaviour in
   public/js/modules/app-admin.js › _initRedisConfig().
   ============================================================ */
#section-redis .rds-panel{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:15px;
  padding:18px;
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:16px;
}
#section-redis .rds-panel code{
  font-family:var(--font-mono);
  font-size:.88em;
  padding:1px 5px;
  border-radius:5px;
  color:var(--text-secondary);
  background:var(--bg-input);
  border:1px solid var(--border);
}
#section-redis .rds-panel em{
  font-style:normal;
  font-weight:600;
  color:var(--text-secondary);
}

/* ── header ───────────────────────────────────────────── */
#section-redis .rds-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
}
#section-redis .rds-head__icon{
  flex:0 0 auto;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:var(--accent);
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.22),rgba(var(--accent-rgb),.06));
  border:1px solid rgba(var(--accent-rgb),.25);
}
#section-redis .rds-head__text{
  flex:1;
  min-width:0;
  padding-top:1px;
}
#section-redis .rds-head__title{
  margin:0;
  font-family:var(--font-heading);
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--text-primary);
}
#section-redis .rds-head__sub{
  margin:3px 0 0;
  font-size:11.5px;
  line-height:1.5;
  color:var(--text-secondary);
}
#section-redis .rds-pill{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:5px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
  color:var(--text-secondary);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
}
#section-redis .rds-pill__dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:currentColor;
  flex:0 0 auto;
}
#section-redis .rds-pill[data-state="live"]{
  color:var(--success);
  background:rgba(var(--success-rgb),.12);
  border-color:rgba(var(--success-rgb),.38);
}
#section-redis .rds-pill[data-state="live"] .rds-pill__dot{
  animation:rds-pulse 2.4s ease-out infinite;
}
#section-redis .rds-pill[data-state="off"]{
  color:var(--danger);
  background:rgba(var(--danger-rgb),.1);
  border-color:rgba(var(--danger-rgb),.35);
}
@keyframes rds-pulse{
  0%{box-shadow:0 0 0 0 rgba(var(--success-rgb),.55)}
  70%{box-shadow:0 0 0 6px rgba(var(--success-rgb),0)}
  100%{box-shadow:0 0 0 0 rgba(var(--success-rgb),0)}
}

/* ── current connection card ──────────────────────────── */
#section-redis .rds-now{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px 16px;
  border-radius:12px;
  background:var(--bg-primary);
  border:1px solid var(--border);
}
#section-redis .rds-now__grid{
  display:grid;
  gap:9px;
}
#section-redis .rds-now__row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
}
#section-redis .rds-now__k{
  flex:0 0 auto;
  font-size:10px;
  font-weight:700;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:var(--text-muted);
}
#section-redis .rds-now__v{
  min-width:0;
  font-size:12.5px;
  font-weight:600;
  color:var(--text-primary);
  text-align:right;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#section-redis .rds-now__v--mono{
  font-family:var(--font-mono);
  font-size:11.5px;
  font-weight:500;
  color:var(--text-secondary);
}
#section-redis .rds-now__badges{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
#section-redis .rds-now__badges:empty{
  display:none;
}
#section-redis .rds-now__next{
  margin:0;
  font-size:10.5px;
  font-family:var(--font-mono);
  color:var(--text-muted);
}
#section-redis .rds-now__next:empty{
  display:none;
}

/* small status badge (TLS / mode / pub-sub) */
#section-redis .rds-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:600;
  letter-spacing:.2px;
  color:var(--text-secondary);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
}
#section-redis .rds-badge--accent{
  color:var(--accent);
  background:rgba(var(--accent-rgb),.12);
  border-color:rgba(var(--accent-rgb),.32);
}
#section-redis .rds-badge--ok{
  color:var(--success);
  background:rgba(var(--success-rgb),.12);
  border-color:rgba(var(--success-rgb),.32);
}
#section-redis .rds-badge--warn{
  color:var(--warning);
  background:rgba(240,173,78,.14);
  border-color:rgba(240,173,78,.4);
}

/* ── restart alert ───────────────────────────────────── */
#section-redis .rds-alert{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:11px 13px;
  border-radius:11px;
  font-size:11.5px;
  line-height:1.5;
  color:var(--text-primary);
  background:rgba(240,173,78,.1);
  border:1px solid rgba(240,173,78,.34);
  border-left:3px solid var(--warning);
}
#section-redis .rds-alert svg{
  flex:0 0 auto;
  margin-top:1px;
  color:var(--warning);
}
#section-redis .rds-alert strong{
  color:var(--text-primary);
}

/* ── field + choice cards ────────────────────────────── */
#section-redis .rds-field{
  display:flex;
  flex-direction:column;
  gap:9px;
}
#section-redis .rds-field__label{
  font-size:12px;
  font-weight:600;
  color:var(--text-primary);
}
#section-redis .rds-choices{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(212px,1fr));
  gap:10px;
}
#section-redis .rds-choice{
  position:relative;
  display:block;
  cursor:pointer;
}
#section-redis .rds-choice input{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  margin:0;
  pointer-events:none;
}
#section-redis .rds-choice__box{
  display:flex;
  align-items:center;
  gap:11px;
  height:100%;
  padding:12px 13px;
  border:1.5px solid var(--border);
  border-radius:12px;
  background:var(--bg-primary);
  transition:border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease;
}
#section-redis .rds-choice:hover .rds-choice__box{
  border-color:rgba(var(--accent-rgb),.5);
  transform:translateY(-1px);
}
#section-redis .rds-choice input:checked + .rds-choice__box{
  border-color:var(--accent);
  background:rgba(var(--accent-rgb),.06);
  box-shadow:0 0 0 3px var(--accent-glow);
}
#section-redis .rds-choice input:focus-visible + .rds-choice__box{
  outline:2px solid var(--accent);
  outline-offset:2px;
}
#section-redis .rds-choice__icon{
  flex:0 0 auto;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:9px;
  color:var(--text-secondary);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
  transition:color .16s ease,background .16s ease,border-color .16s ease;
}
#section-redis .rds-choice input:checked + .rds-choice__box .rds-choice__icon{
  color:var(--accent);
  background:rgba(var(--accent-rgb),.14);
  border-color:rgba(var(--accent-rgb),.32);
}
#section-redis .rds-choice__body{
  flex:1;
  min-width:0;
}
#section-redis .rds-choice__name{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12.5px;
  font-weight:700;
  color:var(--text-primary);
}
#section-redis .rds-choice__tag{
  padding:1px 6px;
  border-radius:5px;
  font-size:8.5px;
  font-weight:800;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--text-muted);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
}
#section-redis .rds-choice__desc{
  display:block;
  margin-top:3px;
  font-size:10.5px;
  line-height:1.4;
  color:var(--text-muted);
}
#section-redis .rds-choice__check{
  flex:0 0 auto;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:transparent;
  border:1.5px solid var(--border);
  transition:color .16s ease,background .16s ease,border-color .16s ease;
}
#section-redis .rds-choice input:checked + .rds-choice__box .rds-choice__check{
  color:#fff;
  background:var(--accent);
  border-color:var(--accent);
}

/* ── URL inputs ──────────────────────────────────────── */
#section-redis .rds-urls{
  display:flex;
  flex-direction:column;
  gap:13px;
}
#section-redis .rds-input{
  display:flex;
  flex-direction:column;
  gap:6px;
}
#section-redis .rds-input__top{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
#section-redis .rds-input__top label{
  font-size:12px;
  font-weight:600;
  color:var(--text-primary);
}
#section-redis .rds-chip-mini{
  font-size:10px;
  color:var(--text-muted);
}
#section-redis .rds-src{
  margin-left:auto;
  padding:2px 7px;
  border-radius:999px;
  font-size:9px;
  font-weight:700;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:var(--text-muted);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
}
#section-redis .rds-src:empty{
  display:none;
}
#section-redis .rds-src[data-src="saved"]{
  color:var(--accent);
  background:rgba(var(--accent-rgb),.12);
  border-color:rgba(var(--accent-rgb),.4);
}
#section-redis .rds-input__wrap{
  display:flex;
  gap:8px;
  align-items:stretch;
  flex-wrap:wrap;
}
#section-redis .rds-control{
  flex:1;
  min-width:180px;
  box-sizing:border-box;
  padding:9px 11px;
  font-family:var(--font-main);
  font-size:13px;
  color:var(--text-primary);
  background:var(--bg-input);
  border:1px solid var(--border);
  border-radius:9px;
  outline:none;
  transition:border-color var(--transition),box-shadow var(--transition);
}
#section-redis .rds-control::placeholder{
  color:var(--text-muted);
}
#section-redis .rds-control:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-glow);
}
#section-redis .rds-control--mono{
  font-family:var(--font-mono);
  font-size:12px;
}
#section-redis .rds-test{
  flex:0 0 auto;
  padding:0 15px;
  font-family:var(--font-main);
  font-size:11.5px;
  font-weight:600;
  color:var(--text-secondary);
  background:var(--bg-tertiary);
  border:1px solid var(--border);
  border-radius:9px;
  cursor:pointer;
  transition:color .15s ease,background .15s ease,border-color .15s ease;
}
#section-redis .rds-test:hover:not(:disabled){
  color:var(--text-primary);
  background:var(--bg-hover);
  border-color:var(--accent);
}
#section-redis .rds-test:disabled{
  opacity:.55;
  cursor:progress;
}
#section-redis .rds-hint{
  margin:0;
  font-size:11px;
  line-height:1.55;
  color:var(--text-muted);
}

/* ── test result card ────────────────────────────────── */
#section-redis .rds-result{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:12px 14px;
  border-radius:11px;
  color:var(--text-secondary);
  background:var(--bg-input);
  border:1px solid var(--border);
  border-left:3px solid var(--border);
}
#section-redis .rds-result[data-state="ok"]{
  border-left-color:var(--success);
}
#section-redis .rds-result[data-state="err"]{
  border-left-color:var(--danger);
}
#section-redis .rds-result[data-state="run"]{
  border-left-color:var(--accent);
}
#section-redis .rds-result__head{
  display:flex;
  align-items:center;
  gap:8px;
}
#section-redis .rds-result__icon{
  flex:0 0 auto;
  width:19px;
  height:19px;
  display:grid;
  place-items:center;
  border-radius:6px;
  font-size:11px;
  font-weight:700;
  line-height:1;
}
#section-redis .rds-result[data-state="ok"] .rds-result__icon{
  color:var(--success);
  background:rgba(var(--success-rgb),.14);
}
#section-redis .rds-result[data-state="err"] .rds-result__icon{
  color:var(--danger);
  background:rgba(var(--danger-rgb),.14);
}
#section-redis .rds-result[data-state="run"] .rds-result__icon{
  color:var(--accent);
  background:rgba(var(--accent-rgb),.14);
}
#section-redis .rds-result__title{
  font-size:12.5px;
  font-weight:700;
  color:var(--text-primary);
}
#section-redis .rds-result__badges{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
#section-redis .rds-result__badges:empty{
  display:none;
}
#section-redis .rds-result__msg{
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.5;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  color:var(--text-secondary);
}
#section-redis .rds-result__msg:empty{
  display:none;
}

/* ── actions + footer ────────────────────────────────── */
#section-redis .rds-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:1px;
}
#section-redis .rds-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:9px 15px;
  font-family:var(--font-main);
  font-size:12.5px;
  font-weight:600;
  border:1px solid transparent;
  border-radius:9px;
  cursor:pointer;
  transition:transform .12s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
#section-redis .rds-btn svg{
  flex:0 0 auto;
}
#section-redis .rds-btn:active{
  transform:scale(.97);
}
#section-redis .rds-btn:disabled{
  opacity:.6;
  cursor:progress;
  transform:none;
}
#section-redis .rds-btn--primary{
  color:#fff;
  background:linear-gradient(135deg,var(--accent) 0,var(--accent-dim) 100%);
  box-shadow:0 4px 12px var(--accent-glow);
}
#section-redis .rds-btn--primary:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 6px 18px var(--accent-glow);
}
#section-redis .rds-btn--ghost{
  color:var(--text-muted);
  background:transparent;
  border-color:var(--border);
}
#section-redis .rds-btn--ghost:hover:not(:disabled){
  color:var(--danger);
  background:rgba(var(--danger-rgb),.1);
  border-color:transparent;
}
#section-redis .rds-save-msg{
  font-size:11px;
  font-weight:500;
}
#section-redis .rds-foot{
  margin:0;
  padding-top:12px;
  border-top:1px solid var(--border);
  font-size:11px;
  line-height:1.55;
  color:var(--text-muted);
}

@media (prefers-reduced-motion:reduce){
  #section-redis .rds-pill[data-state="live"] .rds-pill__dot{animation:none}
  #section-redis .rds-choice:hover .rds-choice__box{transform:none}
}

@media (max-width:560px){
  #section-redis .rds-panel{padding:14px;border-radius:14px}
  #section-redis .rds-head{flex-wrap:wrap}
  #section-redis .rds-pill{order:3;width:100%;justify-content:center}
  #section-redis .rds-now__v{white-space:normal}
  #section-redis .rds-test{width:100%}
}

/* ── DM window header status dot — reflect real status, not just online/offline ── */
.dm-float-online-dot.away{
  background:#faa61a;
  border-radius:2px 2px 50% 50%;
  box-shadow:none;
}
.dm-float-online-dot.dnd{
  background:var(--danger);
  border-radius:2px;
  box-shadow:none;
}
/* No .invisible rule on purpose — invisible collapses to "no dot" (same as
   offline) in app-dm-modal.js, never a distinct indicator. */

/* Mobile "Servers" sidebar section hidden — feature still wired in JS/HTML,
   just not surfaced in the UI for now. */
#mobile-servers-section{
  display:none !important;
}

/* ── DM read receipts (premium: service_tiers.feature_read_receipts) ──────
   Messenger-style: a single small "Seen" label rides the most recent own
   message the partner has actually read, instead of a ✓/✓✓ stamped on every
   message — moved (never duplicated) by _placeDmSeenAvatar / placeDmSeenAvatar
   as otherReadUpTo advances (app-dm-modal.js / native.js). */
.dm-float-msg-wrap-own{
  position:relative;
}
.dm-seen-indicator{
  position:absolute;
  right:0;
  bottom:-14px;
  font-size:9px;
  font-weight:500;
  color:var(--text-muted);
  opacity:.75;
  white-space:nowrap;
  user-select:none;
  z-index:2;
  animation:dm-seen-in .15s ease-out;
}
@keyframes dm-seen-in{
  from{opacity:0;transform:translateY(-2px)}
  to{opacity:.75;transform:translateY(0)}
}

/* ── Performance Mode (Settings ▸ Layout, #perf-mode-toggle) ───────────────
   Manual opt-in for users on older/slower computers or browsers whose CPU
   or integrated GPU can't keep the decorative CSS smooth — unlike the
   native desktop app (tauri-native/src/css/native.css), the browser here
   isn't compositing an always-on transparent OS window, so there's no
   reliable OS/hardware signal to auto-detect from; this is toggle-only.
   `*` so it also overrides component-specific rules elsewhere in this file,
   not just what's declared below — !important because it's meant to
   unconditionally win over every specific selector app-wide. */
html.perf-mode *,
html.perf-mode *::before,
html.perf-mode *::after{
  animation:none !important;
  transition:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  filter:none !important;
  backdrop-filter:none !important;
}

/* ── Room message-list rendering cost (many-GIF rooms) ──────────────────
   A room with a long run of GIF messages keeps every one of them decoding
   and paintable as long as its <img> sits in the DOM, even the ones
   scrolled out of view — that's the actual CPU/GPU cost behind "the room
   gets laggy", not DOM node count (that's already capped, see
   _appendRoomModalMessage / appendRoomModalMessage). content-visibility:auto
   tells the browser to skip layout/paint (and the GIF frame decode that
   goes with paint) for message rows currently scrolled out of the
   messages pane, while still reserving their place in the scrollbar via
   contain-intrinsic-size — no JS, no IntersectionObserver needed. `auto`
   in contain-intrinsic-size remembers each row's real height after its
   first paint, so the initial guess only matters before that. Unsupported
   engines (older WebKit/Safari < 18) just ignore the property and render
   normally, so this is a safe no-op there rather than a regression. */
.room-float-messages .message{
  content-visibility:auto;
  contain-intrinsic-size:auto 48px;
}

/* ── My Connections ▸ History — per-row "Delete conversation" button ────
   Reuses the same delete-dm socket event as the DM sidebar context menu
   (app-channels.js, data-action="dm-delete") — deletes the whole DM
   (messages + channel) for both users. Base 28px icon-button box model
   comes from .room-float-btn, applied alongside this class. */
.connections-delete-btn{color:#f87171}

/* ── Link preview card — unfurled below a message with a bare URL ───────
   Server fetches just title/description/image (see maybeFetchLinkPreview
   in socketHandlers.js) and emits 'link-preview-ready' once it's ready;
   _renderLinkPreview (app-utilities.js) builds this markup for both the
   initial render (message.link_preview, from history) and the live patch. */
.link-preview-card{
  display:flex;
  gap:10px;
  margin-top:6px;
  max-width:420px;
  border:1px solid var(--border-light, var(--border));
  border-radius:8px;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  background:var(--bg-secondary, rgba(127,127,127,0.06));
  transition:background 0.15s ease;
}
.link-preview-card:hover{background:var(--bg-hover, rgba(127,127,127,0.12))}
.link-preview-card.link-preview-no-image .link-preview-image{display:none}
.link-preview-image{
  flex:0 0 96px;
  width:96px;
  height:96px;
  overflow:hidden;
}
.link-preview-image img{width:100%;height:100%;object-fit:cover;display:block}
.link-preview-body{
  flex:1;
  min-width:0;
  padding:8px 10px 8px 0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
}
.link-preview-site{
  font-size:0.72em;
  text-transform:uppercase;
  letter-spacing:0.03em;
  color:var(--text-muted);
}
.link-preview-title{
  font-size:0.9em;
  font-weight:600;
  color:var(--text-primary, inherit);
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.link-preview-desc{
  font-size:0.82em;
  color:var(--text-muted);
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
@media (max-width:480px){
  .link-preview-card{max-width:100%}
  .link-preview-image{flex-basis:72px;width:72px;height:72px}
}
.connections-delete-btn:hover{background:rgba(239,68,68,.14)}

/* ── View Profile popup: patron tier/level escalation ───────────────────
   The popup's chrome gets progressively more extravagant with the viewed
   user's patron rank (_getProfileTierMeta in app-rankings.js, grouping the
   9 PATRON_RANK_TIERS into 4 bands). --pp-pat-bg/--pp-pat-end/--pp-pat-glow
   are set inline on #profile-popup by _showProfilePopup (app-users.js).
   No patron tier = untouched default popup. */
.profile-popup.pp-tier-band-1,
.profile-popup.pp-tier-band-2,
.profile-popup.pp-tier-band-3,
.profile-popup.pp-tier-band-4{
  border-color:color-mix(in srgb, var(--pp-pat-bg) 55%, var(--border-light));
  box-shadow:0 8px 32px rgba(0,0,0,.7), 0 0 0 1px color-mix(in srgb, var(--pp-pat-bg) 35%, transparent);
}
.profile-popup.pp-tier-band-2{
  box-shadow:0 8px 32px rgba(0,0,0,.7), 0 0 22px -4px var(--pp-pat-glow), 0 0 0 1px color-mix(in srgb, var(--pp-pat-bg) 45%, transparent);
}
.profile-popup.pp-tier-band-3{
  box-shadow:0 8px 36px rgba(0,0,0,.75), 0 0 32px -2px var(--pp-pat-glow), 0 0 0 1px color-mix(in srgb, var(--pp-pat-bg) 55%, transparent);
  animation:profile-popup-in .18s ease-out, pp-glow-pulse 3.2s ease-in-out infinite;
}
.profile-popup.pp-tier-band-4{
  box-shadow:0 8px 40px rgba(0,0,0,.8), 0 0 44px 0 var(--pp-pat-glow), 0 0 0 1.5px color-mix(in srgb, var(--pp-pat-bg) 70%, #fff 10%);
  animation:profile-popup-in .18s ease-out, pp-glow-pulse 2.2s ease-in-out infinite;
}
.profile-popup-hover.pp-tier-band-1,
.profile-popup-hover.pp-tier-band-2,
.profile-popup-hover.pp-tier-band-3,
.profile-popup-hover.pp-tier-band-4{
  animation:profile-popup-hover-in .15s ease-out;
}
@keyframes pp-glow-pulse{
  0%,100%{box-shadow:0 8px 36px rgba(0,0,0,.75), 0 0 24px -4px var(--pp-pat-glow), 0 0 0 1px color-mix(in srgb, var(--pp-pat-bg) 55%, transparent)}
  50%{box-shadow:0 8px 36px rgba(0,0,0,.75), 0 0 40px 2px var(--pp-pat-glow), 0 0 0 1px color-mix(in srgb, var(--pp-pat-bg) 70%, transparent)}
}

/* Level chip next to the display name */
.pp-level-chip{
  display:inline-flex;
  align-items:center;
  gap:3px;
  margin:3px 0 0;
  padding:1px 8px;
  border-radius:20px;
  width:fit-content;
  background:linear-gradient(135deg, var(--pp-pat-bg), var(--pp-pat-end));
  color:#fff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.3px;
  box-shadow:0 1px 4px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.25);
  border:1px solid rgba(255,255,255,.2);
  text-shadow:0 1px 2px rgba(0,0,0,.4);
}
.pp-tier-band-3 .pp-level-chip,
.pp-tier-band-4 .pp-level-chip{
  animation:pp-chip-shimmer 2.4s ease-in-out infinite;
}
@keyframes pp-chip-shimmer{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.35)}
}

/* Display name picks up a slow-sweeping tier-gradient fill from band 2 up */
.pp-tier-band-2 .profile-popup-displayname,
.pp-tier-band-3 .profile-popup-displayname,
.pp-tier-band-4 .profile-popup-displayname{
  background:linear-gradient(90deg, var(--pp-pat-bg), var(--pp-pat-end), var(--pp-pat-bg));
  background-size:200% 100%;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  animation:pp-name-sheen 4s linear infinite;
}
@keyframes pp-name-sheen{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}
}

/* Avatar halo ring — solid tier color at band 1-2, spinning conic ring from
   band 3 up (faster still at band 4/Apex-Mythic). */
.pp-tier-band-1 .profile-popup-avatar-wrapper::before,
.pp-tier-band-2 .profile-popup-avatar-wrapper::before,
.pp-tier-band-3 .profile-popup-avatar-wrapper::before,
.pp-tier-band-4 .profile-popup-avatar-wrapper::before{
  content:'';
  position:absolute;
  inset:-4px;
  z-index:-1;
  border-radius:50%;
  background:linear-gradient(135deg, var(--pp-pat-bg), var(--pp-pat-end));
}
.pp-tier-band-3 .profile-popup-avatar-wrapper::before,
.pp-tier-band-4 .profile-popup-avatar-wrapper::before{
  background:conic-gradient(from 0deg, var(--pp-pat-bg), var(--pp-pat-end), var(--pp-pat-bg));
  animation:pp-ring-spin 3s linear infinite;
}
.pp-tier-band-4 .profile-popup-avatar-wrapper::before{
  animation-duration:1.8s;
}
@keyframes pp-ring-spin{to{transform:rotate(360deg)}}

/* Banner sparkle layer (band 3+ only, injected as .pp-spark-layer) */
.pp-spark-layer{
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.9) 1px, transparent 1.5px),
    radial-gradient(circle, rgba(255,255,255,.7) 1px, transparent 1.5px),
    radial-gradient(circle, rgba(255,255,255,.8) 1px, transparent 1.5px),
    radial-gradient(circle, rgba(255,255,255,.6) 1px, transparent 1.5px);
  background-size:40px 40px, 60px 60px, 50px 50px, 70px 70px;
  background-position:10% 20%, 70% 60%, 40% 80%, 85% 15%;
  animation:pp-spark-twinkle 2.6s ease-in-out infinite;
}
.pp-tier-band-4 .pp-spark-layer{
  animation-duration:1.6s;
}
@keyframes pp-spark-twinkle{
  0%,100%{opacity:.3}
  50%{opacity:.9}
}

/* GCash Direct — optional admin-uploaded QR code shown next to the number */
.gcash-qr-wrap{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}
.gcash-qr-img{
  width:132px;
  height:132px;
  object-fit:contain;
  background:#fff;
  border-radius:10px;
  padding:6px;
  border:1px solid rgba(0,0,0,.08);
}
.gcash-qr-caption{
  font-size:.74rem;
  opacity:.65;
}

/* Top Up — custom admin-defined manual payment channels (buttons injected
   dynamically into #wm-methods-custom, one per active channel) */
.wallet-method-manual{
  background: rgba(230, 185, 92, .12);
  border-color: rgba(230, 185, 92, .4);
  color: #fff;
}
.wallet-method-manual:hover{
  background: rgba(230, 185, 92, .22);
  border-color: #e6b95c;
}
[data-theme=daylight] .wallet-method-manual{
  background: rgba(180, 130, 20, .08);
  color: #7a5810;
}

/* Report User / Report Issue dialog — reuses .room-mod-dialog-* (see
   app-report.js) but the reason field is now a <select>/<textarea> instead
   of a plain <input>, so give those two extra treatment. */
.room-mod-dialog-reason option{
  background: var(--bg-card, #161923);
  color: var(--text-primary, #e8e8f0);
}
textarea.room-mod-dialog-reason{
  resize: vertical;
  min-height: 64px;
  font-family: inherit;
}
.dm-float-btn-report:hover{
  color: #f39c12;
}

/* Connections modal ▸ Reports tab (app-connections-modal.js
   _renderMyReportsTab) — reports filed against the current user. Read-only:
   no reporter identity is ever sent to this view (see get-my-reports in
   src/socketHandlers.js). */
.my-report-row{
  padding: 10px 12px;
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 10px;
  margin-bottom: 8px;
  background: var(--bg-elevated, rgba(255,255,255,.02));
}
.my-report-top{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.my-report-status{
  font-size: .66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 2px 8px;
  border-radius: 20px;
}
.my-report-status-open{ background: rgba(245,158,11,.15); color: #f59e0b; }
.my-report-status-reviewed{ background: rgba(96,165,250,.15); color: #60a5fa; }
.my-report-status-resolved{ background: rgba(34,197,94,.15); color: #22c55e; }
.my-report-category{
  font-size: .72rem;
  font-weight: 600;
  color: var(--text-secondary, #9498b3);
}
.my-report-room{
  font-size: .72rem;
  color: var(--text-muted, #565970);
}
.my-report-time{
  margin-left: auto;
  font-size: .68rem;
  color: var(--text-muted, #565970);
}
.my-report-reason{
  font-size: .8rem;
  color: var(--text-primary, #e8e8f0);
  line-height: 1.4;
}
.my-report-resolution{
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--border, rgba(255,255,255,.07));
  font-size: .75rem;
  color: var(--text-secondary, #9498b3);
  font-style: italic;
}


/* ── Connections modal redesign (History / Blocked / Favorites / Reports) ──
   Overrides the minified rules above by cascade order (same specificity,
   later wins) — this file's convention: never hand-edit the minified body,
   only add to this tail. Widened + rebalanced for the 4th 'Reports' tab
   (the original grid was hardcoded to 3 columns and was overflowing/
   squished once Reports was added), plus a general visual refresh: tighter
   rhythm, a proper active-tab affordance, softer hover states, a themed
   scrollbar instead of the bare browser default. */

.connections-modal-inner{
  width: 480px;
  max-width: 480px;
  min-height: 440px;
  padding: 24px 24px 20px;
}

.connections-modal-header{
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border, rgba(0,0,0,.07));
}

.connections-modal-icon-badge{
  box-shadow: 0 6px 18px rgba(var(--accent-rgb,124,92,252),.35), inset 0 1px 0 rgba(255,255,255,.2);
}

.connections-tabs{
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  padding: 4px;
  border-radius: 12px;
}

.connections-tab{
  position: relative;
  flex-direction: column;
  gap: 4px;
  padding: 9px 4px 8px;
  border-radius: 9px;
  font-size: .6rem;
  letter-spacing: .2px;
  transition: background .18s ease, color .18s ease, transform .1s ease;
}

.connections-tab svg{
  width: 15px;
  height: 15px;
}

.connections-tab:hover{
  background: rgba(var(--accent-rgb,124,92,252),.08);
}

.connections-tab:active{
  transform: scale(.96);
}

.connections-tab.active{
  background: var(--bg-card, #fff);
  box-shadow: 0 2px 8px rgba(0,0,0,.12), 0 0 0 1px rgba(var(--accent-rgb,124,92,252),.18);
}

.connections-tab .connections-tab-count{
  position: absolute;
  top: 2px;
  right: 6px;
  box-shadow: 0 0 0 2px var(--bg-input, transparent);
}

.connections-tab.active .connections-tab-count{
  box-shadow: 0 0 0 2px var(--bg-card, transparent);
}

.connections-scroll{
  max-height: 360px;
  gap: 4px;
  padding: 2px 1px;
}

/* Thin, theme-aware scrollbar instead of the bare browser default */
.connections-scroll::-webkit-scrollbar{ width: 6px; }
.connections-scroll::-webkit-scrollbar-track{ background: transparent; }
.connections-scroll::-webkit-scrollbar-thumb{ background: var(--border-light, rgba(0,0,0,.15)); border-radius: 10px; }
.connections-scroll::-webkit-scrollbar-thumb:hover{ background: var(--text-muted, rgba(0,0,0,.3)); }

.connections-row{
  padding: 9px 10px;
  border-radius: 12px;
  border: 1px solid transparent;
  transition: background .15s ease, border-color .15s ease, transform .1s ease;
}

.connections-row:hover{
  background: var(--bg-hover, rgba(0,0,0,.035));
  border-color: var(--border, rgba(0,0,0,.06));
}

.connections-row:active{
  transform: scale(.99);
}

.connections-row .friend-avatar{
  width: 32px;
  height: 32px;
  box-shadow: 0 0 0 2px var(--bg-card);
  transition: box-shadow .15s ease;
}

.connections-row:hover .friend-avatar{
  box-shadow: 0 0 0 2px var(--bg-hover, var(--bg-card));
}

.connections-remove-btn, .connections-delete-btn, .connections-unfav-btn{
  opacity: .55;
  transition: opacity .15s ease, background .14s ease, border-color .14s ease, color .14s ease, transform .1s ease;
}

.connections-row:hover .connections-remove-btn,
.connections-row:hover .connections-delete-btn,
.connections-row:hover .connections-unfav-btn{
  opacity: 1;
}

.connections-delete-btn:hover{
  background: rgba(239,68,68,.12);
  color: #ef4444;
  transform: scale(1.08);
}

.connections-empty-icon-wrap{
  background: linear-gradient(135deg, rgba(var(--accent-rgb,124,92,252),.16), rgba(var(--accent-rgb,124,92,252),.05));
  box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb,124,92,252),.1);
}

.connections-empty-title{
  letter-spacing: .1px;
}

.connections-empty-desc{
  max-width: 280px;
}

/* Reports tab rows — bring them visually in line with the rest of the modal
   (rounded card, same spacing rhythm as the other tabs' rows). */
.connections-panel[data-panel="reports"] .connections-scroll{
  gap: 8px;
}

.my-report-row{
  border-radius: 12px;
  padding: 11px 13px;
  transition: border-color .15s ease;
}

.my-report-row:hover{
  border-color: var(--border-light, rgba(0,0,0,.12));
}

@media (max-width: 600px){
  .connections-modal-inner{ width: 100%; max-width: 100%; }
  .connections-tab{ font-size: .58rem; }
}


/* Connections modal ▸ Reports tab — quick link to the Community Guidelines
   page (public/guidelines.html), which every moderation notification
   references by URL but can't hyperlink directly (notification bodies are
   HTML-escaped on render). This is the actual clickable link. */
.connections-guidelines-link{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  margin-bottom: 8px;
  border-radius: 10px;
  background: rgba(var(--accent-rgb,124,92,252),.08);
  border: 1px solid rgba(var(--accent-rgb,124,92,252),.18);
  color: var(--accent, #7c5cfc);
  font-size: .78rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s ease, border-color .15s ease;
}
.connections-guidelines-link:hover{
  background: rgba(var(--accent-rgb,124,92,252),.14);
  border-color: rgba(var(--accent-rgb,124,92,252),.3);
  text-decoration: none;
}

/* Gift-received popup — receiver-only "unwrapping gift box" reveal, auto-dismisses after 3s */
.gift-popup-container{
  position: fixed;
  top: 74px;
  left: 50%;
  transform: translateX(-50%);
  /* Must outrank room float/modal z-index (base 10000009 — see
     getMaxFloatModalZ in app-room-modal.js/native.js) so the popup isn't
     silently hidden behind an open room window. */
  z-index: 10050000;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  pointer-events: none;
}
.gift-popup{
  position: relative;
  opacity: 0;
  transform: translateY(-26px) scale(.9);
  transition: opacity .35s cubic-bezier(.34,1.56,.64,1), transform .35s cubic-bezier(.34,1.56,.64,1);
  pointer-events: auto;
}
/* Confetti/ring live in their own unclipped overlay, sibling to (not inside)
   gift-popup-card — the card keeps overflow:hidden for its rounded corners
   and progress bar, which would otherwise chop the burst off mid-flight. */
.gift-popup-fx{
  position: absolute;
  inset: 0;
  overflow: visible;
  pointer-events: none;
}
.gift-popup.show{ opacity: 1; transform: translateY(0) scale(1); }
.gift-popup.removing{
  opacity: 0;
  transform: translateY(-16px) scale(.94);
  transition: opacity .3s ease, transform .3s ease;
}
/* Notification is sized at 1.5x the original baseline (card/box/icons/
   confetti/text all resized together, not a CSS transform, so layout/gap
   stacking between multiple popups stays correct). */
.gift-popup-card{
  position: relative;
  display: flex;
  align-items: center;
  gap: 21px;
  min-width: 390px;
  max-width: 510px;
  padding: 20px 33px 20px 20px;
  background: linear-gradient(155deg, var(--bg-secondary), var(--bg-tertiary));
  border: 1px solid var(--border-light);
  border-radius: 30px;
  box-shadow: 0 21px 51px rgba(0,0,0,.38), 0 6px 15px rgba(0,0,0,.28), 0 0 0 1px rgba(250,166,26,.16) inset, 0 0 30px -11px rgba(250,166,26,.4);
  overflow: hidden;
}
.gift-popup-card::before{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 18% 0%, rgba(250,166,26,.16), transparent 55%);
  pointer-events: none;
}
/* Slim signature stripe along the top edge — the "premium card" touch */
.gift-popup-card::after{
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--warning), var(--accent));
}
.gift-popup-box{
  position: relative;
  flex-shrink: 0;
  width: 80px;
  height: 75px;
}
.gift-popup-box-base{
  position: absolute;
  left: 2px;
  top: 23px;
  width: 75px;
  height: 50px;
  filter: drop-shadow(0 5px 11px rgba(0,0,0,.32));
}
.gift-popup-box-base svg{ display: block; width: 100%; height: 100%; }
.gift-popup-box-lid{
  position: absolute;
  left: 0;
  top: 5px;
  width: 80px;
  height: 32px;
  transform-origin: 50% 100%;
  transition: transform .5s cubic-bezier(.34,1.56,.64,1), opacity .3s ease .2s;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.3));
}
.gift-popup-box-lid svg{ display: block; width: 100%; height: 100%; }
.gift-popup.opened .gift-popup-box-lid{ transform: translateY(-36px) rotate(-32deg); opacity: 0; }
.gift-popup-box-reveal{
  position: absolute;
  left: 50%;
  top: 8px;
  width: 42px;
  height: 42px;
  transform: translate(-50%, 18px) scale(.35);
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 29px;
  line-height: 1;
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.35));
  transition: transform .45s cubic-bezier(.34,1.56,.64,1) .18s, opacity .3s ease .18s;
}
.gift-popup.opened .gift-popup-box-reveal{ transform: translate(-50%, -12px) scale(1); opacity: 1; }
.gift-popup-swatch{
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(255,255,255,.35), 0 0 12px -2px rgba(0,0,0,.4);
}
.gift-popup-badge-img{ width: 33px; height: 33px; object-fit: contain; }
.gift-popup-emoji{ font-size: 29px; line-height: 1; }
.gift-popup-crown-icon{ font-size: 30px; line-height: 1; }
img.gift-popup-crown-icon{ width: 33px; height: 33px; object-fit: contain; }
/* Mic-gift chat line ("🎁 admin sent KURO a ☕Coffee (100 TC)!") — the gift's
   uploaded image/GIF rides in via {{badge_icon}} with an inline height:1em;
   size it up so the art actually reads (clients tag the line .mic-gift-message
   when the notice carries message.mic_gift). */
.system-message.gift-message.mic-gift-message .gift-message-text img{
  height: 2.4em !important;
  width: auto !important;
  vertical-align: middle !important;
  margin: -.35em .1em -.3em 0;
}
/* Mic-gift in-room celebration — server broadcasts `mic-gift-fx` to everyone
   viewing the room; the gift itself (emoji, or the admin-uploaded image/GIF
   from mic_gift_catalog) drops in over the room modal/window, wiggles, and
   bursts confetti. No card, no text. Confetti vectors are randomized inline
   (--mx/--my/--dx/--dy/--rot) by the client and ride gift-popup-confetti-burst. */
.mic-gift-fx{
  position: absolute;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  overflow: hidden;
  transition: opacity .45s ease;
}
.mic-gift-fx.out{ opacity: 0; }
.mic-gift-fx-stage{
  position: relative;
  width: calc(160px * var(--mgfx-scale, 1));
  height: calc(160px * var(--mgfx-scale, 1));
  display: flex;
  align-items: center;
  justify-content: center;
}
.mic-gift-fx-glow{
  position: absolute;
  inset: -20px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,209,102,.55) 0%, rgba(255,209,102,.18) 45%, transparent 70%);
  animation: mic-gift-fx-glow-in .5s ease-out both, mic-gift-fx-glow-pulse 1.6s ease-in-out .5s infinite;
}
@keyframes mic-gift-fx-glow-in{ from{ opacity: 0; transform: scale(.4); } to{ opacity: 1; transform: scale(1); } }
@keyframes mic-gift-fx-glow-pulse{
  0%,100%{ opacity: 1; transform: scale(1); }
  50%{ opacity: .6; transform: scale(1.15); }
}
.mic-gift-fx-ring{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  border-radius: 50%;
  border: 4px solid var(--warning);
  opacity: 0;
  animation: gift-popup-ring-burst .7s ease-out .3s forwards;
}
.mic-gift-fx-art{
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.4));
  /* no base opacity:0 — `both` hides it only while the drop-in runs, so the
     gift still shows if animations are globally off (native perf-mode) */
  animation: mic-gift-fx-drop .7s cubic-bezier(.34,1.56,.64,1) both, mic-gift-fx-idle 1.4s ease-in-out .7s infinite;
}
@keyframes mic-gift-fx-drop{
  0%{ opacity: 0; transform: translateY(-140px) scale(.2) rotate(-25deg); }
  60%{ opacity: 1; transform: translateY(8px) scale(1.18) rotate(8deg); }
  100%{ opacity: 1; transform: translateY(0) scale(1) rotate(0); }
}
@keyframes mic-gift-fx-idle{
  0%,50%,100%{ opacity: 1; transform: translateY(0) scale(1) rotate(0); }
  25%{ opacity: 1; transform: translateY(-8px) scale(1.06) rotate(-8deg); }
  75%{ opacity: 1; transform: translateY(-8px) scale(1.06) rotate(8deg); }
}
.mic-gift-fx-emoji{ font-size: calc(110px * var(--mgfx-scale, 1)); line-height: 1; }
.mic-gift-fx-img{ width: calc(140px * var(--mgfx-scale, 1)); height: calc(140px * var(--mgfx-scale, 1)); object-fit: contain; }
.mic-gift-fx-sparkles{ position: absolute; inset: 0; z-index: 3; }
.mic-gift-fx-sparkle{
  position: absolute;
  width: 16px;
  height: 16px;
  opacity: 0;
  background: #fff6da;
  clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
  animation: mic-gift-fx-twinkle 1.2s ease-in-out infinite;
}
.mic-gift-fx-sparkle:nth-of-type(1){ left: 6px; top: 14px; animation-delay: .4s; }
.mic-gift-fx-sparkle:nth-of-type(2){ right: 4px; top: 34px; width: 12px; height: 12px; animation-delay: .8s; }
.mic-gift-fx-sparkle:nth-of-type(3){ left: 22px; bottom: 8px; width: 11px; height: 11px; animation-delay: 1.1s; }
.mic-gift-fx-sparkle:nth-of-type(4){ right: 18px; bottom: 16px; width: 14px; height: 14px; animation-delay: .6s; }
@keyframes mic-gift-fx-twinkle{
  0%,100%{ opacity: 0; transform: scale(.3) rotate(0); }
  50%{ opacity: 1; transform: scale(1) rotate(90deg); }
}
.mic-gift-fx-confetti{
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  opacity: 0;
  animation: gift-popup-confetti-burst 1.8s cubic-bezier(.25,.65,.35,1) forwards;
}
/* Per-gift options (Manage Gifts row editor): steady = the gift just fades
   in and holds still, no drop/wiggle/twinkle; no-confetti drops the burst ring
   (the confetti spans themselves aren't generated). Size rides --mgfx-scale. */
.mic-gift-fx.is-steady .mic-gift-fx-art{ animation: mic-gift-fx-fade-in .4s ease-out both; }
.mic-gift-fx.is-steady .mic-gift-fx-glow{ animation: mic-gift-fx-glow-in .4s ease-out both; }
.mic-gift-fx.is-steady .mic-gift-fx-sparkles,
.mic-gift-fx.no-confetti .mic-gift-fx-ring{ display: none; }
@keyframes mic-gift-fx-fade-in{ from{ opacity: 0; } to{ opacity: 1; } }
@media (prefers-reduced-motion: reduce){
  .mic-gift-fx-art{ animation: mic-gift-fx-drop .01s forwards; }
  .mic-gift-fx-glow{ animation: mic-gift-fx-glow-in .01s forwards; }
  .mic-gift-fx-sparkle, .mic-gift-fx-ring{ animation: none; }
}
/* Shockwave ring — the "crack" behind the popper's confetti burst */
.gift-popup-ring{
  position: absolute;
  left: 60px;
  top: 57px;
  width: 21px;
  height: 21px;
  margin: -10.5px 0 0 -10.5px;
  border-radius: 50%;
  border: 3px solid var(--warning);
  opacity: 0;
  pointer-events: none;
}
.gift-popup.opened .gift-popup-ring{ animation: gift-popup-ring-burst .55s ease-out forwards; }
@keyframes gift-popup-ring-burst{
  0%{ opacity: .85; transform: scale(.3); border-color: var(--warning); }
  100%{ opacity: 0; transform: scale(5.5); border-color: var(--accent); }
}
/* Card gets a little squash-and-stretch "pop" the instant the box cracks open */
.gift-popup.opened .gift-popup-card{ animation: gift-popup-card-pop .5s cubic-bezier(.34,1.56,.64,1); }
@keyframes gift-popup-card-pop{
  0%{ transform: scale(1) rotate(0); }
  25%{ transform: scale(1.035) rotate(-1.2deg); }
  55%{ transform: scale(.985) rotate(1deg); }
  100%{ transform: scale(1) rotate(0); }
}
/* Confetti burst — party-popper spray of colored bits that fly out then fall,
   spinning, like real confetti (not just a soft sparkle). Wrapped on its own
   so :nth-child below counts confetti pieces only, not their box siblings. */
.gift-popup-confetti-wrap{ position: static; pointer-events: none; }
.gift-popup-confetti{
  position: absolute;
  width: 8px;
  height: 8px;
  top: 53px;
  left: 58px;
  opacity: 0;
  pointer-events: none;
}
.gift-popup.opened .gift-popup-confetti{ animation: gift-popup-confetti-burst .95s cubic-bezier(.25,.65,.35,1) forwards; }
@keyframes gift-popup-confetti-burst{
  0%{ opacity: 1; transform: translate(0,0) rotate(0deg) scale(1); }
  32%{ opacity: 1; transform: translate(var(--mx), var(--my)) rotate(calc(var(--rot) * .4)) scale(1); }
  100%{ opacity: 0; transform: translate(var(--dx), var(--dy)) rotate(var(--rot)) scale(.75); }
}
.gift-popup-confetti:nth-child(1){ --mx: -30px; --my: -42px; --dx: -57px; --dy: 30px; --rot: 260deg; background: #ef476f; width: 8px; height: 14px; animation-delay: .02s; }
.gift-popup-confetti:nth-child(2){ --mx: 27px; --my: -48px; --dx: 51px; --dy: 24px; --rot: -300deg; background: #ffd166; width: 9px; height: 9px; border-radius: 50%; animation-delay: .06s; }
.gift-popup-confetti:nth-child(3){ --mx: -45px; --my: -18px; --dx: -81px; --dy: 66px; --rot: 340deg; background: #06d6a0; width: 6px; height: 12px; animation-delay: .1s; }
.gift-popup-confetti:nth-child(4){ --mx: 42px; --my: -21px; --dx: 78px; --dy: 72px; --rot: -360deg; background: #118ab2; width: 8px; height: 8px; border-radius: 50%; animation-delay: .04s; }
.gift-popup-confetti:nth-child(5){ --mx: -12px; --my: -51px; --dx: -18px; --dy: -12px; --rot: 220deg; background: var(--accent); width: 6px; height: 12px; animation-delay: .13s; }
.gift-popup-confetti:nth-child(6){ --mx: 15px; --my: -54px; --dx: 24px; --dy: -15px; --rot: -240deg; background: #ffd166; width: 8px; height: 8px; border-radius: 50%; animation-delay: .08s; }
.gift-popup-confetti:nth-child(7){ --mx: -51px; --my: 6px; --dx: -93px; --dy: 87px; --rot: 300deg; background: #ef476f; width: 8px; height: 8px; border-radius: 50%; animation-delay: .16s; }
.gift-popup-confetti:nth-child(8){ --mx: 48px; --my: 3px; --dx: 90px; --dy: 90px; --rot: -320deg; background: #06d6a0; width: 9px; height: 9px; animation-delay: .05s; }
.gift-popup-confetti:nth-child(9){ --mx: -21px; --my: -45px; --dx: -33px; --dy: -51px; --rot: 260deg; background: #118ab2; width: 6px; height: 14px; animation-delay: .19s; }
.gift-popup-confetti:nth-child(10){ --mx: 24px; --my: -42px; --dx: 39px; --dy: -45px; --rot: -280deg; background: #ef476f; width: 6px; height: 12px; animation-delay: .11s; }
.gift-popup-confetti:nth-child(11){ --mx: -33px; --my: -27px; --dx: -66px; --dy: 45px; --rot: 400deg; background: var(--accent); width: 8px; height: 8px; border-radius: 50%; animation-delay: .15s; }
.gift-popup-confetti:nth-child(12){ --mx: 36px; --my: -30px; --dx: 69px; --dy: 48px; --rot: -420deg; background: #ffd166; width: 6px; height: 12px; animation-delay: .07s; }
.gift-popup-confetti:nth-child(13){ --mx: -6px; --my: -33px; --dx: -9px; --dy: 93px; --rot: 320deg; background: #06d6a0; width: 8px; height: 8px; border-radius: 50%; animation-delay: .18s; }
.gift-popup-confetti:nth-child(14){ --mx: 9px; --my: -36px; --dx: 15px; --dy: 96px; --rot: -340deg; background: #118ab2; width: 6px; height: 14px; animation-delay: .12s; }
.gift-popup-text{ min-width: 0; }
.gift-popup-title{
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  font-size: 1.38em;
  letter-spacing: -.01em;
  color: var(--text-primary);
}
.gift-popup-desc{
  font-size: 1.2em;
  color: var(--text-secondary);
  line-height: 1.45;
  margin-top: 4px;
}
.gift-popup-desc b{ color: var(--text-primary); font-weight: 600; }
.gift-popup-close{
  position: absolute;
  top: 9px;
  right: 9px;
  width: 24px;
  height: 24px;
  border: none;
  background: none;
  color: var(--text-muted);
  font-size: 1.43em;
  line-height: 1;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s, background .15s, color .15s;
}
.gift-popup-card:hover .gift-popup-close{ opacity: 1; }
.gift-popup-close:hover{ background: var(--bg-hover); color: var(--text-primary); }
.gift-popup-progress{
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4.5px;
  width: 100%;
  background: linear-gradient(90deg, var(--warning), var(--accent));
  transform: scaleX(1);
  transform-origin: left;
  transition: transform linear;
}
@media (max-width: 768px){
  .gift-popup-container{ left: 10px; right: 10px; transform: none; }
  .gift-popup-card{ min-width: unset; max-width: unset; width: 100%; }
}

/* Send-a-gift-to-mic-user — 🎁 button on the mic-owner row + the gift picker
   it opens. Flat-priced TC catalog (see MIC_GIFT_CATALOG in app-room-modal.js
   / native.js / socketHandlers.js), single-select-then-confirm like the other
   gift pickers in this app. */
/* Pinned to a fixed spot on the row (not a flex sibling) so it never drifts
   with name length and never grows/shifts on hover — sticky in one place.
   Scoped to :has(.mic-gift-btn) since .voice-user-item is reused (without a
   gift button) for the header mini voice display in app-users.js. */
.voice-user-item:has(.mic-gift-btn){ padding-right: 32px; }
.mic-gift-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(var(--accent-rgb,124,92,252),.12);
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  opacity: .8;
  transition: opacity .15s ease, background .15s ease;
}
.mic-gift-btn:hover{ opacity: 1; background: rgba(var(--accent-rgb,124,92,252),.22); }
.mic-gift-btn:active{ opacity: .65; }

.mic-gift-overlay{
  position: fixed;
  inset: 0;
  z-index: 10055000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.5);
  opacity: 0;
  transition: opacity .2s ease;
  padding: 16px;
}
.mic-gift-overlay.show{ opacity: 1; }
.mic-gift-modal{
  width: 100%;
  max-width: 420px;
  background: linear-gradient(160deg, var(--bg-secondary), var(--bg-tertiary));
  border: 1px solid var(--border-light);
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(0,0,0,.45), 0 0 0 1px rgba(var(--accent-rgb,124,92,252),.12) inset;
  padding: 16px;
  transform: translateY(14px) scale(.96);
  transition: transform .25s cubic-bezier(.34,1.56,.64,1);
}
.mic-gift-overlay.show .mic-gift-modal{ transform: translateY(0) scale(1); }
.mic-gift-header{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.mic-gift-header-title{ display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; }
.mic-gift-header-icon{
  font-size: 22px;
  line-height: 1;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(250,166,26,.14);
  flex-shrink: 0;
}
.mic-gift-header-text{ min-width: 0; }
.mic-gift-title{ font-weight: 700; font-size: .95rem; color: var(--text-primary); }
.mic-gift-subtitle{
  font-size: .78rem;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mic-gift-subtitle b{ color: var(--text-primary); }
.mic-gift-balance{
  flex-shrink: 0;
  font-size: .75rem;
  font-weight: 600;
  color: var(--text-primary);
  background: rgba(var(--accent-rgb,124,92,252),.1);
  border: 1px solid rgba(var(--accent-rgb,124,92,252),.2);
  border-radius: 999px;
  padding: 4px 10px;
}
.mic-gift-close{
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: var(--text-muted);
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
}
.mic-gift-close:hover{ background: var(--bg-hover); color: var(--text-primary); }
.mic-gift-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
  gap: 8px;
  max-height: 300px;
  overflow-y: auto;
  padding: 2px;
}
.mic-gift-grid.mic-gift-sent-flash{ animation: mic-gift-sent-flash .5s ease; }
@keyframes mic-gift-sent-flash{
  0%{ filter: brightness(1); }
  40%{ filter: brightness(1.35); }
  100%{ filter: brightness(1); }
}
.mic-gift-card{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 6px 8px;
  border: 1px solid var(--border-light);
  border-radius: 12px;
  background: var(--bg-primary, var(--bg-secondary));
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.mic-gift-card:hover:not(.disabled){
  transform: translateY(-2px);
  border-color: rgba(var(--accent-rgb,124,92,252),.5);
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
}
.mic-gift-card.selected{
  border-color: var(--accent, #7c5cfc);
  background: rgba(var(--accent-rgb,124,92,252),.1);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb,124,92,252),.35);
}
.mic-gift-card.disabled{ opacity: .4; cursor: not-allowed; }
.mic-gift-emoji{ font-size: 24px; line-height: 1; }
.mic-gift-name{
  font-size: .68rem;
  font-weight: 600;
  color: var(--text-primary);
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.mic-gift-price{
  font-size: .66rem;
  font-weight: 700;
  color: var(--warning);
}
.mic-gift-footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border-light);
}
.mic-gift-footer-info{
  font-size: .78rem;
  color: var(--text-secondary);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mic-gift-footer-info b{ color: var(--text-primary); }
.mic-gift-send-btn{
  flex-shrink: 0;
  padding: 8px 18px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--accent, #7c5cfc), #9b6bff);
  color: #fff;
  font-weight: 700;
  font-size: .82rem;
  cursor: pointer;
  transition: opacity .15s ease, transform .15s ease;
}
.mic-gift-send-btn:hover:not(:disabled){ transform: translateY(-1px); }
.mic-gift-send-btn:disabled{ opacity: .4; cursor: not-allowed; }
@media (max-width: 768px){
  .mic-gift-modal{ max-width: unset; }
  .mic-gift-grid{ grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); }
}
.mic-gift-icon-img{ width: 24px; height: 24px; object-fit: contain; border-radius: 6px; }

/* Admin "Manage Gifts" modal (#gift-modal). The modal chrome (header,
   sections, dropzone, add-row, inputs) reuses the shared .emoji-mgr/.font-mgr
   classes also used by Manage Fonts/Emojis — every override here is scoped
   under .gift-mgr-modal so those other two admin panels are untouched. The
   list rows (.gift-mgr-*) are built in _renderGiftManager / renderGiftManager.
   Layout: wide two-pane — "Add a gift" is a fixed left rail, the catalog
   scrolls on the right; a container query folds it to one column when the
   modal itself gets narrow (so it also works inside small native windows).
   Tints go through color-mix() so nord + daylight both read right. */
.gift-mgr-modal{
  --gm-accent: var(--accent,#7c5cfc);
  --gm-gold: var(--warning,#faa61a);
  --gm-line: var(--border,#3b3e5e);
  --gm-soft: color-mix(in srgb, var(--gm-accent) 10%, transparent);
  width: min(1080px, 95vw) !important;
  max-width: none !important;
  height: min(800px, 90vh);
  container: giftmgr / inline-size;
  background: var(--bg-primary,#2b2d45);
  border: 1px solid var(--gm-line);
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.55), 0 0 0 1px color-mix(in srgb, var(--gm-accent) 8%, transparent);
  transition: opacity .22s ease, scale .22s cubic-bezier(.2,.9,.3,1.2);
}
@starting-style{ .gift-mgr-modal{ opacity: 0; scale: .97; } }

/* Header */
.gift-mgr-modal .emoji-mgr-head{
  padding: 22px 28px;
  background:
    radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--gm-gold) 14%, transparent), transparent 55%),
    radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--gm-accent) 14%, transparent), transparent 55%);
  border-bottom: 1px solid var(--gm-line);
}
.gift-mgr-modal .emoji-mgr-head-icon{
  width: 48px; height: 48px; font-size: 24px; border-radius: 14px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--gm-gold) 28%, transparent), color-mix(in srgb, var(--gm-accent) 22%, transparent));
  border: 1px solid color-mix(in srgb, var(--gm-gold) 35%, transparent);
  box-shadow: 0 8px 20px -8px color-mix(in srgb, var(--gm-gold) 60%, transparent);
}
.gift-mgr-modal .emoji-mgr-head-text h3{ font-size: 18px; letter-spacing: -.02em; }
.gift-mgr-modal .emoji-mgr-head-text p{ font-size: 12.5px; max-width: 60ch; }

/* Two-pane body */
.gift-mgr-modal .emoji-mgr-body{
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr);
  gap: 0; padding: 0; overflow: hidden;
}
.gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section{ min-height: 0; gap: 14px; }
.gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section:first-child{
  padding: 24px; overflow-y: auto;
  border-right: 1px solid var(--gm-line);
  background: color-mix(in srgb, var(--bg-secondary,#363858) 55%, transparent);
}
.gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section:last-child{
  padding: 0 28px 24px; overflow-y: auto; scrollbar-gutter: stable;
}
.gift-mgr-modal .emoji-mgr-section-title{ font-size: 11px; letter-spacing: .08em; }

/* Add-a-gift rail */
.gift-mgr-modal .emoji-mgr-dropzone{
  padding: 26px 18px; gap: 6px; border-radius: 16px;
  border: 1.5px dashed color-mix(in srgb, var(--gm-accent) 45%, transparent);
  background: var(--gm-soft);
  transition: border-color .15s ease, background .15s ease, translate .15s ease;
}
.gift-mgr-modal .emoji-mgr-dropzone:hover{
  border-color: var(--gm-accent);
  background: color-mix(in srgb, var(--gm-accent) 15%, transparent);
  translate: 0 -1px;
}
.gift-mgr-modal .emoji-mgr-dropzone-icon{
  width: 44px; height: 44px; display: grid; place-items: center; font-size: 20px; border-radius: 12px;
  background: var(--bg-card,#343658); box-shadow: 0 4px 12px -6px rgba(0,0,0,.4);
}
.gift-mgr-modal .emoji-mgr-dropzone-title{ max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gift-mgr-modal .font-mgr-add-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gift-mgr-modal .font-mgr-add-row input{
  width: 100%; max-width: none !important; min-width: 0;
  border-radius: 10px; border: 1px solid var(--gm-line);
  background: var(--bg-card,#343658); color: var(--text-primary);
  padding: 10px 12px; font-size: 13.5px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.gift-mgr-modal .font-mgr-add-row input:focus{
  outline: none; border-color: var(--gm-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--gm-accent) 20%, transparent);
}
.gift-mgr-modal #gift-name-input,
.gift-mgr-modal #gift-add-btn{ grid-column: 1 / -1; }
.gift-mgr-modal #gift-add-btn{
  height: 42px; border-radius: 11px; border: none; color: #fff; font-weight: 700; font-size: 13.5px;
  background: linear-gradient(135deg, var(--gm-accent), color-mix(in srgb, var(--gm-accent) 70%, #c084fc));
  box-shadow: 0 8px 20px -8px color-mix(in srgb, var(--gm-accent) 70%, transparent);
  transition: translate .15s ease, box-shadow .15s ease, filter .15s ease;
}
.gift-mgr-modal #gift-add-btn:hover{ translate: 0 -1px; filter: brightness(1.06); }
.gift-mgr-modal #gift-add-btn:active{ translate: 0 0; }
.gift-mgr-modal #gift-add-btn:disabled{ opacity: .6; cursor: progress; }
.gift-mgr-tip{
  margin: 0; padding: 12px 14px; border-radius: 12px; font-size: 12px; line-height: 1.5;
  color: var(--text-secondary,#9498b3);
  background: var(--bg-card,#343658); border: 1px solid var(--gm-line);
}

/* Catalog pane — sticky head with count + search */
.gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section:last-child > .emoji-mgr-section-head{
  position: sticky; top: 0; z-index: 2;
  padding: 22px 0 14px; margin-bottom: -2px;
  background: var(--bg-primary,#2b2d45);
  flex-wrap: nowrap;
}
.gift-mgr-count{
  font-size: 11px; font-weight: 600; white-space: nowrap;
  color: var(--text-secondary,#9498b3);
  padding: 3px 10px; border-radius: 999px;
  background: var(--bg-card,#343658); border: 1px solid var(--gm-line);
}
.gift-mgr-count:empty{ display: none; }
.gift-mgr-search{
  margin-left: auto; width: min(260px, 100%); min-width: 0;
  padding: 8px 12px 8px 34px; border-radius: 10px; font-size: 13px;
  border: 1px solid var(--gm-line); color: var(--text-primary);
  background: var(--bg-card,#343658) no-repeat 11px 50% / 15px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b8fad' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  transition: border-color .15s ease, box-shadow .15s ease;
}
.gift-mgr-search:focus{ outline: none; border-color: var(--gm-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gm-accent) 20%, transparent); }

/* The list: one bordered surface, hairline dividers between rows */
.gift-mgr-modal #gift-mgr-list{
  gap: 0; border-radius: 16px; overflow: hidden;
  border: 1px solid var(--gm-line);
  background: var(--bg-secondary,#363858);
}
.gift-mgr-row{
  display: flex; align-items: center; gap: 14px; padding: 12px 16px;
  border-bottom: 1px solid var(--gm-line);
  transition: background .15s ease, opacity .15s ease;
}
.gift-mgr-row:last-child{ border-bottom: none; }
.gift-mgr-row:hover{ background: color-mix(in srgb, var(--gm-accent) 5%, transparent); }
.gift-mgr-row.is-disabled > :not(.gift-mgr-row-actions){ opacity: .45; }
.gift-mgr-row[hidden], .gift-mgr-editor[hidden]{ display: none; }
.gift-mgr-preview{
  flex-shrink: 0; width: 48px; height: 48px; display: grid; place-items: center;
  font-size: 26px; line-height: 1; border-radius: 13px; overflow: hidden;
  background: radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--gm-gold) 22%, transparent), transparent 70%), var(--bg-card,#343658);
  border: 1px solid var(--gm-line);
  color: var(--text-primary,#e2e4f0);
}
.gift-mgr-icon-img{ width: 32px; height: 32px; object-fit: contain; }
.gift-mgr-row-main{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.gift-mgr-name-input{
  width: 100%; max-width: 320px; padding: 4px 8px; margin-left: -8px; border-radius: 7px;
  border: 1px solid transparent; background: transparent;
  color: var(--text-primary,#e2e4f0); font-size: 14px; font-weight: 650; letter-spacing: -.005em;
  transition: border-color .15s ease, background .15s ease;
}
.gift-mgr-name-input:hover{ border-color: var(--gm-line); }
.gift-mgr-name-input:focus{ outline: none; border-color: var(--gm-accent); background: var(--bg-card,#343658); }
.gift-mgr-row-badges{ display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.gift-mgr-cost-badge{
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 700; line-height: 1.6; font-variant-numeric: tabular-nums;
  color: var(--gm-gold);
  background: color-mix(in srgb, var(--gm-gold) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--gm-gold) 30%, transparent);
  border-radius: 999px; padding: 1px 9px;
}
.gift-mgr-type-badge,
.gift-mgr-fx-badge{
  font-size: 11px; font-weight: 600; line-height: 1.6;
  padding: 1px 9px; border-radius: 999px;
  color: var(--text-secondary,#8b8fad); border: 1px solid var(--gm-line);
}
.gift-mgr-type-badge.is-system{
  color: var(--gm-accent);
  border-color: color-mix(in srgb, var(--gm-accent) 35%, transparent);
  background: var(--gm-soft);
}
.gift-mgr-fx-badge{ background: color-mix(in srgb, var(--text-muted,#8b8fad) 8%, transparent); border-color: transparent; }
.gift-mgr-row-actions{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.gift-mgr-toggle{ position: relative; width: 38px; height: 22px; flex-shrink: 0; cursor: pointer; }
.gift-mgr-toggle input{ position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.gift-mgr-toggle span{
  position: absolute; inset: 0; border-radius: 999px;
  background: var(--bg-card,#343658); border: 1px solid var(--gm-line);
  transition: background .18s ease, border-color .18s ease;
}
.gift-mgr-toggle span::before{
  content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--text-muted,#8b8fad); box-shadow: 0 1px 3px rgba(0,0,0,.3);
  transition: translate .18s cubic-bezier(.3,1.4,.5,1), background .18s ease;
}
.gift-mgr-toggle input:checked + span{ background: var(--gm-accent); border-color: var(--gm-accent); }
.gift-mgr-toggle input:checked + span::before{ translate: 16px 0; background: #fff; }
.gift-mgr-toggle input:focus-visible + span{ box-shadow: 0 0 0 3px color-mix(in srgb, var(--gm-accent) 30%, transparent); }
.gift-mgr-btn{
  width: 34px; height: 34px; display: inline-grid; place-items: center; padding: 0;
  border: 1px solid transparent; border-radius: 10px; background: transparent;
  color: var(--text-secondary,#9498b3); cursor: pointer;
  opacity: .7; transition: background .12s, color .12s, border-color .12s, opacity .12s;
}
.gift-mgr-btn svg{ display: block; }
.gift-mgr-row:hover .gift-mgr-btn, .gift-mgr-row.is-editing .gift-mgr-btn, .gift-mgr-btn:focus-visible{ opacity: 1; }
.gift-mgr-btn:hover:not(:disabled){ background: var(--bg-card,#343658); border-color: var(--gm-line); color: var(--text-primary); }
.gift-mgr-btn.gift-mgr-del:hover:not(:disabled){
  background: color-mix(in srgb, #e5534b 14%, transparent);
  border-color: color-mix(in srgb, #e5534b 40%, transparent); color: #e5534b;
}
.gift-mgr-btn:disabled{ opacity: 0 !important; pointer-events: none; }
.gift-mgr-row.is-editing{ background: var(--gm-soft); border-bottom-color: transparent; }
.gift-mgr-row.is-editing .gift-mgr-edit-btn{
  color: var(--gm-accent); background: color-mix(in srgb, var(--gm-accent) 14%, transparent);
  border-color: color-mix(in srgb, var(--gm-accent) 35%, transparent);
}
.gift-mgr-empty{ padding: 36px 16px; text-align: center; margin: 0; }

/* Per-row editor (✏️) — price/emoji/icon + in-room fx options (animated/
   steady, confetti, size). Built in _toggleGiftRowEditor (web) /
   toggleGiftRowEditor (native), inserted right under its .gift-mgr-row. */
.gift-mgr-editor{
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
  padding: 4px 16px 16px 78px;
  background: var(--gm-soft);
  border-bottom: 1px solid var(--gm-line);
  transition: opacity .2s ease, translate .2s ease;
}
.gift-mgr-editor:last-child{ border-bottom: none; }
@starting-style{ .gift-mgr-editor{ opacity: 0; translate: 0 -6px; } }
.gift-mgr-ed-grid{ grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 10px; }
.gift-mgr-ed-field{ display: flex; flex-direction: column; gap: 5px; min-width: 0; font-size: 11px; font-weight: 600; color: var(--text-muted,#8b8fad); }
.gift-mgr-ed-field input{
  width: 100%; padding: 8px 10px; border-radius: 9px; border: 1px solid var(--gm-line);
  background: var(--bg-primary,#2b2d45); color: var(--text-primary,#e2e4f0); font-size: 13px;
}
.gift-mgr-ed-field input:focus{ outline: none; border-color: var(--gm-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gm-accent) 20%, transparent); }
.gift-mgr-ed-file-btn{
  padding: 8px 10px; border-radius: 9px; border: 1px dashed var(--gm-line); cursor: pointer;
  background: var(--bg-primary,#2b2d45); color: var(--text-secondary,#9498b3);
  font-size: 12.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gift-mgr-ed-file-btn:hover{ border-color: var(--gm-accent); color: var(--text-primary,#e2e4f0); }
/* The three fx settings render as tiles: label on top, control below */
.gift-mgr-ed-line{
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 34px;
  align-items: center; align-content: start; gap: 10px 12px;
  padding: 12px 14px; border-radius: 12px;
  background: var(--bg-primary,#2b2d45); border: 1px solid var(--gm-line);
}
.gift-mgr-ed-label{ grid-column: 1 / -1; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted,#8b8fad); line-height: 1; }
.gift-mgr-ed-seg{
  grid-column: 1 / -1; align-self: stretch; display: grid; grid-template-columns: 1fr 1fr; padding: 3px; border-radius: 10px;
  background: var(--bg-card,#343658); border: 1px solid var(--gm-line);
}
.gift-mgr-ed-seg button{
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 0;
  border: none; background: transparent; color: var(--text-secondary,#9498b3); cursor: pointer;
  font: inherit; font-size: 12.5px; font-weight: 600; padding: 0 8px; border-radius: 7px; white-space: nowrap; overflow: hidden;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.gift-mgr-ed-seg button:hover:not(.active){ color: var(--text-primary,#e2e4f0); }
.gift-mgr-ed-seg button.active{ background: var(--gm-accent); color: #fff; box-shadow: 0 4px 10px -4px color-mix(in srgb, var(--gm-accent) 70%, transparent); }
.gift-mgr-ed-hint{ font-size: 12.5px; color: var(--text-secondary,#9498b3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Custom range: filled track rides --pct (set inline by the editor JS) */
.gift-mgr-ed-size, .gift-mgr-ed-dur{
  -webkit-appearance: none; appearance: none; width: 100%; min-width: 0; height: 6px; margin: 0;
  border-radius: 999px; cursor: pointer; background:
    linear-gradient(var(--gm-accent), var(--gm-accent)) 0 / var(--pct, 27%) 100% no-repeat,
    color-mix(in srgb, var(--text-muted,#8b8fad) 25%, transparent);
}
.gift-mgr-ed-size::-webkit-slider-thumb, .gift-mgr-ed-dur::-webkit-slider-thumb{
  -webkit-appearance: none; appearance: none; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; border: 2px solid var(--gm-accent);
  box-shadow: 0 2px 6px rgba(0,0,0,.25); transition: scale .12s ease;
}
.gift-mgr-ed-size::-moz-range-thumb, .gift-mgr-ed-dur::-moz-range-thumb{
  width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid var(--gm-accent);
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.gift-mgr-ed-size:hover::-webkit-slider-thumb, .gift-mgr-ed-size:active::-webkit-slider-thumb,
.gift-mgr-ed-dur:hover::-webkit-slider-thumb, .gift-mgr-ed-dur:active::-webkit-slider-thumb{ scale: 1.15; }
.gift-mgr-ed-size:focus-visible, .gift-mgr-ed-dur:focus-visible{ outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--gm-accent) 25%, transparent); }
.gift-mgr-ed-size-val{
  min-width: 48px; text-align: center; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums;
  padding: 3px 6px; border-radius: 7px; color: var(--gm-accent); background: var(--gm-soft);
}
.gift-mgr-ed-actions{ grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.gift-mgr-ed-status{ flex: 1; min-width: 0; font-size: 12px; }
/* Normalized action buttons — .btn-sm/.btn-accent vary per theme, so pin
   size + type here (daylight's accent button otherwise renders oversized). */
.gift-mgr-ed-actions .btn-sm{
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; padding: 0 16px; margin: 0; border-radius: 10px;
  font: inherit; font-size: 13px !important; font-weight: 600; line-height: 1;
  border: 1px solid var(--gm-line); background: var(--bg-primary,#2b2d45); color: var(--text-primary,#e2e4f0);
  box-shadow: none; transition: background .12s ease, border-color .12s ease, filter .12s ease;
}
.gift-mgr-ed-actions .btn-sm:hover:not(:disabled){ border-color: color-mix(in srgb, var(--gm-accent) 45%, transparent); }
.gift-mgr-ed-actions .gift-mgr-ed-preview{ color: var(--gm-accent); }
.gift-mgr-ed-actions .gift-mgr-ed-cancel{ background: transparent; border-color: transparent; color: var(--text-secondary,#9498b3); }
.gift-mgr-ed-actions .gift-mgr-ed-cancel:hover{ background: var(--bg-primary,#2b2d45); color: var(--text-primary,#e2e4f0); }
.gift-mgr-ed-actions .gift-mgr-ed-save{
  min-width: 84px; border-color: transparent; color: #fff;
  background: var(--gm-accent); box-shadow: 0 6px 14px -6px color-mix(in srgb, var(--gm-accent) 70%, transparent);
}
.gift-mgr-ed-actions .gift-mgr-ed-save:hover:not(:disabled){ filter: brightness(1.08); border-color: transparent; }
.gift-mgr-ed-actions .btn-sm:disabled{ opacity: .6; cursor: progress; }

/* Narrow modal (small window / phone): one column, whole body scrolls */
@container giftmgr (max-width: 820px){
  .gift-mgr-modal .emoji-mgr-body{ display: block; overflow-y: auto; }
  .gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section:first-child{ border-right: none; border-bottom: 1px solid var(--gm-line); overflow: visible; }
  .gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section:last-child{ overflow: visible; padding: 0 20px 20px; }
  .gift-mgr-editor{ grid-template-columns: 1fr; padding-left: 16px; }
  .gift-mgr-ed-grid{ grid-template-columns: 1fr 1fr; }
  .gift-mgr-ed-file{ grid-column: 1 / -1; }
}
@container giftmgr (max-width: 480px){
  .gift-mgr-modal .emoji-mgr-head{ padding: 18px 20px; }
  .gift-mgr-search{ width: 100%; }
  .gift-mgr-modal .emoji-mgr-body > .emoji-mgr-section:last-child > .emoji-mgr-section-head{ flex-wrap: wrap; }
  .gift-mgr-row{ flex-wrap: wrap; }
  .gift-mgr-row-actions{ margin-left: auto; }
}

/* ── DM gift button + menu + "🎁 X gifted Y" notice line ── */
.dm-float-gift:hover{color:#f472b6;background:rgba(244,114,182,.14)}
.dm-gift-menu{position:fixed;z-index:10200004;min-width:170px;padding:4px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:2px;animation:rfEmojiAcIn .12s ease}
.dm-gift-menu-item{all:unset;box-sizing:border-box;padding:7px 10px;border-radius:7px;font-size:13px;color:var(--text-primary);cursor:pointer;white-space:pre}
.dm-gift-menu-item:hover,.dm-gift-menu-item:focus-visible{background:rgba(244,114,182,.14)}
.dm-gift-menu-empty{padding:8px 10px;font-size:12px;color:var(--text-muted,#888)}
.dm-float-msg-wrap.dm-gift-notice{display:flex;justify-content:center;margin:6px 0}
.dm-gift-notice-text{max-width:90%;text-align:center;font-size:12px;font-weight:600;line-height:1.4;padding:5px 12px;border-radius:12px;color:#db2777;background:linear-gradient(135deg,rgba(244,114,182,.16),rgba(250,204,21,.10));border:1px solid rgba(244,114,182,.28);overflow-wrap:anywhere}
[data-theme=nord] .dm-gift-notice-text{color:#f9a8d4}

/* Gift popup anchored inside the room it was sent from (not page-wide). */
.gift-popup-container.in-room{
  position: absolute;
  top: 56px;
  z-index: 10000;
}

/* Gift popup: no gift-box graphic — the gifted item itself (badge image,
   emoji, crown, color swatch) fills the box slot and pops in. */
.gift-popup-box-reveal{
  top: 50%;
  width: 72px;
  height: 72px;
  transform: translate(-50%, -50%) scale(.35);
}
.gift-popup.opened .gift-popup-box-reveal{ transform: translate(-50%, -50%) scale(1); }
.gift-popup-box-reveal .gift-popup-badge-img,
.gift-popup-box-reveal img.gift-popup-crown-icon{ width: 68px; height: 68px; }
.gift-popup-box-reveal .gift-popup-emoji,
.gift-popup-box-reveal .gift-popup-crown-icon{ font-size: 56px; }
.gift-popup-box-reveal .gift-popup-swatch{ width: 56px; height: 56px; }

/* Room modal maximize / full screen (app-room-modal.js _toggleRoomModalMaximize /
   _toggleRoomModalFullscreen). Maximized = fills the viewport over the main chat
   and sidebar; the inline left/top/width/height from drag/resize stay on the
   element so "Restore Down" lands back where it was. Full screen = browser
   full screen on <html> + this same maximized state, so body-level popups
   (profile, gifts, menus) keep working. :not(.room-float-minimized) lets the
   minimized pill still work and restore straight back to maximized. */
.room-float-modal.room-float-maximized:not(.room-float-minimized){
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  max-height: none !important;
  transform: none !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  transition: none !important;
}
.room-float-modal.room-float-maximized:not(.room-float-minimized) .room-float-header{ cursor: default; }
.room-float-modal.room-float-maximized .room-float-resize-handle{ display: none !important; }
.room-float-modal.room-float-minimized .room-float-btn-maximize,
.room-float-modal.room-float-minimized .room-float-btn-fullscreen,
.popout-mode .room-float-btn-maximize{ display: none !important; }
@media (max-width: 768px){
  .room-float-btn-maximize,
  .room-float-btn-fullscreen{ display: none !important; }
}

/* ── Settings ▸ Font Size → rooms + DMs ─────────────────────────────────────
   The [data-fontsize] ladder above only covers main-chat/sidebar/settings
   classes; room windows and DM windows hardcode their own px sizes, so the
   setting never reached them. Scale those by a multiplier instead of a
   per-size table. Normal is untouched (no --fs-mul rules fire). Shared
   verbatim with tauri-native (native.css) — keep both copies in sync. */
:root[data-fontsize=small]{ --fs-mul: .85; }
:root[data-fontsize=large]{ --fs-mul: 1.2; }
:root[data-fontsize=x-large]{ --fs-mul: 1.4; }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-messages .message-content{ font-size: calc(12px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-messages .message-author{ font-size: calc(12px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-messages .message-time,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-messages .message-compact .compact-time{ font-size: calc(10px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-messages .message-avatar{ font-size: calc(11px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-messages .system-message{ font-size: calc(12px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-textarea,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-inline-edit{ font-size: calc(13.5px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-roomname{ font-size: calc(14px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-subtitle,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-date-sep,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-reply-label,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-sender-name,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-voice-hdr,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-sidebar .user-item-name{ font-size: calc(11px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-topic-text{ font-size: calc(11px * var(--fs-mul)); max-height: calc(32px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-meta-item{ font-size: calc(10px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-chip{ font-size: calc(10.5px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-typing{ font-size: calc(.72rem * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-reply-bar,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-reply-preview,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-whisper-bar,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-music-bar,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-vuser,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-empty span{ font-size: calc(12px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .room-float-empty p{ font-size: calc(14px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-username{ font-size: calc(14px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-subtitle,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-msg-name,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-system-message,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-system-note{ font-size: calc(11px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-msg-time,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-date-sep{ font-size: calc(10px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-grouped-time{ font-size: calc(9px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-msg-content,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-empty p{ font-size: calc(13px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-textarea,
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-edit-textarea{ font-size: calc(13.5px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-empty span{ font-size: calc(12px * var(--fs-mul)); }
:root:is([data-fontsize=small],[data-fontsize=large],[data-fontsize=x-large]) .dm-float-msg-wrap-buzz .dm-float-msg-content{ font-size: calc(19px * var(--fs-mul)); }

/* Room sidebar: raised-hand queue users stay pinned (sticky) at the top of the
   user list; only the non-queue users below scroll. Group is built in
   _doRenderRoomModalSidebarUsers (web) / doRenderRoomModalSidebarUsers (native). */
.room-queue-sticky{ position: sticky; top: 0; z-index: 3; flex: 0 0 auto; display: flex; flex-direction: column; gap: 4px; padding-bottom: 3px; background: var(--bg-card); border-bottom: 1px solid var(--border-light, rgba(255,255,255,.14)); box-shadow: 0 4px 6px -4px rgba(0,0,0,.35); }
.room-queue-sticky:empty{ display: none; }

/* DM video call (js/dm-call.js, shared web + native). The call runs in its
   own call window (.dm-call-win): a floating panel on web, the whole OS
   window in the native call pop-out (.dm-call-win-standalone). The DM only
   carries the header button + a slim .dm-call-dock. data-state on the call
   window is idle | incoming | outgoing | connecting | active | ended.
   The call window is always dark (it frames video); the dock follows the
   theme. Keep this block identical in public/css/style.css and
   tauri-native/src/css/native.css. */
.dm-float-btn-call.active{ color: #fff; background: #22c55e; }
.dm-float-btn-call.active:hover{ color: #fff; background: #16a34a; }
.dm-float-btn-call.locked{ position: relative; opacity: .5; cursor: not-allowed; }
.dm-float-btn-call.locked::after{ content: ""; position: absolute; right: 1px; bottom: 1px; width: 9px; height: 9px; border-radius: 50%; background: #f59e0b center / 7px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='3.2' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E"); }
.dm-float-btn-call.ringing{ animation: dmCallBtnRing 1.2s ease-in-out infinite; }
@keyframes dmCallBtnRing{ 0%,100%{ transform: rotate(0); } 10%,30%{ transform: rotate(-12deg); } 20%,40%{ transform: rotate(12deg); } 50%{ transform: rotate(0); } }

/* ── DM call dock ── */
.dm-call-dock{ flex: 0 0 auto; display: flex; align-items: center; gap: 8px; margin: 8px 8px 0; padding: 7px 7px 7px 10px; border-radius: 12px; cursor: pointer; color: var(--text-primary, #fff);
  background: linear-gradient(90deg, rgba(34,197,94,.16), rgba(34,197,94,.06)); border: 1px solid rgba(34,197,94,.35); animation: dmCallDockIn .22s ease; }
.dm-call-dock[hidden]{ display: none; }
.dm-float-minimized .dm-call-dock{ display: none; }
@keyframes dmCallDockIn{ from{ opacity: 0; transform: translateY(-4px); } }
.dm-call-dock-ico{ position: relative; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: #22c55e; }
.dm-call-dock-ico svg{ width: 16px; height: 16px; }
.dm-call-dock-ico::after{ content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid #22c55e; opacity: 0; animation: dmCallPing 1.8s ease-out infinite; }
.dm-call-dock-txt{ flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.dm-call-dock-txt b{ font-size: 12.5px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-call-dock-txt span{ font-size: 11.5px; color: var(--text-muted, #9aa0b4); font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-call-dock-btn{ flex: 0 0 auto; height: 30px; min-width: 30px; padding: 0 9px; display: none; align-items: center; justify-content: center; gap: 5px; border: 0; border-radius: 15px; color: #fff; font-family: inherit; font-size: 12px; font-weight: 600; line-height: 1; cursor: pointer; transition: filter .12s, transform .12s; }
.dm-call-dock-btn svg{ width: 15px; height: 15px; }
.dm-call-dock-btn:hover{ filter: brightness(1.1); transform: translateY(-1px); }
.dm-call-dock-accept, .dm-call-dock-show{ background: #22c55e; }
.dm-call-dock-decline, .dm-call-dock-end{ background: #ef4444; padding: 0; }
.dm-call-dock[data-state=incoming] .dm-call-dock-accept, .dm-call-dock[data-state=incoming] .dm-call-dock-decline{ display: inline-flex; }
.dm-call-dock:not([data-state=incoming]) .dm-call-dock-show, .dm-call-dock:not([data-state=incoming]) .dm-call-dock-end{ display: inline-flex; }
.dm-call-dock[data-state=incoming]{ border-color: rgba(34,197,94,.6); animation: dmCallDockIn .22s ease, dmCallDockGlow 1.6s ease-in-out infinite; }
@keyframes dmCallDockGlow{ 50%{ box-shadow: 0 0 0 3px rgba(34,197,94,.18); } }
.dm-call-dock-shaky{ background: linear-gradient(90deg, rgba(245,158,11,.18), rgba(245,158,11,.06)); border-color: rgba(245,158,11,.45); }
.dm-call-dock-shaky .dm-call-dock-ico{ background: #f59e0b; }
.dm-call-dock-shaky .dm-call-dock-ico::after{ border-color: #f59e0b; }
.dm-call-note{ opacity: 1; animation: dmSystemNoteIn .2s ease forwards; color: var(--text-muted, #aaa); background: rgba(127,127,127,.1); border-color: rgba(127,127,127,.25); }
@keyframes dmCallPing{ 0%{ transform: scale(.9); opacity: .7; } 100%{ transform: scale(1.5); opacity: 0; } }

/* ── call window ── */
.dm-call-win{ --dmc-bg: #0d0f16; --dmc-panel: rgba(22,25,36,.82); --dmc-line: rgba(255,255,255,.09); --dmc-text: #f3f4f8; --dmc-muted: #a3a9bd; --dmc-tint: #6d5dfc;
  position: fixed; z-index: 10000020; display: flex; flex-direction: column; box-sizing: border-box; margin: 0; padding: 0; overflow: hidden;
  color: var(--dmc-text); background: var(--dmc-bg); border: 1px solid var(--dmc-line); border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0,0,0,.55), 0 4px 16px rgba(0,0,0,.35); font-family: inherit; font-size: 13px; outline: none;
  animation: dmCallWinIn .24s cubic-bezier(.2,.8,.2,1); }
.dm-call-win *{ box-sizing: border-box; }
.dm-call-win.dm-call-pinned-z{ z-index: 2147483000 !important; }
.dm-call-win.dm-call-leaving{ animation: dmCallWinOut .2s ease forwards; pointer-events: none; }
.dm-call-win.dm-call-flash{ animation: dmCallFlash .5s ease; }
.dm-call-win.dm-call-dragging{ user-select: none; transition: none; }
@keyframes dmCallWinIn{ from{ opacity: 0; transform: translateY(10px) scale(.97); } }
@keyframes dmCallWinOut{ to{ opacity: 0; transform: translateY(8px) scale(.97); } }
@keyframes dmCallFlash{ 30%{ box-shadow: 0 0 0 3px var(--dmc-tint), 0 24px 64px rgba(0,0,0,.55); } }
.dm-call-win-standalone{ position: absolute; inset: 0; width: auto; height: auto; border-radius: inherit; border: 0; box-shadow: none; animation: none; }

.dm-call-head{ flex: 0 0 auto; display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 6px 0 12px; background: linear-gradient(180deg, rgba(255,255,255,.04), transparent); border-bottom: 1px solid var(--dmc-line); cursor: grab; user-select: none; -webkit-user-select: none; }
.dm-call-dragging .dm-call-head{ cursor: grabbing; }
.dm-call-win-standalone .dm-call-head{ cursor: default; }
.dm-call-head-av{ flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; background: var(--dmc-tint); }
.dm-call-head-txt{ flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.dm-call-name{ font-size: 13px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-call-sub{ display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--dmc-muted); }
.dm-call-timer{ font-variant-numeric: tabular-nums; white-space: nowrap; }
.dm-call-reconnecting .dm-call-timer{ color: #fbbf24; }
.dm-call-q{ display: none; align-items: flex-end; gap: 2px; height: 10px; }
.dm-call-q b{ width: 3px; border-radius: 1px; background: rgba(255,255,255,.22); }
.dm-call-q b:nth-child(1){ height: 4px; } .dm-call-q b:nth-child(2){ height: 7px; } .dm-call-q b:nth-child(3){ height: 10px; }
.dm-call-q:not([data-level="0"]){ display: inline-flex; }
.dm-call-q[data-level="3"] b{ background: #22c55e; }
.dm-call-q[data-level="2"] b:nth-child(-n+2){ background: #fbbf24; }
.dm-call-q[data-level="1"] b:nth-child(1){ background: #ef4444; }
.dm-call-head-ctl{ display: none; gap: 4px; }
.dm-call-wbtns{ display: flex; gap: 2px; }
.dm-call-wb{ width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--dmc-muted); cursor: pointer; transition: background .12s, color .12s; }
.dm-call-wb svg{ width: 16px; height: 16px; }
.dm-call-wb:hover{ background: rgba(255,255,255,.08); color: var(--dmc-text); }
.dm-call-x:hover{ background: #ef4444; color: #fff; }
.dm-call-pin[aria-pressed=true]{ color: var(--dmc-tint); background: rgba(255,255,255,.08); }

.dm-call-stage{ position: relative; flex: 1; min-height: 0; overflow: hidden; background: #000; }
.dm-call-remote{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; visibility: hidden; }
.dm-call-show-remote .dm-call-remote{ visibility: visible; }
.dm-call-placeholder{ position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 16px 16px 84px; text-align: center;
  background: radial-gradient(120% 90% at 50% 28%, var(--dmc-tint) 0%, transparent 62%), var(--dmc-bg); }
@supports (background: color-mix(in srgb, red 50%, blue)){
  .dm-call-placeholder{ background: radial-gradient(120% 90% at 50% 28%, color-mix(in srgb, var(--dmc-tint) 38%, transparent) 0%, transparent 65%), var(--dmc-bg); }
}
.dm-call-show-remote .dm-call-placeholder{ display: none; }
.dm-call-avatar{ position: relative; width: 96px; height: 96px; margin-bottom: 8px; border-radius: 50%; display: grid; place-items: center; font-size: 38px; font-weight: 700; color: #fff; background: var(--dmc-tint); box-shadow: 0 0 0 4px rgba(255,255,255,.06), 0 12px 32px rgba(0,0,0,.45); transition: box-shadow .15s; }
.dm-call-win[data-state=incoming] .dm-call-avatar, .dm-call-win[data-state=outgoing] .dm-call-avatar{ animation: dmCallPulse 1.6s ease-out infinite; }
@keyframes dmCallPulse{ 0%{ box-shadow: 0 0 0 0 rgba(255,255,255,.35), 0 12px 32px rgba(0,0,0,.45); } 100%{ box-shadow: 0 0 0 26px rgba(255,255,255,0), 0 12px 32px rgba(0,0,0,.45); } }
.dm-call-ph-name{ max-width: 100%; font-size: 18px; font-weight: 700; letter-spacing: .1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-call-status{ font-size: 13px; color: var(--dmc-muted); }
.dm-call-status:empty{ display: none; }
.dm-call-reconnecting .dm-call-status{ color: #fbbf24; }
.dm-call-win[data-state=ended] .dm-call-placeholder{ opacity: .85; }
.dm-call-avatar, .dm-call-head-av, .dm-call-local-avatar{ overflow: hidden; }
.dm-call-avatar.has-img, .dm-call-head-av.has-img, .dm-call-local-avatar.has-img{ background: none; }
.dm-call-avatar-img{ display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; pointer-events: none; }

/* partner name tag over their video */
.dm-call-remote-tag{ position: absolute; left: 12px; top: 12px; z-index: 2; display: none; align-items: center; gap: 6px; max-width: 60%; padding: 4px 10px; border-radius: 999px; background: rgba(0,0,0,.5); font-size: 12px; font-weight: 600; transition: opacity .25s, box-shadow .15s; }
.dm-call-show-remote .dm-call-remote-tag{ display: inline-flex; }
.dm-call-tag-name{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-call-remote-mic{ display: none; color: #f87171; }
.dm-call-remote-mic svg{ width: 13px; height: 13px; display: block; }
.dm-call-remote-muted .dm-call-remote-mic{ display: inline-flex; }

/* self view — drag to any corner */
.dm-call-local{ position: absolute; z-index: 3; width: 28%; min-width: 96px; max-width: 200px; aspect-ratio: 4 / 3; display: none; overflow: hidden; border-radius: 12px; cursor: grab; touch-action: none;
  background: radial-gradient(circle at 50% 45%, #262a3b, #13151d 75%); border: 1px solid rgba(255,255,255,.18); box-shadow: 0 6px 20px rgba(0,0,0,.5); transition: top .2s, left .2s, right .2s, bottom .2s, box-shadow .15s; }
.dm-call-show-local .dm-call-local{ display: block; }
.dm-call-local[data-corner=tl]{ top: 12px; left: 12px; } .dm-call-local[data-corner=tr]{ top: 12px; right: 12px; }
.dm-call-local[data-corner=bl]{ bottom: 84px; left: 12px; } .dm-call-local[data-corner=br]{ bottom: 84px; right: 12px; }
.dm-call-show-remote .dm-call-local[data-corner=tl]{ top: 52px; }
.dm-call-local.dm-call-local-drag{ cursor: grabbing; transition: none; box-shadow: 0 10px 30px rgba(0,0,0,.6); }
.dm-call-local video{ display: none; width: 100%; height: 100%; object-fit: cover; transform: scaleX(-1); pointer-events: none; }
.dm-call-self-cam .dm-call-local video{ display: block; }
.dm-call-local-avatar{ position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); border-radius: 50%; display: grid; place-items: center; font-size: 18px; font-weight: 700; color: #fff; background: var(--dmc-tint); pointer-events: none; }
.dm-call-self-cam .dm-call-local-avatar{ display: none; }
.dm-call-local-mic{ position: absolute; right: 6px; bottom: 6px; width: 22px; height: 22px; display: none; place-items: center; border-radius: 50%; background: #ef4444; color: #fff; pointer-events: none; }
.dm-call-local-mic svg{ width: 12px; height: 12px; }
.dm-call-self-muted .dm-call-local-mic{ display: grid; }
.dm-call-local-issue{ position: absolute; left: 6px; right: 6px; top: 6px; display: none; padding: 3px 6px; border-radius: 6px; background: rgba(245,158,11,.92); color: #1a1205; font-size: 10.5px; font-weight: 600; line-height: 1.25; text-align: center; pointer-events: none; }
.dm-call-cam-issue .dm-call-local-issue{ display: block; }
.dm-call-cam-issue .dm-call-cam.off::after{ content: ""; position: absolute; top: 2px; right: 2px; width: 10px; height: 10px; border-radius: 50%; background: #f59e0b; border: 2px solid #11131a; }
.dm-call-win:not(.dm-call-admin) :is(.dm-call-testdev, .dm-call-testdev-note){ display: none; }
.dm-call-testdev{ padding-top: 10px; border-top: 1px solid var(--dmc-line); }
.dm-call-testdev-note{ margin-top: -4px; color: var(--dmc-muted); font-size: 11px; line-height: 1.35; }
.dm-call-local-sim{ position: absolute; left: 6px; bottom: 6px; display: none; padding: 2px 6px; border-radius: 6px; background: rgba(109,93,252,.92); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .3px; pointer-events: none; }
.dm-call-sim .dm-call-local-sim{ display: block; }
.dm-call-self-speaking .dm-call-local{ box-shadow: 0 0 0 2px #22c55e, 0 6px 20px rgba(0,0,0,.5); }

/* control bar — floating glass pill */
.dm-call-controls{ position: absolute; left: 50%; bottom: 14px; z-index: 4; display: flex; align-items: center; gap: 10px; padding: 8px; transform: translateX(-50%); border-radius: 999px;
  background: var(--dmc-panel); border: 1px solid var(--dmc-line); box-shadow: 0 8px 24px rgba(0,0,0,.4); transition: opacity .25s, transform .25s; }
.dm-call-win[data-state=idle] .dm-call-controls, .dm-call-win[data-state=ended] .dm-call-controls{ display: none; }
.dm-call-idle .dm-call-controls{ opacity: 0; transform: translate(-50%, 10px); pointer-events: none; }
.dm-call-idle .dm-call-remote-tag{ opacity: 0; }
.dm-call-idle .dm-call-stage{ cursor: none; }
.dm-call-btn{ position: relative; width: 46px; height: 46px; display: none; align-items: center; justify-content: center; gap: 8px; padding: 0; border: 0; border-radius: 50%; color: #fff; background: rgba(255,255,255,.1); font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1; cursor: pointer; transition: background .15s, transform .12s, color .15s; }
.dm-call-btn svg{ width: 20px; height: 20px; }
.dm-call-btn:hover{ background: rgba(255,255,255,.2); }
.dm-call-btn:active{ transform: scale(.94); }
.dm-call-btn:focus-visible, .dm-call-wb:focus-visible, .dm-call-dock-btn:focus-visible{ outline: 2px solid var(--dmc-tint, #6d5dfc); outline-offset: 2px; }
.dm-call-btn.off{ background: #f3f4f8; color: #11131a; }
.dm-call-btn.off:hover{ background: #fff; }
.dm-call-btn.busy{ opacity: .6; }
.dm-call-btn.busy::after{ content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid transparent; border-top-color: currentColor; animation: dmCallSpin .9s linear infinite; }
@keyframes dmCallSpin{ to{ transform: rotate(360deg); } }
.dm-call-hangup, .dm-call-decline{ background: #ef4444; }
.dm-call-hangup:hover, .dm-call-decline:hover{ background: #dc2626; }
.dm-call-hangup{ width: 58px; border-radius: 23px; }
.dm-call-accept{ background: #22c55e; }
.dm-call-accept:hover{ background: #16a34a; }
.dm-call-btn-label{ display: none; }
.dm-call-win[data-state=incoming] .dm-call-controls{ gap: 28px; padding: 10px 14px; background: transparent; border-color: transparent; box-shadow: none; }
.dm-call-win[data-state=incoming] .dm-call-accept, .dm-call-win[data-state=incoming] .dm-call-decline{ display: inline-flex; width: 58px; height: 58px; }
.dm-call-win[data-state=incoming] .dm-call-accept svg, .dm-call-win[data-state=incoming] .dm-call-decline svg{ width: 24px; height: 24px; }
.dm-call-win[data-state=incoming] .dm-call-accept{ animation: dmCallAcceptBob 1.4s ease-in-out infinite; }
@keyframes dmCallAcceptBob{ 50%{ transform: translateY(-3px); box-shadow: 0 0 0 8px rgba(34,197,94,.18); } }
.dm-call-win:is([data-state=outgoing],[data-state=connecting],[data-state=active]) :is(.dm-call-mic,.dm-call-cam,.dm-call-set,.dm-call-hangup){ display: inline-flex; }
.dm-call-win[data-state=active] .dm-call-fs{ display: inline-flex; }
.dm-call-devices-open .dm-call-set{ background: rgba(255,255,255,.28); }

/* device picker sheet */
.dm-call-devices{ position: absolute; top: 12px; right: 12px; z-index: 5; width: min(280px, calc(100% - 24px)); max-height: calc(100% - 100px); display: none; flex-direction: column; gap: 10px; padding: 12px; overflow-y: auto;
  border-radius: 14px; background: rgba(18,20,29,.96); border: 1px solid var(--dmc-line); box-shadow: 0 12px 32px rgba(0,0,0,.5); font-size: 12px; animation: dmCallWinIn .18s ease; }
.dm-call-devices-open .dm-call-devices{ display: flex; }
.dm-call-devices-head{ display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 700; }
.dm-call-devices-x{ width: 26px; height: 26px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--dmc-muted); cursor: pointer; }
.dm-call-devices-x svg{ width: 14px; height: 14px; }
.dm-call-devices-x:hover{ background: rgba(255,255,255,.08); color: var(--dmc-text); }
.dm-call-devices label{ display: flex; flex-direction: column; gap: 5px; color: var(--dmc-muted); font-weight: 600; }
.dm-call-devices select{ width: 100%; min-width: 0; height: 32px; padding: 0 8px; border-radius: 8px; border: 1px solid rgba(255,255,255,.14); background: #1d2030; color: var(--dmc-text); font: inherit; font-weight: 500; outline: none; }
.dm-call-devices select:focus{ border-color: var(--dmc-tint); }
.dm-call-meter{ flex: 0 0 auto; height: 4px; margin-top: -4px; border-radius: 2px; background: rgba(255,255,255,.12); overflow: hidden; }
.dm-call-meter i{ display: block; height: 100%; width: 0; background: #22c55e; transition: width .12s linear; }
.dm-call-out-note{ display: none; color: var(--dmc-muted); }
.dm-call-no-sink .dm-call-out{ display: none; }
.dm-call-no-sink .dm-call-out-note{ display: block; }

/* web: resize grip + minimized pill + full screen + phones */
.dm-call-resize{ position: absolute; right: 0; bottom: 0; z-index: 6; width: 18px; height: 18px; cursor: nwse-resize; touch-action: none;
  background: linear-gradient(135deg, transparent 50%, rgba(255,255,255,.28) 50%, rgba(255,255,255,.28) 58%, transparent 58%, transparent 70%, rgba(255,255,255,.28) 70%, rgba(255,255,255,.28) 78%, transparent 78%); border-bottom-right-radius: 16px; }
.dm-call-win.dm-call-win-min{ width: 300px !important; height: auto !important; border-radius: 14px; }
.dm-call-win-min .dm-call-stage, .dm-call-win-min .dm-call-resize{ display: none; }
.dm-call-win-min .dm-call-head{ border-bottom: 0; cursor: pointer; }
.dm-call-win-min:is([data-state=outgoing],[data-state=connecting],[data-state=active]) .dm-call-head-ctl{ display: flex; }
.dm-call-win-min .dm-call-pin{ display: none; }
.dm-call-mini-end{ color: #fff; background: #ef4444; }
.dm-call-mini-end:hover{ background: #dc2626; }
.dm-call-mini-mic.off{ color: #11131a; background: #f3f4f8; }
.dm-call-win:fullscreen{ width: 100% !important; height: 100% !important; border-radius: 0; border: 0; }
.dm-call-win:fullscreen .dm-call-resize{ display: none; }
.dm-call-win:fullscreen .dm-call-local{ max-width: 280px; }
@media (max-width: 768px){
  .dm-call-win:not(.dm-call-win-standalone){ left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; border-radius: 0; border: 0; }
  .dm-call-win.dm-call-win-min:not(.dm-call-win-standalone){ left: 8px !important; top: 8px !important; width: calc(100% - 16px) !important; height: auto !important; border-radius: 14px; border: 1px solid var(--dmc-line); }
  .dm-call-win:not(.dm-call-win-standalone) :is(.dm-call-resize, .dm-call-pin){ display: none; }
  .dm-call-win:not(.dm-call-win-standalone) .dm-call-btn{ width: 50px; height: 50px; }
}
/* "Am I hearing them?" (dm-call.js _hearFrame) — while the partner's audio is
   arriving AND playing, their avatar dances to their voice: it bounces and
   head-bobs with --dmc-lvl / --dmc-tilt, sound waves ripple out, and an
   equalizer badge pops in (big avatar, header avatar, and the name tag over
   their video). Arriving but blocked (autoplay) → amber ring + "Click to hear". */
.dm-call-avatar-wrap{ position: relative; width: 96px; height: 96px; margin-bottom: 8px; }
.dm-call-avatar-wrap .dm-call-avatar{ margin: 0; transform: scale(calc(1 + var(--dmc-lvl, 0) * .16)) rotate(calc(var(--dmc-tilt, 0) * 1deg)); transition: transform .09s linear, box-shadow .15s; }
.dm-call-hearing .dm-call-avatar{ box-shadow: 0 0 0 calc(3px + var(--dmc-lvl, 0) * 5px) #22c55e, 0 12px 32px rgba(0,0,0,.45); }
.dm-call-waves{ position: absolute; inset: 0; pointer-events: none; opacity: calc(.25 + var(--dmc-lvl, 0) * 1.4); }
.dm-call-waves i{ position: absolute; inset: 0; border-radius: 50%; border: 3px solid #22c55e; opacity: 0; }
.dm-call-hearing .dm-call-waves i{ animation: dmCallWave 1.5s cubic-bezier(.2,.6,.3,1) infinite; }
.dm-call-hearing .dm-call-waves i:nth-child(2){ animation-delay: .5s; border-color: #4ade80; }
.dm-call-hearing .dm-call-waves i:nth-child(3){ animation-delay: 1s; border-color: #86efac; }
@keyframes dmCallWave{ 0%{ transform: scale(1); opacity: .8; } 100%{ transform: scale(2); opacity: 0; } }
.dm-call-eq{ display: inline-flex; align-items: flex-end; justify-content: center; gap: 2px; }
.dm-call-eq i{ width: 3px; height: 100%; border-radius: 2px; background: currentColor; transform-origin: 50% 100%; transform: scaleY(.25); }
.dm-call-hearing .dm-call-eq i{ animation: dmCallEq .42s ease-in-out infinite alternate; }
.dm-call-hearing .dm-call-eq i:nth-child(2){ animation-duration: .31s; animation-delay: -.1s; }
.dm-call-hearing .dm-call-eq i:nth-child(3){ animation-duration: .5s; animation-delay: -.2s; }
.dm-call-hearing .dm-call-eq i:nth-child(4){ animation-duration: .36s; animation-delay: -.05s; }
@keyframes dmCallEq{ 0%{ transform: scaleY(.25); } 100%{ transform: scaleY(1); } }
.dm-call-eq-badge{ position: absolute; right: -4px; bottom: 0; width: 30px; height: 30px; padding: 8px 0; border-radius: 50%; color: #fff; background: #22c55e; border: 3px solid var(--dmc-bg); transform: scale(0); transition: transform .25s cubic-bezier(.34,1.56,.64,1); pointer-events: none; }
.dm-call-hearing .dm-call-eq-badge{ transform: scale(1); }
.dm-call-peer-muted{ position: absolute; left: -4px; bottom: 0; width: 30px; height: 30px; display: none; place-items: center; border-radius: 50%; background: #ef4444; color: #fff; border: 3px solid var(--dmc-bg); pointer-events: none; animation: dmCallWinIn .2s ease; }
.dm-call-peer-muted svg{ width: 14px; height: 14px; }
.dm-call-remote-muted .dm-call-peer-muted{ display: grid; }
.dm-call-head-av-wrap .dm-call-peer-muted{ left: auto; right: -5px; bottom: -4px; width: 15px; height: 15px; border-width: 2px; }
.dm-call-head-av-wrap .dm-call-peer-muted svg{ width: 8px; height: 8px; }
.dm-call-no-audio .dm-call-hear-chip{ display: inline-flex; }
.dm-call-no-audio .dm-call-head-av{ box-shadow: 0 0 0 2px #f59e0b; }
.dm-call-in{ display: flex; flex-direction: column; gap: 9px; color: var(--dmc-muted); font-weight: 600; }
.dm-call-in .dm-call-meter{ margin-top: 0; }
.dm-call-meter-in i{ background: linear-gradient(90deg, #22c55e, #4ade80); transition: width .08s linear; }
.dm-call-ver{ color: var(--dmc-muted); font-size: 10.5px; opacity: .75; text-align: right; }
.dm-call-head-av-wrap{ position: relative; flex: 0 0 auto; width: 28px; height: 28px; }
.dm-call-head-av-wrap .dm-call-head-av{ transform: scale(calc(1 + var(--dmc-lvl, 0) * .14)) rotate(calc(var(--dmc-tilt, 0) * 1deg)); transition: transform .09s linear, box-shadow .15s; }
.dm-call-hearing .dm-call-head-av{ box-shadow: 0 0 0 2px #22c55e; }
.dm-call-hear-blocked .dm-call-head-av{ box-shadow: 0 0 0 2px #f59e0b; }
.dm-call-head-av-wrap .dm-call-eq-badge{ right: -5px; bottom: -4px; width: 15px; height: 15px; padding: 3px 0; gap: 1px; border-width: 2px; }
.dm-call-head-av-wrap .dm-call-eq i{ width: 2px; }
.dm-call-eq-tag{ display: none; width: 14px; height: 12px; color: #4ade80; }
.dm-call-hearing .dm-call-eq-tag{ display: inline-flex; }
.dm-call-remote-tag{ transform: scale(calc(1 + var(--dmc-lvl, 0) * .06)); transform-origin: left center; transition: opacity .25s, box-shadow .15s, transform .09s linear; }
.dm-call-hearing .dm-call-remote-tag{ box-shadow: 0 0 0 2px #22c55e; }
.dm-call-hear-chip{ position: absolute; left: 50%; top: 12px; z-index: 5; display: none; align-items: center; gap: 6px; padding: 6px 12px; transform: translateX(-50%); border: 0; border-radius: 999px; background: #f59e0b; color: #1a1205; font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,.4); animation: dmCallChip 1.6s ease-in-out infinite; }
.dm-call-hear-chip svg{ width: 14px; height: 14px; }
.dm-call-hear-blocked .dm-call-hear-chip{ display: inline-flex; }
@keyframes dmCallChip{ 50%{ box-shadow: 0 0 0 5px rgba(245,158,11,.25), 0 6px 18px rgba(0,0,0,.4); } }
@media (prefers-reduced-motion: reduce){
  .dm-call-win, .dm-call-dock, .dm-call-dock-ico::after, .dm-call-avatar, .dm-call-accept, .dm-float-btn-call.ringing, .dm-call-hear-chip, .dm-call-waves i, .dm-call-eq i{ animation: none !important; }
  .dm-call-avatar-wrap .dm-call-avatar, .dm-call-head-av-wrap .dm-call-head-av, .dm-call-remote-tag{ transform: none; }
}

/* Camera effects (dm-call.js setEffect / _renderFx): ⚙ panel switches,
   quick buttons on your own tile, mirror flip, AI-loading shimmer, pop. */
.dm-call-fx{ display: flex; flex-direction: column; gap: 6px; padding-top: 10px; border-top: 1px solid var(--dmc-line); }
.dm-call-fx-title{ color: var(--dmc-muted); font-weight: 600; }
.dm-call-fx-row{ display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 1px solid transparent; border-radius: 12px; background: rgba(255,255,255,.04); color: var(--dmc-text); font-family: inherit; font-size: 12px; text-align: left; cursor: pointer; transition: background .15s, border-color .15s; }
.dm-call-fx-row:hover{ background: rgba(255,255,255,.08); }
.dm-call-fx-row.on{ border-color: rgba(109,93,252,.45); background: linear-gradient(90deg, rgba(109,93,252,.18), rgba(109,93,252,.06)); }
.dm-call-fx-ico{ flex: 0 0 auto; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: rgba(255,255,255,.08); color: var(--dmc-text); transition: background .2s, transform .3s cubic-bezier(.34,1.56,.64,1); }
.dm-call-fx-ico svg{ width: 18px; height: 18px; }
.dm-call-fx-row.on .dm-call-fx-ico{ background: linear-gradient(135deg, #6d5dfc, #a855f7); color: #fff; transform: rotate(-8deg) scale(1.06); }
.dm-call-fx-txt{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.dm-call-fx-txt b{ font-size: 12.5px; font-weight: 650; }
.dm-call-fx-txt small{ font-size: 11px; color: var(--dmc-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-call-sw{ position: relative; flex: 0 0 auto; width: 38px; height: 22px; border-radius: 999px; background: rgba(255,255,255,.18); transition: background .2s; }
.dm-call-sw i{ position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.4); transition: transform .3s cubic-bezier(.34,1.56,.64,1); }
.on > .dm-call-sw{ background: #6d5dfc; }
.on > .dm-call-sw i{ transform: translateX(16px); }

.dm-call-local video{ transition: transform .45s cubic-bezier(.34,1.3,.64,1); }
.dm-call-mirror-off .dm-call-local video{ transform: none; }
.dm-call-local-fx{ position: absolute; top: 6px; right: 6px; z-index: 2; display: flex; gap: 4px; opacity: 0; transform: translateY(-4px); transition: opacity .18s, transform .18s; }
.dm-call-local:hover .dm-call-local-fx, .dm-call-local:focus-within .dm-call-local-fx{ opacity: 1; transform: none; }
.dm-call-local-fx button{ width: 26px; height: 26px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; cursor: pointer; transition: background .15s, transform .12s; }
.dm-call-local-fx button:hover{ transform: scale(1.1); }
.dm-call-local-fx button.on{ background: linear-gradient(135deg, #6d5dfc, #a855f7); }
.dm-call-local-fx svg{ width: 14px; height: 14px; }
.dm-call-fx-loading .dm-call-local::before{ content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(168,85,247,.35) 50%, transparent 70%); background-size: 250% 100%; animation: dmCallShimmer 1.1s linear infinite; }
@keyframes dmCallShimmer{ from{ background-position: 120% 0; } to{ background-position: -120% 0; } }
.dm-call-fx-blur .dm-call-local{ box-shadow: 0 0 0 2px rgba(168,85,247,.85), 0 6px 20px rgba(0,0,0,.5); }
.dm-call-local.dm-call-fx-pop::after{ content: ""; position: absolute; inset: -30%; z-index: 3; pointer-events: none; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.95) 0 3%, transparent 4%) 20% 30% / 30% 30%, radial-gradient(circle, rgba(196,181,253,.95) 0 3%, transparent 4%) 75% 25% / 28% 28%, radial-gradient(circle, rgba(250,204,21,.95) 0 3%, transparent 4%) 60% 75% / 26% 26%, radial-gradient(circle, rgba(168,85,247,.9) 0 3%, transparent 4%) 25% 70% / 32% 32%;
  background-repeat: no-repeat; animation: dmCallSparkle .65s ease-out forwards; }
@keyframes dmCallSparkle{ 0%{ transform: scale(.4) rotate(0); opacity: 1; } 100%{ transform: scale(1.3) rotate(25deg); opacity: 0; } }

/* "Video calls" switch card (messenger / friends panel, web + native main
   window) — dm-call.js mountCallPref. Follows the app theme. */
.call-pref{ position: relative; display: flex; align-items: center; gap: 10px; margin: 6px 8px 8px; padding: 9px 10px 9px 9px; border-radius: 14px; cursor: pointer; user-select: none; overflow: hidden;
  color: var(--text-primary, #e8e9f1); background: linear-gradient(120deg, rgba(34,197,94,.16), rgba(34,197,94,.04)); border: 1px solid rgba(34,197,94,.35); transition: background .3s, border-color .3s; }
.call-pref[hidden]{ display: none; }
.call-pref[data-on="0"]{ background: linear-gradient(120deg, rgba(239,68,68,.14), rgba(239,68,68,.03)); border-color: rgba(239,68,68,.32); }
.call-pref:hover{ filter: brightness(1.06); }
.call-pref-ico{ position: relative; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #22c55e, #16a34a); box-shadow: 0 4px 12px rgba(34,197,94,.35); transition: background .3s, box-shadow .3s; }
.call-pref[data-on="0"] .call-pref-ico{ background: linear-gradient(135deg, #f87171, #dc2626); box-shadow: 0 4px 12px rgba(239,68,68,.3); }
.call-pref-ico > span{ position: absolute; inset: 0; display: grid; place-items: center; transition: transform .35s cubic-bezier(.34,1.56,.64,1), opacity .25s; }
.call-pref-ico svg{ width: 18px; height: 18px; }
.call-pref-ico-off{ opacity: 0; transform: scale(.4) rotate(-40deg); }
.call-pref[data-on="0"] .call-pref-ico-on{ opacity: 0; transform: scale(.4) rotate(40deg); }
.call-pref[data-on="0"] .call-pref-ico-off{ opacity: 1; transform: none; }
.call-pref[data-on="1"] .call-pref-ico::after{ content: ""; position: absolute; inset: -3px; border-radius: 13px; border: 2px solid #22c55e; opacity: 0; animation: dmCallPing 2.4s ease-out infinite; }
.call-pref-txt{ flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.call-pref-txt b{ font-size: 12.5px; font-weight: 650; }
.call-pref-txt small{ font-size: 11px; color: var(--text-muted, #9aa0b4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.call-pref-sw{ position: relative; flex: 0 0 auto; width: 44px; height: 26px; padding: 0; border: 0; border-radius: 999px; cursor: pointer; background: #22c55e; transition: background .3s; }
.call-pref[data-on="0"] .call-pref-sw{ background: rgba(127,127,127,.45); }
.call-pref-sw i{ position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,.35); transform: translateX(18px); transition: transform .35s cubic-bezier(.34,1.56,.64,1); }
.call-pref[data-on="0"] .call-pref-sw i{ transform: none; }
.call-pref-sw:focus-visible{ outline: 2px solid var(--accent, #6d5dfc); outline-offset: 2px; }
.call-pref.call-pref-bump{ animation: callPrefBump .45s cubic-bezier(.34,1.56,.64,1); }
.call-pref[data-on="0"].call-pref-bump .call-pref-ico{ animation: callPrefNope .45s ease; }
@keyframes callPrefBump{ 40%{ transform: scale(1.03); } }
@keyframes callPrefNope{ 20%{ transform: translateX(-3px) rotate(-8deg); } 40%{ transform: translateX(3px) rotate(8deg); } 60%{ transform: translateX(-2px); } 80%{ transform: translateX(2px); } }
@media (prefers-reduced-motion: reduce){
  .dm-call-local.dm-call-fx-pop::after, .dm-call-fx-loading .dm-call-local::before, .call-pref, .call-pref-ico, .call-pref[data-on="1"] .call-pref-ico::after{ animation: none !important; }
  .dm-call-local video{ transition: none; }
}

/* ── Karaoke popup: video scales with the popup (resize handle / expand button) ── */
.room-karaoke-popup{ container-type: size; }
.room-karaoke-player-iframe-wrap{ height: min(calc(100cqw * 9 / 16), 62cqh); min-height: 180px; }
.room-karaoke-expand{ margin-left: 2px; }
.room-karaoke-popup.expanded{ border-radius: 10px; }
.room-karaoke-popup.expanded .room-karaoke-resize-handle{ display: none; }
/* Karaoke popup: invisible edge/corner resize strips (SE keeps its visible grip) */
.room-karaoke-edge{ position: absolute; z-index: 3; }
.room-karaoke-resize-handle{ z-index: 4; }
.room-karaoke-edge-n{ top: 0; left: 12px; right: 12px; height: 6px; cursor: ns-resize; }
.room-karaoke-edge-s{ bottom: 0; left: 12px; right: 16px; height: 6px; cursor: ns-resize; }
.room-karaoke-edge-e{ right: 0; top: 12px; bottom: 16px; width: 6px; cursor: ew-resize; }
.room-karaoke-edge-w{ left: 0; top: 12px; bottom: 12px; width: 6px; cursor: ew-resize; }
.room-karaoke-edge-ne{ top: 0; right: 0; width: 12px; height: 12px; cursor: nesw-resize; }
.room-karaoke-edge-nw{ top: 0; left: 0; width: 12px; height: 12px; cursor: nwse-resize; }
.room-karaoke-edge-sw{ bottom: 0; left: 0; width: 12px; height: 12px; cursor: nesw-resize; }
.room-karaoke-popup.expanded .room-karaoke-edge{ display: none; }


/* ── Sidebar header 2.0 (brand row + "me" card + status picker) ─────────────
   CSS-only re-skin; markup/IDs are JS-owned (app-admin.js _setupStatusPicker,
   app-ui.js brand wave spans), so everything here hangs off existing classes.
   Uses color-mix() + :has() + @property + @starting-style; older engines just
   ignore those declarations and keep the previous look. */
.sidebar-header{
  --sh-a: var(--accent, #7c5cfc);
  --sh-b: #ff5fa2;
  --sh-c: #ffb547;
  --sh-card: color-mix(in srgb, var(--bg-tertiary) 70%, transparent);
  --sh-line: color-mix(in srgb, var(--text-primary) 9%, transparent);
  position: relative;
  padding: 14px 14px 12px;
  border-bottom: 0;
  isolation: isolate;
  background:
    radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--sh-a) 22%, transparent), transparent 60%),
    radial-gradient(80% 70% at 100% 10%, color-mix(in srgb, var(--sh-b) 12%, transparent), transparent 65%);
}
.sidebar-header::before{ /* gradient hairline under the header */
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--sh-a) 55%, transparent), color-mix(in srgb, var(--sh-b) 45%, transparent), transparent);
  pointer-events: none;
}

/* brand row */
.sidebar-header .brand{ gap: 10px; margin-bottom: 12px; overflow: visible; }
.sidebar-header .brand::after{ content: none; }
.sidebar-header .sidebar-brand-logo{
  width: 38px; height: 38px; padding: 5px; border-radius: 12px; animation: none;
  background: linear-gradient(145deg, color-mix(in srgb, var(--sh-a) 30%, transparent), color-mix(in srgb, var(--sh-b) 18%, transparent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 14%, transparent), 0 6px 18px -6px color-mix(in srgb, var(--sh-a) 70%, transparent);
  transition: transform .45s cubic-bezier(.34,1.56,.64,1), box-shadow .3s;
}
.sidebar-header .brand:hover .sidebar-brand-logo{ transform: rotate(-8deg) scale(1.08); box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 22%, transparent), 0 10px 24px -6px color-mix(in srgb, var(--sh-b) 70%, transparent); }
.sidebar-header .sidebar-logo-img{ filter: drop-shadow(0 1px 2px rgba(0,0,0,.35)); }
.sidebar-header .brand-text{ font-size: 19px !important; letter-spacing: 2.5px !important; font-weight: 800 !important; line-height: 1; white-space: nowrap; }
.sidebar-header .brand-text span{
  font-size: 19px !important; font-weight: 800 !important; letter-spacing: 2.5px !important;
  /* static vertical gradient: each letter is its own box, so this reads as one
     continuous fill; no background-position animation (that repaints every frame).
     The inline brandPremiumWave (transform-only) still runs. */
  background: linear-gradient(180deg, color-mix(in srgb, var(--sh-a) 70%, #fff) 10%, var(--sh-a) 45%, var(--sh-b) 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
}

/* notification bell */
.sidebar-header .brand-notif-bell #notification-btn{
  width: 34px; height: 34px; min-width: 34px; min-height: 34px; padding: 0; border-radius: 11px;
  color: var(--text-secondary); background: var(--sh-card); box-shadow: inset 0 0 0 1px var(--sh-line);
  transition: transform .25s cubic-bezier(.34,1.56,.64,1), color .2s, background .2s, box-shadow .2s;
}
.sidebar-header .brand-notif-bell #notification-btn svg{ width: 17px; height: 17px; transform-origin: 50% 10%; }
.sidebar-header .brand-notif-bell #notification-btn:hover{
  color: var(--text-primary); transform: translateY(-1px);
  background: color-mix(in srgb, var(--sh-a) 20%, var(--sh-card));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sh-a) 45%, transparent), 0 6px 16px -8px var(--sh-a);
}
.sidebar-header .brand-notif-bell #notification-btn:active{ transform: scale(.92); }
.sidebar-header .brand-notif-bell:has(.sidebar-notif-badge:not([style*="none"]):not(:empty)) #notification-btn svg{ animation: shBellRing 4s ease-in-out 1s infinite; }
@keyframes shBellRing{ 0%,82%,100%{ transform: rotate(0); } 85%{ transform: rotate(14deg); } 88%{ transform: rotate(-12deg); } 91%{ transform: rotate(8deg); } 94%{ transform: rotate(-5deg); } }
.sidebar-header .sidebar-notif-badge{
  top: -5px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  font-size: 10px; font-weight: 800; letter-spacing: 0; font-variant-numeric: tabular-nums;
  background: linear-gradient(135deg, #ff4d6d, var(--sh-b));
  box-shadow: 0 0 0 2.5px var(--bg-secondary), 0 4px 10px -2px rgba(255,77,109,.6);
  animation: shBadgePop .5s cubic-bezier(.34,1.56,.64,1);
}
@keyframes shBadgePop{ from{ transform: scale(0); } }

/* "me" card — gradient border via padding-box/border-box layering */
.sidebar-header .user-bar{
  gap: 11px; padding: 10px 10px 10px 11px; margin-top: 0; border-radius: 16px;
  border: 1px solid transparent;
  background:
    linear-gradient(var(--sh-card), var(--sh-card)) padding-box,
    linear-gradient(var(--bg-secondary), var(--bg-secondary)) padding-box,
    linear-gradient(135deg, color-mix(in srgb, var(--sh-a) 55%, transparent), var(--sh-line) 45%, color-mix(in srgb, var(--sh-b) 40%, transparent)) border-box;
  box-shadow: 0 8px 22px -14px rgba(0,0,0,.6);
  transition: box-shadow .25s ease;
}
.sidebar-header .user-bar:hover{
  background:
    linear-gradient(color-mix(in srgb, var(--sh-a) 8%, var(--sh-card)), color-mix(in srgb, var(--sh-a) 8%, var(--sh-card))) padding-box,
    linear-gradient(var(--bg-secondary), var(--bg-secondary)) padding-box,
    linear-gradient(135deg, var(--sh-a), var(--sh-line) 45%, var(--sh-b)) border-box;
  box-shadow: 0 12px 28px -14px color-mix(in srgb, var(--sh-a) 60%, #000);
}

/* avatar with a conic ring that spins while the card is hovered */
@property --sh-spin{ syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes shSpin{ to{ --sh-spin: 360deg; } }
.sidebar-header .user-bar-avatar-wrap{ width: 42px; height: 42px; border-radius: 50%; padding: 2px; box-sizing: border-box; }
.sidebar-header .user-bar-avatar-wrap::before{
  content: ""; position: absolute; inset: 0; border-radius: 50%; z-index: 0;
  background: conic-gradient(from var(--sh-spin), var(--sh-a), var(--sh-b), var(--sh-c), var(--sh-a));
  animation: shSpin 6s linear infinite paused;
}
.sidebar-header .user-bar:hover .user-bar-avatar-wrap::before{ animation-play-state: running; }
.sidebar-header .user-bar-avatar,
.sidebar-header .user-bar-avatar-img{
  position: relative; z-index: 1; width: 38px; height: 38px; font-size: 15px; font-weight: 800;
  box-shadow: 0 0 0 2px var(--bg-secondary); text-shadow: 0 1px 2px rgba(0,0,0,.3);
}
.sidebar-header .user-bar-avatar-img{ position: absolute; top: 2px; left: 2px; }

/* status dot */
.sidebar-header .user-bar-avatar-wrap .status-picker-dot{
  bottom: -1px; right: -1px; width: 14px !important; height: 14px !important; z-index: 2;
  outline: 3px solid var(--bg-secondary); transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}
.sidebar-header .user-bar-avatar-wrap .status-picker-dot:hover{ transform: scale(1.3); }
/* online "ping": a pseudo ring scaled/faded on the compositor, not an animated box-shadow */
.sidebar-header .user-bar-avatar-wrap .status-picker-dot:not(.away):not(.dnd):not(.invisible)::after{
  content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--success);
  pointer-events: none; animation: shOnlinePing 2.6s ease-out infinite;
}
@keyframes shOnlinePing{ 0%{ transform: scale(1); opacity: .6; } 70%,100%{ transform: scale(2.2); opacity: 0; } }

/* names */
.sidebar-header .user-names{ gap: 2px; }
/* one line; window.__fitCurrentUserName (app.html) shrinks the inline font-size until a long name fits,
   ellipsis only past the 9px floor */
.sidebar-header .current-user{ font-size: 14px; font-weight: 700; letter-spacing: .2px; white-space: nowrap; }
.sidebar-header .login-name{ font-size: 10.5px; font-weight: 500; opacity: .85; color: var(--text-secondary); }
.sidebar-header .user-bar-custom-status{
  align-self: flex-start; max-width: 100%; box-sizing: border-box; margin-top: 2px; padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; opacity: 1; color: var(--text-primary);
  background: color-mix(in srgb, var(--sh-a) 22%, transparent);
}
.sidebar-header .user-bar-custom-status::before{ content: "💬 "; font-size: 9px; }

/* action buttons */
.sidebar-header .user-bar-actions{ gap: 3px; opacity: .75; }
.sidebar-header .user-bar:hover .user-bar-actions{ opacity: 1; }
.sidebar-header .user-bar-actions > button{
  width: 28px; height: 28px; min-width: 28px; min-height: 28px; padding: 0; border-radius: 9px;
  opacity: 1; color: var(--text-secondary); background: transparent;
  transition: transform .25s cubic-bezier(.34,1.56,.64,1), color .15s, background .15s;
}
.sidebar-header .user-bar-actions > button:hover{ color: var(--text-primary); background: color-mix(in srgb, var(--sh-a) 22%, transparent); transform: translateY(-2px); }
.sidebar-header .user-bar-actions > button:active{ transform: scale(.88); }
.sidebar-header .user-bar-actions > button:focus-visible,
.sidebar-header #notification-btn:focus-visible{ outline: 2px solid var(--sh-a); outline-offset: 2px; }
.sidebar-header #rename-btn:hover svg{ animation: shWiggle .5s ease; }
.sidebar-header #logout-btn:hover{ color: #fff; background: linear-gradient(135deg, var(--danger), #ff7a59); }
.sidebar-header #logout-btn svg{ transition: transform .2s; }
.sidebar-header #logout-btn:hover svg{ transform: translateX(2px); }
.sidebar--floating .sidebar-header #sidebar-float-btn{ color: var(--sh-a); background: color-mix(in srgb, var(--sh-a) 16%, transparent); }
@keyframes shWiggle{ 25%{ transform: rotate(-14deg); } 75%{ transform: rotate(10deg); } }

/* status picker popover (positioned by JS, toggled via inline display) */
#status-picker.status-picker{
  width: 236px; padding: 6px; border-radius: 14px; overflow: hidden;
  background: var(--bg-tertiary);
  border: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent);
  box-shadow: 0 18px 40px -12px rgba(0,0,0,.55), 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
  transform-origin: top left;
  transition: opacity .18s ease, transform .22s cubic-bezier(.34,1.56,.64,1), display .22s allow-discrete;
}
@starting-style{ #status-picker.status-picker{ opacity: 0; transform: scale(.92) translateY(-4px); } }
#status-picker .status-option{
  padding: 8px 10px; gap: 10px; border-radius: 9px; font-size: 13px; font-weight: 500;
  transition: background .15s, transform .15s;
}
#status-picker .status-option:hover{ background: color-mix(in srgb, var(--accent) 16%, transparent); transform: translateX(2px); }
#status-picker .status-option .user-dot{ width: 11px; height: 11px; }
#status-picker .status-option[data-status="online"] .user-dot{ box-shadow: 0 0 0 3px color-mix(in srgb, var(--success) 22%, transparent); }
#status-picker .status-text-row{ margin: 6px -6px -6px; padding: 8px; border-top: 1px solid var(--border); background: color-mix(in srgb, #000 10%, transparent); }
#status-picker .status-text-row input{ box-sizing: border-box; padding: 7px 10px; border-radius: 9px; font-size: 12.5px; transition: border-color .15s, box-shadow .15s; }
#status-picker .status-text-row input:focus{ box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }

/* daylight: warmer accents, no white highlights */
[data-theme=daylight] .sidebar-header{ --sh-b: #c2410c; --sh-c: #b45309; --sh-card: color-mix(in srgb, #fff 45%, transparent); background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--sh-a) 14%, transparent), transparent 60%); border-bottom: 0; }
[data-theme=daylight] .sidebar-header .user-bar{ box-shadow: 0 6px 16px -12px rgba(60,40,10,.45); }
[data-theme=daylight] #status-picker .status-text-row{ background: color-mix(in srgb, #fff 30%, transparent); }

@media (max-width: 768px){
  .sidebar-header{ padding: 12px 12px 10px; }
  .sidebar-header .brand{ padding-right: 40px; } /* clear the mobile × */
  .sidebar-header .brand-text,
  .sidebar-header .brand-text span{ font-size: 16px !important; letter-spacing: 1.5px !important; }
  .sidebar-header .user-bar-actions > button{ width: 34px; height: 34px; min-width: 34px; min-height: 34px; }
}
@media (prefers-reduced-motion: reduce){
  .sidebar-header .brand-text span,
  .sidebar-header .user-bar-avatar-wrap::before,
  .sidebar-header .status-picker-dot,
  .sidebar-header #notification-btn svg,
  .sidebar-header .sidebar-notif-badge{ animation: none !important; }
}

/* ── App body 2.0: calmer surfaces + lighter rendering (8 GB machines) ──────
   Design: one surface scale, hairline borders, small elevation, 16px radius,
   flat message rows. Perf: the old panels used 60–80px-blur shadows that get
   re-rastered whenever a panel repaints (every new message / hover), each
   message carried its own shadow, and hover effects animated box-shadow +
   transform. Those are swapped for cheap equivalents. Decorative infinite
   loops pause while the window is hidden/unfocused (html.tc-idle, toggled by
   the inline script in app.html). Dark (nord/:root) only for surfaces —
   daylight keeps its own flat rules; perf bits apply to both. */
:root{
  --ab-radius: 16px;
  --ab-line: color-mix(in srgb, var(--text-primary) 7%, transparent);
  --ab-line-strong: color-mix(in srgb, var(--text-primary) 12%, transparent);
  --ab-elev: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset, 0 10px 24px -14px rgba(0,0,0,.55);
  --ab-tint: color-mix(in srgb, var(--accent) 12%, transparent);
  --ab-tint-strong: color-mix(in srgb, var(--accent) 20%, transparent);
}

/* ---------- surfaces (desktop, dark) ---------- */
@media (min-width: 769px){
  html:not([data-theme=daylight]) body{
    background:
      radial-gradient(1200px 700px at 12% -10%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%),
      radial-gradient(900px 600px at 110% 110%, color-mix(in srgb, #ff5fa2 6%, transparent), transparent 60%),
      var(--bg-primary);
  }
  html:not([data-theme=daylight]) #app-body .main{ background: transparent; border-color: transparent; }
  html:not([data-theme=daylight]) #app-body .sidebar{
    border: 1px solid var(--ab-line); border-left: 0;
    border-radius: 0 var(--ab-radius) var(--ab-radius) 0;
    box-shadow: var(--ab-elev);
  }
  html:not([data-theme=daylight]) #app-body .right-sidebar{
    border: 1px solid var(--ab-line); border-right: 0;
    border-radius: var(--ab-radius) 0 0 var(--ab-radius);
    box-shadow: var(--ab-elev);
  }
  html:not([data-theme=daylight]) #app-body .channel-header{
    border: 1px solid var(--ab-line); border-bottom-color: transparent;
    border-radius: var(--ab-radius) var(--ab-radius) 0 0;
    box-shadow: none;
  }
  html:not([data-theme=daylight]) #app-body .message-area{
    border: 1px solid var(--ab-line);
    border-radius: var(--ab-radius);
    box-shadow: var(--ab-elev);
  }
  html:not([data-theme=daylight]) #app-body .server-bar{ background: transparent; border-right-color: transparent; }
}

/* ---------- sidebar internals ---------- */
html:not([data-theme=daylight]) .sidebar .sidebar-section{
  background: color-mix(in srgb, var(--bg-tertiary) 35%, transparent);
  border: 1px solid var(--ab-line);
  border-radius: 14px;
}
.sidebar .section-label{ color: var(--text-secondary); letter-spacing: 1px; }

.room-list-item{ border-radius: 12px; transition: background-color .15s, border-color .15s; }
.room-list-item:not(.room-sub-active):hover{ background: var(--ab-tint); border-color: var(--ab-line); }
.room-list-item.active:not(.room-sub-active){
  background: var(--ab-tint-strong);
  border-color: color-mix(in srgb, var(--accent) 35%, transparent);
  box-shadow: inset 3px 0 0 var(--accent);
}

/* user rows: bg-only hover (was transform + 16px shadow on every row) */
.user-item{ transition: background-color .15s; }
.user-item:hover{ background: var(--ab-tint); transform: none; box-shadow: none; }

/* bottom bar buttons: flat pills, no shadow, no lift */
.sidebar-bottom-btn{ border-radius: 12px; border-color: var(--ab-line); box-shadow: none; transition: background-color .15s, color .15s, border-color .15s; }
.sidebar-bottom-btn:hover{
  background: var(--ab-tint-strong); color: var(--text-primary);
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  transform: none; box-shadow: none;
}
html:not([data-theme=daylight]) .sidebar-bottom{ background: transparent; border-top-color: var(--ab-line); }

/* server rail: squircles */
.server-icon{ border-radius: 14px; transition: border-radius .2s, background-color .2s; }
.server-icon:hover, .server-icon.active{ border-radius: 12px; }

/* ---------- messages ---------- */
/* flat rows: dropping 100 per-message shadows is the single biggest paint win */
html:not([data-theme=daylight]) .messages .message{ box-shadow: none; }
.messages .message, .messages .message-compact{ border-radius: 10px; transition: background-color .12s; }
html:not([data-theme=daylight]) .messages .message:hover,
html:not([data-theme=daylight]) .messages .message-compact:hover{ background: color-mix(in srgb, var(--text-primary) 4%, transparent); }
/* entrance: fade + rise only (scale forced text re-raster and the overshoot easing ran long) */
@keyframes msg-in{ from{ opacity: 0; transform: translateY(4px); } to{ opacity: 1; transform: none; } }
.message{ animation-timing-function: ease-out; }

/* ---------- scrollbars ---------- */
/* named scroll containers only — a universal scrollbar-width would override
   the scrollbar-width:none that toolbars/strips use to hide theirs */
.messages, .dm-list-scroll, #channel-list, .room-list-content, .right-sidebar .user-list, #friends-list-section{
  scrollbar-width: thin; scrollbar-color: var(--ab-line-strong) transparent;
}

/* ---------- focus (keyboard only) ---------- */
#app-body :is(button, [role=button], a):focus-visible{
  outline: 2px solid var(--accent); outline-offset: 2px;
}

/* ---------- cheaper decorative effects ---------- */
/* fire name effect: the 14px-blur glow layer stays, but static — animating it
   re-blurred the text every frame for every fire name on screen */
.un-fx.fire-effect::before{ animation: none; }
/* leaderboard button pulse animated box-shadow forever */
.sidebar-bottom-btn--leaderboard::after{ animation-duration: 6s; }

/* ---------- idle: pause decorative loops while hidden/unfocused ---------- */
html.tc-idle :is(
  .un-fx, .un-fx::before, .un-fx::after,
  .rank-badge--pulse, .lt-badge-inline--pulse, .lt-mini--pulse, .lt-badge::before,
  .sidebar-bottom-btn--leaderboard::after,
  .room-list-item::before, .room-list-item::after,
  .led.pulse, .support-banner-content, .update-pulse, .welcome-logo,
  .sidebar-header .brand-text span, .sidebar-header .user-bar-avatar-wrap::before,
  .sidebar-header .status-picker-dot::after, .sidebar-header #notification-btn svg,
  .room-float-music-viz span, .rfm-panel-viz span, .room-menu-kape-btn::before,
  .room-karaoke-queue-playing-icon span,
  .profile-popup, .profile-popup::before, .pp-spark-layer, .pp-level-chip,
  .profile-popup-displayname, .profile-popup-avatar-wrapper::before,
  .lb-title, .lb-title-icon, .donors-heart-icon, .mic-gift-fx-sparkle
){ animation-play-state: paused !important; }

@media (prefers-reduced-motion: reduce){
  .sidebar-header .status-picker-dot::after{ animation: none !important; }
  .message{ animation: none; }
}

/* ---------- user bar: custom status gets the full bar width ---------- */
/* .user-names is flattened into the bar's grid so the status line can run
   underneath the action buttons instead of being clipped to the name column. */
.sidebar-header .user-bar{ display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 10px; row-gap: 0; align-items: center; }
.sidebar-header .user-names{ display: contents; }
.sidebar-header .user-bar-avatar-wrap{ grid-column: 1; grid-row: 1 / span 3; align-self: center; }
.sidebar-header .current-user{ grid-column: 2; grid-row: 1; min-width: 0; }
.sidebar-header .login-name{ grid-column: 2; grid-row: 2; min-width: 0; margin-top: 2px; }
.sidebar-header .user-bar-actions{ grid-column: 3; grid-row: 1 / span 2; align-self: center; }
.sidebar-header .user-bar-custom-status{ grid-column: 2 / 4; grid-row: 3; min-width: 0; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Reports shortcut beside the notification bell ─────────────────
   #reports-btn sits inside .brand-notif-bell (left of the bell) so the
   unread badge stays anchored to the bell. Shown only for admins / devs /
   server mods / delegated grantees — see _syncReportsBtn in app-socket.js.
   #reports-count-badge = live count of OPEN reports ('reports-count'). */
.sidebar-header .reports-btn-wrap{ position: relative; display: flex; }
.sidebar-header .reports-count-badge{ background: #e74c3c; }
.sidebar-header .brand-notif-bell{ gap: 6px; align-items: center; }
.sidebar-header .brand-notif-bell #reports-btn{
  width: 34px; height: 34px; min-width: 34px; min-height: 34px; padding: 0; border-radius: 11px;
  color: var(--text-secondary); background: var(--sh-card); box-shadow: inset 0 0 0 1px var(--sh-line);
  transition: transform .25s cubic-bezier(.34,1.56,.64,1), color .2s, background .2s, box-shadow .2s;
}
.sidebar-header .brand-notif-bell #reports-btn svg{ width: 16px; height: 16px; }
.sidebar-header .brand-notif-bell #reports-btn:hover{
  color: #e74c3c; transform: translateY(-1px);
  background: color-mix(in srgb, #e74c3c 16%, var(--sh-card));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #e74c3c 45%, transparent), 0 6px 16px -8px #e74c3c;
}
.sidebar-header .brand-notif-bell #reports-btn:active{ transform: scale(.92); }
.sidebar-header #reports-btn:focus-visible{ outline: 2px solid var(--sh-a); outline-offset: 2px; }
/* With the extra Reports button the brand row runs out of room in a narrow
   sidebar (the bell got pushed past the edge): tighten the title + both
   buttons, and let the title clip rather than shove the buttons out. */
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])){ gap: 8px; }
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])) .brand-text{ min-width: 0; flex: 0 1 auto; overflow: hidden; }
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])) .brand-text,
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])) .brand-text span{ font-size: 16px !important; letter-spacing: 1.2px !important; }
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])) .brand-notif-bell{ gap: 4px; }
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])) .brand-notif-bell #reports-btn,
.sidebar-header .brand:has(#reports-btn-wrap:not([style*="none"])) .brand-notif-bell #notification-btn{ width: 30px; height: 30px; min-width: 30px; min-height: 30px; border-radius: 10px; }


/* ══ Room Music panel (web) — tauri-native Music window look ═════════════
   Port of native.css #music-popout-view onto the web app's floating
   .rfm-player-panel (markup: _openMusicPlayerPanel / _updateMusicPlayerPanel
   in app-room-modal.js; the panel carries .mp-skin). Keep the two in step
   when either changes. Palette = local --mp-* tokens: Room mode rides the
   theme accent, DJ mode swaps to a warm sunset gradient. .mp-wide (set by JS
   when the panel is >=520px) = two columns, else stacked. data-playing /
   data-idle on the panel drive the motion (spinning vinyl, breathing cover,
   equalizer). */
.rfm-player-panel.mp-skin {
  --mp-accent: var(--accent, #88c0d0);
  --mp-accent-2: #b48ead;
  --mp-fg: #eef1f6;
  --mp-bg: #151821;
  --mp-ink: #0c0e13;
  --mp-muted: color-mix(in oklab, var(--mp-fg) 62%, transparent);
  --mp-faint: color-mix(in oklab, var(--mp-fg) 38%, transparent);
  --mp-surface: color-mix(in oklab, var(--mp-fg) 6%, transparent);
  --mp-surface-2: color-mix(in oklab, var(--mp-fg) 11%, transparent);
  --mp-line: color-mix(in oklab, var(--mp-fg) 9%, transparent);
  --mp-grad: linear-gradient(135deg, var(--mp-accent), var(--mp-accent-2));
  --mp-glow: color-mix(in oklab, var(--mp-accent) 48%, transparent);
  --mp-danger: #ef6b73;
  --mp-ease: cubic-bezier(.22, 1, .36, 1);
  --mp-spring: cubic-bezier(.34, 1.56, .64, 1);
  --mp-cover: 92px;

  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: hidden;
  color: var(--mp-fg);
  font-family: var(--font-main, 'Inter', system-ui, sans-serif);
  background:
    radial-gradient(130% 60% at 50% -12%, color-mix(in oklab, var(--mp-accent) 28%, transparent), transparent 62%),
    radial-gradient(90% 55% at 105% 105%, color-mix(in oklab, var(--mp-accent-2) 20%, transparent), transparent 70%),
    var(--mp-bg);
  border: 1px solid var(--mp-line);
  border-radius: 16px;
  box-shadow: inset 0 1px 0 color-mix(in oklab, var(--mp-fg) 7%, transparent), 0 28px 70px -12px rgb(0 0 0 / .6);
  /* JS sizes it off innerWidth at open; never let a rotate/resize push it off-screen. */
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 16px);
}
.rfm-player-panel.mp-skin.rfm-player-panel--dj { --mp-accent: #ffb347; --mp-accent-2: #ff5f8f; }
/* Daylight's theme accent is a deep brown — too muddy for a party gradient,
   so the light palette brings its own: violet → pink (Room), amber → coral (DJ). */
[data-theme=daylight] .rfm-player-panel.mp-skin {
  --mp-accent: #7c5cff;
  --mp-accent-2: #ff5fa2;
  --mp-fg: #1c2130;
  --mp-bg: #fbfbfe;
  --mp-ink: #fff;
  --mp-surface: color-mix(in oklab, var(--mp-fg) 4.5%, transparent);
  --mp-surface-2: color-mix(in oklab, var(--mp-fg) 8%, transparent);
  --mp-line: color-mix(in oklab, var(--mp-fg) 8%, transparent);
  --mp-glow: color-mix(in oklab, var(--mp-accent) 36%, transparent);
  --mp-danger: #e5484d;
}
[data-theme=daylight] .rfm-player-panel.mp-skin.rfm-player-panel--dj { --mp-accent: #ff9f1c; --mp-accent-2: #ff4d6d; }

/* Blurred cover art bleeding into the top of the window. */
.rfm-player-panel.mp-skin .mp-ambient {
  position: absolute;
  inset: -15% -15% auto;
  height: 68%;
  z-index: -1;
  pointer-events: none;
  background: center / cover no-repeat;
  filter: blur(44px) saturate(1.6);
  opacity: 0;
  transition: opacity .8s var(--mp-ease);
  -webkit-mask-image: linear-gradient(#000 35%, transparent);
  mask-image: linear-gradient(#000 35%, transparent);
}
.rfm-player-panel.mp-skin .mp-ambient[style*="url"] { opacity: .5; }
[data-theme=daylight] .rfm-player-panel.mp-skin .mp-ambient[style*="url"] { opacity: .32; }

/* ── Header ── */
.rfm-player-panel.mp-skin .rfm-panel-header {
  height: 46px;
  padding: 0 8px 0 14px;
  border-bottom: 0;
  background: transparent;
  cursor: grab;
}
.rfm-player-panel.mp-skin .rfm-panel-header:active { cursor: grabbing; }
.rfm-player-panel.mp-skin .rfm-panel-header-left { gap: 9px; min-width: 0; }
.rfm-player-panel.mp-skin .mp-logo {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 8px;
  background: var(--mp-grad);
  color: var(--mp-ink);
  box-shadow: 0 4px 12px var(--mp-glow);
}
.rfm-player-panel.mp-skin .rfm-panel-header-title {
  font-size: 13.5px;
  font-weight: 800;
  letter-spacing: -.01em;
  text-transform: none;
  color: var(--mp-fg);
}
.rfm-player-panel.mp-skin .mp-room-name {
  max-width: 150px;
  padding: 2px 9px;
  border-radius: 999px;
  background: var(--mp-surface);
  color: var(--mp-muted);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rfm-player-panel.mp-skin .rfm-panel-header-actions { display: flex; align-items: center; gap: 2px; }
.rfm-player-panel.mp-skin .rfm-panel-close {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  color: var(--mp-faint);
  transition: background .18s, color .18s;
}
.rfm-player-panel.mp-skin .rfm-panel-close:hover { background: var(--mp-surface-2); color: var(--mp-fg); }
.rfm-player-panel.mp-skin .rfm-panel-close:hover {
  background: color-mix(in oklab, var(--mp-danger) 16%, transparent);
  color: var(--mp-danger);
}

/* ── DJ / Room segmented switch with a sliding gradient thumb ── */
.rfm-player-panel.mp-skin .rfm-panel-tabs {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 2px 14px 0;
  padding: 4px;
  border-radius: 14px;
  background: var(--mp-surface);
  box-shadow: inset 0 0 0 1px var(--mp-line);
}
.rfm-player-panel.mp-skin .rfm-panel-tabs::before {
  content: '';
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc(50% - 4px);
  border-radius: 10px;
  background: var(--mp-grad);
  box-shadow: 0 6px 18px -4px var(--mp-glow);
  transition: translate .5s var(--mp-spring);
}
.rfm-player-panel.mp-skin .rfm-panel-tabs:has(.rfm-tab--room.rfm-tab--active)::before { translate: 100% 0; }
.rfm-player-panel.mp-skin .rfm-tab {
  position: relative;
  z-index: 1;
  height: 32px;
  gap: 6px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--mp-muted);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  transition: color .25s;
}
.rfm-player-panel.mp-skin .rfm-tab:hover { background: transparent; color: var(--mp-fg); }
.rfm-player-panel.mp-skin .rfm-tab.rfm-tab--active { background: transparent; border-color: transparent; color: var(--mp-ink); }

/* ── Hero: cover art + vinyl + title ── */
.rfm-player-panel.mp-skin .rfm-panel-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 18px 6px;
  border-bottom: 0;
}
.rfm-player-panel.mp-skin .mp-disc-wrap {
  position: relative;
  flex-shrink: 0;
  width: var(--mp-cover);
  height: var(--mp-cover);
  margin-right: calc(var(--mp-cover) * .3);
  transition: translate .6s var(--mp-ease);
}
.rfm-player-panel.mp-skin .mp-vinyl {
  position: absolute;
  inset: 5%;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background:
    conic-gradient(from 20deg, transparent 0 18%, rgb(255 255 255 / .12) 24%, transparent 30% 68%, rgb(255 255 255 / .09) 74%, transparent 80%),
    repeating-radial-gradient(circle, #18181c 0 1.5px, #24242a 1.5px 3px);
  box-shadow: 0 8px 22px rgb(0 0 0 / .38);
  translate: 0 0;
  transition: translate .7s var(--mp-ease);
  animation: mp-spin 3.6s linear infinite paused;
}
.rfm-player-panel.mp-skin .mp-vinyl-label {
  position: relative;
  width: 38%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--mp-grad);
  background-size: cover;
  background-position: center;
  box-shadow: 0 0 0 2px rgb(255 255 255 / .06);
}
.rfm-player-panel.mp-skin .mp-vinyl-label::after {
  content: '';
  position: absolute;
  inset: 42%;
  border-radius: 50%;
  background: var(--mp-bg);
}
.rfm-player-panel.mp-skin[data-idle="0"] .mp-vinyl { translate: 22% 0; }
.rfm-player-panel.mp-skin[data-playing="1"] .mp-vinyl { translate: 36% 0; animation-play-state: running; }

.rfm-player-panel.mp-skin .rfm-panel-artwork {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: auto;
  height: auto;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 14px 30px -10px rgb(0 0 0 / .5), 0 0 0 1px var(--mp-line);
  transition: box-shadow .6s var(--mp-ease);
}
.rfm-player-panel.mp-skin[data-playing="1"] .rfm-panel-artwork {
  box-shadow: 0 18px 40px -10px var(--mp-glow), 0 0 0 1px var(--mp-line);
  animation: mp-breathe 3.4s ease-in-out infinite;
}
.rfm-player-panel.mp-skin .rfm-artwork-bg,
.rfm-player-panel.mp-skin .rfm-artwork-bg--dj { background: var(--mp-grad); }
.rfm-player-panel.mp-skin .rfm-artwork-icon {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  color: color-mix(in oklab, var(--mp-ink) 72%, transparent);
}
.rfm-player-panel.mp-skin .mp-cover-img {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  scale: 1.34; /* crop hqdefault's letterbox bars */
  opacity: 0;
  transition: opacity .6s var(--mp-ease);
  user-select: none;
}
.rfm-player-panel.mp-skin .mp-cover-img.is-loaded { opacity: 1; }

.rfm-player-panel.mp-skin .rfm-panel-hero-info { flex: 1; min-width: 0; gap: 4px; }
.rfm-player-panel.mp-skin .rfm-panel-eyebrow {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--mp-accent);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  opacity: 1;
}
.rfm-player-panel.mp-skin .rfm-panel-viz {
  position: static;
  transform: none;
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  height: 11px;
}
.rfm-player-panel.mp-skin .rfm-panel-viz span { width: 3px; height: 3px; background: var(--mp-grad); animation-play-state: paused; }
.rfm-player-panel.mp-skin[data-playing="1"] .rfm-panel-viz span { animation-play-state: running; }
.rfm-player-panel.mp-skin .rfm-panel-now-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  white-space: normal;
  text-wrap: balance;
  color: var(--mp-fg);
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -.015em;
  line-height: 1.25;
}
.rfm-player-panel.mp-skin[data-idle="1"] .rfm-panel-now-title { color: var(--mp-muted); }
.rfm-player-panel.mp-skin .rfm-panel-now-by { color: var(--mp-muted); font-size: 12px; }

/* ── Transport ── */
.rfm-player-panel.mp-skin .rfm-panel-controls-row { padding: 10px 18px 12px; border-bottom: 0; }
.rfm-player-panel.mp-skin .rfm-ctrl-set { justify-content: center; gap: 14px; }
.rfm-player-panel.mp-skin .rfm-ctrl {
  width: 42px;
  height: 42px;
  margin: 0;
  border: 0;
  border-radius: 50%;
  background: var(--mp-surface);
  box-shadow: inset 0 0 0 1px var(--mp-line);
  color: var(--mp-fg);
  transition: transform .3s var(--mp-spring), background .2s, color .2s, box-shadow .3s, filter .2s;
}
.rfm-player-panel.mp-skin .rfm-ctrl:hover { background: var(--mp-surface-2); color: var(--mp-fg); transform: translateY(-1px) scale(1.07); }
.rfm-player-panel.mp-skin .rfm-ctrl:active { transform: scale(.9); transition-duration: .08s; }
.rfm-player-panel.mp-skin .rfm-ctrl:focus-visible { outline: 2px solid var(--mp-accent); outline-offset: 3px; }
.rfm-player-panel.mp-skin .rfm-ctrl:disabled { opacity: .3; }
.rfm-player-panel.mp-skin .rfm-ctrl-playpause,
.rfm-player-panel.mp-skin .rfm-ctrl-skip {
  width: 58px;
  height: 58px;
  background: var(--mp-grad);
  color: var(--mp-ink);
  box-shadow: 0 12px 26px -8px var(--mp-glow), inset 0 1px 0 rgb(255 255 255 / .35);
}
.rfm-player-panel.mp-skin .rfm-ctrl-playpause:hover,
.rfm-player-panel.mp-skin .rfm-ctrl-skip:hover {
  background: var(--mp-grad);
  color: var(--mp-ink);
  filter: brightness(1.07) saturate(1.1);
  box-shadow: 0 16px 32px -8px var(--mp-glow), inset 0 1px 0 rgb(255 255 255 / .35);
}
.rfm-player-panel.mp-skin .rfm-play-icon { translate: 1.5px 0; }
.rfm-player-panel.mp-skin .rfm-ctrl-stop,
.rfm-player-panel.mp-skin .rfm-ctrl-dj-stop { color: var(--mp-danger); }
.rfm-player-panel.mp-skin .rfm-ctrl-stop:hover,
.rfm-player-panel.mp-skin .rfm-ctrl-dj-stop:hover { background: color-mix(in oklab, var(--mp-danger) 15%, transparent); color: var(--mp-danger); }
.rfm-player-panel.mp-skin .rfm-ctrl-mute.muted { background: color-mix(in oklab, var(--mp-danger) 13%, transparent); color: var(--mp-danger); }

/* ── Search ── */
.rfm-player-panel.mp-skin .rfm-panel-search-row { gap: 8px; padding: 2px 14px 12px; border-bottom: 0; }
.rfm-player-panel.mp-skin .rfm-panel-search-input-wrap {
  height: 42px;
  gap: 8px;
  padding: 0 8px 0 14px;
  border: 0;
  border-radius: 999px;
  background: var(--mp-surface);
  box-shadow: inset 0 0 0 1px var(--mp-line);
  transition: background .25s, box-shadow .25s;
}
.rfm-player-panel.mp-skin .rfm-panel-search-input-wrap:focus-within {
  background: var(--mp-surface-2);
  box-shadow: inset 0 0 0 1.5px var(--mp-accent), 0 0 0 4px color-mix(in oklab, var(--mp-accent) 18%, transparent);
}
.rfm-player-panel.mp-skin .rfm-search-icon { color: var(--mp-faint); transition: color .2s; }
.rfm-player-panel.mp-skin .rfm-panel-search-input-wrap:focus-within .rfm-search-icon { color: var(--mp-accent); }
.rfm-player-panel.mp-skin .rfm-panel-search-input { color: var(--mp-fg); font-size: 13px; }
.rfm-player-panel.mp-skin .rfm-panel-search-input::placeholder { color: var(--mp-faint); }
.rfm-player-panel.mp-skin .rfm-panel-search-clear { width: 20px; height: 20px; background: var(--mp-surface-2); color: var(--mp-muted); }
.rfm-player-panel.mp-skin .rfm-panel-search-clear:hover { background: var(--mp-faint); color: var(--mp-bg); }
.rfm-player-panel.mp-skin .rfm-panel-search-btn,
.rfm-player-panel.mp-skin.rfm-player-panel--dj .rfm-panel-search-btn {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: var(--mp-grad);
  color: var(--mp-ink);
  box-shadow: 0 8px 18px -6px var(--mp-glow);
  transition: transform .3s var(--mp-spring), filter .2s;
}
.rfm-player-panel.mp-skin .rfm-panel-search-btn:hover,
.rfm-player-panel.mp-skin.rfm-player-panel--dj .rfm-panel-search-btn:hover {
  background: var(--mp-grad);
  color: var(--mp-ink);
  border-color: transparent;
  filter: brightness(1.07);
  transform: scale(1.08) translateX(1px);
}

/* ── Queue / results card ── */
.rfm-player-panel.mp-skin .rfm-panel-queue-section {
  margin: 0 10px 10px;
  border-radius: 16px;
  background: var(--mp-surface);
  box-shadow: inset 0 0 0 1px var(--mp-line);
}
.rfm-player-panel.mp-skin .rfm-panel-queue-header { padding: 12px 14px 6px; }
.rfm-player-panel.mp-skin .rfm-panel-queue-label {
  color: var(--mp-fg);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: -.005em;
  text-transform: none;
}
.rfm-player-panel.mp-skin .rfm-panel-queue-count {
  padding: 2px 9px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--mp-accent) 15%, transparent);
  color: var(--mp-accent);
  font-size: 10.5px;
  font-weight: 700;
}
.rfm-player-panel.mp-skin .rfm-panel-queue-count:empty { display: none; }
.rfm-player-panel.mp-skin .rfm-panel-queue-body {
  padding: 2px 6px 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--mp-surface-2) transparent;
}
.rfm-player-panel.mp-skin .rfm-panel-queue-body::-webkit-scrollbar { width: 6px; }
.rfm-player-panel.mp-skin .rfm-panel-queue-body::-webkit-scrollbar-thumb { background: var(--mp-surface-2); border-radius: 3px; }

.rfm-player-panel.mp-skin .rfm-panel-queue-item,
.rfm-player-panel.mp-skin .rfm-panel-result-item {
  gap: 11px;
  padding: 7px 8px;
  border-radius: 12px;
  animation: mp-rise .45s var(--mp-ease) both;
  animation-delay: calc(var(--i, 0) * 35ms);
  transition: background .15s;
}
.rfm-player-panel.mp-skin .rfm-panel-queue-item:hover,
.rfm-player-panel.mp-skin .rfm-panel-result-item:hover { background: var(--mp-surface-2); }
.rfm-player-panel.mp-skin .rfm-panel-queue-thumb {
  position: relative;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--mp-grad);
}
.rfm-player-panel.mp-skin .rfm-panel-queue-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rfm-player-panel.mp-skin .rfm-panel-queue-thumb:has(img)::after { content: ''; position: absolute; inset: 0; background: rgb(0 0 0 / .3); }
.rfm-player-panel.mp-skin .rfm-panel-queue-pos {
  position: relative;
  z-index: 1;
  min-width: 0;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-shadow: 0 1px 4px rgb(0 0 0 / .55);
}
.rfm-player-panel.mp-skin .rfm-panel-queue-item:first-child .rfm-panel-queue-thumb {
  box-shadow: 0 0 0 2px var(--mp-bg), 0 0 0 4px var(--mp-accent);
  margin: 2px;
}
.rfm-player-panel.mp-skin .rfm-panel-queue-info { flex: 1; }
.rfm-player-panel.mp-skin .rfm-panel-queue-title,
.rfm-player-panel.mp-skin .rfm-result-title { color: var(--mp-fg); font-size: 13px; font-weight: 600; }
.rfm-player-panel.mp-skin .rfm-panel-queue-by,
.rfm-player-panel.mp-skin .rfm-result-channel { color: var(--mp-muted); font-size: 11px; }

.rfm-player-panel.mp-skin .rfm-result-thumb { width: 42px; height: 42px; border-radius: 10px; background: var(--mp-surface-2); }
.rfm-player-panel.mp-skin .rfm-result-add {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: var(--mp-surface-2);
  color: var(--mp-fg);
  transition: transform .35s var(--mp-spring), background .2s, color .2s;
}
.rfm-player-panel.mp-skin .rfm-result-add:hover,
.rfm-player-panel.mp-skin.rfm-player-panel--dj .rfm-result-add:hover {
  background: var(--mp-grad);
  border-color: transparent;
  color: var(--mp-ink);
  transform: scale(1.12) rotate(90deg);
}
.rfm-player-panel.mp-skin .rfm-result-add.rfm-result-add--added {
  background: #22c55e;
  color: #fff;
  transform: none;
  animation: mp-pop .45s var(--mp-spring);
}
.rfm-player-panel.mp-skin .rfm-result-add.rfm-result-add--added:hover,
.rfm-player-panel.mp-skin .rfm-result-add.rfm-result-add--added:disabled {
  background: #22c55e;
  color: #fff;
  transform: none;
  cursor: default;
  opacity: 1;
}
.rfm-player-panel.mp-skin .rfm-result-more {
  width: calc(100% - 12px);
  margin: 8px 6px 2px;
  padding: 9px;
  border: 0;
  border-radius: 999px;
  background: var(--mp-surface-2);
  color: var(--mp-muted);
  font-size: 12px;
  font-weight: 700;
}
.rfm-player-panel.mp-skin .rfm-result-more:hover { background: var(--mp-grad); color: var(--mp-ink); }

.rfm-player-panel.mp-skin .rfm-panel-queue-empty,
.rfm-player-panel.mp-skin .rfm-panel-search-empty {
  gap: 4px;
  min-height: 130px;
  padding: 18px 12px;
  color: var(--mp-muted);
  text-align: center;
}
.rfm-player-panel.mp-skin .mp-empty-icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 8px;
  border-radius: 16px;
  background: var(--mp-grad);
  color: var(--mp-ink);
  box-shadow: 0 10px 24px -8px var(--mp-glow);
  animation: mp-float 3.6s ease-in-out infinite;
}
.rfm-player-panel.mp-skin .mp-empty-title { color: var(--mp-fg); font-size: 13px; font-weight: 700; }
.rfm-player-panel.mp-skin .mp-empty-hint { color: var(--mp-faint); font-size: 11.5px; }

/* ── Compact sizing ── (overrides the roomier base values above) */
.rfm-player-panel.mp-skin { --mp-cover: 64px; }
.rfm-player-panel.mp-skin .rfm-panel-header { height: 38px; padding: 0 6px 0 12px; }
.rfm-player-panel.mp-skin .mp-logo { width: 20px; height: 20px; border-radius: 7px; }
.rfm-player-panel.mp-skin .mp-logo svg { width: 11px; height: 11px; }
.rfm-player-panel.mp-skin .rfm-panel-header-title { font-size: 12.5px; }
.rfm-player-panel.mp-skin .mp-room-name { padding: 1px 8px; font-size: 10.5px; }
.rfm-player-panel.mp-skin .rfm-panel-close { width: 26px; height: 26px; border-radius: 8px; }

.rfm-player-panel.mp-skin .rfm-panel-tabs { margin: 0 10px; padding: 3px; border-radius: 11px; }
.rfm-player-panel.mp-skin .rfm-panel-tabs::before { top: 3px; bottom: 3px; left: 3px; width: calc(50% - 3px); border-radius: 8px; }
.rfm-player-panel.mp-skin .rfm-tab { height: 26px; border-radius: 8px; font-size: 11px; }

.rfm-player-panel.mp-skin .rfm-panel-hero { gap: 12px; padding: 12px 12px 2px; }
.rfm-player-panel.mp-skin .mp-disc-wrap { margin-right: calc(var(--mp-cover) * .32); }
.rfm-player-panel.mp-skin .rfm-panel-artwork { border-radius: 12px; }
.rfm-player-panel.mp-skin .rfm-artwork-icon svg { width: 22px; height: 22px; }
.rfm-player-panel.mp-skin .rfm-panel-eyebrow { gap: 6px; font-size: 9px; }
.rfm-player-panel.mp-skin .rfm-panel-viz { height: 9px; }
.rfm-player-panel.mp-skin .rfm-panel-now-title { font-size: 14px; }
.rfm-player-panel.mp-skin .rfm-panel-now-by { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.rfm-player-panel.mp-skin .rfm-panel-controls-row { padding: 6px 12px 8px; }
.rfm-player-panel.mp-skin .rfm-ctrl-set { gap: 10px; }
.rfm-player-panel.mp-skin .rfm-ctrl { width: 34px; height: 34px; }
.rfm-player-panel.mp-skin .rfm-ctrl svg { width: 14px; height: 14px; }
.rfm-player-panel.mp-skin .rfm-ctrl-playpause,
.rfm-player-panel.mp-skin .rfm-ctrl-skip { width: 44px; height: 44px; }
.rfm-player-panel.mp-skin .rfm-ctrl-playpause svg { width: 18px; height: 18px; }

.rfm-player-panel.mp-skin .rfm-panel-search-row { gap: 6px; padding: 0 10px 8px; }
.rfm-player-panel.mp-skin .rfm-panel-search-input-wrap { height: 34px; padding: 0 6px 0 12px; }
.rfm-player-panel.mp-skin .rfm-panel-search-input { font-size: 12.5px; }
.rfm-player-panel.mp-skin .rfm-panel-search-btn,
.rfm-player-panel.mp-skin.rfm-player-panel--dj .rfm-panel-search-btn { width: 34px; height: 34px; }

.rfm-player-panel.mp-skin .rfm-panel-queue-section { margin: 0 10px 10px; border-radius: 14px; }
.rfm-player-panel.mp-skin .rfm-panel-queue-header { padding: 9px 12px 4px; }
.rfm-player-panel.mp-skin .rfm-panel-queue-label { font-size: 11.5px; }
.rfm-player-panel.mp-skin .rfm-panel-queue-count { display: none; }
.rfm-player-panel.mp-skin .rfm-panel-queue-body { padding: 0 4px 6px; }
.rfm-player-panel.mp-skin .rfm-panel-result-item { gap: 9px; padding: 5px 6px; border-radius: 10px; }
.rfm-player-panel.mp-skin .rfm-result-thumb { width: 36px; height: 36px; border-radius: 8px; }
.rfm-player-panel.mp-skin .rfm-result-title { font-size: 12.5px; }
.rfm-player-panel.mp-skin .rfm-result-channel { font-size: 10.5px; }
.rfm-player-panel.mp-skin .rfm-result-add { width: 28px; height: 28px; }
.rfm-player-panel.mp-skin .rfm-panel-queue-empty,
.rfm-player-panel.mp-skin .rfm-panel-search-empty { min-height: 90px; }

/* ── Up next (always visible, separate from search/trending results) ── */
.rfm-player-panel.mp-skin .mp-upnext {
  display: flex;
  flex-direction: column;
  flex: 0 1 auto;
  min-height: 0;
  max-height: 30vh;
  margin: 0 10px 8px;
  border-radius: 14px;
  background: var(--mp-surface);
  box-shadow: inset 0 0 0 1px var(--mp-line);
  overflow: hidden;
}
.rfm-player-panel.mp-skin .mp-upnext-head { display: flex; align-items: center; gap: 7px; padding: 8px 12px 4px; flex-shrink: 0; }
.rfm-player-panel.mp-skin .mp-upnext-label { color: var(--mp-fg); font-size: 11.5px; font-weight: 800; letter-spacing: -.005em; }
.rfm-player-panel.mp-skin .mp-upnext-count {
  min-width: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--mp-grad);
  color: var(--mp-ink);
  font-size: 10px;
  font-weight: 800;
  line-height: 16px;
  text-align: center;
}
.rfm-player-panel.mp-skin .mp-upnext-count:empty { display: none; }
.rfm-player-panel.mp-skin .mp-upnext-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0 4px 6px;
  scrollbar-width: thin;
  scrollbar-color: var(--mp-surface-2) transparent;
}
.rfm-player-panel.mp-skin .mp-upnext-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 4px 6px;
  border-radius: 9px;
  animation: mp-rise .4s var(--mp-ease) both;
  animation-delay: calc(var(--i, 0) * 30ms);
  transition: background .15s;
}
.rfm-player-panel.mp-skin .mp-upnext-item:hover { background: var(--mp-surface-2); }
.rfm-player-panel.mp-skin .mp-upnext-thumb {
  position: relative;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  overflow: hidden;
  background: var(--mp-grad);
}
.rfm-player-panel.mp-skin .mp-upnext-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rfm-player-panel.mp-skin .mp-upnext-thumb:has(img)::after { content: ''; position: absolute; inset: 0; background: rgb(0 0 0 / .3); }
.rfm-player-panel.mp-skin .mp-upnext-pos { position: relative; z-index: 1; color: #fff; font-size: 11px; font-weight: 800; text-shadow: 0 1px 3px rgb(0 0 0 / .55); }
.rfm-player-panel.mp-skin .mp-upnext-item:first-child .mp-upnext-thumb { box-shadow: 0 0 0 2px var(--mp-accent); }
.rfm-player-panel.mp-skin .mp-upnext-info { display: flex; flex-direction: column; flex: 1; min-width: 0; gap: 1px; }
.rfm-player-panel.mp-skin .mp-upnext-title,
.rfm-player-panel.mp-skin .mp-upnext-by { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rfm-player-panel.mp-skin .mp-upnext-title { color: var(--mp-fg); font-size: 12px; font-weight: 600; }
.rfm-player-panel.mp-skin .mp-upnext-by { color: var(--mp-muted); font-size: 10.5px; }
.rfm-player-panel.mp-skin .mp-upnext-remove {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--mp-faint);
  opacity: 0;
  cursor: pointer;
  transition: opacity .15s, background .15s, color .15s;
}
.rfm-player-panel.mp-skin .mp-upnext-item:hover .mp-upnext-remove,
.rfm-player-panel.mp-skin .mp-upnext-remove:focus-visible { opacity: 1; }
.rfm-player-panel.mp-skin .mp-upnext-remove:hover { background: color-mix(in oklab, var(--mp-danger) 16%, transparent); color: var(--mp-danger); }
.rfm-player-panel.mp-skin .mp-upnext-empty { padding: 8px 8px 12px; color: var(--mp-faint); font-size: 11.5px; text-align: center; }
.rfm-player-panel.mp-skin .mp-upnext-empty b { color: var(--mp-accent); }

/* ── Wide (.mp-wide, ≥520px): player + Up next on the left, search + results right ── */
.rfm-player-panel.mp-skin.mp-wide {
  display: grid;
  grid-template-columns: minmax(230px, .9fr) minmax(250px, 1.1fr);
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  grid-template-areas:
    "head head"
    "tabs search"
    "hero results"
    "ctrl results"
    "queue results";
}
.rfm-player-panel.mp-skin.mp-wide .rfm-panel-header { grid-area: head; }
.rfm-player-panel.mp-skin.mp-wide .rfm-panel-tabs { grid-area: tabs; align-self: center; margin: 0 6px 8px 10px; }
.rfm-player-panel.mp-skin.mp-wide .rfm-panel-search-row { grid-area: search; align-self: center; padding: 0 10px 8px 4px; }
.rfm-player-panel.mp-skin.mp-wide .rfm-panel-hero { grid-area: hero; }
.rfm-player-panel.mp-skin.mp-wide .rfm-panel-controls-row { grid-area: ctrl; }
/* contain:size = neither list feeds its content height into the grid rows,
   so long lists scroll inside their cards instead of stretching the window. */
.rfm-player-panel.mp-skin.mp-wide .mp-upnext { grid-area: queue; max-height: none; margin: 0 6px 10px 10px; contain: size; }
.rfm-player-panel.mp-skin.mp-wide .rfm-panel-queue-section { grid-area: results; margin: 0 10px 10px 4px; min-height: 0; contain: size; }
@media (max-width: 330px) {
  .rfm-player-panel.mp-skin .rfm-tab svg { display: none; }
}

@keyframes mp-spin { to { rotate: 360deg; } }
@keyframes mp-breathe { 50% { transform: scale(1.025); } }
@keyframes mp-rise { from { opacity: 0; translate: 0 8px; } }
@keyframes mp-float { 50% { translate: 0 -5px; rotate: -5deg; } }
@keyframes mp-pop { 0% { transform: scale(.6); } 60% { transform: scale(1.18); } 100% { transform: scale(1); } }

/* Idle tab: pause the new infinite loops too (see the html.tc-idle list in "App body 2.0"). */
html.tc-idle .rfm-player-panel.mp-skin :is(.mp-vinyl, .rfm-panel-artwork, .mp-empty-icon) { animation-play-state: paused !important; }

@media (prefers-reduced-motion: reduce) {
  .rfm-player-panel.mp-skin *,
  .rfm-player-panel.mp-skin *::before,
  .rfm-player-panel.mp-skin *::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}
[data-theme=daylight] .rfm-player-panel.mp-skin { box-shadow: inset 0 1px 0 rgb(255 255 255 / .6), 0 24px 60px -14px rgb(28 33 48 / .28); }

/* Karaoke results the uploader won't let play outside YouTube (Sing King &
   co.) — kept in the list, tagged, and opened in a YouTube window instead
   (_openKaraokeYouTubeWindow in app-room-modal.js; native twin:
   openKaraokeYouTubeWindow in native.js). */
.room-karaoke-yt-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(255, 0, 0, .14);
  color: #ff4e45;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 15px;
  vertical-align: 1px;
  white-space: nowrap;
}
.room-karaoke-yt-elsewhere {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 100%;
  padding: 16px;
  text-align: center;
  background: #0f0f10;
  color: rgba(255, 255, 255, .85);
  font-size: 12px;
}
.room-karaoke-yt-elsewhere span { color: rgba(255, 255, 255, .55); }
.room-karaoke-yt-elsewhere .room-karaoke-yt-elsewhere-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 32px;
  margin-bottom: 4px;
  border-radius: 9px;
  background: #ff0033;
  color: #fff;
  font-size: 15px;
}
.room-karaoke-yt-elsewhere strong { font-size: 13.5px; color: #fff; }
.room-karaoke-yt-elsewhere-btn {
  margin-top: 6px;
  padding: 7px 14px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.room-karaoke-yt-elsewhere-btn:hover { background: rgba(255, 255, 255, .2); }


/* ══ SETTINGS 2.0 (web) ══════════════════════════════════════════════════
   Port of the native app's Settings window refresh (tauri-native
   native.css "SETTINGS" block) onto #settings-modal. Shared look:
   --aw-* tokens, gradient header tile, emoji icons per nav item/section
   via one --ico map, "Find a setting…" search + scroll-spy (app-ui.js,
   next to the .settings-nav-item click handler). Phones (≤640px) keep the
   horizontal tab strip from the "Settings nav: stay visible on phones"
   block — only the desktop sidebar geometry is changed. #section-turn /
   #section-audit-logs keep their own self-framed panels. */
#settings-modal {
  --aw-ink: var(--text-primary);
  --aw-muted: var(--text-muted, var(--text-secondary));
  --aw-surface: color-mix(in srgb, var(--text-primary) 4%, transparent);
  --aw-surface-2: color-mix(in srgb, var(--text-primary) 7%, transparent);
  --aw-line: color-mix(in srgb, var(--text-primary) 10%, transparent);
  --aw-accent: var(--accent);
  --aw-accent-2: color-mix(in oklab, var(--accent) 55%, #ff7ad9);
  --aw-grad: linear-gradient(135deg, var(--aw-accent), var(--aw-accent-2));
  --aw-ease: cubic-bezier(.22, 1, .36, 1);
  --aw-spring: cubic-bezier(.34, 1.56, .64, 1);
}
#settings-modal [data-target="section-app"], #section-app { --ico: "📱"; }
#settings-modal [data-target="section-profile"], #section-profile { --ico: "🙂"; }
#settings-modal [data-target="section-density"], #section-density { --ico: "🧩"; }
#settings-modal [data-target="section-font-size"], #section-font-size { --ico: "🔠"; }
#settings-modal [data-target="section-emoji-size"], #section-emoji-size { --ico: "😊"; }
#settings-modal [data-target="section-image-mode"], #section-image-mode { --ico: "🖼️"; }
#settings-modal [data-target="section-sounds"], #section-sounds { --ico: "🔔"; }
#settings-modal [data-target="section-privacy"], #section-privacy { --ico: "🕶️"; }
#settings-modal [data-target="section-badges"], #section-badges { --ico: "🏅"; }
#settings-modal [data-target="section-password"], #section-password { --ico: "🔑"; }
#settings-modal [data-target="section-2fa"], #section-2fa { --ico: "🛡️"; }
#settings-modal [data-target="section-recovery"], #section-recovery { --ico: "🛟"; }
#settings-modal [data-target="section-delete-account"], #section-delete-account { --ico: "🗑️"; }
#settings-modal [data-target="section-themes"], #section-themes { --ico: "🎨"; }
#settings-modal [data-target="section-desktop-app"], #section-desktop-app { --ico: "🖥️"; }
#settings-modal [data-target="section-desktop-shortcuts"], #section-desktop-shortcuts { --ico: "⌨️"; }
#settings-modal [data-target="section-branding"], #section-branding { --ico: "🏷️"; }
#settings-modal [data-target="section-members"], #section-members { --ico: "👥"; }
#settings-modal [data-target="section-create-account"], #section-create-account { --ico: "➕"; }
#settings-modal [data-target="section-whitelist"], #section-whitelist { --ico: "📋"; }
#settings-modal [data-target="section-gatekeeper"], #section-gatekeeper { --ico: "🚪"; }
#settings-modal [data-target="section-invite"], #section-invite { --ico: "🎟️"; }
#settings-modal [data-target="section-cleanup"], #section-cleanup { --ico: "🧹"; }
#settings-modal [data-target="section-limits"], #section-limits { --ico: "🚦"; }
#settings-modal [data-target="section-sounds-admin"], #section-sounds-admin { --ico: "🎚️"; }
#settings-modal [data-target="section-emojis"], #section-emojis { --ico: "😀"; }
#settings-modal [data-target="section-fonts"], #section-fonts { --ico: "🔤"; }
#settings-modal [data-target="section-gifts"], #section-gifts { --ico: "🎁"; }
#settings-modal [data-target="section-roles"], #section-roles { --ico: "👑"; }
#settings-modal [data-target="section-tunnel"], #section-tunnel { --ico: "🚇"; }
#settings-modal [data-target="section-bots"], #section-bots { --ico: "🤖"; }
#settings-modal [data-target="section-elite-bots"], #section-elite-bots { --ico: "🦾"; }
#settings-modal [data-target="section-import"], #section-import { --ico: "📥"; }
#settings-modal [data-target="section-dm-features"], #section-dm-features { --ico: "💬"; }
#settings-modal [data-target="section-media-perms"], #section-media-perms { --ico: "🎥"; }
#settings-modal [data-target="section-link-previews"], #section-link-previews { --ico: "🔗"; }
#settings-modal [data-target="section-remote-control"], #section-remote-control { --ico: "🕹️"; }
#settings-modal [data-target="section-services"], #section-services { --ico: "✨"; }
#settings-modal [data-target="section-audit-logs"], #section-audit-logs { --ico: "📜"; }
#settings-modal [data-target="section-force-update"], #section-force-update { --ico: "⚡"; }
#settings-modal [data-target="section-turn"], #section-turn { --ico: "📡"; }
#settings-modal [data-target="section-language"], #section-language { --ico: "🌐"; }
#settings-modal [data-target="section-push"], #section-push { --ico: "📲"; }
#settings-modal [data-target="section-plugins"], #section-plugins { --ico: "🔌"; }
#settings-modal [data-target="section-uploads"], #section-uploads { --ico: "📤"; }
#settings-modal [data-target="section-redis"], #section-redis { --ico: "🗄️"; }
#settings-modal [data-target="section-modmode"], #section-modmode { --ico: "🚨"; }
#settings-modal [data-target="section-server"], #section-server { --ico: "🖧"; }
#admin-mod-panel { --ico: "🛠️"; }

#settings-modal .modal-settings {
  background:
    radial-gradient(120% 60% at 0% 0%, color-mix(in srgb, var(--aw-accent) 12%, transparent), transparent 60%),
    radial-gradient(80% 50% at 100% 0%, color-mix(in srgb, var(--aw-accent-2) 9%, transparent), transparent 60%),
    var(--bg-card);
}

/* Header — web markup is just <h3> + ✕, so the tile is an h3::before */
#settings-modal .settings-header {
  background: none;
  border-bottom: 1px solid var(--aw-line);
}
#settings-modal .settings-header h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 0;
  border: 0;
  font-family: var(--font-main);
  font-weight: 800;
  letter-spacing: -.01em;
}
#settings-modal .settings-header h3::before {
  content: "⚙️";
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 12px;
  font-size: 19px;
  background: var(--aw-grad);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--aw-accent) 40%, transparent), inset 0 1px 0 rgba(255, 255, 255, .25);
  transform: rotate(-6deg);
  transition: transform .35s var(--aw-spring);
}
#settings-modal .settings-header:hover h3::before { transform: rotate(8deg) scale(1.06); }
#settings-modal .settings-header h3 > span {
  background: linear-gradient(90deg, var(--aw-ink), color-mix(in srgb, var(--aw-ink) 60%, var(--aw-accent)));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
#settings-modal .settings-close-btn {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  border: 1px solid var(--aw-line);
  background: var(--aw-surface);
  color: var(--aw-muted);
  transition: background .15s, color .15s, border-color .15s;
}
#settings-modal .settings-close-btn:hover { color: #fff; border-color: transparent; background: var(--danger); }

/* Sidebar */
#settings-modal .settings-nav {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--text-primary) 15%, transparent) transparent;
}
#settings-modal .settings-nav-search {
  position: sticky;
  top: -10px;
  z-index: 2;
  display: flex;
  align-items: center;
  margin: -10px -8px 6px;
  padding: 10px 8px 8px;
  background: linear-gradient(var(--bg-card) 80%, transparent);
}
#settings-modal .settings-nav-search svg {
  position: absolute;
  left: 19px;
  color: var(--aw-muted);
  pointer-events: none;
  transition: color .2s;
}
#settings-modal .settings-nav-search:focus-within svg { color: var(--aw-accent); }
#settings-modal #settings-nav-search {
  width: 100%;
  height: 32px;
  padding: 0 10px 0 30px;
  border-radius: 10px;
  border: 1px solid var(--aw-line);
  background: var(--aw-surface);
  color: var(--aw-ink);
  font: 500 .76rem var(--font-main);
  outline: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
#settings-modal #settings-nav-search:focus {
  border-color: color-mix(in srgb, var(--aw-accent) 70%, transparent);
  background: var(--aw-surface-2);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--aw-accent) 18%, transparent);
}
#settings-modal .settings-nav-empty {
  padding: 14px 8px;
  text-align: center;
  color: var(--aw-muted);
  font-size: .74rem;
}
#settings-modal .nav-filtered-out { display: none !important; }

#settings-modal .settings-nav-group {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 8px 6px;
  color: var(--aw-muted);
  letter-spacing: .1em;
}
#settings-modal .settings-nav-group::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--aw-line), transparent);
}
#settings-modal .settings-nav-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 2px;
  padding: 7px 10px;
  border-radius: 10px;
  color: var(--aw-muted);
  font-weight: 600;
  transition: color .15s, background .2s var(--aw-ease), box-shadow .2s, transform .2s var(--aw-spring);
}
#settings-modal .settings-nav-item::before {
  content: var(--ico, "•");
  /* style.css uses this ::before as an absolutely-positioned active bar —
     put it back in the flex row so the icon sits beside the label. */
  position: static;
  left: auto;
  top: auto;
  transform: none;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  font-size: 13px;
  background: var(--aw-surface-2);
  transition: transform .35s var(--aw-spring), background .2s;
}
#settings-modal .settings-nav-item:hover {
  color: var(--aw-ink);
  background: var(--aw-surface-2);
  transform: translateX(2px);
}
#settings-modal .settings-nav-item:hover::before { transform: rotate(-10deg) scale(1.12); }
#settings-modal .settings-nav-item.active {
  color: #fff;
  background: var(--aw-grad);
  box-shadow: 0 4px 14px -4px color-mix(in srgb, var(--aw-accent) 70%, transparent);
  transform: none;
}
#settings-modal .settings-nav-item.active::before { background: rgba(255, 255, 255, .22); }
#settings-modal .settings-nav-admin.settings-nav-item:not(.active)::after {
  content: '';
  position: absolute;
  right: 9px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: color-mix(in srgb, #f43f5e 70%, transparent);
}


@media (min-width: 641px) {
  #settings-modal .settings-nav {
    background: color-mix(in srgb, var(--text-primary) 2.5%, transparent);
    border-right: 1px solid var(--aw-line);
    width: 196px;
    min-width: 196px;
    padding: 10px 8px 14px;
  }
}

/* Body */
#settings-modal .settings-body {
  padding: 16px 20px 24px;
  background: none;
  scroll-behavior: smooth;
  scroll-padding-top: 12px;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--text-primary) 18%, transparent) transparent;
  scrollbar-gutter: stable;
}

/* Sections → cards (the inline border-top/margin dividers on some
   sections are replaced by card spacing, hence the !important). */
#settings-modal .settings-section,
#settings-modal .admin-settings:not(#section-turn):not(#section-audit-logs) {
  position: relative;
  margin: 0 0 12px !important;
  padding: 16px 18px !important;
  border: 1px solid var(--aw-line) !important;
  border-radius: 14px;
  background: var(--aw-surface);
  scroll-margin-top: 12px;
  transition: border-color .2s, box-shadow .25s, background .2s;
}
#settings-modal .settings-section:hover,
#settings-modal .admin-settings:hover {
  border-color: color-mix(in srgb, var(--aw-accent) 30%, transparent) !important;
  box-shadow: 0 8px 24px -16px color-mix(in srgb, var(--aw-accent) 70%, transparent);
}
/* The Admin block is a wrapper around many sub-cards, not a card itself. */
#settings-modal .admin-settings-section {
  padding: 4px 0 0 !important;
  border: 0 !important;
  background: none;
  box-shadow: none !important;
}
#settings-modal .admin-settings-section:hover { border: 0 !important; }
#settings-modal .admin-settings {
  background: linear-gradient(140deg, color-mix(in srgb, #f43f5e 4%, transparent), var(--aw-surface) 40%);
}

#settings-modal .settings-flash { animation: settings-flash 1.1s var(--aw-ease); }
@keyframes settings-flash {
  0%, 30% { border-color: var(--aw-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--aw-accent) 25%, transparent); }
  100% { box-shadow: 0 0 0 0 transparent; }
}

#settings-modal .settings-section-title {
  gap: 10px;
  margin-bottom: 10px;
  padding: 0;
  border: 0;
  font-family: var(--font-main);
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--aw-ink);
}
#settings-modal .settings-section > .settings-section-title::before,
#settings-modal .admin-settings > .settings-section-subtitle:first-child::before {
  content: var(--ico, "⚙️");
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border-radius: 9px;
  font-size: 15px;
  background: color-mix(in srgb, var(--aw-accent) 15%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--aw-accent) 25%, transparent);
  transition: transform .35s var(--aw-spring);
}
#settings-modal .settings-section:hover > .settings-section-title::before,
#settings-modal .admin-settings:hover > .settings-section-subtitle:first-child::before { transform: rotate(-8deg) scale(1.08); }
#settings-modal .admin-settings > .settings-section-subtitle:first-child {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 0;
  padding-bottom: 0;
  border: 0;
  color: var(--aw-ink);
  font-weight: 800;
}
#settings-modal .settings-section-subtitle {
  margin-top: 14px;
  padding-bottom: 6px;
  border-bottom: 1px dashed var(--aw-line);
  color: var(--aw-ink);
  font-weight: 700;
}
#settings-modal .settings-desc,
#settings-modal .settings-hint { color: var(--aw-muted); }

/* Toggle rows + switch */
#settings-modal .toggle-row {
  margin: 0 -8px;
  padding: 9px 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--text-primary) 6%, transparent);
  border-radius: 9px;
  transition: background .15s;
}
#settings-modal .toggle-row:last-child { border-bottom: 0; }
#settings-modal .toggle-row:hover { background: var(--aw-surface-2); }
#settings-modal .toggle-row input[type=checkbox] {
  flex: 0 0 auto;
  width: 42px;
  height: 24px;
  border: 1px solid var(--aw-line);
  background: color-mix(in srgb, var(--text-primary) 12%, transparent);
  transition: background .25s var(--aw-ease), border-color .25s, box-shadow .25s;
}
#settings-modal .toggle-row input[type=checkbox]::before {
  width: 18px;
  height: 18px;
  top: 2px;
  left: 2px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
  transition: transform .3s var(--aw-spring), width .2s;
}
#settings-modal .toggle-row:active input[type=checkbox]::before { width: 22px; }
#settings-modal .toggle-row input[type=checkbox]:checked {
  border-color: transparent;
  background: var(--aw-grad);
  box-shadow: 0 2px 10px -2px color-mix(in srgb, var(--aw-accent) 70%, transparent);
}
#settings-modal .toggle-row input[type=checkbox]:checked::before { transform: translateX(18px); }
#settings-modal .toggle-row:active input[type=checkbox]:checked::before { transform: translateX(14px); }
#settings-modal .toggle-row input[type=checkbox]:focus-visible { outline: 2px solid var(--aw-accent); outline-offset: 2px; }

/* Text / number / select inputs */
#settings-modal .settings-text-input,
#settings-modal .settings-number-input,
#settings-modal .settings-select,
#settings-modal .select-row select,
#settings-modal .notif-settings select,
#settings-modal .form-group input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
#settings-modal .fu-version-input,
#settings-modal .fu-message-input,
#settings-modal .turn-input {
  min-height: 32px;
  border-radius: 9px;
  border: 1px solid var(--aw-line);
  background: var(--aw-surface-2);
  color: var(--aw-ink);
  font-family: var(--font-main);
  outline: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
#settings-modal .settings-text-input:focus,
#settings-modal .settings-number-input:focus,
#settings-modal .settings-select:focus,
#settings-modal .select-row select:focus,
#settings-modal .notif-settings select:focus,
#settings-modal .form-group input:focus,
#settings-modal .fu-version-input:focus,
#settings-modal .fu-message-input:focus,
#settings-modal .turn-input:focus {
  border-color: color-mix(in srgb, var(--aw-accent) 70%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--aw-accent) 18%, transparent);
}
#settings-modal .select-row { padding: 6px 0; gap: 10px; }

/* Range sliders */
#settings-modal input[type=range] {
  accent-color: var(--aw-accent);
  cursor: pointer;
}

/* Density / font-size pickers */
#settings-modal .density-btn {
  border-radius: 11px;
  border: 1px solid var(--aw-line);
  background: var(--aw-surface-2);
  transition: transform .2s var(--aw-spring), border-color .2s, box-shadow .2s, background .2s;
}
#settings-modal .density-btn:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--aw-accent) 45%, transparent); }
#settings-modal .density-btn.active {
  border-color: var(--aw-accent);
  background: color-mix(in srgb, var(--aw-accent) 14%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--aw-accent) 18%, transparent);
}

/* Buttons */
#settings-modal .btn-sm,
#settings-modal .btn-xs {
  border-radius: 999px;
  border: 1px solid var(--aw-line);
  background: var(--aw-surface-2);
  color: var(--aw-ink);
  transition: transform .2s var(--aw-spring), filter .15s, background .15s, border-color .15s, box-shadow .2s;
}
#settings-modal .btn-sm:hover:not(:disabled),
#settings-modal .btn-xs:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--aw-accent) 50%, transparent);
  background: color-mix(in srgb, var(--aw-accent) 12%, var(--aw-surface-2));
  transform: translateY(-1px);
}
#settings-modal .btn-sm:active:not(:disabled),
#settings-modal .btn-xs:active:not(:disabled) { transform: scale(.95); }
#settings-modal .btn-full { border-radius: 11px; min-height: 34px; }
#settings-modal .btn-accent,
#settings-modal .btn-sm.btn-accent {
  border-color: transparent;
  background: var(--aw-grad);
  color: #fff;
  box-shadow: 0 4px 14px -6px color-mix(in srgb, var(--aw-accent) 80%, transparent);
}
#settings-modal .btn-accent:hover:not(:disabled) { filter: brightness(1.1); background: var(--aw-grad); }
#settings-modal .btn-danger-fill {
  border-radius: 11px;
  box-shadow: 0 4px 14px -6px color-mix(in srgb, var(--danger) 80%, transparent);
  transition: transform .2s var(--aw-spring), filter .15s;
}
#settings-modal .btn-danger-fill:hover { filter: brightness(1.1); transform: translateY(-1px); }

/* App update card */
#settings-modal .app-update-card {
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--aw-accent) 25%, transparent);
  background: linear-gradient(140deg, color-mix(in srgb, var(--aw-accent) 12%, transparent), color-mix(in srgb, var(--aw-accent) 3%, transparent));
}

/* Floating save bar */
#settings-modal .admin-save-bar {
  margin: 8px 0 0;
  padding: 12px 16px;
  border: 1px solid var(--aw-line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg-card) 88%, transparent);
  box-shadow: 0 -10px 30px -18px rgba(0, 0, 0, .45);
}
#settings-modal .btn-admin-save {
  min-width: 180px;
  min-height: 36px;
  border-radius: 999px;
}


/* Phones: keep the horizontal tab strip — no search box / group labels,
   pills instead of the sidebar rows. */
@media (max-width: 640px) {
  #settings-modal .settings-nav-search,
  #settings-modal .settings-nav-empty,
  #settings-modal .settings-nav-group { display: none !important; }
  #settings-modal #settings-nav .settings-nav-item { margin-bottom: 0; border-radius: 999px; }
  #settings-modal #settings-nav .settings-nav-item:hover { transform: none; }
  #settings-modal .settings-nav-admin.settings-nav-item:not(.active)::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  #settings-modal * { animation: none !important; transition-duration: .01ms !important; }
  #settings-modal .settings-body { scroll-behavior: auto; }
}