/*
 * LMe Mobile Experience Final v566
 * Final mobile-only owner for shell geometry, safe areas, keyboard behavior,
 * touch targets and low-power rendering. Desktop rules are intentionally untouched.
 */
:root {
  --lme-mobile-inline-v566: 10px;
  --lme-mobile-radius-v566: 22px;
  --lme-mobile-header-v566: 66px;
  --lme-mobile-composer-v566: 76px;
  --lme-mobile-safe-top-v566: env(safe-area-inset-top, 0px);
  --lme-mobile-safe-bottom-v566: env(safe-area-inset-bottom, 0px);
  --lme-mobile-ease-v566: cubic-bezier(.2, .78, .2, 1);
}

html.lme-platform-mobile,
html[data-lme-platform="mobile"] {
  width: 100% !important;
  height: var(--app-height, 100dvh) !important;
  min-height: var(--app-height, 100dvh) !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

html.lme-platform-mobile body,
html[data-lme-platform="mobile"] body {
  width: 100% !important;
  height: var(--app-height, 100dvh) !important;
  min-height: var(--app-height, 100dvh) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: manipulation;
}

html.lme-platform-mobile body :is(input, textarea, select),
html[data-lme-platform="mobile"] body :is(input, textarea, select) {
  font-size: 16px !important; /* prevents Android/iOS focus zoom */
}

html.lme-platform-mobile body :is(button, [role="button"], input, textarea, select, a),
html[data-lme-platform="mobile"] body :is(button, [role="button"], input, textarea, select, a) {
  -webkit-tap-highlight-color: transparent !important;
}

/* ---------- App shell ---------- */
html.lme-platform-mobile body .page-shell,
html[data-lme-platform="mobile"] body .page-shell {
  width: 100vw !important;
  max-width: 100vw !important;
  height: var(--app-height, 100dvh) !important;
  min-height: var(--app-height, 100dvh) !important;
  max-height: var(--app-height, 100dvh) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html.lme-platform-mobile body .bg-orb,
html[data-lme-platform="mobile"] body .bg-orb {
  opacity: .22 !important;
  filter: blur(44px) !important;
  animation: none !important;
}

html.lme-platform-mobile body #chatScreen.chat-screen,
html[data-lme-platform="mobile"] body #chatScreen.chat-screen {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #0d0b13 !important;
}

html.lme-platform-mobile body #chatScreen > :is(#chatSidebar, .chat-main),
html[data-lme-platform="mobile"] body #chatScreen > :is(#chatSidebar, .chat-main) {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

/* ---------- Authentication ---------- */
html.lme-platform-mobile body #authScreen.auth-screen,
html[data-lme-platform="mobile"] body #authScreen.auth-screen {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 14px) 12px calc(var(--lme-mobile-safe-bottom-v566) + 14px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  scroll-padding-bottom: calc(var(--lme-mobile-safe-bottom-v566) + 24px) !important;
}

html.lme-platform-mobile body #authScreen .auth-card,
html[data-lme-platform="mobile"] body #authScreen .auth-card {
  width: 100% !important;
  max-width: 520px !important;
  margin: auto !important;
  border-radius: 28px !important;
  overflow: hidden !important;
}

html.lme-platform-mobile body #authScreen .auth-hero-panel,
html[data-lme-platform="mobile"] body #authScreen .auth-hero-panel {
  min-height: 132px !important;
  padding: 24px 22px 18px !important;
}

html.lme-platform-mobile body #authScreen .auth-form-panel,
html[data-lme-platform="mobile"] body #authScreen .auth-form-panel {
  padding: 18px !important;
}

/* ---------- Chat list ---------- */
html.lme-platform-mobile body #chatSidebar.sidebar,
html[data-lme-platform="mobile"] body #chatSidebar.sidebar {
  display: grid !important;
  grid-template-rows: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) auto auto minmax(0, 1fr) !important;
  padding: 0 !important;
  background: #100d17 !important;
  transform: translate3d(0, 0, 0) !important;
}

html.lme-platform-mobile body #chatSidebar.hidden-mobile,
html[data-lme-platform="mobile"] body #chatSidebar.hidden-mobile {
  display: none !important;
}

