@charset "UTF-8";.login-page{width:100vw;height:calc(var(--vh) * 100);display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#b9bbbe,#72767d)}.login-container{background:#2f3136;border-radius:8px;padding:40px;width:100%;max-width:480px;box-shadow:0 8px 16px #0006}.login-header{text-align:center;margin-bottom:32px}.login-header h1{font-size:32px;font-weight:700;color:#dcddde;margin:0 0 8px}.login-header p{font-size:16px;color:#b9bbbe;margin:0}.login-form{display:flex;flex-direction:column;gap:20px}.error-message{background:#f04747;color:#dcddde;padding:12px;border-radius:4px;font-size:14px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:12px;font-weight:600;text-transform:uppercase;color:#b9bbbe;letter-spacing:.5px}.form-group input{background:#202225;border:1px solid #202225;border-radius:4px;color:#dcddde;font-size:16px;padding:12px;transition:border-color .15s ease}.form-group input:focus{border-color:#5d6269;outline:none}.form-group input:hover{border-color:#202225}.submit-button{background:#b9bbbe;color:#dcddde;border:none;border-radius:4px;padding:14px;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s ease;margin-top:8px}.submit-button:hover:not(:disabled){background:#4752c4}.submit-button:disabled{background:#4752c4;opacity:.5;cursor:not-allowed}.toggle-form{text-align:center;font-size:14px;color:#b9bbbe;margin-top:8px}.link-button{background:none;border:none;color:#00aff4;cursor:pointer;font-size:14px;padding:0;text-decoration:none}.link-button:hover{text-decoration:underline}.server-selector{width:100vw;height:calc(var(--vh) * 100);display:flex;flex-direction:column;align-items:center;background:#2f3136;padding:40px 20px;position:relative}.server-selector-header{text-align:center;margin-bottom:40px;position:relative}@media (max-width: 768px){:root{--header-height: 46px;--subheader-height: 46px}.server-selector{padding-top:calc(var(--header-height) + var(--subheader-height))}.server-selector-header{position:fixed;top:calc(var(--header-height));left:0;right:0;z-index:101;background:#2f3136;padding:12px 20px}}.server-selector-header h1{font-size:28px;font-weight:700;color:#dcddde;margin:0 0 8px}.server-selector-header p{font-size:16px;color:#b9bbbe;margin:0 0 16px}.logout-button{background:#4f545c;color:#dcddde;border:none;border-radius:4px;padding:8px 16px;font-size:14px;cursor:pointer;transition:background .2s ease}.logout-button:hover{background:#5d6269}.server-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;width:100%;max-width:800px;margin-bottom:32px}.no-servers{color:#b9bbbe;text-align:center;grid-column:1/-1}.server-card{background:#36393f;border-radius:8px;padding:20px;cursor:pointer;transition:background .2s ease,transform .2s ease;display:flex;flex-direction:column;align-items:center;text-align:center}.server-card:hover{background:#3a3d44;transform:translateY(-2px)}.server-icon{width:80px;height:80px;margin-bottom:12px}.server-icon img{width:100%;height:100%;border-radius:50%;object-fit:cover}.server-icon-placeholder{width:100%;height:100%;border-radius:50%;background:#4f545c;display:flex;align-items:center;justify-content:center;font-size:36px;font-weight:700;color:#dcddde}.server-info h3{font-size:18px;font-weight:600;color:#dcddde;margin:0 0 4px}.server-role{font-size:12px;color:#b9bbbe;text-transform:uppercase;letter-spacing:.5px;margin:0}.join-server-button{background:#4f545c;color:#dcddde;border:none;border-radius:4px;padding:12px 24px;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s ease}.profile-wrapper{position:absolute;top:12px;right:24px}.join-server-button:hover{background:#5d6269}.input-help{margin-top:6px;font-size:12px;color:#b9bbbe;display:flex;align-items:center;gap:6px}.name-check small{display:block;margin-top:6px;font-size:13px;text-align:right}.create-server-modal .modal-content{max-width:520px}.create-server-modal .form-group{margin-bottom:12px}.create-server-modal .help-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}.create-server-modal .slug-preview{font-size:13px;color:#b9bbbe;margin-top:12px}.create-server-modal .slug-preview code{background:transparent;color:#dcddde;padding:2px 6px;border-radius:4px;font-family:monospace;margin-left:6px}.create-server-modal .modal-actions{padding-top:18px}.error-message{background:#f04747;color:#dcddde;padding:12px;border-radius:4px;font-size:14px;margin-bottom:16px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0009;z-index:1000;padding:24px}.modal-content{background:#18191c;color:#dcddde;border-radius:8px;box-shadow:0 8px 32px #00000080;max-width:450px;width:100%;max-height:90vh;overflow:auto;position:relative;padding:12px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #202225}.modal-header h2{margin:0;font-size:18px}.modal-header--compact{padding:10px 14px}.modal-header--compact h2{font-size:14px}.modal-header--large{padding:20px 24px}.modal-header--large h2{font-size:22px}.modal-close{background:transparent;border:none;font-size:20px;cursor:pointer;color:#b9bbbe;padding:6px}.modal-body{padding:16px 20px}.modal-actions{display:flex;gap:8px;padding:12px 20px;justify-content:flex-end;border-top:1px solid #202225}.modal-input,.invite-link-input,.modal-input input{width:100%;padding:8px;border-radius:6px;border:1px solid #202225;background:#202225;color:#dcddde}.btn-cancel-small,.btn-cancel,.modal-btn-cancel{background:transparent;border:none;color:#dcddde;padding:6px 10px;border-radius:6px;cursor:pointer;transition:background-color .12s,color .12s}.btn-cancel-small:disabled,.btn-cancel:disabled,.modal-btn-cancel:disabled{opacity:.5;cursor:not-allowed}.btn-cancel-small:hover:not(:disabled),.btn-cancel:hover:not(:disabled),.modal-btn-cancel:hover:not(:disabled){background-color:#4f545c}.btn-confirm,.btn-logout-confirm,.modal-btn-primary,.btn-create,.copy-button,.primary{background:linear-gradient(90deg,#b9bbbe,#72767d);color:#000;border:none;padding:8px 12px;border-radius:6px;cursor:pointer}.btn-danger{background:#b03a3a;color:#fff;border:none;padding:8px 12px;border-radius:6px;cursor:pointer;transition:background-color .12s ease,transform .06s ease,box-shadow .12s ease;box-shadow:none}.btn-danger:disabled{opacity:.6;cursor:not-allowed}.btn-danger:hover:not(:disabled){background-color:#8f2b2b;box-shadow:0 6px 16px #00000047}.btn-danger:active:not(:disabled){box-shadow:0 3px 6px #0003}.btn-small{padding:4px 6px}.server-title-bar{height:46px;background:#2f3136;border-bottom:1px solid #202225;display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:0 16px;position:relative;z-index:100;flex-shrink:0}.title-bar-left{display:flex;align-items:center;position:relative}.title-bar-center{display:flex;justify-content:center;align-items:center;padding:0 20px}.search-form{display:flex;align-items:center;width:100%;border-radius:4px;max-width:460px;background-color:#202225;overflow:hidden}.search-input{flex:1;padding:6px 8px;background:transparent;border:none;color:#dcddde;font-size:14px;outline:none}.search-input::placeholder{color:#72767d}.search-button{background:none;border:none;padding:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:opacity .2s;color:#96989d}.search-button svg{display:block}.search-button:hover{opacity:.7}.title-bar-right{display:flex;align-items:center;justify-content:flex-end}@media (max-width: 768px){.search-form{max-width:300px}}.server-title{font-size:16px;font-weight:600;color:#fff;margin:0;text-align:center}.hamburger-menu{width:24px;height:24px;background:none;border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:6px;border-radius:4px;transition:background .15s ease}.hamburger-menu:hover{background:#40444b}.hamburger-line{width:18px;height:2px;background:#b9bbbe;border-radius:1px;transition:background .15s ease}.hamburger-menu:hover .hamburger-line{background:#dcddde}.menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:transparent;z-index:99}.dropdown-menu{position:absolute;top:44px;left:8px;width:220px;background:#18191c;border-radius:4px;box-shadow:0 8px 16px #0006;padding:6px 0;z-index:100;animation:slideDown .15s ease}.menu-header{padding:8px 12px;font-size:12px;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.5px}.menu-divider{height:1px;background:#2f3136;margin:4px 0}.menu-item{width:100%;display:flex;align-items:center;gap:8px;padding:8px 12px;background:none;border:none;color:#b9bbbe;font-size:14px;cursor:pointer;transition:background .15s ease,color .15s ease;text-align:left}.menu-item:hover{background:#5d6269;color:#fff}.menu-icon{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;margin-right:8px}.menu-icon svg{display:block}.server-title-bar .logout-button{background:#4f545c;color:#fff;border:none;padding:8px 16px;border-radius:0;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease}.server-title-bar .logout-button:hover{background:#5d6269}.profile-container{position:relative}.profile-btn{width:36px;height:36px;border-radius:50%;border:none;background:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}.profile-btn:hover{background:#ffffff08}.profile-btn:active{transform:scale(.98)}.profile-btn:focus{outline:none}.profile-btn:focus-visible{box-shadow:0 0 0 3px #4f545c24;border-radius:50%}.profile-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block;transition:transform .14s ease,box-shadow .14s ease,opacity .14s ease;opacity:.8}.profile-initials{transition:box-shadow .14s ease,opacity .14s ease,filter .14s ease;opacity:.8}.profile-btn:hover .profile-avatar{transform:scale(1.03);box-shadow:0 10px 28px #0000005c;opacity:1}.profile-btn:hover .profile-initials{transform:none;background:#5d6269;box-shadow:0 8px 20px #0000003d;opacity:1}.profile-btn:hover{background:#ffffff0a}.profile-initials{width:36px;height:36px;border-radius:50%;background:#4f545c;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:600}.profile-dropdown{position:absolute;right:0;top:44px;width:180px;background:#18191c;border-radius:6px;box-shadow:0 8px 16px #0006;z-index:100;padding:6px 0}.profile-dropdown-item{padding:8px 12px;color:#b9bbbe;cursor:pointer;font-size:14px}.profile-dropdown-item:hover{background:#5d6269;color:#fff}.profile-dropdown-divider{height:1px;background:#2f3136;margin:6px 0}.sidebar{position:relative;background-color:#18191c;border-right:1px solid #2f3136;display:flex;flex-direction:column;flex-shrink:0;min-width:200px}.sidebar-header{height:46px;display:flex;align-items:center;padding:0 16px;border-bottom:1px solid #2f3136;flex-shrink:0}.sidebar-header h2{font-size:16px;font-weight:700;color:#dcddde}.sidebar-content{flex:1;overflow-y:auto;overflow-x:hidden}@media (max-width: 768px){:root{--header-height: 46px;--subheader-height: 46px}.sidebar{padding-top:var(--subheader-height)}.sidebar .sidebar-header{position:fixed;top:0;left:0;right:0;z-index:101;background:#18191c}}.sidebar-content::-webkit-scrollbar{width:8px}.sidebar-content::-webkit-scrollbar-track{background:transparent}.sidebar-content::-webkit-scrollbar-thumb{background-color:#202225;border-radius:4px}.sidebar-content::-webkit-scrollbar-thumb:hover{background-color:#2f3136}.sidebar-section{margin-top:16px}.section-header{display:flex;align-items:center;padding:0 16px;height:28px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .1s}.section-header:hover{color:#dcddde}.arrow{display:inline-flex;align-items:center;justify-content:center;margin-right:6px;transition:transform .2s;color:#96989d}.arrow svg{display:block}.arrow.expanded{transform:rotate(90deg)}.section-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#96989d}.section-content{margin-top:4px}.section-divider{padding:8px 16px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#72767d}.channel-item{display:flex;align-items:center;justify-content:space-between;height:24px;padding:0 8px 0 16px;margin:1px 8px;border-radius:4px;transition:background-color .1s;color:#96989d}.channel-item:hover{background-color:#40444b;color:#dcddde}.channel-item.active{background-color:#2f3136;color:#96989d}@media (max-width: 768px){.channel-item.active,.user-item.active{background-color:transparent;color:#dcddde}}.channel-item.active .channel-name{color:#96989d}.channel-item.unread{color:#dcddde;font-weight:600}.channel-item.unread .channel-name{color:#dcddde}.channel-main{display:flex;align-items:center;flex:1;cursor:pointer}.channel-settings-btn{background:none;border:none;color:#96989d;cursor:pointer;padding:4px;display:none;align-items:center;justify-content:center;border-radius:4px;transition:all .2s;width:24px;height:24px}.channel-settings-btn svg{display:block}.channel-item:hover .channel-settings-btn,.channel-settings-btn.channel-settings-visible{display:flex}.channel-settings-btn:hover{color:#dcddde;background-color:#ffffff1a}.channel-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;color:#96989d}.channel-icon svg{display:block}.channel-name{font-size:13px;font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-item .notification-badge,.channel-item .unread-count,.channel-item .mention-badge{display:none}.private-badge{padding:4px;display:flex;align-items:center;color:#96989d}.private-badge svg{display:block}.mention-indicator{margin-left:auto;display:flex;align-items:center;color:#f04747;animation:pulse 2s ease-in-out infinite}.mention-indicator svg{display:block;filter:drop-shadow(0 0 2px rgba(240,71,71,.5))}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.user-status-label{display:flex;align-items:center;padding:8px 16px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#72767d;margin-top:8px}.status-dot{width:8px;height:8px;border-radius:50%;margin-right:6px}.status-dot.online{background-color:#3ba55d}.status-dot.away{background-color:#faa81a}.status-dot.offline{background-color:#747f8d}.user-item{display:flex;align-items:center;height:24px;padding:0 8px 0 20px;margin:1px 8px;border-radius:4px;cursor:pointer;transition:background-color .1s;color:#96989d;position:relative}.user-item.unread{color:#dcddde;font-weight:600}.user-item:hover{background-color:#40444b;color:#dcddde}.user-item.active{background-color:#2f3136;color:#dcddde}.user-item .unread-badge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;background-color:#f04747;color:#dcddde;border-radius:9px;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-item .unread-badge.mention{background-color:#faa61a}.status-indicator{width:8px;height:8px;border-radius:50%;margin-right:8px;flex-shrink:0}.status-indicator.online{background-color:#3ba55d}.status-indicator.away{background-color:#faa61a}.status-indicator.offline{background-color:#747f8d}.user-name{font-size:13px;font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.add-channel-btn{background:none;border:none;color:#96989d;font-size:18px;cursor:pointer;padding:0 8px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.add-channel-btn:hover{color:#dcddde;background-color:#ffffff1a}.channel-menu-container{position:relative;margin-left:auto}.channel-menu-btn{background:none;border:none;color:#96989d;font-size:20px;cursor:pointer;padding:0 8px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s;line-height:1}.channel-menu-btn:hover{color:#dcddde;background-color:#ffffff1a}.menu-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999}.channel-dropdown-menu{position:absolute;top:100%;right:0;background-color:#18191c;border-radius:4px;box-shadow:0 8px 16px #0006;min-width:160px;z-index:1000;margin-top:4px}.channel-menu-item{display:block;width:100%;padding:10px 12px;background:none;border:none;color:#dcddde;font-size:14px;text-align:left;cursor:pointer;transition:background-color .2s}.channel-menu-item:first-child{border-radius:4px 4px 0 0}.channel-menu-item:last-child{border-radius:0 0 4px 4px}.channel-menu-item:hover{background-color:#4f545c;color:#dcddde}.modal-content.create-channel-modal .form-group{margin-bottom:16px}.modal-content.create-channel-modal .form-group label{display:block;color:#b9bbbe;font-size:14px;font-weight:600;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.modal-content.create-channel-modal .channel-input,.modal-content.create-channel-modal .channel-select{width:100%;padding:10px;background-color:#202225;border:1px solid #202225;border-radius:4px;color:#dcddde;font-size:16px;transition:border-color .2s}.modal-content.create-channel-modal .channel-input:focus,.modal-content.create-channel-modal .channel-select:focus{outline:none;border-color:#4f545c}.modal-content.create-channel-modal .checkbox-group{display:flex;align-items:center;margin-bottom:20px}.modal-content.create-channel-modal .checkbox-group input[type=checkbox]{margin-right:8px;cursor:pointer}.modal-content.create-channel-modal .checkbox-group label{color:#dcddde;font-size:14px;margin:0;cursor:pointer;text-transform:none;letter-spacing:normal;font-weight:400}.modal-content.create-channel-modal .help-text{margin:4px 0 0 24px;font-size:12px;color:#96989d}.modal-content.create-channel-modal .user-selection-list{max-height:200px;overflow-y:auto;border:1px solid #202225;border-radius:4px;padding:8px;background-color:#202225}.modal-content.create-channel-modal .user-checkbox-item{display:flex;align-items:center;padding:8px;margin:2px 0;border-radius:4px;cursor:pointer;transition:background-color .2s}.modal-content.create-channel-modal .user-checkbox-item:hover{background-color:#2f3136}.modal-content.create-channel-modal .user-checkbox-item input[type=checkbox]{margin-right:8px;cursor:pointer}.modal-content.create-channel-modal .user-checkbox-name{color:#dcddde;font-size:14px}.create-channel-modal .inline-group{display:flex;gap:8px;align-items:center}.create-channel-modal .inline-group .channel-input{flex:1}.create-channel-modal .btn-inline{padding:10px 16px;background-color:#4f545c;color:#dcddde;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}.create-channel-modal .btn-inline:hover{background-color:#5d6269}.create-channel-modal .btn-inline:disabled{background-color:#5d6269;opacity:.5;cursor:not-allowed}.create-channel-modal .members-list-small{max-height:150px;overflow-y:auto;border:1px solid #202225;border-radius:4px;padding:4px;background-color:#202225}.create-channel-modal .member-item-small{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;margin:2px 0;border-radius:4px;background-color:#2f3136}.create-channel-modal .member-name-small{color:#dcddde;font-size:14px}.create-channel-modal .btn-remove-small{background:none;border:none;color:#f04747;font-size:20px;font-weight:700;cursor:pointer;padding:0 4px;line-height:1;transition:color .2s}.create-channel-modal .btn-remove-small:hover{color:#f36d6d}.sidebar-resize-handle{position:absolute;top:0;right:0;width:6px;height:100%;cursor:ew-resize;background-color:transparent;transition:background-color .2s;z-index:10}.sidebar-resize-handle:hover{background-color:#4f545c}.user-status-label.clickable{cursor:pointer;transition:color .2s}.user-status-label.clickable:hover{color:#96989d}.user-status-label .arrow{display:inline-flex;align-items:center;justify-content:center;margin-right:4px;transition:transform .2s}.user-status-label .arrow svg{display:block}.user-status-label .arrow.expanded{transform:rotate(90deg)}@media (max-width: 768px){.channel-name,.user-name{font-size:16px}.sidebar-header h2{font-size:18px}.section-title,.user-status-label{font-size:16px}.channel-item,.user-item{height:24px;padding:0 12px 0 16px;margin:6px 8px;border-radius:6px}.channel-main{height:100%;display:flex;align-items:center;padding-left:8px}.channel-icon{width:24px;height:24px}}.server-settings-modal{max-width:650px}.server-settings-modal .server-settings-box{border:1px solid #202225;border-radius:8px;overflow:hidden;background:#18191c}.server-settings-modal .server-settings-tabs{display:flex;gap:8px;padding:8px;background:linear-gradient(180deg,#0000,#00000005);border-bottom:1px solid #202225}.server-settings-modal .server-settings-tabs .tab{background:transparent;border:none;color:#dcddde;padding:8px 12px;border-radius:6px;cursor:pointer}.server-settings-modal .server-settings-tabs .tab.active{background:#18191c;color:#fff;font-weight:600;box-shadow:inset 0 -2px #4f545c}.server-settings-modal .server-settings-panel{padding:12px}.server-settings-modal .server-settings-panel .channels-list,.server-settings-modal .server-settings-panel .members-list-small{display:flex;flex-direction:column;gap:8px;border-radius:6px;padding:8px;box-sizing:border-box}.server-settings-modal .server-settings-panel .channel-item,.server-settings-modal .server-settings-panel .member-item-small{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;border-radius:6px;background:#18191c;border:1px solid #202225;width:100%;box-sizing:border-box;overflow:hidden;height:auto}.server-settings-modal .server-settings-panel .member-left{display:flex;align-items:center;gap:12px;min-width:0}.server-settings-modal .server-settings-panel .member-controls{display:flex;align-items:center;gap:8px;margin-left:12px}.server-settings-modal .server-settings-panel .role-select{background:#202225;color:#dcddde;border:1px solid #202225;padding:6px 8px;border-radius:6px;font-size:13px;min-width:160px;cursor:pointer;margin-right:8px;transition:background-color .12s ease,border-color .12s ease}.server-settings-modal .server-settings-panel .role-select:disabled{opacity:.7;cursor:not-allowed}.server-settings-modal .server-settings-panel .role-select:focus{outline:none;box-shadow:0 0 0 3px #4f545c24}.server-settings-modal .server-settings-panel .channel-name{color:#dcddde;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.server-settings-modal .server-settings-panel .member-name-small{color:#dcddde}.server-settings-modal .server-settings-panel .btn-remove-small{background:transparent;border:none;color:#b9bbbe;font-size:18px;cursor:pointer;padding:6px;margin-left:4px}.server-settings-modal .server-settings-panel .btn-remove-small:hover{color:#fff}.server-settings-modal .server-settings-panel .empty-note{margin-top:12px;margin-left:8px;color:#b9bbbe}.members-modal .role-select{background:#202225;color:#dcddde;border:1px solid #202225;padding:6px 8px;border-radius:6px;font-size:13px;min-width:140px;cursor:pointer;margin-right:8px;transition:background-color .12s ease,border-color .12s ease}.members-modal .member-controls{display:flex;align-items:center;gap:8px}.members-modal .member-role-label{color:#b9bbbe;font-size:13px;padding:6px 8px;border-radius:6px;background:transparent;border:1px solid transparent;min-width:56px;text-align:center}.members-modal .member-remove-btn[disabled]{opacity:.5;cursor:not-allowed}.message{position:relative;padding:2px 16px;display:flex;align-items:baseline;gap:8px;line-height:1.5;transition:background-color .1s}.edit-btn{display:none;position:absolute;top:0;right:0;background:transparent;border:none;color:#b9bbbe;padding:4px 6px;border-radius:4px;cursor:pointer}.edit-btn svg{margin-top:2px}.message:hover .edit-btn{display:block}.edit-btn:hover{background-color:#dcddde0a;color:#dcddde}.editor-buttons{display:flex;justify-content:flex-end;gap:4px;margin-top:10px}.editor-btn{padding:4px 8px;border:none;border-radius:4px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.editor-btn:disabled{opacity:.5;cursor:not-allowed}.editor-btn-cancel{background-color:transparent;color:#dcddde}.editor-btn-cancel:hover:not(:disabled){background-color:#4f545c}.editor-btn-primary{background-color:#2f3136;color:#dcddde}.editor-btn-primary:hover:not(:disabled){background-color:#40444b}.message-system{padding:4px 16px;color:#72767d;font-style:italic}.message-system:hover{background-color:transparent}.system-message-content{font-size:14px;color:#72767d;font-style:italic}.message.mentioned{background-color:#faa61a1a;border-left:3px solid #faa61a;padding-left:13px}.message:hover{background-color:#40444b}.message.mentioned:hover{background-color:#faa61a26}.message-timestamp{font-size:12px;color:#72767d;font-weight:400;min-width:60px;flex-shrink:0;text-align:right}@media (max-width: 768px){.message-timestamp{display:none}.message-author,.message-content{font-size:15px}}.message-author{font-weight:600;color:#dcddde;font-size:14px;flex-shrink:0}.message-content{color:#dcddde;font-size:14px;line-height:1.5;word-wrap:break-word;flex:1;min-width:0}.message-content p{display:block}.message-content .inline-code{display:inline-block;background-color:#2f3136;padding:2px 5px;border-radius:3px;font-size:13px;font-family:Courier New,Consolas,Monaco,monospace;color:#eb459e;max-width:100%;white-space:nowrap}.message-content :not(pre)>code,.message-content p code{background-color:#2f3136;color:#dcddde;padding:2px 6px;border-radius:4px;font-family:SFMono-Regular,Menlo,Monaco,Roboto Mono,Courier New,monospace;font-size:13px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.message-content pre{width:100%;box-sizing:border-box;background-color:#2f3136;color:#dcddde;padding:8px 12px;border-radius:6px;font-family:SFMono-Regular,Menlo,Monaco,Roboto Mono,Courier New,monospace;font-size:13px;overflow-x:auto;white-space:pre;margin:8px 0}.message-content pre code{display:block}.message-content pre code{background-color:transparent;padding:0}.message-content strong{font-weight:700;color:#dcddde}.message-content em{font-style:italic}.mention{color:#00aff4;background-color:#00aff41a;padding:0 2px;border-radius:3px;font-weight:500;cursor:pointer}.mention:hover{background-color:#00aff433;text-decoration:underline}.mention.mention-me{color:#faa61a;background-color:#faa61a1a}.mention.mention-me:hover{background-color:#faa61a26}.chat-input-container{padding:0 16px 24px;flex-shrink:0}.chat-input-form{display:flex;flex-direction:column}.chat-input-wrapper{border:1px solid #40444b;background-color:#40444b3b;border-radius:8px;position:relative;min-height:44px}.editor-container{position:relative;width:100%}.editor-input{width:100%;min-height:44px;padding:11px 16px;background-color:transparent;border:none;outline:none;color:#dcddde;font-size:15px;font-family:inherit;line-height:22px;resize:none;overflow-y:auto;max-height:200px}.editor-input:focus{outline:none}.editor-placeholder{position:absolute;left:16px;top:11px;color:#72767d;pointer-events:none;-webkit-user-select:none;user-select:none}.editor-paragraph{margin:0}.mention-token{background-color:#b9bbbe4d;color:#dcddde;padding:0 2px;border-radius:3px;font-weight:500;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;transition:all .1s}.mention-token:hover{background-color:#b9bbbe;color:#dcddde}.mention-dropdown{position:absolute;bottom:100%;left:16px;background-color:#2f3136;border-radius:8px;margin-bottom:8px;box-shadow:0 8px 16px #0006;max-height:200px;overflow-y:auto;z-index:1000;width:320px}.mention-item{padding:8px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color .1s}.mention-item:hover,.mention-item.selected{background-color:#b9bbbe}.mention-item:first-child{border-radius:8px 8px 0 0}.mention-item:last-child{border-radius:0 0 8px 8px}.mention-name{color:#dcddde;font-weight:600;font-size:14px}.mention-username{color:#b9bbbe;font-size:12px}.mention-dropdown::-webkit-scrollbar{width:8px}.mention-dropdown::-webkit-scrollbar-track{background:transparent}.mention-dropdown::-webkit-scrollbar-thumb{background-color:#202225;border-radius:4px}.chat-input-toolbar{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;border-top:1px solid #202225}.toolbar-left{display:flex;gap:8px}.toolbar-btn{background:transparent;border:none;cursor:pointer;padding:4px 8px;color:#b9bbbe;transition:color .1s;border-radius:4px;display:flex;align-items:center;justify-content:center}.toolbar-btn svg{display:block}.toolbar-btn:hover{color:#dcddde;background-color:#5d6269}.toolbar-btn.colors-on{background-color:#393b42;color:#dcddde}.toolbar-btn.colors-on:hover{background-color:#5d6269}.toolbar-right{display:flex;align-items:center}.markdown-hint{font-size:12px;color:#72767d;font-family:Monaco,Menlo,Consolas,Courier New,monospace}.chat-area{flex:1;display:flex;flex-direction:column;min-width:0}.chat-header{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #202225;background-color:#40444b45;flex-shrink:0;box-shadow:0 1px #0003}.chat-header-left{display:flex;align-items:center;gap:8px}.mobile-back-btn{background:transparent;border:none;color:inherit;display:inline-flex;align-items:center;justify-content:center;padding:6px;margin-right:4px;cursor:pointer}.chat-header-right{display:flex;align-items:center;gap:12px}.header-icon-btn{background:transparent;border:none;color:#b9bbbe;cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:background-color .2s,color .2s}.header-icon-btn:hover{background-color:#4f545c;color:#dcddde}.chat-header h3{font-size:16px;font-weight:700;color:#dcddde;display:flex;align-items:center}.chat-header .channel-icon{font-size:20px;color:#96989d;width:auto}.messages-container{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}.messages-container::-webkit-scrollbar{width:16px}.messages-container::-webkit-scrollbar-track{background-color:#202225}.messages-container::-webkit-scrollbar-thumb{background-color:#202225;border:4px solid #202225;border-radius:8px}.messages-container::-webkit-scrollbar-thumb:hover{background-color:#18191c}.messages-list{padding:16px 0;flex:1}.messages-container{padding-bottom:calc(var(--vkb-height, 0px) + 16px)}@media (max-width: 768px){:root{--header-height: 46px;--subheader-height: 46px}.chat-area{padding-top:var(--header-height)}.chat-header{position:fixed;top:0;left:0;right:0;z-index:101}.chat-area .messages-container{padding-top:calc(var(--subheader-height))}}.date-separator{display:flex;align-items:center;margin:24px 16px 16px;gap:16px}.date-separator-line{flex:1;height:1px;background-color:#40444b}.date-separator-text{color:#72767d;white-space:nowrap}.no-channel{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#96989d;text-align:center}.no-channel h2{font-size:24px;font-weight:700;color:#dcddde;margin-bottom:8px}.connection-status{font-size:12px;color:#faa61a;margin-left:12px}.typing-indicator{padding:8px 16px;margin:0 16px}.typing-text{font-size:12px;color:#72767d;font-style:italic}.no-channel p{font-size:16px}.loading{flex:1;display:flex;align-items:center;justify-content:center;color:#96989d}.no-messages{flex:1;display:flex;align-items:center;justify-content:center;color:#96989d;padding:20px}.members-icon-container{position:relative;display:flex;align-items:center}.members-icon-btn{display:flex;align-items:center;gap:6px;background:none;border:none;color:#b9bbbe;font-size:14px;cursor:pointer;padding:6px 12px;border-radius:4px;transition:all .2s}.members-icon-btn:hover{background-color:#40444b;color:#dcddde}.members-icon-btn .icon{display:flex;align-items:center;justify-content:center}.members-icon-btn .icon svg{display:block}.members-icon-btn .member-count{font-weight:600}.members-tooltip{position:absolute;top:100%;right:0;margin-top:8px;background-color:#18191c;border-radius:4px;box-shadow:0 8px 16px #0006;padding:8px;min-width:160px;z-index:1000;animation:slideDown .15s ease}.tooltip-member{padding:4px 8px;color:#dcddde;font-size:13px}.tooltip-more{padding:4px 8px;color:#72767d;font-size:12px;font-style:italic;border-top:1px solid #2f3136;margin-top:4px}.members-section{margin-bottom:24px}.members-section:last-child{margin-bottom:0}.members-section h3{color:#b9bbbe;font-size:12px;font-weight:600;text-transform:uppercase;margin-bottom:12px;letter-spacing:.5px}.members-modal .members-list{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto}.members-modal .member-item{padding:6px 8px;margin-right:8px;background-color:#2f3136;border-radius:4px;display:flex;align-items:center;justify-content:space-between}.members-modal .member-name{color:#dcddde;font-size:14px;font-weight:500;flex:1}.member-remove-btn,.member-add-btn{background:transparent;border:none;color:#b9bbbe;font-size:20px;cursor:pointer;padding:0 4px;border-radius:4px;transition:background-color .2s,color .2s;display:flex;align-items:center;justify-content:center}.member-remove-btn:hover{background-color:#f04747;color:#dcddde}.member-add-btn{font-size:24px;font-weight:700}.member-add-btn:hover{background-color:#3ba55d;color:#dcddde}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.app-container{display:flex;flex-direction:column;width:100vw;height:calc(var(--vh) * 100);background-color:#1a1d21;color:#d1d2d3;overflow:hidden}.app{display:flex;flex:1;overflow:hidden}.mobile-panel{position:relative;width:100%;height:calc(var(--vh) * 100 - 56px);overflow:hidden}.mobile-panel>*{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.slide-left>*{animation:slideInFromRight .22s ease forwards}.slide-right>*{animation:slideInFromLeft .22s ease forwards}@keyframes slideInFromRight{0%{transform:translate(100%);opacity:.98}to{transform:translate(0);opacity:1}}@keyframes slideInFromLeft{0%{transform:translate(-100%);opacity:.98}to{transform:translate(0);opacity:1}}@media (max-width: 768px){.mobile-panel{height:calc(var(--vh) * 100 - 56px)}}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(var(--vh) * 100);background:#2f3136;color:#dcddde}.loading-spinner{width:48px;height:48px;border:4px solid #40444b;border-top-color:#5865f2;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen p{font-size:16px;color:#b9bbbe}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}code{font-family:Courier New,Courier,monospace}#root{width:100vw;height:calc(var(--vh) * 100);overflow:hidden}