@layer tokens,base,recipes,components,overrides;@font-face{font-family:Berkeley Mono;src:url(/fonts/berkeley.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Snah;src:url(/fonts/snah.woff2) format("woff2");font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:Ruff Cut Jagged;src:url(/fonts/ruffcut.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Luckybones;src:url(/fonts/luckybones.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Illuma;src:url(/fonts/illuma.woff2) format("woff2");font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:Hanken Grotesk;src:url(/fonts/hkgrotesk.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Keiner;src:url(/fonts/keiner.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Jellee;src:url(/fonts/jellee.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Now;src:url(/fonts/now.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@layer tokens{:root{--bg: #0a0a0f;--bg-surface: rgba(255, 255, 255, .03);--bg-raised: rgba(255, 255, 255, .06);--bg-hover: rgba(255, 255, 255, .08);--bg-active: rgba(255, 255, 255, .12);--bg-float: color-mix(in srgb, var(--bg) 95%, transparent);--bg-overlay: rgba(0, 0, 0, .6);--scrim: rgba(0, 0, 0, .5);--accent: #FFC72C;--accent-hover: #E5B327;--accent-fg: var(--bg);--accent-soft: color-mix(in srgb, var(--accent) 15%, transparent);--danger: #dc2626;--danger-hover: #991b1b;--danger-soft: color-mix(in srgb, var(--danger) 12%, transparent);--success: #22c55e;--success-hover: #25a558;--success-fg: #052e13;--fg: #f0f0f5;--fg-2: #a0a0b8;--fg-3: #5a5a70;--fg-muted: #3a3a4e;--fg-link: #60a5fa;--fg-danger: #f87171;--fg-success: #4ade80;--border: rgba(255, 255, 255, .08);--blur: blur(20px);--blur-heavy: blur(32px);--blur-light: blur(8px);--glow: 0 0 20px color-mix(in srgb, var(--accent) 30%, transparent);--glow-strong: 0 0 24px color-mix(in srgb, var(--accent) 45%, transparent);--glow-soft: 0 0 12px color-mix(in srgb, var(--accent) 15%, transparent);--glow-success: 0 0 16px rgba(34, 197, 94, .4);--online: #22c55e;--idle: #f0b232;--dnd: #f23f43;--offline: #80848e;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--space-2xl: 32px;--space-3xl: 48px;--r-sm: 4px;--r-md: 8px;--r-lg: 12px;--r-xl: 16px;--r-full: 9999px;--font: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;--font-logo: "Snah", sans-serif;--mono: "Berkeley Mono", "SF Mono", "Fira Code", monospace;--text-xs: .6875rem;--text-sm: .8125rem;--text-base: .9375rem;--text-lg: 1.0625rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 3rem;--sidebar-club: 72px;--sidebar-channel: 240px;--sidebar-members: 240px;--navbar-h: 48px;--mobile-bar: 64px;--fast: .15s ease-out;--normal: .25s ease-out;--modal-w: 880px;--modal-h: min(700px, 90vh);--modal-narrow-w: 520px;--shadow-sm: 0 4px 16px rgba(0, 0, 0, .3);--shadow-md: 0 12px 40px rgba(0, 0, 0, .4);--shadow-lg: 0 24px 80px rgba(0, 0, 0, .5)}[data-theme=berkeley]{--accent: #FFC72C;--accent-hover: #E5B327;--bg: #0B1128;--bg-surface: rgba(255, 199, 44, .04);--bg-raised: rgba(255, 199, 44, .08);--bg-hover: rgba(255, 199, 44, .1);--bg-active: rgba(255, 199, 44, .14)}[data-theme=boulder]{--accent: #5B8C5A;--accent-hover: #4A7349;--accent-fg: #0D0F0C;--bg: #1A1E16;--bg-surface: rgba(91, 140, 90, .05);--bg-raised: rgba(91, 140, 90, .09);--bg-hover: rgba(91, 140, 90, .12);--bg-active: rgba(91, 140, 90, .16)}[data-theme=charlottesville]{--accent: #F47B20;--accent-hover: #D96A15;--bg: #0A1628;--bg-surface: rgba(244, 123, 32, .04);--bg-raised: rgba(244, 123, 32, .08);--bg-hover: rgba(244, 123, 32, .1);--bg-active: rgba(244, 123, 32, .14)}[data-theme=houston]{--accent: #C000DE;--accent-hover: #A600C0;--accent-fg: white}[data-theme=louisville]{--accent: #DC2626;--accent-hover: #B91C1C;--accent-fg: white;--bg: #0A0505;--bg-surface: rgba(220, 38, 38, .06);--bg-raised: rgba(220, 38, 38, .1);--bg-hover: rgba(220, 38, 38, .12);--bg-active: rgba(220, 38, 38, .16)}[data-theme=new-orleans]{--accent: #9B59B6;--accent-hover: #8344A0;--accent-fg: white;--bg: #0E0A14;--bg-surface: rgba(155, 89, 182, .05);--bg-raised: rgba(155, 89, 182, .09);--bg-hover: rgba(155, 89, 182, .11);--bg-active: rgba(155, 89, 182, .15)}[data-theme=seattle]{--accent: #4A9EE8;--accent-hover: #3888D0;--bg: #0E1A24;--bg-surface: rgba(74, 158, 232, .04);--bg-raised: rgba(74, 158, 232, .08);--bg-hover: rgba(74, 158, 232, .11);--bg-active: rgba(74, 158, 232, .15)}[data-theme=tucson]{--accent: #E07C4C;--accent-hover: #C96A3C;--bg: #120D0A;--bg-surface: rgba(224, 124, 76, .05);--bg-raised: rgba(224, 124, 76, .09);--bg-hover: rgba(224, 124, 76, .11);--bg-active: rgba(224, 124, 76, .15)}[data-high-contrast=true]{--border: rgba(255, 255, 255, .2);--fg-2: #c0c0d0;--fg-3: #8080a0;--fg-muted: #606080}}@layer base{*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font);font-size:var(--text-base);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}a{color:var(--fg-link);text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;font-size:inherit}input,textarea{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;outline:none}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input:focus-visible,textarea:focus-visible,[tabindex="-1"]:focus-visible{outline:none}ul,ol{list-style:none}img{max-width:100%;display:block}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:var(--r-full)}::-webkit-scrollbar-thumb:hover{background:var(--bg-active)}code{font-family:var(--mono);font-size:.875em;background:var(--bg-raised);padding:2px 6px;border-radius:var(--r-sm)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}}@layer overrides{@media(max-width:1024px){.member-sidebar{display:none}}@media(max-width:768px){:root{--sidebar-club: 0px;--sidebar-channel: 0px;--sidebar-members: 0px}.member-sidebar{display:none}.channel-view,.dm-view,.vc-view{position:relative;z-index:41;background:var(--bg);width:100%}.main-layout>.content>.empty{z-index:39}.mobile-back{width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--fg-2);border-radius:var(--r-md);flex-shrink:0;transition:color var(--fast),background var(--fast)}.mobile-back:hover{color:var(--fg);background:var(--bg-hover)}.mobile-back:active{background:var(--bg-active)}.navbar,.channel-view .header,.dm-view .header{padding:0 var(--space-sm) 0 var(--space-md)}.settings{width:100%;max-width:100%;height:100%;max-height:100%;border-radius:0}.friends{width:100%;max-width:100%;max-height:100%;border-radius:0}.modal{min-width:auto;max-width:100vw}.login-page .card{max-width:95vw}.message.group-start{margin-top:var(--space-md)}.message{padding:var(--space-xs) var(--space-md) var(--space-xs) 44px}.message .avatar{left:var(--space-sm);width:28px;height:28px;font-size:var(--text-xs)}.message .attachments img{max-width:min(280px,100%);max-height:200px}.msg-input{padding:0 var(--space-sm) var(--space-sm)}.voice-panel{left:0;width:100%}}}@media(prefers-reduced-motion:no-preference){html.theme-melting,html.theme-melting *,html.theme-melting *:before,html.theme-melting *:after{transition:background-color .4s ease,color .4s ease,border-color .4s ease,fill .4s ease,stroke .4s ease!important}}.app-icon rect[fill=white]{fill:none}@layer recipes{.avatar{width:var(--size, 36px);height:var(--size, 36px);border-radius:var(--r-full);background:var(--accent);color:var(--accent-fg);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:calc(var(--size, 36px) * .4);overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover}.btn{padding:var(--space-sm) var(--space-lg);border-radius:var(--r-md);font-weight:500;font-size:var(--text-sm);white-space:nowrap;flex-shrink:0;transition:background var(--fast),color var(--fast),box-shadow var(--fast)}.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.btn-primary{background:var(--accent);color:var(--accent-fg)}.btn-primary:hover:not(:disabled){background:var(--accent-hover);box-shadow:var(--glow)}.btn-secondary{background:transparent;color:var(--fg-2)}.btn-secondary:hover:not(:disabled){color:var(--fg)}.btn-ghost{background:var(--bg-raised);color:var(--fg-2)}.btn-ghost:hover:not(:disabled){background:var(--bg-hover);color:var(--fg)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--danger-hover)}.btn-sm{padding:var(--space-xs) var(--space-md);font-size:var(--text-xs)}.icon-btn{width:var(--size, 36px);height:var(--size, 36px);padding:0;display:flex;align-items:center;justify-content:center;border-radius:var(--r-md);color:var(--fg-3);flex-shrink:0;transition:color var(--fast),background var(--fast)}.icon-btn:hover:not(:disabled){color:var(--fg);background:var(--bg-raised)}.icon-btn:disabled{opacity:.4;cursor:not-allowed}.input{width:100%;padding:var(--space-sm) var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);color:var(--fg);font-size:var(--text-sm);transition:border-color var(--fast),box-shadow var(--fast)}.input:focus{border-color:var(--accent);box-shadow:var(--glow-soft)}.input::placeholder{color:var(--fg-3)}.search-field{display:flex;align-items:center;gap:var(--space-sm);padding:0 var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);transition:border-color var(--fast),box-shadow var(--fast)}.search-field:focus-within{border-color:var(--accent);box-shadow:var(--glow-soft)}.search-field>.icon{color:var(--fg-3);flex-shrink:0}.search-field input{flex:1;padding:var(--space-sm) 0;font-size:var(--text-sm);color:var(--fg)}.search-field input::placeholder{color:var(--fg-3)}.overline{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--fg-3)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-xl);color:var(--fg-3);font-size:var(--text-sm);text-align:center}.dot-badge{width:var(--size, 8px);height:var(--size, 8px);border-radius:var(--r-full);background:var(--danger);pointer-events:none;animation:pop .22s ease-out}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-overlay);backdrop-filter:var(--blur-light);-webkit-backdrop-filter:var(--blur-light);display:flex;align-items:center;justify-content:center;z-index:100;animation:overlay-in .15s ease-out}.modal{background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--space-xl);min-width:400px;max-width:500px;box-shadow:var(--shadow-lg);animation:modal-in .15s ease-out}.modal .title{font-size:var(--text-xl);font-weight:600;margin-bottom:var(--space-lg)}.modal .input{margin-bottom:var(--space-lg)}.modal p{color:var(--fg-2);font-size:var(--text-sm);margin-bottom:var(--space-lg);line-height:1.5}.modal .modal-error{font-size:var(--text-sm);color:var(--fg-danger);margin-bottom:var(--space-sm)}.modal .modal-success{font-size:var(--text-sm);color:var(--fg-success)}.modal .actions{display:flex;justify-content:flex-end;gap:var(--space-sm)}.modal-close{padding:var(--space-sm);color:var(--fg-3);border-radius:var(--r-full);display:flex;transition:color var(--fast),background var(--fast)}.modal-close:hover{color:var(--fg);background:var(--bg-raised)}.modal-close.over-banner{position:absolute;top:var(--space-sm);right:var(--space-sm);z-index:2}.modal-close.over-banner:hover{background:#0006}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}@keyframes modal-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes pop{0%{transform:scale(0)}60%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes menu-in{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-8deg)}50%{transform:rotate(6deg)}75%{transform:rotate(-3deg)}}}@layer components{.login-page{display:flex;align-items:center;justify-content:center;height:100%;background:var(--bg);position:relative;overflow:hidden}.login-page .card{position:relative;z-index:1;text-align:center;padding:var(--space-2xl);width:100%;max-width:380px;background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg)}.login-page .logo{font-family:var(--font-logo);font-size:var(--text-4xl);font-weight:700;letter-spacing:-.02em;margin-bottom:var(--space-lg);color:var(--accent);cursor:pointer;-webkit-user-select:none;user-select:none;transition:text-shadow var(--fast)}.login-page .logo:hover{text-shadow:var(--glow-soft)}.login-page .logo.wiggling{animation:wiggle .45s ease-in-out}.login-page .tabs{display:flex;gap:var(--space-xs);margin-bottom:var(--space-lg);background:var(--bg-surface);border-radius:var(--r-md);padding:3px}.login-page .tabs .tab{flex:1;padding:var(--space-md);border:none;background:none;color:var(--fg-2);font-size:var(--text-sm);font-weight:600;cursor:pointer;border-radius:var(--r-sm);transition:all var(--fast)}.login-page .tabs .tab.active{background:var(--bg-hover);color:var(--fg)}.login-page form{display:flex;flex-direction:column;gap:var(--space-lg)}.login-page form input{padding:var(--space-sm) var(--space-md);border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg-raised);color:var(--fg);font-size:var(--text-sm);outline:none;transition:border-color var(--fast),box-shadow var(--fast)}.login-page form input:focus{border-color:var(--accent);box-shadow:var(--glow-soft)}.login-page form input::placeholder{color:var(--fg-3)}.login-page .error{color:var(--fg-danger);font-size:var(--text-sm);text-align:left}.login-page .submit{padding:var(--space-md) var(--space-xl);font-weight:600;font-size:var(--text-base)}.login-page .verify{display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.login-page .verify .icon{font-size:var(--text-4xl);line-height:1}.login-page .verify h2{font-size:var(--text-xl);font-weight:600;color:var(--fg);margin:0}.login-page .verify p{color:var(--fg-2);font-size:var(--text-sm);margin:0;line-height:1.5}.login-page .verify p strong{color:var(--fg)}.login-page .verify input{width:100%;padding:var(--space-sm) var(--space-md);border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg-raised);color:var(--fg);font-size:var(--text-sm);outline:none;transition:border-color var(--fast),box-shadow var(--fast);box-sizing:border-box}.login-page .verify input:focus{border-color:var(--accent);box-shadow:var(--glow-soft)}.login-page .verify input::placeholder{color:var(--fg-3)}.login-page .verify .resend{width:100%;margin-top:var(--space-sm)}.login-page .back{background:none;border:none;color:var(--fg-2);font-size:var(--text-sm);cursor:pointer;padding:var(--space-sm);transition:color var(--fast)}.login-page .back:hover{color:var(--fg)}.login-page .desc{color:var(--fg-2);font-size:var(--text-sm);margin-bottom:var(--space-lg);line-height:1.5}.login-page .forgot{background:none;border:none;color:var(--fg-2);font-size:var(--text-sm);cursor:pointer;padding:0;text-align:center;transition:color var(--fast)}.login-page .forgot:hover{color:var(--fg)}.login-flies{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.login-flies .fly{position:absolute;transform:translate(-50%,-50%)}.login-flies .fly img{display:block;width:100%;height:auto;transform:rotate(-24deg);transform-origin:30% 100%;mix-blend-mode:screen;animation:fly-stream var(--dur, 70s) linear var(--delay, 0s) infinite;will-change:transform}.login-flies .fly-lg img{opacity:.5}.login-flies .fly-sm img{opacity:.4}@media(prefers-reduced-motion:reduce){.login-flies .fly img{animation:none;transform:translate(var(--rx, 0),var(--ry, 0)) rotate(-24deg)}}}@layer components{.navbar{height:var(--navbar-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-sm);background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-bottom:1px solid var(--border);flex-shrink:0;z-index:50}.navbar .left{display:flex;align-items:center;flex:1}.navbar .center{display:flex;align-items:center;justify-content:center}.navbar .logo{font-family:var(--font-logo);font-size:var(--text-lg);font-weight:700;letter-spacing:-.02em;color:var(--accent);cursor:pointer;-webkit-user-select:none;user-select:none;transition:text-shadow var(--fast)}.navbar .logo:hover{text-shadow:var(--glow-soft)}.navbar .logo.wiggling{animation:wiggle .45s ease-in-out}.navbar .right{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-sm);flex:1}.navbar .icon-btn{position:relative}.navbar .badge{position:absolute;top:6px;right:6px;border:2px solid var(--bg)}.navbar .avatar-btn{--size: 32px;cursor:pointer;transition:box-shadow var(--fast)}.navbar .avatar-btn:hover{box-shadow:var(--glow-soft)}.navbar .avatar-btn .letter{font-size:var(--text-sm)}}@layer components{.club-sidebar{width:var(--sidebar-club);background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);display:flex;flex-direction:column;align-items:center;padding:var(--space-md) 0;flex-shrink:0;overflow-y:auto;border-right:1px solid var(--border)}.club-sidebar .list{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);flex:1}.club-sidebar .icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg-raised);color:var(--fg-2);transition:background var(--normal),color var(--normal),box-shadow var(--normal),border-radius var(--normal);overflow:visible;cursor:pointer;flex-shrink:0;position:relative}.club-sidebar .icon:before{content:"";position:absolute;left:-12px;top:50%;width:4px;height:0;border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--fg);transform:translateY(-50%);transition:height var(--fast),background var(--fast);pointer-events:none}.club-sidebar .icon:hover{background:var(--accent);color:var(--accent-fg);box-shadow:var(--glow);border-radius:var(--r-lg)}.club-sidebar .icon:hover:before{height:16px}.club-sidebar .icon:hover img{border-radius:var(--r-lg)}.club-sidebar .icon.active{background:var(--accent);color:var(--accent-fg);box-shadow:var(--glow-strong);border-radius:var(--r-lg);outline:1.5px solid var(--accent);outline-offset:3px}.club-sidebar .icon.active:before{height:24px;background:var(--accent)}.club-sidebar .icon.active img{border-radius:var(--r-lg)}.club-sidebar .icon.home{background:var(--bg-raised);color:var(--accent)}.club-sidebar .icon.home.active{background:var(--bg-raised);color:var(--accent);box-shadow:var(--glow-soft)}.club-sidebar .icon.create{background:var(--bg-raised);color:var(--success)}.club-sidebar .icon.create:before{display:none}.club-sidebar .icon.create:hover{background:var(--success);color:var(--success-fg);box-shadow:var(--glow-success)}.club-sidebar .icon .text{font-size:var(--text-sm);font-weight:600;pointer-events:none}.club-sidebar .icon img{width:100%;height:100%;object-fit:cover;border-radius:50%;transition:border-radius var(--normal)}.club-sidebar .unread-badge{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px;border-radius:var(--r-full);background:var(--danger);border:2px solid var(--bg-surface);pointer-events:none;animation:pop .22s ease-out}.club-sidebar .bottom{display:flex;flex-direction:column;align-items:center;padding-top:var(--space-sm)}.club-sidebar .divider{width:24px;height:2px;background:var(--border);border-radius:1px}@media(max-width:768px){.club-sidebar{position:fixed;bottom:0;left:0;right:0;height:calc(var(--mobile-bar) + env(safe-area-inset-bottom,0px));padding:0 var(--space-lg) env(safe-area-inset-bottom,0px);flex-direction:row;z-index:45;border-right:none;border-top:1px solid var(--border);overflow-x:auto;overflow-y:hidden;width:100%;background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);scrollbar-width:none}.club-sidebar::-webkit-scrollbar{display:none}.club-sidebar .list{flex-direction:row;gap:var(--space-sm)}.club-sidebar .icon{width:40px;height:40px}.club-sidebar .icon:before{display:none}.club-sidebar .divider{width:2px;height:var(--space-xl);margin:0 var(--space-xs)}.club-sidebar .bottom{flex-direction:row;padding-top:0;padding-left:var(--space-md)}}}@layer components{.invite{width:var(--modal-narrow-w);max-width:95vw;max-height:80vh;background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}.invite .header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg) var(--space-lg) 0}.invite .header h2{font-size:var(--text-xl);font-weight:600}.invite .section{padding:var(--space-md) var(--space-lg) 0}.invite .results{margin-top:var(--space-sm);max-height:240px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.invite .result{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm);border-radius:var(--r-md);transition:background var(--fast)}.invite .result:hover{background:var(--bg-raised)}.invite .result .avatar{--size: 32px;font-size:var(--text-xs)}.invite .result .name{flex:1;font-size:var(--text-sm);font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.invite .sent-badge{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--text-xs);color:var(--fg-success);font-weight:500;flex-shrink:0}.invite .searching{padding:var(--space-sm);font-size:var(--text-xs);color:var(--fg-3);text-align:center}.invite .error{margin-top:var(--space-sm);font-size:var(--text-sm);color:var(--fg-danger)}.invite .divider{height:1px;background:var(--border);margin:var(--space-lg) var(--space-lg) 0}.invite .link-section{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg)}.invite .link-section .label{font-size:var(--text-sm);color:var(--fg-3)}.invite .link-section .copy-btn{display:flex;align-items:center;gap:var(--space-xs)}}@layer components{.voice-panel{border-top:1px solid var(--border);padding:var(--space-sm) var(--space-md);display:flex;align-items:center;gap:var(--space-sm);flex-shrink:0}.voice-panel .info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.voice-panel .info .status{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--text-xs);font-weight:600;color:var(--success);line-height:1}.voice-panel .info .status .dot{width:6px;height:6px;border-radius:var(--r-full);background:var(--success);flex-shrink:0}.voice-panel .info .channel{font-size:var(--text-xs);color:var(--fg-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}.voice-panel .controls{display:flex;gap:2px;flex-shrink:0}.voice-panel .controls .icon-btn{--size: 32px}.voice-panel .controls .icon-btn.active{color:var(--fg-danger)}.voice-panel .controls .icon-btn.active:hover{color:var(--fg-danger);background:var(--bg-raised)}.voice-panel .controls .icon-btn.disconnect:hover{color:#fff;background:var(--danger)}@media(max-width:768px){.voice-panel{position:fixed;bottom:calc(var(--mobile-bar) + env(safe-area-inset-bottom,0px));left:0;right:0;z-index:44;background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-top:1px solid var(--border)}}}@layer components{.channel-sidebar{width:var(--sidebar-channel);background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);display:flex;flex-direction:column;flex-shrink:0;border-right:1px solid var(--border)}.channel-sidebar .header{height:var(--navbar-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-lg);border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--fast);position:relative}.channel-sidebar .header:hover{background:var(--bg-surface)}.channel-sidebar .header svg{color:var(--fg-3);flex-shrink:0;transition:transform var(--fast)}.channel-sidebar .header .name{font-weight:600;font-size:var(--text-base);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-sidebar:has(.dropdown) .header svg{transform:rotate(180deg)}.channel-sidebar .dropdown{position:absolute;top:var(--navbar-h);left:var(--space-sm);right:var(--space-sm);background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--space-xs);z-index:50;box-shadow:var(--shadow-md);transform-origin:top;animation:menu-in .12s ease-out}.channel-sidebar .dropdown-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:49}.channel-sidebar .dropdown-item{display:flex;align-items:center;gap:var(--space-sm);width:100%;padding:var(--space-sm) var(--space-md);border-radius:var(--r-sm);font-size:var(--text-sm);color:var(--fg-2);transition:background var(--fast),color var(--fast)}.channel-sidebar .dropdown-item:hover{background:var(--bg-hover);color:var(--fg)}.channel-sidebar .dropdown-item.text-danger{color:var(--fg-danger)}.channel-sidebar .dropdown-item.text-danger:hover{background:var(--danger-soft);color:var(--fg-danger)}.channel-sidebar .list{flex:1;overflow-y:auto;padding:var(--space-sm)}.channel-sidebar .category{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg) var(--space-sm) var(--space-xs);min-width:0}.channel-sidebar .category .label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1;line-height:18px}.channel-sidebar .category .category-actions{display:flex;gap:2px;opacity:0;transition:opacity var(--fast);flex-shrink:0}.channel-sidebar .category:hover .category-actions{opacity:1}.channel-sidebar .category .add{color:var(--fg-3);padding:2px;border-radius:var(--r-sm);display:flex}.channel-sidebar .category .add:hover{color:var(--fg)}.channel-sidebar .category .add.danger-hover:hover{color:var(--danger)}.channel-sidebar .item{display:flex;align-items:center;gap:var(--space-sm);width:100%;height:34px;padding:6px var(--space-sm);border-radius:var(--r-md);color:var(--fg-3);transition:background var(--fast),color var(--fast),box-shadow var(--fast),outline-color var(--fast);font-size:var(--text-base);outline:1.5px solid transparent;outline-offset:-1.5px}.channel-sidebar .item:hover{background:var(--bg-raised);color:var(--fg-2)}.channel-sidebar .item:hover .channel-actions{opacity:1}.channel-sidebar .item.active{background:var(--accent-soft);color:var(--fg);outline-color:var(--accent);box-shadow:var(--glow-soft)}.channel-sidebar .item.active .icon,.channel-sidebar .item.active .channel-actions{opacity:1}.channel-sidebar .item .icon{flex-shrink:0;opacity:.6}.channel-sidebar .item .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-sidebar .item .channel-actions{display:flex;gap:2px;opacity:0;transition:opacity var(--fast);margin-left:auto;flex-shrink:0}.channel-sidebar .item[data-unread] .name{font-weight:600;color:var(--fg)}.channel-sidebar .item[data-unread] .icon{opacity:1}.channel-sidebar .item .channel-action{--size: 24px;border-radius:var(--r-sm);cursor:pointer}.channel-sidebar .item .channel-action:hover{background:var(--bg-float)}.channel-sidebar .item .channel-action.danger:hover{background:var(--danger);color:#fff}.edit-channel-modal{min-width:340px;max-width:400px}@media(max-width:768px){.channel-sidebar{position:fixed;top:var(--navbar-h);left:0;right:0;bottom:calc(var(--mobile-bar) + env(safe-area-inset-bottom,0px));width:100%;z-index:40;background:var(--bg);border-right:none}}.voice-occupants{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-xs) 0 var(--space-sm) 36px}.voice-occupant{display:flex;align-items:center;gap:6px}.occupant-avatar{--size: 18px;font-size:9px;object-fit:cover}.occupant-name{font-size:var(--text-xs);opacity:.75;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer components{.emoji-picker{position:absolute;width:280px;max-height:300px;overflow-y:auto;background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:var(--space-sm);z-index:100;animation:menu-in .12s ease-out}.emoji-picker.up-left{bottom:100%;left:0;margin-bottom:var(--space-xs);transform-origin:bottom left}.emoji-picker.up-right{bottom:100%;right:0;margin-bottom:var(--space-xs);transform-origin:bottom right}.emoji-picker.down-right{top:100%;right:0;margin-top:var(--space-xs);transform-origin:top right}.emoji-picker .label{padding:var(--space-xs) var(--space-xs) 2px;position:sticky;top:0;background:var(--bg-float)}.emoji-picker .grid{display:grid;grid-template-columns:repeat(8,1fr);gap:1px}.emoji-picker .btn{width:32px;height:32px;padding:0;display:flex;align-items:center;justify-content:center;font-size:18px;border-radius:var(--r-md);transition:background var(--fast);cursor:pointer}.emoji-picker .btn:hover{background:var(--bg-hover)}@media(max-width:768px){.emoji-picker{width:260px}}}@layer components{.channel-view{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg-surface)}.channel-view .header{height:var(--navbar-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-lg);border-bottom:1px solid var(--border);flex-shrink:0;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}.channel-view .header .left{display:flex;align-items:center;gap:var(--space-sm)}.channel-view .header .icon{color:var(--fg-3)}.channel-view .header .name{font-weight:600;font-size:var(--text-base)}.messages{flex:1;overflow-y:auto;padding:var(--space-lg) 0}.messages .loading{display:flex;justify-content:center;padding:var(--space-lg)}.messages .list{display:flex;flex-direction:column}.list>.message:last-child{animation:rise .14s ease-out}.channel-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);text-align:center;padding:var(--space-2xl);min-height:100%}.channel-empty .worm-mark{opacity:.9;filter:drop-shadow(var(--glow-soft))}.channel-empty h2{font-family:var(--font-logo);font-size:var(--text-2xl);font-weight:700;color:var(--fg);letter-spacing:-.01em}.channel-empty p{font-size:var(--text-sm);color:var(--fg-3)}.message{display:flex;padding:2px var(--space-lg) 2px 72px;position:relative;transition:background var(--fast)}.message:hover{background:var(--bg-surface)}.message.group-start{margin-top:var(--space-lg);padding-top:var(--space-xs)}.message .avatar{--size: 40px;position:absolute;left:var(--space-lg);top:var(--space-xs);cursor:pointer}.message .content{flex:1;min-width:0}.message header{display:flex;align-items:baseline;gap:var(--space-sm)}.message .author{font-weight:600;font-size:var(--text-base);color:var(--fg);cursor:pointer}.message .author:hover{text-decoration:underline}.message .time{font-size:var(--text-xs);color:var(--fg-3)}.message .text{color:var(--fg-2);word-break:break-word;white-space:pre-wrap;line-height:1.4}.message .text strong{color:var(--fg);font-weight:700}.message .text em{font-style:italic}.message .text s{text-decoration:line-through;opacity:.7}.message .text u{text-decoration:underline;text-underline-offset:2px}.message .text .msg-link{color:var(--accent);text-decoration:none}.message .text .msg-link:hover{text-decoration:underline}.message .text code{font-family:var(--mono);font-size:.85em;background:var(--bg-raised);padding:1px 5px;border-radius:var(--r-sm);color:var(--fg)}.message .text .msg-codeblock{margin:var(--space-xs) 0;padding:var(--space-sm) var(--space-md);background:var(--bg-raised);border-radius:var(--r-md);border:1px solid var(--border);overflow-x:auto;white-space:pre}.message .text .msg-codeblock code{background:none;padding:0;border-radius:0;font-size:var(--text-sm);color:var(--fg-2)}.message .edited{font-size:var(--text-xs);color:var(--fg-3);margin-left:var(--space-xs)}.message .actions{display:none;position:absolute;right:var(--space-lg);top:-12px;background:var(--bg-float);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-radius:var(--r-md);border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow-sm)}.message:hover .actions{display:flex}.message.menu-open .actions{display:flex}.message .reaction-picker-anchor{position:absolute;top:var(--space-lg);right:var(--space-lg);z-index:60}.message .reactions{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-xs)}.message .reactions .reaction{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 var(--space-sm);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-full);color:var(--fg-2);cursor:pointer;transition:background var(--fast),border-color var(--fast),color var(--fast)}.message .reactions .reaction .emoji{font-size:var(--text-sm);line-height:1}.message .reactions .reaction .count{font-size:var(--text-xs);font-weight:600;font-variant-numeric:tabular-nums}.message .reactions .reaction:hover{border-color:var(--fg-3)}.message .reactions .reaction.me{background:var(--accent-soft);border-color:var(--accent);color:var(--fg)}.message .action-btn{padding:var(--space-xs) var(--space-sm);color:var(--fg-3);display:flex;transition:background var(--fast),color var(--fast)}.message .action-btn:hover{background:var(--bg-hover);color:var(--fg)}.message .action-btn.danger:hover{background:var(--danger);color:#fff}.message .edit{margin-top:var(--space-xs)}.message .edit textarea{width:100%;padding:var(--space-sm) var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);color:var(--fg);font-family:var(--font);font-size:var(--text-sm);resize:none;transition:border-color var(--fast),box-shadow var(--fast)}.message .edit textarea:focus{border-color:var(--accent);box-shadow:var(--glow-soft)}.message .edit .hint{font-size:var(--text-xs);color:var(--fg-3)}.message .attachments{margin-top:var(--space-xs);display:flex;flex-wrap:wrap;gap:var(--space-sm)}.message .attachments img{max-width:400px;max-height:300px;border-radius:var(--r-md);cursor:zoom-in}.message .attachments a{display:inline-block;padding:var(--space-sm) var(--space-md);background:var(--bg-surface);border-radius:var(--r-md);border:1px solid var(--border);font-size:var(--text-sm);color:var(--fg-link)}.typing{padding:var(--space-xs) var(--space-lg);font-size:var(--text-xs);color:var(--fg-2);display:flex;align-items:center;gap:var(--space-xs);height:24px}.typing .dots{display:flex;gap:2px}.typing .dots span{width:4px;height:4px;border-radius:var(--r-full);background:var(--fg-2);animation:typingBounce 1.4s infinite ease-in-out}.typing .dots span:nth-child(2){animation-delay:.16s}.typing .dots span:nth-child(3){animation-delay:.32s}@keyframes typingBounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}.send-error{padding:var(--space-xs) var(--space-lg);font-size:var(--text-xs);color:var(--danger)}.pending-files{display:flex;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg) 0;flex-wrap:wrap}.pending-files .file{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);font-size:var(--text-xs);color:var(--fg-2)}.pending-files .file button{color:var(--fg-3);font-size:var(--text-xs)}.msg-input{display:flex;align-items:flex-end;padding:0 var(--space-lg) var(--space-lg);gap:var(--space-sm)}.msg-input .emoji-wrap{position:relative;display:flex}.msg-input .input-wrap{flex:1;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);transition:border-color var(--fast),box-shadow var(--fast)}.msg-input .input-wrap:focus-within{border-color:var(--accent);box-shadow:var(--glow-soft)}.msg-input .format-toolbar{display:flex;gap:2px;padding:var(--space-xs) var(--space-sm);border-bottom:1px solid var(--border)}.msg-input .fmt-btn{--size: 28px;height:24px;border-radius:var(--r-sm)}.msg-input textarea{width:100%;padding:var(--space-sm) var(--space-md);background:transparent;border:none;color:var(--fg);font-family:var(--font);font-size:var(--text-sm);resize:none;max-height:200px;line-height:1.4;overflow-y:hidden}.msg-input textarea::placeholder{color:var(--fg-3)}.msg-input .send{color:var(--accent)}}@layer components{.vc-view{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden;background:var(--bg-surface)}.vc-view .header{height:var(--navbar-h);padding:0 var(--space-sm) 0 var(--space-lg);display:flex;align-items:center;gap:var(--space-sm);border-bottom:1px solid var(--border);flex-shrink:0;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}.vc-view .header .icon{color:var(--fg-3)}.vc-view .header .name{font-weight:600;font-size:var(--text-base);flex:1}.vc-view .header .chat-toggle{width:36px;height:36px;border-radius:var(--r-md);color:var(--fg-3);display:flex;align-items:center;justify-content:center;transition:color var(--fast),background var(--fast);position:relative}.vc-view .header .chat-toggle:hover{color:var(--fg);background:var(--bg-raised)}.vc-view .header .chat-toggle.active{color:var(--fg)}.vc-view .header .chat-toggle .unread-dot{position:absolute;top:4px;right:4px;width:8px;height:8px;border-radius:var(--r-full);background:var(--danger)}.vc-view .main{flex:1;display:flex;min-height:0}.vc-view .col{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.vc-view .join{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg)}.vc-view .join .icon{color:var(--fg-3)}.vc-view .join p{font-size:var(--text-xl);font-weight:600;color:var(--fg-2)}.vc-view .join button{padding:var(--space-sm) var(--space-xl);background:var(--success);color:var(--success-fg);font-weight:600;font-size:var(--text-base);border-radius:var(--r-md);transition:background var(--fast),box-shadow var(--fast)}.vc-view .join button:hover{background:var(--success-hover);box-shadow:var(--glow-success)}.vc-view .chat{width:340px;border-left:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;background:var(--bg-surface)}.vc-view .chat .msgs{flex:1;overflow-y:auto;padding:var(--space-lg) 0}.vc-view .chat .message{padding:2px var(--space-md) 2px 56px}.vc-view .chat .message .avatar{left:var(--space-md);width:32px;height:32px;font-size:var(--text-xs)}.vc-view .chat .message .attachments img{max-width:260px}.vc-view .chat .msg-input{padding:0 var(--space-md) var(--space-md)}@media(max-width:768px){.vc-view .chat{position:fixed;top:var(--navbar-h);left:0;right:0;bottom:calc(var(--mobile-bar) + env(safe-area-inset-bottom,0px));width:100%;z-index:40;background:var(--bg)}}}@layer components{:is(.dm-call-view,.vc-view) .body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:var(--space-md);gap:var(--space-md)}:is(.dm-call-view,.vc-view) .body.has-focus{justify-content:flex-start}:is(.dm-call-view,.vc-view) .grid{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:var(--space-md);width:100%;height:100%}:is(.dm-call-view,.vc-view) .grid .tile{width:var(--tile-w);height:var(--tile-h);aspect-ratio:unset}:is(.dm-call-view,.vc-view) .tile{position:relative;aspect-ratio:16 / 10;border-radius:var(--r-lg);overflow:hidden;background:var(--bg-surface);border:2px solid var(--bg-raised);transition:border-color var(--normal),box-shadow var(--normal);cursor:pointer}:is(.dm-call-view,.vc-view) .tile:hover{border-color:var(--bg-active)}:is(.dm-call-view,.vc-view) .tile.speaking{border-color:var(--success);box-shadow:var(--glow-success)}:is(.dm-call-view,.vc-view) .tile.focused{width:100%;flex:1;min-height:0}:is(.dm-call-view,.vc-view) .tile.screen{border-color:var(--border)}:is(.dm-call-view,.vc-view) .tile.screen.speaking{border-color:var(--success);box-shadow:var(--glow-success)}:is(.dm-call-view,.vc-view) .tile.screen video{object-fit:contain;background:#000}:is(.dm-call-view,.vc-view) .tile video{width:100%;height:100%;object-fit:cover}:is(.dm-call-view,.vc-view) .tile video.mirror{transform:scaleX(-1)}:is(.dm-call-view,.vc-view) .tile .tile-avatar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at center,color-mix(in srgb,var(--accent) 14%,var(--bg)),var(--bg))}:is(.dm-call-view,.vc-view) .tile .tile-avatar span{width:64px;height:64px;border-radius:var(--r-full);background:var(--accent);color:var(--accent-fg);display:flex;align-items:center;justify-content:center;font-size:var(--text-2xl);font-weight:700;overflow:hidden;box-shadow:var(--glow)}:is(.dm-call-view,.vc-view) .tile .tile-avatar span img{width:100%;height:100%;object-fit:cover}:is(.dm-call-view,.vc-view) .tile .bar{position:absolute;bottom:0;left:0;right:0;padding:var(--space-xs) var(--space-sm);background:linear-gradient(transparent,#000000b3);display:flex;align-items:center;gap:var(--space-xs)}:is(.dm-call-view,.vc-view) .tile .bar .name{font-size:var(--text-sm);font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:is(.dm-call-view,.vc-view) .tile .bar .muted{color:var(--fg-danger);flex-shrink:0}:is(.dm-call-view,.vc-view) .strip{display:flex;gap:var(--space-md);overflow-x:auto;flex-shrink:0;max-width:100%;margin:0 auto}:is(.dm-call-view,.vc-view) .strip .tile{width:clamp(120px,15vw,180px);min-width:0;flex-shrink:0;aspect-ratio:16 / 10}:is(.dm-call-view,.vc-view) .strip .tile .tile-avatar span{width:36px;height:36px;font-size:var(--text-sm)}:is(.dm-call-view,.vc-view) .controls{height:64px;display:flex;align-items:center;justify-content:center;gap:var(--space-md);border-top:1px solid var(--border);flex-shrink:0}:is(.dm-call-view,.vc-view) .controls .ctrl-btn{width:44px;height:44px;border-radius:var(--r-full);background:var(--bg-raised);display:flex;align-items:center;justify-content:center;color:var(--fg-2);transition:color var(--fast),background var(--fast)}:is(.dm-call-view,.vc-view) .controls .ctrl-btn:hover{background:var(--bg-active);color:var(--fg)}:is(.dm-call-view,.vc-view) .controls .ctrl-btn.active{background:var(--bg-active);color:var(--fg)}:is(.dm-call-view,.vc-view) .controls .ctrl-btn.disconnect{background:var(--danger);color:#fff}:is(.dm-call-view,.vc-view) .controls .ctrl-btn.disconnect:hover{background:var(--danger-hover)}@media(max-width:768px){:is(.dm-call-view,.vc-view) .controls{height:var(--mobile-bar)}}}@layer components{.member-sidebar{width:var(--sidebar-members);background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);flex-shrink:0;overflow-y:auto;padding:8px;border-left:1px solid var(--border)}.member-sidebar .category{padding:var(--space-sm)}.member-sidebar .item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);border-radius:var(--r-md);transition:background var(--fast);cursor:pointer}.member-sidebar .item:hover{background:var(--bg-raised)}.member-sidebar .item.offline{opacity:.5}.member-sidebar .item .avatar{--size: 32px;font-size:var(--text-xs);position:relative;overflow:visible}.member-sidebar .item .avatar img{border-radius:var(--r-full)}.member-sidebar .item .avatar .dot{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-radius:var(--r-full);border:2px solid color-mix(in srgb,var(--bg) 80%,transparent)}.member-sidebar .item .avatar .dot.online{background:var(--online)}.member-sidebar .item .avatar .dot.idle{background:var(--idle)}.member-sidebar .item .avatar .dot.dnd{background:var(--dnd)}.member-sidebar .item .avatar .dot.offline{background:var(--offline)}.member-sidebar .item .info{overflow:hidden}.member-sidebar .item .name{font-size:var(--text-sm);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:4px}.member-sidebar .item .role-badge{flex-shrink:0}.member-sidebar .item .role-badge-owner{color:gold}.member-sidebar .item .role-badge-admin{color:var(--accent)}}@layer components{.settings{display:flex;width:var(--modal-w);max-width:95vw;height:var(--modal-h);background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg)}.settings .sidebar{width:220px;background:var(--bg-surface);padding:var(--space-lg) var(--space-sm);display:flex;flex-direction:column;gap:2px;flex-shrink:0;border-right:1px solid var(--border)}.settings .sidebar .title{padding:var(--space-sm) var(--space-md)}.settings .sidebar .tab{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--r-md);font-size:var(--text-sm);color:var(--fg-2);transition:background var(--fast),color var(--fast),box-shadow var(--fast);width:100%;text-align:left}.settings .sidebar .tab:hover{background:var(--bg-raised);color:var(--fg)}.settings .sidebar .tab[aria-selected=true]{background:var(--accent-soft);color:var(--fg);box-shadow:var(--glow-soft)}.settings .sidebar .tab.danger{color:var(--fg-danger)}.settings .sidebar .tab.danger:hover{background:var(--danger-soft)}.settings .sidebar .divider{height:1px;background:var(--border);margin:var(--space-sm) var(--space-md)}.settings .content{flex:1;padding:var(--space-xl);overflow-y:auto}.settings .content .header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-xl)}.settings .content .header h2{font-size:var(--text-xl);font-weight:600}.settings .content .section{margin-bottom:var(--space-xl)}.settings .content .section .title{margin-bottom:var(--space-md)}.settings .content .field{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) 0;border-bottom:1px solid var(--border)}.settings .content .field:last-child{border-bottom:none}.settings .content .field .label{font-size:var(--text-sm);color:var(--fg)}.settings .content .field-value{font-size:var(--text-sm);color:var(--fg-2);margin-bottom:var(--space-sm)}.settings .content .row{display:flex;gap:var(--space-sm);align-items:center}.settings .content .row .input{flex:1}.settings .content .stack{display:flex;flex-direction:column;gap:var(--space-sm)}.settings .content .error{font-size:var(--text-xs);color:var(--fg-danger);margin-top:var(--space-xs)}.settings .content .success{font-size:var(--text-xs);color:var(--fg-success);margin-top:var(--space-xs)}.settings .content .actions{display:flex;gap:var(--space-sm);align-items:center;justify-content:flex-end;margin-top:var(--space-sm)}.settings .content .dropdown{position:relative;width:100%}.settings .content .dropdown .trigger{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);font-size:var(--text-sm);color:var(--fg);cursor:pointer;transition:border-color var(--fast),box-shadow var(--fast)}.settings .content .dropdown .trigger:hover{border-color:var(--fg-3)}.settings .content .dropdown .trigger svg{color:var(--fg-3);transition:transform var(--fast),color var(--fast);flex-shrink:0}.settings .content .dropdown.open .trigger{border-color:var(--accent);box-shadow:var(--glow-soft)}.settings .content .dropdown.open .trigger svg{transform:rotate(180deg);color:var(--accent)}.settings .content .dropdown .menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--space-xs);z-index:10;box-shadow:var(--shadow-md);transform-origin:top;animation:menu-in .12s ease-out}.settings .content .dropdown .menu .item{width:100%;text-align:left;padding:var(--space-sm) var(--space-md);border-radius:calc(var(--r-md) - 2px);font-size:var(--text-sm);color:var(--fg-2);cursor:pointer;transition:background var(--fast),color var(--fast)}.settings .content .dropdown .menu .item:hover{background:var(--bg-hover);color:var(--fg)}.settings .content .dropdown .menu .item.active{background:var(--accent-soft);color:var(--fg)}.settings .content .toggle{position:relative;width:40px;height:22px;background:var(--bg-active);border-radius:var(--r-full);cursor:pointer;transition:background var(--fast);flex-shrink:0}.settings .content .toggle.on{background:var(--accent)}.settings .content .toggle:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;background:#fff;border-radius:var(--r-full);transition:transform var(--fast)}.settings .content .toggle.on:after{transform:translate(18px)}.settings .content .theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md)}.settings .content .theme-grid .card{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-md);border:2px solid var(--border);border-radius:var(--r-lg);cursor:pointer;transition:border-color var(--fast),box-shadow var(--fast)}.settings .content .theme-grid .card:hover{border-color:var(--fg-3)}.settings .content .theme-grid .card:hover .swatch{transform:scale(1.08);box-shadow:0 4px 16px #0006}.settings .content .theme-grid .card.active{border-color:var(--accent);box-shadow:var(--glow-soft)}.settings .content .theme-grid .card.active .swatch{transform:scale(1.08);box-shadow:0 4px 16px #0006}.settings .content .theme-grid .card .swatch{width:44px;height:44px;border-radius:var(--r-full);flex-shrink:0;box-shadow:0 2px 8px #0000004d;transition:transform var(--fast),box-shadow var(--fast)}.settings .content .theme-grid .card .label{font-size:var(--text-xs);color:var(--fg-2);text-align:center}.settings .content textarea{width:100%;min-height:120px;padding:var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);font-size:var(--text-sm);color:var(--fg);resize:vertical;transition:border-color var(--fast),box-shadow var(--fast)}.settings .content textarea:focus{border-color:var(--accent);box-shadow:var(--glow-soft)}.settings .content textarea::placeholder{color:var(--fg-3)}.settings .content .danger-zone{padding:var(--space-lg);border:1px solid var(--danger);border-radius:var(--r-lg);background:color-mix(in srgb,var(--danger) 5%,transparent)}.settings .content .danger-zone .title{color:var(--fg-danger)}.settings .content .coming-soon{font-size:var(--text-sm);color:var(--fg-3);padding:var(--space-md) 0}@media(max-width:768px){.settings{flex-direction:column}.settings .sidebar{width:100%;flex-direction:row;align-items:center;overflow-x:auto;border-right:none;border-bottom:1px solid var(--border);padding:var(--space-sm) var(--space-md);gap:var(--space-xs);scrollbar-width:none}.settings .sidebar::-webkit-scrollbar{display:none}.settings .sidebar .title,.settings .sidebar .divider{display:none}.settings .sidebar .tab{white-space:nowrap;flex-shrink:0;padding:var(--space-xs) var(--space-md);border-radius:var(--r-full)}.settings .content{padding:var(--space-lg)}}}@layer components{.dm-sidebar{width:var(--sidebar-channel);background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);display:flex;flex-direction:column;flex-shrink:0;border-right:1px solid var(--border)}.dm-sidebar .header{height:var(--navbar-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-sm) 0 var(--space-lg);border-bottom:1px solid var(--border);flex-shrink:0}.dm-sidebar .header .title{font-weight:600;font-size:var(--text-base)}.dm-sidebar .header .compose{--size: 28px}.dm-sidebar .search{padding:var(--space-sm);border-bottom:1px solid var(--border)}.dm-sidebar .search .results{margin-top:var(--space-xs);max-height:200px;overflow-y:auto}.dm-sidebar .search .result{display:flex;align-items:center;gap:var(--space-sm);width:100%;padding:var(--space-xs) var(--space-sm);border-radius:var(--r-md);transition:background var(--fast)}.dm-sidebar .search .result:hover{background:var(--bg-raised)}.dm-sidebar .search .result .avatar{--size: 28px}.dm-sidebar .search .result .name{font-size:var(--text-sm);font-weight:500}.dm-sidebar .search .loading{padding:var(--space-sm);font-size:var(--text-xs);color:var(--fg-3);text-align:center}.dm-sidebar .list{flex:1;overflow-y:auto;padding:var(--space-xs)}.dm-sidebar .item{display:flex;align-items:center;gap:var(--space-sm);width:100%;padding:var(--space-sm);border-radius:var(--r-md);transition:background var(--fast),outline-color var(--fast),box-shadow var(--fast);outline:1.5px solid transparent;outline-offset:-1.5px}.dm-sidebar .item:hover{background:var(--bg-raised)}.dm-sidebar .item.active{background:var(--accent-soft);outline-color:var(--accent);box-shadow:var(--glow-soft)}.dm-sidebar .item[data-unread] .info .name{font-weight:700;color:var(--fg)}.dm-sidebar .item[data-unread] .info .preview{color:var(--fg-2)}.dm-sidebar .item .avatar{cursor:pointer}.dm-sidebar .item .info{flex:1;min-width:0;text-align:left}.dm-sidebar .item .info .name{font-size:var(--text-sm);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dm-sidebar .item .info .preview{font-size:var(--text-xs);color:var(--fg-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dm-sidebar .item .time{font-size:var(--text-xs);color:var(--fg-3);flex-shrink:0;align-self:flex-start;margin-top:2px}.dm-sidebar .empty-state{gap:var(--space-md)}@media(max-width:768px){.dm-sidebar{position:fixed;top:var(--navbar-h);left:0;right:0;bottom:calc(var(--mobile-bar) + env(safe-area-inset-bottom,0px));width:100%;z-index:40;background:var(--bg);border-right:none}}}@layer components{.dm-call-view{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}}@layer components{.dm-view{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg-surface)}.dm-view .header{height:var(--navbar-h);display:flex;align-items:center;gap:var(--space-sm);padding:0 var(--space-sm) 0 var(--space-lg);border-bottom:1px solid var(--border);flex-shrink:0;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}.dm-view .header .name{font-weight:600;font-size:var(--text-base);flex:1}.dm-view .header .call-btn{width:36px;height:36px;border-radius:var(--r-md);color:var(--fg-3);display:flex;align-items:center;justify-content:center;transition:color var(--fast),background var(--fast)}.dm-view .header .call-btn:hover:not(:disabled){color:var(--fg);background:var(--bg-raised)}.dm-view .header .call-btn:disabled{opacity:.4;cursor:not-allowed}.dm-view .calling{padding:var(--space-md) var(--space-lg);color:var(--fg-3);font-size:var(--text-sm);text-align:center}}@layer components{.profile{position:relative;width:var(--modal-w);max-width:95vw;height:var(--modal-h);background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-xl);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow-lg),var(--glow-soft)}.profile .banner{height:220px;flex-shrink:0;background:linear-gradient(135deg,var(--accent-soft) 0%,rgba(255,255,255,.02) 50%,var(--accent-soft) 100%);background-size:cover;background-position:center;position:relative}.profile .banner:after{content:"";position:absolute;bottom:0;left:0;right:0;height:100px;background:linear-gradient(to bottom,transparent,var(--bg-float));pointer-events:none}.profile .banner .upload-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-xs);background:var(--scrim);color:#fff;font-size:var(--text-sm);opacity:0;transition:opacity var(--fast);cursor:pointer;z-index:1}.profile .banner:hover .upload-overlay{opacity:1}.profile .banner .banner-actions{display:flex;gap:var(--space-lg)}.profile .banner .banner-actions button{display:flex;align-items:center;gap:var(--space-xs);background:transparent;border:none;color:#fff;font-size:var(--text-sm);cursor:pointer;padding:var(--space-xs) var(--space-sm);border-radius:var(--r-sm);transition:background var(--fast)}.profile .banner .banner-actions button:hover{background:#ffffff26}.profile .avatar-section{display:flex;justify-content:center;margin-top:-60px;position:relative;z-index:2}.profile .avatar-lg{width:140px;height:140px;border-radius:var(--r-full);background:var(--accent);display:flex;align-items:center;justify-content:center;color:var(--accent-fg);font-size:3.2rem;font-weight:700;border:4px solid var(--accent);overflow:hidden;flex-shrink:0;position:relative;box-shadow:var(--glow-strong),0 8px 32px #00000080;transition:all var(--normal)}.profile .avatar-lg img{width:100%;height:100%;object-fit:cover}.profile .avatar-lg .avatar-upload{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--scrim);color:#fff;opacity:0;transition:opacity var(--fast);cursor:pointer;border-radius:var(--r-full)}.profile .avatar-lg:hover .avatar-upload{opacity:1}.profile .avatar-lg:hover{box-shadow:var(--glow-strong),0 0 40px #0009;transform:scale(1.03)}.profile .avatar-remove{position:absolute;bottom:0;left:50%;transform:translate(30px);width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-full);background:var(--bg-raised);border:2px solid var(--border);color:var(--fg-3);cursor:pointer;z-index:3;transition:all var(--fast)}.profile .avatar-remove:hover{color:var(--danger);border-color:var(--danger);background:var(--danger-soft)}.profile .hero{display:flex;flex-direction:column;align-items:center;padding:var(--space-lg) var(--space-xl) var(--space-md);text-align:center;position:relative;flex-shrink:0}.profile .hero h2{font-family:var(--font-logo);font-size:2.2rem;font-weight:700;line-height:1.2;max-width:600px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-bottom:4px;border-bottom:1px solid transparent}.profile .edit-name{font-family:var(--font-logo);font-size:2.2rem;font-weight:700;line-height:1.2;text-align:center;background:transparent;border:none;border-bottom:1px solid var(--border);color:var(--fg);width:600px;max-width:90%;padding:0 0 4px;outline:none;transition:border-color var(--fast)}.profile .edit-name:focus{border-color:var(--accent)}.profile .edit-name::placeholder{color:var(--fg-3)}.profile .status{display:inline-flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-lg);padding:3px var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-full);box-shadow:0 2px 12px #0003,var(--glow-soft);min-height:40px;transition:border-color var(--fast)}.profile .status:has(.emoji),.profile .status:has(.emoji-wrap){padding-left:3px}.profile .status:has(.status-input){width:600px;max-width:90%}.profile .status:focus-within{border-color:var(--accent)}.profile .status .emoji{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-full);background:var(--accent-soft);font-size:1.1rem;flex-shrink:0}.profile .status .text{font-size:var(--text-sm);color:var(--fg);max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 var(--space-xs)}.profile .status .emoji-wrap{position:relative;flex-shrink:0}.profile .status .emoji-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-full);background:var(--accent-soft);cursor:pointer;font-size:1.1rem;border:none;transition:all var(--fast)}.profile .status .emoji-btn:hover{background:var(--accent)}.profile .status .emoji-btn.empty{color:var(--fg-3)}.profile .status .status-input{background:transparent;border:none;color:var(--fg);font-size:var(--text-sm);outline:none;flex:1;min-width:0;padding:0 var(--space-xs)}.profile .status .status-input::placeholder{color:var(--fg-3)}.profile .status .status-clear{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-full);color:var(--fg-3);background:transparent;flex-shrink:0;transition:all var(--fast)}.profile .status .status-clear:hover{color:var(--danger);background:var(--danger-soft)}.profile .meta{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);margin-top:var(--space-lg);width:600px;max-width:90%}.profile .meta-field{display:inline-flex;align-items:center;gap:4px;color:var(--fg-3)}.profile .meta-field:has(input){flex:1;min-width:0}.profile .meta-field svg{flex-shrink:0;opacity:.7}.profile .meta-field span{padding:2px 0;border-bottom:1px solid transparent;font-size:var(--text-xs);color:var(--fg-3);max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile .meta-field a{padding:2px 0;border-bottom:1px solid transparent;font-size:var(--text-xs);color:var(--accent);text-decoration:none;max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity var(--fast)}.profile .meta-field a:hover{opacity:.8}.profile .meta-field input{background:transparent;border:none;border-bottom:1px solid var(--border);color:var(--fg-3);font-size:var(--text-xs);outline:none;width:100%;padding:2px 0;transition:border-color var(--fast),color var(--fast)}.profile .meta-field input:focus{border-color:var(--accent);color:var(--fg)}.profile .meta-field input::placeholder{color:var(--fg-3);opacity:.5}.profile .meta-dot{color:var(--fg-3);font-size:var(--text-xs);opacity:.5}.profile .body{display:flex;flex-direction:column;align-items:center;gap:var(--space-xl);padding:var(--space-md) var(--space-xl) var(--space-xl);flex:1;overflow-y:auto;min-height:0}.profile .bio-text{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-xl);padding:var(--space-md) var(--space-lg);font-size:var(--text-sm);color:var(--fg-2);line-height:1.6;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;text-align:center;box-shadow:0 2px 12px #0003,var(--glow-soft);max-width:600px}.profile .bio-wrap{position:relative;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-xl);padding:var(--space-md) var(--space-lg);box-shadow:0 2px 12px #0003,var(--glow-soft);width:600px;max-width:100%;transition:border-color var(--fast)}.profile .bio-wrap:focus-within{border-color:var(--accent)}.profile .bio-edit{display:block;background:transparent;border:none;font-size:var(--text-sm);color:var(--fg-2);line-height:1.6;width:100%;min-height:1.6em;max-height:200px;overflow-y:auto;font-family:var(--font);resize:none;outline:none;text-align:center;padding-bottom:var(--space-lg)}.profile .bio-edit::placeholder{color:var(--fg-3)}.profile .bio-counter{position:absolute;bottom:var(--space-sm);right:var(--space-md);font-size:var(--text-xs);color:var(--fg-3);pointer-events:none}.profile .connections-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-sm);max-width:600px}.profile .connections-grid .badge{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-full);font-size:var(--text-xs);color:var(--fg-2);text-decoration:none;transition:all var(--fast);border-color:color-mix(in srgb,var(--brand) 16%,transparent)}.profile .connections-grid .badge:hover{transform:translateY(-2px);box-shadow:0 4px 16px #0000004d}.profile .connections-grid .badge span{max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile .connections-grid .badge.github{--brand: #e6edf3}.profile .connections-grid .badge.x{--brand: #1da1f2}.profile .connections-grid .badge.instagram{--brand: #e1306c}.profile .connections-grid .badge.youtube{--brand: #ff4444}.profile .connections-grid .badge.tiktok{--brand: #00f2ea}.profile .connections-grid .badge.linkedin{--brand: #0a66c2}.profile .connections-grid .badge.facebook{--brand: #1877f2}.profile .connections-grid .badge.threads{--brand: #e6edf3}.profile .connections-grid .badge.telegram{--brand: #26a5e4}.profile .connections-grid .badge.snapchat{--brand: #fffc00}.profile .connections-grid .badge.pinterest{--brand: #e60023}.profile .connections-grid .badge.dribbble{--brand: #ea4c89}.profile .connections-grid .badge.medium{--brand: #e6edf3}.profile .connections-grid .badge.stackoverflow{--brand: #f48024}.profile .connections-grid .badge:hover{background:color-mix(in srgb,var(--brand) 14%,transparent);border-color:color-mix(in srgb,var(--brand) 32%,transparent);color:var(--brand)}.profile .socials-edit{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-sm);max-width:600px}.profile .social-pill{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 4px 0 var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-full);color:var(--fg-2);transition:border-color var(--fast)}.profile .social-pill:focus-within{border-color:var(--accent)}.profile .social-pill input{background:transparent;border:none;color:var(--fg);font-size:var(--text-xs);outline:none;width:80px;padding:0}.profile .social-pill input::placeholder{color:var(--fg-3)}.profile .social-remove{width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-full);color:var(--fg-3);transition:all var(--fast);flex-shrink:0}.profile .social-remove:hover{color:var(--danger);background:var(--danger-soft)}.profile .social-add-wrap{position:relative}.profile .social-add-btn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 var(--space-md);border:1px dashed var(--border);border-radius:var(--r-full);color:var(--fg-3);font-size:var(--text-xs);background:transparent;transition:all var(--fast)}.profile .social-add-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.profile .social-picker{position:absolute;bottom:100%;left:50%;transform:translate(-50%);width:200px;margin-bottom:4px;background:var(--bg-float);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--space-xs);max-height:200px;overflow-y:auto;z-index:20;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:2px}.profile .social-picker-item{display:flex;align-items:center;gap:var(--space-sm);padding:6px var(--space-sm);border-radius:var(--r-sm);color:var(--fg-2);font-size:var(--text-xs);transition:all var(--fast);background:transparent;width:100%;text-align:left}.profile .social-picker-item:hover{background:var(--accent-soft);color:var(--fg)}.profile .actions{display:flex;justify-content:center;gap:var(--space-sm);margin-top:auto}.profile .profile-footer{flex-shrink:0;text-align:center;padding:var(--space-md) var(--space-xl);font-size:var(--text-xs);color:var(--fg-3);opacity:.5;border-top:1px solid var(--border)}.profile .profile-actions{position:absolute;top:calc(220px + var(--space-md));right:var(--space-md);z-index:10;display:flex;gap:var(--space-xs)}.profile .profile-action.accent{color:var(--accent)}.profile .profile-action.accent:hover{color:var(--accent-fg);background:var(--accent)}@media(max-width:768px){.profile{width:100vw;height:100vh;max-width:100vw;border-radius:0}.profile .banner{height:140px}.profile .avatar-section{margin-top:-50px}.profile .avatar-lg{width:100px;height:100px;font-size:2.2rem}.profile .hero{padding:var(--space-md)}.profile .hero h2{font-size:1.5rem}.profile .hero .status .text{max-width:180px}.profile .profile-actions{top:calc(140px + var(--space-md))}.profile .edit-name{font-size:1.5rem;width:280px}.profile .meta{flex-direction:column;gap:var(--space-xs);width:280px}.profile .meta .meta-dot{display:none}.profile .body{padding:var(--space-md)}.profile .social-picker{max-height:150px}}}@layer components{.friends{width:var(--modal-narrow-w);max-width:95vw;max-height:80vh;background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}.friends .header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg) var(--space-lg) 0}.friends .header h2{font-size:var(--text-xl);font-weight:600}.friends .tabs{display:flex;gap:var(--space-xs);padding:var(--space-md) var(--space-lg)}.friends .tabs .tab{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);border-radius:var(--r-md);font-size:var(--text-sm);font-weight:500;color:var(--fg-2);transition:background var(--fast),color var(--fast)}.friends .tabs .tab:hover{background:var(--bg-raised);color:var(--fg)}.friends .tabs .tab[aria-selected=true]{background:var(--accent-soft);color:var(--fg);box-shadow:var(--glow-soft)}.friends .tabs .tab .badge{background:var(--danger);color:#fff;font-size:var(--text-xs);padding:0 6px;border-radius:var(--r-full);font-weight:600;min-width:18px;text-align:center;line-height:18px}.friends .content{flex:1;overflow-y:auto;padding:0 var(--space-lg) var(--space-lg)}.friends .list{display:flex;flex-direction:column;gap:2px}.friends .section-label{padding:var(--space-md) var(--space-sm) var(--space-xs)}.friends .item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm);border-radius:var(--r-md);transition:background var(--fast)}.friends .item:hover{background:var(--bg-raised)}.friends .item .info{flex:1;min-width:0}.friends .item .name{display:block;font-size:var(--text-sm);font-weight:500}.friends .item .actions{display:flex;gap:var(--space-xs);flex-shrink:0}.friends .item .action-btn{--size: 32px;background:var(--bg-raised);color:var(--fg-2)}.friends .item .action-btn:hover{background:var(--bg-hover);color:var(--fg)}.friends .item .action-btn.accept{color:var(--success)}.friends .item .action-btn.accept:hover{background:#22c55e26}.friends .item .action-btn.danger:hover{background:var(--danger-soft);color:var(--fg-danger)}.friends .add-form{padding:var(--space-md) 0}.friends .add-form .desc{font-size:var(--text-sm);color:var(--fg-2);margin-bottom:var(--space-md)}.friends .add-form .row{display:flex;gap:var(--space-sm)}.friends .add-form .search-field{flex:1;padding:var(--space-sm) var(--space-md)}.friends .add-form .input{padding:0;background:none;border:none;outline:none}.friends .add-form .input:focus{box-shadow:none}.friends .add-form .error{margin-top:var(--space-sm);font-size:var(--text-sm);color:var(--fg-danger)}.friends .add-form .success{margin-top:var(--space-sm);font-size:var(--text-sm);color:var(--fg-success)}}@layer components{.profile.create-profile{width:var(--modal-narrow-w);height:auto}.profile.create-profile .banner{height:140px}.profile.create-profile .banner:after{height:60px}.profile.create-profile .avatar-section{margin-top:-50px}.profile.create-profile .avatar-lg{width:100px;height:100px;font-size:2.4rem;cursor:pointer}.profile.create-profile .edit-name{width:100%;max-width:380px;font-size:2.2rem}.profile.create-profile .status.status{margin-top:0;width:100%;max-width:380px}.profile.create-profile .bio-wrap{width:100%;max-width:380px}.profile.create-profile .bio-edit{max-height:120px}.profile.create-profile .meta-field{display:flex;width:100%;max-width:380px}.profile.create-profile .cp-form{display:flex;flex-direction:column;align-items:center;padding:var(--space-lg) var(--space-xl) var(--space-xl);gap:var(--space-md)}.profile.create-profile .cp-finish{width:100%;max-width:380px;height:44px;font-weight:600;margin-top:var(--space-sm)}.profile.create-profile .cp-skip{background:transparent;border:none;color:var(--fg-3);font-size:var(--text-xs);cursor:pointer;padding:var(--space-xs) var(--space-md);transition:color var(--fast)}.profile.create-profile .cp-skip:hover{color:var(--fg-2)}@media(max-width:768px){.profile.create-profile{width:100vw;max-width:100vw;border-radius:0;height:100vh}.profile.create-profile .cp-form{padding:var(--space-md)}}}@layer components{.club-members-modal{min-width:500px;max-width:600px;max-height:80vh;display:flex;flex-direction:column}.club-members-modal .tabs{display:flex;gap:var(--space-sm);margin-bottom:var(--space-lg)}.club-members-modal .tab{padding:var(--space-xs) var(--space-md);border-radius:var(--r-md);font-size:var(--text-sm);font-weight:500;color:var(--fg-3);transition:background var(--fast),color var(--fast)}.club-members-modal .tab:hover{color:var(--fg-2)}.club-members-modal .tab[aria-selected=true]{background:var(--accent-soft);color:var(--fg);box-shadow:var(--glow-soft)}.club-members-modal .member-list{flex:1;overflow-y:auto;max-height:50vh}.club-members-modal .group-label{padding:var(--space-sm) 0}.club-members-modal .member-row{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) 0}.club-members-modal .member-row .member-info{flex:1;overflow:hidden}.club-members-modal .member-row .member-name{font-size:var(--text-sm);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.club-members-modal .member-row .member-joined{font-size:var(--text-xs);color:var(--fg-3)}.club-members-modal .member-row .member-actions{display:flex;gap:var(--space-xs)}.club-members-modal .ban-row{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) 0}.club-members-modal .ban-row .ban-info{flex:1;overflow:hidden}.club-members-modal .ban-row .ban-name{font-size:var(--text-sm);font-weight:500}.club-members-modal .ban-row .ban-reason{font-size:var(--text-xs);color:var(--fg-3)}.club-members-modal .inline-badge{display:inline-block;vertical-align:middle;margin-left:4px}.club-members-modal .empty-state{padding:var(--space-xl) 0}@media(max-width:768px){.club-members-modal{min-width:auto;max-width:100%}}}@layer components{.edit-club-modal .icon-upload{width:80px;height:80px;border-radius:var(--r-full);background:var(--bg-raised);border:2px dashed var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;margin:0 auto var(--space-lg);overflow:hidden;transition:border-color var(--fast);color:var(--fg-3);font-size:var(--text-lg);font-weight:600}.edit-club-modal .icon-upload:hover{border-color:var(--accent)}.edit-club-modal .icon-upload img{width:100%;height:100%;object-fit:cover}.edit-club-modal .slug-row{display:flex;align-items:center;gap:0;margin-bottom:var(--space-lg)}.edit-club-modal .slug-row .slug-prefix{font-size:var(--text-xs);color:var(--fg-3);padding:var(--space-sm) var(--space-sm) var(--space-sm) var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-right:none;border-radius:var(--r-md) 0 0 var(--r-md);white-space:nowrap;line-height:1.5}.edit-club-modal .slug-row .slug-input{flex:1;padding:var(--space-sm) var(--space-md);background:var(--bg-raised);border:1px solid var(--border);border-radius:0 var(--r-md) var(--r-md) 0;color:var(--fg);font-size:var(--text-sm);margin-bottom:0;transition:border-color var(--fast),box-shadow var(--fast)}.edit-club-modal .slug-row .slug-input:focus{border-color:var(--accent);box-shadow:var(--glow-soft)}.edit-club-modal .field-label{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--fg-3);margin-bottom:var(--space-xs)}}@layer components{.create-channel-modal .type-tabs{display:flex;gap:var(--space-xs);margin-bottom:var(--space-lg);background:var(--bg-surface);border-radius:var(--r-md);padding:3px}.create-channel-modal .type-tab{flex:1;padding:var(--space-md);border:none;background:none;color:var(--fg-2);font-size:var(--text-sm);font-weight:600;cursor:pointer;border-radius:var(--r-sm);transition:all var(--fast)}.create-channel-modal .type-tab.active{background:var(--bg-hover);color:var(--fg)}}@layer components{.incoming-call-overlay{position:fixed;top:0;right:0;z-index:9999;padding:var(--space-lg);pointer-events:none}.incoming-call-overlay .incoming-call{pointer-events:auto;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--space-xl);display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);min-width:240px;box-shadow:0 8px 32px #0006;animation:slide-in .2s ease-out}.incoming-call-overlay .caller-info{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm)}.incoming-call-overlay .caller-avatar{--size: 64px;object-fit:cover}.incoming-call-overlay .caller-avatar.placeholder{background:var(--bg-hover)}.incoming-call-overlay .caller-avatar.placeholder span{font-size:var(--text-2xl);font-weight:700;color:var(--fg)}.incoming-call-overlay .caller-name{font-weight:600;font-size:var(--text-base);color:var(--fg)}.incoming-call-overlay .caller-label{font-size:var(--text-sm);color:var(--fg-3)}.incoming-call-overlay .call-actions{display:flex;gap:var(--space-lg)}.incoming-call-overlay .call-btn{width:48px;height:48px;border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;color:#fff;transition:opacity var(--fast)}.incoming-call-overlay .call-btn:hover{opacity:.85}.incoming-call-overlay .call-btn.accept{background:var(--success);color:var(--success-fg)}.incoming-call-overlay .call-btn.reject{background:var(--danger)}@keyframes slide-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.incoming-call-overlay{left:0;right:0;display:flex;justify-content:center}.incoming-call-overlay .incoming-call{min-width:auto;max-width:320px}}}@layer components{.outgoing-call-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:var(--bg-overlay);backdrop-filter:var(--blur-light);-webkit-backdrop-filter:var(--blur-light)}.outgoing-call-overlay .outgoing-call{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--space-2xl) var(--space-3xl);display:flex;flex-direction:column;align-items:center;gap:var(--space-xl);min-width:280px;box-shadow:0 8px 32px #0006;animation:fade-in .2s ease-out}.outgoing-call-overlay .caller-info{display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.outgoing-call-overlay .caller-avatar{--size: 80px;object-fit:cover;animation:pulse-ring 2s ease-in-out infinite}.outgoing-call-overlay .caller-avatar.placeholder{background:var(--bg-hover)}.outgoing-call-overlay .caller-avatar.placeholder span{font-size:var(--text-3xl);font-weight:700;color:var(--fg)}.outgoing-call-overlay .caller-name{font-weight:600;font-size:var(--text-lg);color:var(--fg)}.outgoing-call-overlay .caller-label{font-size:var(--text-sm);color:var(--fg-3);text-align:center}.outgoing-call-overlay .call-actions{display:flex;gap:var(--space-lg)}.outgoing-call-overlay .call-btn{width:52px;height:52px;border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;color:#fff;transition:opacity var(--fast)}.outgoing-call-overlay .call-btn:hover{opacity:.85}.outgoing-call-overlay .call-btn.reject{background:var(--danger)}@keyframes fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse-ring{0%,to{box-shadow:0 0 #ffffff1a}50%{box-shadow:0 0 0 12px #fff0}}}@layer components{.main-layout{display:flex;flex-direction:column;height:100%;overflow:hidden}.main-layout>.content{display:flex;flex:1;overflow:hidden}.main-layout>.content>.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--fg-3);gap:var(--space-md);background:var(--bg-surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);text-align:center;padding:var(--space-xl)}.main-layout>.content>.empty .worm-mark{opacity:.9;filter:drop-shadow(var(--glow-soft))}.main-layout>.content>.empty h2{font-family:var(--font-logo);font-size:var(--text-2xl);font-weight:700;color:var(--fg);letter-spacing:-.01em}.main-layout>.content>.empty p{font-size:var(--text-sm);color:var(--fg-3);line-height:1.5}.loading-screen{display:flex;align-items:center;justify-content:center;height:100%;background:var(--bg)}.loading-brand{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg)}.loading-brand .worm-mark{filter:drop-shadow(var(--glow))}.loading-brand .wordmark{font-family:var(--font-logo);font-size:var(--text-2xl);font-weight:700;color:var(--accent);letter-spacing:-.02em}.breathing{animation:breathe 2.4s ease-in-out infinite}.loading-spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:var(--r-full);animation:spin .8s linear infinite;box-shadow:var(--glow-soft)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{0%,to{transform:scale(1);opacity:.85}50%{transform:scale(1.06);opacity:1}}@media(max-width:768px){.main-layout>.content{padding-bottom:calc(var(--mobile-bar) + env(safe-area-inset-bottom,0px))}}}@layer components{.toaster{position:fixed;bottom:calc(var(--space-xl) + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);display:flex;flex-direction:column-reverse;align-items:center;gap:var(--space-sm);z-index:200;pointer-events:none}.toast{pointer-events:auto;display:flex;align-items:center;gap:var(--space-sm);max-width:min(90vw,420px);padding:var(--space-sm) var(--space-lg);background:var(--bg-float);backdrop-filter:var(--blur-heavy);-webkit-backdrop-filter:var(--blur-heavy);border:1px solid var(--border);border-radius:var(--r-full);box-shadow:var(--shadow-md);font-size:var(--text-sm);color:var(--fg);cursor:pointer;animation:toast-in .2s ease-out}.toast .dot{width:6px;height:6px;border-radius:var(--r-full);background:var(--fg-3);flex-shrink:0}.toast .msg{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast.success{border-color:color-mix(in srgb,var(--success) 45%,var(--border))}.toast.success .dot{background:var(--success);box-shadow:var(--glow-success)}.toast.error{border-color:color-mix(in srgb,var(--danger) 50%,var(--border))}.toast.error .dot{background:var(--danger)}.toast.info .dot{background:var(--accent)}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.toaster{bottom:calc(var(--mobile-bar) + var(--space-md) + env(safe-area-inset-bottom,0px))}}}@layer components{.lightbox-overlay{z-index:300;background:#000000d9;cursor:zoom-out}.lightbox{max-width:92vw;max-height:92vh;display:flex}.lightbox img{max-width:92vw;max-height:92vh;border-radius:var(--r-md);box-shadow:var(--shadow-lg);cursor:zoom-out;animation:lightbox-in .18s ease-out}@keyframes lightbox-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}}