html.lme-platform-mobile body #chatSidebar .sidebar-top,
html[data-lme-platform="mobile"] body #chatSidebar .sidebar-top {
  min-height: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) !important;
  height: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 10px) 14px 8px !important;
  gap: 12px !important;
  border-bottom: 1px solid rgba(255,255,255,.055) !important;
  background: rgba(15, 12, 22, .96) !important;
  box-sizing: border-box !important;
  z-index: 8 !important;
}

html.lme-platform-mobile body #sidebarMenuBtn,
html[data-lme-platform="mobile"] body #sidebarMenuBtn {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  border-radius: 16px !important;
}

html.lme-platform-mobile body #chatSidebar .sidebar-title,
html[data-lme-platform="mobile"] body #chatSidebar .sidebar-title {
  font-size: 1.24rem !important;
  line-height: 1.05 !important;
}

html.lme-platform-mobile body #chatSidebar .sidebar-subtitle,
html[data-lme-platform="mobile"] body #chatSidebar .sidebar-subtitle {
  margin-top: 4px !important;
  font-size: .72rem !important;
  line-height: 1.2 !important;
  opacity: .68 !important;
}

html.lme-platform-mobile body #chatSidebar .sidebar-search-wrap,
html[data-lme-platform="mobile"] body #chatSidebar .sidebar-search-wrap {
  padding: 10px 12px 8px !important;
  margin: 0 !important;
  background: #100d17 !important;
}

html.lme-platform-mobile body #chatFilterInput,
html[data-lme-platform="mobile"] body #chatFilterInput {
  width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  padding: 0 44px !important;
  border-radius: 19px !important;
}

html.lme-platform-mobile body #chatSidebar .sidebar-utility-row,
html[data-lme-platform="mobile"] body #chatSidebar .sidebar-utility-row {
  min-width: 0 !important;
  padding: 0 12px 8px !important;
  overflow: hidden !important;
}

html.lme-platform-mobile body #chatFolders,
html[data-lme-platform="mobile"] body #chatFolders {
  display: flex !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}

html.lme-platform-mobile body #chatFolders::-webkit-scrollbar,
html[data-lme-platform="mobile"] body #chatFolders::-webkit-scrollbar { display: none !important; }

html.lme-platform-mobile body #chatFolders > *,
html[data-lme-platform="mobile"] body #chatFolders > * {
  flex: 0 0 auto !important;
  min-height: 38px !important;
  scroll-snap-align: start !important;
}

html.lme-platform-mobile body #chatList.chat-list,
html[data-lme-platform="mobile"] body #chatList.chat-list {
  min-height: 0 !important;
  padding: 2px 10px calc(var(--lme-mobile-safe-bottom-v566) + 14px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  scroll-padding-block: 8px calc(var(--lme-mobile-safe-bottom-v566) + 18px) !important;
  -webkit-overflow-scrolling: touch !important;
}

html.lme-platform-mobile body #chatList :is(.chat-item, .chat-list-item, .conversation-item),
html[data-lme-platform="mobile"] body #chatList :is(.chat-item, .chat-list-item, .conversation-item) {
  width: 100% !important;
  min-height: 72px !important;
  margin: 0 0 7px !important;
  padding: 10px 11px !important;
  border-radius: 20px !important;
  transform: none !important;
  content-visibility: auto !important;
  contain-intrinsic-size: 72px !important;
}

/* ---------- Active chat ---------- */
html.lme-platform-mobile body .chat-main,
html[data-lme-platform="mobile"] body .chat-main {
  display: grid !important;
  grid-template-rows: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) minmax(0, 1fr) auto !important;
  background: #0d0b13 !important;
}

html.lme-platform-mobile body.mobile-chat-list-mode .chat-main,
html[data-lme-platform="mobile"] body.mobile-chat-list-mode .chat-main {
  display: none !important;
}

html.lme-platform-mobile body .chat-main-top,
html[data-lme-platform="mobile"] body .chat-main-top {
  height: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) !important;
  min-height: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) !important;
  max-height: calc(var(--lme-mobile-header-v566) + var(--lme-mobile-safe-top-v566)) !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 8px) 10px 8px !important;
  gap: 8px !important;
  border-bottom: 1px solid rgba(255,255,255,.055) !important;
  background: rgba(15, 12, 22, .96) !important;
  box-sizing: border-box !important;
  z-index: 20 !important;
}

