:root{--void: #13111c;--nebula-deep: #1a1726;--nebula: #1e1b2e;--nebula-light: #262336;--cloud-dark: #322e45;--cloud: #433e5a;--mist: #5c5678;--haze: #7a7394;--soft: #9d97b5;--pearl: #c4bfd6;--snow: #e8e4f0;--white: #f8f6fc;--lavender: #b4a7d6;--lavender-soft: rgba(180, 167, 214, .15);--lavender-glow: rgba(180, 167, 214, .25);--pink: #e8b4bc;--pink-soft: rgba(232, 180, 188, .15);--pink-glow: rgba(232, 180, 188, .25);--mint: #a8e6cf;--mint-soft: rgba(168, 230, 207, .15);--mint-glow: rgba(168, 230, 207, .3);--peach: #ffd3b6;--peach-soft: rgba(255, 211, 182, .15);--peach-glow: rgba(255, 211, 182, .3);--sky: #a7c5eb;--sky-soft: rgba(167, 197, 235, .15);--sky-glow: rgba(167, 197, 235, .25);--coral: #f4a4a4;--coral-soft: rgba(244, 164, 164, .15);--coral-glow: rgba(244, 164, 164, .3);--accent: var(--lavender);--success: var(--mint);--warning: var(--peach);--danger: var(--coral);--info: var(--sky);--font-sans: "DM Sans", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--font-mono: "Inconsolata", "Consolas", monospace;--space-2xs: .125rem;--space-xs: .25rem;--space-sm: .5rem;--space-md: .75rem;--space-lg: 1rem;--space-xl: 1.25rem;--space-2xl: 1.75rem;--space-3xl: 2.5rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(19, 17, 28, .3);--shadow-md: 0 4px 16px rgba(19, 17, 28, .4);--shadow-lg: 0 8px 32px rgba(19, 17, 28, .5);--shadow-glow-lavender: 0 0 20px var(--lavender-glow);--shadow-glow-mint: 0 0 16px var(--mint-glow);--shadow-glow-pink: 0 0 16px var(--pink-glow);--ease-soft: cubic-bezier(.4, 0, .2, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--sidebar-width: 260px;--member-list-width: 240px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:var(--font-sans);font-weight:400;font-size:15px;background:var(--nebula);color:var(--pearl);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 120% 80% at 10% 20%,rgba(180,167,214,.08) 0%,transparent 50%),radial-gradient(ellipse 100% 60% at 90% 80%,rgba(232,180,188,.06) 0%,transparent 45%),radial-gradient(ellipse 80% 50% at 50% 50%,rgba(168,230,207,.04) 0%,transparent 50%);pointer-events:none;z-index:-1}h1,h2,h3,h4,h5,h6{font-family:var(--font-sans);font-weight:600;color:var(--snow);letter-spacing:-.01em}a{color:var(--lavender);text-decoration:none;transition:color .2s var(--ease-soft)}a:hover{color:var(--snow)}button{font-family:var(--font-sans);font-size:.875rem;font-weight:500;cursor:pointer;border:none;padding:var(--space-sm) var(--space-xl);border-radius:var(--radius-full);background:linear-gradient(135deg,var(--lavender) 0%,#9d8ec9 100%);color:var(--void);transition:all .25s var(--ease-soft);box-shadow:0 2px 8px var(--lavender-glow)}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 16px var(--lavender-glow)}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed}input,select{font-family:var(--font-sans);font-size:.9rem;border:1.5px solid var(--cloud-dark);background:var(--nebula-deep);color:var(--pearl);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-lg);outline:none;transition:all .2s var(--ease-soft)}input:focus,select:focus{border-color:var(--lavender);box-shadow:0 0 0 3px var(--lavender-soft)}input::placeholder{color:var(--mist)}select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;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='%237a7394' d='M6 8L2 4h8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .875rem center;padding-right:2.25rem}select option{background:var(--nebula);color:var(--pearl)}.app-root{height:100%;display:flex;flex-direction:column;animation:softFadeIn .5s var(--ease-soft)}@keyframes softFadeIn{0%{opacity:0}to{opacity:1}}.chat-view{display:flex;height:100%;gap:var(--space-lg);padding:var(--space-lg);isolation:isolate}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--nebula-deep);border:1px solid var(--cloud-dark);border-radius:var(--radius-xl);overflow:hidden;position:relative;z-index:1}.channel-list{width:var(--sidebar-width);background:linear-gradient(180deg,var(--nebula-light) 0%,var(--nebula) 100%);border:1px solid var(--cloud-dark);border-radius:var(--radius-xl);padding:var(--space-xl);flex-shrink:0;display:flex;flex-direction:column;overflow-y:auto;position:relative;z-index:10}.channel-list h3{font-size:1.1rem;font-weight:700;color:var(--snow);margin-bottom:var(--space-xl);letter-spacing:-.02em}.channel-groups{display:flex;flex-direction:column;gap:var(--space-xl)}.channel-group{display:flex;flex-direction:column;gap:var(--space-sm)}.channel-group-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);padding:0 var(--space-xs);margin-bottom:var(--space-xs)}.channel-group-heading{font-family:var(--font-mono);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--mist)}.channel-group-add{width:1.5rem;height:1.5rem;padding:0;background:transparent;border:1.5px solid var(--cloud);color:var(--mist);display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);box-shadow:none;transition:all .2s var(--ease-soft)}.channel-group-add:hover:not(:disabled){color:var(--lavender);border-color:var(--lavender);background:var(--lavender-soft);transform:none;box-shadow:none}.channel-group-add:disabled{opacity:.4}.channel-group-add-icon{width:.75rem;height:.75rem}.channel-group-empty{font-size:.8rem;color:var(--mist);font-style:italic;padding:var(--space-sm) var(--space-md)}.channel-items{list-style:none;display:flex;flex-direction:column;gap:var(--space-2xs)}.channel-row{display:flex;flex-direction:column;gap:var(--space-xs)}.channel-row-main{display:flex;align-items:center;gap:var(--space-xs)}.channel-item{flex:1;display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);background:transparent;border:none;color:var(--soft);font-family:var(--font-sans);font-size:.9rem;font-weight:500;text-align:left;box-shadow:none;transition:all .2s var(--ease-soft)}.channel-item:hover{background:var(--lavender-soft);color:var(--snow);transform:none}.channel-item.is-active{background:linear-gradient(135deg,var(--lavender-soft) 0%,rgba(180,167,214,.22) 100%);color:var(--snow);box-shadow:inset 0 0 0 1px var(--lavender-glow)}.channel-item.is-voice-connected{background:var(--mint-soft);box-shadow:inset 0 0 0 1px var(--mint-glow);color:var(--snow)}.channel-prefix{font-family:var(--font-mono);font-weight:500;color:var(--lavender);font-size:1rem;opacity:.8}.channel-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-badge{min-width:1.25rem;height:1.25rem;border-radius:var(--radius-full);padding:0 var(--space-sm);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.65rem;font-weight:600;color:var(--void);background:linear-gradient(135deg,var(--peach) 0%,#f5c4a1 100%);box-shadow:0 2px 8px var(--peach-glow)}.channel-badge.is-pulsing{animation:softPop .35s var(--ease-bounce)}@keyframes softPop{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.channel-delete{width:1.5rem;height:1.5rem;padding:0;background:transparent;border:none;color:var(--mist);font-size:.85rem;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;opacity:0;box-shadow:none;transition:all .15s var(--ease-soft)}.channel-row-main:hover .channel-delete{opacity:1}.channel-delete:hover:not(:disabled){color:var(--coral);background:var(--coral-soft);transform:none}.channel-voice-members{list-style:none;margin-left:var(--space-2xl);display:flex;flex-direction:column;gap:var(--space-2xs);padding:var(--space-xs) 0}.channel-voice-member{display:flex;align-items:center;gap:var(--space-sm);font-size:.8rem;color:var(--soft);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm)}.channel-voice-member-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--cloud);flex-shrink:0;transition:all .2s var(--ease-soft)}.channel-voice-member-dot.is-speaking{background:var(--mint);box-shadow:0 0 8px var(--mint-glow);animation:gentlePulse 1s ease-in-out infinite}@keyframes gentlePulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.8}}.channel-footer{margin-top:auto;position:sticky;bottom:calc(var(--space-xl) * -1);padding-top:var(--space-xl);background:linear-gradient(to bottom,transparent,var(--nebula) 40%)}.channel-footer-banner{margin-bottom:var(--space-md);display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);padding:var(--space-md);border-radius:var(--radius-lg);background:var(--coral-soft);border:1px solid rgba(244,164,164,.3);color:var(--coral);font-size:.8rem;font-weight:500;animation:slideUp .3s var(--ease-soft)}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.channel-footer-banner-dismiss{flex-shrink:0;padding:var(--space-xs) var(--space-md);font-size:.75rem;border-radius:var(--radius-full);background:#f4a4a433;color:var(--snow);border:none;box-shadow:none}.channel-footer-banner-dismiss:hover:not(:disabled){background:#f4a4a44d;transform:none;box-shadow:none}.voice-dock{padding:var(--space-lg);background:var(--nebula-light);border:1px solid var(--cloud-dark);border-radius:var(--radius-lg);animation:slideUp .3s var(--ease-soft)}.voice-dock-actions{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}.voice-dock-icon{width:2.25rem;height:2.25rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:var(--radius-full);background:var(--cloud-dark);border:none;color:var(--pearl);box-shadow:none;transition:all .2s var(--ease-soft)}.voice-dock-icon svg{display:block}.voice-dock-icon:focus-visible{outline:2px solid var(--lavender);outline-offset:2px}.voice-dock-disconnect{background:linear-gradient(135deg,var(--coral),#e88a8a);color:var(--void)}.voice-dock-disconnect:hover:not(:disabled){box-shadow:var(--shadow-glow-pink);transform:scale(1.05)}.voice-dock-toggle{background:var(--cloud-dark);color:var(--soft)}.voice-dock-toggle:hover:not(:disabled){background:var(--cloud);color:var(--snow);transform:none}.voice-dock-camera,.voice-dock-screen{background:var(--cloud-dark)}.voice-dock-camera:hover:not(:disabled),.voice-dock-screen:hover:not(:disabled){background:var(--lavender-soft);color:var(--lavender)}.voice-dock-camera.is-active,.voice-dock-screen.is-active{background:linear-gradient(135deg,var(--mint),#8ed9ba);color:var(--void);box-shadow:var(--shadow-glow-mint)}.voice-dock-camera:disabled,.voice-dock-screen:disabled{opacity:.5}.voice-dock-channel{margin-top:var(--space-sm);font-family:var(--font-mono);font-size:.75rem;color:var(--mist)}.voice-dock-channel-alert{color:var(--coral)}.voice-dock-error{margin-top:var(--space-xs);font-size:.75rem;color:var(--coral)}.voice-dock-native-debug{margin-top:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);border:1px solid var(--sky-soft);background:#a7c5eb0d;font-family:var(--font-mono);font-size:.7rem}.voice-dock-native-debug-title{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--sky);margin-bottom:var(--space-sm)}.voice-dock-screen-controls{display:inline-flex;align-items:center;gap:var(--space-xs)}.voice-dock-screen-mode{min-width:4rem;padding:var(--space-xs) var(--space-sm);font-size:.7rem;border-radius:var(--radius-full);background:var(--cloud-dark)}.user-dock{margin-top:var(--space-md);display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-lg);background:var(--nebula-light);border:1px solid var(--cloud-dark)}.user-dock-avatar{width:2.5rem;height:2.5rem;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--cloud-dark),var(--cloud));color:var(--soft);display:inline-flex;align-items:center;justify-content:center;overflow:hidden;font-family:var(--font-sans);font-size:1rem;font-weight:600;flex-shrink:0}.user-dock-avatar.is-placeholder{border:2px solid var(--lavender);box-shadow:0 0 12px var(--lavender-glow)}.user-dock-avatar img{width:100%;height:100%;object-fit:cover}.user-dock-meta{min-width:0;flex:1}.user-dock-name{font-size:.9rem;font-weight:600;color:var(--snow);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-dock-subtitle{margin-top:2px;font-family:var(--font-mono);font-size:.7rem;color:var(--mint);display:flex;align-items:center;gap:var(--space-xs)}.user-dock-subtitle:before{content:"";width:6px;height:6px;border-radius:var(--radius-full);background:var(--mint);box-shadow:0 0 6px var(--mint-glow)}.user-dock-settings{width:2rem;height:2rem;border-radius:var(--radius-full);padding:0;background:var(--cloud-dark);border:none;color:var(--soft);display:inline-flex;align-items:center;justify-content:center;box-shadow:none}.user-dock-settings:hover:not(:disabled){background:var(--cloud);color:var(--snow);transform:rotate(30deg);box-shadow:none}.message-area{flex:1;min-height:0;display:flex;flex-direction:column}.message-area-header{padding:var(--space-xl);border-bottom:1px solid var(--cloud-dark);background:linear-gradient(180deg,rgba(180,167,214,.03) 0%,transparent 100%)}.message-area-title{display:inline-flex;align-items:center;gap:var(--space-sm);font-size:1.05rem;font-weight:600;color:var(--snow)}.message-area-prefix{font-family:var(--font-mono);color:var(--lavender);font-weight:500;opacity:.8}.message-area-description{margin-top:var(--space-xs);font-size:.85rem;color:var(--mist)}.messages{flex:1;min-height:0;overflow-y:auto;padding:var(--space-xl);scroll-behavior:smooth}.messages::-webkit-scrollbar{width:6px}.messages::-webkit-scrollbar-track{background:transparent}.messages::-webkit-scrollbar-thumb{background:var(--cloud-dark);border-radius:var(--radius-full)}.messages::-webkit-scrollbar-thumb:hover{background:var(--cloud)}.message-items{list-style:none;display:flex;flex-direction:column;gap:var(--space-lg)}.message-item{display:flex;flex-direction:column;gap:var(--space-xs);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-lg);background:#ffffff05;border:1px solid transparent;transition:all .15s var(--ease-soft)}.message-item:hover{background:#ffffff0a;border-color:var(--cloud-dark)}.message-meta{display:flex;align-items:baseline;gap:var(--space-sm);flex-wrap:wrap}.message-author{font-weight:600;color:var(--snow);font-size:.9rem}.message-time{font-family:var(--font-mono);font-size:.7rem;color:var(--mist)}.message-edited{font-family:var(--font-mono);font-size:.68rem;color:var(--haze);font-style:italic}.message-actions{display:inline-flex;gap:var(--space-xs);margin-left:var(--space-sm);opacity:0;transition:opacity .15s var(--ease-soft)}.message-item:hover .message-actions{opacity:1}.message-action{padding:var(--space-xs) var(--space-sm);background:var(--cloud-dark);border:none;color:var(--soft);font-family:var(--font-mono);font-size:.7rem;border-radius:var(--radius-sm);box-shadow:none}.message-action:hover:not(:disabled){background:var(--cloud);color:var(--snow);transform:none;box-shadow:none}.message-action-danger:hover:not(:disabled){background:var(--coral-soft);color:var(--coral)}.message-content{font-size:.9rem;color:var(--pearl);white-space:pre-wrap;word-break:break-word;line-height:1.65}.message-edit{display:flex;gap:var(--space-sm);align-items:center}.message-edit input{flex:1}.message-edit button{padding:var(--space-xs) var(--space-md);font-size:.8rem}.message-input{display:flex;gap:var(--space-md);padding:var(--space-xl);border-top:1px solid var(--cloud-dark);background:#00000026}.message-input input{flex:1;padding:var(--space-md) var(--space-xl)}.message-input button{padding:var(--space-md) var(--space-2xl)}.message-error{padding:0 var(--space-xl) var(--space-lg)}.typing-indicator{padding:0 var(--space-xl) var(--space-md);font-size:.8rem;color:var(--mist);font-style:italic;display:flex;align-items:center;gap:var(--space-sm)}.typing-indicator:before{content:"";width:32px;height:10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='10' viewBox='0 0 32 10'%3E%3Ccircle cx='5' cy='5' r='4' fill='%237a7394'%3E%3Canimate attributeName='opacity' values='0.4;1;0.4' dur='1.2s' repeatCount='indefinite' begin='0s'/%3E%3C/circle%3E%3Ccircle cx='16' cy='5' r='4' fill='%237a7394'%3E%3Canimate attributeName='opacity' values='0.4;1;0.4' dur='1.2s' repeatCount='indefinite' begin='0.2s'/%3E%3C/circle%3E%3Ccircle cx='27' cy='5' r='4' fill='%237a7394'%3E%3Canimate attributeName='opacity' values='0.4;1;0.4' dur='1.2s' repeatCount='indefinite' begin='0.4s'/%3E%3C/circle%3E%3C/svg%3E");background-repeat:no-repeat}.video-stage{border-top:1px solid var(--cloud-dark);padding:var(--space-xl);background:#0000001a;flex-shrink:0}.video-stage-empty{font-size:.85rem;color:var(--mist);font-style:italic}.video-stage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-md)}.video-stage-tile{position:relative;background:var(--void);border:1px solid var(--cloud-dark);border-radius:var(--radius-lg);overflow:hidden;min-height:120px;transition:all .2s var(--ease-soft)}.video-stage-tile:hover{border-color:var(--cloud)}.video-stage-tile.is-local{border-color:var(--lavender);box-shadow:0 0 16px var(--lavender-glow)}.video-stage-tile.is-screen-share{border-color:var(--peach);box-shadow:0 0 16px var(--peach-glow)}.video-stage-stream{width:100%;aspect-ratio:16 / 9;object-fit:cover;display:block;background:var(--void)}.video-stage-label{position:absolute;left:var(--space-sm);bottom:var(--space-sm);font-family:var(--font-mono);font-size:.7rem;font-weight:500;color:var(--snow);background:#13111ceb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-full)}@supports (backdrop-filter: blur(8px)) or (-webkit-backdrop-filter: blur(8px)){.video-stage-label{background:#13111ccc}}.voice-panel{padding:var(--space-lg);background:var(--nebula-light);border-top:1px solid var(--cloud-dark)}.voice-panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-md)}.voice-panel-header h4{font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mist)}.voice-status{font-family:var(--font-mono);font-size:.72rem;color:var(--mist)}.voice-status-live{color:var(--mint)}.voice-actions{display:flex;gap:var(--space-sm);margin-bottom:var(--space-md)}.voice-actions button{padding:var(--space-sm) var(--space-lg);font-size:.8rem}.voice-leave{background:var(--cloud-dark);color:var(--soft);box-shadow:none}.voice-leave:hover:not(:disabled){background:var(--cloud);color:var(--snow);transform:none;box-shadow:none}.voice-participants{list-style:none;display:flex;flex-direction:column;gap:var(--space-xs)}.voice-participant{display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);background:var(--cloud-dark);font-size:.85rem;color:var(--pearl)}.voice-you{font-family:var(--font-mono);font-size:.7rem;color:var(--mint);text-transform:uppercase;letter-spacing:.05em}.voice-note{margin-bottom:var(--space-sm);font-size:.8rem;color:var(--mist)}.voice-error{margin-top:var(--space-sm)}.member-list{width:var(--member-list-width);background:linear-gradient(180deg,var(--nebula-light) 0%,var(--nebula) 100%);border:1px solid var(--cloud-dark);border-radius:var(--radius-xl);padding:var(--space-xl);flex-shrink:0;overflow-y:auto;position:relative;z-index:1}.member-list h3{font-size:1rem;font-weight:600;color:var(--snow);margin-bottom:var(--space-lg)}.member-section-title{margin:var(--space-lg) 0 var(--space-sm);font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mist)}.member-items{list-style:none;display:flex;flex-direction:column;gap:var(--space-xs)}.member-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);background:#ffffff05;font-size:.85rem;color:var(--pearl);transition:all .15s var(--ease-soft)}.member-item:hover{background:#ffffff0d}.member-name{display:inline-flex;align-items:center;gap:var(--space-sm);min-width:0}.member-status-dot{width:8px;height:8px;border-radius:var(--radius-full);flex-shrink:0}.member-status-dot-online{background:var(--mint);box-shadow:0 0 6px var(--mint-glow)}.member-status-dot-offline{background:var(--cloud)}.member-voice-indicator{font-family:var(--font-mono);font-size:.65rem;color:var(--lavender);text-transform:uppercase;letter-spacing:.04em;padding:var(--space-xs) var(--space-sm);background:var(--lavender-soft);border-radius:var(--radius-full)}.member-item-offline{color:var(--mist);opacity:.7}.settings-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1200;background:#13111ceb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:var(--space-xl);animation:fadeIn .2s var(--ease-soft)}@supports (backdrop-filter: blur(8px)) or (-webkit-backdrop-filter: blur(8px)){.settings-modal-backdrop{background:#13111ccc}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.settings-modal{width:min(480px,calc(100vw - 2rem));max-height:calc(100vh - 2rem);overflow-y:auto;border-radius:var(--radius-xl);background:var(--nebula);border:1px solid var(--cloud-dark);box-shadow:var(--shadow-lg);padding:var(--space-2xl);display:flex;flex-direction:column;gap:var(--space-xl);animation:modalPop .3s var(--ease-soft)}@keyframes modalPop{0%{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.channel-create-modal-backdrop{z-index:1180}.channel-create-modal{width:min(400px,calc(100vw - 2rem))}.channel-create-form{gap:var(--space-md)}.voice-share-modal-backdrop{z-index:1190}.voice-share-modal{width:min(440px,calc(100vw - 2rem))}.settings-modal-header{display:flex;align-items:center;justify-content:space-between}.settings-modal-header h4{font-size:1.15rem;font-weight:600;color:var(--snow)}.settings-close{width:2rem;height:2rem;padding:0;background:var(--cloud-dark);border:none;color:var(--soft);font-size:1rem;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center;box-shadow:none}.settings-close:hover:not(:disabled){background:var(--cloud);color:var(--snow);transform:none;box-shadow:none}.settings-section{border:1px solid var(--cloud-dark);border-radius:var(--radius-lg);padding:var(--space-xl);background:var(--nebula-light);display:flex;flex-direction:column;gap:var(--space-md)}.settings-section h5{font-family:var(--font-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--lavender);margin-bottom:var(--space-xs)}.settings-label{font-size:.85rem;font-weight:500;color:var(--pearl)}.settings-help{font-size:.78rem;color:var(--mist)}.settings-checkbox{display:inline-flex;align-items:center;gap:var(--space-sm);font-size:.85rem;color:var(--pearl);cursor:pointer}.settings-checkbox input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--lavender)}.settings-avatar-preview{width:5rem;height:5rem;border-radius:var(--radius-lg);overflow:hidden;border:2px solid var(--cloud-dark);background:var(--cloud-dark)}.settings-avatar-preview img{width:100%;height:100%;object-fit:cover}.settings-actions{margin-top:var(--space-sm);display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-sm)}.settings-secondary{background:var(--cloud-dark);color:var(--soft);box-shadow:none}.settings-secondary:hover:not(:disabled){background:var(--cloud);color:var(--snow);transform:none;box-shadow:none}.settings-danger{background:var(--coral-soft);color:var(--coral);box-shadow:none}.settings-danger:hover:not(:disabled){background:#f4a4a440;box-shadow:none}.settings-audio-row{display:grid;gap:var(--space-xs)}.voice-share-preview{width:100%;min-height:120px;border-radius:var(--radius-lg);border:1px solid var(--cloud-dark);background:var(--cloud-dark);overflow:hidden;display:grid;place-items:center;padding:var(--space-md)}.voice-share-preview-video{width:100%;max-height:180px;border-radius:var(--radius-md);object-fit:contain;background:var(--void)}.auth-page{height:100%;display:flex;align-items:center;justify-content:center;background:var(--void);position:relative}.auth-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 70% at 50% 30%,rgba(180,167,214,.12) 0%,transparent 55%),radial-gradient(ellipse 60% 50% at 20% 80%,rgba(168,230,207,.08) 0%,transparent 45%),radial-gradient(ellipse 50% 40% at 80% 70%,rgba(232,180,188,.08) 0%,transparent 40%);pointer-events:none}.auth-form{position:relative;background:var(--nebula);border:1px solid var(--cloud-dark);padding:var(--space-3xl);border-radius:var(--radius-xl);width:100%;max-width:380px;display:flex;flex-direction:column;gap:var(--space-lg);box-shadow:var(--shadow-lg);animation:modalPop .4s var(--ease-soft)}.auth-form h1{font-size:1.75rem;font-weight:700;text-align:center;color:var(--snow);margin-bottom:var(--space-sm);letter-spacing:-.02em}.auth-form input{padding:var(--space-md) var(--space-xl)}.auth-form button{padding:var(--space-md) var(--space-2xl);margin-top:var(--space-sm)}.context-menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:998}.context-menu{position:fixed;z-index:999;min-width:160px;background:var(--nebula);border:1px solid var(--cloud-dark);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-xs);display:flex;flex-direction:column;animation:contextMenuFadeIn .15s var(--ease-soft)}@keyframes contextMenuFadeIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.context-menu-item{width:100%;padding:var(--space-sm) var(--space-md);background:transparent;border:none;border-radius:var(--radius-sm);color:var(--pearl);font-family:var(--font-sans);font-size:.85rem;text-align:left;box-shadow:none;transition:all .15s var(--ease-soft)}.context-menu-item:hover:not(:disabled){background:var(--lavender-soft);color:var(--snow);transform:none;box-shadow:none}.context-menu-item.is-disabled{opacity:.5;cursor:not-allowed}.context-menu-item.is-danger{color:var(--coral)}.context-menu-item.is-danger:hover:not(:disabled){background:var(--coral-soft)}.context-menu-divider{height:1px;background:var(--cloud-dark);margin:var(--space-xs) 0}.context-menu-item:focus-visible{outline:2px solid var(--lavender);outline-offset:-2px}.error{font-size:.8rem;color:var(--coral);padding:var(--space-md);background:var(--coral-soft);border:1px solid rgba(244,164,164,.3);border-radius:var(--radius-md)}.placeholder{font-size:.85rem;color:var(--mist);font-style:italic}.toast{position:fixed;right:var(--space-xl);bottom:var(--space-xl);z-index:1000;max-width:min(360px,calc(100vw - 2rem));padding:var(--space-md) var(--space-xl);border-radius:var(--radius-lg);border:1px solid var(--cloud-dark);background:var(--nebula);color:var(--pearl);font-size:.85rem;box-shadow:var(--shadow-lg);animation:toastSlide .3s var(--ease-soft)}@keyframes toastSlide{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.toast-error{border-color:#f4a4a466;color:var(--coral)}@media(max-width:1024px){:root{--sidebar-width: 220px;--member-list-width: 200px}.chat-view{gap:var(--space-md);padding:var(--space-md)}}@media(max-width:820px){.chat-view{display:grid;grid-template-columns:200px 1fr;grid-template-rows:1fr auto;gap:var(--space-md)}.channel-list{grid-column:1;grid-row:1 / span 2;width:100%;border-radius:var(--radius-lg)}.main-content{grid-column:2;grid-row:1;border-radius:var(--radius-lg)}.member-list{grid-column:2;grid-row:2;width:100%;max-height:180px;border-radius:var(--radius-lg)}.settings-modal{width:calc(100vw - 1.5rem);max-height:calc(100vh - 1.5rem);padding:var(--space-xl)}.video-stage{padding:var(--space-lg)}.video-stage-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.voice-dock-actions{flex-wrap:wrap}}@media(max-width:620px){.chat-view{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.channel-list{grid-column:1;grid-row:1;max-height:200px}.main-content{grid-column:1;grid-row:2}.member-list{grid-column:1;grid-row:3}.video-stage-grid{grid-template-columns:1fr}.message-input{flex-direction:column;padding:var(--space-lg)}.message-input button{width:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}