:root{--color-primary:#5761f2;--color-primary-light:#7984ff;--color-success:#27ae60;--color-danger:#eb5757;--color-danger-light:#f26767;--color-dark:#1e1e2e;--color-dark-lighter:#2a2a3a;--color-light:#f5f5f7;--color-light-darker:#e5e5ea;--color-gray:#8b8b9b;--color-gray-light:#e5e5e5;--color-gray-text:#888;--text-dark:#333340;--text-light:#f5f5f5;--white:#fff;--black:#000;--transparent:transparent;--white-10:#ffffff1a;--white-05:#ffffff0d;--black-60:#0009;--black-50:#00000080;--black-20:#0003;--black-10:#0000001a;--black-07:#00000012;--color-admin-role:#f04747;--color-user-role:#43b581;--font-size-xs:.75rem;--font-size-s:.85rem;--font-size-m:.95rem;--font-size-l:1.15rem;--font-weight-semibold:500;--font-weight-bold:600;--font-weight-extrabold:700;--sidebar-width:15rem;--header-height:3.5rem;--input-height:3rem;--avatar-size-s:2rem;--avatar-size-m:2.25rem;--icon-size-s:1rem;--icon-size-m:1.25rem;--icon-size-l:1.5rem;--icon-size-xl:3rem;--space-xxs:2px;--space-xs:.25rem;--space-s:.5rem;--space-m:.75rem;--space-l:1rem;--space-xl:1.5rem;--space-xxl:3rem;--radius:.5rem;--radius-s:.25rem;--radius-circle:50%;--transition:.2s ease;--border-width:1px;--border-width-accent:.25rem;--bg-primary:var(--color-dark);--bg-secondary:var(--color-dark-lighter);--text:var(--text-light);--border-color:var(--white-10);--hover-bg:var(--white-05);--active-bg:#5761f233;--input-bg:var(--white-05);--input-border:var(--white-10);--input-focus-bg:#ffffff12;--modal-overlay:var(--black-60);--shadow:var(--black-20)}body.light-mode{--bg-primary:var(--color-light);--bg-secondary:var(--color-light-darker);--text:var(--text-dark);--border-color:var(--black-10);--hover-bg:var(--black-07);--active-bg:#5761f21a;--input-bg:var(--black-07);--input-border:var(--black-10);--input-focus-bg:var(--black-07);--shadow:var(--black-10)}*{box-sizing:border-box;margin:0;padding:0;font-family:system-ui,sans-serif;font-weight:400}body{background-color:var(--bg-primary);color:var(--text);height:100dvh;line-height:1.6;overflow:hidden}noscript{z-index:10}noscript div.background{background-color:var(--bg-primary);width:100vw;height:100vh;position:absolute;top:0;left:0}noscript div.message{background-color:var(--bg-secondary);border-radius:var(--radius);max-width:25rem;box-shadow:0 .5rem 1rem var(--shadow);padding:var(--space-xl);text-align:center;margin:40vh auto;display:block}.app-container{height:100dvh;display:none}.sidebar{width:var(--sidebar-width);background-color:var(--bg-secondary);border-right:var(--border-width) solid var(--border-color);flex-direction:column;height:100%;display:flex}.main-content{flex-direction:column;flex:1;height:100dvh;display:flex;position:relative;overflow:hidden}.auth-container{background-color:var(--bg-secondary);border-radius:var(--radius);max-width:25rem;box-shadow:0 .5rem 1rem var(--shadow);padding:var(--space-xl);margin:5rem auto}.auth-logo{text-align:center;color:var(--color-primary);margin-bottom:var(--space-xl);font-size:var(--space-xl);font-weight:var(--font-weight-extrabold)}.auth-form h2{text-align:center;margin-bottom:var(--space-l)}.auth-form p{color:var(--color-gray);text-align:center;margin-bottom:var(--space-xl)}.auth-back{text-align:center;margin-top:1.25rem}.auth-back a{color:var(--color-primary);font-size:var(--font-size-s);text-decoration:none}.auth-back a:hover{text-decoration:underline}.auth-toggle{text-align:center;margin-top:1.25rem}.auth-toggle a{color:var(--color-primary);font-size:var(--font-size-s);text-decoration:none}.auth-toggle a:hover{text-decoration:underline}.auth-forgot-password{text-align:center;margin-top:.75rem}.auth-forgot-password a{color:var(--color-primary);font-size:var(--font-size-s);text-decoration:none}.auth-forgot-password a:hover{text-decoration:underline}#oauth-providers{gap:var(--space-s);flex-direction:column;display:flex}.oauth-btn{justify-content:center;align-items:center;gap:var(--space-s);width:100%;padding:var(--space-m) var(--space-l);border:var(--border-width) solid var(--border-color);border-radius:var(--radius);background:var(--input-bg);color:var(--text);font-size:var(--font-size-m);cursor:pointer;transition:background var(--transition), border-color var(--transition);display:flex}.oauth-btn:hover{background:var(--hover-bg);border-color:var(--color-primary)}.oauth-btn-icon{flex-shrink:0;align-items:center;display:flex}.oauth-btn-icon svg{display:block}.auth-divider{align-items:center;gap:var(--space-m);margin:var(--space-l) 0;color:var(--color-gray);font-size:var(--font-size-s);display:flex}.auth-divider:before,.auth-divider:after{content:"";height:var(--border-width);background:var(--border-color);flex:1}.helper-text{color:var(--color-gray);font-size:var(--font-size-xs);margin-top:var(--space-xs);display:block}.magic-link-message{color:var(--text-light);background-color:var(--bg-secondary);font-size:var(--font-size-s);border-radius:.25rem;margin:1.25rem 0;padding:1rem;line-height:1.5}.header{height:var(--header-height);border-bottom:var(--border-width) solid var(--border-color);background-color:var(--bg-secondary);padding:0 var(--space-l);justify-content:space-between;align-items:center;display:flex}.header h2{align-items:center;gap:var(--space-s);font-size:var(--font-size-l);font-weight:var(--font-weight-semibold);display:flex}.header h2:before{content:var(--channel-prefix,"#");color:var(--color-primary)}h2#current-channel-name{cursor:default;-webkit-user-select:none;user-select:none}.menu-toggle{cursor:pointer;color:var(--color-gray);margin-right:var(--space-m);font-size:var(--icon-size-m);display:none}.server-name{height:var(--header-height);border-bottom:var(--border-width) solid var(--border-color);cursor:pointer;transition:var(--transition);padding:0 var(--space-l);align-items:center;display:flex}.server-name:hover{background-color:var(--hover-bg)}.server-name-text{font-weight:var(--font-weight-extrabold);text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}.user-menu{cursor:pointer;align-items:center;gap:var(--space-m);display:flex;position:relative}.user-avatar{background-color:var(--color-primary);border-radius:var(--radius-circle);width:var(--avatar-size-s);height:var(--avatar-size-s);font-size:var(--font-size-s);font-weight:var(--font-weight-bold);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:flex}.user-name{font-weight:var(--font-weight-semibold);-webkit-user-select:none;user-select:none}.user-dropdown{background-color:var(--bg-secondary);border-radius:var(--radius);box-shadow:0 .2rem .5rem var(--shadow);z-index:10;min-width:7.5rem;margin-top:.25rem;display:none;position:absolute;top:100%;right:0}.user-dropdown.show{display:block}.dropdown-item{transition:var(--transition);cursor:pointer;font-size:var(--font-size-s);padding:.6rem 1rem}.dropdown-item:hover{background-color:var(--hover-bg)}.dropdown-item.danger{color:var(--color-danger)}.dropdown-item.danger:hover{background-color:#f047471a}.channels-header{color:var(--color-gray);margin-top:var(--space-s);padding:var(--space-l);font-size:var(--font-size-s);cursor:default;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;display:flex}.add-channel{cursor:pointer;color:var(--color-gray);transition:var(--transition);font-size:var(--icon-size-m)}.add-channel:hover{color:var(--color-primary)}.channels-list{padding:0 var(--space-s);flex:1;overflow-y:auto}.channel-item{cursor:pointer;transition:var(--transition);color:var(--color-gray);border-radius:var(--radius-s);margin-bottom:var(--space-xxs);padding:.5rem var(--space-s);align-items:center;display:flex}.channel-item:before{content:"#";margin-right:var(--space-s)}.channel-item:hover{background-color:var(--hover-bg);color:var(--text)}.channel-item.active{background-color:var(--active-bg);color:var(--color-primary)}.channel-settings{color:var(--color-gray);cursor:pointer;transition:var(--transition);margin-left:auto}.channel-settings:hover{color:var(--text)}.notification-badge{background-color:var(--color-primary);color:var(--white);border-radius:var(--radius-circle);min-width:1.25rem;height:1.25rem;margin-left:auto;margin-right:var(--space-s);padding:0 var(--space-xs);font-size:var(--font-size-xs);justify-content:center;align-items:center;display:flex}.dm-header{color:var(--color-gray);margin-top:var(--space-s);padding:var(--space-l);font-size:var(--font-size-s);cursor:default;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;display:flex}.start-dm{cursor:pointer;color:var(--color-gray);transition:var(--transition);font-size:var(--icon-size-m)}.start-dm:hover{color:var(--color-primary)}.dm-list{padding:0 var(--space-s);flex:1;max-height:12rem;overflow-y:auto}.dm-item{cursor:pointer;transition:var(--transition);color:var(--color-gray);border-radius:var(--radius-s);margin-bottom:var(--space-xxs);padding:.5rem var(--space-s);align-items:center;gap:var(--space-s);display:flex}.dm-item:hover{background-color:var(--hover-bg);color:var(--text)}.dm-item.active{background-color:var(--active-bg);color:var(--color-primary)}.dm-avatar{background-color:var(--color-primary);color:var(--white);border-radius:var(--radius-circle);width:1.5rem;height:1.5rem;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);flex-shrink:0;justify-content:center;align-items:center;display:flex}.dm-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.dm-user-list{max-height:15rem;overflow-y:auto}.dm-user-item{cursor:pointer;transition:var(--transition);border-radius:var(--radius-s);margin-bottom:var(--space-xs);padding:var(--space-m);align-items:center;gap:var(--space-m);display:flex}.dm-user-item:hover{background-color:var(--hover-bg)}.dm-user-item .user-avatar{width:var(--avatar-size-s);height:var(--avatar-size-s)}.dm-user-item .user-info{flex:1}.dm-user-item .user-name{font-weight:var(--font-weight-semibold)}.dm-user-item .user-email{color:var(--color-gray);font-size:var(--font-size-xs)}.messages-area{padding:var(--space-l);flex-direction:column-reverse;flex:1;display:flex;overflow-y:auto}.messages-area.drag-over{background-color:var(--active-bg);border:2px dashed var(--color-primary)}.empty-state{height:100%;color:var(--color-gray);text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:0 1.25rem;display:flex}.empty-state-icon{color:var(--color-primary);margin-bottom:var(--space-l);font-size:var(--icon-size-xl)}.empty-state h3{margin-bottom:var(--space-s)}.message-date-divider{text-align:center;color:var(--color-gray);margin:var(--space-l) 0;font-size:var(--font-size-xs);position:relative}.message-date-divider:before,.message-date-divider:after{content:"";background-color:var(--border-color);width:calc(50% - 3rem);height:var(--border-width);position:absolute;top:50%}.message-date-divider:before{left:0}.message-date-divider:after{right:0}.message{align-items:flex-start;gap:var(--space-m);padding:var(--space-s) 0;animation:var(--transition) messageAppear;display:flex}.message-avatar{background-color:var(--color-primary);color:var(--white);border-radius:var(--radius-circle);width:var(--avatar-size-m);height:var(--avatar-size-m);font-weight:var(--font-weight-bold);flex-shrink:0;justify-content:center;align-items:center;display:flex}.message-content{flex:1}.message-header{align-items:center;gap:var(--space-s);margin-bottom:var(--space-xs);display:flex}.message-author{font-weight:var(--font-weight-bold)}.message-time{color:var(--color-gray);font-size:var(--font-size-xs)}.message-text{word-break:break-word;line-height:1.5}.message-text pre{background-color:var(--bg-secondary);border-radius:var(--radius-s);padding:var(--space-m);margin:var(--space-s) 0;max-width:100%;overflow-x:auto}.message-text code{font-family:monospace;font-size:.9em}.message-text strong{font-weight:var(--font-weight-bold)}.message-text em{font-style:italic}.message-text ul,.message-text ol{margin:var(--space-s) 0;padding-left:var(--space-xl)}.message-text li{margin-bottom:var(--space-xs)}.message-text ul li{list-style-type:disc}.message-text ol li{list-style-type:decimal}.message-actions{gap:var(--space-xs);margin-top:var(--space-xs);display:flex}.message-edit,.message-delete{color:var(--color-gray);cursor:pointer;transition:var(--transition);background:var(--transparent);padding:var(--space-xxs) var(--space-xs);font-size:var(--font-size-xs);border:none;border-radius:3px}.message-edit:hover,.message-delete:hover{background-color:var(--hover-bg);color:var(--text)}.message-delete:hover{color:var(--color-danger)}.message-reactions{gap:var(--space-xs);margin-top:var(--space-xs);flex-wrap:wrap;display:flex}.reaction{background-color:var(--hover-bg);cursor:pointer;transition:var(--transition);align-items:center;gap:var(--space-xs);padding:var(--space-xxs) .5rem;font-size:var(--font-size-s);border-radius:.75rem;display:flex}.reaction.user-reacted{background-color:var(--active-bg);color:var(--color-primary)}.reaction-emoji{font-size:var(--font-size-m)}.reaction-count{font-size:var(--font-size-xs)}.add-reaction{color:var(--color-gray);cursor:pointer;transition:var(--transition);padding:var(--space-xxs) .5rem;font-size:var(--font-size-xs);border-radius:.75rem;justify-content:center;align-items:center;display:inline-flex}.add-reaction:hover{background-color:var(--hover-bg);color:var(--text)}.message-images-container{gap:var(--space-s);margin-top:var(--space-s);flex-direction:column;display:flex}.message-image-container{max-width:40rem;margin:.25rem 0}.message-image{border-radius:var(--radius);cursor:pointer;max-width:100%;transition:filter var(--transition)}.message-image:hover{filter:brightness(1.1)}.image-preview-container{background-color:var(--transparent);justify-content:center;align-items:center;width:auto;max-height:90vh;margin:0 auto;display:flex;position:relative;max-width:90vw!important}#preview-image{object-fit:contain;width:100%;max-width:90vw;max-height:85vh;margin:0 auto;display:block}.input-area{border-top:var(--border-width) solid var(--border-color);padding:var(--space-l)}.message-input-container{background-color:var(--bg-secondary);border-radius:var(--radius);position:relative;overflow:hidden}.message-input{width:100%;min-height:var(--input-height);max-height:10rem;color:var(--text);resize:none;background-color:var(--transparent);font-size:var(--font-size-m);border:none;padding:1rem 3rem 1rem 2.5rem;overflow-y:auto}.message-input:focus{outline:none}.send-button{color:var(--color-primary);cursor:pointer;transition:var(--transition);background:var(--transparent);font-size:var(--icon-size-m);border:none;position:absolute;bottom:.9rem;right:.6rem}.send-button:hover{color:var(--color-primary-light)}.message-attachments{gap:.6rem;display:flex;position:absolute;bottom:.9rem;left:.6rem}.attach-image{cursor:pointer;color:var(--color-gray);transition:var(--transition);font-size:var(--icon-size-m)}.attach-image:hover{color:var(--color-primary)}.pending-uploads-container{margin-top:var(--space-s);border-radius:var(--radius-s);background-color:var(--bg-secondary);padding:var(--space-s)}.pending-uploads{gap:var(--space-s);flex-wrap:wrap;display:flex}.pending-upload{width:5rem;height:5rem;position:relative}.pending-upload img{object-fit:cover;border-radius:var(--radius-s);width:100%;height:100%}.remove-upload{background-color:var(--color-danger);color:#fff;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:1.25rem;height:1.25rem;font-size:.75rem;display:flex;position:absolute;top:-.5rem;right:-.5rem}.form-group{margin-bottom:var(--space-l)}label{color:var(--color-gray);margin-bottom:var(--space-s);font-size:var(--font-size-s);display:block}input[type=text],input[type=email],input[type=password]{width:100%;height:var(--input-height);background-color:var(--input-bg);border:var(--border-width) solid var(--input-border);border-radius:var(--radius);color:var(--text);transition:var(--transition);padding:0 var(--space-l);font-size:var(--font-size-m)}input[type=text]:focus,input[type=email]:focus,input[type=password]:focus{border-color:var(--color-primary);background-color:var(--input-focus-bg);outline:none}.btn{width:100%;height:var(--input-height);background-color:var(--color-primary);color:var(--white);border-radius:var(--radius);cursor:pointer;transition:var(--transition);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);border:none}.btn:hover{background-color:var(--color-primary-light)}.btn-secondary{background-color:var(--hover-bg)}.btn-secondary:hover{background-color:var(--input-focus-bg)}.btn-danger{background-color:var(--color-danger)}.btn-danger:hover{background-color:var(--color-danger-light)}.close-modal{color:var(--white);z-index:2;background-color:var(--black-50);border-radius:var(--radius-circle);width:2rem;height:2rem;font-size:var(--font-size-l);justify-content:center;align-items:center;display:flex;position:absolute;top:.6rem;right:.6rem}.close-modal:hover{color:var(--text);cursor:pointer}.modal-backdrop{background-color:var(--modal-overlay);z-index:100;opacity:0;visibility:hidden;width:100%;height:100%;transition:var(--transition);justify-content:center;align-items:center;display:flex;position:fixed;top:0;left:0}.modal-backdrop.active{opacity:1;visibility:visible}.modal{background-color:var(--bg-secondary);border-radius:var(--radius);width:100%;max-width:25rem;max-height:90vh;padding:var(--space-xl);transition:var(--transition);overflow-y:auto;transform:translateY(-1.25rem)}.modal textarea{padding:0}.modal-backdrop.active .modal{transform:translateY(0)}.modal-header{margin-bottom:var(--space-l);justify-content:space-between;align-items:center;display:flex}.modal-title{font-size:var(--font-size-l);font-weight:var(--font-weight-bold);cursor:default;-webkit-user-select:none;user-select:none}.modal-actions{gap:.6rem;display:flex}.reaction-picker{gap:var(--space-s);max-height:12.5rem;padding:var(--space-s);flex-wrap:wrap;display:flex;overflow-y:auto}.reaction-item{cursor:pointer;width:var(--avatar-size-s);height:var(--avatar-size-s);transition:var(--transition);border-radius:var(--radius-s);font-size:var(--icon-size-m);justify-content:center;align-items:center;display:flex}.reaction-item:hover{background-color:var(--hover-bg)}.image-wrapper{max-width:100%;display:inline-block;position:relative}.remove-image-btn{background-color:var(--color-danger);color:#fff;cursor:pointer;z-index:2;opacity:0;width:1.5rem;height:1.5rem;transition:opacity var(--transition);border-radius:50%;justify-content:center;align-items:center;font-size:1rem;display:flex;position:absolute;top:.5rem;right:.5rem}.image-wrapper:hover .remove-image-btn{opacity:1}.message-image{max-width:100%;display:block}.toast{border-radius:var(--radius);background-color:var(--bg-secondary);color:var(--text);box-shadow:0 .25rem .75rem var(--shadow);z-index:-1;opacity:0;padding:var(--space-m) var(--space-xl);cursor:default;-webkit-user-select:none;user-select:none;transition:opacity .3s,transform .3s;position:fixed;top:1.25rem;right:1.25rem;transform:translateY(-.6rem)}.toast.success{border-left:var(--border-width-accent) solid var(--color-success)}.toast.error{border-left:var(--border-width-accent) solid var(--color-danger)}.toast.info{border-left:var(--border-width-accent) solid var(--color-primary)}.toast.show{opacity:1;z-index:1000;transform:translateY(0)}.offline-bar{background-color:var(--color-danger);color:var(--white);text-align:center;padding:var(--space-xs) var(--space-m);font-size:var(--font-size-small);z-index:1001;font-weight:600;display:none;position:fixed;top:0;left:0;right:0}.offline-bar.visible{display:block}.loading{z-index:1000;background-color:var(--black-50);justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.loading-spinner{border:.25rem solid var(--white-10);border-top-color:var(--color-primary);border-radius:var(--radius-circle);width:3rem;height:3rem;animation:1s linear infinite spin}.theme-switch{cursor:pointer;border-top:var(--border-width) solid var(--border-color);padding:.6rem var(--space-l);align-items:center;margin-top:auto;display:flex}.theme-switch-icon{font-size:var(--icon-size-s);margin-right:.6rem}.theme-switch-label{color:var(--color-gray);font-size:var(--font-size-s)}.settings-section{border-bottom:var(--border-width) solid var(--border-color);margin-bottom:var(--space-xl);padding-bottom:var(--space-l)}.settings-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.settings-section-title{margin-bottom:var(--space-l);font-size:var(--font-size-l);font-weight:var(--font-weight-bold)}.add-user-form{margin-bottom:var(--space-l)}.role-selection{gap:var(--space-m);margin-top:.25rem;display:flex}.role-option{cursor:pointer;align-items:center;display:flex}.user-item{border-radius:var(--radius-s);margin-bottom:var(--space-s);background-color:var(--black-10);align-items:center;padding:.6rem;display:flex}.user-item .user-avatar{width:var(--avatar-size-s);height:var(--avatar-size-s);border-radius:var(--radius-circle);background-color:var(--color-primary);color:var(--white);font-size:var(--font-size-xs);flex-shrink:0;justify-content:center;align-items:center;margin-right:.6rem;display:flex}.user-item .user-info{flex:1}.user-item .user-email{font-weight:var(--font-weight-semibold);word-break:break-all}.user-role{font-size:var(--font-size-xs);padding:var(--space-xxs) .5rem;margin-top:var(--space-xxs);border-radius:.6rem;display:inline-block}.admin-role{background-color:var(--color-admin-role);color:var(--white)}.user-role{background-color:var(--color-user-role);color:var(--white)}.user-created{font-size:var(--font-size-xs);color:var(--color-gray-text);margin-top:var(--space-xxs)}.user-actions{gap:.25rem;display:flex}.remove-user{cursor:pointer;color:var(--color-admin-role);font-size:var(--font-size-l);opacity:.7;transition:opacity var(--transition);background:0 0;border:none;padding:.25rem}.remove-user:hover{opacity:1}.empty-list{color:var(--color-gray-text);text-align:center;padding:.6rem;font-style:italic}.message-link,.channel-link{color:var(--color-primary);transition:var(--transition);text-decoration:none}.message-link:hover,.channel-link:hover{text-decoration:underline}.channel-link{font-weight:var(--font-weight-semibold)}.users-list-placeholder{color:var(--color-gray);padding:var(--space-s) 0;font-size:var(--font-size-s)}@keyframes messageAppear{0%{opacity:0;transform:translateY(.6rem)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=768px){.sidebar{z-index:10;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);transition:left .3s;position:fixed;top:0;left:-100%}.sidebar.open{left:0}.menu-toggle{display:block}.header{padding-left:calc(var(--space-s) + env(safe-area-inset-left));padding-right:calc(var(--space-s) + env(safe-area-inset-right))}.input-area{padding:var(--space-s) calc(var(--space-s) + env(safe-area-inset-right)) calc(var(--space-s) + env(safe-area-inset-bottom)) calc(var(--space-s) + env(safe-area-inset-left))}.messages-area{padding:var(--space-s)}.message-input{font-size:var(--font-size-s);padding:.75rem 2.5rem .75rem 2.25rem}.message-attachments{bottom:.65rem;left:.5rem}.send-button{bottom:.65rem;right:.5rem}.message-avatar{width:var(--avatar-size-s);height:var(--avatar-size-s);font-size:var(--font-size-xs)}.message{gap:var(--space-s)}.message-author,.message-text{font-size:var(--font-size-s)}.header h2{font-size:var(--font-size-m)}.user-name{display:none}.modal{max-width:calc(100vw - 2rem);margin:var(--space-l);padding:var(--space-l)}.toast{left:var(--space-l);right:var(--space-l);top:calc(var(--space-l) + env(safe-area-inset-top))}.auth-container{margin:2rem var(--space-l) var(--space-l);padding:var(--space-l);max-width:none}.auth-logo{margin-bottom:var(--space-l)}.auth-form h2{font-size:var(--font-size-l);margin-bottom:var(--space-m)}.auth-form p{margin-bottom:var(--space-l);font-size:var(--font-size-s)}.form-group{margin-bottom:var(--space-m)}.offline-bar{padding-top:calc(var(--space-xs) + env(safe-area-inset-top))}.message-image-container{max-width:100%}}@media (width<450px){noscript div.message{margin-left:1rem;margin-right:1rem}.auth-container{margin-top:var(--space-xl);margin-left:var(--space-m);margin-right:var(--space-m);padding:var(--space-l)}.auth-logo{font-size:var(--font-size-l);margin-bottom:var(--space-m)}}@media (width<375px){:root{--font-size-xs:.7rem;--font-size-s:.8rem;--font-size-m:.875rem;--font-size-l:1.05rem;--header-height:3rem;--input-height:2.75rem;--avatar-size-s:1.75rem;--avatar-size-m:2rem}.auth-container{margin-top:var(--space-l);margin-left:var(--space-s);margin-right:var(--space-s);padding:var(--space-m)}.auth-form h2{font-size:var(--font-size-m)}.message-input{padding:.6rem 2.25rem .6rem 2rem}.input-area{padding:var(--space-xs) calc(var(--space-xs) + env(safe-area-inset-right)) calc(var(--space-xs) + env(safe-area-inset-bottom)) calc(var(--space-xs) + env(safe-area-inset-left))}.messages-area{padding:var(--space-xs)}.modal{margin:var(--space-s);padding:var(--space-m);max-width:calc(100vw - 1rem)}.modal-header{margin-bottom:var(--space-m)}.channels-header,.dm-header{padding:var(--space-m)}.server-name{padding:0 var(--space-m)}.reaction-picker{gap:var(--space-xs)}.reaction-item{width:1.75rem;height:1.75rem}}.thread-panel{border-left:var(--border-width) solid var(--border-color);background:var(--bg-primary);flex-direction:column;flex-shrink:0;width:400px;max-width:100%;height:100dvh;display:none}.thread-panel.active{display:flex}.thread-header{padding:var(--space-l);border-bottom:var(--border-width) solid var(--border-color);justify-content:space-between;align-items:center;display:flex}.thread-title{font-weight:var(--font-weight-bold);font-size:var(--font-size-l)}.close-thread{cursor:pointer;color:var(--color-gray);transition:var(--transition);background:0 0;border:none;font-size:1.5em}.close-thread:hover{color:var(--color-primary)}.thread-parent{padding:var(--space-m) var(--space-l);border-bottom:var(--border-width) solid var(--border-color);background:var(--bg-secondary)}.thread-parent-message{margin:0;padding:0}.thread-divider{padding:var(--space-s) var(--space-l);font-size:var(--font-size-s);color:var(--color-gray);border-bottom:var(--border-width) solid var(--border-color);font-weight:var(--font-weight-semibold)}.thread-messages{padding:var(--space-s) 0;flex:1;overflow-y:auto}.thread-messages .message{padding:var(--space-s) var(--space-l)}.thread-messages .empty-state{padding:var(--space-xl);text-align:center;color:var(--color-gray)}.thread-input-area{gap:var(--space-s);padding:var(--space-m) var(--space-l);border-top:var(--border-width) solid var(--border-color);align-items:flex-end;display:flex}.thread-input-area .message-input{flex:1;min-height:40px;max-height:120px}.thread-badge{align-items:center;gap:var(--space-s);padding:var(--space-xs) var(--space-s);margin-top:var(--space-xs);cursor:pointer;color:var(--color-primary);font-size:var(--font-size-s);border-radius:var(--border-radius);transition:var(--transition);display:flex}.thread-badge:hover{background:var(--bg-secondary)}.thread-badge-count{font-weight:var(--font-weight-bold)}.thread-badge-last{color:var(--color-gray)}.start-thread{cursor:pointer;font-size:var(--font-size-xs);color:var(--color-gray);transition:var(--transition);padding:var(--space-xxs) .5rem}.start-thread:hover{color:var(--color-primary)}@media (width<=768px){.thread-panel{z-index:100;width:100%;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);position:fixed;top:0;bottom:0;right:0}.thread-input-area{padding-bottom:calc(var(--space-m) + env(safe-area-inset-bottom))}.thread-input-area .message-input{min-height:36px;font-size:var(--font-size-s)}}.bot-badge{background-color:var(--color-primary);color:var(--white);font-size:.6rem;font-weight:var(--font-weight-bold);text-transform:uppercase;border-radius:var(--radius-s);margin-left:var(--space-s);vertical-align:middle;padding:.1rem .35rem;display:inline-block}#server-settings-modal .modal{max-width:36rem}.webhook-item{padding:var(--space-m);border-bottom:var(--border-width) solid var(--border-color);justify-content:space-between;align-items:center;display:flex}.webhook-info{flex:1}.webhook-name{font-weight:var(--font-weight-bold);color:var(--text)}.webhook-channel{font-size:var(--font-size-s);color:var(--color-gray);margin-top:.15rem}.webhook-url-row{align-items:center;gap:var(--space-s);margin-top:var(--space-s);display:flex}.webhook-url{font-size:var(--font-size-s);background-color:var(--input-bg);padding:var(--space-xs) var(--space-s);border-radius:var(--radius-s);white-space:nowrap;color:var(--text);flex:1;overflow-x:auto}.webhook-copy-url{width:auto;padding:0 var(--space-m);height:1.75rem;font-size:var(--font-size-s);flex-shrink:0}.webhook-actions .remove-webhook{color:var(--color-danger);cursor:pointer;font-size:var(--font-size-l);padding:var(--space-s);background:0 0;border:none}.webhook-token-display{background-color:var(--bg-secondary);border:var(--border-width) solid var(--color-primary);border-radius:var(--radius);padding:var(--space-m);margin-bottom:var(--space-m)}.webhook-token-label{font-size:var(--font-size-s);color:var(--color-primary);font-weight:var(--font-weight-bold);margin-bottom:var(--space-s)}.webhook-token-value{background-color:var(--input-bg);padding:var(--space-s) var(--space-m);border-radius:var(--radius-s);font-size:var(--font-size-s);word-break:break-all;margin-bottom:var(--space-s);color:var(--text);display:block}.webhook-token-copy,.webhook-token-copy-url{width:auto;padding:0 var(--space-l);height:2rem;font-size:var(--font-size-s);margin-bottom:var(--space-m)}.add-webhook-form{margin-bottom:var(--space-l)}.add-webhook-form select{width:100%;height:var(--input-height);background-color:var(--input-bg);border:var(--border-width) solid var(--input-border);border-radius:var(--radius);color:var(--text);padding:0 var(--space-l);font-size:var(--font-size-m)}