html.lme-platform-mobile body .chat-main-top :is(.icon-circle, .call-btn),
html[data-lme-platform="mobile"] body .chat-main-top :is(.icon-circle, .call-btn) {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 15px !important;
}

html.lme-platform-mobile body .chat-main-left,
html[data-lme-platform="mobile"] body .chat-main-left {
  min-width: 0 !important;
  gap: 9px !important;
}

html.lme-platform-mobile body .chat-head-copy,
html[data-lme-platform="mobile"] body .chat-head-copy {
  min-width: 0 !important;
  overflow: hidden !important;
}

html.lme-platform-mobile body .chat-head-copy :is(.chat-title, .chat-main-title, #currentChatTitle),
html[data-lme-platform="mobile"] body .chat-head-copy :is(.chat-title, .chat-main-title, #currentChatTitle) {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html.lme-platform-mobile body #messages.messages,
html[data-lme-platform="mobile"] body #messages.messages {
  min-height: 0 !important;
  padding: 14px 10px 18px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  scroll-padding-bottom: calc(var(--lme-mobile-composer-v566) + var(--lme-mobile-safe-bottom-v566) + 18px) !important;
  -webkit-overflow-scrolling: touch !important;
}

html.lme-platform-mobile body #messages :is(.msg, .message-bubble, .chat-message),
html[data-lme-platform="mobile"] body #messages :is(.msg, .message-bubble, .chat-message) {
  max-width: min(84vw, 560px) !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

html.lme-platform-mobile body #messages :is(.attachment-preview, .file-preview, [data-lme-video-player]),
html[data-lme-platform="mobile"] body #messages :is(.attachment-preview, .file-preview, [data-lme-video-player]) {
  max-width: min(82vw, 480px) !important;
}

html.lme-platform-mobile body #messageForm.composer,
html[data-lme-platform="mobile"] body #messageForm.composer {
  position: relative !important;
  z-index: 24 !important;
  width: 100% !important;
  min-height: calc(var(--lme-mobile-composer-v566) + var(--lme-mobile-safe-bottom-v566)) !important;
  padding: 9px 9px max(9px, var(--lme-mobile-safe-bottom-v566)) !important;
  margin: 0 !important;
  border-top: 1px solid rgba(255,255,255,.055) !important;
  background: rgba(15, 12, 22, .985) !important;
  box-sizing: border-box !important;
}

html.lme-platform-mobile body #messageForm .composer-row,
html[data-lme-platform="mobile"] body #messageForm .composer-row {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) 50px !important;
  grid-template-areas: "tools input send" !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 52px !important;
}

html.lme-platform-mobile body #messageForm .composer-tools,
html[data-lme-platform="mobile"] body #messageForm .composer-tools {
  grid-area: tools !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}

html.lme-platform-mobile body #messageForm :is(#attachMenuToggle, #mediaPanelToggle, #voiceRecordBtn),
html[data-lme-platform="mobile"] body #messageForm :is(#attachMenuToggle, #mediaPanelToggle, #voiceRecordBtn) {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 14px !important;
  transform: none !important;
}

html.lme-platform-mobile body #messageInput,
html[data-lme-platform="mobile"] body #messageInput {
  grid-area: input !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 50px !important;
  min-height: 50px !important;
  max-height: 116px !important;
  padding: 13px 14px !important;
  border-radius: 20px !important;
  line-height: 1.32 !important;
  resize: none !important;
}

html.lme-platform-mobile body #messageForm .send-btn,
html[data-lme-platform="mobile"] body #messageForm .send-btn {
  grid-area: send !important;
  width: 50px !important;
  min-width: 50px !important;
  height: 50px !important;
  min-height: 50px !important;
  border-radius: 18px !important;
  transform: none !important;
}

