@font-face {
  font-family: 'IRANSansWeb';
  src: url('../fonts/IRANSansWeb.ttf') format('truetype');
  font-weight: normal; font-style: normal; font-display: swap;
}

/* Mobile polish: keep header compact + make badge readable */
@media (max-width: 520px) {
  .main-header { padding: 0 12px; height: 60px; }
  .header-left { gap: 10px; }
  .header-search { width: 100%; }
  /* smaller height on mobile (requested) */
  .live-search { width: 100%; border-radius: 16px; padding: 6px 10px; font-size: 13px; height: 34px; }
  .unread-badge { --ub-size: 20px; font-size: 12px; }
}

:root {
  --bg-deep: #1A2735;
  --bg-elevated: #1A2735;
  --glass: rgba(43, 53, 67, 0.92);
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  --text: #f8fafc;
  --text-muted: #9baec1;
  --primary: #007aff;
  --incoming: var(--bg-elevated);
  --outgoing: #1A2735;
  --accent: #38bdf8;
  --danger: #ef4444;
  
  /* Secondary Profile Colors */
  --sec-bg: #1A2735;
  --sec-border: rgba(255, 255, 255, 0.08);
  --sec-label: #94a3b8;
  --sec-link: #3b82f6;

  --font: "IRANSansWeb", Tahoma, sans-serif;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
.app-body, .app-body *:not(input):not(textarea):not(select):not(option):not([contenteditable="true"]):not(.allow-native-select) {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
.room-item, .user-item, .msg-row, .msg-bubble, .pop-btn, .icon-btn, .story-chip, .story-nav, .pinned-chip, .ls-item {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

html, body { height: 100%; margin: 0; overflow: hidden; background: var(--bg-deep); }
body { font-family: var(--font); color: var(--text); display: flex; flex-direction: column; position: absolute; inset: 0; -webkit-font-smoothing: antialiased; }
:root { --app-vh: 100vh; }
@supports (height: 100dvh) {
  :root { --app-vh: 100dvh; }
}

.app-toast{
  position: fixed;
  left: 50%;
  bottom: 108px;
  transform: translateX(-50%);
  min-width: min(320px, calc(100vw - 28px));
  max-width: calc(100vw - 28px);
  padding: 12px 16px;
  border-radius: 18px;
  display: none;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: rgba(15,23,42,0.92);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 12px 32px rgba(0,0,0,0.30);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  z-index: 12000;
  font-size: 13px;
  line-height: 1.6;
}
.app-toast.success{ background: rgba(8, 122, 74, 0.94); }
.app-toast.error{ background: rgba(127, 29, 29, 0.96); }
.app-toast.show{ display:flex; animation: toastIn .18s ease-out; }
@keyframes toastIn { from { opacity:0; transform:translateX(-50%) translateY(8px);} to { opacity:1; transform:translateX(-50%) translateY(0);} }

.install-pwa-btn{
  position: fixed;
  left: 50%;
  bottom: 156px;
  transform: translateX(-50%);
  z-index: 11990;
  border: 0;
  border-radius: 999px;
  min-height: 42px;
  padding: 10px 18px;
  background: linear-gradient(135deg, #2aabee, #1d4ed8);
  color: #fff;
  font-weight: 800;
  box-shadow: 0 12px 28px rgba(29,78,216,0.28);
}

.app-confirm{
  position: fixed;
  inset: 0;
  z-index: 13000;
  background: linear-gradient(180deg, rgba(2,6,23,0.34) 0%, rgba(2,6,23,0.58) 100%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.app-confirm-card{
  position: relative;
  width:min(420px, calc(100vw - 28px));
  border-radius:30px;
  padding:26px 22px 20px;
  background: linear-gradient(180deg, rgba(7,18,37,0.97) 0%, rgba(10,21,43,0.98) 100%);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow: 0 24px 60px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.05);
  overflow: hidden;
}
.app-confirm-card::before{
  content: '';
  position: absolute;
  top: 0;
  left: 18px;
  right: 18px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(239,68,68,0.18) 0%, rgba(244,63,94,0.95) 50%, rgba(239,68,68,0.18) 100%);
}
.app-confirm-text{
  font-size: 18px;
  color: #f8fafc;
  line-height: 2;
  margin-bottom: 18px;
  text-align: center;
  font-weight: 800;
  letter-spacing: -0.2px;
}
.app-confirm-actions{
  display:flex;
  gap:12px;
  justify-content:center;
}
.app-confirm-actions .btn-secondary,
.app-confirm-actions .btn-danger{
  min-width: 126px;
  min-height: 52px;
  padding: 14px 20px;
  border-radius: 18px;
  font-size: 18px;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(2,6,23,0.22);
}
.app-confirm-actions .btn-secondary{
  background: linear-gradient(180deg, rgba(6,11,67,0.96) 0%, rgba(2,5,31,0.98) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  color: #f8fafc;
}
.app-confirm-actions .btn-danger{
  background: linear-gradient(180deg, #ff5a5f 0%, #ef4444 100%);
  border: 1px solid rgba(255,255,255,0.08);
  color: #fff;
  box-shadow: 0 14px 30px rgba(239,68,68,0.30);
}
.app-confirm-actions .btn-secondary:active,
.app-confirm-actions .btn-danger:active{
  transform: scale(0.97);
}
@media (max-width: 520px){
  .app-confirm-card{
    width: min(390px, calc(100vw - 24px));
    border-radius: 26px;
    padding: 24px 18px 18px;
  }
  .app-confirm-text{
    font-size: 16px;
  }
  .app-confirm-actions .btn-secondary,
  .app-confirm-actions .btn-danger{
    min-width: 110px;
    min-height: 48px;
    font-size: 16px;
    border-radius: 16px;
  }
}

.room-action-sheet,
.room-delete-modal{
  position: fixed;
  inset: 0;
  z-index: 13100;
  display: none;
}
.room-action-sheet-backdrop,
.room-delete-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(2,6,23,0.46);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
  transition: opacity .18s ease;
}
.room-action-sheet-panel{
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  border-radius: 28px;
  padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, rgba(11,22,44,0.98) 0%, rgba(7,16,32,0.99) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 26px 60px rgba(0,0,0,0.36), inset 0 1px 0 rgba(255,255,255,0.04);
  transform: translateY(24px);
  opacity: 0;
  transition: transform .22s ease, opacity .22s ease;
}
.room-action-sheet.show .room-action-sheet-backdrop,
.room-delete-modal.show .room-delete-backdrop{ opacity: 1; }
.room-action-sheet.show .room-action-sheet-panel{ transform: translateY(0); opacity: 1; }
.room-action-sheet-handle{
  width: 54px;
  height: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,0.18);
  margin: 2px auto 12px;
}
.room-action-sheet-head{
  text-align: center;
  padding: 0 10px 10px;
}
.room-action-sheet-title{
  color: #f8fafc;
  font-size: 18px;
  font-weight: 900;
}
.room-action-sheet-subtitle{
  color: rgba(226,232,240,0.72);
  font-size: 13px;
  margin-top: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.room-action-sheet-items{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.room-action-item{
  width: 100%;
  border: 0;
  background: rgba(255,255,255,0.04);
  color: #f8fafc;
  min-height: 56px;
  border-radius: 18px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 850;
}
.room-action-item:active{ transform: scale(.985); }
.room-action-item.danger{
  color: #ffb7b7;
  background: rgba(239,68,68,0.10);
}
.room-action-icon{
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  opacity: 0.96;
}
.room-action-text{ flex: 1; text-align: right; }
.room-delete-modal{
  align-items: center;
  justify-content: center;
  z-index: 13120;
}
.room-delete-card{
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(420px, calc(100vw - 28px));
  transform: translate(-50%, calc(-50% + 16px)) scale(.96);
  opacity: 0;
  transition: transform .18s ease, opacity .18s ease;
  border-radius: 28px;
  padding: 24px 20px 18px;
  text-align: center;
  background: linear-gradient(180deg, rgba(11,22,44,0.99) 0%, rgba(7,16,32,0.99) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 28px 68px rgba(0,0,0,0.44);
}
.room-delete-modal.show .room-delete-card{ transform: translate(-50%, -50%) scale(1); opacity: 1; }
.room-delete-icon-wrap{
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffb4b4;
  background: radial-gradient(circle at 50% 35%, rgba(255,120,120,0.26), rgba(239,68,68,0.12));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 16px 36px rgba(239,68,68,0.14);
}
.room-delete-title{
  font-size: 20px;
  font-weight: 900;
  color: #fff;
  margin-bottom: 8px;
}
.room-delete-text{
  color: rgba(226,232,240,0.84);
  line-height: 1.95;
  font-size: 15px;
  margin-bottom: 18px;
}
.room-delete-actions{
  display: flex;
  gap: 10px;
}
.room-delete-actions .btn-secondary,
.room-delete-actions .btn-danger{
  flex: 1;
  min-height: 50px;
  border-radius: 16px;
  font-size: 16px;
  font-weight: 900;
}
@media (max-width: 520px){
  .room-action-sheet-panel{ left: 10px; right: 10px; bottom: 8px; border-radius: 24px; }
  .room-action-item{ min-height: 54px; font-size: 15px; border-radius: 16px; }
  .room-delete-card{ width: min(390px, calc(100vw - 22px)); border-radius: 24px; padding: 22px 16px 16px; }
  .room-delete-title{ font-size: 18px; }
  .room-delete-text{ font-size: 14px; }
}

.view-main { flex: 1; display: flex; flex-direction: column; height: 100%; width: 100%; overflow-y: auto; overflow-x: hidden; scroll-behavior: smooth; background: var(--bg-deep); }
.view-chat { min-height: var(--app-vh); position: absolute; inset: 0; z-index: 200; display: flex; flex-direction: column; background: var(--bg-deep); height: 100%; width: 100%; overflow-x: hidden; overscroll-behavior-x: none; touch-action: pan-y; animation: chatSlideIn 0.3s cubic-bezier(0.2, 0.9, 0.3, 1) forwards; }
@keyframes chatSlideIn { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
body.chat-open .bottom-nav { display: none !important; }

.page-content { flex: 1 0 auto; overflow: visible; padding-bottom: 90px; display: none; opacity: 0; }
.page-content.active-page { display: block; animation: pageFadeSlide 0.3s cubic-bezier(0.2, 0.9, 0.3, 1) forwards; }
@keyframes pageFadeSlide { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } }

.ui-icon { width: 24px; height: 24px; display: block; object-fit: contain; filter: brightness(0) invert(1); }
.ui-icon-small { width: 16px; height: 16px; display: inline-block; object-fit: contain; vertical-align: middle; margin: 0 4px; filter: brightness(0) invert(1); }

.main-header { height: 64px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; background: transparent; flex-shrink: 0; flex-direction: row-reverse; }
.chat-header { height: 64px; padding: 0 16px; display: flex; align-items: center; background: var(--glass); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid var(--glass-border); flex-shrink: 0; position: relative; z-index: 1000; width: 100%; }

.header-content { display: flex; align-items: center; width: 100%; height: 100%; gap: 8px; overflow: visible; min-width: 0; }
.chat-header-actions { position: relative; display: flex; align-items: center; justify-content: center; gap: 2px; flex-shrink: 0; }
.chat-search-header-btn { color: #fff; }
.chat-search-header-btn:hover { background: rgba(255,255,255,0.08); }
.chat-header-search-svg { width: 24px; height: 24px; display: block; fill: none; stroke: currentColor; stroke-width: 2.15; stroke-linecap: round; stroke-linejoin: round; }
.chat-menu-btn .dots-icon { font-size: 22px; line-height: 1; color: var(--text); transform: translateY(-1px); }
.chat-popup-menu { top: calc(100% - 4px); right: 0; width: 210px; }
.chat-search-panel { display: flex; align-items: center; gap: 10px; padding: 10px 14px 8px; background: var(--glass); border-bottom: 1px solid var(--glass-border); }
.message-selection-bar { display:flex; align-items:center; gap:12px; padding: 10px 14px; background: rgba(10,16,28,0.88); border-bottom: 1px solid rgba(255,255,255,0.08); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); position: relative; z-index: 910; }
.message-selection-close { width: 38px; height: 38px; border-radius: 12px; color: var(--text); font-size: 17px; flex-shrink: 0; }
.message-selection-copy { min-width: 0; flex: 1; display:flex; flex-direction:column; gap:2px; }
.message-selection-label { font-size: 11px; font-weight: 800; color: var(--primary); }
.message-selection-count { font-size: 14px; font-weight: 800; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.message-selection-select-all { width:auto; min-width: 86px; padding: 10px 14px; border-radius: 12px; font-size: 13px; flex-shrink: 0; }
.chat-search-input { flex: 1; min-width: 0; border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.04); color: var(--text); border-radius: 14px; padding: 10px 12px; outline: none; font-family: inherit; font-size: 14px; }
.chat-search-input:focus { border-color: rgba(42,171,238,0.45); box-shadow: 0 0 0 3px rgba(42,171,238,0.10); }
.chat-search-side { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.chat-search-count { min-width: 56px; text-align: center; font-size: 12px; color: var(--text-muted); font-weight: 700; }
.chat-search-nav-btn { min-width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; color: var(--text); font-size: 13px; }
.chat-meta-click { display: flex; align-items: center; gap: 12px; flex: 1; height: 100%; cursor: pointer; overflow: hidden; padding: 4px; }
.chat-avatar { width: 42px; height: 42px; min-width: 42px; border-radius: 50%; background: transparent; display: flex; align-items: center; justify-content: center; overflow: visible; font-weight: 700; color: #fff; flex-shrink: 0; position: relative; }
.chat-avatar .avatar-media { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; background: var(--bg-elevated); border: 1px solid var(--glass-border); display: flex; align-items: center; justify-content: center; }
.chat-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.chat-info { display: flex; flex-direction: column; justify-content: center; flex: 1; min-width: 0; align-items: flex-start; }
.chat-name, .chat-type { width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; direction: rtl; }
.chat-name { font-weight: 700; font-size: 15px; color: var(--text); }
.chat-name .verified-name-wrap,
.room-name .verified-name-wrap,
.part-name .verified-name-wrap,
.group-member-name .verified-name-wrap,
.room-manage-name .verified-name-wrap,
#fpName .verified-name-wrap { max-width: 100%; }
.chat-name .verified-name-wrap { direction: ltr; gap: 5px; }
.chat-name .verified-name-text { direction: rtl; unicode-bidi: plaintext; }
.chat-name .verified-badge-svg { width: 18px; height: 18px; }
.chat-type { font-size: 11px; color: var(--text-muted); margin-top: 2px; }

.brand-text { font-weight: 700; font-size: 19px; color: var(--text); letter-spacing: 0.5px; -webkit-text-stroke: 0.3px var(--text); }

/* Live search in header */
.header-left { display:flex; align-items:center; gap:12px; flex: 1; min-width: 0; }
.header-search { position: relative; display:flex; align-items:center; flex: 1; min-width: 0; margin-top: 10px; }
.live-search {
  /* full width on desktop header area (requested) */
  width: 100%;
  max-width: 100%;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.25);
  color: var(--text);
  border-radius: 14px;
  /* smaller height on desktop too */
  /* a bit shorter (requested) */
  padding: 6px 10px;
  box-sizing: border-box;
  height: 36px;
  outline: none;
  font-family: inherit;
  font-size: 13px;
}
.live-search:focus { border-color: rgba(255,255,255,0.22); }
.live-search-results {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: rgba(14,18,24,0.92);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  overflow: hidden;
  backdrop-filter: blur(12px);
  z-index: 9999;
  max-height: 320px;
  overflow-y: auto;
}
.ls-item { display:flex; align-items:center; gap:10px; padding: 10px 12px; cursor:pointer; }
.ls-item:hover { background: rgba(255,255,255,0.06); }
.ls-avatar { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,0.08); overflow:hidden; display:flex; align-items:center; justify-content:center; font-weight:800; }
.ls-avatar img { width:100%; height:100%; object-fit:cover; }
.ls-meta { display:flex; flex-direction:column; min-width:0; }
.ls-title { font-weight:700; font-size: 13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ls-sub { font-size: 12px; color: var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Sections in chats list */
.room-section-title {
  padding: 10px 16px;
  color: var(--text-muted);
  font-weight: 800;
  font-size: 12px;
  letter-spacing: 0.3px;
}

.stories-pull-hint {
  height: 0;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  color: var(--text-muted);
  font-size: 12px;
  transition: height .18s ease;
  flex-shrink: 0; /* این خط اضافه شد */
}

.stories-pull-hint.show{ height: 24px; }
.stories-rail-wrap{
  padding: 12px 14px 6px;
  max-height: 0;
  overflow: hidden;
  background: var(--bg-deep);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: max-height .22s ease, opacity .18s ease, padding .18s ease;
}
.inline-stories{ position: relative; z-index: 1; }
.stories-rail-head{ display:none; }
.stories-rail-wrap.revealed{
  max-height: 200px;
  opacity: 1;
  visibility: visible;
}

.stories-rail-wrap {
  padding: 0 14px; /* پدینگ بالا و پایین صفر شد تا هیچی بیرون نزند */
  max-height: 0;
  overflow: hidden;
  background: var(--bg-deep);
  border-bottom: 1px solid transparent; /* خط زیرین هم در حالت بسته مخفی می‌شود */
  transition: max-height .22s ease, opacity .18s ease, padding .22s ease;
  flex-shrink: 0;
  opacity: 0; /* در حالت بسته کاملاً نامرئی می‌شود */
  visibility: hidden;
}

.stories-rail-wrap.revealed {
  padding: 12px 14px 6px; /* پدینگ‌ها فقط وقتی استوری باز است برمی‌گردند */
  max-height: 200px;
  opacity: 1;
  visibility: visible;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}


.stories-title{
  font-size:14px;
  font-weight:800;
  color:var(--text);
}
.stories-rail{
  display:flex;
  flex-direction: row-reverse;
  justify-content: flex-start;
  gap:12px;
  overflow-x:auto;
  padding-bottom:4px;
  scrollbar-width:none;
  direction: rtl;
  align-items: flex-start;
}
.stories-rail::-webkit-scrollbar{display:none;}
.story-chip{
  border:0;
  background:transparent;
  color:var(--text);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  min-width:72px;
  cursor:pointer;
}
.story-avatar-ring{
  width:72px;
  height:72px;
  border-radius:50%;
  padding:3px;
  background:linear-gradient(135deg,#2aabee,#7c3aed,#f43f5e);
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.story-avatar-ring.seen{ background: linear-gradient(135deg, rgba(148,163,184,0.65), rgba(100,116,139,0.45)); }
.story-avatar-ring.unseen{ background: linear-gradient(135deg,#2aabee,#7c3aed,#f43f5e); }
.story-avatar-inner{
  width:100%;
  height:100%;
  border-radius:50%;
  overflow:hidden;
  background:var(--bg-elevated);
  border:3px solid var(--bg-deep);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
}
.story-avatar-inner img{ width:100%; height:100%; object-fit:cover; display:block; }
.story-chip-name{
  font-size:12px;
  max-width:74px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.story-chip.uploading .story-chip-name{ color:#fff; opacity:.95; }
.story-plus{
  position:absolute;
  left:2px;
  bottom:2px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:#2aabee;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:700;
  border:2px solid var(--bg-deep);
}
.story-viewer{
  position:fixed;
  inset:0;
  z-index:5000;
  background:#000;
  display:none;
  flex-direction:column;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:none;
  overscroll-behavior:none;
}
.story-viewer-top, .story-viewer-bottom{
  position:absolute;
  left:0; right:0;
  z-index:2;
  padding:14px 14px 0;
}
.story-viewer-top{ top:0; padding:14px 14px 0; }
.story-viewer-bottom{ bottom:18px; }
.story-progress{
  display:flex;
  gap:6px;
  width:calc(100vw - 28px);
  max-width:calc(100vw - 28px);
  justify-content:stretch;
  align-items:center;
  direction:ltr;
}
.story-progress-seg{ flex:1 1 0; min-width:0; height:4px; background:rgba(255,255,255,0.22); border-radius:999px; overflow:hidden; }
.story-progress-seg i{ display:block; width:0; height:100%; background:#fff; }
.story-progress-seg.done i{ width:100%; }
@keyframes storyFill { from{ width:0; } to{ width:100%; } }
.story-stage{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; touch-action:none; }
.story-media{ width:100%; height:100%; object-fit:contain; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; -webkit-user-drag:none; pointer-events:none; touch-action:none; }

.story-stage{ overflow:hidden; background:#000; }
.story-media-layer{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transform:translate3d(0,0,0) scale(1.008);
  transition:opacity .28s cubic-bezier(.22,.78,.18,1), transform .42s cubic-bezier(.22,.78,.18,1);
  will-change:opacity, transform;
}
.story-media-layer.from-next{ transform:translate3d(10%,0,0) scale(1.018); }
.story-media-layer.from-prev{ transform:translate3d(-10%,0,0) scale(1.018); }
.story-media-layer.from-center{ transform:translate3d(0,0,0) scale(1.008); }
.story-media-layer.is-visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}
.story-media-layer.is-leaving{
  opacity:0;
  pointer-events:none;
}
.story-media-layer.is-leaving.to-prev{ transform:translate3d(-7%,0,0) scale(.996); }
.story-media-layer.is-leaving.to-next{ transform:translate3d(7%,0,0) scale(.996); }
.story-media-layer.is-leaving.to-center{ transform:translate3d(0,0,0) scale(.994); }
.story-stage .story-media{
  backface-visibility:hidden;
  transform:translateZ(0);
}
.story-author-row{ display:flex; align-items:center; gap:10px; }
.story-author-avatar{ width:42px; height:42px; border-radius:50%; overflow:hidden; background:rgba(255,255,255,0.14); display:flex; align-items:center; justify-content:center; }
.story-author-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.story-author-name{ font-size:14px; font-weight:800; color:#fff; }
.story-author-time{ font-size:12px; color:rgba(255,255,255,0.75); margin-top:2px; }
.story-author-actions{ margin-inline-start:auto; display:flex; align-items:center; gap:8px; }
.story-seen-count, .story-delete-btn, .story-like-btn, .story-download-btn{
  border-radius:999px;
  min-height:38px;
  padding:8px 12px;
  background:rgba(0,0,0,0.34);
  border:1px solid rgba(255,255,255,0.12);
  color:#fff;
  font-size:13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  gap:8px;
}
.story-delete-btn, .story-like-btn{ cursor:pointer; }
.story-like-btn{ min-width:68px; }

.story-like-btn{ transition:transform .18s ease, background .18s ease, opacity .18s ease, box-shadow .18s ease; }
.story-like-btn.is-active{
  background:rgba(255,255,255,0.16);
  box-shadow:0 10px 24px rgba(0,0,0,0.16);
}
.story-like-btn.is-busy{ pointer-events:none; }
.story-like-btn.like-pop{ animation:storyLikePop .28s cubic-bezier(.22,.78,.18,1); }
@keyframes storyLikePop{
  0%{ transform:scale(1); }
  45%{ transform:scale(1.04); }
  100%{ transform:scale(1); }
}
.story-action-svg{ width:18px; height:18px; display:block; flex:0 0 auto; }
.story-action-count{ display:inline-flex; align-items:center; line-height:1; }
.story-dot{ opacity:.55; margin:0 2px; }
.story-caption{ margin-top:12px; color:#fff; background:rgba(0,0,0,0.32); border-radius:16px; padding:10px 12px; font-size:14px; line-height:1.6; max-width:min(92vw,560px); }
.story-nav{ position:absolute; top:0; bottom:0; width:28%; background:transparent; border:0; z-index:1; }
.story-nav-prev{ left:0; right:auto; }
.story-nav-next{ right:0; left:auto; }
body.story-open{ overflow:hidden; }

.filter-tabs { display: flex; padding: 0 20px; gap: 24px; height: 56px; align-items: center; background: var(--glass); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid var(--glass-border); position: sticky; top: 0; z-index: 900; flex-shrink: 0; }
.filter-btn { background: none; border: none; color: var(--text-muted); font-family: inherit; font-weight: 600; font-size: 14px; padding: 16px 0; cursor: pointer; position: relative; transition: color 0.2s ease; }
.filter-btn.active { color: var(--text); font-weight: 700; }
.filter-btn.active::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 4px; background: var(--primary); border-radius: 4px 4px 0 0; }

.room-item, .user-item { display: flex; align-items: center; padding: 12px 20px; cursor: pointer; height: 76px; transition: background 0.2s ease; }
.room-item:active, .user-item:active { background: rgba(255,255,255,0.05); }
.room-avatar, .user-avatar { position: relative; width: 50px; height: 50px; border-radius: 50%; background: transparent; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 18px; margin-left: 14px; flex-shrink: 0; overflow: visible; color: var(--text); }
.room-avatar .avatar-media, .user-avatar .avatar-media { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; background: var(--bg-elevated); border: 1px solid var(--glass-border); display: flex; align-items: center; justify-content: center; }
.room-avatar img, .user-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.room-info, .user-info { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; border-bottom: 1px solid rgba(255,255,255,0.03); padding-bottom: 14px; padding-top: 14px; height: 100%; }
.part-name { font-weight: 700; font-size: 16px; color: var(--text); margin-bottom: 4px; }
.part-bio { font-size: 13px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.avatar-media span { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.saved-avatar-icon { width: 58% !important; height: 58% !important; object-fit: contain !important; }
.presence-dot {
  position: absolute;
  left: -4px;
  bottom: -1px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  z-index: 3;
  pointer-events: none;
  border: 2px solid var(--bg-deep);
}
.presence-dot--room, .presence-dot--user { width: 11px; height: 11px; left: -4px; bottom: -1px; }
.presence-dot--chat { width: 11px; height: 11px; left: -4px; bottom: -1px; }
.presence-dot--profile { width: 14px; height: 14px; left: -5px; bottom: -1px; }
.presence-dot.is-online { background: #22c55e; box-shadow: 0 0 0 1px rgba(2,5,31,0.22), 0 0 8px rgba(34,197,94,0.48); animation: presencePulse 1.8s ease-in-out infinite; }
.presence-dot.is-offline { background: #ff3045; box-shadow: 0 0 0 1px rgba(2,5,31,0.18), 0 0 7px rgba(255,48,69,0.24); }
@keyframes presencePulse { 0%, 100% { transform: scale(1); opacity: .88; } 50% { transform: scale(1.08); opacity: 1; } }

.contacts-page-head { padding: 14px 16px 8px; }
.contacts-search-wrap { position: sticky; top: 0; z-index: 2; }
.contacts-search-input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
  color: var(--text);
  border-radius: 16px;
  padding: 12px 14px;
  outline: none;
  font-family: inherit;
  font-size: 14px;
}
.contacts-search-input::placeholder { color: var(--text-muted); }
.contacts-search-input:focus { border-color: rgba(42,171,238,0.45); box-shadow: 0 0 0 3px rgba(42,171,238,0.10); }
.contacts-search-results {
  margin-top: 10px;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
}
.contacts-search-results .user-info { border-bottom-color: rgba(255,255,255,0.04); }
.contacts-search-results .user-item:last-child .user-info { border-bottom-color: transparent; }
.contacts-search-empty,
.contacts-empty-state {
  padding: 22px 18px;
  text-align: center;
  color: var(--text-muted);
  font-size: 14px;
  line-height: 1.9;
}
.contacts-empty-state { padding-top: 36px; }
.user-item-search { min-height: 72px; height: auto; }
.user-item-contact { min-height: 84px; height: auto; }
.user-item-contact .user-info { gap: 2px; }
.part-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.part-handle, .part-presence { font-size: 12.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.part-presence.is-online { color: var(--primary); font-weight: 700; }
.room-top { display: flex; justify-content: space-between; margin-bottom: 6px; align-items: center; }
.room-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.room-title-wrap{display:inline-flex;align-items:center;gap:7px;min-width:0;max-width:100%;flex:1}
.room-name { font-weight: 700; font-size: 16px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width:0; }
.room-title-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:rgba(220,227,235,.7)}
.room-title-icon svg,.room-title-icon img{display:block}
.room-title-icon-mute,.room-title-icon-pin{color:rgba(220,227,235,.68)}
.room-title-icon-mute{transform:translateY(.65px)}
.room-title-icon-pin{transform:translateY(.9px)}
.room-title-icon-pin .room-inline-pin-tg{transform:translateY(.8px) rotate(2deg);transform-origin:50% 50%}
.room-title-icon-mute .room-inline-mute-tg{transform:translateY(.2px);width:13px;height:13px;opacity:.76}
.room-inline-pin-tg,.room-inline-mute-tg{display:block;overflow:visible}
body.light-theme .room-title-icon,
body.light-theme .room-title-icon-mute,
body.light-theme .room-title-icon-pin{color:rgba(15,23,42,.56)}
body.light-theme .room-title-icon-mute .room-inline-mute-tg{filter:brightness(0) saturate(100%);opacity:.58}
.verified-name-wrap { display: inline-flex; align-items: center; gap: 6px; direction: rtl; max-width: 100%; vertical-align: middle; }
.verified-name-text { min-width: 0; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.verified-badge-svg { flex: 0 0 auto; display: inline-block; overflow: visible; vertical-align: middle; transform: translateY(0.5px); }
.room-kind-icon{ width:14px; height:14px; vertical-align:-2px; margin-left:6px; opacity:0.9; }

.room-time { font-size: 12px; color: var(--text-muted); flex-shrink: 0; white-space: nowrap; }
.room-msg { font-size: 14px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 12px; }
.room-msg.is-draft{color:#f59e0b;font-weight:800}

/* Ensure unread badge is always visible (fix: badge could be pushed out in RTL/desktop) */
.room-msg { flex: 1; min-width: 0; }
.room-meta-pack { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; }
.room-time-wrap{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;white-space:nowrap}
.room-badge { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; min-width: 22px; }
.room-top { gap: 10px; align-items: center; }

/* Telegram-like unread badge (minimal + responsive) */
.unread-badge {
  --ub-size: 18px;
  min-width: var(--ub-size);
  height: var(--ub-size);
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(255,79,79,0.96), rgba(220,36,36,0.96));
  box-shadow: 0 6px 16px rgba(220, 36, 36, 0.18);
  color: #fff;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1px;
  line-height: 1;
  flex-shrink: 0;
}

.unread-badge.pulse { animation: unreadPulse 360ms ease-out; }
@keyframes unreadPulse { 0% { transform: scale(1); } 45% { transform: scale(1.16); } 100% { transform: scale(1); } }

.badge { background: var(--primary); color: #fff; font-size: 11px; min-width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; padding: 0 6px; border-radius: 11px; font-weight: 800; flex-shrink: 0; box-shadow: 0 2px 8px rgba(0, 122, 255, 0.4); }
.room-badge:not(:empty) { margin-right: 8px; }

/* Bottom nav labels: keep in one line on desktop (fix: "پنل ادمین" wrapping) */
.nav-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
@media (min-width: 900px){
  .bottom-nav .nav-label { font-size: 11px; }
}

.messages-area { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 16px 20px; display: flex; flex-direction: column; gap: 8px; overscroll-behavior-y: contain; overscroll-behavior-x: none; touch-action: pan-y; }
.view-chat.selecting .messages-area { padding-bottom: 108px; }
.view-chat.selecting .scroll-down-fab { bottom: 108px; }
.view-chat.selecting .composer-wrapper { opacity: 0.24; pointer-events: none; filter: saturate(0.7); }
.message-selection-actions { position: absolute; left: 16px; right: 16px; bottom: calc(env(safe-area-inset-bottom, 0px) + 92px); z-index: 950; display:flex; align-items:center; justify-content:space-between; gap:10px; padding: 10px; border-radius: 22px; background: rgba(11,17,32,0.82); border: 1px solid rgba(255,255,255,0.10); box-shadow: 0 16px 40px rgba(0,0,0,0.28); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.message-selection-action { flex:1; min-width:0; border: 0; border-radius: 16px; padding: 13px 12px; background: rgba(255,255,255,0.08); color: var(--text); font-family: inherit; font-size: 14px; font-weight: 800; cursor: pointer; transition: transform 0.18s ease, opacity 0.18s ease, background 0.18s ease; }
.message-selection-action:active { transform: scale(0.97); }
.message-selection-action:disabled { opacity: 0.45; cursor: not-allowed; transform: none; }
.message-selection-action.danger { background: rgba(239,68,68,0.16); color: #ffd6d6; }
.history-loader{
  position: absolute;
  top: 86px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  min-height: 36px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(15,23,42,0.92);
  border: 1px solid rgba(255,255,255,0.10);
  color: #fff;
  font-size: 12px;
  white-space: nowrap;
  box-shadow: 0 10px 24px rgba(0,0,0,0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.msg-date-separator {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 8px 0 10px;
}

.msg-date-separator span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(0,0,0,0.18);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(0,0,0,0.10);
}

.msg-row { width: 100%; display: flex; margin-bottom: 4px; position: relative; }
.msg-row.swipe-reply-enabled { --swipe-reply-progress: 0; --swipe-reply-offset: 0px; }
.msg-row.swipe-reply-enabled .msg-container { position: relative; z-index: 1; will-change: transform; touch-action: pan-y; }
.swipe-reply-indicator { position: absolute; top: 50%; right: 10px; width: 34px; height: 34px; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.92); background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.10); box-shadow: 0 10px 24px rgba(2,8,23,0.22); opacity: calc(0.14 + (var(--swipe-reply-progress) * 0.92)); transform: translateY(-50%) scale(calc(0.88 + (var(--swipe-reply-progress) * 0.14))); transition: opacity 0.16s ease, transform 0.16s ease, background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease; pointer-events: none; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.swipe-reply-indicator svg { width: 18px; height: 18px; display: block; }
.msg-row.swipe-reply-enabled.swipe-reply-ready .swipe-reply-indicator { background: linear-gradient(135deg, rgba(37,99,235,0.98), rgba(56,189,248,0.96)); border-color: rgba(125,211,252,0.62); box-shadow: 0 12px 28px rgba(37,99,235,0.28); opacity: 1; transform: translateY(-50%) scale(1.02); }
.msg-row.selected::after { content: ''; position: absolute; inset: -2px 0; border-radius: 22px; background: rgba(0,122,255,0.08); pointer-events: none; }
html[dir="rtl"] .msg-row.me { justify-content: flex-start; direction: rtl; } 
html[dir="rtl"] .msg-row.other { justify-content: flex-start; direction: ltr; } 

html[dir="rtl"] .msg-row.other .msg-container { direction: rtl; text-align: right; } 
html[dir="rtl"] .msg-row.other .mavatar { margin-left: 0; margin-right: 10px; align-self: flex-end; } 

.msg-container { max-width: 82%; display: flex; flex-direction: column; }
.msg-bubble { padding: 10px 14px; position: relative; min-width: 70px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); cursor: pointer; word-wrap: break-word; font-size: 15px; line-height: 1.5; }
.view-chat.selecting .msg-bubble { transition: box-shadow 0.18s ease, transform 0.18s ease, outline-color 0.18s ease; }
.msg-row.selected .msg-bubble { outline: 2px solid rgba(66,153,225,0.85); box-shadow: 0 0 0 4px rgba(66,153,225,0.12), 0 12px 28px rgba(12,74,110,0.18); transform: translateY(-1px); }
.msg-row.selected .msg-bubble::after { content: '✓'; position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(135deg, rgba(37,99,235,0.98), rgba(14,165,233,0.96)); color: #fff; font-size: 13px; font-weight: 900; display:flex; align-items:center; justify-content:center; box-shadow: 0 8px 18px rgba(2,132,199,0.30); border: 2px solid rgba(255,255,255,0.92); }

html[dir="rtl"] .msg-row.me .msg-bubble { background: linear-gradient(180deg, rgba(31,50,72,0.98) 0%, rgba(22,37,53,0.99) 56%, rgba(17,28,40,1) 100%); color: #f8fbff; border-radius: 18px 18px 4px 18px; border: 1px solid rgba(98,157,219,0.22); box-shadow: 0 14px 32px rgba(2,6,23,0.24), 0 0 0 1px rgba(255,255,255,0.04) inset, 0 1px 0 rgba(255,255,255,0.07) inset; backdrop-filter: blur(10px) saturate(135%); -webkit-backdrop-filter: blur(10px) saturate(135%); }
html[dir="rtl"] .msg-row.me .msg-bubble::before { content: ""; position: absolute; inset: 1px 1px auto 1px; height: 46%; border-radius: 17px 17px 12px 12px; background: linear-gradient(180deg, rgba(255,255,255,0.11), rgba(255,255,255,0.025) 72%, rgba(255,255,255,0)); pointer-events: none; }
html[dir="rtl"] .msg-row.me .msg-bubble::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 1px rgba(255,255,255,0.035) inset; pointer-events: none; }
html[dir="rtl"] .msg-row.me .msg-body { position: relative; z-index: 1; }
html[dir="rtl"] .msg-row.me .msg-meta { position: relative; z-index: 1; color: rgba(224,235,246,0.78); }
html[dir="rtl"] .msg-row.other .msg-bubble { background: linear-gradient(180deg, rgba(63,84,110,0.98) 0%, rgba(45,62,84,0.99) 58%, rgba(33,47,65,1) 100%); color: #eef6ff; border-radius: 18px 18px 18px 4px; border: 1px solid rgba(180,204,230,0.34); box-shadow: 0 14px 32px rgba(2,6,23,0.28), 0 0 0 1px rgba(255,255,255,0.05) inset, 0 1px 0 rgba(255,255,255,0.08) inset; backdrop-filter: blur(10px) saturate(135%); -webkit-backdrop-filter: blur(10px) saturate(135%); }
html[dir="rtl"] .msg-row.other .msg-bubble::before { content: ""; position: absolute; inset: 1px 1px auto 1px; height: 46%; border-radius: 17px 17px 12px 12px; background: linear-gradient(180deg, rgba(255,255,255,0.13), rgba(255,255,255,0.03) 72%, rgba(255,255,255,0)); pointer-events: none; }
html[dir="rtl"] .msg-row.other .msg-bubble::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 1px rgba(255,255,255,0.04) inset; pointer-events: none; }
html[dir="rtl"] .msg-row.other .msg-body { position: relative; z-index: 1; }
html[dir="rtl"] .msg-row.other .msg-meta { position: relative; z-index: 1; color: rgba(220,232,245,0.78); }

.mavatar { width: 34px; height: 34px; border-radius: 50%; background: var(--bg-elevated); overflow: hidden; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 13px; border: 1px solid var(--glass-border); }
.mavatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.is-dm .msg-row.other .mavatar { display: none; }
.msg-row.me .mavatar { display: none; }

.msg-name-row { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; width: fit-content; max-width: 100%; }
.msg-row.me .msg-name-row { margin-left: auto; }
.msg-name { font-size: 12px; color: var(--accent); font-weight: 700; display: inline-flex; align-items: center; gap: 8px; }
.msg-admin-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 16px; padding: 1px 5px; border-radius: 5px; background: #f59e0b; color: #2563eb; font-size: 9px; font-weight: 700; line-height: 1; border: 1px solid rgba(255,255,255,0.12); white-space: nowrap; letter-spacing: 0; animation: adminBadgeBlink 2.4s ease-in-out infinite; transform-origin: center; }
@keyframes adminBadgeBlink {
  0%, 100% { color: #2563eb; opacity: 0.96; box-shadow: 0 0 0 rgba(245,158,11,0); text-shadow: 0 0 0 rgba(37,99,235,0); }
  50% { color: #dc2626; opacity: 0.9; box-shadow: 0 0 8px rgba(245,158,11,0.16); text-shadow: 0 0 4px rgba(220,38,38,0.10); }
}
@media (prefers-reduced-motion: reduce) {
  .msg-admin-badge { animation: none; }
}
.admin-msg .mavatar { border-color: rgba(245,158,11,0.6); box-shadow: 0 0 0 2px rgba(245,158,11,0.18); }
html[dir="rtl"] .msg-row.other .msg-bubble.admin-bubble { border: 1px solid rgba(245,158,11,0.64); outline: 1px solid rgba(245,158,11,0.34); box-shadow: 0 10px 24px rgba(2,6,23,0.22), 0 0 0 1px rgba(255,255,255,0.04) inset, 0 0 0 1px rgba(245,158,11,0.18), 0 0 18px rgba(245,158,11,0.10); }
html[dir="rtl"] .msg-row.me .msg-bubble.admin-bubble { box-shadow: 0 4px 16px rgba(245,158,11,0.22); outline: 1px solid rgba(245,158,11,0.45); }
.msg-body { white-space: pre-wrap; margin-bottom: 2px; }
.msg-search-hit .msg-bubble { box-shadow: 0 0 0 1px rgba(56,189,248,0.45), 0 8px 22px rgba(56,189,248,0.10); }
.current-search-hit .msg-bubble { box-shadow: 0 0 0 2px rgba(56,189,248,0.75), 0 10px 28px rgba(56,189,248,0.18); }
.chat-empty-state { margin: auto; padding: 18px 20px; border-radius: 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: var(--text-muted); font-size: 14px; text-align: center; }
.msg-meta { font-size: 10px; color: rgba(255,255,255,0.6); float: left; margin-top: 6px; margin-right: 12px; display: flex; align-items: center; gap: 4px; line-height: 1; direction: ltr; }

/* Balanced compact layout for very long text reports (for example price bots).
   This only activates when app.js marks a long text-only message, so normal chat messages stay unchanged. */
.msg-row.compact-long-message{
  margin-bottom: 2px;
}
.msg-row.compact-long-message .msg-container{
  max-width: min(98.5%, 840px);
}
.msg-bubble.compact-long-message{
  padding: 8px 11px 7px;
  font-size: 13.9px;
  line-height: 1.27;
}
.msg-bubble.compact-long-message .msg-body{
  line-height: 1.27;
  margin-bottom: 1px;
  letter-spacing: -0.025px;
}
.msg-bubble.compact-long-message .msg-name-row{
  margin-bottom: 3px;
}
.msg-bubble.compact-long-message .rx-bar{
  margin-top: 5px !important;
  margin-bottom: 2px !important;
  gap: 5px !important;
}
.msg-bubble.compact-long-message .rx-pill{
  min-height: 23px !important;
  padding: 3px 8px !important;
  font-size: 12px !important;
  line-height: 1.03 !important;
}
.msg-bubble.compact-long-message .rx-pill b{
  font-size: 11px !important;
}
.msg-bubble.compact-long-message .msg-meta{
  margin-top: 4px;
  margin-right: 8px;
  font-size: 10px;
}
@media (max-width: 640px){
  .msg-row.compact-long-message{
    margin-left: -12px;
    margin-right: -12px;
    width: calc(100% + 24px);
  }
  .msg-row.compact-long-message .msg-container{
    width: calc(100% - 44px);
    max-width: calc(100% - 44px);
    flex: 0 0 calc(100% - 44px);
  }
  .msg-row.compact-long-message.me .msg-container{
    width: 100%;
    max-width: 100%;
    flex-basis: 100%;
  }
  .msg-bubble.compact-long-message{
    padding: 7px 9px 6px;
    font-size: 13.7px;
    line-height: 1.24;
  }
  .msg-bubble.compact-long-message .msg-body{
    line-height: 1.24;
    letter-spacing: -0.035px;
  }
  .msg-bubble.compact-long-message .msg-meta{
    margin-top: 3px;
    font-size: 9.8px;
  }
}
.msg-bubble.emoji-only-bubble{padding-top:12px;padding-bottom:10px}
.msg-body.emoji-only{font-size:2.2rem;line-height:1.15;letter-spacing:0;word-break:break-word}
.msg-body.emoji-only.emoji-count-1{font-size:3.35rem;line-height:1.05}
.msg-body.emoji-only.emoji-count-2,
.msg-body.emoji-only.emoji-count-3{font-size:2.65rem;line-height:1.1}
.msg-body.emoji-only.emoji-count-4,
.msg-body.emoji-only.emoji-count-5,
.msg-body.emoji-only.emoji-count-6{font-size:2.1rem;line-height:1.12}
.msg-bubble.emoji-only-bubble .msg-meta{margin-top:8px}
@media (max-width: 640px){
  .msg-body.emoji-only.emoji-count-1{font-size:3.05rem}
  .msg-body.emoji-only.emoji-count-2,
  .msg-body.emoji-only.emoji-count-3{font-size:2.4rem}
  .msg-body.emoji-only.emoji-count-4,
  .msg-body.emoji-only.emoji-count-5,
  .msg-body.emoji-only.emoji-count-6{font-size:1.95rem}
}
.ticks { font-size: 12px; color: #fff; letter-spacing: -1px; margin-left: 2px; }
.ticks.delivered { color: rgba(226, 232, 240, 0.92); }
.ticks.read { color: rgba(60, 255, 140, 0.95); }
.ticks.failed { color: #f87171; letter-spacing: 0; }
.ticks.pending { color: rgba(255,255,255,0.78); letter-spacing: 0; }

/* minimal badges for pinned/saved inside message meta */
.msg-badges { display:inline-flex; align-items:center; gap:6px; margin-left: 6px; }
.msg-badge-icon-pin,
.msg-meta .msg-badge-icon-pin{display:inline-flex;align-items:center;justify-content:center;color:rgba(220,227,235,.62);transform:translateY(.45px)}
.msg-badge-icon-pin .room-inline-pin-tg,
.msg-meta .msg-badge-icon-pin .room-inline-pin-tg{width:13px;height:13px;transform:translateY(.7px) rotate(2deg);transform-origin:50% 50%}
.msg-badge-icon {
  width: 14px;
  height: 14px;
  opacity: 0.92;
  filter: brightness(0) invert(1);
  transform: translateY(0.5px);
}
.msg-badge-icon.soft { opacity: 0.7; }

/* pinned bar (Telegram-like glass) */
.pinned-wrap {
  display: none;
  position: sticky;
  top: 64px;
  z-index: 899;
  padding: 8px 12px 0;
}
.pinned-wrap.active { display:block; }
.pinned-bar {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  min-height: 78px;
  padding: 10px 12px;
  border-radius: 24px;
  background: linear-gradient(90deg, rgba(3, 115, 170, 0.16) 0%, rgba(5, 54, 93, 0.08) 48%, rgba(135, 52, 183, 0.16) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 8px 24px rgba(0,0,0,0.08);
  backdrop-filter: blur(7px) saturate(120%);
  -webkit-backdrop-filter: blur(7px) saturate(120%);
  overflow: hidden;
  isolation: isolate;
}
.pinned-bar::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02) 38%, rgba(255,255,255,0));
  pointer-events: none;
}
.pinned-rail {
  position: relative;
  width: 5px;
  min-width: 5px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 1px 0;
}
.pinned-panel-rail { display:none; }
.pinned-rail-piece,
.pinned-panel-rail-piece {
  display: block;
  width: 100%;
  min-height: 8px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(33,213,255,0.98), rgba(0,153,255,0.88));
  box-shadow: 0 0 0 1px rgba(88,224,255,0.18), 0 0 8px rgba(0,183,255,0.22);
}
.pinned-main {
  position: relative;
  min-width: 0;
  display: flex;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: right;
  color: inherit;
  cursor: pointer;
}
.pinned-copy { min-width: 0; width: 100%; }
.pinned-title {
  color: #27c7ff;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pinned-snippet {
  color: rgba(255,255,255,0.96);
  font-size: 13px;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pinned-menu-btn {
  width: 40px;
  height: 40px;
  align-self: center;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.09);
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.94);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.pinned-menu-btn:hover,
.pinned-menu-btn[aria-expanded="true"] {
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.14);
}
.pinned-menu-btn:active { transform: scale(.97); }
.pinned-menu-svg { width: 18px; height: 18px; }
.pinned-panel {
  display: none;
  position: relative;
  margin-top: 8px;
  padding: 10px;
  border-radius: 22px;
  background: linear-gradient(90deg, rgba(3, 115, 170, 0.14) 0%, rgba(5, 54, 93, 0.07) 48%, rgba(135, 52, 183, 0.14) 100%);
  border: 1px solid rgba(255,255,255,0.09);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07), 0 10px 28px rgba(0,0,0,0.06);
  backdrop-filter: blur(7px) saturate(118%);
  -webkit-backdrop-filter: blur(7px) saturate(118%);
  max-height: min(42vh, 360px);
  overflow: hidden;
}
.pinned-panel::before {
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02) 38%, rgba(255,255,255,0));
  pointer-events:none;
}
.pinned-panel.open { display: block; }
.pinned-panel-list {
  position: relative;
  z-index: 1;
  min-width: 0;
  max-height: calc(min(42vh, 360px) - 20px);
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(0,170,255,.86) rgba(255,255,255,.04);
}
.pinned-panel-list::-webkit-scrollbar { width: 6px; }
.pinned-panel-list::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 999px; }
.pinned-panel-list::-webkit-scrollbar-thumb { background: linear-gradient(180deg, rgba(25,214,255,0.96), rgba(0,153,255,0.82)); border-radius: 999px; }
.pinned-chip {
  min-width: 0;
  text-align: right;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.06);
  cursor: pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.pinned-chip:hover { background: rgba(255,255,255,0.055); border-color: rgba(255,255,255,0.08); }
.pinned-chip:active { transform: scale(.986); }
.pinned-chip.active { background: rgba(53,200,255,0.05); border-color: rgba(53,200,255,0.14); }
.pinned-chip .pc-title {
  font-weight: 800;
  font-size: 13px;
  color: #27c7ff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pinned-chip .pc-sub {
  font-size: 12px;
  color: rgba(255,255,255,0.84);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 2px;
  direction: rtl;
}
@media (max-width: 640px) {
  .pinned-wrap { padding: 7px 10px 0; }
  .pinned-bar { min-height: 74px; padding: 9px 10px; gap: 9px; border-radius: 22px; }
  .pinned-title { font-size: 13px; }
  .pinned-snippet { font-size: 12px; }
  .pinned-menu-btn { width: 38px; height: 38px; border-radius: 13px; }
  .pinned-panel { margin-top: 7px; border-radius: 20px; max-height: min(44vh, 320px); }
  .pinned-panel-list { max-height: calc(min(44vh, 320px) - 20px); }
}
.edited-text { font-size: 10px; font-style: italic; color: rgba(255,255,255,0.6); padding-right: 4px; }

.reply-embed { border-right: 3px solid #fff; background: rgba(0,0,0,0.15); padding: 6px 10px; border-radius: 6px; margin-bottom: 8px; font-size: 13px; cursor: pointer; overflow: hidden; transition: background 0.2s; }
.forward-embed { border-right: 3px solid rgba(25,214,255,0.92); background: rgba(11,17,32,0.22); padding: 7px 10px; border-radius: 10px; margin-bottom: 8px; display:flex; flex-direction:column; gap:2px; }
.forward-embed-title { font-size: 12px; font-weight: 800; color: var(--primary); }
.forward-embed-name { font-size: 13px; font-weight: 700; color: var(--text); }
.forward-picker { display:flex; flex-direction:column; gap:14px; }
.forward-source-list { display:flex; flex-direction:column; gap:8px; }
.forward-source-item { padding: 9px 10px; border-radius: 12px; background: rgba(255,255,255,0.05); color: var(--text); font-size: 13px; line-height: 1.5; }
.forward-source-more { color: var(--text-muted); font-size: 12px; font-weight: 700; padding: 2px 4px 0; }
.forward-source-card { padding: 12px 14px; border:1px solid var(--glass-border); border-radius: 16px; background: rgba(255,255,255,0.04); }
.forward-source-label { font-size: 12px; color: var(--text-muted); margin-bottom: 6px; }
.forward-source-body { font-size: 14px; line-height: 1.6; color: var(--text); word-break: break-word; }
.forward-picker-actions { display:flex; gap:10px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.forward-picker-count { font-size: 12px; color: var(--text-muted); }
.forward-search-input { width:100%; border:none; outline:none; border-radius: 14px; padding: 12px 14px; background: rgba(255,255,255,0.06); color: var(--text); }
.forward-targets { display:flex; flex-direction:column; gap:10px; max-height: min(52vh, 420px); overflow:auto; padding-left:2px; }
.forward-section-title { font-size: 12px; font-weight: 800; color: var(--text-muted); padding: 4px 2px 0; }
.forward-item { display:flex; align-items:center; gap:12px; width:100%; border:none; cursor:pointer; text-align:right; border-radius: 16px; padding: 10px 12px; background: rgba(255,255,255,0.03); color: var(--text); border:1px solid transparent; }
.forward-item:hover { background: rgba(255,255,255,0.055); }
.forward-item.selected { border-color: rgba(25,214,255,0.42); background: rgba(25,214,255,0.08); }
.forward-item-avatar { width:44px; height:44px; border-radius:50%; overflow:hidden; flex:0 0 44px; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,0.08); font-weight:800; }
.forward-item-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.forward-item-copy { min-width:0; flex:1; display:flex; flex-direction:column; gap:3px; }
.forward-item-title { font-size: 14px; font-weight: 700; color: var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.forward-item-sub { font-size: 12px; color: var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.forward-item-check { width:22px; height:22px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; font-size:13px; color: transparent; flex:0 0 22px; }
.forward-item.selected .forward-item-check { color: #fff; background: linear-gradient(180deg, rgba(25,214,255,0.96), rgba(0,153,255,0.82)); border-color: transparent; }
.forward-empty { padding: 16px 10px; text-align:center; color: var(--text-muted); font-size: 13px; }
.forward-send-btn[disabled] { opacity:.65; cursor:not-allowed; }
.modal.forward-modal-active { padding: 0; align-items: stretch; justify-content: stretch; }
.modal.forward-modal-active .modal-backdrop { background: rgba(7,12,22,0.28); }
.modal.forward-modal-active .modal-card { width: 100%; max-width: none; height: 100%; max-height: none; border-radius: 0; border: none; box-shadow: none; background: var(--bg-deep); }
.modal.forward-modal-active .modal-header { position: sticky; top: 0; z-index: 5; padding: calc(env(safe-area-inset-top, 0px) + 16px) 18px 16px; background: rgba(7,18,37,0.88); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.modal.forward-modal-active .modal-body { flex: 1; padding: 0; overflow: hidden; }
.forward-picker-fullscreen { height: 100%; min-height: 0; display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 0; }
.forward-picker-top { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px 12px; }
.forward-picker-fullscreen .forward-targets { min-height: 0; max-height: none; overflow: auto; padding: 0 16px 16px; scroll-padding-bottom: 120px; }
.forward-picker-footer { margin-top: 0; padding: 12px 16px calc(env(safe-area-inset-bottom, 0px) + 16px); background: rgba(7,18,37,0.88); border-top: 1px solid var(--glass-border); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); position: relative; z-index: 4; }
.forward-picker-footer .forward-picker-count { font-size: 13px; font-weight: 700; }
.forward-picker-footer .forward-send-btn { min-height: 56px; min-width: min(100%, 420px); font-size: 22px; font-weight: 900; border-radius: 18px; flex: 1 1 100%; }
@media (max-width: 640px) {
  .forward-picker-top { padding: 12px 12px 10px; }
  .forward-picker-fullscreen .forward-targets { padding: 0 12px 12px; }
  .forward-picker-footer { padding: 10px 12px calc(env(safe-area-inset-bottom, 0px) + 12px); }
}

.chat-thumbnail { max-width: 180px; max-height: 180px; min-width: 80px; min-height: 80px; object-fit: cover; border-radius: 12px; cursor: pointer; display: block; margin-top: 6px; background-color: var(--bg-deep); border: 1px solid var(--glass-border); }
.voice-player { display: flex; align-items: center; gap: 12px; background: rgba(0,0,0,0.15); padding: 6px 12px; border-radius: 20px; margin-top: 4px; min-width: 200px; }
.vp-play { width: 36px; height: 36px; border-radius: 50%; border: none; background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; box-shadow: 0 2px 6px rgba(0,0,0,0.15); }
.vp-play .ui-icon-small { filter: none; } 
html[dir="rtl"] .msg-row.other .vp-play { background: var(--primary); }
html[dir="rtl"] .msg-row.other .vp-play .ui-icon-small { filter: brightness(0) invert(1); }
.vp-waveform { flex: 1; height: 4px; background: rgba(255, 255, 255, 0.2); border-radius: 2px; position: relative; overflow: hidden; cursor: pointer; direction: ltr; }
.vp-progress { position: absolute; left: 0; top: 0; bottom: 0; width: 0%; background: #fff; border-radius: 2px; transition: width 0.1s linear; pointer-events: none; }
html[dir="rtl"] .msg-row.other .vp-progress { background: var(--primary); }
.vp-time { font-size: 11px; font-weight: 700; min-width: 32px; text-align: center; color: var(--text); opacity: 0.8; direction: ltr; }

.composer-wrapper { background: transparent; padding: 8px 16px 16px 16px; position: sticky; bottom: 0; z-index: 201; display: flex; flex-direction: column; pointer-events: none; }
.composer-inner, .composer-context, .read-only-banner { pointer-events: auto; }
.read-only-banner { background: var(--bg-elevated); color: var(--text-muted); text-align: center; padding: 12px; border-radius: 16px; font-size: 14px; font-weight: 600; border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); }
.composer-inner { display: flex; align-items: flex-end; background: var(--bg-elevated); border-radius: 28px; padding: 6px; border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); }
.composer-context { background: var(--bg-elevated); margin-bottom: 8px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; border-radius: 16px; border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); }
.action-btn, .attach-btn { border: none; flex-shrink: 0; background: transparent; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.2s, opacity 0.2s; width: 44px; height: 44px; border-radius: 50%; }
.input-container { flex: 1; display: flex; align-items: center; background: transparent; min-height: 44px; padding-bottom: 2px; margin-left: 12px; transition: margin 0.3s ease; position: relative; }
.emoji-btn { position: absolute; left: 6px; bottom: 6px; width: 34px; height: 34px; border: none; border-radius: 50%; background: rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.18s ease, background 0.18s ease, opacity 0.18s ease; z-index: 2; }
.emoji-btn:hover { background: rgba(255,255,255,0.12); }
.emoji-btn:active { transform: scale(0.94); }
#msgInput { width: 100%; background: transparent; border: none; color: #fff; resize: none; outline: none; padding: 10px 12px 10px 48px; font-family: inherit; font-size: 16px !important; max-height: 120px; line-height: 1.5; }
.emoji-picker { position: absolute; left: 0; bottom: calc(100% + 10px); width: min(440px, calc(100vw - 12px)); max-height: 360px; overflow: hidden; padding: 8px 8px 10px; border-radius: 18px; display: none; flex-direction: column; gap: 8px; z-index: 25; }
.emoji-picker-top { display: flex; align-items: center; }
.emoji-search-input { width: 100%; min-height: 38px; border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.06); color: #fff; border-radius: 12px; padding: 0 12px; font-family: inherit; outline: none; }
.emoji-search-input::placeholder { color: var(--text-muted); }
.emoji-tabs { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); direction: rtl; align-items: center; gap: 4px; overflow: hidden; padding: 2px 2px 6px; min-height: 38px; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; width: 100%; }
.emoji-tabs::-webkit-scrollbar { height: 4px; }
.emoji-tabs::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.16); border-radius: 999px; }
.emoji-tab { border: 1px solid rgba(255,255,255,0.12); width: 100%; height: 34px; min-width: 0; min-height: 34px; padding: 0; border-radius: 11px; background: rgba(255,255,255,0.09); color: #fff; cursor: pointer; font-size: 18px; line-height: 1; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; transition: transform 0.18s ease, background 0.18s ease, opacity 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease; box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); }
.emoji-tab.active { background: linear-gradient(135deg, rgba(0,153,255,0.28), rgba(255,255,255,0.16)); border-color: rgba(0,153,255,0.40); box-shadow: 0 8px 20px rgba(0,0,0,0.16), 0 0 0 1px rgba(0,153,255,0.12) inset; }
.emoji-tab:active { transform: scale(0.95); }
.emoji-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: 4px 6px 6px; scroll-behavior: smooth; }
.emoji-body::-webkit-scrollbar { width: 6px; }
.emoji-body::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.18); border-radius: 999px; }
.emoji-group { display: flex; flex-direction: column; gap: 8px; scroll-margin-top: 0; }
.emoji-group-title { position: relative; top: auto; z-index: 0; font-size: 12px; font-weight: 700; color: var(--text-muted); padding: 0 6px 6px; background: transparent; backdrop-filter: none; }
.emoji-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.emoji-item { border: none; background: rgba(255,255,255,0.06); min-height: 60px; border-radius: 13px; cursor: pointer; font-size: 32px; line-height: 1; display: flex; align-items: center; justify-content: center; transition: transform 0.18s ease, background 0.18s ease; }
.emoji-item:hover { background: rgba(255,255,255,0.12); }
.emoji-item:active { transform: scale(0.92); }
.emoji-empty { text-align: center; color: var(--text-muted); font-size: 13px; padding: 12px 8px 4px; }
.emoji-composer-preview{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:0 0 auto;padding:0 2px 6px;width:100%}.emoji-composer-text{flex:1 1 auto;max-width:none;min-width:0;min-height:36px;border-radius:14px;padding:6px 12px;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.10);color:#d4deea;font-size:12px;line-height:1.2;display:flex;align-items:center;justify-content:flex-start;word-break:break-word;box-shadow:inset 0 1px 0 rgba(255,255,255,0.06)}.emoji-composer-text.is-placeholder{color:rgba(212, 222, 234, 0.56)}.emoji-composer-delete,.emoji-composer-send{width:40px;height:40px;border:none;border-radius:14px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.10);color:#fff;display:flex;align-items:center;justify-content:center;opacity:.72;flex:0 0 auto;transition:transform .16s ease,opacity .16s ease,background .16s ease,box-shadow .16s ease}.emoji-composer-delete{font-size:22px}.emoji-composer-delete.active,.emoji-composer-send.active{opacity:1;background:rgba(255,255,255,0.14)}.emoji-composer-send.active{background:linear-gradient(135deg, rgba(0,153,255,0.32), rgba(0,153,255,0.18));box-shadow:0 10px 24px rgba(0,90,160,0.24)}.emoji-composer-delete:disabled,.emoji-composer-send:disabled{cursor:default;opacity:.45}.emoji-composer-delete:active,.emoji-composer-send:active{transform:scale(.96)}
#msgInput::placeholder { color: var(--text-muted); }
.send-btn, .mic-btn { background-color: var(--primary) !important; width: 44px; height: 44px; border-radius: 50% !important; box-shadow: 0 4px 16px rgba(0, 122, 255, 0.4); }
.send-btn:not(:disabled):active, .mic-btn:active { transform: scale(0.92); }
.send-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none; background-color: var(--bg-elevated) !important; }

.bottom-nav { position: fixed; bottom: 20px; left: 50%; right: auto; transform: translateX(-50%); width: min(322px, calc(100vw - 20px)); max-width: calc(100vw - 20px); height: 60px; padding: 0 8px; border-radius: 30px; background: var(--glass); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); display: flex; align-items: center; z-index: 90; border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); flex-direction: row-reverse; justify-content: space-between; gap: 2px; }
.nav-item { display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text-muted); text-decoration: none; border: none; background: none; cursor: pointer; transition: color 0.2s, transform 0.2s, background 0.2s, box-shadow 0.2s; padding: 6px 10px; border-radius: 999px; min-width: 58px; flex: 1 1 0; position: relative; z-index: 1; }
.nav-item.active { color: var(--text); background: linear-gradient(180deg, rgba(56,189,248,0.28) 0%, rgba(56,189,248,0.16) 100%); box-shadow: 0 0 0 1px rgba(56,189,248,0.18) inset, 0 12px 28px rgba(56,189,248,0.18); }
.nav-item.active::before { content: ''; position: absolute; top: -4px; bottom: -4px; left: -6px; right: -6px; border-radius: 999px; background: radial-gradient(ellipse at center, rgba(56,189,248,0.30) 0%, rgba(56,189,248,0.18) 48%, rgba(56,189,248,0.06) 68%, rgba(56,189,248,0.00) 82%); pointer-events: none; z-index: -1; }
.nav-item:active { transform: scale(0.94); }
.nav-label { font-size: 11px; font-weight: 700; margin-top: 4px; font-family: var(--font); }
.nav-avatar { width: 26px; height: 26px; border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--bg-elevated); color: #fff; font-size: 12px; border: 1px solid var(--glass-border); position: relative; z-index: 1; }
.nav-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.icon-btn { background: none; border: none; padding: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: background 0.2s; width: 44px; height: 44px; }
.icon-btn:hover { background: rgba(255,255,255,0.05); }
.icon-btn-small { background: none; border: none; padding: 6px; cursor: pointer; border-radius: 50%; transition: background 0.2s; }
.icon-btn-small:hover { background: rgba(255,255,255,0.05); }
.popup-menu { position: absolute; top: 60px; right: 20px; background: var(--bg-elevated); border: 1px solid var(--glass-border); border-radius: 16px; width: 220px; padding: 8px; display: flex; flex-direction: column; z-index: 99999; box-shadow: 0 10px 40px rgba(0,0,0,0.5); }
.popup-item, a.popup-item { text-decoration: none !important; background: transparent; border: 0; color: var(--text); text-align: right; padding: 12px; border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 500; transition: background 0.2s; display: flex; align-items: center; gap: 8px; }
.popup-item:hover { background: rgba(255,255,255,0.05); }

.popup-item.admin-popup-item { justify-content: flex-start; }
.menu-inline-badge {
  margin-right: auto;
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  box-shadow: 0 4px 12px rgba(239,68,68,.35);
}
.login-secondary-btn {
  margin-top: 14px;
  width: 100%;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.05);
  color: #e2e8f0;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s ease;
}
.login-secondary-btn:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.16);
}
.login-secondary-btn:active { transform: scale(.98); }
.login-subcard {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.request-type-chip {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:22px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,0.08);
}
.request-type-chip.signup { background: rgba(14,165,233,.14); color: #38bdf8; }
.request-type-chip.password-reset { background: rgba(245,158,11,.14); color: #fbbf24; }
.msg-popover { position: fixed; background: var(--bg-elevated); border: 1px solid var(--glass-border); border-radius: 12px; padding: 6px; z-index: 99999; box-shadow: var(--glass-shadow); display: flex; flex-direction: column; }
.pop-btn { background: transparent; border: 0; color: var(--text); padding: 12px 16px; border-radius: 8px; font-family: inherit; font-size: 14px; text-align: right; cursor: pointer; }
.pop-btn:hover { background: rgba(255,255,255,0.05); }
.text-danger { color: var(--danger) !important; }

.modal, .full-modal { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; }
.modal-backdrop, .full-modal { background: rgba(0,0,0,0.6); backdrop-filter: blur(8px); }
.modal-card { width: 90%; max-width: 400px; background: var(--bg-deep); border-radius: 20px; border: 1px solid var(--glass-border); display: flex; flex-direction: column; max-height: 80vh; z-index: 1001; box-shadow: 0 20px 50px rgba(0,0,0,0.5); }
.modal-header { padding: 20px; border-bottom: 1px solid var(--glass-border); display: flex; justify-content: space-between; align-items: center; font-weight: 700; font-size: 18px; }
.modal-body { padding: 20px; overflow-y: auto; }

.full-modal-card { width: 90%; max-width: 380px; background: var(--bg-elevated); border-radius: 24px; padding: 32px 24px; display: flex; flex-direction: column; align-items: center; position: relative; border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow); }
.full-modal-close { position: absolute; top: 16px; left: 16px; background: rgba(255,255,255,0.05); width: 36px; height: 36px; border: none; cursor: pointer; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.full-modal-close { z-index: 4; }
.full-modal-avatar { width: 110px; height: 110px; min-height: 110px; border-radius: 50%; overflow: visible; margin-bottom: 20px; background: transparent; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #fff; font-size: 32px; font-weight: bold; position: relative; }
.full-modal-avatar .avatar-media { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; border: 3px solid var(--primary); background: var(--bg-deep); display: flex; align-items: center; justify-content: center; }
.full-modal-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.full-modal-name { font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 8px; width: 100%; text-align: center; }
.full-modal-bio { font-size: 14px; color: var(--text-muted); text-align: center; width: 100%; }

#pageProfile { padding: 0; display: flex; flex-direction: column; height: 100%; }
.profile-static-wrapper { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 30px 20px 100px 20px; width: 100%; max-width: 440px; margin: 0 auto; }

.ps-avatar { width: 130px; height: 130px; border-radius: 50%; background: transparent; margin-bottom: 16px; overflow: hidden; display: flex; align-items: center; justify-content: center; font-size: 48px; font-weight: bold; color: #fff; box-shadow: none; border: 0; flex-shrink: 0; position: relative; }
.ps-avatar .avatar-media { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; background: var(--bg-elevated); box-shadow: 0 8px 24px rgba(0,0,0,0.3); border: 2px solid var(--glass-border); display: flex; align-items: center; justify-content: center; }
.ps-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 50%; }

.room-avatar,
.user-avatar {
  isolation: isolate;
}

.room-avatar.has-story-ring::before,
.user-avatar.has-story-ring::before {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  background: var(--story-ring-bg, linear-gradient(135deg, #2aabee, #7c3aed, #f43f5e));
  box-shadow: 0 0 0 1px rgba(255,255,255,0.06);
  pointer-events: none;
  z-index: 0;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.room-avatar.has-story-ring.story-ring-seen::before,
.user-avatar.has-story-ring.story-ring-seen::before {
  background: var(--story-ring-bg, linear-gradient(135deg, rgba(148,163,184,0.72), rgba(100,116,139,0.52)));
}

.room-avatar.has-story-ring .avatar-media,
.user-avatar.has-story-ring .avatar-media {
  position: relative;
  z-index: 1;
}

.story-ring-clickable { cursor: pointer; }

@media (hover: hover) {
  .room-avatar.story-ring-clickable:hover::before,
  .user-avatar.story-ring-clickable:hover::before {
    transform: scale(1.06);
    filter: brightness(1.07);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.10), 0 12px 26px rgba(42,171,238,0.20);
  }
}

.ps-name { font-size: 22px; font-weight: 800; color: var(--text); margin-bottom: 20px; text-align: center; }

.pb-box { width: 100%; background: var(--sec-bg); border: 1px solid var(--sec-border); border-radius: 20px; padding: 8px 20px; margin-bottom: 20px; box-shadow: 0 8px 24px rgba(0,0,0,0.2); }
.pb-row { display: flex; flex-direction: column; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.pb-row:last-child { border-bottom: none; }
.pb-label { font-size: 13px; color: var(--sec-label); font-weight: 600; margin-bottom: 6px; }
.pb-value { font-size: 15px; color: var(--text); font-weight: 700; word-break: break-word; }
.pb-link-val { color: var(--sec-link); direction: ltr; text-align: right; }

.copyable-link { cursor: pointer; transition: opacity 0.2s; }
.copyable-link:active { opacity: 0.6; }

.pb-edit-btn { width: 100%; min-height: 52px; background: var(--primary); color: #fff; font-size: 16px; font-weight: 800; font-family: inherit; border: none; border-radius: 16px; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; box-shadow: 0 6px 20px rgba(0, 122, 255, 0.3); flex-shrink: 0; }
.pb-edit-btn:active { transform: scale(0.96); box-shadow: 0 2px 10px rgba(0, 122, 255, 0.2); }

.scroll-down-fab { position: absolute; bottom: 85px; right: 16px; width: 44px; height: 44px; border-radius: 50%; background: var(--glass); border: 1px solid var(--glass-border); display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(0,0,0,0.4); z-index: 150; cursor: pointer; backdrop-filter: blur(10px); }
.badge-counter { position: absolute; top: -4px; left: -4px; background: var(--primary); color: white; font-size: 10px; padding: 2px 6px; border-radius: 10px; font-weight: bold; box-shadow: 0 2px 4px rgba(0,0,0,0.3); }

@keyframes pulse-mic { 0% { transform: scale(1); } 50% { transform: scale(1.1); background-color: var(--danger); border-radius: 50%; } 100% { transform: scale(1); } }
.mic-btn.recording { animation: pulse-mic 1s infinite; background-color: var(--danger) !important; }


/* =========================================================
    استایل صفحه تنضیمات همون پروفایل
   ========================================================= */

.admin-body {
  background: var(--bg-deep);
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.admin-shell {
  width: 100%;
  max-width: 440px;
  margin: 0 auto;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: 40px;
  scroll-behavior: smooth;
}

.admin-top {
  position: relative;
  z-index: 100;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  background: transparent;
  margin-bottom: 20px;
  flex-shrink: 0;
}

.admin-top .brand {
  font-weight: 800;
  font-size: 18px;
  color: var(--text);
  letter-spacing: -0.5px;
}

.card {
  background: var(--bg-elevated);
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  padding: 24px 20px;
  margin: 0 16px 20px 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

.card h3 {
  margin-top: 0;
  color: var(--text);
  font-size: 16px;
  font-weight: 800;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  padding-bottom: 12px;
  margin-bottom: 20px;
}

.card hr {
  border: 0;
  border-top: 1px solid rgba(255,255,255,0.05);
  margin: 24px 0;
}

.row {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.avatar.big {
  width: 110px;
  height: 110px;
  min-width: 110px;
  border-radius: 50%;
  border: 3px solid var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  font-weight: bold;
  background: var(--bg-deep);
  color: #fff;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
  margin: 0 auto;
}

.avatar.big img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.avatar.big + div {
  width: 100%;
  flex: none !important;
}

label {
  display: block;
  font-size: 13px;
  color: var(--sec-label);
  margin-bottom: 6px;
  font-weight: 600;
}

input:not([type="file"]):not([type="checkbox"]), select {
  width: 100%;
  background: var(--bg-deep);
  border: 1px solid var(--glass-border);
  color: var(--text);
  padding: 14px 16px;
  border-radius: 12px;
  font-family: inherit;
  font-size: 14px;
  margin-bottom: 16px;
  transition: border-color 0.2s, box-shadow 0.2s;
  outline: none;
}

input:not([type="file"]):not([type="checkbox"]):focus, select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.15);
}

input::placeholder {
  color: var(--text-muted);
  opacity: 0.6;
}

input[type="file"] {
  width: 100%;
  font-size: 13px;
  color: var(--text-muted);
  padding: 8px 0;
  margin-bottom: 16px;
}

.hint {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 16px;
  line-height: 1.6;
}

.hint b {
  color: var(--text);
}

.btn-primary {
  background: var(--primary);
  color: #fff;
  border: none;
  padding: 14px 20px;
  border-radius: 12px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  width: 100%;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 16px rgba(0, 122, 255, 0.3);
}

.btn-primary:active {
  transform: scale(0.96);
  box-shadow: 0 2px 8px rgba(0, 122, 255, 0.2);
}

.btn-secondary {
  background: rgba(255,255,255,0.08);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.10);
  padding: 14px 20px;
  border-radius: 12px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  transition: transform 0.2s, opacity 0.2s, box-shadow 0.2s;
}

.btn-secondary:active {
  transform: scale(0.96);
}

.profile-action-btn {
  width: auto;
  min-width: 148px;
  padding: 10px 16px;
  font-size: 13px;
  border-radius: 10px;
}

.profile-action-btn.is-static,
.profile-action-btn:disabled {
  opacity: 0.72;
  cursor: default;
  box-shadow: none;
}

.menu {
  position: relative;
}

.pill {
  background: rgba(255, 255, 255, 0.05);
  color: var(--text);
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s;
}

.pill:hover {
  background: rgba(255, 255, 255, 0.1);
}

.menu-dropdown {
  position: absolute;
  top: 50px;
  left: 0;
  background: var(--bg-elevated);
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.5);
  padding: 8px;
  min-width: 160px;
  z-index: 105;
  display: flex;
  flex-direction: column;
}

.menu-dropdown .menu-item {
  display: block;
  padding: 12px 16px;
  color: var(--text);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  border-radius: 8px;
  text-align: right;
  transition: background 0.2s;
}

.menu-dropdown .menu-item:hover {
  background: rgba(255, 255, 255, 0.05);
}



/* =========================================================
   استایل صفحه ادمین
   ========================================================= */

.grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

label.check {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
  margin-bottom: 16px;
  font-weight: 600;
}

label.check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--primary);
  cursor: pointer;
}

.members-box {
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  max-height: 220px;
  overflow-y: auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.member-chip {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
  font-size: 14px;
}

.member-chip:hover, .member-chip:active {
  background: rgba(255, 255, 255, 0.08);
}

.gm-check {
  margin: 0;
  width: 16px;
  height: 16px;
  accent-color: var(--primary);
}

.table {
  width: 100%;
  overflow-x: auto;
  display: block;
  border-radius: 12px;
  border: 1px solid var(--glass-border);
  background: rgba(0, 0, 0, 0.15);
  margin-bottom: 16px;
}

.table::-webkit-scrollbar { height: 6px; }
.table::-webkit-scrollbar-track { background: transparent; }
.table::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.2); border-radius: 10px; }

.thead, .trow {
  display: flex;
  min-width: max-content;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  align-items: center;
}

.thead {
  background: rgba(255, 255, 255, 0.05);
  font-weight: 800;
  font-size: 12px;
  color: var(--sec-label);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.trow {
  font-size: 13px;
  font-weight: 600;
  transition: background 0.2s;
}

.trow:hover { background: rgba(255, 255, 255, 0.02); }
.trow:last-child { border-bottom: none; }

.thead > div, .trow > div {
  flex: 1 0 90px; 
  padding: 0 8px;
  word-break: break-word;
}

.thead > div:last-child, .trow > div:last-child {
  flex: 0 0 180px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end; /* Align buttons to right */
}

.pill.small {
  background: rgba(255, 255, 255, 0.1);
  color: var(--text);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: 6px 12px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
  height: auto;
  width: auto;
}

.pill.small:hover, .pill.small:active {
  background: rgba(255, 255, 255, 0.2);
  transform: scale(0.96);
}

.btn-danger {
  background: var(--danger);
  color: #fff;
  border: none;
  padding: 7px 14px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
  box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
}

.btn-danger:active {
  transform: scale(0.95);
  box-shadow: 0 2px 6px rgba(239, 68, 68, 0.2);
}

.mono {
  font-family: monospace;
  direction: ltr;
  font-size: 12px;
  color: var(--text-muted);
  font-weight: 500;
}

.meta {
  color: var(--text-muted);
  font-size: 12px;
}

.link {
  color: var(--primary);
  text-decoration: none;
  font-weight: 700;
  transition: opacity 0.2s;
}

.link:active { opacity: 0.7; }



/* =========================================================
   استایل فوق حرفه‌ای فرم لاگین
   ========================================================= */

@keyframes premiumBg {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes floatOrb1 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, -40px) scale(1.1); }
}

@keyframes floatOrb2 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(-40px, 40px) scale(1.15); }
}

.login-body {
    background: linear-gradient(-45deg, #0b1220, #0f172a, #1e1b4b, #082f49);
    background-size: 300% 300%;
    animation: premiumBg 12s ease infinite;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
    overflow-y: auto;
    position: relative;
}

/* هاله‌های نورانی شناور در پس زمینه */
.login-body::before, .login-body::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.45;
    z-index: 0;
    pointer-events: none;
}
.login-body::before {
    width: 350px; height: 350px;
    background: #38bdf8;
    top: -50px; left: -50px;
    animation: floatOrb1 8s ease-in-out infinite alternate;
}
.login-body::after {
    width: 400px; height: 400px;
    background: #8b5cf6;
    bottom: -100px; right: -50px;
    animation: floatOrb2 10s ease-in-out infinite alternate;
}

.login-card {
    position: relative;
    z-index: 1;
    background: rgba(15, 23, 42, 0.40);
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
    border-radius: 32px;
    padding: 48px 32px;
    width: 100%;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    animation: slideUpLogin 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    margin: auto;
}

@keyframes slideUpLogin {
    from { opacity: 0; transform: translateY(50px) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.login-card .brand {
    font-size: 34px;
    font-weight: 900;
    text-align: center;
    margin-bottom: 8px;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #ffffff 0%, #a5b4fc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 4px 20px rgba(255,255,255,0.1);
}

.login-card .subtitle {
    font-size: 14px;
    color: #94a3b8;
    text-align: center;
    margin-bottom: 36px;
    font-weight: 500;
}

.login-card .alert {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.25);
    color: #fca5a5;
    padding: 14px 16px;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 24px;
    animation: shakeAlert 0.4s ease-in-out;
}

.login-card form {
    display: flex;
    flex-direction: column;
}

.login-card label {
    font-size: 13px;
    color: #cbd5e1;
    margin-bottom: 8px;
    font-weight: 600;
    padding-right: 4px;
}

.login-card input:not([type="checkbox"]) {
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
    padding: 16px 20px;
    border-radius: 16px;
    font-size: 15px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-bottom: 20px;
    outline: none;
}

.login-card input:not([type="checkbox"]):focus {
    background: rgba(0, 0, 0, 0.4);
    border-color: #38bdf8;
    box-shadow: 0 0 0 4px rgba(56, 189, 248, 0.15);
    transform: translateY(-2px);
}

.login-card .btn-primary {
    background: linear-gradient(135deg, #0ea5e9 0%, #4f46e5 100%);
    border: none;
    box-shadow: 0 8px 24px rgba(79, 70, 229, 0.35);
    border-radius: 16px;
    height: 56px;
    font-size: 16px;
    font-weight: 800;
    color: #fff;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    margin-top: 10px;
    cursor: pointer;
}

/* افکت براق بودن روی دکمه */
.login-card .btn-primary::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
    transform: skewX(-20deg);
    transition: left 0.5s ease;
}

.login-card .btn-primary:hover::after {
    left: 150%;
}

.login-card .btn-primary:hover {
    box-shadow: 0 12px 32px rgba(79, 70, 229, 0.5);
    transform: translateY(-2px);
}

.login-card .btn-primary:active {
    transform: translateY(1px);
    box-shadow: 0 4px 16px rgba(79, 70, 229, 0.3);
}

.login-card .hint {
    text-align: center;
    margin-top: 28px;
    margin-bottom: 0;
    color: #64748b;
    font-size: 12px;
}

/* =========================================================
   استایل لودینگ حرفه‌ای 
   ========================================================= */
.elegant-loader-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: rgba(11, 18, 32, 0.85);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

.elegant-loader-overlay.active {
    opacity: 1;
    visibility: visible;
}

.spinner-ring {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.05);
    border-top-color: #38bdf8;
    border-right-color: #8b5cf6;
    animation: spinRing 1s cubic-bezier(0.6, 0.2, 0.4, 0.8) infinite;
}

@keyframes spinRing {
    to { transform: rotate(360deg); }
}

.loader-text {
    margin-top: 24px;
    font-size: 15px;
    font-weight: 700;
    color: #e2e8f0;
    letter-spacing: 0.5px;
    animation: pulseText 1.5s infinite;
}

@keyframes pulseText {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; text-shadow: 0 0 12px rgba(255,255,255,0.4); }
}



::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.25);
}
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}

/* =========================================================
   فیکس سازی دسکتاپ
   ========================================================= */
@media (min-width: 860px) {
  
  body:not(.admin-body):not(.login-body) {
    display: flex !important;
    flex-direction: row !important;
  }

  .view-main {
    width: 380px !important;
    min-width: 380px !important;
    max-width: 380px !important;
    flex: none !important;
    border-left: 1px solid var(--glass-border);
    display: flex !important;
    position: relative;
    height: 100vh !important;
    background: var(--bg-deep);
    z-index: 10;
  }

  .view-main {
    padding-bottom: 92px !important;
  }

  .bottom-nav {
    position: fixed !important;
    bottom: 20px !important;
    right: 31px !important;
    left: auto !important;
    transform: none !important;
    width: 318px !important;
    max-width: 318px !important;
    height: 58px !important;
    padding: 0 8px !important;
    margin: 0 !important;
    z-index: 1000 !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 2px !important;
  }

  body.chat-open .bottom-nav {
    display: flex !important;
  }

  .view-chat { min-height: var(--app-vh);
    flex: 1 !important;
    display: flex !important;
    position: relative;
    height: 100vh !important;
    animation: none !important;
    background: radial-gradient(circle at 50% 50%, #1A2735 0%, var(--bg-deep) 100%);
  }

  #backBtn { display: none !important; }

  body:not(.chat-open) .view-chat::after {
    content: 'یک گفتگو را برای شروع انتخاب کنید';
    position: absolute;
    inset: 0;
    background: var(--bg-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    color: var(--text-muted);
    font-size: 18px;
    font-weight: 600;
  }

  .admin-body .admin-shell {
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 30px 50px !important;
    display: block !important;
  }

  .admin-body .grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
  }

  .composer-wrapper {
    max-width: 850px;
    margin: 0 auto;
    width: 100%;
    padding: 10px 20px 30px 20px;
  }
}

/* Saved Messages avatar icon */
.saved-avatar-icon{ width:60%; height:60%; object-fit:contain; opacity:0.95; }
.chat-avatar.is-saved-header .avatar-media{ background: transparent; border: 0; overflow: visible; }
.saved-header-avatar-media{ background: transparent !important; border: 0 !important; }
.saved-header-avatar-svg{ width: 100%; height: 100%; display: block; filter: drop-shadow(0 8px 18px rgba(42,168,255,0.28)); }
.view-chat.is-saved-chat .chat-search-header-btn{ display: inline-flex; }


/* Reaction picker (iPhone-like quick emojis) */
.reaction-picker{
  position: fixed;
  z-index: 99999;
  background: #1A2735;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 14px 40px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.03);
  border-radius: 16px;
  padding: 8px;
  display:flex;
  gap:6px;
  align-items:center;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.reaction-picker button{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 0;
  background: rgba(255,255,255,0.08);
  color: var(--text);
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}
.reaction-picker button:hover{ background: rgba(255,255,255,0.14); }
.reaction-picker button:active{ transform: scale(0.96); }

body.light-theme .reaction-picker{
  background: rgba(255,255,255,0.98);
  border-color: rgba(15,23,42,0.10);
  box-shadow: 0 16px 38px rgba(15,23,42,0.16);
}
body.light-theme .reaction-picker button{
  background: rgba(15,23,42,0.05);
  color: var(--text);
}
body.light-theme .reaction-picker button:hover{ background: rgba(15,23,42,0.10); }

.rx-bar{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-top:6px;
}
.rx-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 8px;
  border-radius: 12px;
  background: rgba(0,0,0,0.18);
  border: 1px solid rgba(255,255,255,0.10);
  font-size: 13px;
  cursor: pointer;
  user-select:none;
}
.msg-row.me .rx-pill{ background: rgba(0,0,0,0.22); }
.rx-pill b{ font-weight:800; }
.rx-pill.mine{
  border-color: rgba(42,171,238,0.65);
  box-shadow: 0 0 0 2px rgba(42,171,238,0.14) inset;
}

.mention{
  color: var(--primary);
  font-weight: 800;
  cursor: pointer;
}
.msg-link{
  color: var(--primary);
  text-decoration: underline;
}



/* ===== Admin group members modal fix ===== */
.admin-members-backdrop{
  position: fixed !important;
  inset: 0 !important;
  z-index: 30000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
  background: rgba(0,0,0,0.68) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.admin-members-modal{
  width: min(100%, 520px) !important;
  max-width: 520px !important;
  max-height: min(86vh, 760px) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--bg-elevated) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.45) !important;
  padding: 18px !important;
}

.admin-members-modal .modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.admin-members-modal .modal-title{
  font-size: 18px;
  font-weight: 800;
  color: var(--text);
}

.admin-members-modal .modal-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap: wrap;
}

.admin-members-modal .admin-modal-save{
  width: auto !important;
  min-width: 92px;
  padding: 10px 16px;
}

.admin-members-box{
  flex: 1 1 auto !important;
  min-height: 180px;
  max-height: min(56vh, 420px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 8px !important;
  margin-top: 8px;
  margin-bottom: 8px;
}

.admin-members-modal .member-chip{
  min-height: 44px;
  justify-content: flex-start;
}

.admin-members-modal .mm-check{
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--primary);
}

@media (max-width: 640px){
  .admin-members-backdrop{
    align-items: flex-end !important;
    padding: 10px !important;
  }
  .admin-members-modal{
    width: 100% !important;
    max-width: 100% !important;
    max-height: 78vh !important;
    border-radius: 20px 20px 14px 14px !important;
    padding: 14px !important;
  }
  .admin-members-box{
    max-height: 48vh !important;
  }
}

/* keep buttons visible in admin tables on narrow widths */
.thead > div:last-child, .trow > div:last-child {
  min-width: 180px;
}


/* ===== more Telegram-like multi reaction layout ===== */
.rx-bar{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:4px !important;
  max-width:100% !important;
  margin-top:6px !important;
  margin-bottom:4px !important;
}

.rx-pill{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
  padding:3px 7px !important;
  min-height:26px !important;
  border-radius:14px !important;
  font-size:12px !important;
  white-space:nowrap !important;
  max-width:max-content !important;
}

.rx-pill b{
  font-size:11px !important;
}

.msg-bubble{
  max-width:100%;
}


/* ==============================
   Theme switch
==============================*/

.theme-switch-row{
  justify-content: space-between;
  user-select: none;
}

.theme-switch-label{
  font-weight: 700;
}

.theme-switch{
  display: inline-flex;
  align-items: center;
  direction: ltr;
}

.theme-switch-track{
  width: 56px;
  height: 30px;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.10);
  position: relative;
  transition: background .25s ease, border-color .25s ease;
}

.theme-switch-thumb{
  position: absolute;
  top: 2px;
  right: 2px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  transition: transform .25s ease, background .25s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.18);
}

body.light-theme .theme-switch-track{
  background: rgba(0,0,0,0.08);
  border-color: rgba(0,0,0,0.10);
}

body.light-theme .theme-switch-thumb{
  transform: translateX(-26px);
  background: #ffffff;
}


/* ==============================
   Light theme text/icon fixes
==============================*/

body.light-theme{
  --bg-deep: #f3f6fb;
  --bg-elevated: #ffffff;
  --glass: rgba(255,255,255,0.85);
  --glass-border: rgba(0,0,0,0.08);
  --glass-shadow: 0 8px 32px rgba(0,0,0,0.08);
  --text: #0f172a;
  --text-muted: #64748b;
  --primary: #4fae63;
  --incoming: #ffffff;
  --outgoing: #e7f7df;
  --accent: #0ea5e9;
  --danger: #ef4444;
  --sec-bg: #ffffff;
  --sec-border: rgba(0,0,0,0.08);
  --sec-label: #64748b;
  --sec-link: #2563eb;
}

body.light-theme,
body.light-theme html{
  background: var(--bg-deep);
}

body.light-theme .view-main,
body.light-theme .view-chat{
  background: var(--bg-deep);
}

body.light-theme,
body.light-theme .brand-text,
body.light-theme .room-name,
body.light-theme .part-name,
body.light-theme .chat-name,
body.light-theme .pb-value,
body.light-theme .ps-name,
body.light-theme .full-modal-name,
body.light-theme .modal-header,
body.light-theme .card h3,
body.light-theme .thead,
body.light-theme .trow,
body.light-theme .popup-item,
body.light-theme .pop-btn{
  color: var(--text);
}

body.light-theme .part-presence.is-online { color: #0f9d58; }
body.light-theme .room-msg,
body.light-theme .part-bio,
body.light-theme .chat-type,
body.light-theme .room-time,
body.light-theme .meta,
body.light-theme .hint,
body.light-theme .pb-label,
body.light-theme .full-modal-bio,
body.light-theme .ls-sub,
body.light-theme .pc-sub,
body.light-theme .edited-text{
  color: var(--text-muted);
}

body.light-theme .ui-icon,
body.light-theme .ui-icon-small,
body.light-theme .msg-badge-icon,
body.light-theme .pinned-bar .pin-ico{
  filter: none;
  opacity: 0.9;
}
body.light-theme .msg-badge-icon-pin,
body.light-theme .msg-meta .msg-badge-icon-pin{color:rgba(15,23,42,.56)}

body.light-theme input:not([type="file"]):not([type="checkbox"]),
body.light-theme select,
body.light-theme .live-search{
  background: rgba(255,255,255,0.95);
  color: var(--text);
  border-color: rgba(0,0,0,0.10);
}

body.light-theme input::placeholder,
body.light-theme #msgInput::placeholder{
  color: var(--text-muted);
  opacity: 1;
}

body.light-theme #msgInput{
  color: var(--text);
}

body.light-theme .popup-menu,
body.light-theme .msg-popover,
body.light-theme .modal-card,
body.light-theme .full-modal-card,
body.light-theme .card,
body.light-theme .pb-box,
body.light-theme .admin-members-modal,
body.light-theme .composer-inner,
body.light-theme .composer-context,
body.light-theme .read-only-banner{
  background: var(--bg-elevated);
  color: var(--text);
  border-color: rgba(0,0,0,0.08);
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

body.light-theme .swipe-reply-indicator { color: rgba(2,5,31,0.88); background: rgba(255,255,255,0.92); border-color: rgba(148,163,184,0.22); box-shadow: 0 10px 24px rgba(15,23,42,0.10); }
body.light-theme .msg-row.swipe-reply-enabled.swipe-reply-ready .swipe-reply-indicator { color: #fff; background: linear-gradient(135deg, rgba(37,99,235,0.98), rgba(56,189,248,0.96)); border-color: rgba(96,165,250,0.34); }
body.light-theme .msg-row.other .msg-bubble{
  background: linear-gradient(180deg, rgba(248,251,255,.99) 0%, rgba(238,244,251,.99) 54%, rgba(227,236,247,1) 100%);
  color: #0f172a;
  border: 1px solid rgba(148,163,184,.42);
  box-shadow: 0 14px 28px rgba(15,23,42,.11), 0 0 0 1px rgba(255,255,255,.78) inset, 0 1px 0 rgba(255,255,255,.95) inset;
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
}
body.light-theme .msg-row.other .msg-bubble::before{
  content:'';
  position:absolute;
  inset:1px 1px auto 1px;
  height:48%;
  border-radius:17px 17px 12px 12px;
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.28) 72%, rgba(255,255,255,0));
  pointer-events:none;
}
body.light-theme .msg-row.other .msg-bubble::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:0 0 0 1px rgba(255,255,255,.36) inset;
  pointer-events:none;
}
body.light-theme .msg-row.other .msg-body,
body.light-theme .msg-row.other .msg-meta{ position:relative; z-index:1; }

body.light-theme .msg-row.other .msg-bubble.admin-bubble{
  border: 1px solid rgba(245,158,11,0.68);
  outline: 1px solid rgba(245,158,11,0.26);
  box-shadow: 0 0 0 1px rgba(245,158,11,0.10), 0 6px 18px rgba(245,158,11,0.12), 0 0 14px rgba(245,158,11,0.08);
}


body.light-theme .msg-row.me .msg-bubble.admin-bubble{
  border-color: rgba(245,158,11,0.72);
  box-shadow: 0 6px 18px rgba(245,158,11,0.18);
}

body.light-theme .msg-date-separator span{
  background: rgba(255,255,255,0.96);
  border-color: rgba(15,23,42,0.08);
  color: #475569;
  box-shadow: 0 6px 18px rgba(15,23,42,0.08);
}

body.light-theme .msg-row.me .msg-bubble{
  background: linear-gradient(180deg, rgba(226,246,236,.99) 0%, rgba(208,239,224,.99) 54%, rgba(191,229,210,1) 100%);
  color: #123524;
  border: 1px solid rgba(52,168,83,0.32);
  box-shadow: 0 14px 28px rgba(36,94,58,0.13), 0 0 0 1px rgba(255,255,255,.66) inset, 0 1px 0 rgba(255,255,255,.92) inset;
  backdrop-filter: blur(10px) saturate(128%);
  -webkit-backdrop-filter: blur(10px) saturate(128%);
}
body.light-theme .msg-row.me .msg-bubble::before{
  content:'';
  position:absolute;
  inset:1px 1px auto 1px;
  height:48%;
  border-radius:17px 17px 12px 12px;
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.24) 72%, rgba(255,255,255,0));
  pointer-events:none;
}
body.light-theme .msg-row.me .msg-bubble::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:0 0 0 1px rgba(255,255,255,.28) inset;
  pointer-events:none;
}

body.light-theme .msg-row.me .msg-body{
  position:relative;
  z-index:1;
  color: #123524;
}

body.light-theme .msg-row.me .msg-meta{
  position:relative;
  z-index:1;
  color: rgba(18,53,36,0.78);
}

body.light-theme .msg-row.other .msg-meta{
  color: rgba(30,41,59,0.72);
}

body.light-theme .msg-meta{
  color: rgba(30,41,59,0.68);
}

body.light-theme .ticks{
  color: #4b5563;
}

body.light-theme .ticks.delivered{
  color: #334155;
}

body.light-theme .ticks.read{
  color: #16a34a;
}

body.light-theme .ticks.failed{
  color: #dc2626;
}

body.light-theme .ticks.pending{
  color: #475569;
}

body.light-theme .filter-tabs,
body.light-theme .chat-header,
body.light-theme .bottom-nav,
body.light-theme .pinned-bar{
  background: var(--glass);
  border-color: rgba(0,0,0,0.08);
}

body.light-theme .filter-btn{
  color: var(--text-muted);
}

body.light-theme .filter-btn.active,
body.light-theme .nav-item.active{
  color: var(--text);
}

body.light-theme .nav-item{
  color: var(--text-muted);
}

body.light-theme .nav-item.active{
  background: linear-gradient(180deg, rgba(56,189,248,0.28) 0%, rgba(56,189,248,0.16) 100%);
  box-shadow: 0 0 0 1px rgba(56,189,248,0.18) inset, 0 12px 28px rgba(56,189,248,0.18);
}

body.light-theme .nav-item.active::before{
  background: radial-gradient(ellipse at center, rgba(56,189,248,0.30) 0%, rgba(56,189,248,0.18) 48%, rgba(56,189,248,0.06) 68%, rgba(56,189,248,0.00) 82%);
}

body.light-theme .room-info,
body.light-theme .user-info{
  border-bottom-color: rgba(15,23,42,0.10);
}

body.light-theme .room-list .room-item:last-child .room-info,
body.light-theme .user-list .user-item:last-child .user-info,
body.light-theme .contacts-search-results .user-item:last-child .user-info{
  border-bottom-color: transparent;
}

body.light-theme .contacts-search-results .user-info{
  border-bottom-color: rgba(15,23,42,0.08);
}

body.light-theme .room-avatar,
body.light-theme .user-avatar,
body.light-theme .chat-avatar,
body.light-theme .mavatar,
body.light-theme .nav-avatar,
body.light-theme .ps-avatar,
body.light-theme .full-modal-avatar{
  background: #e2e8f0;
  color: var(--text);
  border-color: rgba(0,0,0,0.08);
}

body.light-theme .reply-embed,
body.light-theme .voice-player,
body.light-theme .pinned-chip,
body.light-theme .members-box,
body.light-theme .table{
  background: rgba(0,0,0,0.04);
  border-color: rgba(0,0,0,0.08);
}

body.light-theme .rx-pill{
  background: rgba(0,0,0,0.06);
  border-color: rgba(0,0,0,0.10);
  color: var(--text);
}

body.light-theme .msg-row.me .rx-pill{
  background: rgba(255,255,255,0.22);
  color: #fff;
}

body.light-theme .live-search-results{
  background: rgba(255,255,255,0.98);
  border-color: rgba(0,0,0,0.08);
}

body.light-theme .ls-item:hover,
body.light-theme .popup-item:hover,
body.light-theme .pop-btn:hover,
body.light-theme .icon-btn:hover,
body.light-theme .icon-btn-small:hover{
  background: rgba(0,0,0,0.05);
}

/* Upload progress and rich file previews */
.upload-meta{margin-top:8px;font-size:12px;color:var(--text-muted);font-weight:700}
.upload-progress{width:100%;height:8px;border-radius:999px;background:rgba(127,127,127,0.18);overflow:hidden;margin-top:8px}
.upload-progress-bar{height:100%;width:0%;background:var(--primary);transition:width .18s ease}
.ctx-file-preview{margin-top:10px;border-radius:14px;overflow:hidden;border:1px solid var(--glass-border);background:rgba(0,0,0,0.08);max-height:min(38vh,300px)}
.ctx-file-preview img,.ctx-file-preview video{display:block;width:100%;height:100%;max-height:min(28vh,180px);object-fit:contain;background:#000}
.ctx-file-preview iframe{display:block;width:100%;height:min(28vh,180px);border:0;background:#fff}
.pending-file-card{display:flex;flex-direction:column;gap:10px;padding:10px;background:var(--bg-elevated);max-width:100%}
.pending-file-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.pending-file-info{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.pending-file-type-icon,.chat-generic-file-icon{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(0,122,255,0.12);font-size:20px;flex-shrink:0}
.pending-file-texts,.chat-generic-file-meta{display:flex;flex-direction:column;min-width:0;gap:2px;flex:1}
.pending-file-name,.chat-generic-file-name{font-size:13px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right;color:var(--text);max-width:100%}
.pending-file-sub,.chat-generic-file-type{font-size:12px;color:var(--text-muted);font-weight:700}
.pending-file-remove{border:1px solid rgba(255,59,48,0.2);background:rgba(255,59,48,0.12);color:#ff3b30;padding:8px 12px;border-radius:10px;font-weight:800;cursor:pointer;flex-shrink:0;line-height:1}
.pending-file-media-wrap{position:relative;border-radius:12px;overflow:hidden;background:rgba(15,23,42,0.06);display:flex;align-items:center;justify-content:center;max-height:min(28vh,180px)}
.pending-file-count-badge{position:absolute;left:10px;bottom:10px;padding:6px 10px;border-radius:999px;background:rgba(15,23,42,0.78);color:#fff;font-size:12px;font-weight:800;box-shadow:0 8px 18px rgba(0,0,0,0.22)}

.pending-preview-media{cursor:zoom-in;object-position:center center}
.pending-preview-frame{display:block;width:100%;height:min(28vh,180px);border:0;background:#fff}
.pending-file-fallback{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px 14px;color:var(--text-muted);font-weight:700;text-align:center}
.pending-file-emoji{font-size:28px;line-height:1}
.chat-media-card,.chat-pdf-card,.chat-audio-card,.chat-generic-file-card{margin-top:8px;border:1px solid var(--glass-border);border-radius:16px;background:rgba(0,0,0,0.14);max-width:min(360px,100%);overflow:hidden;backdrop-filter:blur(6px)}
.chat-generic-file-link{display:flex;align-items:center;gap:10px;padding:12px;text-decoration:none;color:inherit}
.chat-thumbnail{display:block;width:min(320px,100%);max-width:100%;max-height:280px;object-fit:cover;background:#000;cursor:zoom-in}
.chat-video{display:block;width:min(320px,100%);max-width:100%;max-height:280px;background:#000;border:0;border-bottom:1px solid var(--glass-border);border-radius:0}
.chat-pdf-frame{display:block;width:100%;height:260px;border:0;background:#fff}
.chat-pdf-preview{width:100%;display:flex;align-items:flex-start;gap:12px;padding:14px 14px 12px;border:0;background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));color:var(--text);text-align:right;cursor:pointer}
.chat-pdf-preview-badge{min-width:54px;height:54px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background:rgba(0,122,255,0.16);border:1px solid rgba(0,122,255,0.24);font-size:15px;font-weight:900;color:#dfeeff;flex-shrink:0}
.chat-pdf-preview-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:8px}
.chat-pdf-preview-title{font-size:13px;font-weight:900;color:var(--text)}
.chat-pdf-preview-body{font-size:12px;line-height:1.9;color:var(--text-muted);background:rgba(255,255,255,0.03);border:1px solid var(--glass-border);border-radius:14px;padding:12px;max-height:172px;overflow:auto}
.chat-pdf-snippet{white-space:pre-wrap;word-break:break-word}
.chat-pdf-snippet.loading,.chat-pdf-snippet.empty{color:var(--text-muted)}
.chat-audio-card .voice-player{margin:0;border-radius:0;padding:12px}
.chat-file-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 12px;border-top:1px solid var(--glass-border);flex-wrap:wrap}
.chat-file-name{font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right;color:var(--text);max-width:100%;flex:1;min-width:0}
.chat-file-actions-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.chat-file-action{border:1px solid var(--glass-border);background:rgba(255,255,255,0.06);color:var(--text);text-decoration:none;padding:8px 12px;border-radius:12px;font-size:12px;font-weight:800;cursor:pointer;line-height:1;display:inline-flex;align-items:center;justify-content:center;min-height:34px}
.chat-file-action.primary{background:rgba(0,122,255,0.16);border-color:rgba(0,122,255,0.24);color:#dfeeff}
.chat-file-link{color:var(--primary);font-weight:700;text-decoration:none}
.file-preview-modal{padding:18px}
.file-preview-shell{width:min(96vw,980px);max-height:92vh;display:flex;flex-direction:column;gap:14px;padding:16px;border-radius:22px}
.file-preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.file-preview-toolbar-meta{min-width:0;flex:1}
.file-preview-title{font-size:15px;font-weight:900;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right}
.file-preview-sub{font-size:12px;color:var(--text-muted);font-weight:700;margin-top:4px}
.file-preview-toolbar-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.file-preview-toolbar .full-modal-close{position:static;top:auto;left:auto;width:40px;height:40px;flex-shrink:0}
.file-preview-download{border:1px solid rgba(0,122,255,0.24);background:rgba(0,122,255,0.16);color:#dfeeff;text-decoration:none;padding:10px 14px;border-radius:12px;font-size:13px;font-weight:900;display:none}
.file-preview-body{width:100%;max-height:calc(92vh - 92px);display:flex;align-items:center;justify-content:center;overflow:auto}
.file-preview-body img,.file-preview-body video,.file-preview-body iframe{max-width:100%;max-height:calc(92vh - 110px);border-radius:16px;border:0;background:#000}
.file-preview-body iframe{width:min(94vw,920px);height:min(78vh,1000px);background:#fff}
.file-preview-pdf-layout{width:min(940px,100%);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:16px;align-items:stretch}
.file-preview-pdf-stage,.file-preview-pdf-text-card{border-radius:18px;border:1px solid var(--glass-border);background:rgba(255,255,255,0.04);overflow:hidden}
.file-preview-pdf-object,.file-preview-pdf-object iframe{display:block;width:100%;height:min(72vh,860px);border:0;background:#fff}
.file-preview-pdf-text-card{padding:14px;display:flex;flex-direction:column;gap:10px}
.file-preview-pdf-text-title{font-size:13px;font-weight:900;color:var(--text)}
.file-preview-pdf-text-body{font-size:12px;line-height:1.95;color:var(--text-muted);white-space:pre-wrap;word-break:break-word;overflow:auto;max-height:min(72vh,860px)}
.file-preview-audio-wrap{width:min(540px,100%);padding:24px;border-radius:18px;background:rgba(255,255,255,0.04);border:1px solid var(--glass-border)}
.file-preview-audio-wrap audio{width:100%}
.file-preview-loading,.file-preview-fallback{width:min(720px,100%);padding:22px;border-radius:18px;background:rgba(255,255,255,0.04);border:1px solid var(--glass-border);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;color:var(--text)}
.file-preview-fallback-title{font-size:16px;font-weight:900;max-width:100%;word-break:break-word}
.file-preview-fallback-sub{font-size:13px;color:var(--text-muted);font-weight:700;max-width:100%;word-break:break-word}
.file-preview-fallback-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.file-preview-text{width:min(920px,100%);max-height:calc(92vh - 120px);overflow:auto;margin:0;padding:18px;border-radius:18px;background:rgba(7,10,18,0.74);border:1px solid var(--glass-border);color:#f8fafc;font-size:13px;line-height:1.8;direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word}
.attach-btn{border:0 !important; background:transparent !important; box-shadow:none !important}
body.light-theme .attach-btn{background:transparent !important;border:0 !important;box-shadow:none !important}
body.light-theme .attach-btn .ui-icon{opacity:1}
body.light-theme .send-btn{box-shadow:0 6px 18px rgba(0,122,255,0.28)}
body.light-theme #pageProfile,.light-theme .profile-static-wrapper,.light-theme .profile-tab-wrapper{background:transparent;color:var(--text)}
body.light-theme.admin-body{
  background: linear-gradient(180deg, #f7fafc 0%, #eef4f8 100%);
  color: var(--text);
}
body.light-theme .admin-shell,
body.light-theme .admin-top,
body.light-theme .admin-top .brand,
body.light-theme .card,
body.light-theme .card h3,
body.light-theme label,
body.light-theme .hint,
body.light-theme .menu-dropdown,
body.light-theme .menu-dropdown .menu-item,
body.light-theme .pill,
body.light-theme .avatar.big{
  color: var(--text);
}
body.light-theme .card{
  background: rgba(255,255,255,0.96);
  border-color: rgba(15,23,42,0.08);
  box-shadow: 0 14px 34px rgba(15,23,42,0.08);
}
body.light-theme .admin-top{
  background: transparent;
}
body.light-theme .card h3,
body.light-theme .card hr,
body.light-theme .pb-row,
body.light-theme .thead,
body.light-theme .trow{
  border-color: rgba(15,23,42,0.08);
}
body.light-theme .pill{
  background: #ffffff;
  border: 1px solid rgba(15,23,42,0.08);
}
body.light-theme .pill:hover{
  background: #f8fafc;
}
body.light-theme .menu-dropdown{
  background: #ffffff;
  border-color: rgba(15,23,42,0.08);
  box-shadow: 0 16px 40px rgba(15,23,42,0.12);
}
body.light-theme .menu-dropdown .menu-item:hover{
  background: rgba(15,23,42,0.05);
}
body.light-theme .avatar.big{
  background: #eef6f0;
  border-color: rgba(79,174,99,0.30);
  box-shadow: 0 10px 24px rgba(79,174,99,0.12);
}
body.light-theme .ps-avatar{box-shadow:0 8px 24px rgba(15,23,42,0.08)}
body.light-theme .full-modal{background:rgba(241,245,249,0.78)}
body.light-theme .ctx-file-preview{background:#f8fafc;border-color:rgba(15,23,42,0.08)}
body.light-theme .chat-pdf-card{background:#fff}
body.light-theme .chat-pdf-preview{background:linear-gradient(180deg, rgba(15,23,42,0.02), rgba(15,23,42,0.01))}
body.light-theme .chat-pdf-preview-body{background:rgba(15,23,42,0.03)}
body.light-theme .pending-file-card{background:#fff}
body.light-theme .pending-file-remove{background:rgba(255,59,48,0.08)}
body.light-theme .pending-file-type-icon,
body.light-theme .chat-generic-file-icon{background:rgba(0,122,255,0.1)}
body.light-theme .chat-generic-file-card,
body.light-theme .chat-media-card,
body.light-theme .chat-pdf-card,
body.light-theme .chat-audio-card{background:#fff;border-color:rgba(15,23,42,0.08)}
body.light-theme .chat-video{border-bottom-color:rgba(15,23,42,0.08)}
body.light-theme .chat-file-action{background:#fff;border-color:rgba(15,23,42,0.08);color:var(--text)}
body.light-theme .chat-file-action.primary{background:rgba(26,39,53,0.10);border-color:rgba(26,39,53,0.16);color:#1A2735}
body.light-theme .file-preview-shell{background:#ffffff;border-color:rgba(15,23,42,0.08);box-shadow:0 24px 56px rgba(15,23,42,0.12)}
body.light-theme .file-preview-download{background:rgba(26,39,53,0.10);border-color:rgba(26,39,53,0.16);color:#1A2735}
body.light-theme .file-preview-loading,
body.light-theme .file-preview-fallback,
body.light-theme .file-preview-audio-wrap{background:#f8fafc;border-color:rgba(15,23,42,0.08)}
body.light-theme .file-preview-text{background:#ffffff;color:#0f172a;border-color:rgba(15,23,42,0.08)}
body.light-theme .chat-generic-file-card{background:#fff;border-color:rgba(15,23,42,0.08)}

.send-btn .ui-icon,.mic-btn .ui-icon{filter:brightness(0) invert(1) !important;opacity:1 !important}
body.light-theme .send-btn,body.light-theme .mic-btn{background:var(--primary) !important;border:1px solid rgba(255,255,255,0.24)}
body.light-theme .mic-btn.recording{background:var(--danger) !important;border-color:rgba(255,255,255,0.34) !important;box-shadow:0 4px 16px rgba(255,59,48,0.36) !important}
body.light-theme .send-btn .ui-icon,body.light-theme .mic-btn .ui-icon{filter:brightness(0) invert(1) !important}
body.light-theme .composer-context{align-items:flex-start}
body.light-theme .pending-file-remove{border-color:rgba(255,59,48,0.16);background:#fff;color:#d92d20;box-shadow:0 1px 2px rgba(15,23,42,0.05)}
@media (max-width: 640px){
  .composer-wrapper{padding:8px 10px 10px 10px}
  .message-selection-actions { left: 10px; right: 10px; bottom: calc(env(safe-area-inset-bottom, 0px) + 84px); border-radius: 18px; }
  .message-selection-action { font-size: 13px; padding: 12px 10px; }
  .message-selection-select-all { min-width: 78px; padding: 9px 12px; }
  .composer-context{padding:10px 12px;border-radius:14px;gap:10px}
  .context-content{min-width:0;flex:1}
  .ctx-file-preview{max-height:220px}
  .pending-file-card{padding:8px}
  .pending-file-top{align-items:flex-start}
  .pending-file-remove{padding:7px 10px;font-size:12px}
  .pending-file-media-wrap,.ctx-file-preview img,.ctx-file-preview video,.ctx-file-preview iframe,.pending-preview-frame{max-height:140px;height:140px}
  .chat-media-card,.chat-pdf-card,.chat-audio-card,.chat-generic-file-card{max-width:100%}
  .file-preview-pdf-layout{grid-template-columns:1fr}
  .file-preview-pdf-object,.file-preview-pdf-object iframe{height:min(48vh,520px)}
  .chat-thumbnail,.chat-video{width:100%;max-height:220px}
  .file-preview-modal{padding:10px}
  .file-preview-shell{padding:12px;border-radius:18px}
  .file-preview-toolbar{align-items:flex-start}
  .file-preview-toolbar-actions{width:100%;justify-content:space-between}
  .file-preview-download{padding:9px 12px;font-size:12px}
  .emoji-picker{
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto !important;
    width: 100%;
    max-width: 100%;
    height: min(60vh, 520px);
    border-radius: 18px 18px 0 0;
    z-index: 3000;
    box-shadow: 0 -12px 30px rgba(0,0,0,0.22);
    padding-top: 6px;
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 8px);
  }
  .emoji-picker::before{display:none;content:none}
}

body.light-theme .emoji-btn{background:#eef4ff;border:1px solid rgba(0,122,255,0.15)}
body.light-theme .emoji-picker{background:rgba(255,255,255,0.96);border:1px solid rgba(13,110,253,0.12)}
body.light-theme .emoji-tab{background:rgba(13,110,253,0.08);border:1px solid rgba(13,110,253,0.12);color:#113355}
body.light-theme .emoji-tab.active{background:linear-gradient(135deg, rgba(13,110,253,0.18), rgba(13,110,253,0.10)); box-shadow:0 8px 18px rgba(13,110,253,0.12)}
body.light-theme .emoji-item{background:rgba(13,110,253,0.06)}
body.light-theme .emoji-item:hover{background:rgba(13,110,253,0.12)}
body.light-theme .emoji-group-title{background:transparent}
body.light-theme .emoji-composer-text{flex:1 1 auto;max-width:none;min-width:0;min-height:36px;border-radius:14px;padding:6px 12px;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.10);color:#d4deea;font-size:12px;line-height:1.2;display:flex;align-items:center;justify-content:flex-start;word-break:break-word;box-shadow:inset 0 1px 0 rgba(255,255,255,0.06)}body.light-theme .emoji-composer-text.is-placeholder{color:#7b8aa0}body.light-theme .emoji-composer-delete,body.light-theme .emoji-composer-send{background:#eef4ff;border-color:rgba(13,110,253,0.16);color:#18324d}body.light-theme .emoji-composer-delete.active{background:rgba(13,110,253,0.14)}body.light-theme .emoji-composer-send.active{background:linear-gradient(135deg, rgba(13,110,253,0.22), rgba(13,110,253,0.12));box-shadow:0 8px 18px rgba(13,110,253,0.12)}


/* Dark mode fix: emoji picker background */
.emoji-picker{
  background: rgba(20,24,35,0.96);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 16px 48px rgba(0,0,0,0.45);
  backdrop-filter: blur(14px);
}



/* ==============================
   Light mode pinned messages fix
============================== */
body.light-theme .pinned-bar {
    background: linear-gradient(90deg, #C0E6FF 0%, #F5F5F5 50%, #EAD3FF 100%) !important;
    border: 1px solid #0EA5E9 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12) !important;
}

body.light-theme .pinned-bar::before {
    background: linear-gradient(180deg, rgba(255,255,255,0.7), rgba(255,255,255,0.25) 40%, rgba(255,255,255,0)) !important;
}

body.light-theme .pinned-title,
body.light-theme .pinned-chip .pc-title {
    color: #05668D !important;
    font-weight: 600 !important;
}

body.light-theme .pinned-snippet,
body.light-theme .pinned-chip .pc-sub {
    color: #1A2735 !important;
}

body.light-theme .pinned-menu-btn {
    background: rgba(255,255,255,0.85) !important;
    border-color: rgba(14,165,233,0.3) !important;
    color: #0f172a !important;
}

body.light-theme .pinned-menu-btn:hover,
body.light-theme .pinned-menu-btn[aria-expanded="true"] {
    background: rgba(255,255,255,1) !important;
    border-color: rgba(14,165,233,0.4) !important;
}

body.light-theme .pinned-panel {
    background: rgba(245,245,245,0.95) !important;
    border-color: rgba(14,165,233,0.2) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7), 0 10px 20px rgba(0,0,0,0.08) !important;
}

body.light-theme .pinned-panel::before {
    background: linear-gradient(180deg, rgba(255,255,255,0.65), rgba(255,255,255,0.2) 40%, rgba(255,255,255,0)) !important;
}

body.light-theme .pinned-chip {
    background: rgba(255,255,255,0.65) !important;
    border-color: rgba(14,165,233,0.2) !important;
}

body.light-theme .pinned-chip:hover {
    background: rgba(255,255,255,0.85) !important;
    border-color: rgba(14,165,233,0.28) !important;
}

body.light-theme .pinned-chip.active {
    background: rgba(14,165,233,0.1) !important;
    border-color: rgba(14,165,233,0.28) !important;
}
/* =========================================================
   اصلاح سایز منوی پایین برای پشتیبانی از ۵ آیتم
   ========================================================= */

/* کاهش جزئی سایز آیکون‌ها */
.bottom-nav .ui-icon, 
.bottom-nav .nav-icon svg {
    width: 22px !important;
    height: 22px !important;
}

/* کاهش پدینگ و حداقل عرض دکمه‌ها برای جا شدن در گوشی‌های کوچک */
.nav-item {
    padding: 6px 9px !important;
    min-width: 58px !important;
}

/* کوچکتر کردن فونت متن زیر آیکون */
.nav-label {
    font-size: 10px !important;
    margin-top: 3px !important;
}

/* جلوگیری از بیرون زدن هاله آبی رنگ در تب فعال */
.nav-item.active::before {
    top: -3px !important;
    bottom: -3px !important;
    left: -4px !important;
    right: -4px !important;
}

/* تنظیم مجدد حاشیه برای آیکون‌های SVG سفارشی */
.nav-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

body.light-theme .contacts-search-input { background: rgba(15,23,42,0.035); border-color: rgba(15,23,42,0.10); }
body.light-theme .contacts-search-results { background: rgba(15,23,42,0.03); border-color: rgba(15,23,42,0.06); }
body.light-theme .btn-secondary { background: rgba(15,23,42,0.06); border-color: rgba(15,23,42,0.10); }

body.light-theme .chat-search-input { background: rgba(15,23,42,0.035); border-color: rgba(15,23,42,0.10); }
body.light-theme .chat-empty-state { background: rgba(15,23,42,0.035); border-color: rgba(15,23,42,0.08); }
body.light-theme .chat-menu-btn .dots-icon,
body.light-theme .chat-search-nav-btn { color: var(--text); }

body.light-theme .presence-dot { border-color: #f8fafc; }

/* Group profile modal */
.group-profile-modal{
  width:min(92vw, 430px);
  max-height:calc(100dvh - 32px);
  padding:18px 16px 16px;
  align-items:center;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable both-edges;
}
.group-profile-modal::-webkit-scrollbar{width:6px;}
.group-profile-modal::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:999px;}
.group-profile-modal[data-profile-kind="group"] #fpStatusRow{
  display:none !important;
}
.group-profile-avatar{
  width:92px !important;
  height:92px !important;
  min-height:92px !important;
  margin-top:6px !important;
  margin-bottom:12px !important;
  border-radius:50% !important;
}
.group-profile-avatar .avatar-media{
  border-radius:50% !important;
}
.group-profile-box{
  width:100% !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  display:flex;
  flex-direction:column;
  min-height:0;
  max-height:none;
  overflow:visible;
}
.group-profile-box .pb-row{
  padding:12px 0;
}
.group-members-wrap{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-top:14px;
  min-height:0;
  flex:1 1 auto;
}
.group-members-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.group-members-head .pb-label{
  margin-bottom:0;
  font-size:14px;
}
.group-members-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  flex:1 1 auto;
  min-height:180px;
  max-height:320px;
  overflow-y:auto;
  padding-inline-end:4px;
}
.group-members-list::-webkit-scrollbar{width:6px;}
.group-members-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:999px;}
.group-member-card{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.025);
  border-radius:16px;
  padding:10px 12px;
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  box-shadow:0 6px 18px rgba(0,0,0,0.14);
}
.group-member-card:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.045);
  box-shadow:0 10px 24px rgba(0,0,0,0.18);
}
.group-member-avatar{
  width:56px;
  height:56px;
  flex:0 0 56px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.group-member-avatar .avatar-media,
.group-member-avatar .avatar-media img,
.group-member-avatar .avatar-media span{
  width:56px;
  height:56px;
  border-radius:50%;
}
.group-member-avatar .avatar-media{
  overflow:hidden;
  background:var(--bg-deep);
  border:2px solid rgba(255,255,255,0.08);
}
.group-member-avatar .presence-dot{
  transform:scale(.9);
}
.group-member-info{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.group-member-name{
  display:flex;
  align-items:center;
  gap:4px;
  font-size:14px;
  font-weight:800;
  color:var(--text);
}
.group-member-handle{
  direction:ltr;
  text-align:left;
  font-size:12px;
  color:var(--text-muted);
}
.group-member-empty{
  color:var(--text-muted);
  text-align:center;
  padding:18px 10px 8px;
  font-size:14px;
}
body.light-theme .group-member-card{
  background:rgba(15,23,42,0.03);
  border-color:rgba(15,23,42,0.08);
}
body.light-theme .group-member-card:hover{
  background:rgba(15,23,42,0.05);
  border-color:rgba(15,23,42,0.12);
}
body.light-theme .group-member-avatar .avatar-media{
  border-color:rgba(15,23,42,0.08);
}
/* جلوگیری از زوم خودکار کیبورد آیفون در موبایل */
@media screen and (max-width: 768px) {
  input, textarea, select, 
  #msgInput, 
  .chat-search-input, 
  .contacts-search-input, 
  .live-search {
    font-size: 16px !important;
  }
}
/* =========================================================
   استایل اختصاصی و ریسپانسیو بخش تاریخ تولد پروفایل
   ========================================================= */
.birth-date-val {
  display: flex;
  align-items: center;
  flex-wrap: wrap; /* برای گوشی‌های خیلی کوچک که متن روی هم نیفتد */
  gap: 10px;
  direction: rtl; /* هماهنگ با کل سایت */
  width: 100%;
}

.bd-date {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 1px; /* فاصله‌گذاری زیبا برای اعداد تاریخ */
}

.bd-age {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.08); /* یک پس‌زمینه شیشه‌ای شیک */
  padding: 3px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

/* هماهنگی با تم روشن (Light Mode) */
body.light-theme .bd-age {
  background: rgba(0, 0, 0, 0.06);
  border-color: rgba(0, 0, 0, 0.05);
}

.room-profile-edit-btn{
  position:absolute;
  top:max(16px, env(safe-area-inset-top, 0px));
  right:max(16px, env(safe-area-inset-right, 0px));
  left:auto;
  width:42px;
  height:42px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,0.1);
  background:rgba(255,255,255,0.04);
  color:var(--text);
  display:none;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
  box-shadow:0 8px 24px rgba(0,0,0,0.16);
  z-index:3;
}
.room-profile-edit-btn:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.16);
}
.room-profile-edit-btn svg{
  width:18px;
  height:18px;
}
.room-editor-panel{
  display:none;
  flex-direction:column;
  gap:14px;
  margin-top:8px;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.03);
  max-height:min(70vh, 680px);
  overflow:hidden;
}
.room-editor-panel.is-open{display:flex;}
.room-editor-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.room-editor-head-main{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
  flex:1;
}
.room-editor-title{
  font-size:14px;
  font-weight:800;
}
.room-editor-subtitle{
  font-size:12px;
  color:var(--text-muted);
}
.room-editor-section{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.room-editor-section-manage{
  min-height:0;
  flex:1 1 auto;
}
.room-editor-section-title{
  font-size:13px;
  font-weight:800;
  color:var(--text);
}
.room-editor-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.room-editor-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.room-editor-field label,
.room-editor-field span{
  font-size:12px;
  color:var(--text-muted);
}
.room-editor-input,
.room-editor-textarea,
.room-manage-search,
.room-manage-role{
  width:100%;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.05);
  color:var(--text);
  padding:10px 12px;
  outline:none;
}
.room-editor-textarea{
  min-height:82px;
  resize:vertical;
}
.room-manage-summary{
  font-size:12px;
  font-weight:700;
  color:var(--text);
  opacity:.9;
}
.room-manage-hint{
  font-size:12px;
  color:var(--text-muted);
  line-height:1.8;
}
.room-edit-legend{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.room-edit-chip{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.03);
  font-size:12px;
}
.room-edit-chip b{font-size:12px;color:var(--text);}
.room-edit-chip span{color:var(--text-muted);text-align:left;direction:rtl;}
.room-edit-chip-admin{border-color:rgba(59,130,246,0.22);}
.room-edit-chip-member{border-color:rgba(16,185,129,0.18);}
.room-edit-chip-remove{border-color:rgba(239,68,68,0.18);}
.room-manage-toolbar{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.room-manage-label{
  font-size:12px;
  font-weight:700;
  color:var(--text-muted);
}
.room-manage-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:220px;
  flex:1 1 auto;
  overflow:auto;
  padding-inline-end:4px;
}
.room-manage-list::-webkit-scrollbar{width:6px;}
.room-manage-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:999px;}
.room-manage-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.025);
}
.room-manage-row[hidden]{display:none !important;}
.room-manage-meta{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.room-manage-name{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:700;
}
.room-manage-handle{
  direction:ltr;
  text-align:left;
  font-size:11px;
  color:var(--text-muted);
}
.room-manage-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
}
.room-manage-check{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--text-muted);
}
.room-editor-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  position:sticky;
  bottom:0;
  padding-top:10px;
  background:linear-gradient(180deg, rgba(15,23,42,0) 0%, rgba(15,23,42,0.92) 40%);
}
.room-editor-actions .profile-action-btn{
  min-width:132px;
}
.room-editor-panel [data-room-editor-close]:not(.room-editor-actions [data-room-editor-close]){
  display:none !important;
}
.group-member-role{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  height:22px;
  padding:0 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  background:rgba(59,130,246,0.16);
  color:#93c5fd;
}
.group-member-role.member{
  background:rgba(148,163,184,0.12);
  color:var(--text-muted);
}
@media (max-width: 640px){
  .full-modal{align-items:flex-start; overflow-y:auto;}
  .group-profile-modal{width:min(94vw, 430px); max-height:calc(100dvh - 18px); margin:auto;}
  .room-profile-edit-btn{top:max(16px, env(safe-area-inset-top, 0px)); right:max(16px, env(safe-area-inset-right, 0px));}
  .room-editor-panel{max-height:none; overflow:visible;}
  .room-manage-list{max-height:42vh;}
  .room-editor-actions{position:sticky; bottom:-2px;}
}

body.light-theme .room-profile-edit-btn,
body.light-theme .room-editor-panel,
body.light-theme .room-manage-row,
body.light-theme .room-editor-input,
body.light-theme .room-editor-textarea,
body.light-theme .room-manage-search,
body.light-theme .room-manage-role{
  border-color:rgba(15,23,42,0.1);
  background:rgba(15,23,42,0.03);
}
body.light-theme .room-profile-edit-btn:hover{
  background:rgba(15,23,42,0.06);
  border-color:rgba(15,23,42,0.15);
}

body.light-theme .forward-embed,
body.light-theme .forward-source-card{background:rgba(13,110,253,0.04);border-color:rgba(13,110,253,0.1)}
body.light-theme .forward-search-input{background:rgba(255,255,255,0.96);border:1px solid rgba(13,110,253,0.12)}
body.light-theme .forward-item{background:rgba(255,255,255,0.9);border-color:rgba(15,23,42,0.04)}
body.light-theme .forward-item:hover{background:rgba(248,250,252,0.96)}
body.light-theme .forward-item.selected{background:rgba(13,110,253,0.08);border-color:rgba(13,110,253,0.22)}
body.light-theme .forward-item-avatar{background:rgba(13,110,253,0.08)}
body.light-theme .modal.forward-modal-active .modal-card{background:var(--bg-deep)}
body.light-theme .modal.forward-modal-active .modal-header,
body.light-theme .forward-picker-footer{background:rgba(255,255,255,0.84);border-color:rgba(15,23,42,0.08)}

body.light-theme .login-secondary-btn { background: rgba(15,23,42,0.04); color: #1A2735; border-color: rgba(15,23,42,0.08); }
body.light-theme .login-secondary-btn:hover { background: rgba(15,23,42,0.08); }
body.light-theme .menu-inline-badge { box-shadow: 0 4px 12px rgba(239,68,68,.22); }


body.light-theme .message-selection-bar{
  background: linear-gradient(180deg, rgba(255,255,255,0.82) 0%, rgba(248,250,252,0.92) 100%);
  border-bottom: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 12px 28px rgba(15,23,42,0.08);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}
body.light-theme .message-selection-label{
  color: #0f9d58;
}
body.light-theme .message-selection-count{
  color: #0f172a;
}
body.light-theme .message-selection-close{
  background: rgba(15,23,42,0.04);
  color: #0f172a;
  border: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 6px 16px rgba(15,23,42,0.06);
}
body.light-theme .message-selection-close:hover,
body.light-theme .message-selection-close:active{
  background: rgba(15,23,42,0.08);
}
body.light-theme .message-selection-select-all{
  background: rgba(79,174,99,0.10);
  color: #166534;
  border: 1px solid rgba(79,174,99,0.18);
  box-shadow: 0 8px 18px rgba(79,174,99,0.08);
}
body.light-theme .message-selection-actions{
  background: linear-gradient(180deg, rgba(255,255,255,0.68) 0%, rgba(248,250,252,0.82) 100%);
  border: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 20px 44px rgba(15,23,42,0.14);
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
}
body.light-theme .message-selection-action{
  background: rgba(255,255,255,0.72);
  color: #0f172a;
  border: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 8px 20px rgba(15,23,42,0.06);
}
body.light-theme .message-selection-action:hover,
body.light-theme .message-selection-action:active{
  background: rgba(255,255,255,0.92);
}
body.light-theme #multiForwardBtn{
  background: linear-gradient(180deg, rgba(59,130,246,0.14) 0%, rgba(59,130,246,0.10) 100%);
  border-color: rgba(59,130,246,0.18);
  color: #1d4ed8;
}
body.light-theme #multiCopyBtn{
  background: linear-gradient(180deg, rgba(15,23,42,0.06) 0%, rgba(15,23,42,0.045) 100%);
  border-color: rgba(15,23,42,0.10);
  color: #0f172a;
}
body.light-theme #multiDeleteBtn,
body.light-theme .message-selection-action.danger{
  background: linear-gradient(180deg, rgba(239,68,68,0.18) 0%, rgba(239,68,68,0.12) 100%);
  border-color: rgba(239,68,68,0.16);
  color: #b42318;
}

/* =========================================================
   Forward fullscreen overlay refresh
   ========================================================= */
body.forward-open{
  overflow:hidden;
}

.forward-screen{
  position:fixed;
  inset:0;
  z-index:30050;
  display:none;
  direction:rtl;
  background:linear-gradient(180deg, rgba(4,16,30,0.98), rgba(7,24,43,0.98) 42%, rgba(7,20,37,0.99) 100%);
}
.forward-screen::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(420px 260px at 92% 8%, rgba(34,211,238,0.12), transparent 70%),
    radial-gradient(360px 220px at 8% 0%, rgba(59,130,246,0.10), transparent 72%),
    radial-gradient(460px 260px at 50% 100%, rgba(139,92,246,0.10), transparent 76%);
}
.forward-screen-shell{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  height:100%;
  width:100%;
}
.forward-screen-header,
.forward-screen-footer,
.forward-source-wrap,
.forward-search-wrap{
  backdrop-filter:blur(20px) saturate(135%);
  -webkit-backdrop-filter:blur(20px) saturate(135%);
}
.forward-screen-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:calc(env(safe-area-inset-top, 0px) + 14px) 16px 14px;
  background:rgba(7,18,37,0.58);
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.forward-screen-title-wrap{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}
.forward-screen-kicker{
  font-size:11px;
  font-weight:800;
  color:var(--text-muted);
}
.forward-screen-title{
  margin:0;
  color:var(--text);
  font-size:clamp(17px, 4.4vw, 24px);
  line-height:1.2;
  font-weight:800;
  letter-spacing:-0.2px;
}
.forward-screen-close{
  flex-shrink:0;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.10);
}
.forward-screen-body{
  min-height:0;
  overflow:auto;
  padding:12px 12px 120px;
  display:flex;
  flex-direction:column;
  gap:12px;
  scrollbar-width:thin;
  background: var(--bg-deep);
}
.forward-source-wrap,
.forward-search-wrap{
  border:1px solid rgba(255,255,255,0.10);
  border-radius:24px;
  background:rgba(10,22,39,0.44);
  box-shadow:0 12px 32px rgba(0,0,0,0.16);
}
.forward-source-wrap{
  padding:12px 14px;
}
.forward-source-wrap .forward-source-card{
  padding:0;
  margin:0;
  border:none;
  background:transparent;
}
.forward-source-wrap .forward-source-label{
  font-size:12px;
  font-weight:800;
}
.forward-source-wrap .forward-source-body,
.forward-source-wrap .forward-source-item{
  line-height:1.7;
}
.forward-source-wrap .forward-source-item{
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.06);
  background:rgba(255,255,255,0.04);
}
.forward-search-wrap{
  position:sticky;
  top:0;
  z-index:4;
  padding:10px 14px;
}
.forward-search-input-screen{
  width:100%;
  background:transparent;
  border:none;
  outline:none;
  padding:4px 0;
  font-size:16px;
  color:var(--text);
}
.forward-search-input-screen::placeholder{
  color:var(--text-muted);
}
.forward-targets-list{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-height:0;
}
.forward-section{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.forward-section-title{
  padding:2px 6px;
  font-size:12px;
  font-weight:900;
  color:var(--text-muted);
}
.forward-section-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.forward-target-row{
  width:100%;
  border:none;
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 14px;
  border-radius:24px;
  text-align:right;
  cursor:pointer;
  color:var(--text);
  background:rgba(255,255,255,0.055);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 12px 28px rgba(0,0,0,0.14);
  transition:transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}
.forward-target-row:active{
  transform:scale(0.985);
}
.forward-target-row.selected{
  background:linear-gradient(180deg, rgba(8,48,83,0.78), rgba(11,67,103,0.62));
  border-color:rgba(56,189,248,0.45);
  box-shadow:0 14px 32px rgba(14,165,233,0.16);
}
.forward-target-avatar{
  width:54px;
  height:54px;
  border-radius:50%;
  flex:0 0 54px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:rgba(255,255,255,0.08);
  color:var(--text);
  font-weight:900;
}
.forward-target-avatar .avatar-media{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.04);
}
.forward-target-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.forward-target-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.forward-target-top,
.forward-target-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
.forward-target-name{
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px;
  font-size:16px;
  font-weight:800;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.forward-target-meta{
  font-size:11px;
  color:var(--text-muted);
  white-space:nowrap;
  flex-shrink:0;
}
.forward-target-sub{
  flex:1;
  min-width:0;
  font-size:13px;
  color:var(--text-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.forward-target-chip{
  flex-shrink:0;
  border-radius:999px;
  padding:4px 10px;
  font-size:11px;
  font-weight:900;
  color:var(--text);
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.08);
}
.forward-target-check{
  width:24px;
  height:24px;
  flex:0 0 24px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:transparent;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.18);
}
.forward-target-row.selected .forward-target-check{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(180deg, rgba(25,214,255,0.98), rgba(0,153,255,0.88));
  box-shadow:0 8px 18px rgba(14,165,233,0.24);
}
.forward-empty{
  padding:20px 16px;
  border-radius:22px;
  text-align:center;
  color:var(--text-muted);
  font-size:14px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.04);
}
.forward-screen-footer{
  position:sticky;
  bottom:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px calc(env(safe-area-inset-bottom, 0px) + 14px);
  background:rgba(7,18,37,0.58);
  border-top:1px solid rgba(255,255,255,0.08);
}
.forward-screen-footer-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.forward-footer-label{
  font-size:12px;
  font-weight:800;
  color:var(--text-muted);
}
.forward-screen-footer .forward-picker-count{
  font-size:14px;
  font-weight:800;
  color:var(--text);
}
.forward-send-fab{
  width:56px;
  height:56px;
  flex:0 0 56px;
  border:none;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--primary);
  box-shadow:0 12px 28px rgba(0,122,255,0.30);
  transition:transform 0.16s ease, opacity 0.16s ease, box-shadow 0.16s ease;
}
.forward-send-fab:active:not(:disabled){
  transform:scale(0.94);
}
.forward-send-fab:disabled{
  opacity:0.48;
  box-shadow:none;
}
.forward-send-fab .ui-icon{
  filter:brightness(0) invert(1);
}
.forward-send-spinner{
  width:20px;
  height:20px;
  border-radius:50%;
  border:2.5px solid rgba(255,255,255,0.34);
  border-top-color:#fff;
  animation:forwardSendSpin 0.8s linear infinite;
}
@keyframes forwardSendSpin{
  to{ transform:rotate(360deg); }
}

body.light-theme .forward-screen{
  background:linear-gradient(180deg, rgba(245,250,255,0.98), rgba(235,244,252,0.98) 52%, rgba(240,246,251,0.99) 100%);
}
body.light-theme .forward-screen::before{
  background:
    radial-gradient(400px 240px at 92% 6%, rgba(59,130,246,0.10), transparent 72%),
    radial-gradient(360px 220px at 8% 0%, rgba(56,189,248,0.10), transparent 72%),
    radial-gradient(420px 250px at 50% 100%, rgba(14,165,233,0.08), transparent 76%);
}
body.light-theme .forward-screen-header,
body.light-theme .forward-screen-footer,
body.light-theme .forward-source-wrap,
body.light-theme .forward-search-wrap{
  background:rgba(255,255,255,0.74);
  border-color:rgba(15,23,42,0.08);
  box-shadow:0 12px 28px rgba(15,23,42,0.05);
}
body.light-theme .forward-screen-close{
  background:rgba(148,163,184,0.12);
  border-color:rgba(15,23,42,0.08);
}
body.light-theme .forward-target-row{
  background:rgba(255,255,255,0.88);
  border-color:rgba(15,23,42,0.08);
  box-shadow:0 10px 24px rgba(15,23,42,0.05);
}
body.light-theme .forward-target-row.selected{
  background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(231,244,255,0.98));
  border-color:rgba(14,165,233,0.34);
  box-shadow:0 12px 28px rgba(14,165,233,0.10);
}
body.light-theme .forward-target-avatar{
  background:rgba(148,163,184,0.12);
}
body.light-theme .forward-target-avatar .avatar-media{
  border-color:rgba(15,23,42,0.08);
  background:rgba(255,255,255,0.92);
}
body.light-theme .forward-target-chip{
  color:#0f172a;
  border-color:rgba(13,110,253,0.10);
  background:rgba(13,110,253,0.08);
}
body.light-theme .forward-target-check{
  background:rgba(255,255,255,0.82);
  border-color:rgba(15,23,42,0.12);
}
body.light-theme .forward-source-wrap .forward-source-item,
body.light-theme .forward-empty{
  background:rgba(255,255,255,0.86);
  border-color:rgba(15,23,42,0.08);
}
body.light-theme .forward-search-input-screen,
body.light-theme .forward-screen-title,
body.light-theme .forward-screen-footer .forward-picker-count,
body.light-theme .forward-target-name{
  color:var(--text);
}


/* =========================================================
   Forward screen: match main app matte theme
   ========================================================= */
.forward-screen{
  background: var(--bg-deep);
}
.forward-screen::before{
  display:none;
}
.forward-screen-header,
.forward-screen-footer,
.forward-source-wrap,
.forward-search-wrap{
  background: rgba(6, 11, 67, 0.96);
  border-color: rgba(255,255,255,0.08);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.forward-screen-header{
  background: rgba(2, 5, 31, 0.98);
}
.forward-screen-footer{
  background: rgba(2, 5, 31, 0.98);
}
.forward-search-wrap{
  border-radius: 20px;
}
.forward-search-input-screen{
  font-size: 15px;
}
.forward-source-wrap .forward-source-item,
.forward-empty{
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.06);
  box-shadow: none;
}
.forward-target-row{
  background: rgba(255,255,255,0.02);
  border-color: rgba(255,255,255,0.05);
  box-shadow: none;
  border-radius: 20px;
}
.forward-target-row:hover,
.forward-target-row:active{
  background: rgba(255,255,255,0.035);
}
.forward-target-row.selected{
  background: rgba(56, 189, 248, 0.14);
  border-color: rgba(56, 189, 248, 0.22);
  box-shadow: none;
}
.forward-target-avatar{
  background: rgba(255,255,255,0.04);
}
.forward-target-avatar .avatar-media{
  background: var(--bg-elevated);
  border-color: rgba(255,255,255,0.08);
}
.forward-target-chip{
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.06);
}
.forward-target-check{
  background: rgba(255,255,255,0.02);
}
.forward-send-fab{
  box-shadow: 0 8px 20px rgba(0, 122, 255, 0.24);
}

body.light-theme .forward-screen{
  background: var(--bg-deep);
}
body.light-theme .forward-screen::before{
  display:none;
}
body.light-theme .forward-screen-header,
body.light-theme .forward-screen-footer,
body.light-theme .forward-source-wrap,
body.light-theme .forward-search-wrap{
  background: rgba(255,255,255,0.96);
  border-color: rgba(15,23,42,0.08);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.light-theme .forward-target-row{
  background: rgba(255,255,255,0.98);
  border-color: rgba(15,23,42,0.06);
  box-shadow: none;
}
body.light-theme .forward-target-row:hover,
body.light-theme .forward-target-row:active{
  background: rgba(248,250,252,0.98);
}
body.light-theme .forward-target-row.selected{
  background: rgba(13,110,253,0.08);
  border-color: rgba(13,110,253,0.18);
  box-shadow: none;
}
body.light-theme .forward-target-avatar{
  background: rgba(15,23,42,0.04);
}
body.light-theme .forward-target-avatar .avatar-media{
  background: #fff;
  border-color: rgba(15,23,42,0.08);
}
body.light-theme .forward-source-wrap .forward-source-item,
body.light-theme .forward-empty{
  background: rgba(248,250,252,0.92);
  border-color: rgba(15,23,42,0.08);
}

@media (max-width: 640px){
  .forward-screen-header{
    padding:calc(env(safe-area-inset-top, 0px) + 12px) 12px 12px;
  }
  .forward-screen-body{
    padding:10px 10px 116px;
  }
  .forward-source-wrap,
  .forward-search-wrap,
  .forward-target-row,
  .forward-empty{
    border-radius:20px;
  }
  .forward-target-row{
    padding:12px;
  }
  .forward-target-avatar{
    width:50px;
    height:50px;
    flex-basis:50px;
  }
  .forward-screen-footer{
    padding:10px 12px calc(env(safe-area-inset-bottom, 0px) + 12px);
  }
}

/* Saved hub page */
.saved-page {
  padding: 18px 0 108px;
}
.saved-hub {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 0 14px;
}
.saved-self-card {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.035);
  color: var(--text);
  border-radius: 26px;
  padding: 16px 18px;
  cursor: pointer;
  text-align: right;
  box-shadow: 0 16px 38px rgba(3,8,20,0.16);
}
.saved-self-card:active { transform: scale(0.995); }
.saved-self-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.saved-self-avatar .avatar-media,
.saved-feed-avatar .avatar-media {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
}
.saved-self-star-media {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.1) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07);
}
.saved-star-svg {
  width: 58%;
  height: 58%;
  display: block;
  fill: #ffffff;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,0.16));
}
.saved-self-star {
  color: #ffffff;
  font-size: 28px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-shadow: 0 1px 0 rgba(255,255,255,0.2);
  transform: translateY(-1px);
}
.saved-feed-star {
  font-size: 22px;
}
.saved-self-content,
.saved-feed-content {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.saved-self-title {
  font-size: 17px;
  font-weight: 800;
  color: var(--text);
  line-height: 1.5;
}
.saved-self-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.saved-feed-head {
  padding: 2px 4px 0;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 800;
}
.saved-feed-list {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  overflow: hidden;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
}
.saved-feed-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: transparent;
  color: var(--text);
  text-align: right;
  cursor: pointer;
}
.saved-feed-item:last-child { border-bottom: 0; }
.saved-feed-item:active { background: rgba(255,255,255,0.035); }
.saved-feed-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.saved-feed-top {
  display: flex;
  align-items: center;
  gap: 10px;
}
.saved-feed-title {
  flex: 1;
  min-width: 0;
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.saved-feed-time {
  flex-shrink: 0;
  font-size: 12px;
  color: var(--text-muted);
}
.saved-feed-sub {
  margin-top: 2px;
  font-size: 12px;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.saved-feed-preview {
  margin-top: 4px;
  font-size: 13px;
  color: var(--text);
  opacity: 0.9;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.saved-feed-empty {
  margin: 0;
}

body.light-theme .saved-self-card {
  background: rgba(255,255,255,0.86);
  border-color: rgba(15,23,42,0.08);
  box-shadow: 0 16px 34px rgba(15,23,42,0.10);
}
body.light-theme .saved-feed-list {
  background: rgba(255,255,255,0.78);
  border-color: rgba(15,23,42,0.08);
}
body.light-theme .saved-feed-item {
  border-bottom-color: rgba(15,23,42,0.08);
}
body.light-theme .saved-self-avatar .avatar-media,
body.light-theme .saved-feed-avatar .avatar-media {
  background: rgba(15,23,42,0.04);
  border-color: rgba(15,23,42,0.08);
}
body.light-theme .saved-self-star-media,
body.light-theme .saved-feed-avatar .saved-self-star-media {
  background: #edf2f7 !important;
  border-color: rgba(15,23,42,0.08) !important;
  box-shadow: none !important;
}
body.light-theme .saved-self-star,
body.light-theme .saved-feed-star,
body.light-theme .saved-star-svg {
  color: #0f172a !important;
  fill: #0f172a !important;
  text-shadow: none !important;
  filter: none !important;
}

@media (min-width: 900px) {
  .saved-page {
    padding-top: 24px;
  }
  .saved-hub {
    max-width: 880px;
    margin: 0 auto;
    padding: 0 18px;
  }
}


/* hide swipe-reply visual marker; keep the gesture itself */
.swipe-reply-indicator { display: none !important; }


body.swipe-reply-lock,
body.swipe-reply-lock #viewChat,
body.swipe-reply-lock .messages-area {
  overscroll-behavior-x: none !important;
  overflow-x: hidden !important;
}

body.swipe-reply-lock .messages-area,
body.swipe-reply-lock .msg-row.swipe-reply-current,
body.swipe-reply-lock .msg-row.swipe-reply-current .msg-container,
body.swipe-reply-lock .msg-row.swipe-reply-current .msg-bubble {
  touch-action: none !important;
  -ms-touch-action: none !important;
}


.chat-search-remote-results{display:none;width:100%;margin-top:8px;max-height:220px;overflow:auto;background:rgba(6,14,24,.72);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:8px;gap:8px;flex-direction:column}
body.light-theme .chat-search-remote-results{background:rgba(255,255,255,.94);border-color:rgba(15,23,42,.08)}
.chat-search-remote-item{width:100%;display:block;text-align:right;border:0;border-radius:14px;padding:10px 12px;background:rgba(255,255,255,.04);color:var(--text);cursor:pointer}
.chat-search-remote-item + .chat-search-remote-item{margin-top:6px}
.chat-search-remote-item:hover{background:rgba(255,255,255,.08)}
body.light-theme .chat-search-remote-item{background:rgba(15,23,42,.04)}
body.light-theme .chat-search-remote-item:hover{background:rgba(15,23,42,.08)}
.chat-search-remote-top{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--text-muted);margin-bottom:4px}
.chat-search-remote-snippet{font-size:13px;line-height:1.7;color:var(--text)}
.chat-search-empty{padding:10px 12px;font-size:12px;color:var(--text-muted)}
.poll-card{margin-top:8px;padding:12px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
body.light-theme .poll-card{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.08)}
.poll-question{font-weight:800;font-size:14px;margin-bottom:10px;color:var(--text)}
.poll-options{display:flex;flex-direction:column;gap:8px}
.poll-option-btn{position:relative;width:100%;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--text);text-align:right;overflow:hidden;cursor:pointer}
.poll-option-btn[disabled]{opacity:.7;cursor:default}
body.light-theme .poll-option-btn{border-color:rgba(15,23,42,.08);background:rgba(15,23,42,.04)}
.poll-option-btn.is-voted{border-color:rgba(95,179,255,.55)}
.poll-option-fill{position:absolute;inset:0 auto 0 0;height:100%;background:linear-gradient(90deg, rgba(95,179,255,.28), rgba(95,179,255,.08));pointer-events:none}
.poll-option-content{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px}
.poll-option-label{font-size:13px;font-weight:700}
.poll-option-stats{font-size:12px;color:var(--text-muted);white-space:nowrap}
.poll-meta{margin-top:8px;font-size:12px;color:var(--text-muted)}
.poll-builder{display:flex;flex-direction:column;gap:16px}
.poll-builder-intro{font-size:13px;line-height:1.9;color:var(--text-muted)}
.poll-builder-field{display:flex;flex-direction:column;gap:10px}
.poll-builder-field label{font-size:13px;font-weight:800;color:var(--text)}
.poll-builder-field-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.poll-builder-counter{font-size:12px;color:var(--text-muted)}
.poll-builder-input{width:100%;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);color:var(--text);padding:13px 14px;font:inherit;outline:none;transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;box-sizing:border-box}
.poll-builder-input:focus{border-color:rgba(95,179,255,.55);box-shadow:0 0 0 3px rgba(95,179,255,.12)}
body.light-theme .poll-builder-input{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.08)}
.poll-builder-options{display:flex;flex-direction:column;gap:10px}
.poll-builder-option{display:flex;align-items:center;gap:10px}
.poll-builder-option-input{flex:1 1 auto}
.poll-builder-remove{width:42px;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);color:var(--text);font-size:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .16s ease, border-color .16s ease, background .16s ease}
.poll-builder-remove:hover:not(:disabled){transform:translateY(-1px);border-color:rgba(248,113,113,.45);color:#fca5a5}
.poll-builder-remove:disabled{opacity:.45;cursor:not-allowed}
body.light-theme .poll-builder-remove{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.08)}
.poll-builder-add{width:100%;border-radius:16px;border:1px dashed rgba(95,179,255,.42);background:rgba(95,179,255,.08);color:#93c5fd;padding:12px 14px;font:inherit;font-weight:800;cursor:pointer;transition:transform .16s ease, opacity .16s ease, background .16s ease}
.poll-builder-add:hover:not(:disabled){transform:translateY(-1px);background:rgba(95,179,255,.12)}
.poll-builder-add:disabled{opacity:.55;cursor:not-allowed}
body.light-theme .poll-builder-add{background:rgba(37,99,235,.08);color:#2563eb;border-color:rgba(37,99,235,.22)}
.poll-builder-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:4px}
@media (max-width: 640px){.poll-builder-actions{flex-direction:column-reverse}.poll-builder-actions .btn-primary,.poll-builder-actions .btn-secondary{width:100%}}


.settings-shortcuts{display:grid;gap:12px;margin-top:14px}
.settings-shortcut-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-decoration:none;color:inherit;transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease}
.settings-shortcut-card:hover{transform:translateY(-1px);border-color:rgba(56,189,248,.28);box-shadow:0 14px 32px rgba(0,0,0,.18)}
.settings-shortcut-card:active{transform:scale(.995)}
.settings-shortcut-icon{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:rgba(56,189,248,.12);border:1px solid rgba(56,189,248,.18);flex:0 0 46px}
.settings-shortcut-icon svg{width:24px;height:24px;fill:#38bdf8}
.settings-shortcut-content{display:flex;flex-direction:column;gap:4px;min-width:0}
.settings-shortcut-title{font-weight:800;color:var(--text)}
.settings-shortcut-sub{font-size:12px;color:var(--text-muted);line-height:1.8}
body.light-theme .settings-shortcut-card{background:#fff}
body.light-theme .settings-shortcut-card:hover{box-shadow:0 14px 30px rgba(15,23,42,.08)}
body.light-theme .settings-shortcut-icon{background:rgba(13,110,253,.08);border-color:rgba(13,110,253,.12)}
body.light-theme .settings-shortcut-icon svg{fill:#2563eb}

.device-session-list{display:grid;gap:12px}
.device-session-card{border:1px solid var(--line);border-radius:16px;padding:14px;background:rgba(255,255,255,.03)}
.device-session-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.device-session-title{font-weight:800;font-size:15px;color:var(--text)}
.device-session-agent{margin-top:4px;font-size:12px;line-height:1.7;color:var(--text-muted);word-break:break-word}
.device-session-meta{margin-top:10px;font-size:12px;line-height:1.9;color:var(--text-muted);word-break:break-word}
.device-session-actions{display:flex;justify-content:flex-end;margin-top:12px}
.device-session-badge{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:rgba(56,189,248,.16);color:#7dd3fc;font-size:12px;font-weight:700}
.msg-row.pending-message .msg-bubble{opacity:.88}
.msg-row.failed-message .msg-bubble{border:1px solid rgba(239,68,68,.36)}
.msg-status-inline{margin-inline-start:6px;font-size:11px;color:var(--text-muted)}
.msg-status-inline.is-delivered{color:rgba(226,232,240,.9)}
.msg-status-inline.is-read{color:rgba(60,255,140,.95)}
.msg-status-inline.is-failed{color:#f87171}
.msg-status-inline.is-pending{color:var(--text-muted)}
.msg-row.failed-message .msg-status-inline{color:#f87171}
body.light-theme .msg-status-inline.is-delivered{color:#334155}
body.light-theme .msg-status-inline.is-read{color:#16a34a}
body.light-theme .msg-status-inline.is-failed{color:#b91c1c}
.msg-retry-btn{margin-inline-start:8px;border:0;background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:2px 8px;font-size:11px;cursor:pointer;font-family:inherit}
.msg-retry-btn:hover{background:rgba(255,255,255,.14)}
.msg-row.failed-message .msg-retry-btn{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.28);color:#fecaca}
body.light-theme .msg-retry-btn{background:rgba(15,23,42,.05);border-color:rgba(15,23,42,.10);color:#0f172a}
body.light-theme .msg-row.failed-message .msg-retry-btn{background:rgba(239,68,68,.10);border-color:rgba(239,68,68,.22);color:#b91c1c}
body.light-theme .device-session-card{background:#fff}
body.light-theme .device-session-badge{background:rgba(2,132,199,.1);color:#0369a1}


.settings-shortcuts-large{grid-template-columns:1fr}
.settings-shortcut-icon.use-image-icon{background:rgba(56,189,248,.10);border-color:rgba(56,189,248,.18)}
.settings-shortcut-icon.use-image-icon img{width:24px;height:24px;display:block;color:#38bdf8}
body.light-theme .settings-shortcut-icon.use-image-icon{background:rgba(37,99,235,.08);border-color:rgba(37,99,235,.14)}
body.light-theme .settings-shortcut-icon.use-image-icon img{color:#2563eb}



/* Professional settings icon alignment */
.bottom-nav .nav-icon .ui-icon{
  display:block;
  width:22px;
  height:22px;
  margin:0 auto;
  object-fit:contain;
  object-position:center;
  transform:none !important;
}

/* Make the room editor close button visible in dark and light themes */
.room-editor-actions [data-room-editor-close].profile-action-btn{
  background:linear-gradient(180deg, rgba(30,41,59,.92) 0%, rgba(15,23,42,.98) 100%);
  border:1px solid rgba(148,163,184,.36);
  color:#f8fafc;
  box-shadow:0 10px 24px rgba(15,23,42,.22);
}
.room-editor-actions [data-room-editor-close].profile-action-btn:active{
  transform:scale(.96);
}
body.light-theme .room-editor-actions [data-room-editor-close].profile-action-btn{
  background:linear-gradient(180deg, #f8fbff 0%, #e5edf7 100%);
  border-color:rgba(15,23,42,.14);
  color:#0f172a;
  box-shadow:0 10px 22px rgba(148,163,184,.20);
}

/* Device sessions redesign */
.device-session-list{display:grid;gap:14px}
.device-session-group{display:grid;gap:14px}
.device-session-group + .device-session-group{margin-top:6px}
.device-session-group-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0;
  padding:0 2px;
  font-size:14px;
  font-weight:800;
  color:var(--text-muted);
}
.device-session-card{
  position:relative;
  display:grid;
  grid-template-columns:84px minmax(0, 1fr);
  align-items:start;
  gap:14px;
  border-radius:22px;
  padding:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.045) 0%, rgba(255,255,255,.03) 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 42px rgba(2,6,23,.18);
}
.device-session-card.is-current{
  border-color:rgba(34,197,94,.34);
  box-shadow:0 0 0 1px rgba(34,197,94,.16) inset, 0 18px 44px rgba(34,197,94,.12);
}
.device-session-card.is-other{
  border-color:rgba(248,113,113,.20);
  box-shadow:0 0 0 1px rgba(248,113,113,.07) inset, 0 18px 44px rgba(239,68,68,.08);
}
.device-session-side{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:2px;
}
.device-session-orb{
  width:68px;
  height:68px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  line-height:1.35;
  font-size:12px;
  font-weight:900;
  padding:8px;
  border:1px solid transparent;
}
.device-session-orb.current{
  background:radial-gradient(circle at 30% 30%, rgba(74,222,128,.32), rgba(34,197,94,.18) 60%, rgba(34,197,94,.08) 100%);
  color:#d1fae5;
  border-color:rgba(34,197,94,.34);
  box-shadow:0 0 0 10px rgba(34,197,94,.08), 0 0 32px rgba(34,197,94,.18);
}
.device-session-orb.other{
  background:radial-gradient(circle at 30% 30%, rgba(248,113,113,.26), rgba(239,68,68,.16) 60%, rgba(239,68,68,.07) 100%);
  color:#fee2e2;
  border-color:rgba(248,113,113,.28);
  box-shadow:0 0 0 10px rgba(248,113,113,.06), 0 0 28px rgba(239,68,68,.14);
}
.device-session-main{min-width:0}
.device-session-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.device-session-title{
  font-size:20px;
  font-weight:900;
  color:var(--text);
  line-height:1.25;
}
.device-session-tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:10px 16px;
  border-radius:14px;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
.device-session-tag.current{
  background:rgba(34,197,94,.12);
  color:#bbf7d0;
  border:1px solid rgba(34,197,94,.22);
}
.device-session-lines{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.device-session-line{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:11px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.05);
}
.device-session-line-label{
  min-width:106px;
  font-size:12px;
  font-weight:800;
  color:var(--text-muted);
}
.device-session-line-value{
  flex:1;
  text-align:left;
  direction:ltr;
  font-size:13px;
  font-weight:700;
  color:var(--text);
  word-break:break-word;
}
.device-session-line-value.is-rtl{
  direction:rtl;
  text-align:right;
}
.device-session-subtle .device-session-line-value,
.device-session-subtle .device-session-line-label{
  color:var(--text-muted);
}
.device-session-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:12px;
}
.device-session-top .device-session-actions{margin-top:0}
.device-session-actions .btn-danger,
.device-session-actions .btn-secondary{
  min-width:146px;
}
.device-session-empty{
  padding:18px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px dashed rgba(255,255,255,.12);
  color:var(--text-muted);
}
body.light-theme .device-session-card{
  background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(247,250,255,.96) 100%);
  border-color:rgba(15,23,42,.08);
  box-shadow:0 16px 36px rgba(148,163,184,.20);
}
body.light-theme .device-session-card.is-current{
  border-color:rgba(22,163,74,.26);
  box-shadow:0 0 0 1px rgba(22,163,74,.12) inset, 0 16px 36px rgba(22,163,74,.08);
}
body.light-theme .device-session-card.is-other{
  border-color:rgba(220,38,38,.16);
  box-shadow:0 0 0 1px rgba(220,38,38,.06) inset, 0 16px 36px rgba(220,38,38,.05);
}
body.light-theme .device-session-orb.current{
  color:#166534;
  background:radial-gradient(circle at 30% 30%, rgba(134,239,172,.56), rgba(74,222,128,.24) 60%, rgba(74,222,128,.10) 100%);
  box-shadow:0 0 0 10px rgba(34,197,94,.08), 0 0 28px rgba(34,197,94,.10);
}
body.light-theme .device-session-orb.other{
  color:#991b1b;
  background:radial-gradient(circle at 30% 30%, rgba(254,202,202,.88), rgba(248,113,113,.18) 60%, rgba(248,113,113,.07) 100%);
  box-shadow:0 0 0 10px rgba(239,68,68,.05), 0 0 26px rgba(239,68,68,.08);
}
body.light-theme .device-session-tag.current{
  background:rgba(22,163,74,.10);
  color:#166534;
  border-color:rgba(22,163,74,.18);
}
body.light-theme .device-session-line{
  background:rgba(15,23,42,.028);
  border-color:rgba(15,23,42,.06);
}
body.light-theme .device-session-empty{
  background:#fff;
  border-color:rgba(15,23,42,.12);
}
@media (max-width: 640px){
  .device-session-card{grid-template-columns:1fr;gap:12px}
  .device-session-side{justify-content:flex-start}
  .device-session-orb{width:64px;height:64px}
  .device-session-top{flex-direction:column;align-items:stretch}
  .device-session-title{font-size:18px}
  .device-session-line{flex-direction:column;gap:6px}
  .device-session-line-value,
  .device-session-line-value.is-rtl{text-align:right;direction:rtl}
  .device-session-actions .btn-danger,
  .device-session-actions .btn-secondary{width:100%}
}

/* ===== persistent bottom nav on auxiliary pages ===== */
.admin-shell{padding-bottom:118px}
.persist-bottom-nav{z-index:140}
.admin-body .bottom-nav{bottom:calc(env(safe-area-inset-bottom, 0px) + 18px)}

/* ===== sessions page polish ===== */
.session-toolbar{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.session-toolbar .btn-secondary,
.session-toolbar .btn-danger{
  width:100%;
  min-height:54px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  font-size:15px;
  font-weight:800;
  line-height:1.2;
  padding:0 14px;
  text-align:center;
}
.device-session-group{gap:16px}
.device-session-group-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.device-session-count-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:30px;
  height:30px;
  border-radius:999px;
  padding:0 10px;
  background:rgba(239,68,68,.14);
  border:1px solid rgba(248,113,113,.24);
  color:#fecaca;
  font-size:12px;
  font-weight:800;
}
.device-session-card{
  position:relative;
  display:grid;
  gap:16px;
  padding:18px;
  border-radius:24px;
  background:rgba(22,33,49,.96);
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 18px 42px rgba(2,8,23,.20), inset 0 1px 0 rgba(255,255,255,.04);
}
.device-session-card.is-current{
  border-color:rgba(34,197,94,.30);
  box-shadow:0 0 0 1px rgba(34,197,94,.14), 0 18px 44px rgba(34,197,94,.12), inset 0 1px 0 rgba(255,255,255,.05);
}
.device-session-card.is-other{
  border-color:rgba(248,113,113,.18);
  box-shadow:0 0 0 1px rgba(248,113,113,.08), 0 18px 44px rgba(248,113,113,.08), inset 0 1px 0 rgba(255,255,255,.05);
}
.device-session-hero{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
}
.device-session-visual{
  position:relative;
  width:88px;
  height:88px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(15,23,42,.72);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.device-session-visual.current{
  background:radial-gradient(circle at center, rgba(34,197,94,.22), rgba(15,23,42,.95) 68%);
  box-shadow:0 0 0 1px rgba(34,197,94,.18), 0 0 0 18px rgba(34,197,94,.07), 0 18px 40px rgba(34,197,94,.14);
}
.device-session-visual.other{
  background:radial-gradient(circle at center, rgba(239,68,68,.16), rgba(15,23,42,.95) 68%);
  box-shadow:0 0 0 1px rgba(248,113,113,.16), 0 0 0 18px rgba(248,113,113,.05), 0 18px 40px rgba(248,113,113,.10);
}
.device-session-platform-icon,
.device-session-browser-chip{
  display:flex;
  align-items:center;
  justify-content:center;
}
.device-session-platform-icon{
  width:50px;
  height:50px;
}
.device-session-platform-icon svg,
.device-session-browser-chip svg{
  width:100%;
  height:100%;
  display:block;
}
.device-session-browser-chip{
  position:absolute;
  left:-2px;
  bottom:-2px;
  width:34px;
  height:34px;
  padding:5px;
  border-radius:50%;
  background:rgba(10,18,30,.96);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 10px 20px rgba(2,8,23,.24);
}
.device-session-headline{min-width:0}
.device-session-kicker{
  color:var(--text-muted);
  font-size:13px;
  font-weight:700;
  margin-bottom:4px;
}
.device-session-title{
  font-size:30px;
  font-weight:900;
  line-height:1.15;
  color:var(--text);
}
.device-session-subtitle{
  margin-top:6px;
  color:var(--text-muted);
  font-size:15px;
  font-weight:700;
}
.device-session-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.device-session-status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 18px;
  border-radius:999px;
  font-size:14px;
  font-weight:900;
  white-space:nowrap;
}
.device-session-status-pill.current{
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.26);
  color:#bbf7d0;
  box-shadow:0 12px 28px rgba(34,197,94,.10);
}
.device-session-actions .btn-danger{
  min-height:46px;
  border-radius:16px;
  padding:0 18px;
  font-size:14px;
  font-weight:800;
}
.device-session-lines{
  display:grid;
  gap:10px;
}
.device-session-line{
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  padding:14px 16px;
}
.device-session-line-label{
  font-size:12px;
  color:var(--text-muted);
  font-weight:800;
  margin-bottom:6px;
}
.device-session-line-value{
  font-size:17px;
  color:var(--text);
  font-weight:800;
  line-height:1.6;
}
.device-session-line-value.is-rtl{direction:rtl;text-align:right}
.device-session-subtle .device-session-line-value{font-size:16px}
.device-session-empty{
  border-radius:18px;
  padding:18px;
  background:rgba(255,255,255,.03);
  border:1px dashed rgba(255,255,255,.12);
}
body.light-theme .device-session-card{
  background:#ffffff;
  border-color:rgba(15,23,42,.08);
  box-shadow:0 14px 32px rgba(15,23,42,.08);
}
body.light-theme .device-session-card.is-current{
  border-color:rgba(34,197,94,.24);
  box-shadow:0 0 0 1px rgba(34,197,94,.10), 0 14px 32px rgba(34,197,94,.10);
}
body.light-theme .device-session-card.is-other{
  border-color:rgba(239,68,68,.14);
  box-shadow:0 0 0 1px rgba(239,68,68,.06), 0 14px 32px rgba(239,68,68,.06);
}
body.light-theme .device-session-visual.current{
  background:radial-gradient(circle at center, rgba(34,197,94,.18), rgba(255,255,255,.98) 68%);
}
body.light-theme .device-session-visual.other{
  background:radial-gradient(circle at center, rgba(239,68,68,.12), rgba(255,255,255,.98) 68%);
}
body.light-theme .device-session-browser-chip{background:#fff}
body.light-theme .device-session-line{
  background:#f8fbff;
  border-color:rgba(148,163,184,.20);
}
body.light-theme .device-session-empty{
  background:#fff;
  border-color:rgba(148,163,184,.24);
}
@media (max-width: 520px){
  .session-toolbar{grid-template-columns:1fr 1fr}
  .device-session-hero{grid-template-columns:1fr;justify-items:start}
  .device-session-actions{width:100%}
  .device-session-actions .btn-danger,
  .device-session-status-pill{width:100%}
  .device-session-title{font-size:26px}
  .device-session-subtitle{font-size:14px}
}


.room-state-chips{display:inline-flex;align-items:center;gap:6px;flex-shrink:0}
.room-state-chip{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800;line-height:1;white-space:nowrap}
.room-state-chip-pin{background:rgba(56,189,248,.12);color:#7dd3fc;border:1px solid rgba(56,189,248,.28)}
.room-state-chip-arch{background:rgba(245,158,11,.10);color:#fbbf24;border:1px solid rgba(245,158,11,.26)}
body.light-theme .room-state-chip-pin{background:rgba(37,99,235,.08);color:#2563eb;border-color:rgba(37,99,235,.18)}
body.light-theme .room-state-chip-arch{background:rgba(217,119,6,.08);color:#b45309;border-color:rgba(217,119,6,.18)}
.filter-tabs{overflow-x:auto;scrollbar-width:none}
.filter-tabs::-webkit-scrollbar{display:none}
.filter-btn{flex:0 0 auto}
.scheduled-builder-text{min-height:110px;resize:vertical}
.scheduled-manager{display:flex;flex-direction:column;gap:14px}
.scheduled-manager-intro{font-size:13px;line-height:1.9;color:var(--text-muted)}
.scheduled-empty{padding:22px 18px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);color:var(--text-muted);text-align:center}
.scheduled-item{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:18px;padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px}
body.light-theme .scheduled-item,body.light-theme .scheduled-empty{background:rgba(15,23,42,.03);border-color:rgba(15,23,42,.08)}
.scheduled-item-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.scheduled-status{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800}
.scheduled-status.status-pending{background:rgba(59,130,246,.12);color:#93c5fd}
.scheduled-status.status-failed{background:rgba(239,68,68,.12);color:#fca5a5}
.scheduled-status.status-cancelled{background:rgba(148,163,184,.14);color:#cbd5e1}
.scheduled-status.status-sent{background:rgba(34,197,94,.12);color:#86efac}
.scheduled-time{font-size:12px;color:var(--text-muted)}
.scheduled-body{font-size:14px;line-height:1.9;color:var(--text);white-space:pre-wrap;word-break:break-word}
.scheduled-error{font-size:12px;color:#fda4af;line-height:1.8}
.scheduled-actions,.scheduled-edit-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.btn-danger-lite{border:1px solid rgba(239,68,68,.26);background:rgba(239,68,68,.10);color:#fda4af;border-radius:14px;padding:10px 14px;font:inherit;font-weight:800;cursor:pointer}
.scheduled-edit-panel{display:flex;flex-direction:column;gap:10px;padding-top:6px}
.scheduled-edit-text,.scheduled-edit-time{width:100%;box-sizing:border-box;border-radius:14px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);color:var(--text);padding:12px 13px;font:inherit;outline:none}
body.light-theme .scheduled-edit-text,body.light-theme .scheduled-edit-time{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.08)}
@media (max-width:640px){.scheduled-actions,.scheduled-edit-actions{flex-direction:column-reverse;align-items:stretch}.scheduled-actions .btn-primary,.scheduled-actions .btn-secondary,.scheduled-actions .btn-danger-lite,.scheduled-edit-actions .btn-primary,.scheduled-edit-actions .btn-secondary{width:100%}}

/* Rich pending uploads + room media gallery */
.pending-file-card-rich{gap:12px}
.pending-file-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pending-file-addmore{border:1px solid rgba(0,122,255,0.22);background:rgba(0,122,255,0.12);color:var(--primary);padding:8px 12px;border-radius:10px;font-weight:800;cursor:pointer;line-height:1;flex-shrink:0}
.pending-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.pending-preview-tile{position:relative;border:1px solid var(--glass-border);border-radius:14px;overflow:hidden;background:rgba(15,23,42,0.18);min-height:112px;cursor:zoom-in;display:flex;flex-direction:column;justify-content:flex-end}
.pending-preview-tile-media{width:100%;height:100%;min-height:112px;object-fit:cover;background:#000;display:block}
.pending-preview-tile-fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:112px;color:var(--text-muted);font-size:12px;font-weight:800;padding:14px;text-align:center}
.pending-preview-tile-fallback.pdf{background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02))}
.pending-preview-name{position:absolute;right:8px;left:8px;bottom:8px;padding:6px 8px;border-radius:10px;background:rgba(9,12,18,0.72);backdrop-filter:blur(10px);color:#fff;font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right}
.pending-preview-remove{position:absolute;top:8px;left:8px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(0,0,0,0.62);color:#fff;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2}
.room-media-modal{padding:14px}
.room-media-shell{width:min(98vw,1080px);max-height:94vh;display:flex;flex-direction:column;gap:14px;padding:14px;border-radius:24px}
.room-media-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.room-media-toolbar-meta{min-width:0;flex:1}
.room-media-title{font-size:16px;font-weight:900;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room-media-sub{font-size:12px;font-weight:700;color:var(--text-muted);margin-top:4px}
.room-media-tabs{display:flex;gap:8px;flex-wrap:wrap}
.room-media-tab{border:1px solid var(--glass-border);background:rgba(255,255,255,0.04);color:var(--text);padding:10px 14px;border-radius:999px;font-size:13px;font-weight:900;cursor:pointer;transition:all .2s ease}
.room-media-tab.active{background:rgba(0,122,255,0.18);border-color:rgba(0,122,255,0.28);color:#dfeeff;box-shadow:0 10px 22px rgba(0,122,255,0.16)}
.room-media-body{overflow:auto;min-height:240px;max-height:calc(94vh - 176px);padding-left:2px}
.room-media-body::-webkit-scrollbar{width:8px}
.room-media-body::-webkit-scrollbar-thumb{background:rgba(127,127,127,0.28);border-radius:999px}
.room-media-loading,.room-media-empty{min-height:220px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--glass-border);border-radius:18px;color:var(--text-muted);font-weight:800;text-align:center;padding:20px}
.room-media-footer{display:flex;justify-content:center}
.room-media-loadmore{min-width:160px}
.room-media-card-item{display:flex;gap:12px;align-items:stretch;padding:10px;border:1px solid var(--glass-border);border-radius:18px;background:rgba(255,255,255,0.03);margin-bottom:10px}
.room-media-card-item.is-grid{display:inline-flex;vertical-align:top;width:calc(33.333% - 8px);margin:0 10px 10px 0;flex-direction:column;padding:8px;gap:10px}
.room-media-card-thumb,.room-media-card-fallback{position:relative;border:0;background:rgba(15,23,42,0.22);border-radius:16px;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;color:var(--text)}
.room-media-card-item.is-grid .room-media-card-thumb,.room-media-card-item.is-grid .room-media-card-fallback{width:100%;aspect-ratio:1/1}
.room-media-card-thumb img,.room-media-card-thumb video{width:100%;height:100%;object-fit:cover;display:block;background:#000}
.room-media-card-thumb.is-audio{min-width:112px;width:112px;height:112px;background:linear-gradient(180deg, rgba(0,122,255,0.18), rgba(0,122,255,0.08))}
.room-media-card-thumb.is-video .room-media-play-badge{position:absolute;inset:auto auto 10px 10px;background:rgba(0,0,0,0.62);color:#fff;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}
.room-media-card-fallback{min-width:112px;width:112px;height:112px;font-size:28px}
.room-media-audio-icon{font-size:34px}
.room-media-card-copy{min-width:0;flex:1;display:flex;flex-direction:column;justify-content:center;gap:6px}
.room-media-card-title{font-size:13px;font-weight:900;color:var(--text);word-break:break-word}
.room-media-card-sub{font-size:12px;color:var(--text-muted);font-weight:700;line-height:1.8}
.room-media-link-card{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--glass-border);border-radius:18px;background:rgba(255,255,255,0.03);text-decoration:none;color:inherit;margin-bottom:10px}
.room-media-link-icon{width:48px;height:48px;border-radius:14px;background:rgba(0,122,255,0.14);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.room-media-link-copy{min-width:0;display:flex;flex-direction:column;gap:4px}
.room-media-link-title{font-size:13px;font-weight:900;color:var(--text);word-break:break-all}
.room-media-link-sub{font-size:12px;color:var(--text-muted);font-weight:700;line-height:1.8}
body.light-theme .pending-preview-name{background:rgba(255,255,255,0.82);color:#0f172a}
body.light-theme .pending-preview-remove{background:rgba(15,23,42,0.68)}
body.light-theme .room-media-card-item,
body.light-theme .room-media-link-card,
body.light-theme .room-media-loading,
body.light-theme .room-media-empty{background:#fff}
body.light-theme .room-media-tab.active{color:#0f4da8}
@media (max-width: 920px){
  .room-media-card-item.is-grid{width:calc(50% - 8px)}
}
@media (max-width: 640px){
  .pending-file-actions{width:100%;justify-content:flex-end}
  .pending-preview-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
  .room-media-modal{padding:8px}
  .room-media-shell{padding:10px;border-radius:20px;max-height:96vh}
  .room-media-body{max-height:calc(96vh - 176px)}
  .room-media-card-item.is-grid{width:100%;display:flex;flex-direction:row;gap:12px;padding:10px;margin:0 0 10px 0}
  .room-media-card-item.is-grid .room-media-card-thumb,
  .room-media-card-item.is-grid .room-media-card-fallback{width:96px;min-width:96px;height:96px;aspect-ratio:auto}
  .room-media-card-thumb.is-audio,
  .room-media-card-fallback{width:96px;min-width:96px;height:96px}
}

/* === Enhanced media gallery === */
.room-media-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.room-media-filters{display:flex;gap:8px;flex-wrap:wrap;min-width:0}
.room-media-filter-chip,.room-media-tool-btn{border:1px solid var(--glass-border);background:rgba(255,255,255,0.04);color:var(--text);padding:10px 14px;border-radius:999px;font-size:12px;font-weight:900;cursor:pointer;transition:all .18s ease}
.room-media-filter-chip.active,.room-media-tool-btn.active{background:rgba(0,122,255,0.16);border-color:rgba(0,122,255,0.32);color:#dfeeff;box-shadow:0 10px 22px rgba(0,122,255,0.14)}
.room-media-tool-btn{white-space:nowrap}
.room-media-selectionbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border:1px solid var(--glass-border);border-radius:18px;background:rgba(255,255,255,0.04)}
.room-media-selection-count{font-size:13px;font-weight:900;color:var(--text)}
.room-media-selection-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.room-media-selection-btn,.room-media-selection-cancel{min-width:110px}
.room-media-selection-cancel{border:1px solid var(--glass-border);background:transparent;color:var(--text);padding:10px 14px;border-radius:14px;font:inherit;font-weight:900;cursor:pointer}
.room-media-entry{position:relative}
.room-media-card-item{transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease}
.room-media-card-item:hover,.room-media-link-card:hover{transform:translateY(-1px);border-color:rgba(0,122,255,.2)}
.room-media-card-item.is-selected,.room-media-link-card.is-selected{border-color:rgba(34,197,94,.42);box-shadow:0 18px 38px rgba(34,197,94,.14)}
.room-media-card-topline{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.room-media-card-tag{flex-shrink:0;padding:5px 8px;border-radius:999px;background:rgba(0,122,255,.12);color:#9ed0ff;font-size:11px;font-weight:900}
.room-media-select-hit{position:absolute;top:10px;right:10px;width:26px;height:26px;border-radius:50%;border:2px solid rgba(255,255,255,.82);background:rgba(9,12,18,.32);backdrop-filter:blur(10px);cursor:pointer;z-index:4}
.room-media-select-hit::after{content:'';position:absolute;inset:5px;border-radius:50%;background:transparent;transform:scale(.7);transition:all .16s ease}
.room-media-select-hit.is-selected{border-color:#22c55e;background:rgba(34,197,94,.16)}
.room-media-select-hit.is-selected::after{background:#22c55e;transform:scale(1)}
.room-media-card-item.is-grid .room-media-select-hit{top:14px;right:14px}
.room-media-card-item.is-grid .room-media-card-copy{padding:0 2px 4px}
.room-media-card-item.is-list .room-media-card-copy{padding:4px 0}
.room-media-card-item.is-selected .room-media-card-thumb,.room-media-card-item.is-selected .room-media-card-fallback{outline:2px solid rgba(34,197,94,.36)}
body.light-theme .room-media-filter-chip,body.light-theme .room-media-tool-btn,body.light-theme .room-media-selectionbar{background:#fff}
body.light-theme .room-media-filter-chip.active,body.light-theme .room-media-tool-btn.active{color:#0f4da8}
body.light-theme .room-media-card-tag{background:rgba(37,99,235,.1);color:#2563eb}
body.light-theme .room-media-select-hit{background:rgba(255,255,255,.82);border-color:rgba(15,23,42,.12)}
@media (max-width: 640px){
  .room-media-selectionbar,.room-media-controls{align-items:stretch}
  .room-media-selection-actions{width:100%}
  .room-media-selection-btn,.room-media-selection-cancel,.room-media-tool-btn{flex:1 1 0}
}

/* === Enhanced polls === */
.poll-builder-pro{gap:18px}
.poll-builder-hero{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;border-radius:20px;background:linear-gradient(135deg, rgba(0,122,255,.14), rgba(99,102,241,.12));border:1px solid rgba(0,122,255,.16)}
.poll-builder-hero-icon{width:46px;height:46px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:24px;background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.poll-builder-hero-title{font-size:15px;font-weight:900;color:var(--text)}
.poll-builder-hero-sub{margin-top:4px;font-size:12px;line-height:1.9;color:var(--text-muted)}
.poll-builder-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.9fr);gap:16px;align-items:start}
.poll-builder-side{position:sticky;top:0}
.poll-builder-textarea{resize:vertical;min-height:96px}
.poll-builder-option{display:flex;align-items:center;gap:10px}
.poll-builder-order{width:34px;height:34px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(0,122,255,.12);color:#9ed0ff;font-size:12px;font-weight:900;flex-shrink:0}
.poll-preview-card{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:12px}
.poll-preview-head{display:flex;align-items:center;gap:10px}
.poll-preview-icon{width:38px;height:38px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:rgba(0,122,255,.14);font-size:20px}
.poll-preview-title{font-size:13px;font-weight:900;color:var(--text)}
.poll-preview-sub{font-size:11px;color:var(--text-muted);margin-top:2px}
.poll-preview-question{font-size:14px;font-weight:900;line-height:1.9;color:var(--text)}
.poll-preview-options{display:flex;flex-direction:column;gap:8px}
.poll-preview-option{position:relative;display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:16px;background:rgba(255,255,255,.03);overflow:hidden}
.poll-preview-bullet{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,122,255,.14);color:#9ed0ff;font-size:11px;font-weight:900;flex-shrink:0;position:relative;z-index:1}
.poll-preview-label{position:relative;z-index:1;font-size:13px;font-weight:800;color:var(--text);flex:1}
.poll-preview-bar{position:absolute;inset:0;border-radius:inherit;overflow:hidden}
.poll-preview-bar span{display:block;height:100%;background:linear-gradient(90deg, rgba(0,122,255,.14), rgba(0,122,255,.06))}
.poll-card{margin-top:8px;padding:14px;border-radius:20px;background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 34px rgba(0,0,0,.08)}
.poll-card-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}
.poll-card-icon{width:38px;height:38px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:rgba(0,122,255,.14);font-size:20px;flex-shrink:0}
.poll-card-kicker{font-size:11px;font-weight:900;color:var(--text-muted);margin-bottom:4px}
.poll-question{font-size:14px;font-weight:900;line-height:1.9;color:var(--text)}
.poll-options{display:flex;flex-direction:column;gap:8px}
.poll-option-btn{position:relative;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:16px;padding:0;overflow:hidden;cursor:pointer;text-align:right;color:inherit;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.poll-option-btn:hover{transform:translateY(-1px);border-color:rgba(0,122,255,.24)}
.poll-option-fill{position:absolute;top:0;right:0;bottom:0;background:linear-gradient(90deg, rgba(0,122,255,.18), rgba(0,122,255,.08));pointer-events:none}
.poll-option-content{position:relative;z-index:1;display:flex;align-items:center;gap:10px;padding:12px 14px}
.poll-option-order{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);font-size:11px;font-weight:900;flex-shrink:0}
.poll-option-copy{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.poll-option-label{font-size:13px;font-weight:900;color:var(--text);white-space:normal;word-break:break-word}
.poll-option-stats{font-size:11px;color:var(--text-muted);font-weight:800}
.poll-option-check{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#22c55e;font-size:14px;font-weight:900;flex-shrink:0}
.poll-option-btn.is-voted{border-color:rgba(34,197,94,.34);box-shadow:0 12px 28px rgba(34,197,94,.12)}
.poll-option-btn.is-voted .poll-option-order{background:rgba(34,197,94,.18);color:#dcfce7}
.poll-option-btn.is-voted .poll-option-fill{background:linear-gradient(90deg, rgba(34,197,94,.2), rgba(34,197,94,.08))}
.poll-meta{margin-top:10px;font-size:12px;color:var(--text-muted);font-weight:800}
body.light-theme .poll-builder-hero{background:linear-gradient(135deg, rgba(37,99,235,.1), rgba(59,130,246,.08));border-color:rgba(37,99,235,.14)}
body.light-theme .poll-builder-order,body.light-theme .poll-preview-bullet,body.light-theme .poll-card-icon{background:rgba(37,99,235,.1);color:#2563eb}
body.light-theme .poll-preview-card,body.light-theme .poll-card,body.light-theme .poll-option-btn{background:#fff;border-color:rgba(15,23,42,.08)}
body.light-theme .poll-option-fill{background:linear-gradient(90deg, rgba(37,99,235,.12), rgba(37,99,235,.05))}
body.light-theme .poll-option-btn.is-voted{border-color:rgba(34,197,94,.28)}
body.light-theme .poll-option-btn.is-voted .poll-option-fill{background:linear-gradient(90deg, rgba(34,197,94,.16), rgba(34,197,94,.05))}
@media (max-width: 820px){
  .poll-builder-layout{grid-template-columns:1fr}
  .poll-builder-side{position:static}
}


.pending-file-card-album{padding:14px;border-radius:24px;background:linear-gradient(180deg, rgba(13,27,42,0.95), rgba(10,21,34,0.92));box-shadow:0 18px 40px rgba(2,8,23,0.26)}
.pending-file-chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.pending-file-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(14,165,233,0.14);border:1px solid rgba(56,189,248,0.18);font-size:12px;font-weight:800;color:#c8f1ff}
.pending-file-chip.muted{background:rgba(255,255,255,0.06);border-color:rgba(255,255,255,0.08);color:var(--text-muted)}
.pending-preview-stack{display:flex;flex-direction:column;gap:12px}
.pending-preview-block{border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03);border-radius:20px;padding:12px}
.pending-preview-block-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.pending-preview-block-title{font-size:13px;font-weight:900;color:var(--text)}
.pending-preview-block-sub{font-size:11px;color:var(--text-muted);line-height:1.8}
.pending-preview-files-block{padding-bottom:10px}
.pending-preview-grid.is-album-grid,.media-album-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;grid-auto-flow:dense}
.pending-preview-grid.is-album-grid.layout-one,.media-album-grid.layout-one{grid-template-columns:1fr}
.pending-preview-grid.is-album-grid.layout-two,.media-album-grid.layout-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.pending-preview-grid.is-album-grid.layout-two .pending-preview-tile,.media-album-grid.layout-two .media-album-tile{min-height:168px}
.pending-preview-grid.is-album-grid.layout-three,.media-album-grid.layout-three{grid-template-columns:1.16fr .84fr;grid-auto-rows:110px}
.pending-preview-grid.is-album-grid.layout-three .pending-preview-tile:first-child,.media-album-grid.layout-three .media-album-tile:first-child{grid-row:span 2;min-height:228px}
.pending-preview-grid.is-album-grid.layout-four,.media-album-grid.layout-four,.pending-preview-grid.is-album-grid.layout-many,.media-album-grid.layout-many{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:126px}
.pending-preview-tile.is-media-album,.media-album-tile{position:relative;display:block;padding:0;border:0;border-radius:18px;overflow:hidden;background:#07131f;cursor:pointer;min-height:126px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.pending-preview-tile-media,.media-album-tile-media{display:block;width:100%;height:100%;min-height:126px;object-fit:cover;background:#000}
.pending-preview-more,.media-album-more{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(2,6,23,0.44);backdrop-filter:blur(4px);color:#fff;font-size:28px;font-weight:900}
.pending-preview-video-badge,.media-album-video-badge{position:absolute;right:10px;bottom:10px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(2,6,23,0.72);color:#fff;font-size:12px;font-weight:900;backdrop-filter:blur(8px)}
.pending-file-list{display:flex;flex-direction:column;gap:8px}
.pending-file-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(255,255,255,.06);background:rgba(6,13,22,.34);border-radius:16px;padding:10px 12px}
.pending-file-row-main{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.pending-file-row-icon{width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:19px;background:rgba(255,255,255,.06);flex-shrink:0}
.pending-file-row-copy{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.pending-file-row-name{font-size:13px;font-weight:900;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right}
.pending-file-row-meta{font-size:11px;font-weight:700;color:var(--text-muted)}
.pending-file-row-remove{border:1px solid rgba(239,68,68,.22);background:rgba(239,68,68,.10);color:#fda4af;border-radius:12px;padding:8px 12px;font:inherit;font-size:12px;font-weight:900;cursor:pointer;flex-shrink:0}
.msg-bubble.media-album-bubble{padding-bottom:12px}
.msg-bubble.media-album-bubble .msg-body{margin-bottom:8px}
.msg-row.media-album-hidden{display:none!important}
body.light-theme .pending-file-card-album{background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(245,248,252,0.96));box-shadow:0 16px 36px rgba(15,23,42,0.10)}
body.light-theme .pending-file-chip{color:#0369a1;background:rgba(14,165,233,0.10)}
body.light-theme .pending-file-chip.muted{background:rgba(15,23,42,0.04);border-color:rgba(15,23,42,0.08);color:#475569}
body.light-theme .pending-preview-block{background:rgba(255,255,255,.82);border-color:rgba(15,23,42,.06)}
body.light-theme .pending-file-row{background:#fff;border-color:rgba(15,23,42,.08)}
body.light-theme .pending-file-row-icon{background:rgba(15,23,42,.04)}
body.light-theme .pending-preview-tile.is-media-album,
body.light-theme .media-album-tile{background:#e2e8f0}
@media (max-width:640px){
  .pending-preview-grid.is-album-grid.layout-two .pending-preview-tile,.media-album-grid.layout-two .media-album-tile{min-height:140px}
  .pending-preview-grid.is-album-grid.layout-three,.media-album-grid.layout-three{grid-auto-rows:98px}
  .pending-preview-grid.is-album-grid.layout-three .pending-preview-tile:first-child,.media-album-grid.layout-three .media-album-tile:first-child{min-height:204px}
  .pending-preview-grid.is-album-grid.layout-four,.media-album-grid.layout-four,.pending-preview-grid.is-album-grid.layout-many,.media-album-grid.layout-many{grid-auto-rows:102px}
  .pending-file-actions{width:100%}
  .pending-file-actions .pending-file-addmore,.pending-file-actions .pending-file-remove{flex:1 1 0}
  .pending-file-row{align-items:flex-start;flex-direction:column}
  .pending-file-row-remove{width:100%}
}

/* Pending composer preview refresh */
.pending-compose-preview{
  padding:14px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(13,27,42,0.96), rgba(10,21,34,0.94));
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 18px 40px rgba(2,8,23,.24);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.pending-compose-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.pending-compose-head-main{
  min-width:0;
  flex:1;
}
.pending-compose-title{
  font-size:17px;
  font-weight:900;
  color:var(--text);
  line-height:1.5;
}
.pending-compose-sub{
  margin-top:4px;
  color:var(--text-muted);
  font-size:13px;
}
.pending-compose-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.pending-compose-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.06);
  color:var(--text);
  font-size:12px;
  font-weight:800;
}
.pending-compose-chip.muted{ color:var(--text-muted); }
.pending-compose-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.pending-compose-body{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.pending-compose-section{
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  border-radius:20px;
  padding:12px;
}
.pending-compose-section-label{
  margin-bottom:10px;
  font-size:12px;
  font-weight:900;
  color:var(--text-muted);
}
.pending-preview-grid.is-single-preview{grid-template-columns:1fr;}
.pending-preview-grid.is-single-preview .pending-preview-tile{
  min-height:220px;
  border-radius:18px;
}
.pending-preview-grid.is-single-preview .pending-preview-tile-media{
  min-height:220px;
}
.pending-file-list.compact{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.pending-file-list.compact .pending-file-row{
  margin:0;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px;
  padding:12px 14px;
}
.pending-file-list.compact .pending-file-row-main{
  min-width:0;
}
.pending-file-list.compact .pending-file-row-name{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.pending-file-list.compact .pending-file-row-meta{
  display:block;
  margin-top:3px;
}
.pending-file-list.compact .pending-file-row-remove{
  min-width:72px;
}
body.light-theme .pending-compose-preview{
  background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(245,248,252,0.97));
  border-color:rgba(15,23,42,.06);
  box-shadow:0 16px 36px rgba(15,23,42,.10);
}
body.light-theme .pending-compose-chip{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.06);
}
body.light-theme .pending-compose-section,
body.light-theme .pending-file-list.compact .pending-file-row{
  background:rgba(255,255,255,.86);
  border-color:rgba(15,23,42,.06);
}
@media (max-width: 640px){
  .pending-compose-preview{padding:12px;border-radius:22px;gap:12px;}
  .pending-compose-head{flex-direction:column;align-items:stretch;}
  .pending-compose-actions{justify-content:stretch;}
  .pending-compose-actions .pending-file-addmore,
  .pending-compose-actions .pending-file-remove{flex:1;justify-content:center;text-align:center;}
  .pending-preview-grid.is-single-preview .pending-preview-tile,
  .pending-preview-grid.is-single-preview .pending-preview-tile-media{min-height:180px;}
}

/* === Pending preview fullscreen + professional album layouts (override) === */
.composer-context.has-pending-preview{
  position:fixed;
  top:calc(env(safe-area-inset-top,0px) + 74px);
  left:12px;
  right:12px;
  bottom:96px;
  z-index:420;
  align-items:stretch;
  padding:12px;
  border-radius:24px;
  background:rgba(10,21,34,.96);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 24px 60px rgba(2,8,23,.42);
}
.composer-context.has-pending-preview .context-content{
  min-height:0;
  display:flex;
  flex-direction:column;
  flex:1;
}
.composer-context.has-pending-preview .context-title,
.composer-context.has-pending-preview .context-text{
  display:none;
}
.composer-context.has-pending-preview #ctxAudioPreview{display:none!important}
.composer-context.has-pending-preview .icon-btn-small{
  align-self:flex-start;
  flex-shrink:0;
  width:42px;
  height:42px;
  border-radius:14px;
}
.composer-context.has-pending-preview .ctx-file-preview{
  flex:1;
  height:100%;
  max-height:none;
  margin-top:0;
  border:0;
  background:transparent;
  overflow:auto;
}
.composer-context.has-pending-preview .ctx-file-preview::-webkit-scrollbar{width:7px}
.composer-context.has-pending-preview .ctx-file-preview::-webkit-scrollbar-thumb{background:rgba(148,163,184,.28);border-radius:999px}
.pending-compose-preview{
  min-height:100%;
  display:flex;
  flex-direction:column;
}
.pending-compose-head{
  position:sticky;
  top:0;
  z-index:2;
  background:linear-gradient(180deg, rgba(13,27,42,.98), rgba(13,27,42,.88));
  padding-bottom:12px;
}
.pending-compose-head.media-only .pending-compose-title{font-size:18px}
.pending-compose-body{
  flex:1;
  min-height:0;
  overflow:auto;
  padding-top:2px;
}
.pending-compose-body.only-media{
  display:flex;
  flex-direction:column;
}
.pending-compose-media-section.only-media{
  flex:1;
  display:flex;
  flex-direction:column;
  padding:10px;
}
.pending-preview-grid.single-media-stage,
.pending-preview-grid.is-single-preview{
  height:100%;
  min-height:min(52vh,460px);
}
.pending-preview-grid.single-media-stage .pending-preview-tile,
.pending-preview-grid.is-single-preview .pending-preview-tile{
  min-height:min(52vh,460px);
}
.pending-preview-grid.single-media-stage .pending-preview-tile-media,
.pending-preview-grid.is-single-preview .pending-preview-tile-media{
  min-height:min(52vh,460px);
}
.pending-compose-actions .pending-file-addmore,
.pending-compose-actions .pending-file-remove{
  min-width:120px;
}

.pending-preview-grid.is-album-grid,
.media-album-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  align-items:stretch;
  direction:ltr;
}
.pending-preview-grid.is-album-grid.layout-two,
.media-album-grid.layout-two{
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:minmax(168px,168px);
}
.pending-preview-grid.is-album-grid.layout-three,
.media-album-grid.layout-three{
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-areas:
    'stack main'
    'stack2 main';
  grid-auto-rows:minmax(122px,122px);
}
.pending-preview-grid.is-album-grid.layout-three .item-0,
.media-album-grid.layout-three .item-0{grid-area:stack}
.pending-preview-grid.is-album-grid.layout-three .item-1,
.media-album-grid.layout-three .item-1{grid-area:stack2}
.pending-preview-grid.is-album-grid.layout-three .item-2,
.media-album-grid.layout-three .item-2{grid-area:main}
.pending-preview-grid.is-album-grid.layout-three .pending-preview-tile.item-2,
.media-album-grid.layout-three .media-album-tile.item-2{
  min-height:252px;
}
.pending-preview-grid.is-album-grid.layout-three .pending-preview-tile.item-0,
.pending-preview-grid.is-album-grid.layout-three .pending-preview-tile.item-1,
.media-album-grid.layout-three .media-album-tile.item-0,
.media-album-grid.layout-three .media-album-tile.item-1{
  min-height:122px;
}
.pending-preview-grid.is-album-grid.layout-four,
.media-album-grid.layout-four,
.pending-preview-grid.is-album-grid.layout-many,
.media-album-grid.layout-many{
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:minmax(124px,124px);
}
.pending-preview-tile.is-media-album,
.media-album-tile{
  border-radius:18px;
  min-height:124px;
}
.pending-preview-tile-media,
.media-album-tile-media{
  min-height:124px;
}
.msg-bubble.media-album-bubble{
  max-width:min(360px,88vw);
  padding:10px;
}
.msg-bubble.media-album-bubble .media-album-grid{
  margin-bottom:8px;
}
.msg-bubble.media-album-bubble .msg-meta{
  margin-top:8px;
}
.msg-bubble.media-album-bubble .chat-media-card,
.msg-bubble.media-album-bubble .chat-pdf-card,
.msg-bubble.media-album-bubble .chat-audio-card,
.msg-bubble.media-album-bubble .chat-generic-file-card{
  display:none!important;
}
body.light-theme .composer-context.has-pending-preview{
  background:rgba(255,255,255,.97);
  border-color:rgba(15,23,42,.08);
  box-shadow:0 22px 54px rgba(15,23,42,.18);
}
body.light-theme .pending-compose-head{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.90));
}
@media (max-width: 640px){
  .composer-context.has-pending-preview{
    top:calc(env(safe-area-inset-top,0px) + 66px);
    left:8px;
    right:8px;
    bottom:84px;
    padding:10px;
    border-radius:20px;
  }
  .pending-compose-head{padding-bottom:10px}
  .pending-compose-actions{width:100%;justify-content:stretch}
  .pending-compose-actions .pending-file-addmore,
  .pending-compose-actions .pending-file-remove{flex:1 1 0}
  .pending-preview-grid.is-album-grid.layout-two,
  .media-album-grid.layout-two{grid-auto-rows:minmax(142px,142px)}
  .pending-preview-grid.is-album-grid.layout-three,
  .media-album-grid.layout-three{grid-auto-rows:minmax(104px,104px)}
  .pending-preview-grid.is-album-grid.layout-three .pending-preview-tile.item-2,
  .media-album-grid.layout-three .media-album-tile.item-2{min-height:216px}
  .pending-preview-grid.is-album-grid.layout-four,
  .media-album-grid.layout-four,
  .pending-preview-grid.is-album-grid.layout-many,
  .media-album-grid.layout-many{grid-auto-rows:minmax(106px,106px)}
  .msg-bubble.media-album-bubble{max-width:min(332px,86vw)}
}


/* === Final media preview + album stabilization fix === */
.composer-context.has-pending-preview .context-title,
.composer-context.has-pending-preview .context-text{
  display:none !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}
.composer-context.has-pending-preview{
  padding:0 !important;
  background:rgba(7,18,30,.96) !important;
}
.composer-context.has-pending-preview .context-content{
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  height:100% !important;
}
.composer-context.has-pending-preview .ctx-file-preview{
  flex:1 1 auto !important;
  margin:0 !important;
  padding:12px !important;
  border:0 !important;
  background:transparent !important;
  overflow:auto !important;
  max-height:none !important;
}
.pending-compose-preview{
  min-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  padding:14px !important;
  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.06) !important;
  background:linear-gradient(180deg, rgba(7,19,31,.98), rgba(7,19,31,.92)) !important;
  box-shadow:0 18px 44px rgba(2,8,23,.34) !important;
}
.pending-compose-head{
  position:sticky !important;
  top:0 !important;
  z-index:4 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:0 0 12px !important;
  background:linear-gradient(180deg, rgba(7,19,31,.98), rgba(7,19,31,.92)) !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}
.pending-compose-body{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:auto !important;
  padding:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
}
.pending-compose-body.only-media,
.pending-compose-media-section.only-media,
.pending-compose-media-section{
  padding:0 !important;
}
.pending-preview-grid{
  width:100% !important;
}
.pending-preview-grid.is-single-preview,
.pending-preview-grid.single-media-stage{
  grid-template-columns:1fr !important;
  min-height:auto !important;
  height:auto !important;
}
.pending-preview-grid.is-single-preview .pending-preview-tile,
.pending-preview-grid.single-media-stage .pending-preview-tile{
  min-height:min(48vh,420px) !important;
  height:min(48vh,420px) !important;
  border-radius:22px !important;
}
.pending-preview-grid.is-single-preview .pending-preview-tile-media,
.pending-preview-grid.single-media-stage .pending-preview-tile-media{
  min-height:min(48vh,420px) !important;
  height:min(48vh,420px) !important;
  object-fit:contain !important;
  background:#020617 !important;
}
.pending-preview-grid.is-album-grid,
.media-album-grid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  gap:6px !important;
  align-items:stretch !important;
  direction:ltr !important;
}
.pending-preview-grid.is-album-grid.layout-two{
  grid-auto-rows:clamp(150px,24vh,220px) !important;
}
.media-album-grid.layout-two{
  grid-auto-rows:clamp(134px,22vh,176px) !important;
}
.pending-preview-grid.is-album-grid.layout-three,
.media-album-grid.layout-three{
  grid-template-columns:0.95fr 1.05fr !important;
  grid-template-areas:
    "a c"
    "b c" !important;
}
.pending-preview-grid.is-album-grid.layout-three{
  grid-template-rows:repeat(2, clamp(132px,18vh,190px)) !important;
}
.media-album-grid.layout-three{
  grid-template-rows:repeat(2, clamp(104px,14vh,140px)) !important;
}
.pending-preview-grid.is-album-grid.layout-three .item-0,
.media-album-grid.layout-three .item-0{grid-area:a !important;}
.pending-preview-grid.is-album-grid.layout-three .item-1,
.media-album-grid.layout-three .item-1{grid-area:b !important;}
.pending-preview-grid.is-album-grid.layout-three .item-2,
.media-album-grid.layout-three .item-2{grid-area:c !important;}
.pending-preview-grid.is-album-grid.layout-three .pending-preview-tile.item-2{
  min-height:100% !important;
  height:100% !important;
}
.media-album-grid.layout-three .media-album-tile.item-2{
  min-height:100% !important;
  height:100% !important;
}
.pending-preview-grid.is-album-grid.layout-four,
.pending-preview-grid.is-album-grid.layout-many{
  grid-auto-rows:clamp(126px,17vh,176px) !important;
}
.media-album-grid.layout-four,
.media-album-grid.layout-many{
  grid-auto-rows:clamp(102px,14vh,132px) !important;
}
.pending-preview-tile,
.media-album-tile{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:18px !important;
  background:#08131f !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05) !important;
}
.pending-preview-tile-media,
.media-album-tile-media{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  display:block !important;
  object-fit:cover !important;
  background:#000 !important;
}
.pending-preview-remove{
  z-index:3 !important;
}
.msg-bubble.media-album-bubble{
  max-width:min(340px,88vw) !important;
  padding:8px !important;
}
.msg-bubble.media-album-bubble .media-album-grid{
  margin:0 0 8px 0 !important;
}
.msg-bubble.media-album-bubble .msg-meta{
  margin-top:6px !important;
}
@media (max-width: 640px){
  .composer-context.has-pending-preview .ctx-file-preview{
    padding:10px !important;
  }
  .pending-compose-preview{
    padding:12px !important;
    border-radius:22px !important;
  }
  .pending-preview-grid.is-album-grid.layout-two{
    grid-auto-rows:clamp(136px,23vh,180px) !important;
  }
  .media-album-grid.layout-two{
    grid-auto-rows:clamp(126px,21vh,154px) !important;
  }
  .pending-preview-grid.is-album-grid.layout-three{
    grid-template-rows:repeat(2, clamp(118px,17vh,152px)) !important;
  }
  .media-album-grid.layout-three{
    grid-template-rows:repeat(2, clamp(96px,13vh,122px)) !important;
  }
  .pending-preview-grid.is-album-grid.layout-four,
  .pending-preview-grid.is-album-grid.layout-many{
    grid-auto-rows:clamp(112px,15vh,146px) !important;
  }
  .media-album-grid.layout-four,
  .media-album-grid.layout-many{
    grid-auto-rows:clamp(94px,12.5vh,112px) !important;
  }
}

/* Final media preview + gallery fixes */
.composer-context.has-pending-preview #ctxCancel{
  position:fixed !important;
  top:96px !important;
  left:14px !important;
  z-index:10005 !important;
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  background:rgba(15,23,42,.88) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.28) !important;
}
.composer-context.has-pending-preview .ctx-file-preview{
  position:fixed !important;
  inset:86px 8px 86px 8px !important;
  z-index:10003 !important;
  max-height:none !important;
  margin:0 !important;
  padding:14px !important;
  border-radius:28px !important;
  overflow:auto !important;
  background:rgba(4,12,20,.96) !important;
  border:1px solid rgba(255,255,255,.06) !important;
  box-shadow:0 28px 70px rgba(0,0,0,.38) !important;
  backdrop-filter:blur(18px) !important;
}
.composer-context.has-pending-preview .ctx-file-preview::-webkit-scrollbar{width:8px}
.composer-context.has-pending-preview .ctx-file-preview::-webkit-scrollbar-thumb{background:rgba(148,163,184,.32);border-radius:999px}
.pending-compose-preview{
  min-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.pending-compose-head{
  position:sticky !important;
  top:0 !important;
  z-index:2 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:0 0 10px 0 !important;
  background:linear-gradient(180deg, rgba(4,12,20,.98) 0%, rgba(4,12,20,.82) 70%, rgba(4,12,20,0) 100%) !important;
}
.pending-compose-head-main{display:flex !important; flex-direction:column !important; gap:6px !important; min-width:0 !important;}
.pending-compose-title{font-size:28px !important; font-weight:900 !important; color:var(--text) !important;}
.pending-compose-sub{font-size:15px !important; color:var(--text-muted) !important;}
.pending-compose-chips{display:flex !important; gap:8px !important; flex-wrap:wrap !important;}
.pending-compose-chip{padding:8px 14px !important; border-radius:999px !important; background:rgba(255,255,255,.05) !important; border:1px solid rgba(255,255,255,.06) !important;}
.pending-compose-actions{display:flex !important; gap:10px !important; flex-shrink:0 !important;}
.pending-compose-actions .pending-file-addmore,
.pending-compose-actions .pending-file-remove{min-width:132px !important; justify-content:center !important;}
.pending-compose-body,
.pending-compose-body.only-media{display:flex !important; flex-direction:column !important; gap:14px !important;}
.pending-compose-section{
  padding:14px !important;
  border-radius:22px !important;
  background:rgba(7,19,31,.92) !important;
  border:1px solid rgba(255,255,255,.06) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02) !important;
}
.pending-compose-section-label{margin-bottom:10px !important;}
.pending-preview-grid{
  width:100% !important;
  gap:10px !important;
}
.pending-preview-grid.is-single-preview,
.pending-preview-grid.single-media-stage{grid-template-columns:1fr !important;}
.pending-preview-grid.is-single-preview .pending-preview-tile,
.pending-preview-grid.single-media-stage .pending-preview-tile{
  min-height:min(56vh,460px) !important;
  border-radius:22px !important;
}
.pending-preview-grid.is-single-preview .pending-preview-tile-media,
.pending-preview-grid.single-media-stage .pending-preview-tile-media{object-fit:contain !important; background:#030712 !important;}
.pending-preview-grid.is-album-grid,
.media-album-grid{display:grid !important; gap:8px !important; align-items:stretch !important;}
.pending-preview-grid.is-album-grid.layout-two{grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-auto-rows:minmax(210px,30vh) !important;}
.media-album-grid.layout-two{grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-auto-rows:minmax(160px,22vh) !important;}
.pending-preview-grid.is-album-grid.layout-three{
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) !important;
  grid-template-areas:"a c" "b c" !important;
  grid-template-rows:repeat(2, minmax(168px, 1fr)) !important;
}
.media-album-grid.layout-three{
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) !important;
  grid-template-areas:"a c" "b c" !important;
  grid-template-rows:repeat(2, minmax(118px, 1fr)) !important;
}
.pending-preview-grid.is-album-grid.layout-three .item-0,
.media-album-grid.layout-three .item-0{grid-area:a !important}
.pending-preview-grid.is-album-grid.layout-three .item-1,
.media-album-grid.layout-three .item-1{grid-area:b !important}
.pending-preview-grid.is-album-grid.layout-three .item-2,
.media-album-grid.layout-three .item-2{grid-area:c !important; min-height:100% !important; height:100% !important}
.pending-preview-grid.is-album-grid.layout-four,
.pending-preview-grid.is-album-grid.layout-many{grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-auto-rows:minmax(160px,22vh) !important;}
.media-album-grid.layout-four,
.media-album-grid.layout-many{grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-auto-rows:minmax(112px,15vh) !important;}
.pending-preview-tile,
.media-album-tile{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  border-radius:20px !important;
  overflow:hidden !important;
  background:#040b14 !important;
}
.pending-preview-tile-media,
.media-album-tile-media{width:100% !important; height:100% !important; display:block !important; object-fit:cover !important; background:#000 !important;}
.pending-preview-remove{z-index:4 !important; width:34px !important; height:34px !important; background:rgba(15,23,42,.84) !important; color:#fff !important; border:0 !important;}
.msg-bubble.media-album-bubble{max-width:min(372px,90vw) !important; padding:10px 10px 12px !important;}
.msg-bubble.media-album-bubble .media-album-grid{margin:0 0 8px 0 !important;}
.msg-bubble.media-album-bubble .msg-meta{margin-top:8px !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:8px !important; flex-wrap:wrap !important;}

.file-preview-shell{width:min(98vw,1180px) !important; max-height:96vh !important;}
.file-preview-body{align-items:stretch !important; justify-content:stretch !important;}
.file-preview-gallery-shell{width:100%; display:flex; flex-direction:column; gap:14px;}
.file-preview-gallery-stage-wrap{
  position:relative;
  min-height:min(74vh,760px);
  border-radius:24px;
  overflow:hidden;
  background:rgba(5,10,18,.92);
  border:1px solid rgba(255,255,255,.06);
}
.file-preview-gallery-stage{width:100%; height:min(74vh,760px); display:flex; align-items:center; justify-content:center; padding:18px;}
.file-preview-gallery-media{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; border-radius:18px; background:#000;}
.file-preview-gallery-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(15,23,42,.72);
  color:#fff;
  font-size:28px;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
}
.file-preview-gallery-nav.prev{left:14px}
.file-preview-gallery-nav.next{right:14px}
.file-preview-gallery-count{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:2;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(15,23,42,.78);
  color:#fff;
  font-size:13px;
  font-weight:800;
}
.file-preview-gallery-strip{display:flex; gap:10px; overflow:auto; padding-bottom:4px;}
.file-preview-gallery-thumb{
  position:relative;
  width:78px;
  height:78px;
  flex:0 0 78px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(7,19,31,.88);
  padding:0;
}
.file-preview-gallery-thumb.active{outline:2px solid rgba(0,122,255,.9); outline-offset:2px;}
.file-preview-gallery-thumb img,
.file-preview-gallery-thumb video{width:100%; height:100%; object-fit:cover; display:block; background:#000;}
.file-preview-gallery-thumb-badge{position:absolute; right:6px; bottom:6px; width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(15,23,42,.84); color:#fff; font-size:10px; font-weight:900;}
body.light-theme .composer-context.has-pending-preview .ctx-file-preview{background:rgba(255,255,255,.97) !important; border-color:rgba(15,23,42,.08) !important;}
body.light-theme .composer-context.has-pending-preview #ctxCancel{background:#fff !important; border-color:rgba(15,23,42,.08) !important;}
body.light-theme .pending-compose-section{background:#f8fafc !important; border-color:rgba(15,23,42,.08) !important;}
body.light-theme .pending-compose-head{background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.86) 70%, rgba(255,255,255,0) 100%) !important;}
body.light-theme .file-preview-gallery-stage-wrap{background:#f8fafc; border-color:rgba(15,23,42,.08);}
body.light-theme .file-preview-gallery-nav{background:rgba(255,255,255,.92); color:#0f172a; border-color:rgba(15,23,42,.08);}
body.light-theme .file-preview-gallery-count{background:rgba(255,255,255,.94); color:#0f172a;}
body.light-theme .file-preview-gallery-thumb{background:#fff; border-color:rgba(15,23,42,.08);}
@media (max-width:640px){
  .composer-context.has-pending-preview #ctxCancel{top:92px !important; left:12px !important;}
  .composer-context.has-pending-preview .ctx-file-preview{inset:82px 6px 82px 6px !important; padding:12px !important; border-radius:24px !important;}
  .pending-compose-title{font-size:20px !important;}
  .pending-compose-head{flex-direction:column !important; align-items:stretch !important;}
  .pending-compose-actions{width:100% !important;}
  .pending-compose-actions .pending-file-addmore,
  .pending-compose-actions .pending-file-remove{flex:1 1 0 !important; min-width:0 !important;}
  .pending-preview-grid.is-single-preview .pending-preview-tile,
  .pending-preview-grid.single-media-stage .pending-preview-tile{min-height:46vh !important;}
  .pending-preview-grid.is-album-grid.layout-two{grid-auto-rows:minmax(156px,24vh) !important;}
  .media-album-grid.layout-two{grid-auto-rows:minmax(132px,21vh) !important;}
  .pending-preview-grid.is-album-grid.layout-three{grid-template-rows:repeat(2,minmax(122px,1fr)) !important;}
  .media-album-grid.layout-three{grid-template-rows:repeat(2,minmax(108px,1fr)) !important;}
  .pending-preview-grid.is-album-grid.layout-four,
  .pending-preview-grid.is-album-grid.layout-many{grid-auto-rows:minmax(126px,18vh) !important;}
  .media-album-grid.layout-four,
  .media-album-grid.layout-many{grid-auto-rows:minmax(102px,14vh) !important;}
  .file-preview-gallery-stage-wrap{min-height:60vh;}
  .file-preview-gallery-stage{height:60vh; padding:12px;}
  .file-preview-gallery-nav{width:40px; height:40px; font-size:24px;}
  .file-preview-gallery-thumb{width:66px; height:66px; flex-basis:66px;}
}

/* Final cleanup for pending media preview and album click/viewer */
.composer-context.has-pending-preview{
  align-items:flex-start !important;
  padding:10px 12px !important;
}
.composer-context.has-pending-preview .context-content{
  width:100% !important;
}
.composer-context.has-pending-preview .ctx-file-preview{
  position:static !important;
  inset:auto !important;
  display:block !important;
  width:100% !important;
  max-height:min(44vh,380px) !important;
  overflow:auto !important;
  margin-top:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.composer-context.has-pending-preview #ctxCancel{
  position:static !important;
  margin-inline-start:10px !important;
  align-self:flex-start !important;
}
.pending-compose-preview.is-clean-preview{
  padding:14px !important;
  border-radius:20px !important;
  background:rgba(7,19,31,.92) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 12px 32px rgba(0,0,0,.22) !important;
}
.pending-clean-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-bottom:12px !important;
}
.pending-clean-meta{min-width:0 !important;}
.pending-clean-title{
  font-size:18px !important;
  font-weight:900 !important;
  color:var(--text) !important;
}
.pending-clean-sub{
  margin-top:4px !important;
  font-size:13px !important;
  color:var(--text-muted) !important;
}
.pending-clean-actions{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
}
.pending-preview-board,
.pending-preview-files-wrap{
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.06) !important;
  background:rgba(255,255,255,.03) !important;
  padding:10px !important;
}
.pending-preview-files-wrap{margin-top:10px !important;}
.pending-preview-grid{
  display:grid !important;
  gap:8px !important;
}
.pending-preview-grid.is-single-preview,
.pending-preview-grid.single-media-stage{
  grid-template-columns:1fr !important;
}
.pending-preview-grid.is-single-preview .pending-preview-tile,
.pending-preview-grid.single-media-stage .pending-preview-tile{
  min-height:min(34vh,260px) !important;
}
.pending-preview-grid.is-album-grid.layout-two{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-auto-rows:150px !important;
}
.pending-preview-grid.is-album-grid.layout-three{
  grid-template-columns:1fr 1fr !important;
  grid-template-areas:'stack main' 'stack2 main' !important;
  grid-template-rows:repeat(2,150px) !important;
}
.pending-preview-grid.is-album-grid.layout-four,
.pending-preview-grid.is-album-grid.layout-many{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-auto-rows:150px !important;
}
.pending-preview-grid.is-album-grid.layout-three .item-0{grid-area:stack !important;}
.pending-preview-grid.is-album-grid.layout-three .item-1{grid-area:stack2 !important;}
.pending-preview-grid.is-album-grid.layout-three .item-2{grid-area:main !important;}
.pending-preview-grid.is-album-grid.layout-three .item-2{min-height:100% !important;}
.pending-preview-tile{
  position:relative !important;
  overflow:hidden !important;
  border-radius:16px !important;
  min-height:150px !important;
  background:#030712 !important;
  border:1px solid rgba(255,255,255,.05) !important;
  cursor:pointer !important;
}
.pending-preview-tile-media{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  background:#000 !important;
}
.pending-preview-name{
  position:absolute !important;
  right:8px !important;
  left:8px !important;
  bottom:8px !important;
  padding:6px 8px !important;
  border-radius:10px !important;
  background:rgba(0,0,0,.56) !important;
  color:#fff !important;
  font-size:12px !important;
}
.pending-preview-remove{
  position:absolute !important;
  top:8px !important;
  left:8px !important;
  width:30px !important;
  height:30px !important;
  border-radius:50% !important;
  border:0 !important;
  background:rgba(0,0,0,.62) !important;
  color:#fff !important;
  z-index:4 !important;
}
body.light-theme .pending-compose-preview.is-clean-preview{background:#fff !important;border-color:rgba(15,23,42,.08) !important;}
body.light-theme .pending-preview-board,
body.light-theme .pending-preview-files-wrap{background:#f8fafc !important;border-color:rgba(15,23,42,.08) !important;}
@media (max-width:640px){
  .composer-context.has-pending-preview .ctx-file-preview{max-height:40vh !important;}
  .pending-clean-head{flex-direction:column !important; align-items:stretch !important;}
  .pending-clean-actions > *{flex:1 1 0 !important;}
  .pending-preview-grid.is-album-grid.layout-two,
  .pending-preview-grid.is-album-grid.layout-four,
  .pending-preview-grid.is-album-grid.layout-many{grid-auto-rows:118px !important;}
  .pending-preview-grid.is-album-grid.layout-three{grid-template-rows:repeat(2,118px) !important;}
}

/* Final stable media preview and album fixes */
.composer-context.has-pending-preview{
  align-items:flex-start !important;
  gap:10px !important;
}
.composer-context.has-pending-preview .context-content{
  width:100% !important;
  min-width:0 !important;
}
.composer-context.has-pending-preview .ctx-file-preview{
  position:static !important;
  inset:auto !important;
  display:block !important;
  width:100% !important;
  max-height:min(36vh,300px) !important;
  overflow:auto !important;
  margin-top:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.composer-context.has-pending-preview #ctxCancel{
  position:static !important;
  inset:auto !important;
  margin:0 !important;
  align-self:flex-start !important;
}
.pending-compose-preview.is-stable-clean{
  padding:12px !important;
  border-radius:18px !important;
  background:rgba(7,19,31,.88) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.16) !important;
}
.pending-clean-head.compact{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  margin-bottom:10px !important;
}
.pending-clean-head.compact .pending-clean-title{font-size:15px !important;line-height:1.3 !important;}
.pending-clean-head.compact .pending-clean-sub{font-size:12px !important; margin-top:2px !important;}
.pending-clean-head.compact .pending-clean-actions{display:flex !important; gap:8px !important; flex-wrap:wrap !important;}
.pending-preview-media-section,
.pending-preview-files-section{
  border-radius:16px !important;
  border:1px solid rgba(255,255,255,.06) !important;
  background:rgba(255,255,255,.03) !important;
  padding:10px !important;
}
.pending-preview-files-section{margin-top:10px !important;}
.pending-preview-grid.is-single-preview,
.pending-preview-grid.single-media-stage{grid-template-columns:1fr !important;}
.pending-preview-grid.is-single-preview .pending-preview-tile,
.pending-preview-grid.single-media-stage .pending-preview-tile{min-height:min(26vh,220px) !important;}
.pending-preview-grid.is-single-preview .pending-preview-tile-media,
.pending-preview-grid.single-media-stage .pending-preview-tile-media{object-fit:contain !important; background:#030712 !important;}
.pending-preview-grid.is-album-grid{display:grid !important;gap:8px !important;align-items:stretch !important;}
.pending-preview-grid.is-album-grid.layout-two{grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-auto-rows:132px !important;}
.pending-preview-grid.is-album-grid.layout-three{
  grid-template-columns:1fr 1fr !important;
  grid-template-rows:repeat(2,132px) !important;
  grid-template-areas:'a c' 'b c' !important;
}
.pending-preview-grid.is-album-grid.layout-three .item-0{grid-area:a !important;}
.pending-preview-grid.is-album-grid.layout-three .item-1{grid-area:b !important;}
.pending-preview-grid.is-album-grid.layout-three .item-2{grid-area:c !important; min-height:100% !important; height:100% !important;}
.pending-preview-grid.is-album-grid.layout-four,
.pending-preview-grid.is-album-grid.layout-many{grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-auto-rows:122px !important;}
.pending-preview-tile{position:relative !important; overflow:hidden !important; border-radius:16px !important; min-height:122px !important; background:#030712 !important; border:1px solid rgba(255,255,255,.05) !important;}
.pending-preview-tile-media{display:block !important; width:100% !important; height:100% !important; min-height:122px !important; object-fit:cover !important; background:#000 !important;}
.pending-preview-remove{z-index:4 !important;}
.media-album-grid{display:grid !important;gap:8px !important;align-items:stretch !important;}
.media-album-grid.layout-two{grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-auto-rows:minmax(148px,22vh) !important;}
.media-album-grid.layout-three{
  grid-template-columns:1fr 1fr !important;
  grid-template-rows:repeat(2,minmax(104px,16vh)) !important;
  grid-template-areas:'a c' 'b c' !important;
}
.media-album-grid.layout-three .item-0{grid-area:a !important;}
.media-album-grid.layout-three .item-1{grid-area:b !important;}
.media-album-grid.layout-three .item-2{grid-area:c !important; min-height:100% !important; height:100% !important;}
.media-album-grid.layout-four,
.media-album-grid.layout-many{grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-auto-rows:minmax(112px,16vh) !important;}
.media-album-tile{position:relative !important; display:block !important; padding:0 !important; border:0 !important; border-radius:18px !important; overflow:hidden !important; background:#07131f !important; cursor:pointer !important; min-height:112px !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.05) !important;}
.media-album-tile-media{display:block !important; width:100% !important; height:100% !important; min-height:112px !important; object-fit:cover !important; background:#000 !important;}
.msg-bubble.media-album-bubble .media-album-grid{margin:0 0 8px 0 !important;}
body.light-theme .pending-compose-preview.is-stable-clean{background:#fff !important; border-color:rgba(15,23,42,.08) !important;}
body.light-theme .pending-preview-media-section,
body.light-theme .pending-preview-files-section{background:#f8fafc !important; border-color:rgba(15,23,42,.08) !important;}
@media (max-width:640px){
  .composer-context.has-pending-preview .ctx-file-preview{max-height:34vh !important;}
  .pending-clean-head.compact{align-items:flex-start !important; flex-direction:column !important;}
  .pending-clean-head.compact .pending-clean-actions{width:100% !important;}
  .pending-clean-head.compact .pending-clean-actions > *{flex:1 1 0 !important;}
  .pending-preview-grid.is-album-grid.layout-two{grid-auto-rows:116px !important;}
  .pending-preview-grid.is-album-grid.layout-three{grid-template-rows:repeat(2,116px) !important;}
  .pending-preview-grid.is-album-grid.layout-four,
  .pending-preview-grid.is-album-grid.layout-many{grid-auto-rows:108px !important;}
  .media-album-grid.layout-two{grid-auto-rows:minmax(132px,20vh) !important;}
  .media-album-grid.layout-three{grid-template-rows:repeat(2,minmax(96px,14vh)) !important;}
  .media-album-grid.layout-four,
  .media-album-grid.layout-many{grid-auto-rows:minmax(98px,14vh) !important;}
}

/* Full-screen pending send preview */
.composer-context.has-pending-preview{
  position:fixed !important;
  top:76px !important;
  right:12px !important;
  left:12px !important;
  bottom:92px !important;
  margin:0 !important;
  padding:14px !important;
  border-radius:28px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  gap:12px !important;
  background:rgba(2, 10, 20, 0.96) !important;
  border:1px solid rgba(255,255,255,0.08) !important;
  box-shadow:0 22px 56px rgba(0,0,0,0.42) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
  overflow:hidden !important;
}
.composer-context.has-pending-preview .context-content{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
}
.composer-context.has-pending-preview .ctx-file-preview{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-height:none !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overscroll-behavior:contain !important;
}
.composer-context.has-pending-preview #ctxCancel{
  position:absolute !important;
  top:16px !important;
  left:16px !important;
  width:56px !important;
  height:56px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:50% !important;
  background:rgba(8, 20, 36, 0.92) !important;
  border:1px solid rgba(255,255,255,0.08) !important;
  box-shadow:0 10px 24px rgba(0,0,0,0.28) !important;
  z-index:8 !important;
}
.composer-context.has-pending-preview #ctxCancel img{
  width:24px !important;
  height:24px !important;
}
.composer-context.has-pending-preview .context-title,
.composer-context.has-pending-preview .context-text,
.composer-context.has-pending-preview #ctxUploadMeta,
.composer-context.has-pending-preview #ctxUploadProgress{
  display:block;
  position:relative;
  z-index:6;
  padding-left:72px;
}
.composer-context.has-pending-preview .context-title{
  font-size:15px;
  font-weight:900;
  color:var(--text);
  line-height:1.5;
  margin-bottom:4px;
}
.composer-context.has-pending-preview .context-text{
  font-size:12px;
  color:var(--text-muted);
  line-height:1.8;
  margin-bottom:8px;
}
.composer-context.has-pending-preview #ctxUploadMeta{
  font-size:12px;
  font-weight:800;
  color:var(--text-muted);
  margin-bottom:8px;
}
.composer-context.has-pending-preview #ctxUploadProgress{
  margin:0 0 12px 0;
}
.composer-context.has-pending-preview #ctxAudioPreview{
  display:none !important;
}
.pending-compose-preview.is-stable-clean{
  min-height:100% !important;
  padding:18px !important;
  border-radius:24px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
}
.pending-clean-head.compact{
  position:sticky !important;
  top:0 !important;
  z-index:5 !important;
  padding:0 0 10px 64px !important;
  margin:0 !important;
  background:inherit !important;
}
.pending-clean-head.compact .pending-clean-actions{
  justify-content:flex-start !important;
}
.pending-preview-media-section,
.pending-preview-files-section{
  flex:0 0 auto !important;
}
.pending-preview-grid.is-single-preview .pending-preview-tile,
.pending-preview-grid.single-media-stage .pending-preview-tile{
  min-height:min(52vh, 520px) !important;
}
.pending-preview-grid.is-album-grid.layout-two{
  grid-auto-rows:minmax(220px, 30vh) !important;
}
.pending-preview-grid.is-album-grid.layout-three{
  grid-template-rows:repeat(2, minmax(180px, 24vh)) !important;
}
.pending-preview-grid.is-album-grid.layout-four,
.pending-preview-grid.is-album-grid.layout-many{
  grid-auto-rows:minmax(160px, 22vh) !important;
}
.pending-file-list.compact{
  max-height:none !important;
}
body.light-theme .composer-context.has-pending-preview{
  background:rgba(247, 250, 252, 0.98) !important;
  border-color:rgba(15,23,42,0.08) !important;
}
body.light-theme .composer-context.has-pending-preview #ctxCancel{
  background:#ffffff !important;
  border-color:rgba(15,23,42,0.08) !important;
}
@media (max-width:640px){
  .composer-context.has-pending-preview{
    top:72px !important;
    right:6px !important;
    left:6px !important;
    bottom:86px !important;
    padding:10px !important;
    border-radius:24px !important;
  }
  .composer-context.has-pending-preview #ctxCancel{
    top:12px !important;
    left:12px !important;
    width:48px !important;
    height:48px !important;
  }
  .pending-compose-preview.is-stable-clean{
    padding:14px !important;
    border-radius:20px !important;
    gap:12px !important;
  }
  .pending-clean-head.compact{
    padding-left:56px !important;
    gap:8px !important;
  }
  .pending-clean-head.compact .pending-clean-actions{
    width:100% !important;
  }
  .pending-clean-head.compact .pending-clean-actions > *{
    flex:1 1 0 !important;
  }
  .pending-preview-grid.is-single-preview .pending-preview-tile,
  .pending-preview-grid.single-media-stage .pending-preview-tile{
    min-height:min(42vh, 360px) !important;
  }
  .pending-preview-grid.is-album-grid.layout-two{
    grid-auto-rows:minmax(156px, 22vh) !important;
  }
  .pending-preview-grid.is-album-grid.layout-three{
    grid-template-rows:repeat(2, minmax(136px, 18vh)) !important;
  }
  .pending-preview-grid.is-album-grid.layout-four,
  .pending-preview-grid.is-album-grid.layout-many{
    grid-auto-rows:minmax(126px, 16vh) !important;
  }
}


/* Upload status restored inside full-screen pending preview */
.composer-context.has-pending-preview .upload-progress{
  height:9px;
  border-radius:999px;
  background:rgba(148,163,184,.18);
  overflow:hidden;
}
.composer-context.has-pending-preview .upload-progress-bar{
  background:linear-gradient(90deg, rgba(37,99,235,.96), rgba(56,189,248,.96));
}
body.light-theme .composer-context.has-pending-preview .upload-progress{
  background:rgba(15,23,42,.08);
}
@media (max-width:640px){
  .composer-context.has-pending-preview .context-title,
  .composer-context.has-pending-preview .context-text,
  .composer-context.has-pending-preview #ctxUploadMeta,
  .composer-context.has-pending-preview #ctxUploadProgress{
    padding-left:58px;
  }
}



.rss-news-extra{
  margin-top:12px;
  width:100%;
}
.rss-inline-image-link{
  display:block;
  width:100%;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(15,23,42,0.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.10), 0 10px 24px rgba(2,6,23,0.14);
  text-decoration:none;
  -webkit-tap-highlight-color:transparent;
}
.rss-inline-image{
  display:block;
  width:100%;
  max-height:230px;
  min-height:120px;
  object-fit:cover;
  background:rgba(15,23,42,0.24);
}
.bot-action-buttons{
  display:flex;
  flex-wrap:wrap;
  direction:rtl;
  justify-content:flex-start;
  align-items:center;
  gap:8px;
  margin-top:10px;
  width:100%;
}
.bot-action-btn{
  position:relative;
  appearance:none;
  isolation:isolate;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.16);
  background:linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.07));
  backdrop-filter:blur(14px) saturate(130%);
  -webkit-backdrop-filter:blur(14px) saturate(130%);
  color:var(--text);
  border-radius:999px;
  padding:7px 13px;
  min-height:34px;
  width:auto;
  max-width:100%;
  font:inherit;
  font-size:.9rem;
  font-weight:850;
  letter-spacing:-0.01em;
  line-height:1.25;
  cursor:pointer;
  transition:transform .14s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
  box-shadow:0 8px 18px rgba(15,23,42,.12), inset 0 1px 0 rgba(255,255,255,.14);
}
.bot-action-btn::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,0) 52%);
  pointer-events:none;
}
.bot-action-btn::after{
  content:'';
  position:absolute;
  width:34px;
  height:34px;
  border-radius:50%;
  top:-16px;
  right:-10px;
  background:rgba(255,255,255,.08);
  filter:blur(3px);
  pointer-events:none;
}
.bot-action-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,0.26);
  box-shadow:0 12px 26px rgba(15,23,42,.15), inset 0 1px 0 rgba(255,255,255,.20);
}
.bot-action-btn:active{
  transform:translateY(1px) scale(.985);
}
.bot-action-btn-text{ position:relative; z-index:1; display:block; white-space:nowrap; }
.bot-action-btn.is-send{ background:linear-gradient(180deg, rgba(59,130,246,.22), rgba(37,99,235,.10)); }
.bot-action-btn.is-prefill{ background:linear-gradient(180deg, rgba(168,85,247,.18), rgba(126,34,206,.08)); }
.bot-action-btn.is-copy{ background:linear-gradient(180deg, rgba(16,185,129,.18), rgba(5,150,105,.08)); }
.bot-action-btn.is-open{ background:linear-gradient(180deg, rgba(14,165,233,.22), rgba(6,182,212,.10)); }
:root[data-theme='dark'] .bot-action-btn,
body.dark .bot-action-btn{
  color:#eef6ff;
  border-color:rgba(255,255,255,0.14);
  box-shadow:0 10px 22px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.10);
}
:root[data-theme='dark'] .bot-action-btn:hover,
body.dark .bot-action-btn:hover{
  border-color:rgba(255,255,255,0.22);
  box-shadow:0 14px 30px rgba(2,6,23,.42), inset 0 1px 0 rgba(255,255,255,.14);
}
body.light-theme .rss-inline-image-link{
  background:rgba(255,255,255,.72);
  border-color:rgba(148,163,184,.24);
  box-shadow:0 10px 24px rgba(148,163,184,.16), inset 0 1px 0 rgba(255,255,255,.82);
}
body.light-theme .bot-action-btn{
  border-color:rgba(148,163,184,.22);
  background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(241,245,249,.68));
  box-shadow:0 8px 18px rgba(148,163,184,.15), inset 0 1px 0 rgba(255,255,255,.92);
}
body.light-theme .bot-action-btn.is-send{ background:linear-gradient(180deg, rgba(219,234,254,.94), rgba(191,219,254,.68)); }
body.light-theme .bot-action-btn.is-prefill{ background:linear-gradient(180deg, rgba(243,232,255,.94), rgba(233,213,255,.68)); }
body.light-theme .bot-action-btn.is-copy{ background:linear-gradient(180deg, rgba(209,250,229,.94), rgba(167,243,208,.68)); }
body.light-theme .bot-action-btn.is-open{ background:linear-gradient(180deg, rgba(224,242,254,.94), rgba(165,243,252,.68)); }
@media (max-width: 420px){
  .rss-inline-image{ max-height:190px; min-height:105px; }
  .bot-action-btn{ min-height:32px; padding:6px 12px; font-size:.86rem; }
}

.app-prompt-input{width:100%;min-height:48px;border-radius:18px;border:1px solid rgba(255,255,255,0.10);background:rgba(255,255,255,0.05);color:var(--text);font:inherit;padding:12px 14px;outline:none;margin-top:14px;direction:rtl;}
.app-prompt-input:focus{border-color:rgba(56,189,248,0.36);box-shadow:0 0 0 3px rgba(56,189,248,0.10);}
body.light-theme .app-prompt-input{background:rgba(15,23,42,0.04);border-color:rgba(15,23,42,0.10);color:var(--text);}


/* Device sessions compact polish */
.session-toolbar{
  gap:8px;
  margin-top:10px;
}
.session-toolbar .btn-secondary,
.session-toolbar .btn-danger{
  min-height:46px;
  border-radius:16px;
  font-size:14px;
  padding:0 12px;
}
.device-session-list{gap:10px}
.device-session-group{gap:12px}
.device-session-group-title{margin-bottom:2px}
.device-session-group-title span:first-child{
  font-size:15px;
  font-weight:900;
}
.device-session-count-pill{
  min-width:26px;
  height:26px;
  padding:0 8px;
  font-size:11px;
}
.device-session-card{
  gap:12px;
  padding:14px;
  border-radius:20px;
}
.device-session-hero{
  gap:10px;
}
.device-session-visual{
  width:72px;
  height:72px;
}
.device-session-visual.current{
  animation: deviceSessionNeonPulse 1.7s ease-in-out infinite;
}
.device-session-headline{
  display:grid;
  gap:4px;
}
.device-session-kicker{
  font-size:11px;
  font-weight:800;
  color:var(--text-muted);
}
.device-session-title{
  font-size:14px;
  font-weight:900;
}
.device-session-subtitle{
  font-size:12px;
  line-height:1.6;
  color:var(--text-muted);
}
.device-session-status-pill{
  min-height:36px;
  padding:0 14px;
  font-size:12px;
  border-radius:999px;
}
.device-session-actions .btn-danger{
  min-height:40px;
  border-radius:14px;
  padding:0 14px;
  font-size:13px;
}
.device-session-lines{
  gap:8px;
}
.device-session-line{
  border-radius:15px;
  padding:10px 12px;
}
.device-session-line-label{
  font-size:11px;
  margin-bottom:4px;
}
.device-session-line-value{
  font-size:15px;
  line-height:1.5;
}
.device-session-subtle .device-session-line-value{
  font-size:14px;
}
@keyframes deviceSessionNeonPulse{
  0%, 100%{
    box-shadow:
      0 0 0 1px rgba(34,197,94,.20),
      0 0 0 10px rgba(34,197,94,.08),
      0 0 18px rgba(34,197,94,.25),
      0 18px 36px rgba(34,197,94,.12);
  }
  50%{
    box-shadow:
      0 0 0 1px rgba(74,222,128,.42),
      0 0 0 15px rgba(34,197,94,.12),
      0 0 30px rgba(74,222,128,.45),
      0 20px 42px rgba(34,197,94,.18);
  }
}
body.light-theme .device-session-visual.current{
  animation: deviceSessionNeonPulseLight 1.7s ease-in-out infinite;
}
@keyframes deviceSessionNeonPulseLight{
  0%, 100%{
    box-shadow:
      0 0 0 1px rgba(34,197,94,.18),
      0 0 0 8px rgba(34,197,94,.06),
      0 0 16px rgba(34,197,94,.16),
      0 16px 30px rgba(34,197,94,.10);
  }
  50%{
    box-shadow:
      0 0 0 1px rgba(34,197,94,.28),
      0 0 0 12px rgba(34,197,94,.10),
      0 0 24px rgba(34,197,94,.24),
      0 18px 34px rgba(34,197,94,.12);
  }
}
@media (max-width: 520px){
  .session-toolbar .btn-secondary,
  .session-toolbar .btn-danger{
    min-height:42px;
    font-size:13px;
  }
  .device-session-card{
    padding:12px;
    border-radius:18px;
  }
  .device-session-visual{
    width:64px;
    height:64px;
  }
  .device-session-title{
    font-size:13px;
  }
  .device-session-line{
    padding:9px 11px;
  }
  .device-session-line-value{
    font-size:14px;
  }
}


/* Typing indicator v8: floating below the header, transparent RTL line. */
.header-typing-indicator{
  position: absolute;
  top: 72px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 940;
  max-width: min(74vw, 360px);
  display: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
  direction: rtl;
  text-align: center;
}
.header-typing-indicator.active{
  display: flex !important;
  align-items: center;
  justify-content: center;
}
.header-typing-indicator.active::after{
  content: none;
  display: none;
}
.typing-line,
.typing-pill{
  max-width: 100%;
  min-height: 20px;
  padding: 0;
  border-radius: 0;
  display: inline-flex;
  flex-direction: row;
  direction: rtl;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: transparent;
  border: 0;
  color: #b9efff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 900;
  letter-spacing: -.1px;
  vertical-align: middle;
  text-shadow: 0 1px 8px rgba(0,0,0,.34);
}
.typing-mini{
  width: 22px;
  height: 14px;
  flex: 0 0 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  background: transparent;
  color: currentColor;
  box-shadow: none;
  order: 2;
}
.typing-mini i{
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: .58;
  animation: typingDotBounce 1.05s ease-in-out infinite;
}
.typing-mini i:nth-child(2){ animation-delay: .16s; }
.typing-mini i:nth-child(3){ animation-delay: .32s; }
.typing-text{
  order: 1;
  direction: rtl;
  unicode-bidi: isolate;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@keyframes typingDotBounce{
  0%, 70%, 100%{ transform: translateY(0); opacity: .48; }
  35%{ transform: translateY(-2.5px); opacity: 1; }
}
.room-item.is-typing .room-avatar .avatar-media{
  border-color: rgba(56,189,248,.34);
  box-shadow: 0 0 0 3px rgba(56,189,248,.08), 0 0 18px rgba(56,189,248,.11);
}
.room-msg.is-typing{
  display: inline-flex;
  flex-direction: row;
  direction: rtl;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  color: var(--accent);
  font-weight: 800;
  padding-left: 8px;
  flex: 0 1 auto;
  width: auto;
  max-width: 100%;
}
.room-msg.is-typing .typing-mini{
  order: 2;
  width: 18px;
  height: 13px;
  flex: 0 0 18px;
  background: transparent;
}
.room-msg.is-typing .typing-mini i{
  width: 3.2px;
  height: 3.2px;
}
.room-msg.is-typing .typing-text{
  order: 1;
  direction: rtl;
  unicode-bidi: isolate;
  min-width: 0;
  flex: 0 1 auto;
  max-width: 100%;
}
body.light-theme .typing-line,
body.light-theme .typing-pill{
  color: #0284c7;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  text-shadow: 0 1px 7px rgba(255,255,255,.72);
}
body.light-theme .typing-mini{
  background: transparent;
  box-shadow: none;
}
body.light-theme .room-msg.is-typing{
  color: #0284c7;
}
body.light-theme .room-item.is-typing .room-avatar .avatar-media{
  border-color: rgba(14,165,233,.32);
  box-shadow: 0 0 0 3px rgba(14,165,233,.08), 0 0 18px rgba(14,165,233,.10);
}
@media (max-width: 520px){
  .header-typing-indicator{
    top: 70px;
    max-width: calc(100vw - 90px);
    font-size: 12px;
  }
}

/* v19: optional app lock settings */
.app-lock-settings{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.app-lock-status{
  padding:10px 12px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  background:rgba(15,23,42,.18);
}
.app-lock-status.is-enabled{
  color:#67e8f9;
  border-color:rgba(14,165,233,.28);
  background:rgba(14,165,233,.08);
}
.app-lock-form-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.app-lock-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.app-lock-body{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.app-lock-page{
  width:min(420px,100%);
}
.app-lock-card{
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.app-lock-card label{
  text-align:right;
}
.app-lock-icon{
  width:62px;
  height:62px;
  margin:0 auto 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:24px;
  background:linear-gradient(135deg, rgba(14,165,233,.22), rgba(99,102,241,.18));
  font-size:30px;
}
.app-lock-logout{
  display:inline-flex;
  justify-content:center;
  margin-top:2px;
}
.text-success{ color:#22c55e !important; }
.text-danger{ color:#ef4444 !important; }
body.light-theme .app-lock-status{
  background:rgba(241,245,249,.8);
  border-color:rgba(148,163,184,.35);
}
body.light-theme .app-lock-status.is-enabled{
  background:rgba(14,165,233,.10);
  color:#0369a1;
}
@media (max-width: 760px){
  .app-lock-form-grid{ grid-template-columns:1fr; }
  .app-lock-actions{ flex-direction:column; align-items:stretch; }
  .app-lock-actions button{ width:100%; }
}

/* v20: notification and PWA settings */
.notification-settings{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.notification-status{
  padding:10px 12px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  background:rgba(15,23,42,.18);
}
.notification-status.is-enabled{
  color:#67e8f9;
  border-color:rgba(14,165,233,.28);
  background:rgba(14,165,233,.08);
}
.notification-settings-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.setting-check-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:10px 12px;
  border:1px solid rgba(148,163,184,.14);
  border-radius:14px;
  background:rgba(15,23,42,.12);
  cursor:pointer;
}
.setting-check-row input{
  width:18px;
  height:18px;
  accent-color:var(--accent);
}
.notification-actions{
  gap:8px;
}
body.light-theme .notification-status,
body.light-theme .setting-check-row{
  background:rgba(255,255,255,.72);
  border-color:rgba(15,23,42,.08);
}
@media (max-width: 720px){
  .notification-settings-grid{
    grid-template-columns:1fr;
  }
}

/* Bot discovery / join */
.user-item-bot .part-name{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.profile-bot-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:2px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  line-height:1;
  color:#67e8f9;
  border:1px solid rgba(103,232,249,.28);
  background:rgba(14,165,233,.10);
  vertical-align:middle;
}
.contact-search-join-btn{
  flex:0 0 auto;
  min-width:82px;
  height:38px;
  padding:0 12px;
  border-radius:14px;
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}
.user-item-search.user-item-bot{
  gap:10px;
}
@media (max-width: 520px){
  .contact-search-join-btn{
    min-width:74px;
    height:34px;
    padding:0 10px;
    font-size:12px;
  }
}

/* v27 channel counters */
.channel-view-count{display:inline-flex;align-items:center;gap:3px;color:rgba(255,255,255,.82);font-size:11px;font-weight:700;line-height:1;vertical-align:middle}
.channel-view-count b{font:inherit;font-weight:800;color:inherit}
.channel-eye-svg{display:block;color:currentColor;opacity:.95;filter:drop-shadow(0 1px 1px rgba(0,0,0,.18))}
.msg-row.me .channel-view-count{color:rgba(255,255,255,.88)}
body.light-theme .channel-view-count{color:rgba(75,85,99,.9)}
.admin-mini-input{width:120px;max-width:100%;padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);color:var(--text,#fff);font:inherit}
.admin-channel-message-metrics{margin-top:12px;padding:12px;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:rgba(255,255,255,.035)}
.admin-channel-message-metrics h4{margin:0 0 8px;font-size:15px}
.admin-metrics-row input{min-width:130px;flex:1}
.thead.channel-metrics,.trow.channel-metrics{grid-template-columns:1.35fr .5fr .72fr .68fr .78fr .7fr}
@media(max-width:720px){.thead.channel-metrics{display:none}.trow.channel-metrics{grid-template-columns:1fr;gap:8px}.admin-metrics-row{flex-direction:column;align-items:stretch}.admin-mini-input{width:100%}}
/* v28 manual channel reaction counters */
.admin-reaction-metrics-row{flex-wrap:wrap;gap:8px;direction:ltr;justify-content:flex-end}
.admin-reaction-metrics-row label{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.04);font-size:18px;line-height:1}
.admin-reaction-metrics-row .admin-reaction-count{width:78px;min-width:78px;flex:0 0 auto;text-align:center;direction:ltr;padding:7px 8px;border-radius:10px}
body.light-theme .admin-reaction-metrics-row label{border-color:rgba(15,23,42,.10);background:rgba(15,23,42,.035)}
@media(max-width:720px){.admin-reaction-metrics-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}.admin-reaction-metrics-row label{justify-content:space-between}.admin-reaction-metrics-row .admin-reaction-count{width:100%;min-width:0}}

/* Device sessions mini neon cards - final compact design */
.session-toolbar{
  gap:7px;
  margin-top:8px;
}
.session-toolbar .btn-secondary,
.session-toolbar .btn-danger{
  min-height:38px;
  border-radius:13px;
  font-size:12px;
  padding:0 10px;
}
.device-session-list{
  gap:8px;
}
.device-session-group{
  gap:8px;
}
.device-session-group + .device-session-group{
  margin-top:4px;
}
.device-session-group-title{
  margin:2px 0 0;
  padding:0 2px;
}
.device-session-group-title span:first-child{
  font-size:13px;
  letter-spacing:-.01em;
}
.device-session-count-pill{
  min-width:22px;
  height:22px;
  padding:0 7px;
  font-size:10px;
  box-shadow:0 0 14px rgba(168,85,247,.26);
}
.device-session-card{
  position:relative;
  overflow:hidden;
  display:block;
  padding:9px 10px;
  border-radius:15px;
  border:1px solid rgba(125,211,252,.20);
  background:
    radial-gradient(circle at 8% 0%, rgba(56,189,248,.16), transparent 34%),
    radial-gradient(circle at 92% 100%, rgba(168,85,247,.13), transparent 38%),
    rgba(11,18,32,.72);
  box-shadow:0 10px 26px rgba(2,8,23,.24), inset 0 1px 0 rgba(255,255,255,.05);
  animation: deviceSessionMiniGlow 2.4s ease-in-out infinite;
}
.device-session-card.is-current{
  border-color:rgba(34,197,94,.38);
  animation-name: deviceSessionMiniGlowCurrent;
}
.device-session-card.is-other{
  border-color:rgba(168,85,247,.26);
}
.device-session-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(110deg, rgba(34,211,238,.0), rgba(34,211,238,.30), rgba(168,85,247,.24), rgba(34,197,94,.0));
  opacity:.38;
  transform:translateX(-45%);
  animation: deviceSessionNeonSweep 2.8s ease-in-out infinite;
}
.device-session-card > *{
  position:relative;
  z-index:1;
}
.device-session-hero{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  margin:0 0 7px;
}
.device-session-visual{
  width:42px;
  height:42px;
  border-radius:14px;
  box-shadow:0 0 0 1px rgba(56,189,248,.24), 0 0 16px rgba(56,189,248,.22);
}
.device-session-visual.current,
body.light-theme .device-session-visual.current{
  animation: deviceSessionTinyOrbPulse 1.6s ease-in-out infinite;
}
.device-session-visual.other{
  box-shadow:0 0 0 1px rgba(168,85,247,.22), 0 0 16px rgba(168,85,247,.22);
}
.device-session-platform-icon{
  width:27px;
  height:27px;
}
.device-session-browser-chip{
  width:19px;
  height:19px;
  padding:3px;
  left:-4px;
  bottom:-3px;
  box-shadow:0 0 12px rgba(56,189,248,.30), 0 6px 14px rgba(2,8,23,.28);
}
.device-session-headline{
  gap:1px;
}
.device-session-kicker{
  font-size:10px;
  margin:0;
  line-height:1.35;
}
.device-session-title{
  font-size:13px;
  line-height:1.35;
  font-weight:900;
}
.device-session-subtitle{
  margin-top:1px;
  font-size:11px;
  line-height:1.45;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.device-session-actions{
  align-self:center;
}
.device-session-status-pill{
  min-height:28px;
  padding:0 9px;
  border-radius:999px;
  font-size:10.5px;
  box-shadow:0 0 16px rgba(34,197,94,.18);
}
.device-session-actions .btn-danger{
  min-height:30px;
  border-radius:999px;
  padding:0 10px;
  font-size:11px;
  box-shadow:0 0 18px rgba(239,68,68,.16);
}
.device-session-lines{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}
.device-session-line{
  min-width:0;
  padding:6px 8px;
  border-radius:11px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(125,211,252,.10);
}
.device-session-line-label{
  font-size:9.5px;
  margin-bottom:2px;
  line-height:1.35;
}
.device-session-line-value,
.device-session-subtle .device-session-line-value{
  font-size:11px;
  line-height:1.5;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.device-session-empty{
  border-radius:14px;
  padding:12px;
  font-size:12px;
}
body.light-theme .device-session-card{
  background:
    radial-gradient(circle at 8% 0%, rgba(14,165,233,.12), transparent 34%),
    radial-gradient(circle at 92% 100%, rgba(168,85,247,.10), transparent 38%),
    rgba(255,255,255,.94);
  border-color:rgba(14,165,233,.20);
  box-shadow:0 10px 24px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.92);
}
body.light-theme .device-session-card.is-current{
  border-color:rgba(34,197,94,.30);
}
body.light-theme .device-session-card.is-other{
  border-color:rgba(168,85,247,.18);
}
body.light-theme .device-session-line{
  background:rgba(248,250,252,.78);
  border-color:rgba(14,165,233,.11);
}
@keyframes deviceSessionMiniGlow{
  0%,100%{box-shadow:0 10px 26px rgba(2,8,23,.24), 0 0 0 rgba(34,211,238,0), inset 0 1px 0 rgba(255,255,255,.05)}
  50%{box-shadow:0 10px 26px rgba(2,8,23,.24), 0 0 22px rgba(168,85,247,.22), inset 0 1px 0 rgba(255,255,255,.08)}
}
@keyframes deviceSessionMiniGlowCurrent{
  0%,100%{box-shadow:0 10px 26px rgba(2,8,23,.24), 0 0 0 rgba(34,197,94,0), inset 0 1px 0 rgba(255,255,255,.05)}
  50%{box-shadow:0 10px 26px rgba(2,8,23,.24), 0 0 24px rgba(34,197,94,.28), inset 0 1px 0 rgba(255,255,255,.08)}
}
@keyframes deviceSessionNeonSweep{
  0%,100%{opacity:.20;transform:translateX(-50%)}
  50%{opacity:.58;transform:translateX(50%)}
}
@keyframes deviceSessionTinyOrbPulse{
  0%,100%{box-shadow:0 0 0 1px rgba(34,197,94,.28), 0 0 14px rgba(34,197,94,.24)}
  50%{box-shadow:0 0 0 1px rgba(74,222,128,.48), 0 0 24px rgba(74,222,128,.42)}
}
@media (max-width: 520px){
  .session-toolbar{
    grid-template-columns:1fr 1fr;
  }
  .device-session-card{
    padding:8px;
    border-radius:14px;
  }
  .device-session-hero{
    grid-template-columns:38px minmax(0,1fr);
  }
  .device-session-actions{
    grid-column:1 / -1;
    width:100%;
  }
  .device-session-actions .btn-danger,
  .device-session-status-pill{
    width:100%;
    min-height:28px;
  }
  .device-session-visual{
    width:38px;
    height:38px;
  }
  .device-session-platform-icon{
    width:24px;
    height:24px;
  }
  .device-session-lines{
    grid-template-columns:1fr;
  }
}

/* Device sessions repaired compact neon cards */
body.admin-body .device-session-panel{
  padding:14px !important;
  border-radius:18px !important;
}
body.admin-body .device-session-panel h3{
  font-size:17px !important;
}
body.admin-body .device-session-panel .hint{
  font-size:12px !important;
  line-height:1.7 !important;
}
body.admin-body .session-toolbar{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  margin-top:10px !important;
}
body.admin-body .session-toolbar .btn-secondary,
body.admin-body .session-toolbar .btn-danger{
  min-height:34px !important;
  padding:0 10px !important;
  border-radius:12px !important;
  font-size:12px !important;
}
body.admin-body .device-session-list{
  display:grid !important;
  gap:8px !important;
  margin-top:10px !important;
}
body.admin-body .device-session-group{
  display:grid !important;
  gap:7px !important;
}
body.admin-body .device-session-group + .device-session-group{
  margin-top:3px !important;
}
body.admin-body .device-session-group-title{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
  margin:2px 0 !important;
  padding:0 2px !important;
  color:var(--text-muted) !important;
}
body.admin-body .device-session-group-title span:first-child{
  font-size:12px !important;
  font-weight:900 !important;
}
body.admin-body .device-session-count-pill{
  min-width:20px !important;
  height:20px !important;
  padding:0 7px !important;
  border-radius:999px !important;
  font-size:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(168,85,247,.16) !important;
  color:#e9d5ff !important;
  box-shadow:0 0 14px rgba(168,85,247,.28) !important;
}
body.admin-body .device-session-card{
  position:relative !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-columns:38px minmax(0,1fr) !important;
  align-items:center !important;
  gap:8px !important;
  min-height:0 !important;
  padding:8px 9px !important;
  border-radius:15px !important;
  border:1px solid rgba(34,211,238,.22) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(34,211,238,.17), transparent 36%),
    radial-gradient(circle at 100% 100%, rgba(168,85,247,.17), transparent 38%),
    rgba(8,13,27,.74) !important;
  box-shadow:0 8px 22px rgba(2,8,23,.22), inset 0 1px 0 rgba(255,255,255,.05) !important;
  animation: deviceSessionCardBlinkFixed 2.1s ease-in-out infinite !important;
}
body.admin-body .device-session-card.is-current{
  border-color:rgba(34,197,94,.40) !important;
  animation-name:deviceSessionCardBlinkCurrentFixed !important;
}
body.admin-body .device-session-card.is-other{
  border-color:rgba(168,85,247,.32) !important;
}
body.admin-body .device-session-card::before{
  content:"" !important;
  position:absolute !important;
  inset:-1px !important;
  border-radius:inherit !important;
  pointer-events:none !important;
  background:linear-gradient(110deg, transparent 8%, rgba(34,211,238,.34), rgba(168,85,247,.28), transparent 78%) !important;
  opacity:.32 !important;
  transform:translateX(-55%) !important;
  animation:deviceSessionNeonSweepFixed 2.6s ease-in-out infinite !important;
}
body.admin-body .device-session-card > *{
  position:relative !important;
  z-index:1 !important;
}
body.admin-body .device-session-visual{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  border-radius:14px !important;
  display:grid !important;
  place-items:center !important;
  background:linear-gradient(135deg,rgba(34,211,238,.18),rgba(168,85,247,.18)) !important;
  box-shadow:0 0 0 1px rgba(34,211,238,.25), 0 0 16px rgba(34,211,238,.24) !important;
}
body.admin-body .device-session-visual.current{
  box-shadow:0 0 0 1px rgba(34,197,94,.35), 0 0 18px rgba(34,197,94,.32) !important;
  animation:deviceSessionOrbBlinkFixed 1.45s ease-in-out infinite !important;
}
body.admin-body .device-session-visual.other{
  box-shadow:0 0 0 1px rgba(168,85,247,.30), 0 0 17px rgba(168,85,247,.28) !important;
}
body.admin-body .device-session-platform-icon{
  width:25px !important;
  height:25px !important;
  display:grid !important;
  place-items:center !important;
}
body.admin-body .device-session-platform-icon svg,
body.admin-body .device-session-browser-chip svg{
  width:100% !important;
  height:100% !important;
  display:block !important;
}
body.admin-body .device-session-browser-chip{
  position:absolute !important;
  left:-4px !important;
  bottom:-3px !important;
  width:18px !important;
  height:18px !important;
  padding:3px !important;
  border-radius:999px !important;
  background:rgba(15,23,42,.94) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 0 12px rgba(34,211,238,.32) !important;
}
body.admin-body .device-session-headline{
  min-width:0 !important;
  display:grid !important;
  gap:1px !important;
}
body.admin-body .device-session-topline{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
  min-width:0 !important;
}
body.admin-body .device-session-kicker{
  font-size:10px !important;
  line-height:1.35 !important;
  font-weight:900 !important;
  color:#67e8f9 !important;
}
body.admin-body .device-session-title{
  font-size:13px !important;
  line-height:1.35 !important;
  font-weight:950 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body.admin-body .device-session-subtitle,
body.admin-body .device-session-mini-meta{
  color:var(--text-muted) !important;
  font-size:10.5px !important;
  line-height:1.45 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body.admin-body .device-session-status-pill,
body.admin-body .device-session-actions .btn-danger{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  font-size:10px !important;
  font-weight:900 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
body.admin-body .device-session-status-pill.current{
  background:rgba(34,197,94,.15) !important;
  color:#86efac !important;
  border:1px solid rgba(34,197,94,.22) !important;
  box-shadow:0 0 14px rgba(34,197,94,.18) !important;
}
body.admin-body .device-session-actions .btn-danger{
  background:rgba(239,68,68,.14) !important;
  border:1px solid rgba(239,68,68,.28) !important;
  box-shadow:0 0 14px rgba(239,68,68,.16) !important;
}
body.admin-body .device-session-lines,
body.admin-body .device-session-hero{
  display:contents !important;
}
body.admin-body .device-session-line{
  display:none !important;
}
body.admin-body .device-session-empty{
  padding:10px !important;
  border-radius:13px !important;
  font-size:12px !important;
  border:1px solid rgba(34,211,238,.13) !important;
  background:rgba(255,255,255,.035) !important;
}
body.light-theme.admin-body .device-session-card{
  background:
    radial-gradient(circle at 0% 0%, rgba(14,165,233,.12), transparent 36%),
    radial-gradient(circle at 100% 100%, rgba(168,85,247,.11), transparent 38%),
    rgba(255,255,255,.96) !important;
  box-shadow:0 8px 18px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
body.light-theme.admin-body .device-session-browser-chip{
  background:#fff !important;
}
body.light-theme.admin-body .device-session-status-pill.current{
  color:#15803d !important;
}
body.light-theme.admin-body .device-session-kicker{
  color:#0891b2 !important;
}
@keyframes deviceSessionCardBlinkFixed{
  0%,100%{box-shadow:0 8px 22px rgba(2,8,23,.22),0 0 0 rgba(34,211,238,0),inset 0 1px 0 rgba(255,255,255,.05)}
  50%{box-shadow:0 8px 22px rgba(2,8,23,.22),0 0 20px rgba(168,85,247,.25),inset 0 1px 0 rgba(255,255,255,.08)}
}
@keyframes deviceSessionCardBlinkCurrentFixed{
  0%,100%{box-shadow:0 8px 22px rgba(2,8,23,.22),0 0 0 rgba(34,197,94,0),inset 0 1px 0 rgba(255,255,255,.05)}
  50%{box-shadow:0 8px 22px rgba(2,8,23,.22),0 0 22px rgba(34,197,94,.30),inset 0 1px 0 rgba(255,255,255,.08)}
}
@keyframes deviceSessionNeonSweepFixed{
  0%,100%{opacity:.18;transform:translateX(-60%)}
  50%{opacity:.55;transform:translateX(60%)}
}
@keyframes deviceSessionOrbBlinkFixed{
  0%,100%{filter:brightness(1);transform:scale(1)}
  50%{filter:brightness(1.22);transform:scale(1.035)}
}
@media(max-width:520px){
  body.admin-body .device-session-panel{padding:12px !important}
  body.admin-body .device-session-card{grid-template-columns:36px minmax(0,1fr) !important;padding:7px 8px !important;border-radius:14px !important}
  body.admin-body .device-session-visual{width:36px !important;height:36px !important;min-width:36px !important}
  body.admin-body .device-session-title{font-size:12.5px !important}
  body.admin-body .device-session-subtitle,
  body.admin-body .device-session-mini-meta{font-size:10px !important}
}
body.admin-body .device-session-visual{position:relative !important;}

/* v28: Telegram-like footer for long bot/channel reports only */
.msg-bubble.compact-long-message .compact-report-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
  direction:ltr;
  clear:both;
  margin-top:4px;
  min-height:18px;
}
.msg-bubble.compact-long-message .compact-report-footer .rx-bar{
  order:1;
  width:fit-content !important;
  max-width:68% !important;
  margin:3px auto 0 0 !important;
  justify-content:flex-start !important;
  direction:ltr !important;
}
.msg-bubble.compact-long-message .compact-report-footer .msg-meta{
  order:2;
  float:none !important;
  margin:3px 0 0 auto !important;
  padding:0 !important;
  direction:ltr !important;
  justify-content:flex-end !important;
  text-align:right !important;
  white-space:nowrap !important;
}
.msg-bubble.compact-long-message .compact-report-footer .channel-view-count{
  direction:ltr;
  gap:3px;
}
.msg-bubble.compact-long-message .compact-report-footer .channel-view-count b{
  direction:ltr;
  font-variant-numeric:tabular-nums;
}
@media (max-width:640px){
  .msg-bubble.compact-long-message .compact-report-footer{
    gap:6px;
    margin-top:3px;
  }
  .msg-bubble.compact-long-message .compact-report-footer .rx-bar{
    max-width:62% !important;
  }
}

/* v29: separate compact report reactions from views/time row.
   Only affects long bot/channel report messages marked by app.js. */
.msg-bubble.compact-long-message .compact-report-footer{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:2px !important;
  width:100% !important;
  direction:ltr !important;
  clear:both !important;
  margin-top:3px !important;
  min-height:0 !important;
}
.msg-bubble.compact-long-message .compact-report-footer .rx-bar{
  order:1 !important;
  align-self:flex-start !important;
  width:auto !important;
  max-width:100% !important;
  margin:0 0 3px 0 !important;
  justify-content:flex-start !important;
  direction:ltr !important;
  flex-wrap:wrap !important;
}
.msg-bubble.compact-long-message .compact-report-footer .msg-meta{
  order:2 !important;
  align-self:flex-end !important;
  float:none !important;
  margin:0 !important;
  padding:0 !important;
  display:inline-flex !important;
  justify-content:flex-end !important;
  text-align:right !important;
  direction:ltr !important;
  white-space:nowrap !important;
  max-width:100% !important;
}
@media (max-width:640px){
  .msg-bubble.compact-long-message .compact-report-footer{
    gap:2px !important;
    margin-top:2px !important;
  }
  .msg-bubble.compact-long-message .compact-report-footer .rx-bar{
    max-width:100% !important;
    margin-bottom:3px !important;
  }
}

/* ===== Admin panel professional tabbed layout ===== */
body.admin-body .admin-shell{
  max-width:1180px !important;
  padding:18px 24px 112px !important;
}
body.admin-body .admin-top{
  position:sticky;
  top:0;
  z-index:60;
  height:58px;
  margin:0 0 12px;
  border:1px solid rgba(125,211,252,.12);
  border-radius:22px;
  background:rgba(15,23,42,.72);
  backdrop-filter:blur(18px);
  box-shadow:0 10px 34px rgba(0,0,0,.22);
}
body.admin-body .admin-dashboard-tabs{
  position:sticky;
  top:70px;
  z-index:55;
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:8px;
  margin:0 0 14px;
  border:1px solid rgba(125,211,252,.12);
  border-radius:22px;
  background:linear-gradient(135deg,rgba(15,23,42,.86),rgba(30,41,59,.72));
  box-shadow:0 16px 40px rgba(0,0,0,.20), inset 0 0 0 1px rgba(255,255,255,.025);
  backdrop-filter:blur(18px);
  scrollbar-width:none;
}
body.admin-body .admin-dashboard-tabs::-webkit-scrollbar{display:none}
body.admin-body .admin-tab{
  appearance:none;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(255,255,255,.045);
  color:var(--text-muted);
  border-radius:16px;
  padding:10px 14px;
  min-width:max-content;
  font-family:inherit;
  font-weight:900;
  font-size:13px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:7px;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}
body.admin-body .admin-tab span{
  direction:ltr;
  min-width:24px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(14,165,233,.16);
  color:#7dd3fc;
  font-size:12px;
}
body.admin-body .admin-tab:hover{transform:translateY(-1px);border-color:rgba(56,189,248,.34);color:var(--text)}
body.admin-body .admin-tab.is-active{
  color:#fff;
  border-color:rgba(34,211,238,.55);
  background:linear-gradient(135deg,rgba(14,165,233,.90),rgba(59,130,246,.84));
  box-shadow:0 0 0 1px rgba(34,211,238,.16),0 0 24px rgba(14,165,233,.26), inset 0 1px 0 rgba(255,255,255,.18);
}
body.admin-body .admin-tab.is-active span{background:rgba(255,255,255,.22);color:#fff}
body.admin-body .admin-panels{
  display:block !important;
}
body.admin-body .admin-panel{
  display:block;
  scroll-margin-top:150px;
  margin:0 0 18px !important;
  padding:18px !important;
  border-radius:24px !important;
  border-color:rgba(125,211,252,.13) !important;
  background:linear-gradient(145deg,rgba(30,41,59,.84),rgba(15,23,42,.88)) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.26), inset 0 0 0 1px rgba(255,255,255,.025) !important;
}
body.admin-body .admin-panel.is-active{
  border-color:rgba(34,211,238,.42) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.26), 0 0 0 1px rgba(34,211,238,.16), inset 0 0 0 1px rgba(255,255,255,.025) !important;
}
body.admin-body .admin-panel[hidden]{display:block !important}
body.admin-body .admin-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
body.admin-body .admin-card-head h3,
body.admin-body .admin-panel>h3{
  border:0;
  padding:0;
  margin:0 0 6px;
  font-size:18px;
}
body.admin-body .admin-subtitle{
  margin-top:18px !important;
  font-size:15px !important;
  color:var(--text) !important;
}
body.admin-body .admin-count-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  color:#bae6fd;
  border:1px solid rgba(56,189,248,.28);
  background:rgba(14,165,233,.13);
}
body.admin-body .admin-form-stack{
  flex-direction:column;
  align-items:stretch;
  gap:10px;
  margin-bottom:0;
}
body.admin-body .admin-create-strip{
  display:grid;
  grid-template-columns:1fr 1fr minmax(120px,.55fr) auto;
  gap:10px;
  align-items:end;
  padding:12px;
  margin:8px 0 10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.035);
}
body.admin-body .admin-create-strip .btn-primary{height:44px;min-width:96px}
body.admin-body .admin-scroll-area{
  max-height:min(54vh,520px);
  overflow:auto;
  overscroll-behavior:contain;
  border-radius:16px;
  scrollbar-width:thin;
  scrollbar-color:rgba(56,189,248,.55) rgba(255,255,255,.04);
}
body.admin-body .admin-scroll-area::-webkit-scrollbar{width:7px;height:7px}
body.admin-body .admin-scroll-area::-webkit-scrollbar-track{background:rgba(255,255,255,.035);border-radius:999px}
body.admin-body .admin-scroll-area::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(34,211,238,.85),rgba(59,130,246,.75));border-radius:999px}
body.admin-body .admin-users-scroll{max-height:min(58vh,560px)}
body.admin-body .admin-requests-scroll{max-height:min(58vh,560px);padding:4px}
body.admin-body .admin-uploads-scroll,
body.admin-body .admin-rooms-scroll{max-height:min(54vh,500px)}
body.admin-body .table{
  margin-bottom:0;
  border-radius:16px;
  background:rgba(2,6,23,.18);
  border-color:rgba(148,163,184,.14);
}
body.admin-body .thead,
body.admin-body .trow{
  min-width:760px;
  padding:10px 12px;
}
body.admin-body .trow{font-size:12.5px}
body.admin-body .admin-users-table .thead,
body.admin-body .admin-users-table .trow{min-width:820px}
body.admin-body .admin-uploads-table .thead,
body.admin-body .admin-uploads-table .trow{min-width:860px}
body.admin-body .admin-actions{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
}
body.admin-body .admin-actions .pill.small,
body.admin-body .admin-actions .btn-danger{
  padding:7px 9px;
  min-height:32px;
  border-radius:11px;
  font-size:11.5px;
  width:auto;
}
body.admin-body .admin-role-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:54px;
  padding:5px 9px;
  border-radius:999px;
  color:#cbd5e1;
  font-size:11px;
  font-weight:900;
  border:1px solid rgba(148,163,184,.22);
  background:rgba(148,163,184,.10);
}
body.admin-body .admin-role-pill.is-admin{
  color:#fed7aa;
  border-color:rgba(251,146,60,.36);
  background:linear-gradient(135deg,rgba(245,158,11,.18),rgba(249,115,22,.12));
  box-shadow:0 0 18px rgba(245,158,11,.12);
}
body.admin-body .admin-user-name{font-weight:900;color:var(--text)}
body.admin-body #requestsWrap .list-item,
body.admin-body #verifiedWrap .list-item{
  padding:12px;
  margin-bottom:8px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
body.admin-body #requestsWrap .list-item:last-child,
body.admin-body #verifiedWrap .list-item:last-child{margin-bottom:0}
body.admin-body .members-box.admin-scroll-area{max-height:260px}

body.light-theme.admin-body .admin-top,
body.light-theme.admin-body .admin-dashboard-tabs,
body.light-theme.admin-body .admin-panel{
  background:rgba(255,255,255,.84) !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:0 14px 34px rgba(15,23,42,.10) !important;
}
body.light-theme.admin-body .admin-tab{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.10);color:#475569}
body.light-theme.admin-body .admin-tab.is-active{background:linear-gradient(135deg,#0ea5e9,#2563eb);color:#fff}
body.light-theme.admin-body .table{background:rgba(15,23,42,.025);border-color:rgba(15,23,42,.08)}
body.light-theme.admin-body #requestsWrap .list-item,
body.light-theme.admin-body #verifiedWrap .list-item{background:rgba(15,23,42,.035);border-color:rgba(15,23,42,.08)}

@media(max-width:720px){
  body.admin-body .admin-shell{padding:10px 10px 108px !important;max-width:100% !important}
  body.admin-body .admin-top{height:54px;margin-bottom:8px;border-radius:18px;padding:0 14px}
  body.admin-body .admin-dashboard-tabs{top:62px;margin-bottom:10px;border-radius:18px;padding:7px;gap:7px}
  body.admin-body .admin-tab{font-size:12px;padding:9px 11px;border-radius:14px}
  body.admin-body .admin-panel{padding:14px !important;border-radius:20px !important}
  body.admin-body .admin-card-head{flex-direction:column;gap:8px}
  body.admin-body .admin-create-strip{grid-template-columns:1fr;gap:8px;padding:10px}
  body.admin-body .admin-scroll-area{max-height:58vh}
  body.admin-body .thead{display:none}
  body.admin-body .trow,
  body.admin-body .admin-users-table .trow,
  body.admin-body .admin-uploads-table .trow{
    min-width:0;
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    padding:12px;
  }
  body.admin-body .thead>div:last-child,
  body.admin-body .trow>div:last-child{
    min-width:0;
    flex:unset;
    justify-content:flex-start;
  }
  body.admin-body .admin-actions{justify-content:flex-start}
}

/* =========================================================
   Admin panel final polish - safe visual/layout repair
   Scope: admin page only. Keeps all existing sections visible.
   ========================================================= */
body.admin-body{
  min-height:100dvh;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 0%, rgba(14,165,233,.17), transparent 34%),
    radial-gradient(circle at 88% 8%, rgba(99,102,241,.15), transparent 32%),
    var(--bg-deep) !important;
}
body.admin-body .admin-shell{
  width:100% !important;
  max-width:980px !important;
  height:100dvh !important;
  margin:0 auto !important;
  padding:12px 12px calc(196px + env(safe-area-inset-bottom, 0px)) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scroll-padding-top:184px !important;
  scroll-padding-bottom:190px !important;
}
body.admin-body .admin-top{
  position:sticky !important;
  top:8px !important;
  z-index:190 !important;
  min-height:64px !important;
  height:auto !important;
  margin:0 0 10px !important;
  padding:12px 16px !important;
  border-radius:24px !important;
  border:1px solid rgba(125,211,252,.18) !important;
  background:linear-gradient(135deg, rgba(3,83,139,.72), rgba(15,23,42,.90)) !important;
  box-shadow:0 18px 42px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
}
body.admin-body .admin-top .brand{font-size:21px !important;font-weight:950 !important;letter-spacing:-.7px !important;}
body.admin-body .admin-dashboard-tabs{
  position:sticky !important;
  top:84px !important;
  z-index:180 !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
  overflow:visible !important;
  padding:10px !important;
  margin:0 0 16px !important;
  border-radius:24px !important;
  border:1px solid rgba(125,211,252,.18) !important;
  background:rgba(15,23,42,.84) !important;
  box-shadow:0 18px 40px rgba(2,6,23,.30), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
}
body.admin-body .admin-tab{
  min-width:0 !important;
  width:100% !important;
  min-height:42px !important;
  justify-content:center !important;
  padding:9px 8px !important;
  border-radius:16px !important;
  color:#cbd5e1 !important;
  background:linear-gradient(180deg,rgba(255,255,255,.070),rgba(255,255,255,.035)) !important;
  border:1px solid rgba(148,163,184,.16) !important;
  font-size:12.5px !important;
  line-height:1.25 !important;
  box-shadow:none !important;
  white-space:nowrap !important;
}
body.admin-body .admin-tab span{min-width:22px !important;height:20px !important;padding:0 6px !important;font-size:11px !important;flex:0 0 auto !important;}
body.admin-body .admin-tab.is-active{
  color:#fff !important;
  border-color:rgba(34,211,238,.58) !important;
  background:linear-gradient(135deg,rgba(8,145,178,.98),rgba(37,99,235,.94)) !important;
  box-shadow:0 0 0 1px rgba(34,211,238,.13),0 0 24px rgba(14,165,233,.24) !important;
}
body.admin-body .admin-panels{display:flex !important;flex-direction:column !important;gap:16px !important;padding-bottom:26px !important;}
body.admin-body .admin-panel{
  display:block !important;
  margin:0 !important;
  padding:18px !important;
  scroll-margin-top:192px !important;
  border-radius:26px !important;
  border:1px solid rgba(125,211,252,.14) !important;
  background:linear-gradient(145deg,rgba(30,41,59,.72),rgba(15,23,42,.91)) !important;
  box-shadow:0 18px 46px rgba(2,6,23,.28), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
body.admin-body .admin-panel:last-child{margin-bottom:calc(132px + env(safe-area-inset-bottom,0px)) !important;}
body.admin-body .admin-panel[hidden]{display:block !important;}
body.admin-body .admin-card-head{display:flex !important;align-items:flex-start !important;justify-content:space-between !important;gap:12px !important;margin-bottom:14px !important;}
body.admin-body .admin-card-head h3,body.admin-body .admin-panel>h3{margin:0 0 5px !important;padding:0 !important;border:0 !important;font-size:18px !important;font-weight:950 !important;}
body.admin-body .hint{color:rgba(203,213,225,.72) !important;line-height:1.75 !important;}
body.admin-body .admin-search-box{margin:12px 0 14px !important;z-index:30 !important;}
body.admin-body .admin-search-input,body.admin-body input:not([type="file"]):not([type="checkbox"]),body.admin-body select{
  min-height:46px !important;
  padding:12px 14px !important;
  margin-bottom:0 !important;
  border-radius:16px !important;
  border-color:rgba(148,163,184,.16) !important;
  background:rgba(2,6,23,.23) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035) !important;
}
body.admin-body .admin-create-strip{
  display:grid !important;
  grid-template-columns:1fr 1fr minmax(110px,.55fr) auto !important;
  gap:10px !important;
  align-items:center !important;
  padding:12px !important;
  margin:8px 0 8px !important;
  border-radius:22px !important;
  border:1px solid rgba(148,163,184,.13) !important;
  background:rgba(255,255,255,.035) !important;
}
body.admin-body .admin-create-strip .btn-primary{width:auto !important;min-width:92px !important;min-height:46px !important;padding:0 17px !important;}
body.admin-body .admin-scroll-area{max-height:min(50dvh,520px) !important;overflow:auto !important;overscroll-behavior:contain !important;border-radius:20px !important;scrollbar-width:thin !important;scrollbar-color:rgba(56,189,248,.64) rgba(255,255,255,.045) !important;}
body.admin-body .admin-requests-scroll,body.admin-body .admin-users-scroll,body.admin-body .admin-rooms-scroll,body.admin-body .admin-uploads-scroll{max-height:min(48dvh,520px) !important;}
body.admin-body .table{border:0 !important;border-radius:20px !important;background:transparent !important;box-shadow:none !important;}
body.admin-body .thead{border-radius:16px !important;border:1px solid rgba(148,163,184,.12) !important;background:rgba(255,255,255,.055) !important;margin-bottom:8px !important;}
body.admin-body .trow{border:1px solid rgba(148,163,184,.10) !important;border-radius:16px !important;background:rgba(15,23,42,.34) !important;margin-bottom:8px !important;}
body.admin-body .trow:hover{background:rgba(15,23,42,.48) !important;}

/* Professional user management cards */
body.admin-body .admin-users-table{display:grid !important;gap:10px !important;overflow:visible !important;}
body.admin-body .admin-users-table .thead{display:none !important;}
body.admin-body .admin-users-table .trow.user-row{
  position:relative !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-areas:"name active" "role active" "date date" "actions actions" !important;
  gap:7px 12px !important;
  align-items:center !important;
  padding:15px !important;
  border-radius:22px !important;
  border:1px solid rgba(125,211,252,.13) !important;
  background:linear-gradient(145deg,rgba(15,23,42,.72),rgba(30,41,59,.42)) !important;
  box-shadow:0 12px 30px rgba(2,6,23,.18), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
body.admin-body .admin-users-table .trow.user-row > div{min-width:0 !important;flex:unset !important;padding:0 !important;}
body.admin-body .admin-users-table .trow.user-row > div:nth-child(1){grid-area:name !important;}
body.admin-body .admin-users-table .trow.user-row > div:nth-child(2){grid-area:role !important;}
body.admin-body .admin-users-table .trow.user-row > div:nth-child(3){grid-area:active !important;justify-self:end !important;align-self:start !important;}
body.admin-body .admin-users-table .trow.user-row > div:nth-child(4){grid-area:date !important;}
body.admin-body .admin-users-table .trow.user-row > div:nth-child(5){grid-area:actions !important;}
body.admin-body .admin-user-name{color:#f8fafc !important;font-size:16px !important;font-weight:950 !important;letter-spacing:-.2px !important;direction:ltr !important;text-align:right !important;}
body.admin-body .admin-role-pill{min-width:auto !important;padding:6px 12px !important;border-radius:999px !important;font-size:12px !important;font-weight:950 !important;color:#dbeafe !important;border:1px solid rgba(96,165,250,.28) !important;background:rgba(37,99,235,.13) !important;}
body.admin-body .admin-role-pill.is-admin{color:#fed7aa !important;border-color:rgba(251,146,60,.45) !important;background:linear-gradient(135deg,rgba(245,158,11,.22),rgba(249,115,22,.12)) !important;box-shadow:0 0 18px rgba(245,158,11,.14) !important;}
body.admin-body .admin-users-table .mono{display:inline-flex !important;align-items:center !important;gap:6px !important;color:rgba(203,213,225,.72) !important;font-size:12px !important;}
body.admin-body .admin-users-table .mono::before{content:"عضویت:";direction:rtl;font-family:inherit;color:rgba(125,211,252,.72);font-weight:800;}
body.admin-body .admin-actions{display:flex !important;flex-wrap:wrap !important;gap:8px !important;justify-content:flex-start !important;align-items:center !important;padding-top:6px !important;border-top:1px solid rgba(148,163,184,.10) !important;}
body.admin-body .admin-actions .pill.small,body.admin-body .admin-actions .btn-danger,body.admin-body .pill.small,body.admin-body .btn-danger{width:auto !important;min-width:auto !important;min-height:34px !important;height:auto !important;padding:8px 12px !important;border-radius:14px !important;font-size:12px !important;font-weight:900 !important;line-height:1.15 !important;white-space:nowrap !important;}
body.admin-body .admin-actions .pill.small{border:1px solid rgba(148,163,184,.16) !important;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.045)) !important;color:#e2e8f0 !important;}
body.admin-body .admin-actions [data-user-role-toggle]{border-color:rgba(34,211,238,.34) !important;background:linear-gradient(135deg,rgba(14,165,233,.22),rgba(37,99,235,.16)) !important;color:#dff6ff !important;}
body.admin-body .admin-actions [data-reset-user]{border-color:rgba(167,139,250,.28) !important;background:linear-gradient(135deg,rgba(139,92,246,.18),rgba(99,102,241,.12)) !important;color:#ede9fe !important;}
body.admin-body .admin-actions .btn-danger,body.admin-body .btn-danger{border:0 !important;background:linear-gradient(135deg,#ff3158,#ef4444) !important;color:#fff !important;box-shadow:0 10px 24px rgba(239,68,68,.24) !important;}
body.admin-body .admin-users-table .meta{color:rgba(203,213,225,.70) !important;font-weight:900 !important;padding:8px 0 !important;}
body.admin-body #requestsWrap .list-item,body.admin-body #verifiedWrap .list-item{border-radius:18px !important;border:1px solid rgba(125,211,252,.12) !important;background:linear-gradient(145deg,rgba(15,23,42,.58),rgba(30,41,59,.36)) !important;box-shadow:0 10px 24px rgba(2,6,23,.14) !important;}
body.admin-body .admin-subtitle{margin:18px 0 10px !important;font-size:15px !important;font-weight:950 !important;}
body.admin-body .bottom-nav{z-index:220 !important;bottom:calc(env(safe-area-inset-bottom,0px) + 16px) !important;}

@media (min-width:820px){
  body.admin-body .admin-dashboard-tabs{grid-template-columns:repeat(6,minmax(0,1fr)) !important;top:84px !important;}
  body.admin-body .admin-shell{padding-left:24px !important;padding-right:24px !important;}
  body.admin-body .admin-users-table .trow.user-row{grid-template-columns:minmax(180px,1fr) auto auto minmax(150px,auto) minmax(360px,1.35fr) !important;grid-template-areas:"name role active date actions" !important;}
  body.admin-body .admin-users-table .trow.user-row > div:nth-child(3){justify-self:center !important;align-self:center !important;}
  body.admin-body .admin-users-table .trow.user-row > div:nth-child(4){justify-self:start !important;}
  body.admin-body .admin-actions{justify-content:flex-end !important;border-top:0 !important;padding-top:0 !important;}
}
@media (max-width:520px){
  body.admin-body .admin-shell{padding:8px 8px calc(204px + env(safe-area-inset-bottom,0px)) !important;scroll-padding-top:176px !important;}
  body.admin-body .admin-top{top:6px !important;min-height:60px !important;border-radius:22px !important;padding:10px 14px !important;}
  body.admin-body .admin-top .brand{font-size:20px !important;}
  body.admin-body .admin-dashboard-tabs{top:76px !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:7px !important;padding:8px !important;border-radius:22px !important;margin-bottom:14px !important;}
  body.admin-body .admin-tab{min-height:40px !important;padding:8px 5px !important;font-size:11.5px !important;border-radius:14px !important;}
  body.admin-body .admin-tab span{min-width:19px !important;height:18px !important;padding:0 5px !important;font-size:10px !important;}
  body.admin-body .admin-panel{padding:15px 12px !important;border-radius:24px !important;scroll-margin-top:178px !important;}
  body.admin-body .admin-card-head{flex-direction:column !important;gap:8px !important;}
  body.admin-body .admin-create-strip{grid-template-columns:1fr !important;gap:8px !important;}
  body.admin-body .admin-create-strip .btn-primary{width:100% !important;}
  body.admin-body .admin-users-table .trow.user-row{padding:14px !important;border-radius:20px !important;}
  body.admin-body .admin-actions{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:8px !important;}
  body.admin-body .admin-actions .pill.small,body.admin-body .admin-actions .btn-danger{width:100% !important;justify-content:center !important;text-align:center !important;}
  body.admin-body .admin-actions .meta{grid-column:1/-1 !important;text-align:center !important;}
  body.admin-body .admin-scroll-area{max-height:46dvh !important;}
  body.admin-body .admin-panel:last-child{margin-bottom:150px !important;}
}
body.light-theme.admin-body{background:#eef4fb !important;}
body.light-theme.admin-body .admin-top,body.light-theme.admin-body .admin-dashboard-tabs,body.light-theme.admin-body .admin-panel{background:rgba(255,255,255,.88) !important;border-color:rgba(15,23,42,.10) !important;box-shadow:0 16px 38px rgba(15,23,42,.10) !important;}
body.light-theme.admin-body .admin-tab{background:rgba(15,23,42,.045) !important;color:#475569 !important;border-color:rgba(15,23,42,.10) !important;}
body.light-theme.admin-body .admin-tab.is-active{color:#fff !important;background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;}
body.light-theme.admin-body .admin-users-table .trow.user-row,body.light-theme.admin-body .trow,body.light-theme.admin-body #requestsWrap .list-item,body.light-theme.admin-body #verifiedWrap .list-item{background:rgba(255,255,255,.72) !important;border-color:rgba(15,23,42,.09) !important;box-shadow:0 10px 24px rgba(15,23,42,.06) !important;}
body.light-theme.admin-body .admin-user-name{color:#0f172a !important;}

/* Admin panel final tab behavior: only the active tab content is visible and the floating nav never covers the bottom content. */
html body.admin-body .admin-panels{
  display:block !important;
  padding-bottom:calc(176px + env(safe-area-inset-bottom,0px)) !important;
}
html body.admin-body .admin-panel{
  margin:0 0 calc(160px + env(safe-area-inset-bottom,0px)) !important;
  scroll-margin-top:188px !important;
}
html body.admin-body .admin-panel:not(.is-active),
html body.admin-body .admin-panel[hidden]{
  display:none !important;
}
html body.admin-body .admin-panel.is-active{
  display:block !important;
}
html body.admin-body .admin-panel.is-active:last-child{
  margin-bottom:calc(180px + env(safe-area-inset-bottom,0px)) !important;
}
html body.admin-body .admin-scroll-area{
  margin-bottom:18px !important;
}
html body.admin-body .admin-uploads-scroll,
html body.admin-body .admin-requests-scroll,
html body.admin-body .admin-users-scroll,
html body.admin-body .admin-rooms-scroll,
html body.admin-body .admin-verified-scroll{
  padding-bottom:14px !important;
}
@media (max-width:520px){
  html body.admin-body .admin-shell{
    padding-bottom:calc(220px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-panels{
    padding-bottom:calc(210px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-panel{
    margin-bottom:calc(190px + env(safe-area-inset-bottom,0px)) !important;
    scroll-margin-top:174px !important;
  }
  html body.admin-body .admin-panel.is-active:last-child{
    margin-bottom:calc(210px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-scroll-area{
    max-height:calc(100dvh - 330px) !important;
    min-height:0 !important;
  }
}

/* Admin panel: hide app floating nav and use clean in-panel spacing only. */
html body.admin-body .bottom-nav,
html body.admin-body .persist-bottom-nav{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
html body.admin-body .admin-shell{
  padding:8px 8px calc(26px + env(safe-area-inset-bottom,0px)) !important;
  scroll-padding-top:166px !important;
  scroll-padding-bottom:28px !important;
}
html body.admin-body .admin-panels{
  padding-bottom:calc(26px + env(safe-area-inset-bottom,0px)) !important;
}
html body.admin-body .admin-panel,
html body.admin-body .admin-panel.is-active:last-child,
html body.admin-body .admin-panel:last-child{
  margin-bottom:calc(26px + env(safe-area-inset-bottom,0px)) !important;
}
html body.admin-body .admin-scroll-area{
  max-height:min(64dvh,620px) !important;
  margin-bottom:10px !important;
}
html body.admin-body .admin-dashboard-tabs{
  margin-bottom:12px !important;
}
@media (max-width:520px){
  html body.admin-body .admin-shell{
    padding:7px 7px calc(24px + env(safe-area-inset-bottom,0px)) !important;
    scroll-padding-top:168px !important;
    scroll-padding-bottom:26px !important;
  }
  html body.admin-body .admin-panels{
    padding-bottom:calc(24px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-panel,
  html body.admin-body .admin-panel.is-active:last-child,
  html body.admin-body .admin-panel:last-child{
    margin-bottom:calc(24px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-scroll-area{
    max-height:calc(100dvh - 255px) !important;
    min-height:0 !important;
  }
}
@media (min-width:820px){
  html body.admin-body .admin-shell{
    padding:12px 24px calc(30px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-panels{
    padding-bottom:30px !important;
  }
}

/* Admin panel repair: real page scroll, restored hamburger, clean tab isolation. */
html body.admin-body{
  min-height:100dvh !important;
  height:auto !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
html body.admin-body .admin-shell{
  height:auto !important;
  min-height:100dvh !important;
  overflow:visible !important;
  padding:8px 8px calc(34px + env(safe-area-inset-bottom,0px)) !important;
  scroll-padding-top:0 !important;
  scroll-padding-bottom:0 !important;
}
html body.admin-body .admin-top{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  position:sticky !important;
  top:6px !important;
  z-index:500 !important;
  min-height:62px !important;
  margin:0 0 10px !important;
}
html body.admin-body .admin-top .brand{
  flex:1 1 auto !important;
  text-align:right !important;
}
html body.admin-body .top-actions,
html body.admin-body .admin-top .menu{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  visibility:visible !important;
  opacity:1 !important;
}
html body.admin-body #menuBtn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  border-radius:18px !important;
  font-size:26px !important;
  line-height:1 !important;
  color:#fff !important;
  background:linear-gradient(135deg,rgba(14,165,233,.32),rgba(30,41,59,.38)) !important;
  border:1px solid rgba(125,211,252,.20) !important;
  box-shadow:0 12px 28px rgba(2,132,199,.16) !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
html body.admin-body .menu-dropdown{
  z-index:9999 !important;
  left:0 !important;
  right:auto !important;
  top:54px !important;
}
html body.admin-body .admin-dashboard-tabs{
  position:sticky !important;
  top:78px !important;
  z-index:490 !important;
  margin-bottom:14px !important;
}
html body.admin-body .admin-panels{
  display:block !important;
  padding:0 0 calc(18px + env(safe-area-inset-bottom,0px)) !important;
  margin:0 !important;
}
html body.admin-body .admin-panel,
html body.admin-body .admin-panel[hidden],
html body.admin-body .admin-panel:not(.is-active){
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
html body.admin-body .admin-panel.is-active{
  display:block !important;
  visibility:visible !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  margin:0 0 calc(24px + env(safe-area-inset-bottom,0px)) !important;
  padding:16px 12px !important;
  border:1px solid rgba(34,211,238,.42) !important;
}
html body.admin-body .admin-scroll-area{
  overscroll-behavior:auto !important;
  overscroll-behavior-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-y !important;
}
@media (max-width:720px){
  html body.admin-body .admin-shell{
    padding:7px 7px calc(28px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-dashboard-tabs{
    top:76px !important;
  }
  html body.admin-body .admin-scroll-area,
  html body.admin-body .admin-users-scroll,
  html body.admin-body .admin-requests-scroll,
  html body.admin-body .admin-rooms-scroll,
  html body.admin-body .admin-uploads-scroll,
  html body.admin-body .admin-verified-scroll,
  html body.admin-body .admin-channel-scroll{
    max-height:none !important;
    overflow:visible !important;
    padding-bottom:0 !important;
    margin-bottom:12px !important;
  }
  html body.admin-body .table{
    overflow:visible !important;
  }
}
@media (min-width:721px){
  html body.admin-body .admin-scroll-area{
    max-height:min(62vh,640px) !important;
    overflow:auto !important;
  }
}

/* Admin panel: final sticky glass header/tabs and clean bottom clipping repair */
html body.admin-body .admin-shell{
  padding-top:7px !important;
  padding-bottom:calc(58px + env(safe-area-inset-bottom, 0px)) !important;
  scroll-padding-top:178px !important;
  scroll-padding-bottom:64px !important;
  overflow-y:auto !important;
  overscroll-behavior-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
html body.admin-body .admin-top{
  position:sticky !important;
  top:7px !important;
  z-index:360 !important;
  margin-bottom:8px !important;
  background:linear-gradient(135deg,rgba(2,132,199,.52),rgba(15,23,42,.70)) !important;
  border:1px solid rgba(125,211,252,.28) !important;
  box-shadow:0 18px 46px rgba(0,0,0,.26),0 0 0 1px rgba(255,255,255,.045) inset !important;
  backdrop-filter:blur(24px) saturate(150%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(150%) !important;
}
html body.admin-body .admin-dashboard-tabs{
  position:sticky !important;
  top:80px !important;
  z-index:340 !important;
  background:linear-gradient(135deg,rgba(15,23,42,.72),rgba(30,41,59,.56)) !important;
  border:1px solid rgba(125,211,252,.22) !important;
  box-shadow:0 16px 44px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.035) inset !important;
  backdrop-filter:blur(24px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(145%) !important;
}
html body.admin-body .menu-dropdown{
  min-width:142px !important;
  padding:10px !important;
  background:rgba(15,23,42,.82) !important;
  border:1px solid rgba(125,211,252,.18) !important;
  border-radius:18px !important;
  backdrop-filter:blur(22px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(22px) saturate(145%) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.28) !important;
}
html body.admin-body .menu-dropdown .menu-item{
  justify-content:center !important;
  border-radius:14px !important;
}
html body.admin-body .admin-panels{
  padding-bottom:calc(52px + env(safe-area-inset-bottom, 0px)) !important;
}
html body.admin-body .admin-panel,
html body.admin-body .admin-panel.is-active:last-child,
html body.admin-body .admin-panel:last-child{
  margin-bottom:calc(42px + env(safe-area-inset-bottom, 0px)) !important;
  overflow:visible !important;
}
html body.admin-body .admin-scroll-area{
  overscroll-behavior:auto !important;
  -webkit-overflow-scrolling:touch !important;
  padding-bottom:18px !important;
}
html body.admin-body .admin-uploads-table .trow:last-child,
html body.admin-body .admin-users-table .trow:last-child,
html body.admin-body .admin-rooms-table .trow:last-child,
html body.admin-body .admin-channel-metrics-table .trow:last-child,
html body.admin-body #verifiedWrap .list-item:last-child,
html body.admin-body #requestsWrap .list-item:last-child{
  margin-bottom:14px !important;
}
html body.admin-body .admin-panel::after{
  content:"";
  display:block;
  clear:both;
  height:1px;
}
@media (max-width:520px){
  html body.admin-body .admin-shell{
    padding-top:7px !important;
    padding-bottom:calc(56px + env(safe-area-inset-bottom, 0px)) !important;
    scroll-padding-top:170px !important;
    scroll-padding-bottom:62px !important;
  }
  html body.admin-body .admin-top{
    top:7px !important;
  }
  html body.admin-body .admin-dashboard-tabs{
    top:78px !important;
  }
  html body.admin-body .admin-panel,
  html body.admin-body .admin-panel.is-active:last-child,
  html body.admin-body .admin-panel:last-child{
    margin-bottom:calc(40px + env(safe-area-inset-bottom, 0px)) !important;
  }
  html body.admin-body .admin-panels{
    padding-bottom:calc(48px + env(safe-area-inset-bottom, 0px)) !important;
  }
}
body.light-theme.admin-body .admin-top,
body.light-theme.admin-body .admin-dashboard-tabs,
body.light-theme.admin-body .menu-dropdown{
  background:rgba(255,255,255,.78) !important;
  backdrop-filter:blur(24px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(145%) !important;
}

/* Admin panel: fixed shared content frame. Header/tabs stay glass-fixed; active tab content scrolls inside one clean border. */
html body.admin-body,
html body.admin-body.admin-body{
  height:100dvh !important;
  min-height:100dvh !important;
  overflow:hidden !important;
}
html body.admin-body .admin-shell{
  height:100dvh !important;
  min-height:0 !important;
  max-height:100dvh !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  padding:7px 7px calc(10px + env(safe-area-inset-bottom,0px)) !important;
}
html body.admin-body .admin-top,
html body.admin-body .admin-dashboard-tabs{
  position:relative !important;
  top:auto !important;
  flex:0 0 auto !important;
}
html body.admin-body .admin-top{
  margin:0 !important;
}
html body.admin-body .admin-dashboard-tabs{
  margin:0 !important;
}
html body.admin-body .admin-panels{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid rgba(34,211,238,.42) !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 90% 0%, rgba(14,165,233,.12), transparent 34%),
    linear-gradient(145deg,rgba(30,41,59,.70),rgba(15,23,42,.90)) !important;
  box-shadow:
    0 18px 48px rgba(0,0,0,.26),
    0 0 0 1px rgba(255,255,255,.035) inset,
    0 0 28px rgba(34,211,238,.10) !important;
}
html body.admin-body .admin-panel,
html body.admin-body .admin-panel[hidden],
html body.admin-body .admin-panel:not(.is-active){
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  max-height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  box-shadow:none !important;
}
html body.admin-body .admin-panel.is-active{
  display:block !important;
  visibility:visible !important;
  width:100% !important;
  height:100% !important;
  max-height:none !important;
  min-height:0 !important;
  margin:0 !important;
  padding:18px 16px 22px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  border:0 !important;
  border-radius:25px !important;
  background:transparent !important;
  box-shadow:none !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
  scrollbar-color:rgba(56,189,248,.70) rgba(255,255,255,.05) !important;
}
html body.admin-body .admin-panel.is-active::-webkit-scrollbar{width:7px;height:7px}
html body.admin-body .admin-panel.is-active::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:999px}
html body.admin-body .admin-panel.is-active::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(34,211,238,.85),rgba(37,99,235,.78));border-radius:999px}
html body.admin-body .admin-scroll-area,
html body.admin-body .admin-users-scroll,
html body.admin-body .admin-requests-scroll,
html body.admin-body .admin-rooms-scroll,
html body.admin-body .admin-uploads-scroll,
html body.admin-body .admin-verified-scroll,
html body.admin-body .admin-channel-scroll{
  max-height:none !important;
  overflow:visible !important;
  padding-bottom:0 !important;
  margin-bottom:12px !important;
  overscroll-behavior:auto !important;
}
html body.admin-body .admin-panel.is-active > :last-child{
  margin-bottom:0 !important;
}
html body.admin-body .admin-panel::after{
  content:"";
  display:block;
  height:16px;
}
html body.admin-body .admin-panel.is-active:last-child,
html body.admin-body .admin-panel:last-child{
  margin-bottom:0 !important;
}
html body.admin-body .menu-dropdown{
  position:absolute !important;
}
@media (max-width:520px){
  html body.admin-body .admin-shell{
    gap:7px !important;
    padding:7px 7px calc(8px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body.admin-body .admin-top{
    min-height:60px !important;
  }
  html body.admin-body .admin-dashboard-tabs{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:7px !important;
    padding:8px !important;
    border-radius:22px !important;
  }
  html body.admin-body .admin-tab{
    min-height:39px !important;
  }
  html body.admin-body .admin-panels{
    border-radius:24px !important;
  }
  html body.admin-body .admin-panel.is-active{
    padding:16px 12px 20px !important;
    border-radius:23px !important;
  }
}
@media (min-width:821px){
  html body.admin-body .admin-shell{
    padding:12px 24px calc(14px + env(safe-area-inset-bottom,0px)) !important;
    gap:10px !important;
  }
  html body.admin-body .admin-panel.is-active{
    padding:22px 22px 26px !important;
  }
}
body.light-theme.admin-body .admin-panels{
  background:rgba(255,255,255,.82) !important;
  border-color:rgba(15,23,42,.12) !important;
  box-shadow:0 16px 38px rgba(15,23,42,.10),0 0 0 1px rgba(255,255,255,.55) inset !important;
}

/* Admin panel frame repair: fixed glass header/tabs + one complete scrollable frame per tab. */
html body.admin-body,
html body.admin-body.admin-body{
  width:100% !important;
  height:100vh !important;
  min-height:100vh !important;
  max-height:100vh !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}
@supports (height: 100svh){
  html body.admin-body,
  html body.admin-body.admin-body{
    height:100svh !important;
    min-height:100svh !important;
    max-height:100svh !important;
  }
}
html body.admin-body *,
html body.admin-body *::before,
html body.admin-body *::after{box-sizing:border-box !important;}
html body.admin-body .admin-shell{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) !important;
  gap:8px !important;
  padding:7px 7px calc(12px + env(safe-area-inset-bottom,0px)) !important;
  margin:0 !important;
}
html body.admin-body .admin-top{
  grid-row:1 !important;
  position:relative !important;
  top:auto !important;
  z-index:30 !important;
  flex:0 0 auto !important;
  margin:0 !important;
  min-height:60px !important;
  background:linear-gradient(135deg,rgba(2,132,199,.54),rgba(15,23,42,.74)) !important;
  border:1px solid rgba(125,211,252,.30) !important;
  box-shadow:0 14px 38px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.045) inset !important;
  backdrop-filter:blur(24px) saturate(150%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(150%) !important;
}
html body.admin-body .admin-dashboard-tabs{
  grid-row:2 !important;
  position:relative !important;
  top:auto !important;
  z-index:25 !important;
  flex:0 0 auto !important;
  margin:0 !important;
  background:linear-gradient(135deg,rgba(15,23,42,.74),rgba(30,41,59,.58)) !important;
  border:1px solid rgba(125,211,252,.22) !important;
  box-shadow:0 14px 38px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.035) inset !important;
  backdrop-filter:blur(24px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(145%) !important;
}
html body.admin-body .admin-panels{
  grid-row:3 !important;
  align-self:stretch !important;
  justify-self:stretch !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  margin:0 !important;
  padding:0 !important;
  display:block !important;
  overflow:hidden !important;
  border:1px solid rgba(34,211,238,.44) !important;
  border-radius:26px !important;
  background:radial-gradient(circle at 92% 0%,rgba(14,165,233,.13),transparent 36%),linear-gradient(145deg,rgba(30,41,59,.72),rgba(15,23,42,.90)) !important;
  box-shadow:0 18px 46px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.035) inset,0 0 28px rgba(34,211,238,.11) !important;
}
html body.admin-body .admin-panel,
html body.admin-body .admin-panel[hidden],
html body.admin-body .admin-panel:not(.is-active){
  display:none !important;
  visibility:hidden !important;
  width:100% !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  box-shadow:none !important;
}
html body.admin-body .admin-panel.is-active{
  display:block !important;
  visibility:visible !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  margin:0 !important;
  padding:18px 16px 22px !important;
  border:0 !important;
  border-radius:25px !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
  scrollbar-color:rgba(56,189,248,.72) rgba(255,255,255,.05) !important;
}
html body.admin-body .admin-panel.is-active::-webkit-scrollbar{width:7px;height:7px !important}
html body.admin-body .admin-panel.is-active::-webkit-scrollbar-track{background:rgba(255,255,255,.04) !important;border-radius:999px !important}
html body.admin-body .admin-panel.is-active::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(34,211,238,.85),rgba(37,99,235,.78)) !important;border-radius:999px !important}
html body.admin-body .admin-scroll-area,
html body.admin-body .admin-users-scroll,
html body.admin-body .admin-requests-scroll,
html body.admin-body .admin-rooms-scroll,
html body.admin-body .admin-uploads-scroll,
html body.admin-body .admin-verified-scroll,
html body.admin-body .admin-channel-scroll,
html body.admin-body .members-box{
  max-height:none !important;
  height:auto !important;
  overflow:visible !important;
  padding-bottom:0 !important;
  margin-bottom:14px !important;
  overscroll-behavior:auto !important;
}
html body.admin-body .admin-panel.is-active::after{
  content:"" !important;
  display:block !important;
  width:100% !important;
  height:34px !important;
  flex:0 0 auto !important;
}
html body.admin-body .admin-pagination{
  position:relative !important;
  z-index:2 !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  margin:14px 0 0 !important;
  padding:10px 0 4px !important;
}
html body.admin-body .admin-pagination-hint{
  text-align:center !important;
  margin:8px 0 0 !important;
  padding-bottom:6px !important;
}
html body.admin-body .admin-uploads-table .trow:last-child,
html body.admin-body .admin-users-table .trow:last-child,
html body.admin-body .admin-rooms-table .trow:last-child,
html body.admin-body .admin-channel-metrics-table .trow:last-child,
html body.admin-body #verifiedWrap .list-item:last-child,
html body.admin-body #requestsWrap .list-item:last-child{margin-bottom:12px !important;}
html body.admin-body .menu-dropdown{position:absolute !important;}
@media (max-width:520px){
  html body.admin-body .admin-shell{gap:7px !important;padding:7px 7px calc(10px + env(safe-area-inset-bottom,0px)) !important;}
  html body.admin-body .admin-top{min-height:60px !important;border-radius:22px !important;}
  html body.admin-body .admin-dashboard-tabs{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:7px !important;padding:8px !important;border-radius:22px !important;}
  html body.admin-body .admin-tab{min-height:39px !important;padding:8px 5px !important;border-radius:14px !important;font-size:11.5px !important;}
  html body.admin-body .admin-tab span{min-width:19px !important;height:18px !important;font-size:10px !important;}
  html body.admin-body .admin-panels{border-radius:24px !important;}
  html body.admin-body .admin-panel.is-active{padding:16px 12px 20px !important;border-radius:23px !important;}
  html body.admin-body .admin-panel.is-active::after{height:28px !important;}
}
@media (min-width:821px){
  html body.admin-body .admin-shell{padding:12px 24px calc(14px + env(safe-area-inset-bottom,0px)) !important;gap:10px !important;}
  html body.admin-body .admin-panel.is-active{padding:22px 22px 26px !important;}
}
body.light-theme.admin-body .admin-panels{
  background:rgba(255,255,255,.82) !important;
  border-color:rgba(15,23,42,.12) !important;
  box-shadow:0 16px 38px rgba(15,23,42,.10),0 0 0 1px rgba(255,255,255,.55) inset !important;
}

/* uploads panel only: keep internal scroll + pagination visible + count chip top-left */
html body.admin-body #admin-panel-uploads.admin-panel.is-active{
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto auto !important;
  align-content:stretch !important;
  gap:14px !important;
  overflow:hidden !important;
}
html body.admin-body #admin-panel-uploads.admin-panel.is-active::after{
  display:none !important;
  content:none !important;
}
html body.admin-body #admin-panel-uploads .admin-card-head{
  margin:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:start !important;
  gap:10px 14px !important;
  direction:rtl !important;
}
html body.admin-body #admin-panel-uploads .admin-card-head > div:first-child{
  min-width:0 !important;
}
html body.admin-body #admin-panel-uploads .admin-card-head > .admin-count-chip{
  grid-column:2 !important;
  grid-row:1 !important;
  align-self:start !important;
  justify-self:start !important;
  margin:0 !important;
}
html body.admin-body #admin-panel-uploads .admin-uploads-scroll{
  min-height:0 !important;
  height:100% !important;
  max-height:none !important;
  overflow:auto !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  margin:0 !important;
  padding:0 0 6px !important;
}
html body.admin-body #admin-panel-uploads .admin-pagination,
html body.admin-body #admin-panel-uploads .admin-pagination-hint,
html body.admin-body #admin-panel-uploads #uploadResult{
  flex:0 0 auto !important;
}
html body.admin-body #admin-panel-uploads .admin-pagination{
  margin:0 !important;
  padding:10px 0 0 !important;
}
html body.admin-body #admin-panel-uploads .admin-pagination-hint{
  margin:0 !important;
  padding:0 0 4px !important;
}
html body.admin-body #admin-panel-uploads #uploadResult{
  margin-top:0 !important;
}
@media (max-width:520px){
  html body.admin-body #admin-panel-uploads.admin-panel.is-active{
    gap:12px !important;
  }
  html body.admin-body #admin-panel-uploads .admin-card-head{
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:8px 10px !important;
  }
}


/* Settings page must stay independent from admin panel layout */
body.settings-body{
  background: var(--bg-deep);
  min-height: var(--app-vh);
  height: var(--app-vh);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.settings-shell{
  width: 100%;
  max-width: 440px;
  margin: 0 auto;
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  padding: 0 0 calc(112px + env(safe-area-inset-bottom,0px));
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
.settings-top{
  position: sticky;
  top: 0;
  z-index: 120;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  background: rgba(26,39,53,0.86);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  margin-bottom: 20px;
  flex-shrink: 0;
}
.settings-top .brand{
  font-weight: 800;
  font-size: 18px;
  color: var(--text);
  letter-spacing: -0.5px;
}
body.settings-body .menu{position: relative; overflow: visible;}
body.settings-body .top-actions{position: relative; z-index: 140;}
body.settings-body .menu-dropdown{
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 100000;
}
@media (max-width: 640px){
  .settings-shell{
    max-width: 100%;
    padding-bottom: calc(104px + env(safe-area-inset-bottom,0px));
  }
  .settings-top{
    padding: 0 14px;
  }
}

/* Settings main page: independent from admin/menu changes. */
body.settings-body .settings-top{
  justify-content: flex-start;
}
body.settings-body .settings-top .brand{
  margin-inline-start: auto;
}
body.light-theme.settings-body .settings-top{
  background: rgba(255,255,255,0.86) !important;
  border-bottom: 1px solid rgba(15,23,42,0.08) !important;
  box-shadow: 0 8px 24px rgba(15,23,42,0.04);
  color: var(--text) !important;
}
body.light-theme.settings-body .settings-top .brand{
  color: var(--text) !important;
}

/* =========================================================
   v35: light mode repair for settings/admin/session screens
   Scoped overrides only. Keeps dark mode untouched.
========================================================= */
body.light-theme{
  --bg-deep:#eef4f8;
  --bg-elevated:#ffffff;
  --glass:rgba(255,255,255,.86);
  --glass-border:rgba(15,23,42,.10);
  --glass-shadow:0 14px 34px rgba(15,23,42,.09);
  --text:#111827;
  --text-muted:#526173;
  --primary:#0ea5e9;
  --accent:#0ea5e9;
  --danger:#ef4444;
  --sec-label:#526173;
}

body.light-theme.settings-body,
body.light-theme.admin-body{
  background:linear-gradient(180deg,#f7fafc 0%,#eef4f8 100%) !important;
  color:#111827 !important;
}
body.light-theme.settings-body .settings-shell{
  background:transparent !important;
  color:#111827 !important;
  padding-bottom:calc(132px + env(safe-area-inset-bottom,0px)) !important;
}
body.light-theme.settings-body .settings-top{
  background:rgba(255,255,255,.94) !important;
  border-bottom:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 8px 24px rgba(15,23,42,.05) !important;
}
body.light-theme.settings-body .settings-top .brand,
body.light-theme.settings-body .card h3,
body.light-theme.settings-body .settings-shortcut-title,
body.light-theme.settings-body label,
body.light-theme.settings-body .setting-check-row span,
body.light-theme.settings-body .hint b,
body.light-theme.admin-body .brand,
body.light-theme.admin-body h3,
body.light-theme.admin-body label,
body.light-theme.admin-body .device-session-title,
body.light-theme.admin-body .admin-card-head h3,
body.light-theme.admin-body .admin-panel>h3{
  color:#111827 !important;
}
body.light-theme.settings-body .card,
body.light-theme.admin-body .card,
body.light-theme.admin-body .admin-panel,
body.light-theme.admin-body .admin-panels{
  background:rgba(255,255,255,.94) !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:0 16px 38px rgba(15,23,42,.08) !important;
  color:#111827 !important;
}
body.light-theme.settings-body .hint,
body.light-theme.settings-body .settings-shortcut-sub,
body.light-theme.settings-body .meta,
body.light-theme.settings-body .pb-label,
body.light-theme.admin-body .hint,
body.light-theme.admin-body .meta,
body.light-theme.admin-body .device-session-subtitle,
body.light-theme.admin-body .device-session-mini-meta,
body.light-theme.admin-body .device-session-line-label,
body.light-theme.admin-body .device-session-line-value,
body.light-theme.admin-body .device-session-subtle .device-session-line-value{
  color:#526173 !important;
  opacity:1 !important;
}
body.light-theme.settings-body input:not([type="file"]):not([type="checkbox"]),
body.light-theme.settings-body select,
body.light-theme.settings-body textarea,
body.light-theme.admin-body input:not([type="file"]):not([type="checkbox"]),
body.light-theme.admin-body select,
body.light-theme.admin-body textarea{
  background:#f8fafc !important;
  border-color:rgba(15,23,42,.12) !important;
  color:#111827 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85) !important;
}
body.light-theme.settings-body input::placeholder,
body.light-theme.settings-body textarea::placeholder,
body.light-theme.admin-body input::placeholder,
body.light-theme.admin-body textarea::placeholder{
  color:#7b8797 !important;
  opacity:1 !important;
}
body.light-theme.settings-body .settings-shortcut-card,
body.light-theme.settings-body .setting-check-row,
body.light-theme.settings-body .notification-status,
body.light-theme.settings-body .app-lock-status,
body.light-theme.admin-body .device-session-line,
body.light-theme.admin-body .device-session-empty{
  background:rgba(255,255,255,.82) !important;
  border-color:rgba(15,23,42,.10) !important;
  color:#111827 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.045) !important;
}
body.light-theme.settings-body .settings-shortcut-icon,
body.light-theme.settings-body .settings-shortcut-icon.use-image-icon{
  background:rgba(14,165,233,.10) !important;
  border-color:rgba(14,165,233,.18) !important;
}
body.light-theme.settings-body .settings-shortcut-icon img,
body.light-theme.settings-body .settings-shortcut-icon svg{
  filter:none !important;
  color:#0ea5e9 !important;
  fill:#0ea5e9 !important;
}
body.light-theme.settings-body .btn-primary,
body.light-theme.admin-body .btn-primary{
  background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;
  color:#fff !important;
  box-shadow:0 12px 26px rgba(37,99,235,.20) !important;
}
body.light-theme.settings-body .btn-secondary,
body.light-theme.admin-body .btn-secondary,
body.light-theme.settings-body .pill,
body.light-theme.admin-body .pill{
  background:#ffffff !important;
  color:#111827 !important;
  border:1px solid rgba(15,23,42,.12) !important;
  box-shadow:0 8px 20px rgba(15,23,42,.06) !important;
}
body.light-theme.settings-body .text-danger,
body.light-theme.admin-body .text-danger{
  color:#dc2626 !important;
}
body.light-theme.settings-body .bottom-nav{
  background:rgba(255,255,255,.88) !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:0 16px 36px rgba(15,23,42,.10) !important;
}
body.light-theme.settings-body .nav-item,
body.light-theme.settings-body .nav-label{
  color:#526173 !important;
}
body.light-theme.settings-body .nav-item.active,
body.light-theme.settings-body .nav-item.active .nav-label{
  color:#111827 !important;
}

/* Admin panel light colors */
body.light-theme.admin-body .admin-top,
body.light-theme.admin-body .admin-dashboard-tabs{
  background:rgba(255,255,255,.88) !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:0 16px 38px rgba(15,23,42,.08) !important;
}
body.light-theme.admin-body .admin-tab{
  background:#f8fafc !important;
  border-color:rgba(15,23,42,.12) !important;
  color:#334155 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85) !important;
}
body.light-theme.admin-body .admin-tab span{
  background:rgba(14,165,233,.12) !important;
  color:#0f7490 !important;
}
body.light-theme.admin-body .admin-tab.is-active{
  background:linear-gradient(135deg,#18c4df,#2563eb) !important;
  color:#fff !important;
  border-color:rgba(37,99,235,.35) !important;
  box-shadow:0 12px 28px rgba(37,99,235,.20) !important;
}
body.light-theme.admin-body .admin-tab.is-active span{
  background:rgba(255,255,255,.25) !important;
  color:#fff !important;
}
body.light-theme.admin-body .list-item,
body.light-theme.admin-body .admin-user-card,
body.light-theme.admin-body .admin-upload-row,
body.light-theme.admin-body .admin-uploads-table .trow,
body.light-theme.admin-body .admin-uploads-scroll,
body.light-theme.admin-body .admin-create-strip{
  background:rgba(248,250,252,.88) !important;
  border-color:rgba(15,23,42,.09) !important;
  color:#111827 !important;
}
body.light-theme.admin-body .admin-uploads-table .thead{
  color:#334155 !important;
  background:rgba(241,245,249,.82) !important;
  border-color:rgba(15,23,42,.08) !important;
}

/* Device sessions: equal buttons + readable light mode */
body.admin-body .session-toolbar{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:stretch !important;
  gap:8px !important;
}
body.admin-body .session-toolbar .btn-secondary,
body.admin-body .session-toolbar .btn-danger,
body.admin-body .device-session-actions .btn-danger,
body.admin-body .device-session-actions .btn-secondary{
  width:100% !important;
  min-width:0 !important;
  min-height:42px !important;
  height:42px !important;
  padding:0 14px !important;
  border-radius:14px !important;
  font-size:13px !important;
  line-height:1 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  white-space:nowrap !important;
}
body.light-theme.admin-body .device-session-card{
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
  border-color:rgba(14,165,233,.18) !important;
  color:#111827 !important;
  box-shadow:0 12px 28px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
body.light-theme.admin-body .device-session-card.is-current{
  border-color:rgba(34,197,94,.30) !important;
}
body.light-theme.admin-body .device-session-card.is-other{
  border-color:rgba(168,85,247,.18) !important;
}
body.light-theme.admin-body .device-session-browser-chip{
  background:#ffffff !important;
  border-color:rgba(15,23,42,.12) !important;
}
body.light-theme.admin-body .device-session-status-pill.current{
  background:rgba(34,197,94,.12) !important;
  color:#15803d !important;
  border-color:rgba(34,197,94,.24) !important;
}
body.light-theme.admin-body .session-toolbar .btn-danger,
body.light-theme.admin-body .device-session-actions .btn-danger{
  background:linear-gradient(135deg,#ff3158,#ef4444) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 12px 24px rgba(239,68,68,.22) !important;
}

/* Confirmation modal: same-size buttons */
.app-confirm-actions{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:stretch !important;
}
.app-confirm-actions .btn-secondary,
.app-confirm-actions .btn-danger{
  width:100% !important;
  min-width:0 !important;
  min-height:54px !important;
  height:54px !important;
  padding:0 18px !important;
  border-radius:18px !important;
  font-size:16px !important;
  font-weight:900 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
body.light-theme .app-confirm-card{
  background:rgba(255,255,255,.96) !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:0 26px 64px rgba(15,23,42,.20) !important;
}
body.light-theme .app-confirm-text{
  color:#111827 !important;
}
body.light-theme .app-confirm-actions .btn-secondary{
  background:#f8fafc !important;
  color:#111827 !important;
  border:1px solid rgba(15,23,42,.12) !important;
}
body.light-theme .app-confirm-actions .btn-danger{
  background:linear-gradient(135deg,#ff3158,#ef4444) !important;
  color:#fff !important;
  border:0 !important;
}
@media(max-width:520px){
  body.admin-body .session-toolbar .btn-secondary,
  body.admin-body .session-toolbar .btn-danger,
  body.admin-body .device-session-actions .btn-danger,
  body.admin-body .device-session-actions .btn-secondary{
    min-height:40px !important;
    height:40px !important;
    font-size:12.5px !important;
  }
  .app-confirm-actions .btn-secondary,
  .app-confirm-actions .btn-danger{
    min-height:50px !important;
    height:50px !important;
    font-size:15px !important;
  }
}

/* v36: targeted light-mode cleanup requested by user
   Scope: settings title alignment, admin contacts readability, manual reaction grid.
   No admin tab/upload scroll rules are changed here. */

/* Settings page: title must stay on the right in RTL. */
body.settings-body .settings-top{
  direction: rtl !important;
  justify-content: flex-start !important;
  text-align: right !important;
}
body.settings-body .settings-top .brand{
  margin: 0 !important;
  margin-inline-start: 0 !important;
  margin-inline-end: 0 !important;
  text-align: right !important;
  width: auto !important;
}

/* Admin contacts in light mode: remove washed-out text and make controls coherent. */
body.light-theme.admin-body .admin-users-table .trow.user-row{
  background: linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;
  border-color: rgba(15,23,42,.11) !important;
  box-shadow: 0 10px 26px rgba(15,23,42,.07) !important;
  color: #0f172a !important;
}
body.light-theme.admin-body .admin-users-table .trow.user-row *{
  opacity: 1 !important;
}
body.light-theme.admin-body .admin-user-name{
  color:#0f172a !important;
  text-shadow:none !important;
}
body.light-theme.admin-body .admin-users-table .mono,
body.light-theme.admin-body .admin-users-table .meta{
  color:#475569 !important;
  opacity:1 !important;
}
body.light-theme.admin-body .admin-users-table .mono::before{
  color:#0f7490 !important;
  opacity:1 !important;
}
body.light-theme.admin-body .admin-role-pill{
  background:#eff6ff !important;
  border-color:rgba(37,99,235,.18) !important;
  color:#1d4ed8 !important;
  box-shadow:none !important;
}
body.light-theme.admin-body .admin-role-pill.is-admin{
  background:#fff7ed !important;
  border-color:rgba(249,115,22,.24) !important;
  color:#c2410c !important;
  box-shadow:0 8px 18px rgba(249,115,22,.08) !important;
}
body.light-theme.admin-body .admin-actions{
  border-top-color:rgba(15,23,42,.08) !important;
}
body.light-theme.admin-body .admin-actions .pill.small{
  background:#f8fafc !important;
  border-color:rgba(15,23,42,.12) !important;
  color:#0f172a !important;
  box-shadow:0 6px 16px rgba(15,23,42,.055) !important;
}
body.light-theme.admin-body .admin-actions [data-user-role-toggle]{
  background:linear-gradient(135deg,rgba(14,165,233,.16),rgba(37,99,235,.10)) !important;
  border-color:rgba(37,99,235,.22) !important;
  color:#075985 !important;
}
body.light-theme.admin-body .admin-actions [data-reset-user]{
  background:linear-gradient(135deg,rgba(139,92,246,.14),rgba(99,102,241,.09)) !important;
  border-color:rgba(99,102,241,.20) !important;
  color:#4c1d95 !important;
}
body.light-theme.admin-body .admin-actions .btn-danger,
body.light-theme.admin-body .btn-danger{
  color:#fff !important;
}

/* Manual channel views/reactions: prevent overlap in light mode and keep the grid neat. */
body.admin-body .admin-reaction-metrics-row{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  direction:rtl !important;
  align-items:stretch !important;
  justify-content:stretch !important;
}
body.admin-body .admin-reaction-metrics-row label{
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
  min-height:62px !important;
  padding:10px !important;
  overflow:hidden !important;
  direction:ltr !important;
  border-radius:16px !important;
}
body.admin-body .admin-reaction-metrics-row .admin-reaction-count{
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  min-height:42px !important;
  padding:0 8px !important;
  margin:0 !important;
  border-radius:14px !important;
  text-align:center !important;
  direction:ltr !important;
  font-size:18px !important;
  line-height:42px !important;
}
body.light-theme.admin-body .admin-reaction-metrics-row label{
  background:#f8fafc !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:0 8px 18px rgba(15,23,42,.045) !important;
  color:#0f172a !important;
}
body.light-theme.admin-body .admin-reaction-metrics-row .admin-reaction-count{
  background:#ffffff !important;
  border-color:rgba(15,23,42,.12) !important;
  color:#475569 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92) !important;
}
@media(max-width:520px){
  body.admin-body .admin-reaction-metrics-row{
    gap:8px !important;
  }
  body.admin-body .admin-reaction-metrics-row label{
    grid-template-columns:28px minmax(0,1fr) !important;
    gap:6px !important;
    min-height:58px !important;
    padding:8px !important;
  }
  body.admin-body .admin-reaction-metrics-row .admin-reaction-count{
    height:40px !important;
    min-height:40px !important;
    line-height:40px !important;
    font-size:17px !important;
  }
}

/* settings: dedicated subpages for notifications and app lock */
.settings-shortcut-icon[aria-hidden="true"]{
  font-size:24px;
  line-height:1;
}
.settings-subpage-card{
  padding-bottom:18px;
}
.settings-subpage-card .notification-settings,
.settings-subpage-card .app-lock-settings{
  margin-top:14px;
}
body.light-theme .settings-subpage-card .notification-status,
body.light-theme .settings-subpage-card .app-lock-status{
  background:#f8fbff;
}

/* Profile Jalali birth date field */
.jalali-date-field{display:block}
#birthDateJalali.input-error{
  border-color: rgba(239,68,68,.78) !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.12) !important;
}
body.light-theme #birthDateJalali.input-error{
  border-color: rgba(220,38,38,.72) !important;
  box-shadow: 0 0 0 3px rgba(220,38,38,.10) !important;
}

/* Profile Jalali birth date: inline 1359/12/02 */
.jalali-date-inline{
  display:flex;
  align-items:center;
  justify-content:stretch;
  gap:8px;
  width:100%;
  direction:ltr;
  padding:0;
  background:transparent;
  white-space:nowrap;
}
.jalali-date-inline .jalali-date-part{
  text-align:center !important;
  direction:ltr;
  font-family:inherit !important;
  min-width:0;
  height:54px;
  padding-left:10px;
  padding-right:10px;
}
.jalali-date-inline .jalali-date-year{flex:1.45 1 0;}
.jalali-date-inline .jalali-date-month,
.jalali-date-inline .jalali-date-day{flex:.9 1 0;}
.jalali-date-inline .jalali-date-sep{
  flex:0 0 auto;
  color:var(--muted);
  font-weight:900;
  font-size:24px;
  line-height:1;
  opacity:.95;
  padding:0 1px;
  transform:translateY(-1px);
}
.jalali-date-inline.input-error .jalali-date-part,
.jalali-date-part.input-error{
  border-color:rgba(255,45,85,.85) !important;
  box-shadow:0 0 0 3px rgba(255,45,85,.14) !important;
}
.birth-date-preview{
  margin-top:6px;
  font-weight:800;
}
body.light-theme .jalali-date-inline .jalali-date-sep{
  color:#526173;
}
@media (max-width:420px){
  .jalali-date-inline{gap:6px;}
  .jalali-date-inline .jalali-date-part{height:50px;padding-left:6px;padding-right:6px;}
  .jalali-date-inline .jalali-date-sep{font-size:21px;}
}


/* profile jalali birth date: keep save button visible right after date fields */
.profile-save-visible{
  margin-top:14px !important;
  margin-bottom:8px !important;
  width:100%;
  display:block;
}
.profile-save-result{
  min-height:22px;
  margin-top:4px;
}

/* profile jalali birth date: visible save button immediately under date row */
.profile-save-zone{
  display:block !important;
  width:100% !important;
  margin:12px 0 8px !important;
  clear:both !important;
  position:relative !important;
  z-index:5 !important;
}
.profile-save-zone .profile-save-visible,
#saveProfile.profile-save-visible{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:56px !important;
  margin:0 !important;
  visibility:visible !important;
  opacity:1 !important;
}
.profile-save-result{
  display:block !important;
  min-height:24px !important;
  margin:6px 0 0 !important;
  text-align:center !important;
}
.jalali-date-inline + .profile-save-zone{
  margin-top:12px !important;
}


/* profile: keep the save button fully visible on mobile */
body.admin-body .admin-shell{
  padding-bottom: calc(160px + env(safe-area-inset-bottom,0px)) !important;
}
body.admin-body .card{
  overflow: visible !important;
}
.profile-save-zone{
  display:block !important;
  width:100% !important;
  margin:10px 0 18px !important;
  padding:0 0 10px !important;
  clear:both !important;
  position:relative !important;
  z-index:20 !important;
}
.profile-save-zone .profile-save-visible,
#saveProfile.profile-save-visible,
button#saveProfile{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:50px !important;
  height:50px !important;
  line-height:50px !important;
  margin:0 !important;
  padding:0 18px !important;
  visibility:visible !important;
  opacity:1 !important;
  flex-shrink:0 !important;
}
.profile-save-result{
  display:block !important;
  min-height:22px !important;
  margin:6px 0 0 !important;
  text-align:center !important;
}


/* profile: save button stays visible beside Jalali birth-date title */
.birth-date-label-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  width:100% !important;
  margin:16px 0 10px !important;
  direction:rtl !important;
}
.birth-date-label-row .birth-date-main-label{
  margin:0 !important;
  flex:1 1 auto !important;
  min-width:0 !important;
}
.birth-date-label-row #saveProfile.profile-save-compact,
.birth-date-label-row button#saveProfile,
button#saveProfile.profile-save-compact{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  width:auto !important;
  min-width:112px !important;
  max-width:42% !important;
  height:44px !important;
  min-height:44px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 22px !important;
  border-radius:16px !important;
  white-space:nowrap !important;
  visibility:visible !important;
  opacity:1 !important;
}
.birth-date-label-row + .jalali-date-inline{
  margin-top:0 !important;
}
.birth-date-label-row ~ .profile-save-zone{
  display:none !important;
}
#saveRes.profile-save-result{
  min-height:22px !important;
  margin:8px 0 0 !important;
  text-align:center !important;
}
@media (max-width:360px){
  .birth-date-label-row{gap:8px !important;}
  .birth-date-label-row #saveProfile.profile-save-compact,
  .birth-date-label-row button#saveProfile,
  button#saveProfile.profile-save-compact{
    min-width:96px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 16px !important;
  }
}

/* profile Jalali final: save is the last option and page keeps scrolling */
body.profile-body{
  height:100dvh !important;
  overflow:hidden !important;
}
body.profile-body .admin-shell{
  height:100dvh !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  padding-bottom:calc(170px + env(safe-area-inset-bottom,0px)) !important;
  scroll-padding-top:96px !important;
}
body.profile-body .card{
  overflow:visible !important;
  padding-bottom:34px !important;
  margin-bottom:24px !important;
}
body.profile-body .birth-date-label-row{
  display:block !important;
  margin:16px 0 10px !important;
}
body.profile-body .birth-date-label-row .birth-date-main-label{
  display:block !important;
  margin:0 !important;
  width:100% !important;
}
body.profile-body .profile-save-zone,
body.profile-body .profile-save-zone.profile-save-final,
body.profile-body .birth-date-label-row ~ .profile-save-zone,
body.profile-body .birth-date-label-row ~ .profile-save-zone.profile-save-final{
  display:block !important;
  width:100% !important;
  clear:both !important;
  position:relative !important;
  z-index:30 !important;
  margin:18px 0 0 !important;
  padding:0 0 12px !important;
}
body.profile-body .profile-save-final #saveProfile,
body.profile-body .profile-save-zone #saveProfile,
body.profile-body button#saveProfile.profile-save-visible,
body.profile-body button#saveProfile{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  height:56px !important;
  min-height:56px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 18px !important;
  border-radius:18px !important;
  white-space:nowrap !important;
  visibility:visible !important;
  opacity:1 !important;
  flex:0 0 auto !important;
}
body.profile-body #saveRes.profile-save-result{
  display:block !important;
  min-height:24px !important;
  margin:10px 0 0 !important;
  text-align:center !important;
}
body.profile-body .bottom-nav{
  z-index:90 !important;
}


/* chat list optional tabs + settings toggle */
.chat-filter-tabs{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:calc(100% - 32px);
  height:auto;
  min-height:48px;
  margin:8px auto 6px;
  padding:6px;
  position:sticky;
  top:78px;
  z-index:140;
  border-radius:24px;
  border:1px solid rgba(56,189,248,.14);
  background:linear-gradient(180deg, rgba(15,34,48,.76), rgba(15,27,39,.62));
  box-shadow:0 14px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  scrollbar-width:none;
}
.chat-filter-tabs::-webkit-scrollbar{display:none}
.chat-filter-tabs .filter-btn{
  flex:1 1 0;
  min-width:max-content;
  padding:10px 12px;
  border-radius:18px;
  color:rgba(226,232,240,.68);
  font-size:13px;
  font-weight:900;
  line-height:1.25;
  text-align:center;
  transition:color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.chat-filter-tabs .filter-btn.active{
  color:#fff;
  background:linear-gradient(180deg, rgba(56,189,248,.30) 0%, rgba(56,189,248,.18) 100%);
  box-shadow:0 0 0 1px rgba(56,189,248,.20) inset, 0 12px 28px rgba(56,189,248,.18);
}
.chat-filter-tabs .filter-btn.active::after{display:none}
.chat-filter-tabs .filter-btn:active{transform:scale(.97)}
body.light-theme .chat-filter-tabs{
  background:rgba(255,255,255,.84);
  border-color:rgba(15,23,42,.08);
  box-shadow:0 14px 30px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.72);
}
body.light-theme .chat-filter-tabs .filter-btn{color:rgba(15,23,42,.58)}
body.light-theme .chat-filter-tabs .filter-btn.active{
  color:#fff;
  background:linear-gradient(180deg, rgba(56,189,248,.30) 0%, rgba(56,189,248,.18) 100%);
  box-shadow:0 0 0 1px rgba(56,189,248,.20) inset, 0 12px 28px rgba(56,189,248,.16);
}
.settings-toggle-card{position:relative;cursor:pointer;padding-left:16px;padding-right:16px}
.settings-toggle-card .settings-shortcut-content{padding-inline-end:8px}
.settings-toggle-card.is-off .settings-shortcut-title{opacity:.78}
.settings-toggle-card.is-off .settings-shortcut-sub{opacity:.72}
.chat-tabs-settings-icon{color:#38bdf8}
.settings-toggle-switch{
  margin-inline-start:auto;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  direction:ltr;
}
.settings-toggle-switch input{position:absolute;opacity:0;pointer-events:none}
.settings-toggle-track{
  width:56px;
  height:32px;
  border-radius:999px;
  position:relative;
  display:block;
  background:rgba(148,163,184,.28);
  border:1px solid rgba(148,163,184,.22);
  transition:background .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.settings-toggle-thumb{
  position:absolute;
  top:3px;
  left:3px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.22);
  transition:transform .22s ease;
}
.settings-toggle-switch input:checked + .settings-toggle-track{
  background:linear-gradient(180deg, rgba(56,189,248,.30) 0%, rgba(56,189,248,.18) 100%);
  border-color:rgba(56,189,248,.38);
  box-shadow:0 0 0 1px rgba(56,189,248,.18) inset, 0 8px 20px rgba(56,189,248,.18);
}
.settings-toggle-switch input:checked + .settings-toggle-track .settings-toggle-thumb{transform:translateX(24px)}
body.light-theme .settings-toggle-card{background:#fff}
body.light-theme .chat-tabs-settings-icon{color:#38bdf8}
body.light-theme .settings-toggle-track{background:rgba(15,23,42,.10);border-color:rgba(15,23,42,.10)}
body.light-theme .settings-toggle-switch input:checked + .settings-toggle-track{background:linear-gradient(180deg, rgba(56,189,248,.30) 0%, rgba(56,189,248,.18) 100%);border-color:rgba(56,189,248,.30);box-shadow:0 0 0 1px rgba(56,189,248,.16) inset, 0 8px 20px rgba(56,189,248,.14)}
@media (max-width:380px){
  .chat-filter-tabs{width:calc(100% - 24px);gap:6px;padding:5px;margin-top:6px}
  .chat-filter-tabs .filter-btn{font-size:12px;padding:9px 9px}
  .settings-toggle-track{width:52px;height:30px}
  .settings-toggle-thumb{width:22px;height:22px}
  .settings-toggle-switch input:checked + .settings-toggle-track .settings-toggle-thumb{transform:translateX(22px)}
}


/* v16: compact chat tabs + swipe actions for chat rows */
.chat-filter-tabs{
  margin:0 auto 4px !important;
  top:54px !important;
}
.room-item{
  position:relative;
  will-change:transform;
}
.room-item.room-swipe-active{
  transition:none !important;
  z-index:3;
}
.room-item.room-swipe-active::before{
  content:'';
  position:absolute;
  inset:7px 12px;
  border-radius:22px;
  opacity:.16;
  pointer-events:none;
  z-index:-1;
  background:rgba(14,165,233,.9);
  box-shadow:0 10px 24px rgba(14,165,233,.18);
}
.room-item.room-swipe-delete::before{
  background:rgba(244,63,94,.95);
  box-shadow:0 10px 24px rgba(244,63,94,.18);
}
.room-item.room-swipe-archive::after,
.room-item.room-swipe-delete::after{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  min-width:58px;
  height:30px;
  padding:0 10px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.10);
}
.room-item.room-swipe-archive::after{
  content:'آرشیو';
  left:14px;
  color:#fde68a;
  background:rgba(120,80,10,.35);
}
.room-item.room-swipe-delete::after{
  content:'حذف';
  right:14px;
  color:#fecdd3;
  background:rgba(127,29,29,.45);
}
@media (max-width:380px){
  .chat-filter-tabs{margin-top:0 !important;}
}

/* Telegram-style main header and full-screen search (added) */
.main-header{
  direction:ltr;
  position:relative;
  z-index:9000;
  height:64px;
  min-height:64px;
  padding:0 28px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-direction:row !important;
  overflow:visible;
  background:linear-gradient(180deg, rgba(26,39,53,0.99) 0%, rgba(25,38,52,0.99) 100%) !important;
  border-bottom:1px solid rgba(255,255,255,0.018);
  box-shadow:0 1px 0 rgba(255,255,255,0.01) inset;
}
.main-header-brand{
  flex:1 1 auto;
  min-width:0;
  color:#f8fbff;
  font-size:clamp(24px, 4.2vw, 34px);
  font-weight:900;
  letter-spacing:-0.8px;
  line-height:1;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  -webkit-text-stroke:.18px rgba(248,251,255,.35);
  transition:opacity .16s ease, transform .16s ease;
}
.main-header-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  position:relative;
  direction:ltr;
  transition:opacity .16s ease, transform .16s ease;
}
.main-header-icon{
  width:48px;
  height:48px;
  padding:6px;
  color:#f5f8fc;
  border-radius:999px;
}
.main-header-icon:hover{background:rgba(255,255,255,.055)}
.main-header-svg{
  width:32px;
  height:32px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2.3;
  stroke-linecap:round;
  stroke-linejoin:round;
  overflow:visible;
}
.main-header-svg.dots-svg{
  width:31px;
  height:31px;
  fill:currentColor;
  stroke:none;
}
.main-header-actions #mainMenuPopup{
  top:54px;
  right:0;
  direction:rtl;
}
.main-header.main-search-open .main-header-brand,
.main-header.main-search-open .main-header-actions{
  opacity:0;
  pointer-events:none;
  transform:translateY(-3px);
}
.main-search-layer{
  position:absolute;
  inset:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:8px 28px;
  direction:ltr;
  background:linear-gradient(180deg, rgba(26,39,53,0.99) 0%, rgba(25,38,52,0.99) 100%);
}
.main-search-layer[hidden]{display:none !important;}
.main-search-close{
  flex:0 0 auto;
  width:48px;
  height:48px;
  color:rgba(214,224,235,.86);
  border-radius:999px;
}
.main-search-close:hover{background:rgba(255,255,255,.055)}
.main-search-close-svg{
  width:30px;
  height:30px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2.15;
  stroke-linecap:round;
}
.main-search-field{
  flex:1 1 auto;
  min-width:0;
  height:50px;
  border-radius:999px;
  display:flex;
  flex-direction:row-reverse;
  align-items:center;
  gap:12px;
  padding:0 18px;
  background:linear-gradient(180deg, rgba(34,52,68,.97) 0%, rgba(31,49,64,.97) 100%);
  border:1px solid rgba(154,177,198,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035), 0 10px 30px rgba(3,8,15,.10);
  cursor:text;
}
.main-search-field-icon{
  flex:0 0 auto;
  width:30px;
  height:30px;
  color:rgba(201,213,225,.78);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.main-search-field-icon svg{
  width:100%;
  height:100%;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2.15;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.main-search-field .live-search,
body.light-theme .main-search-field .live-search{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  height:100%;
  border:0 !important;
  outline:0 !important;
  border-radius:0;
  padding:0;
  margin:0;
  background:transparent !important;
  box-shadow:none !important;
  color:#e8eef6;
  font-family:var(--font);
  font-size:20px;
  font-weight:700;
  line-height:1;
  text-align:right;
  direction:rtl;
  appearance:none;
  -webkit-appearance:none;
}
.main-search-field .live-search::placeholder{color:rgba(204,215,226,.70);opacity:1;font-weight:700;}
.main-search-field .live-search::-webkit-search-decoration,
.main-search-field .live-search::-webkit-search-cancel-button{display:none;}
.main-search-results{
  position:fixed;
  top:64px;
  left:0;
  right:0;
  bottom:0;
  z-index:8990;
  max-height:none;
  overflow-y:auto;
  overscroll-behavior:contain;
  border:0;
  border-radius:0;
  background:#1A2735;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  direction:rtl;
  padding:0 0 calc(18px + env(safe-area-inset-bottom, 0px));
}
body.main-search-active .bottom-nav{display:none !important;}
body.main-search-active .stories-pull-hint,
body.main-search-active .stories-rail-wrap,
body.main-search-active .chat-filter-tabs{visibility:hidden;pointer-events:none;}
.main-search-panel-inner{min-height:100%;background:#1A2735;}
.main-search-recent-rail{
  display:flex;
  flex-direction:row;
  gap:22px;
  overflow-x:auto;
  scrollbar-width:none;
  padding:22px 20px 16px;
  background:linear-gradient(180deg, rgba(29,43,57,1) 0%, rgba(27,41,55,1) 100%);
  border-bottom:1px solid rgba(255,255,255,.035);
}
.main-search-recent-rail::-webkit-scrollbar{display:none;}
.main-search-chip{
  flex:0 0 92px;
  width:92px;
  border:0;
  background:transparent;
  color:#f8fbff;
  padding:0;
  font-family:var(--font);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  cursor:pointer;
}
.main-search-chip-avatar{
  position:relative;
  width:72px;
  height:72px;
  border-radius:50%;
  overflow:hidden;
  background:linear-gradient(135deg, rgba(42,171,238,.96), rgba(36,142,210,.90));
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:30px;
  font-weight:900;
  box-shadow:0 8px 20px rgba(3,8,15,.15);
}
.main-search-chip-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.main-search-chip-title{
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:14px;
  font-weight:750;
  line-height:1.4;
  text-align:center;
  direction:auto;
}
.main-search-unread{
  position:absolute;
  top:-2px;
  left:-2px;
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  background:#4eb5f6;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:900;
  border:2px solid #1b2b3a;
  box-shadow:0 6px 16px rgba(0,0,0,.18);
}
.main-search-section-bar{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:0 24px;
  background:#111c27;
  border-bottom:1px solid rgba(255,255,255,.025);
  color:rgba(180,194,209,.80);
  font-size:18px;
  font-weight:800;
}
.main-search-section-title{white-space:nowrap;}
.main-search-clear{
  border:0;
  background:transparent;
  color:rgba(180,194,209,.80);
  font-family:var(--font);
  font-size:17px;
  font-weight:800;
  padding:10px 0;
  cursor:pointer;
}
.main-search-clear:active{transform:scale(.98);}
.main-search-empty{
  padding:46px 24px;
  color:rgba(180,194,209,.76);
  text-align:center;
  line-height:1.9;
  font-size:15px;
  font-weight:700;
}
.main-search-results .ls-item{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:14px;
  min-height:78px;
  padding:12px 24px;
  border-bottom:1px solid rgba(255,255,255,.035);
  background:transparent;
  cursor:pointer;
  direction:rtl;
}
.main-search-results .ls-item:hover{background:rgba(255,255,255,.045);}
.main-search-results .ls-item:active{background:rgba(255,255,255,.065);}
.main-search-results .ls-avatar{
  flex:0 0 auto;
  width:58px;
  height:58px;
  border-radius:50%;
  background:linear-gradient(135deg, rgba(42,171,238,.96), rgba(33,130,203,.94));
  color:#fff;
  font-size:22px;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.main-search-results .ls-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.main-search-results .ls-meta{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  text-align:right;
}
.main-search-results .ls-title{
  width:100%;
  color:#f7fbff;
  font-size:18px;
  font-weight:900;
  line-height:1.45;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.main-search-results .ls-sub{
  width:100%;
  color:rgba(170,185,201,.78);
  font-size:14px;
  font-weight:700;
  line-height:1.45;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.main-search-results .ls-badge{
  flex:0 0 auto;
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  background:#4eb5f6;
  color:#fff;
  font-size:13px;
  font-weight:900;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
body.light-theme .main-header,
body.light-theme .main-search-layer{
  background:#ffffff !important;
  border-bottom-color:rgba(15,23,42,.08);
}
body.light-theme .main-header-brand,
body.light-theme .main-header-icon{color:#17212f;}
body.light-theme .main-search-close{color:#5d6b7a;}
body.light-theme .main-search-field{
  background:#eef4fb;
  border-color:rgba(15,23,42,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
body.light-theme .main-search-field-icon{color:#6a7a8b;}
body.light-theme .main-search-field .live-search{color:#17212f;}
body.light-theme .main-search-field .live-search::placeholder{color:#7c8a9a;}
body.light-theme .main-search-results,
body.light-theme .main-search-panel-inner{background:#fff;}
body.light-theme .main-search-recent-rail{background:#f5f8fc;border-bottom-color:rgba(15,23,42,.07);}
body.light-theme .main-search-chip{color:#17212f;}
body.light-theme .main-search-section-bar{background:#eef3f8;color:#718093;border-bottom-color:rgba(15,23,42,.07);}
body.light-theme .main-search-clear{color:#718093;}
body.light-theme .main-search-empty{color:#718093;}
body.light-theme .main-search-results .ls-item{border-bottom-color:rgba(15,23,42,.07);}
body.light-theme .main-search-results .ls-title{color:#17212f;}
body.light-theme .main-search-results .ls-sub{color:#718093;}
body.light-theme .main-search-results .ls-item:hover{background:rgba(15,23,42,.045);}
@media (max-width:520px){
  .main-header{height:60px;min-height:60px;padding:0 18px !important;}
  .main-header-brand{font-size:clamp(24px, 8.6vw, 32px);}
  .main-header-actions{gap:15px;}
  .main-header-icon{width:44px;height:44px;padding:5px;}
  .main-header-svg{width:31px;height:31px;}
  .main-header-svg.dots-svg{width:30px;height:30px;}
  .main-search-layer{padding:7px 10px 7px 16px;gap:6px;}
  .main-search-close{width:46px;height:46px;}
  .main-search-field{height:48px;padding:0 16px;gap:10px;}
  .main-search-field .live-search{font-size:18px;}
  .main-search-results{top:60px;}
  .main-search-recent-rail{gap:18px;padding:20px 16px 15px;}
  .main-search-chip{flex-basis:82px;width:82px;}
  .main-search-chip-avatar{width:66px;height:66px;font-size:27px;}
  .main-search-section-bar{min-height:50px;padding:0 18px;font-size:17px;}
  .main-search-clear{font-size:16px;}
  .main-search-results .ls-item{min-height:76px;padding:11px 16px;}
  .main-search-results .ls-avatar{width:56px;height:56px;}
  .main-search-results .ls-title{font-size:17px;}
}

/* Undo snackbar for deleted chats (added) */
.room-undo-toast{
  position:fixed;
  left:50%;
  bottom:calc(92px + env(safe-area-inset-bottom, 0px));
  width:min(430px, calc(100vw - 24px));
  min-height:56px;
  transform:translate(-50%, 18px) scale(.98);
  opacity:0;
  pointer-events:none;
  z-index:14000;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px 14px;
  border-radius:18px;
  background:rgba(16,24,36,.96);
  color:#fff;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 44px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  overflow:hidden;
  transition:opacity .18s ease, transform .18s ease;
  direction:rtl;
}
.room-undo-toast.show{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%, 0) scale(1);
}
body.chat-open .room-undo-toast{bottom:calc(24px + env(safe-area-inset-bottom, 0px));}
.room-undo-icon{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#ffb4b4;
  background:rgba(239,68,68,.13);
}
.room-undo-icon svg{width:20px;height:20px;display:block;}
.room-undo-message{
  flex:1 1 auto;
  min-width:0;
  color:#f8fafc;
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.room-undo-action{
  flex:0 0 auto;
  border:0;
  background:rgba(42,171,238,.16);
  color:#62caff;
  border-radius:13px;
  min-height:36px;
  padding:8px 14px;
  font-family:var(--font);
  font-size:14px;
  font-weight:950;
  cursor:pointer;
}
.room-undo-action:active{transform:scale(.97);}
.room-undo-progress{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  background:linear-gradient(90deg, rgba(42,171,238,.95), rgba(56,189,248,.95));
  transform-origin:right center;
  animation:roomUndoProgress var(--undo-duration, 6500ms) linear forwards;
}
@keyframes roomUndoProgress{from{transform:scaleX(1);}to{transform:scaleX(0);}}
body.light-theme .room-undo-toast{background:rgba(255,255,255,.98);color:#17212f;border-color:rgba(15,23,42,.10);box-shadow:0 18px 44px rgba(15,23,42,.16)}
body.light-theme .room-undo-message{color:#17212f;}

/* Search bar capsule refinement: close + input + search icon inside one Telegram-like pill */
.main-search-layer{
  inset:8px 28px;
  padding:0 14px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(34,52,68,.97) 0%, rgba(31,49,64,.97) 100%);
  border:1px solid rgba(154,177,198,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035), 0 10px 30px rgba(3,8,15,.10);
}
.main-search-field{
  height:100%;
  padding:0 4px 0 8px;
  background:transparent;
  border:0;
  box-shadow:none;
}
.main-search-close{width:42px;height:42px;}
body.light-theme .main-search-layer{background:#eef4fb;border-color:rgba(15,23,42,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
body.light-theme .main-search-field{background:transparent;border:0;box-shadow:none;}
@media (max-width:520px){
  .main-search-layer{inset:6px 10px 6px 14px;padding:0 12px;}
  .main-search-close{width:40px;height:40px;}
  .main-search-field{height:100%;padding:0 2px 0 6px;}
}

/* Telegram header/search polish: smaller, cleaner controls + vertically centered search text */
.main-header{
  height:58px;
  min-height:58px;
  padding:0 22px !important;
}
.main-header-brand{
  font-size:clamp(21px, 3.2vw, 27px);
  font-weight:850;
  letter-spacing:-0.35px;
  line-height:1.18;
  -webkit-text-stroke:0;
}
.main-header-actions{
  gap:12px;
}
.main-header-icon{
  width:42px;
  height:42px;
  padding:8px;
}
.main-header-svg{
  width:26px;
  height:26px;
  stroke-width:2.05;
}
.main-header-svg.dots-svg{
  width:25px;
  height:25px;
}
.main-header-actions #mainMenuPopup{
  top:48px;
}
.main-search-layer{
  inset:7px 20px;
  padding:0 12px;
  gap:7px;
  align-items:center;
}
.main-search-close{
  width:38px;
  height:38px;
  padding:7px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.main-search-close-svg{
  width:24px;
  height:24px;
  stroke-width:2.05;
}
.main-search-field{
  height:100%;
  min-height:0;
  align-items:center;
  gap:9px;
  padding:0 3px 0 6px;
}
.main-search-field-icon{
  width:25px;
  height:25px;
}
.main-search-field-icon svg{
  stroke-width:2.05;
}
.main-search-field .live-search,
body.light-theme .main-search-field .live-search{
  height:42px !important;
  min-height:42px !important;
  line-height:42px !important;
  padding:0 !important;
  margin:0 !important;
  font-size:17px !important;
  font-weight:700;
  transform:translateY(1px);
  display:block;
}
.main-search-results{
  top:58px;
}
@media (max-width:520px){
  .main-header{
    height:56px;
    min-height:56px;
    padding:0 16px !important;
  }
  .main-header-brand{
    font-size:clamp(20px, 6.8vw, 26px);
    font-weight:850;
    letter-spacing:-0.25px;
  }
  .main-header-actions{
    gap:10px;
  }
  .main-header-icon{
    width:39px;
    height:39px;
    padding:7px;
  }
  .main-header-svg{
    width:24px;
    height:24px;
    stroke-width:2;
  }
  .main-header-svg.dots-svg{
    width:23px;
    height:23px;
  }
  .main-header-actions #mainMenuPopup{
    top:46px;
  }
  .main-search-layer{
    inset:6px 12px;
    padding:0 11px;
    gap:6px;
  }
  .main-search-close{
    width:36px;
    height:36px;
    padding:7px;
  }
  .main-search-close-svg{
    width:22px;
    height:22px;
  }
  .main-search-field{
    padding:0 2px 0 5px;
    gap:8px;
  }
  .main-search-field-icon{
    width:23px;
    height:23px;
  }
  .main-search-field .live-search,
  body.light-theme .main-search-field .live-search{
    height:40px !important;
    min-height:40px !important;
    line-height:40px !important;
    font-size:16px !important;
    transform:translateY(1px);
  }
  .main-search-results{
    top:56px;
  }
}

/* Final micro-tuning for Telegram-like main header: requested alignment and smaller controls */
.main-header{
  padding-left:34px !important;
  padding-right:22px !important;
}
.main-header-brand{
  font-size:clamp(19px, 2.8vw, 24px);
  font-weight:820;
  letter-spacing:-0.28px;
}
.main-header-actions{
  gap:6px;
}
.main-header-icon{
  width:36px;
  height:36px;
  padding:7px;
}
.main-header-svg{
  width:22px;
  height:22px;
  stroke-width:2;
}
.main-header-svg.dots-svg{
  width:21px;
  height:21px;
}
@media (max-width:520px){
  .main-header{
    height:56px;
    min-height:56px;
    padding-left:35px !important;
    padding-right:18px !important;
  }
  .main-header-brand{
    font-size:clamp(18px, 5.8vw, 22px);
    font-weight:820;
    letter-spacing:-0.18px;
  }
  .main-header-actions{
    gap:0;
  }
  .main-header-icon{
    width:32px;
    height:36px;
    padding:6px;
  }
  .main-header-svg{
    width:20px;
    height:20px;
    stroke-width:1.95;
  }
  .main-header-svg.dots-svg{
    width:20px;
    height:20px;
  }
  #mainSearchBtn{
    transform:translateX(7px);
  }
}


/* Header call buttons wired to iranchat-call-module */
.chat-call-btn {
  color: var(--primary, #2aa8ff);
  background: rgba(42, 168, 255, .10);
  border: 1px solid rgba(42, 168, 255, .16);
  margin-inline-start: 4px;
}
.chat-call-btn:hover,
.chat-call-btn:focus-visible {
  background: rgba(42, 168, 255, .18);
  color: var(--primary, #2aa8ff);
}
.chat-call-svg {
  width: 21px;
  height: 21px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 420px) {
  .chat-call-btn {
    width: 34px;
    height: 34px;
    margin-inline-start: 2px;
  }
  .chat-call-svg {
    width: 19px;
    height: 19px;
  }
}


/* Compact call picker: one header button opens audio/video choices */
.chat-call-picker{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-inline-start:4px;
  z-index:30;
}
.chat-call-main-btn,
.chat-call-float-btn{
  border:0;
  outline:0;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#0ea5ff;
  background:rgba(14,165,255,.12);
  box-shadow:inset 0 0 0 1px rgba(14,165,255,.22), 0 10px 24px rgba(0,0,0,.18);
  transition:transform .22s ease, opacity .22s ease, background .22s ease, box-shadow .22s ease;
  -webkit-tap-highlight-color:transparent;
}
.chat-call-main-btn{
  width:42px;
  height:42px;
  border-radius:50%;
}
.chat-call-main-btn .chat-call-svg,
.chat-call-float-btn .chat-call-svg{
  width:22px;
  height:22px;
  display:block;
  fill:currentColor;
  stroke:none;
}
.chat-call-main-btn:hover,
.chat-call-main-btn:focus-visible{
  transform:translateY(-1px) scale(1.04);
  background:rgba(14,165,255,.18);
}
.chat-call-float-menu{
  position:absolute;
  top:52px;
  left:50%;
  width:118px;
  height:58px;
  transform:translateX(-50%);
  pointer-events:none;
  z-index:999;
}
.chat-call-float-menu::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:999px;
  background:rgba(10,24,38,.78);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 18px 42px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.08);
  opacity:0;
  transform:scale(.74);
  transition:.24s ease;
}
.chat-call-float-btn{
  position:absolute;
  top:7px;
  width:44px;
  height:44px;
  border-radius:50%;
  opacity:0;
  transform:translateY(-10px) scale(.55);
}
.chat-call-float-btn.audio{
  right:8px;
  color:#38bdf8;
}
.chat-call-float-btn.video{
  left:8px;
  color:#22c55e;
}
.chat-call-picker.is-open .chat-call-float-menu{
  pointer-events:auto;
}
.chat-call-picker.is-open .chat-call-float-menu::before{
  opacity:1;
  transform:scale(1);
}
.chat-call-picker.is-open .chat-call-float-btn{
  opacity:1;
  transform:translateY(0) scale(1);
}
.chat-call-picker.is-open .chat-call-float-btn.video{
  transition-delay:.04s;
}
.chat-call-picker.is-open .chat-call-main-btn{
  background:rgba(14,165,255,.22);
  box-shadow:inset 0 0 0 1px rgba(14,165,255,.35), 0 0 0 8px rgba(14,165,255,.08), 0 14px 30px rgba(0,0,0,.24);
}
.chat-call-float-btn:hover,
.chat-call-float-btn:focus-visible{
  transform:translateY(-2px) scale(1.06) !important;
  background:rgba(255,255,255,.12);
}
.chat-call-picker[hidden]{
  display:none !important;
}
@media (max-width:420px){
  .chat-call-picker{
    margin-inline-start:2px;
  }
  .chat-call-main-btn{
    width:38px;
    height:38px;
  }
  .chat-call-main-btn .chat-call-svg,
  .chat-call-float-btn .chat-call-svg{
    width:20px;
    height:20px;
  }
  .chat-call-float-menu{
    top:48px;
  }
}


/* =========================================================
   Story viewer + compact admin header fixes
   Added after call picker polish to override older duplicated rules.
   ========================================================= */
body.story-open{
  overflow:hidden !important;
}
body.story-open #mainHeader,
body.story-open .main-header,
body.story-open #mainHeaderActions,
body.story-open #mainMenuPopup,
body.story-open #mainSearchLayer,
body.story-open #liveSearchResults{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateY(-110%) !important;
}
body.story-open #storyViewer,
body.story-open .story-viewer{
  z-index:30000 !important;
  inset:0 !important;
  width:100vw !important;
  height:100dvh !important;
  max-width:none !important;
  max-height:none !important;
}
body.story-open .story-stage{
  inset:0 !important;
}
body.story-open .story-media,
body.story-open .story-media-layer{
  width:100% !important;
  height:100% !important;
}

body.admin-body .admin-shell{
  padding-top:8px !important;
  scroll-padding-top:150px !important;
}
body.admin-body .admin-top{
  top:6px !important;
  min-height:50px !important;
  height:auto !important;
  padding:7px 12px !important;
  margin-bottom:8px !important;
  border-radius:18px !important;
  box-shadow:0 12px 30px rgba(2,6,23,.26), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
body.admin-body .admin-top .brand{
  font-size:18px !important;
  line-height:1.2 !important;
  letter-spacing:-.35px !important;
}
body.admin-body .admin-dashboard-tabs{
  top:64px !important;
  padding:8px !important;
  gap:7px !important;
  margin-bottom:12px !important;
  border-radius:20px !important;
}
body.admin-body .admin-tab{
  min-height:40px !important;
  padding:8px 8px !important;
  border-radius:15px !important;
  font-size:12.25px !important;
}
body.admin-body .admin-tab span{
  min-width:21px !important;
  height:19px !important;
  font-size:10.5px !important;
}
body.admin-body .admin-panel{
  scroll-margin-top:154px !important;
}
body.admin-body .admin-main-back-btn{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  border-radius:14px !important;
}
body.admin-body .admin-main-back-btn svg{
  width:20px !important;
  height:20px !important;
}
@media (max-width:720px){
  body.admin-body .admin-shell{
    padding-top:6px !important;
    scroll-padding-top:142px !important;
  }
  body.admin-body .admin-top{
    top:5px !important;
    min-height:48px !important;
    padding:6px 10px !important;
    border-radius:17px !important;
  }
  body.admin-body .admin-top .brand{
    font-size:17px !important;
  }
  body.admin-body .admin-dashboard-tabs{
    top:58px !important;
    padding:7px !important;
    gap:6px !important;
    border-radius:18px !important;
  }
  body.admin-body .admin-tab{
    min-height:38px !important;
    padding:7px 7px !important;
    font-size:11.8px !important;
    border-radius:14px !important;
  }
  body.admin-body .admin-main-back-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    border-radius:13px !important;
  }
  body.admin-body .admin-main-back-btn svg{
    width:19px !important;
    height:19px !important;
  }
}

/* Header polish v31: truly smaller title, keep icon sizes unchanged */
.main-header-brand{
  font-size:clamp(20px, 3.1vw, 26px) !important;
  letter-spacing:-0.18px !important;
  -webkit-text-stroke:0 transparent !important;
}
.main-header-actions{
  gap:30px !important;
}
@media (max-width:520px){
  .main-header-brand{
    font-size:clamp(19px, 5.2vw, 23px) !important;
    letter-spacing:-0.12px !important;
  }
  .main-header-actions{
    gap:28px !important;
  }
}

/* Header polish v32: one-step smaller title and closer header actions */
.main-header-brand{
  font-size:clamp(18px, 2.7vw, 24px) !important;
  font-weight:820 !important;
  letter-spacing:-0.12px !important;
  -webkit-text-stroke:0 transparent !important;
}
.main-header-actions{
  gap:22px !important;
}
@media (max-width:520px){
  .main-header-brand{
    font-size:clamp(17px, 4.7vw, 21px) !important;
    font-weight:820 !important;
    letter-spacing:-0.08px !important;
  }
  .main-header-actions{
    gap:20px !important;
  }
}

/* Call header main button v33: plain white phone icon only.
   Floating audio/video choice buttons are intentionally left unchanged. */
.chat-call-main-btn,
.chat-call-picker.is-open .chat-call-main-btn,
.chat-call-main-btn:hover,
.chat-call-main-btn:focus,
.chat-call-main-btn:active{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
  color: #ffffff !important;
  transform: none !important;
}
.chat-call-main-btn::before,
.chat-call-main-btn::after{
  content: none !important;
  display: none !important;
}
.chat-call-main-btn svg{
  color: #ffffff !important;
  fill: currentColor !important;
  filter: none !important;
}


.msg-row.price-list-message .msg-container{
  max-width: min(99.4%, 980px) !important;
  width: min(99.4%, 980px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  font-size: 10px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 5px !important;
}
.msg-bubble.price-list-message{
  padding: 5px 7px 5px !important;
  font-size: 12.2px !important;
  line-height: 1.12 !important;
  border-radius: 14px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.12 !important;
  margin-bottom: 0 !important;
  letter-spacing: -0.18px !important;
  word-spacing: -1px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 2px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 3px !important;
  margin-bottom: 1px !important;
  gap: 4px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 20px !important;
  padding: 2px 6px !important;
  font-size: 10.8px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 10.2px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 3px !important;
  margin-right: 6px !important;
  font-size: 8.8px !important;
  gap: 3px !important;
}
.msg-bubble.price-list-message::before{
  height: 34% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-left: -18px !important;
    margin-right: -18px !important;
    width: calc(100% + 36px) !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 33px) !important;
    max-width: calc(100% - 33px) !important;
    flex: 0 0 calc(100% - 33px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
  }
  .msg-bubble.price-list-message{
    padding: 4px 6px 4px !important;
    font-size: 11.4px !important;
    line-height: 1.08 !important;
    border-radius: 12px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.08 !important;
    letter-spacing: -0.22px !important;
    word-spacing: -1.4px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 18px !important;
    padding: 2px 5px !important;
    font-size: 10px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 2px !important;
    font-size: 8.2px !important;
  }
}


.msg-row.price-list-message .msg-container{
  max-width: min(99.6%, 980px) !important;
  width: min(99.6%, 980px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  font-size: 10px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 4px !important;
}
.msg-bubble.price-list-message{
  padding: 7px 9px 7px !important;
  font-size: 13.8px !important;
  line-height: 1.18 !important;
  border-radius: 15px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.18 !important;
  margin-bottom: 0 !important;
  letter-spacing: -0.08px !important;
  word-spacing: -0.5px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 2px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 5px !important;
  margin-bottom: 2px !important;
  gap: 5px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 22px !important;
  padding: 3px 7px !important;
  font-size: 11.8px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 11.2px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 4px !important;
  margin-right: 7px !important;
  font-size: 9.3px !important;
  gap: 3px !important;
}
.msg-bubble.price-list-message::before{
  height: 36% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-left: -18px !important;
    margin-right: -18px !important;
    width: calc(100% + 36px) !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 30px) !important;
    max-width: calc(100% - 30px) !important;
    flex: 0 0 calc(100% - 30px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
  }
  .msg-bubble.price-list-message{
    padding: 6px 8px 6px !important;
    font-size: 13px !important;
    line-height: 1.13 !important;
    border-radius: 13px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.13 !important;
    letter-spacing: -0.12px !important;
    word-spacing: -0.8px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 20px !important;
    padding: 2px 6px !important;
    font-size: 10.8px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 3px !important;
    font-size: 8.8px !important;
  }
}


.msg-row.price-list-message .msg-container{
  max-width: min(94%, 900px) !important;
  width: min(94%, 900px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  font-size: 11px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 6px !important;
}
.msg-bubble.price-list-message{
  padding: 8px 10px 7px !important;
  font-size: 14.6px !important;
  line-height: 1.17 !important;
  border-radius: 16px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.17 !important;
  margin-bottom: 0 !important;
  letter-spacing: -0.05px !important;
  word-spacing: -0.35px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 3px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 5px !important;
  margin-bottom: 2px !important;
  gap: 5px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 23px !important;
  padding: 3px 7px !important;
  font-size: 11.8px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 11.2px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 4px !important;
  margin-right: 7px !important;
  font-size: 9.4px !important;
  gap: 3px !important;
}
.msg-bubble.price-list-message::before{
  height: 36% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 58px) !important;
    max-width: calc(100% - 58px) !important;
    flex: 0 0 calc(100% - 58px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 92% !important;
    max-width: 92% !important;
    flex-basis: 92% !important;
  }
  .msg-bubble.price-list-message{
    padding: 7px 9px 6px !important;
    font-size: 13.9px !important;
    line-height: 1.12 !important;
    border-radius: 14px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.12 !important;
    letter-spacing: -0.08px !important;
    word-spacing: -0.55px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 21px !important;
    padding: 2px 6px !important;
    font-size: 10.8px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 3px !important;
    font-size: 8.8px !important;
  }
}


.msg-date-separator + .msg-row.price-list-message{
  margin-top: -54px !important;
}
.msg-row.price-list-message .msg-container{
  max-width: min(92%, 880px) !important;
  width: min(92%, 880px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  font-size: 11px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 7px !important;
}
.msg-bubble.price-list-message{
  padding: 10px 11px 8px !important;
  font-size: 15.8px !important;
  line-height: 1.24 !important;
  border-radius: 17px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.24 !important;
  margin-bottom: 1px !important;
  letter-spacing: 0 !important;
  word-spacing: -0.2px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 4px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 7px !important;
  margin-bottom: 3px !important;
  gap: 6px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 24px !important;
  padding: 4px 8px !important;
  font-size: 12.2px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 11.8px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 5px !important;
  margin-right: 8px !important;
  font-size: 9.6px !important;
  gap: 4px !important;
}
.msg-bubble.price-list-message::before{
  height: 36% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-top: -44px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
  .msg-date-separator + .msg-row.price-list-message{
    margin-top: -50px !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 64px) !important;
    max-width: calc(100% - 64px) !important;
    flex: 0 0 calc(100% - 64px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 91% !important;
    max-width: 91% !important;
    flex-basis: 91% !important;
  }
  .msg-bubble.price-list-message{
    padding: 9px 10px 8px !important;
    font-size: 15px !important;
    line-height: 1.19 !important;
    border-radius: 15px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.19 !important;
    letter-spacing: -0.02px !important;
    word-spacing: -0.3px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 23px !important;
    padding: 3px 7px !important;
    font-size: 11.3px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 4px !important;
    font-size: 9px !important;
  }
}


.msg-date-separator + .msg-row.price-list-message{
  margin-top: -18px !important;
}
.msg-row.price-list-message .msg-container{
  max-width: min(93%, 890px) !important;
  width: min(93%, 890px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  font-size: 11px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 7px !important;
}
.msg-bubble.price-list-message{
  padding: 8px 10px 7px !important;
  font-size: 14.8px !important;
  line-height: 1.16 !important;
  border-radius: 16px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.16 !important;
  margin-bottom: 1px !important;
  letter-spacing: -0.03px !important;
  word-spacing: -0.35px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 3px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 6px !important;
  margin-bottom: 3px !important;
  gap: 5px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 22px !important;
  padding: 3px 7px !important;
  font-size: 11.4px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 10.9px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 4px !important;
  margin-right: 7px !important;
  font-size: 9.1px !important;
  gap: 3px !important;
}
.msg-bubble.price-list-message::before{
  height: 36% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-top: -10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
  .msg-date-separator + .msg-row.price-list-message{
    margin-top: -16px !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 62px) !important;
    max-width: calc(100% - 62px) !important;
    flex: 0 0 calc(100% - 62px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 91% !important;
    max-width: 91% !important;
    flex-basis: 91% !important;
  }
  .msg-bubble.price-list-message{
    padding: 7px 9px 6px !important;
    font-size: 14.2px !important;
    line-height: 1.12 !important;
    border-radius: 14px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.12 !important;
    letter-spacing: -0.06px !important;
    word-spacing: -0.55px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 21px !important;
    padding: 2px 6px !important;
    font-size: 10.8px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 3px !important;
    font-size: 8.8px !important;
  }
}


.msg-date-separator + .msg-row.price-list-message{
  margin-top: -18px !important;
}
.msg-row.price-list-message .msg-container{
  max-width: min(93%, 890px) !important;
  width: min(93%, 890px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  font-size: 11px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 7px !important;
}
.msg-bubble.price-list-message{
  padding: 8px 10px 8px !important;
  font-size: 14.8px !important;
  line-height: 1.22 !important;
  border-radius: 16px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.22 !important;
  margin-bottom: 2px !important;
  letter-spacing: -0.03px !important;
  word-spacing: -0.35px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 4px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 6px !important;
  margin-bottom: 3px !important;
  gap: 5px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 22px !important;
  padding: 3px 7px !important;
  font-size: 11.4px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 10.9px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 5px !important;
  margin-right: 7px !important;
  font-size: 9.1px !important;
  gap: 3px !important;
}
.msg-bubble.price-list-message::before{
  height: 36% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-top: -10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
  .msg-date-separator + .msg-row.price-list-message{
    margin-top: -16px !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 62px) !important;
    max-width: calc(100% - 62px) !important;
    flex: 0 0 calc(100% - 62px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 91% !important;
    max-width: 91% !important;
    flex-basis: 91% !important;
  }
  .msg-bubble.price-list-message{
    padding: 8px 9px 7px !important;
    font-size: 14.2px !important;
    line-height: 1.18 !important;
    border-radius: 14px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.18 !important;
    letter-spacing: -0.06px !important;
    word-spacing: -0.55px !important;
    margin-bottom: 2px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 21px !important;
    padding: 2px 6px !important;
    font-size: 10.8px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 4px !important;
    font-size: 8.8px !important;
  }
}

/* v40 balanced price/channel report messages.
   Font and bubble width unchanged; row spacing increased only a tiny bit. */
.msg-row.price-list-message{
  margin-top: -12px !important;
  margin-bottom: 3px !important;
}
.msg-date-separator + .msg-row.price-list-message{
  margin-top: -18px !important;
}
.msg-row.price-list-message .msg-container{
  max-width: min(93%, 890px) !important;
  width: min(93%, 890px) !important;
}
.msg-row.price-list-message .mavatar{
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  font-size: 11px !important;
}
html[dir="rtl"] .msg-row.other.price-list-message .mavatar{
  margin-right: 7px !important;
}
.msg-bubble.price-list-message{
  padding: 8px 10px 8px !important;
  font-size: 14.8px !important;
  line-height: 1.235 !important;
  border-radius: 16px !important;
  min-width: 0 !important;
}
.msg-bubble.price-list-message .msg-body{
  line-height: 1.235 !important;
  margin-bottom: 2px !important;
  letter-spacing: -0.03px !important;
  word-spacing: -0.35px !important;
  font-variant-numeric: tabular-nums;
}
.msg-bubble.price-list-message .msg-name-row{
  margin-bottom: 4px !important;
}
.msg-bubble.price-list-message .rx-bar{
  margin-top: 6px !important;
  margin-bottom: 3px !important;
  gap: 5px !important;
}
.msg-bubble.price-list-message .rx-pill{
  min-height: 22px !important;
  padding: 3px 7px !important;
  font-size: 11.4px !important;
  line-height: 1 !important;
}
.msg-bubble.price-list-message .rx-pill b{
  font-size: 10.9px !important;
}
.msg-bubble.price-list-message .msg-meta{
  margin-top: 5px !important;
  margin-right: 7px !important;
  font-size: 9.1px !important;
  gap: 3px !important;
}
.msg-bubble.price-list-message::before{
  height: 36% !important;
}
@media (max-width: 640px){
  .msg-row.price-list-message{
    margin-top: -10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
  .msg-date-separator + .msg-row.price-list-message{
    margin-top: -16px !important;
  }
  .msg-row.price-list-message .msg-container{
    width: calc(100% - 62px) !important;
    max-width: calc(100% - 62px) !important;
    flex: 0 0 calc(100% - 62px) !important;
  }
  .msg-row.price-list-message.me .msg-container{
    width: 91% !important;
    max-width: 91% !important;
    flex-basis: 91% !important;
  }
  .msg-bubble.price-list-message{
    padding: 8px 9px 7px !important;
    font-size: 14.2px !important;
    line-height: 1.205 !important;
    border-radius: 14px !important;
  }
  .msg-bubble.price-list-message .msg-body{
    line-height: 1.205 !important;
    letter-spacing: -0.06px !important;
    word-spacing: -0.55px !important;
    margin-bottom: 2px !important;
  }
  .msg-bubble.price-list-message .rx-pill{
    min-height: 21px !important;
    padding: 2px 6px !important;
    font-size: 10.8px !important;
  }
  .msg-bubble.price-list-message .msg-meta{
    margin-top: 4px !important;
    font-size: 8.8px !important;
  }
}

/* v42: place reaction chips on the left side of every message bubble.
   In groups/channels, reaction chips are laid out left-to-right for better multi-reaction readability. */
.msg-bubble .rx-bar,
.msg-bubble .rx-bar.rx-left{
  display: flex !important;
  flex-wrap: wrap !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 6px auto 4px 0 !important;
  justify-content: flex-start !important;
  align-items: center !important;
  text-align: left !important;
  direction: ltr !important;
}
.msg-bubble .rx-bar.room-wide-reactions{
  direction: ltr !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-content: flex-start !important;
}
html[dir="rtl"] .msg-row.me .msg-bubble .rx-bar,
html[dir="rtl"] .msg-row.other .msg-bubble .rx-bar{
  margin-left: 0 !important;
  margin-right: auto !important;
}
.msg-bubble .rx-pill{
  direction: ltr !important;
}
.msg-bubble.compact-long-message .compact-report-footer .rx-bar,
.msg-bubble.price-list-message .rx-bar{
  align-self: flex-start !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  direction: ltr !important;
  justify-content: flex-start !important;
}
@media (max-width: 640px){
  .msg-bubble .rx-bar,
  .msg-bubble .rx-bar.rx-left{
    margin: 5px auto 3px 0 !important;
  }
}

/* v44: main header date between brand and search/menu */
.main-header-brand{
  flex:0 1 auto !important;
  max-width:42% !important;
}
.main-header-date{
  flex:1 1 auto;
  min-width:70px;
  padding:0 12px;
  color:rgba(226,236,247,.78);
  font-size:clamp(11px, 2.6vw, 14px);
  font-weight:800;
  line-height:1;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  direction:rtl;
  transition:opacity .16s ease, transform .16s ease;
}
.main-header.main-search-open .main-header-date{
  opacity:0;
  pointer-events:none;
  transform:translateY(-3px);
}
@media (max-width:420px){
  .main-header-brand{max-width:38% !important;}
  .main-header-date{font-size:10.5px; padding:0 7px; min-width:58px;}
}

/* v44: reaction avatars inside group/channel reaction chips */
.rx-pill .rx-avatars{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  direction:ltr;
  margin-left:3px;
  max-width:42px;
}
.rx-pill .rx-avatar{
  width:22px;
  height:22px;
  min-width:22px;
  border-radius:50%;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(15,23,42,.78);
  border:2px solid rgba(255,255,255,.82);
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  box-shadow:0 2px 7px rgba(0,0,0,.22);
  margin-left:-6px;
}
.rx-pill .rx-avatar:first-child{
  margin-left:0;
}
.rx-pill .rx-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.rx-pill:has(.rx-avatars){
  padding-right:5px !important;
  padding-left:7px !important;
  gap:3px !important;
}
.rx-bar.room-wide-reactions{
  direction:ltr !important;
}
@media (max-width:640px){
  .rx-pill .rx-avatar{
    width:20px;
    height:20px;
    min-width:20px;
    border-width:1.5px;
    margin-left:-5px;
  }
  .rx-pill .rx-avatars{
    max-width:38px;
  }
}

/* v45: public group/channel search polish */
.ls-item[data-ls-type="room"] .ls-sub{
  direction:rtl;
}



/* v46 story insights + story reply */
.story-viewer-bottom{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.story-reply-bar{
  display:flex;
  align-items:center;
  gap:10px;
  width:min(92vw, 560px);
  margin-top:4px;
  background:rgba(0,0,0,0.34);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:18px;
  padding:8px;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.story-reply-input{
  flex:1 1 auto;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font:inherit;
  font-size:14px;
  padding:8px 10px;
}
.story-reply-input::placeholder{ color:rgba(255,255,255,0.68); }
.story-reply-send{
  border:0;
  outline:0;
  cursor:pointer;
  color:#fff;
  background:rgba(42,168,255,0.24);
  border:1px solid rgba(42,168,255,0.38);
  border-radius:14px;
  min-height:40px;
  padding:0 14px;
  font:inherit;
  font-weight:800;
  transition:transform .18s ease, background .18s ease, opacity .18s ease;
}
.story-reply-send:active{ transform:scale(.98); }
.story-reply-send:disabled{ opacity:.6; pointer-events:none; }

.story-insights{
  position:absolute;
  inset:0;
  z-index:7;
  display:none;
  align-items:flex-end;
  justify-content:center;
}
.story-insights-backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,10,18,0.28);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
.story-insights-card{
  position:relative;
  z-index:1;
  width:min(92vw, 560px);
  max-height:min(68vh, 560px);
  margin:0 auto 26px;
  border-radius:26px;
  padding:14px 14px 12px;
  background:linear-gradient(180deg, rgba(17,31,50,.92), rgba(8,18,32,.94));
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 24px 60px rgba(0,0,0,0.34);
  display:flex;
  flex-direction:column;
}
.story-insights-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:10px;
}
.story-insights-title-wrap{ min-width:0; flex:1; }
.story-insights-title{
  color:#fff;
  font-size:16px;
  font-weight:900;
}
.story-insights-meta{
  color:rgba(255,255,255,.72);
  font-size:12px;
  margin-top:3px;
}
.story-insights-close{
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.story-insights-list{
  overflow:auto;
  overscroll-behavior:contain;
  padding-inline-end:2px;
}
.story-insights-section-title{
  color:rgba(255,255,255,.7);
  font-size:12px;
  font-weight:800;
  margin:8px 4px 6px;
}
.story-insight-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 8px;
  border-radius:16px;
  background:rgba(255,255,255,.04);
}
.story-insight-item + .story-insight-item{ margin-top:8px; }
.story-insight-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.12);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  flex:0 0 auto;
}
.story-insight-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.story-insight-main{ min-width:0; flex:1; }
.story-insight-name{
  color:#fff;
  font-size:14px;
  font-weight:800;
}
.story-insight-sub{
  color:rgba(255,255,255,.66);
  font-size:12px;
  margin-top:3px;
}
.story-insight-side{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.8);
  font-size:12px;
}
.story-insight-badge{
  min-width:28px;
  height:28px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.08);
}
.story-insight-badge.is-like{ background:rgba(255,92,138,.18); }
.story-insight-badge.is-seen{ background:rgba(42,168,255,.16); }
.story-insight-time{
  white-space:nowrap;
}
.story-insights-empty, .story-insights-loading{
  color:rgba(255,255,255,.78);
  text-align:center;
  padding:18px 10px;
}
@media (max-width:640px){
  .story-insights-card{
    width:min(96vw, 560px);
    margin-bottom:16px;
    max-height:min(72vh, 560px);
    border-radius:22px;
  }
  .story-reply-bar{
    width:min(96vw, 560px);
  }
}


.story-insights,
.story-insights-card,
.story-insights-list,
.story-reply-bar,
.story-reply-input{
  touch-action: pan-y !important;
  pointer-events: auto;
}


/* v46: light theme visibility fixes for main header date and chat call icon */
body.light-theme .main-header-date{
  color: rgba(15,23,42,0.56) !important;
  text-shadow: none !important;
  opacity: .95;
}
body.light-theme .chat-call-main-btn,
body.light-theme .chat-call-picker.is-open .chat-call-main-btn,
body.light-theme .chat-call-main-btn:hover,
body.light-theme .chat-call-main-btn:focus,
body.light-theme .chat-call-main-btn:active{
  color: #1A2735 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.light-theme .chat-call-main-btn svg,
body.light-theme .chat-call-main-btn .chat-call-svg{
  color: #1A2735 !important;
  fill: currentColor !important;
  opacity: .96;
}
body.light-theme .chat-call-main-btn:hover,
body.light-theme .chat-call-main-btn:focus-visible{
  transform: none !important;
}

/* قطار حومه‌ای: نمای تمام‌صفحه داخل پیام‌رسان */
body.commuter-open{
  overflow:hidden !important;
}
body.commuter-open .bottom-nav{
  display:none !important;
}
.commuter-train-menu-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:currentColor;
}
.commuter-train-menu-icon svg{
  display:block;
}
.commuter-train-screen{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  height:100dvh;
  background:#000;
  color:var(--text);
  z-index:10030;
  flex-direction:column;
  overflow:hidden;
}
/* هدر داخلی صفحات قطار و تلویزیون حذف شده تا فقط با دکمه Back گوشی بسته شوند. */
.commuter-train-frame-wrap{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  width:100%;
  overflow:hidden;
  background:#000;
}
.commuter-train-frame-wrap iframe{
  display:block;
  width:calc(100% + 24px);
  min-width:calc(100% + 24px);
  max-width:none;
  height:100%;
  border:0;
  background:#000;
  margin-inline:-12px;
}

.television-menu-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:currentColor;
}
.television-menu-icon svg{
  display:block;
}


/* Birthday celebration */
.birthday-test-menu-btn{gap:10px;}
.birthday-test-menu-icon{display:inline-flex;align-items:center;justify-content:center;color:currentColor;}
.birthday-group-banner{
  width:calc(100% - 22px);
  flex:0 0 auto;
  margin:8px auto 4px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:20px;
  padding:11px 13px;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  text-align:right;
  color:#fff;
  background:linear-gradient(135deg,rgba(255,96,153,.24),rgba(23,211,255,.18)),rgba(21,37,51,.82);
  box-shadow:0 14px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12);
  cursor:pointer;
  z-index:4;
  touch-action:manipulation;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.birthday-group-banner.birthday-visible-all-day{
  display:flex;
}
.birthday-banner-icon{width:38px;height:38px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);font-size:22px;flex:0 0 auto;}
.birthday-banner-copy{display:flex;flex-direction:column;gap:3px;line-height:1.65;min-width:0;}
.birthday-banner-copy strong{font-size:14px;font-weight:900;}
.birthday-banner-copy small{font-size:12px;color:rgba(255,255,255,.82);white-space:normal;}
.birthday-banner-spark{margin-right:auto;font-size:20px;animation:birthdaySparkPulse 1.6s ease-in-out infinite;}
.birth-date-val{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;}
.bd-countdown{display:inline-flex;align-items:center;border-radius:999px;padding:2px 8px;background:rgba(255,255,255,.1);font-size:.9em;color:rgba(255,255,255,.9);}
.birthday-screen-notice{
  position:fixed;
  top:calc(env(safe-area-inset-top,0px) + 16px);
  left:50%;
  transform:translateX(-50%);
  width:min(92vw,430px);
  z-index:10020;
  border-radius:24px;
  padding:14px 16px 14px 46px;
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
  background:linear-gradient(135deg,rgba(255,78,142,.92),rgba(20,174,235,.86));
  box-shadow:0 20px 58px rgba(0,0,0,.36);
  border:1px solid rgba(255,255,255,.22);
  animation:birthdayNoticeIn .36s cubic-bezier(.2,.8,.2,1) both;
}
.birthday-notice-close{position:absolute;left:12px;top:10px;width:28px;height:28px;border:0;border-radius:999px;background:rgba(0,0,0,.16);color:#fff;font-size:22px;line-height:24px;cursor:pointer;}
.birthday-notice-icon{width:44px;height:44px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18);font-size:26px;flex:0 0 auto;}
.birthday-notice-copy{display:flex;flex-direction:column;gap:4px;line-height:1.65;}
.birthday-notice-copy strong{font-size:16px;font-weight:900;}
.birthday-notice-copy span{font-size:13px;color:rgba(255,255,255,.9);}
.birthday-fireworks-layer{position:fixed;inset:0;z-index:10010;pointer-events:none;overflow:hidden;}
.birthday-firework-dot{position:absolute;right:auto;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:999px;background:radial-gradient(circle,#fff 0 18%,#ffd166 19% 42%,#ff4d9d 43% 70%,rgba(255,255,255,0) 72%);box-shadow:0 0 16px rgba(255,255,255,.9),0 0 32px rgba(255,77,157,.5);opacity:0;animation:birthdayFirework 1.45s ease-out var(--delay) forwards;}
@keyframes birthdayFirework{0%{opacity:0;transform:translate3d(0,0,0) scale(.2);}18%{opacity:1;transform:translate3d(0,0,0) scale(1.25);}100%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) scale(.08);}}
@keyframes birthdayNoticeIn{0%{opacity:0;transform:translate(-50%,-18px) scale(.96);}100%{opacity:1;transform:translate(-50%,0) scale(1);}}
@keyframes birthdaySparkPulse{0%,100%{transform:scale(1) rotate(0deg);opacity:.72;}50%{transform:scale(1.18) rotate(12deg);opacity:1;}}
@media (max-width:520px){.birthday-screen-notice{top:calc(env(safe-area-inset-top,0px) + 10px);width:calc(100vw - 24px);border-radius:22px}.birthday-group-banner{width:calc(100% - 16px);}}


/* TV moved to the floating bottom nav: keep 5 items compact without breaking the glow/frame. */
.bottom-nav {
  width: min(340px, calc(100vw - 20px));
}
.bottom-nav .nav-item {
  min-width: 0 !important;
  padding: 5px 6px !important;
}
.bottom-nav .ui-icon,
.bottom-nav .nav-icon svg {
  width: 19px !important;
  height: 19px !important;
}
.bottom-nav .nav-avatar {
  width: 23px !important;
  height: 23px !important;
  font-size: 11px !important;
}
.bottom-nav .nav-label {
  font-size: 9.5px !important;
  margin-top: 3px !important;
  white-space: nowrap;
  line-height: 1.15;
}
.bottom-nav .nav-tv-item .nav-icon {
  color: currentColor;
}
.bottom-nav .nav-tv-item svg {
  display: block;
}
@media (min-width: 860px) {
  .bottom-nav {
    width: 318px !important;
    max-width: 318px !important;
  }
  .bottom-nav .nav-item {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}


/* Deferred chat media: images/videos no longer load until user taps them */
.chat-deferred-media{
  width:min(320px,100%);
  min-height:178px;
  border:0;
  border-bottom:1px solid var(--glass-border);
  border-radius:0;
  background:
    radial-gradient(circle at 18% 18%, rgba(56,189,248,0.18), transparent 34%),
    linear-gradient(135deg, rgba(15,23,42,0.94), rgba(2,6,23,0.88));
  color:var(--text);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:18px 14px;
  text-align:center;
  cursor:pointer;
  overflow:hidden;
}
.chat-deferred-media:active{transform:scale(.985)}
.chat-deferred-icon{width:54px;height:54px;border-radius:20px;display:inline-flex;align-items:center;justify-content:center;background:rgba(56,189,248,.15);border:1px solid rgba(56,189,248,.28);box-shadow:0 12px 30px rgba(0,0,0,.22)}
.chat-deferred-icon svg{width:30px;height:30px;display:block;color:#dff6ff}
.chat-deferred-copy{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;max-width:100%}
.chat-deferred-title{font-size:14px;font-weight:900;color:var(--text)}
.chat-deferred-hint{font-size:12px;font-weight:800;color:var(--text-muted);line-height:1.7}
.chat-deferred-size{font-size:11px;font-weight:800;color:rgba(226,232,240,.72);direction:ltr}
.media-album-deferred-cover{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:linear-gradient(135deg, rgba(15,23,42,.94), rgba(2,6,23,.88));color:var(--text);padding:8px;text-align:center}
.media-album-deferred-cover::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 25% 20%, rgba(56,189,248,.18), transparent 42%);pointer-events:none}
.media-album-deferred-icon,.media-album-deferred-title,.media-album-deferred-size{position:relative;z-index:1}
.media-album-deferred-icon{width:34px;height:34px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;background:rgba(56,189,248,.15);border:1px solid rgba(56,189,248,.25)}
.media-album-deferred-icon svg{width:21px;height:21px;color:#dff6ff}
.media-album-deferred-title{font-size:11px;font-weight:900}
.media-album-deferred-size{font-size:10px;font-weight:800;color:rgba(226,232,240,.72);direction:ltr}
.file-preview-gallery-thumb-video{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:rgba(15,23,42,.92);color:#fff;font-size:20px;font-weight:900}
body.light-theme .chat-deferred-media{background:linear-gradient(135deg, rgba(241,245,249,.98), rgba(226,232,240,.92));color:var(--text)}
body.light-theme .chat-deferred-icon,body.light-theme .media-album-deferred-icon{background:rgba(2,132,199,.10);border-color:rgba(2,132,199,.18)}
body.light-theme .chat-deferred-icon svg,body.light-theme .media-album-deferred-icon svg{color:#0369a1}
body.light-theme .media-album-deferred-cover{background:linear-gradient(135deg, rgba(241,245,249,.98), rgba(226,232,240,.92))}

/* Final fixes: admin member pagination/scroll and professional story reply preview */
html body.admin-body .page-hidden,
html body.admin-body .search-hidden.page-hidden{
  display:none !important;
}
html body.admin-body .admin-list-pagination{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  margin:10px 0 4px !important;
  padding:6px 0 !important;
}
html body.admin-body .admin-list-pagination .pill[disabled]{
  opacity:.45 !important;
  pointer-events:none !important;
}
html body.admin-body .admin-page-status{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:7px 11px !important;
  border-radius:999px !important;
  color:var(--text-muted) !important;
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(148,163,184,.14) !important;
  font-size:12px !important;
  font-weight:900 !important;
}
html body.admin-body #groupMembersBox.members-box{
  max-height:360px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  touch-action:pan-y !important;
  padding:8px !important;
  margin-bottom:0 !important;
}
html body.admin-body .admin-members-backdrop{
  overflow:hidden !important;
  touch-action:none !important;
}
html body.admin-body .admin-members-modal{
  position:relative !important;
  inset:auto !important;
  height:auto !important;
  max-height:min(88dvh,760px) !important;
  overflow:hidden !important;
  touch-action:auto !important;
}
html body.admin-body .admin-members-search-box{
  flex:0 0 auto !important;
  margin:8px 0 8px !important;
}
html body.admin-body .admin-members-box{
  flex:1 1 auto !important;
  min-height:160px !important;
  max-height:min(52dvh,430px) !important;
  height:auto !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  touch-action:pan-y !important;
  padding:8px !important;
  margin:6px 0 0 !important;
}
html body.admin-body .admin-members-box .member-chip,
html body.admin-body #groupMembersBox .member-chip{
  flex:0 0 auto !important;
}
@media (max-width:520px){
  html body.admin-body #groupMembersBox.members-box{
    max-height:300px !important;
  }
  html body.admin-body .admin-members-modal{
    max-height:82dvh !important;
  }
  html body.admin-body .admin-members-box{
    max-height:44dvh !important;
  }
}

.story-reply-card{
  width:100%;
  display:flex;
  align-items:stretch;
  gap:10px;
  border:1px solid rgba(56,189,248,.26);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(14,165,233,.14),rgba(15,23,42,.18));
  color:var(--text);
  padding:8px;
  margin:0 0 8px;
  text-align:right;
  cursor:pointer;
  overflow:hidden;
  font-family:inherit;
  box-shadow:inset 3px 0 0 rgba(56,189,248,.86);
}
.story-reply-card:active{transform:scale(.992)}
.story-reply-thumb{
  position:relative;
  width:72px;
  min-width:72px;
  height:86px;
  border-radius:12px;
  overflow:hidden;
  background:rgba(2,6,23,.45);
  display:flex;
  align-items:center;
  justify-content:center;
}
.story-reply-thumb img,
.story-reply-thumb video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.story-reply-play{
  position:absolute;
  inset:auto auto 8px 8px;
  width:28px;
  height:28px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.58);
  color:#fff;
  font-size:13px;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
}
.story-reply-copy{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
}
.story-reply-label{
  color:#7dd3fc;
  font-size:12px;
  font-weight:900;
}
.story-reply-author{
  color:var(--text);
  font-size:13px;
  font-weight:900;
  line-height:1.6;
}
.story-reply-caption{
  color:var(--text-muted);
  font-size:12px;
  line-height:1.55;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.story-reply-caption.muted{opacity:.78}
body.light-theme .story-reply-card{
  background:linear-gradient(135deg,rgba(2,132,199,.10),rgba(255,255,255,.74));
  border-color:rgba(2,132,199,.20);
}

/* v51: Story reply composer styled like the main chat composer */
.story-reply-bar{
  direction:rtl;
  display:flex;
  align-items:center;
  gap:8px;
  width:min(94vw, 620px);
  min-height:64px;
  margin:6px auto 0;
  padding:8px 10px;
  border-radius:28px;
  background:var(--bg-elevated);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.story-reply-input{
  flex:1 1 auto;
  min-width:0;
  min-height:44px;
  height:44px;
  border:0;
  outline:0;
  resize:none;
  border-radius:22px;
  background:transparent;
  color:#fff;
  font-family:inherit;
  font-size:16px !important;
  line-height:1.5;
  padding:10px 14px;
  box-shadow:none;
}
.story-reply-input::placeholder{color:var(--text-muted);opacity:1;}
.story-reply-send{
  position:relative;
  flex:0 0 auto;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0;
  border:0;
  border-radius:50% !important;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:#fff;
  background:var(--primary) !important;
  box-shadow:0 4px 16px rgba(0,122,255,.4);
  transition:transform .18s ease, opacity .18s ease, filter .18s ease, box-shadow .18s ease, background .18s ease;
}
.story-reply-send .ui-icon{
  width:22px;
  height:22px;
  display:block;
  margin-right:3px;
  filter:brightness(0) invert(1);
}
.story-reply-send:active{transform:scale(.92);}
.story-reply-send:disabled{
  opacity:.52;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
  background:rgba(148,163,184,.18) !important;
}
.story-reply-send.is-active{opacity:1;}
.story-reply-send.is-sending .ui-icon{opacity:0;}
.story-reply-send-spinner{
  position:absolute;
  inset:12px;
  display:none;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.42);
  border-top-color:#fff;
  animation:storyReplySpin .8s linear infinite;
}
.story-reply-send.is-sending .story-reply-send-spinner{display:block;}
@keyframes storyReplySpin{to{transform:rotate(360deg)}}
body.light-theme .story-reply-bar{
  background:rgba(255,255,255,.94);
  border-color:rgba(15,23,42,.10);
  box-shadow:0 12px 34px rgba(15,23,42,.12);
}
body.light-theme .story-reply-input{color:#0f172a;}
body.light-theme .story-reply-send:disabled{
  background:rgba(148,163,184,.22) !important;
}
@media (max-width:640px){
  .story-reply-bar{
    width:min(96vw, 560px);
    min-height:60px;
    padding:8px;
    border-radius:26px;
  }
  .story-reply-input{
    font-size:15px !important;
    padding-inline:12px;
  }
}

/* v52: Story reply composer matched to chat composer, with emoji picker */
.story-reply-bar{
  direction:rtl;
  display:flex;
  align-items:flex-end;
  gap:8px;
  width:min(94vw, 620px);
  min-height:58px;
  margin:6px auto 0;
  padding:6px;
  border-radius:28px;
  background:var(--bg-elevated);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.story-reply-input-container{
  flex:1 1 auto;
  min-width:0;
  min-height:44px;
  display:flex;
  align-items:center;
  position:relative;
  background:transparent;
}
.story-reply-input{
  width:100%;
  min-height:44px;
  max-height:96px;
  height:44px;
  overflow-y:auto;
  border:0;
  outline:0;
  resize:none;
  border-radius:22px;
  background:transparent;
  color:#fff;
  font-family:inherit;
  font-size:16px !important;
  line-height:1.5;
  padding:10px 12px 10px 48px;
  box-shadow:none;
  scrollbar-width:none;
}
.story-reply-input::-webkit-scrollbar{display:none;}
.story-reply-input::placeholder{color:var(--text-muted);opacity:1;}
.story-reply-emoji-btn{
  position:absolute;
  left:6px;
  bottom:5px;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,0.06);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .18s ease, background .18s ease, opacity .18s ease;
  z-index:3;
}
.story-reply-emoji-btn:hover,
.story-reply-emoji-btn.active{background:rgba(255,255,255,0.12);}
.story-reply-emoji-btn:active{transform:scale(.94);}
.story-reply-emoji-btn .ui-icon{width:22px;height:22px;opacity:.92;}
.story-reply-send{
  position:relative;
  flex:0 0 auto;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0;
  border:0;
  border-radius:50% !important;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:#fff;
  background:var(--primary) !important;
  box-shadow:0 4px 16px rgba(0,122,255,.4);
  transition:transform .18s ease, opacity .18s ease, filter .18s ease, box-shadow .18s ease, background .18s ease;
}
.story-reply-send .ui-icon{
  width:22px;
  height:22px;
  display:block;
  margin-right:4px;
  filter:brightness(0) invert(1);
}
.story-reply-send:active{transform:scale(.92);}
.story-reply-send:disabled{
  opacity:.52;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
  background:rgba(148,163,184,.18) !important;
}
.story-reply-send.is-active{opacity:1;}
.story-reply-send.is-sending .ui-icon{opacity:0;}
.story-reply-send-spinner{
  position:absolute;
  inset:12px;
  display:none;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.42);
  border-top-color:#fff;
  animation:storyReplySpin .8s linear infinite;
}
.story-reply-send.is-sending .story-reply-send-spinner{display:block;}
.story-emoji-picker{
  direction:rtl;
  position:absolute;
  left:0;
  right:auto;
  bottom:calc(100% + 10px);
  width:min(440px, calc(100vw - 24px));
  max-height:min(360px, 45vh);
  overflow:hidden;
  padding:8px 8px 10px;
  border-radius:18px;
  display:none;
  flex-direction:column;
  gap:8px;
  z-index:80;
}
.story-emoji-picker .emoji-tabs{
  grid-template-columns:repeat(12, minmax(0, 1fr));
}
.story-emoji-picker .emoji-body{
  max-height:270px;
}
body.light-theme .story-reply-bar{
  background:rgba(255,255,255,.94);
  border-color:rgba(15,23,42,.10);
  box-shadow:0 12px 34px rgba(15,23,42,.12);
}
body.light-theme .story-reply-input{color:#0f172a;}
body.light-theme .story-reply-emoji-btn{background:rgba(15,23,42,.06);}
body.light-theme .story-reply-emoji-btn:hover,
body.light-theme .story-reply-emoji-btn.active{background:rgba(15,23,42,.10);}
body.light-theme .story-reply-send:disabled{background:rgba(148,163,184,.22) !important;}
@media (max-width:640px){
  .story-reply-bar{
    width:min(96vw, 560px);
    min-height:56px;
    padding:6px;
    border-radius:28px;
  }
  .story-reply-input{
    font-size:16px !important;
    padding:10px 12px 10px 48px;
  }
  .story-emoji-picker{
    left:-2px;
    width:calc(100vw - 28px);
    max-height:min(350px, 42vh);
  }
  .story-emoji-picker .emoji-grid{grid-template-columns:repeat(5, minmax(0, 1fr));}
}

/* === Media thumbnails / fullscreen viewer fix (patched) === */
.chat-media-preview{
  position:relative !important;
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-bottom:1px solid var(--glass-border) !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:#000 !important;
  cursor:zoom-in !important;
  line-height:0 !important;
  -webkit-tap-highlight-color:transparent;
}
.chat-media-preview .chat-thumbnail,
.chat-media-preview .chat-video{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  max-height:360px !important;
  height:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
  border:0 !important;
  border-radius:0 !important;
  background:#000 !important;
}
.chat-media-video-preview .chat-video{min-height:178px !important;}
.chat-media-play-badge{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:54px;
  height:54px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(15,23,42,.72);
  color:#fff;
  font-size:22px;
  font-weight:900;
  box-shadow:0 12px 30px rgba(0,0,0,.28);
  pointer-events:none;
}
.media-album-tile .media-album-deferred-cover{display:none !important;}
.media-album-tile-media{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#000 !important;
}
.media-album-video-badge{
  position:absolute;
  right:10px;
  bottom:10px;
  width:30px;
  height:30px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(2,6,23,.72);
  color:#fff;
  font-size:12px;
  font-weight:900;
  backdrop-filter:blur(8px);
  pointer-events:none;
}

.file-preview-modal{padding:0 !important;}
.file-preview-shell{
  width:100vw !important;
  height:100vh !important;
  max-width:100vw !important;
  max-height:100vh !important;
  padding:0 !important;
  gap:0 !important;
  border-radius:0 !important;
  border:0 !important;
  background:rgba(0,0,0,.96) !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
@supports (height: 100dvh){
  .file-preview-shell{height:100dvh !important;max-height:100dvh !important;}
}
.file-preview-toolbar{
  position:absolute !important;
  top:0;
  right:0;
  left:0;
  z-index:10;
  padding:calc(env(safe-area-inset-top,0px) + 10px) 12px 12px !important;
  background:linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,0)) !important;
  color:#fff !important;
}
.file-preview-title{color:#fff !important;}
.file-preview-sub{color:rgba(255,255,255,.76) !important;}
.file-preview-body{
  width:100vw !important;
  height:100vh !important;
  max-height:100vh !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#000 !important;
}
@supports (height: 100dvh){
  .file-preview-body{height:100dvh !important;max-height:100dvh !important;}
}
.file-preview-body > img,
.file-preview-body > video{
  display:block !important;
  max-width:100vw !important;
  max-height:100vh !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  border:0 !important;
  border-radius:0 !important;
  background:#000 !important;
}
@supports (height: 100dvh){
  .file-preview-body > img,
  .file-preview-body > video{max-height:100dvh !important;}
}
.file-preview-gallery-nav,
.file-preview-gallery-count,
.file-preview-gallery-strip{display:none !important;}
.file-preview-gallery-shell,
.file-preview-gallery-stage-wrap,
.file-preview-gallery-stage{
  width:100vw !important;
  height:100vh !important;
  max-height:100vh !important;
  min-height:100vh !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:#000 !important;
}
@supports (height: 100dvh){
  .file-preview-gallery-shell,
  .file-preview-gallery-stage-wrap,
  .file-preview-gallery-stage{height:100dvh !important;max-height:100dvh !important;min-height:100dvh !important;}
}
.file-preview-gallery-media{
  max-width:100vw !important;
  max-height:100vh !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  border:0 !important;
  border-radius:0 !important;
}
@supports (height: 100dvh){.file-preview-gallery-media{max-height:100dvh !important;}}