:root:not([data-theme="dark"]) .chat-area::before { background-color: #786391; background-image: none; opacity: .19; mix-blend-mode: normal; }
#customContextMenu { width: min(310px,calc(100vw - 16px)); box-sizing: border-box; overscroll-behavior: contain; touch-action: pan-y; padding: 6px; }
#customContextMenu li { min-height: 46px; box-sizing: border-box; white-space: normal; border-radius: 12px; }
.reaction-picker { min-width: 0; padding: 4px 0 8px; gap: 0; }
.reaction-picker button { min-width: 0; font-size: 22px; }
.feature-dialog,.feature-card { box-sizing: border-box; }
.feature-dialog { padding: 16px; }
.feature-card { overscroll-behavior: contain; }
.bio-field { position: relative; }
#settingsSidebar .bio-field #bioInput { min-height: 70px; height: 70px; resize: none; padding: 10px 14px 24px; line-height: 20px; }
.field-count { position: absolute; inset-inline-end: 12px; bottom: 7px; color: var(--muted); font-size: 11px; line-height: 14px; pointer-events: none; font-variant-numeric: tabular-nums; }
.birthday-field { display: block; width: 100%; min-height: 48px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); color: var(--text); text-align: start; padding: 12px 14px; }
.birthday-card { display: grid; gap: 14px; padding: 20px; }
.sheet-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sheet-heading h2 { margin: 0; }
.sheet-heading .ui-icon-button { padding: 0; font-size: 26px; }
.birthday-wheels { display: grid; grid-template-columns: minmax(50px,.8fr) minmax(100px,1.65fr) minmax(64px,1fr); position: relative; height: 220px; }
.birthday-wheel { height: 220px; overflow-y: auto; overscroll-behavior: contain; scroll-snap-type: y mandatory; scrollbar-width: none; box-sizing: border-box; padding-block: 88px; z-index: 1; mask-image: linear-gradient(transparent,#000 36%,#000 64%,transparent); -webkit-mask-image: linear-gradient(transparent,#000 36%,#000 64%,transparent); }
.birthday-wheel::-webkit-scrollbar { display: none; }
.birthday-option { display: grid; place-items: center; text-align: center; height: 44px; box-sizing: border-box; scroll-snap-align: center; cursor: pointer; font-size: 18px; color: var(--muted); user-select: none; }
.birthday-option[aria-selected="true"] { color: var(--text); font-weight: 650; }
.birthday-month .birthday-option { font-size: clamp(13px,3.9vw,18px); }
.birthday-selection { position: absolute; top: 88px; height: 44px; inset-inline: 0; border-radius: 12px; background: var(--accent-soft); border-block: 1px solid var(--accent); pointer-events: none; }
.birthday-remove { color: var(--accent); background: transparent; border: 0; }
.birthday-dialog { z-index: 5200; }
.community-card { display: grid; gap: 16px; width: min(440px,100%); padding: 24px; }
.community-avatar-button { position: relative; display: grid; place-items: center; width: 82px; height: 82px; border-radius: 50%; border: 0; background: var(--accent-soft); color: var(--accent); justify-self: center; padding: 0!important; overflow: hidden; }
.community-avatar-button img { width: 100%; height: 100%; object-fit: cover; }
.community-avatar-button .avatar-camera { position: absolute; bottom: 0; inset-inline: 0; background: #0006; color: #fff; height: 26px; display: grid; place-items: center; font-size: 13px; }
.community-field { display: grid; gap: 7px; margin: 0; min-width: 0; }
.community-field > span { font-size: 13px; color: var(--muted); }
.community-card input,.community-card textarea { background: var(--surface-soft); border-radius: 14px; border: 1px solid var(--border); min-width: 0; padding: 12px 14px; width: 100%; box-sizing: border-box; }
.community-card textarea { resize: none; min-height: 76px; height: 76px; line-height: 22px; }
.username-field { position: relative; }
.username-field .username-prefix { position: absolute; left: 14px; top: 13px; color: var(--muted); }
.username-field input { padding: 12px 14px 26px 33px; direction: ltr; }
.username-field input[aria-invalid="true"] { border-color: var(--danger); box-shadow: inset 0 -1px var(--danger); }
.username-field .field-count { right: 12px; }
.community-card .feature-actions { margin: 0; }
.community-error:empty,.community-error[hidden] { display: none; }
.community-card .community-error { color: var(--danger); margin: -6px 0 0; font-size: 12px; line-height: 1.4; }
.is-channel #chatavatar-wrapper .online-indicator-big,.is-channel #presenceInline,.is-channel #typingIndicator { display: none!important; }
.channel-avatar { overflow: hidden; }
.channel-avatar img { width: 100%; height: 100%; object-fit: cover; }
#sidebar.community-info { overflow-y: auto!important; background: var(--surface)!important; }
#sidebar .community-profile { display: flex; flex-direction: column; gap: 10px; padding: 30px 20px 20px; align-items: center; text-align: center; }
#sidebar .community-profile > img { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; background: var(--accent-soft); }
.community-profile h2 { font-size: 22px; margin: 4px 0 0; overflow-wrap: anywhere; color: var(--text); }
.community-profile p { margin: 0; font-size: 13px; color: var(--muted); }
.community-details { padding: 0 20px 20px; display: grid; gap: 12px; }
.community-description { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 15px; line-height: 1.5; margin: 0; color: var(--text); }
.community-copy { display: grid; gap: 5px; width: 100%; text-align: start; border: 1px solid var(--border); padding: 12px; border-radius: 14px; background: var(--surface-soft); color: var(--text); }
.community-copy span { color: var(--muted); font-size: 12px; }
.community-copy strong { font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.community-members { padding: 0 16px 20px; }
.community-members h3 { font-size: 14px; color: var(--muted); margin: 0 0 10px; }
.community-member { display: flex; align-items: center; gap: 10px; min-height: 60px; }
.community-member img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.community-member .member-name { min-width: 0; flex: 1; overflow-wrap: anywhere; font-size: 14px; }
.creator-tag { padding: 4px 7px; border-radius: 8px; color: var(--accent); background: var(--accent-soft); font-size: 11px; }
.community-member button { color: var(--danger); background: transparent; border: 0; min-width: 40px; height: 44px; font-size: 21px; }
#memberRemoveModal { z-index: 5300; }
.media-toolbar .media-download { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; border: 0; border-radius: 12px; background: #ffffff14; color: white; }
.media-download svg { width: 24px; height: 24px; }
.media-download[aria-busy="true"] svg { animation: upload-spin 1s linear infinite; }
@media(max-width:737px) { .birthday-dialog { align-items: end; padding: 8px; }.birthday-card { width: 100%; border-radius: 24px 24px 18px 18px; padding-bottom: max(18px,var(--sab,0px)); }.community-card { padding: 20px; gap: 14px; } }
@media(max-height:520px) { .birthday-wheels,.birthday-wheel { height: 132px; }.birthday-wheel { padding-block: 44px; }.birthday-selection { top: 44px; }.birthday-card { gap: 8px; padding: 12px 18px; } }

#renameChat[hidden],.input-area[hidden]{display:none!important}
.channel-join-bar{min-height:48px;display:grid;align-content:center}
.channel-join-bar .ui-muted{padding:4px 0;font-size:14px;line-height:20px}
.verified-badge{display:inline-flex;flex:0 0 18px;width:18px;height:18px;color:#2488e8;vertical-align:middle}
.verified-badge svg{display:block;width:100%;height:100%}
[data-theme="dark"] .verified-badge{color:#58a9ff}
.channel-heading,.header .chat-name-text.channel-heading{display:flex;align-items:center;gap:6px;min-width:0}
.channel-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.channel-heading>.channel-title{flex:0 1 auto}
.channel-heading>i{flex-shrink:0;margin-inline-end:0!important}
.community-profile h2.channel-heading{justify-content:center}
.community-info-loading{display:block;width:24px;height:24px;margin:16px auto;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:upload-spin .8s linear infinite}
.clock-text{white-space:nowrap}