html.lme-platform-mobile body.keyboard-open #messageForm.composer,
html[data-lme-platform="mobile"] body.keyboard-open #messageForm.composer,
html.lme-platform-mobile body.lme-mobile-keyboard-v566 #messageForm.composer,
html[data-lme-platform="mobile"] body.lme-mobile-keyboard-v566 #messageForm.composer {
  min-height: var(--lme-mobile-composer-v566) !important;
  padding-bottom: 7px !important;
}

/* ---------- Menu popover ---------- */
html.lme-platform-mobile body #mainMenuPopover.lme-burger-menu,
html[data-lme-platform="mobile"] body #mainMenuPopover.lme-burger-menu {
  left: max(8px, var(--lme-main-menu-left, 8px)) !important;
  right: 8px !important;
  top: max(calc(var(--lme-mobile-safe-top-v566) + 62px), var(--lme-main-menu-top, 62px)) !important;
  width: auto !important;
  max-width: 380px !important;
  max-height: min(var(--lme-main-menu-max-height, 620px), calc(var(--app-height, 100dvh) - var(--lme-mobile-safe-top-v566) - 74px)) !important;
  padding: 10px !important;
  gap: 7px !important;
  border-radius: 24px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

html.lme-platform-mobile body #mainMenuPopover .lme-burger-menu-item,
html[data-lme-platform="mobile"] body #mainMenuPopover .lme-burger-menu-item {
  height: 62px !important;
  min-height: 62px !important;
  max-height: 62px !important;
}

/* ---------- Main drawer/settings/profile editor ---------- */
html.lme-platform-mobile body #menuDrawer.drawer,
html[data-lme-platform="mobile"] body #menuDrawer.drawer {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: var(--app-height, 100dvh) !important;
  max-height: var(--app-height, 100dvh) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: #100d17 !important;
}

html.lme-platform-mobile body #menuDrawer .drawer-top,
html[data-lme-platform="mobile"] body #menuDrawer .drawer-top {
  min-height: calc(68px + var(--lme-mobile-safe-top-v566)) !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 9px) 12px 9px !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  background: rgba(16, 13, 23, .985) !important;
}

html.lme-platform-mobile body #menuDrawer .drawer-section-title-bar,
html[data-lme-platform="mobile"] body #menuDrawer .drawer-section-title-bar {
  padding: 12px 14px 8px !important;
}

html.lme-platform-mobile body #menuDrawer .drawer-content,
html[data-lme-platform="mobile"] body #menuDrawer .drawer-content {
  min-height: 0 !important;
  padding: 4px 10px calc(var(--lme-mobile-safe-bottom-v566) + 18px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-padding-bottom: calc(var(--lme-mobile-safe-bottom-v566) + 24px) !important;
}

html.lme-platform-mobile body #menuDrawer :is(.section-card, .settings-card, .profile-hub-card),
html[data-lme-platform="mobile"] body #menuDrawer :is(.section-card, .settings-card, .profile-hub-card) {
  width: 100% !important;
  min-width: 0 !important;
  border-radius: 22px !important;
}

html.lme-platform-mobile body #menuDrawer :is(.metrics-grid, .profile-facts-grid, .settings-grid),
html[data-lme-platform="mobile"] body #menuDrawer :is(.metrics-grid, .profile-facts-grid, .settings-grid) {
  grid-template-columns: minmax(0, 1fr) !important;
}

/* ---------- Profiles and other large modals ---------- */
html.lme-platform-mobile body :is(#participantProfileModal, #communityProfileModal, #communitySettingsModal, #forwardModal).profile-modal,
html[data-lme-platform="mobile"] body :is(#participantProfileModal, #communityProfileModal, #communitySettingsModal, #forwardModal).profile-modal {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  width: 100% !important;
  height: var(--app-height, 100dvh) !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html.lme-platform-mobile body :is(#participantProfileModal, #communityProfileModal, #communitySettingsModal, #forwardModal).profile-modal.hidden,
html[data-lme-platform="mobile"] body :is(#participantProfileModal, #communityProfileModal, #communitySettingsModal, #forwardModal).profile-modal.hidden {
  display: none !important;
}

html.lme-platform-mobile body :is(#participantProfileCard, #communityProfileModal .profile-modal-card, #communitySettingsModal .profile-modal-card, #forwardModal .profile-modal-card),
html[data-lme-platform="mobile"] body :is(#participantProfileCard, #communityProfileModal .profile-modal-card, #communitySettingsModal .profile-modal-card, #forwardModal .profile-modal-card) {
  width: 100% !important;
  max-width: none !important;
  height: var(--app-height, 100dvh) !important;
  max-height: var(--app-height, 100dvh) !important;
  margin: 0 !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 8px) 8px calc(var(--lme-mobile-safe-bottom-v566) + 8px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-padding-top: calc(var(--lme-mobile-safe-top-v566) + 12px) !important;
  scroll-padding-bottom: calc(var(--lme-mobile-safe-bottom-v566) + 18px) !important;
}

html.lme-platform-mobile body #participantProfileCard :is(.profile-close-btn, .profile-more-btn),
html[data-lme-platform="mobile"] body #participantProfileCard :is(.profile-close-btn, .profile-more-btn) {
  position: fixed !important;
  top: calc(var(--lme-mobile-safe-top-v566) + 10px) !important;
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  z-index: 80 !important;
}

html.lme-platform-mobile body #participantProfileCard .profile-close-btn,
html[data-lme-platform="mobile"] body #participantProfileCard .profile-close-btn {
  right: 10px !important;
}

html.lme-platform-mobile body #participantProfileCard .profile-more-btn,
html[data-lme-platform="mobile"] body #participantProfileCard .profile-more-btn {
  right: 64px !important;
}

html.lme-platform-mobile body #participantProfileHero,
html[data-lme-platform="mobile"] body #participantProfileHero {
  min-height: clamp(240px, 43svh, 340px) !important;
  border-radius: 26px !important;
}

html.lme-platform-mobile body #participantProfileBody,
html[data-lme-platform="mobile"] body #participantProfileBody {
  padding: 10px 2px 2px !important;
}

html.lme-platform-mobile body #participantProfileBody .profile-modal-actions,
html[data-lme-platform="mobile"] body #participantProfileBody .profile-modal-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

html.lme-platform-mobile body #participantProfileBody .profile-modal-actions > button,
html[data-lme-platform="mobile"] body #participantProfileBody .profile-modal-actions > button {
  min-height: 54px !important;
}

html.lme-platform-mobile body #participantProfileNav,
html[data-lme-platform="mobile"] body #participantProfileNav {
  position: sticky !important;
  top: 0 !important;
  z-index: 25 !important;
  margin-top: 10px !important;
  background: rgba(16, 13, 23, .94) !important;
}

/* ---------- Bottom sheets ---------- */
html.lme-platform-mobile body #attachSheet.attach-sheet,
html[data-lme-platform="mobile"] body #attachSheet.attach-sheet {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: stretch !important;
  padding: 0 !important;
  z-index: 1200 !important;
}

html.lme-platform-mobile body #attachSheet.attach-sheet.hidden,
html[data-lme-platform="mobile"] body #attachSheet.attach-sheet.hidden { display: none !important; }

html.lme-platform-mobile body #attachSheet .attach-sheet-card,
html[data-lme-platform="mobile"] body #attachSheet .attach-sheet-card {
  width: 100% !important;
  max-width: none !important;
  max-height: min(78dvh, 680px) !important;
  margin: 0 !important;
  padding: 16px 12px calc(var(--lme-mobile-safe-bottom-v566) + 16px) !important;
  border-radius: 28px 28px 0 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

html.lme-platform-mobile body #attachSheet .attach-sheet-grid,
html[data-lme-platform="mobile"] body #attachSheet .attach-sheet-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
}

html.lme-platform-mobile body #mediaPanel.media-panel:not(.hidden),
html[data-lme-platform="mobile"] body #mediaPanel.media-panel:not(.hidden) {
  position: fixed !important;
  left: 8px !important;
  right: 8px !important;
  bottom: calc(var(--lme-mobile-composer-v566) + var(--lme-mobile-safe-bottom-v566) + 8px) !important;
  width: auto !important;
  max-width: none !important;
  max-height: min(52dvh, 430px) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  z-index: 80 !important;
}

/* ---------- Archive viewer ---------- */
html.lme-platform-mobile body #lmeArchiveViewer.lme-archive-viewer,
html[data-lme-platform="mobile"] body #lmeArchiveViewer.lme-archive-viewer {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: var(--app-height, 100dvh) !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html.lme-platform-mobile body #lmeArchiveViewer .lme-archive-panel,
html[data-lme-platform="mobile"] body #lmeArchiveViewer .lme-archive-panel {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  height: var(--app-height, 100dvh) !important;
  max-height: var(--app-height, 100dvh) !important;
  margin: 0 !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html.lme-platform-mobile body #lmeArchiveViewer .lme-archive-head,
html[data-lme-platform="mobile"] body #lmeArchiveViewer .lme-archive-head {
  min-height: calc(78px + var(--lme-mobile-safe-top-v566)) !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 12px) 14px 12px !important;
}

html.lme-platform-mobile body #lmeArchiveViewer .lme-archive-body,
html[data-lme-platform="mobile"] body #lmeArchiveViewer .lme-archive-body {
  padding: 10px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
}

html.lme-platform-mobile body #lmeArchiveViewer .lme-archive-footer,
html[data-lme-platform="mobile"] body #lmeArchiveViewer .lme-archive-footer {
  padding: 10px 10px max(10px, var(--lme-mobile-safe-bottom-v566)) !important;
  gap: 8px !important;
}

html.lme-platform-mobile body #lmeArchiveViewer .lme-archive-entry,
html[data-lme-platform="mobile"] body #lmeArchiveViewer .lme-archive-entry {
  min-height: 62px !important;
  border-radius: 18px !important;
}

/* ---------- Calls ---------- */
html.lme-platform-mobile body.call-active-ui #callPanel:not(.hidden):not([hidden]),
html[data-lme-platform="mobile"] body.call-active-ui #callPanel:not(.hidden):not([hidden]) {
  inset: 0 !important;
  width: 100% !important;
  height: var(--app-height, 100dvh) !important;
  max-height: var(--app-height, 100dvh) !important;
  padding: calc(var(--lme-mobile-safe-top-v566) + 8px) 8px calc(var(--lme-mobile-safe-bottom-v566) + 8px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  gap: 8px !important;
}

html.lme-platform-mobile body #callPanel .call-panel-top,
html[data-lme-platform="mobile"] body #callPanel .call-panel-top {
  min-height: 50px !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  gap: 6px !important;
}

html.lme-platform-mobile body #callPanel .call-timer-label,
html[data-lme-platform="mobile"] body #callPanel .call-timer-label {
  display: none !important;
}

html.lme-platform-mobile body #callPanel .call-stage-main,
html[data-lme-platform="mobile"] body #callPanel .call-stage-main {
  padding: clamp(16px, 5vw, 26px) !important;
  border-radius: 24px !important;
}

html.lme-platform-mobile body #callPanel .call-audio-controls,
html[data-lme-platform="mobile"] body #callPanel .call-audio-controls {
  max-height: min(76dvh, 620px) !important;
  padding: 14px 12px calc(var(--lme-mobile-safe-bottom-v566) + 14px) !important;
  border-radius: 26px 26px 0 0 !important;
}

html.lme-platform-mobile body #callPanel .call-actions,
html[data-lme-platform="mobile"] body #callPanel .call-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

html.lme-platform-mobile body.call-minimized-ui #callMiniBar:not(.hidden):not([hidden]),
html[data-lme-platform="mobile"] body.call-minimized-ui #callMiniBar:not(.hidden):not([hidden]) {
  left: 8px !important;
  right: 8px !important;
  bottom: max(8px, var(--lme-mobile-safe-bottom-v566)) !important;
  width: auto !important;
  max-width: none !important;
  border-radius: 20px !important;
}

/* ---------- Touch ergonomics ---------- */
html.lme-platform-mobile body :is(
  .profile-close-btn,
  .profile-more-btn,
  .lme-archive-close,
  .lme-archive-up,
  .call-settings-close-btn,
  .call-settings-toggle-btn,
  .call-panel-toggle-btn,
  .password-toggle
),
html[data-lme-platform="mobile"] body :is(
  .profile-close-btn,
  .profile-more-btn,
  .lme-archive-close,
  .lme-archive-up,
  .call-settings-close-btn,
  .call-settings-toggle-btn,
  .call-panel-toggle-btn,
  .password-toggle
) {
  min-width: 44px !important;
  min-height: 44px !important;
}

/* ---------- Low-power Android/WebView budget ---------- */
html.lme-platform-mobile.lme-performance-low-v563 body :is(
  .screen-card,
  .drawer,
  .profile-modal-card,
  .lme-burger-menu,
  .media-panel,
  .attach-sheet-card,
  .call-panel,
  .lme-archive-panel
),
html.lme-platform-mobile body.embedded-webview :is(
  .screen-card,
  .drawer,
  .profile-modal-card,
  .lme-burger-menu,
  .media-panel,
  .attach-sheet-card,
  .call-panel,
  .lme-archive-panel
) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 8px 26px rgba(0,0,0,.24) !important;
}

html.lme-platform-mobile.lme-performance-low-v563 body :is(.bg-orb, .profile-background-video, .profile-banner-video-layer),
html.lme-platform-mobile body.embedded-webview :is(.bg-orb, .profile-background-video, .profile-banner-video-layer) {
  animation: none !important;
  filter: none !important;
}

/* ---------- Small phones ---------- */
@media (max-width: 390px) {
  :root {
    --lme-mobile-inline-v566: 8px;
    --lme-mobile-header-v566: 62px;
    --lme-mobile-composer-v566: 72px;
  }

  html.lme-platform-mobile body #chatSidebar .sidebar-top,
  html[data-lme-platform="mobile"] body #chatSidebar .sidebar-top {
    padding-inline: 10px !important;
  }

  html.lme-platform-mobile body #chatList.chat-list,
  html[data-lme-platform="mobile"] body #chatList.chat-list {
    padding-inline: 8px !important;
  }

  html.lme-platform-mobile body #messageForm :is(#attachMenuToggle, #mediaPanelToggle, #voiceRecordBtn),
  html[data-lme-platform="mobile"] body #messageForm :is(#attachMenuToggle, #mediaPanelToggle, #voiceRecordBtn) {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
  }

  html.lme-platform-mobile body #messageForm .composer-tools,
  html[data-lme-platform="mobile"] body #messageForm .composer-tools {
    gap: 4px !important;
  }

  html.lme-platform-mobile body #messageForm .composer-row,
  html[data-lme-platform="mobile"] body #messageForm .composer-row {
    grid-template-columns: auto minmax(0, 1fr) 48px !important;
    gap: 5px !important;
  }

  html.lme-platform-mobile body #messageInput,
  html[data-lme-platform="mobile"] body #messageInput {
    height: 48px !important;
    min-height: 48px !important;
    padding-inline: 12px !important;
  }

  html.lme-platform-mobile body #messageForm .send-btn,
  html[data-lme-platform="mobile"] body #messageForm .send-btn {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
  }

  html.lme-platform-mobile body #participantProfileBody .profile-modal-actions,
  html[data-lme-platform="mobile"] body #participantProfileBody .profile-modal-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* ---------- Landscape phones ---------- */
@media (orientation: landscape) and (max-height: 560px) and (pointer: coarse) {
  :root {
    --lme-mobile-header-v566: 54px;
    --lme-mobile-composer-v566: 62px;
  }

  html.lme-platform-mobile body #chatSidebar .sidebar-top,
  html[data-lme-platform="mobile"] body #chatSidebar .sidebar-top,
  html.lme-platform-mobile body .chat-main-top,
  html[data-lme-platform="mobile"] body .chat-main-top {
    padding-top: max(4px, var(--lme-mobile-safe-top-v566)) !important;
  }

  html.lme-platform-mobile body #participantProfileHero,
  html[data-lme-platform="mobile"] body #participantProfileHero {
    min-height: 210px !important;
    max-height: 250px !important;
  }

  html.lme-platform-mobile body #callPanel .call-stage-main,
  html[data-lme-platform="mobile"] body #callPanel .call-stage-main {
    padding: 10px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.lme-platform-mobile body *,
  html.lme-platform-mobile body *::before,
  html.lme-platform-mobile body *::after {
    scroll-behavior: auto !important;
  }
}