/* ======================================================================
   WA Archive mobile UI v4.4.0
   Mobile-first application shell. Desktop is intentionally untouched.
   ====================================================================== */
.mobileListActions,.mobileArchiveComposer,.mobileContactMeta{display:none}

@media (max-width:780px){
  :root{
    --m-bg:#091116;
    --m-surface:#0f181d;
    --m-surface-2:#162127;
    --m-surface-3:#1d2a31;
    --m-line:rgba(255,255,255,.065);
    --m-text:#f1f5f6;
    --m-muted:#91a0a7;
    --m-faint:#68777e;
    --m-green:#20c875;
    --m-green-soft:rgba(32,200,117,.14);
    --m-in:#1b272d;
    --m-out:#075d4d;
    --m-danger:#ff7d87;
    --m-nav-h:62px;
    --m-radius:16px;
  }

  html{background:var(--m-bg)!important;color-scheme:dark}
  body{background:var(--m-bg)!important;color:var(--m-text)!important;-webkit-tap-highlight-color:transparent}
  button,a,input,select{touch-action:manipulation}
  input,select,textarea{font-size:16px!important}

  /* --------------------------- Global shell --------------------------- */
  .mobileBottomNav{
    position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:90!important;
    display:grid!important;grid-template-columns:repeat(4,1fr)!important;
    height:calc(var(--m-nav-h) + env(safe-area-inset-bottom))!important;
    padding:4px 10px env(safe-area-inset-bottom)!important;
    border:0!important;border-top:1px solid var(--m-line)!important;border-radius:0!important;
    background:rgba(12,20,25,.96)!important;box-shadow:0 -8px 30px rgba(0,0,0,.18)!important;
    backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
  }
  .mobileBottomNav:before{display:none!important}
  .mobileBottomNav a,.mobileBottomNav button{
    min-width:0!important;min-height:54px!important;padding:3px 0!important;margin:0!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;
    border:0!important;border-radius:12px!important;background:transparent!important;box-shadow:none!important;
    color:#7d8d95!important;text-decoration:none!important;font-size:10px!important;font-weight:650!important;
  }
  .mobileNavGlyph{width:40px!important;height:27px!important;display:grid!important;place-items:center!important;border-radius:999px!important;color:inherit!important}
  .mobileNavGlyph svg{width:20px!important;height:20px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
  .mobileBottomNav .active{color:#dff8e9!important}
  .mobileBottomNav .active .mobileNavGlyph{background:var(--m-green-soft)!important;color:var(--m-green)!important}
  .mobileNavLabel{line-height:1.1!important}

  body:not(:has(.chatWorkspace)){
    padding:0 0 calc(var(--m-nav-h) + env(safe-area-inset-bottom))!important;
    background:var(--m-bg)!important;
  }
  body:not(:has(.chatWorkspace)) .wrap{width:100%!important;max-width:none!important;margin:0!important;padding:0 0 12px!important}
  body:not(:has(.chatWorkspace)) .footer{display:none!important}
  body:not(:has(.chatWorkspace)) .topbar{
    min-height:calc(56px + env(safe-area-inset-top))!important;
    padding:calc(7px + env(safe-area-inset-top)) 14px 7px!important;
    border:0!important;border-bottom:1px solid var(--m-line)!important;
    background:rgba(12,20,25,.96)!important;box-shadow:none!important;backdrop-filter:blur(18px)!important;
  }
  body:not(:has(.chatWorkspace)) .topbar .nav{display:none!important}
  body:not(:has(.chatWorkspace)) .brand{gap:9px!important}
  body:not(:has(.chatWorkspace)) .brandIcon{width:34px!important;height:34px!important;border:0!important;border-radius:10px!important;background:var(--m-green)!important;color:#062519!important;box-shadow:none!important;font-size:10px!important}
  body:not(:has(.chatWorkspace)) .brandCopy strong{font-size:15px!important;font-weight:720!important;color:var(--m-text)!important}
  body:not(:has(.chatWorkspace)) .brandCopy small,body:not(:has(.chatWorkspace)) .versionMark{display:none!important}
  body:not(:has(.chatWorkspace)) .topActions .logout{display:none!important}

  /* Generic mobile pages */
  .hero,.hero.compact{
    margin:0!important;padding:20px 16px 14px!important;border:0!important;border-radius:0!important;
    background:var(--m-bg)!important;box-shadow:none!important;
  }
  .hero .eyebrow,.hero.compact .eyebrow{margin:0 0 5px!important;color:var(--m-green)!important;font-size:10px!important;letter-spacing:.08em!important}
  .hero h1,.hero.compact h1{margin:0 0 5px!important;color:var(--m-text)!important;font-size:25px!important;line-height:1.1!important;font-weight:760!important;letter-spacing:-.7px!important}
  .hero .muted,.hero.compact .muted{margin:0!important;color:var(--m-muted)!important;font-size:12px!important;line-height:1.45!important}
  .hero .actions{margin-top:12px!important;gap:7px!important}
  .hero .actions .button{min-height:36px!important;padding:0 12px!important;border-radius:10px!important;font-size:11px!important}

  .panel{
    margin:0 12px 10px!important;padding:14px!important;border:1px solid var(--m-line)!important;border-radius:16px!important;
    background:var(--m-surface)!important;box-shadow:none!important;
  }
  .panel.flush{padding:0!important;overflow:hidden!important}
  .panel h2{font-size:16px!important;letter-spacing:-.2px!important}
  .button,button{min-height:42px}
  .primary{background:var(--m-green)!important;border-color:var(--m-green)!important;color:#052318!important;box-shadow:none!important}
  .secondary{background:var(--m-surface-2)!important;border-color:var(--m-line)!important;color:#dce5e8!important;box-shadow:none!important}

  .filters,.proFilters,.deletedFilters,.mediaFilters{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  .filters>input:first-of-type,.proFilters>input[name="q"],.deletedFilters>input[name="q"],.mediaFilters>input[name="q"]{grid-column:1/-1!important}
  .filters input,.filters select,.proFilters input,.proFilters select,.deletedFilters input,.deletedFilters select,.mediaFilters input,.mediaFilters select{
    width:100%!important;min-width:0!important;height:44px!important;min-height:44px!important;padding:0 11px!important;
    border:1px solid var(--m-line)!important;border-radius:11px!important;background:var(--m-surface-2)!important;color:var(--m-text)!important;box-shadow:none!important;
  }
  .filters button,.proFilters button,.deletedFilters button,.mediaFilters button{grid-column:1/-1!important;width:100%!important;border-radius:11px!important}
  .proFilters .check{grid-column:1/-1!important;min-height:40px!important;padding:0 4px!important;color:var(--m-muted)!important}

  .messageList{background:transparent!important}
  .messageItem{
    position:relative!important;display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;gap:10px!important;
    margin:0!important;padding:12px!important;border:0!important;border-bottom:1px solid var(--m-line)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
  }
  .messageItem:last-child{border-bottom:0!important}
  .messageItem .avatar{width:44px!important;height:44px!important;border:0!important;border-radius:50%!important;background:#223239!important;color:#dfe7ea!important}
  .messageMain{min-width:0!important}
  .messageTop{gap:8px!important}.messageTop strong{font-size:14px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.messageTop span{font-size:10px!important;color:var(--m-faint)!important}
  .messageMeta{margin-top:3px!important;gap:4px!important;color:var(--m-faint)!important;font-size:9.5px!important;white-space:nowrap!important;overflow:hidden!important}
  .messageMain p{margin:5px 0 0!important;color:#bdc8cd!important;font-size:12.5px!important;line-height:1.35!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important}
  .messageItem .rowBadges,.deletedBadgeStack{grid-column:2!important;justify-content:flex-start!important;margin-top:3px!important;gap:4px!important}
  .badge{padding:3px 6px!important;border-radius:999px!important;font-size:8px!important;letter-spacing:.02em!important}
  .pager{padding:4px 12px 12px!important}

  .deletedStats{grid-template-columns:1fr 1fr!important;gap:8px!important;margin:0 12px 10px!important}
  .deletedStats a{min-height:86px!important;padding:13px!important;border:1px solid var(--m-line)!important;border-radius:14px!important;background:var(--m-surface)!important;box-shadow:none!important}
  .deletedStats a span{font-size:10px!important}.deletedStats a strong{font-size:24px!important}

  .mediaGrid{grid-template-columns:1fr 1fr!important;gap:8px!important;margin:0 12px!important}
  .mediaCard{border:1px solid var(--m-line)!important;border-radius:14px!important;background:var(--m-surface)!important;overflow:hidden!important;box-shadow:none!important}
  .mediaPreview{aspect-ratio:1/1!important;min-height:0!important;background:#071015!important}.mediaPreview img,.mediaPreview video{width:100%!important;height:100%!important;object-fit:cover!important}
  .mediaInfo{padding:9px!important}.mediaInfo strong{font-size:11px!important}.mediaInfo span,.mediaInfo small{font-size:9px!important}.mediaInfo .actions{gap:5px!important}.mediaInfo .button{min-height:30px!important;padding:0 8px!important;font-size:9px!important}

  .accountCards{display:block!important;margin:0!important}
  .accountCard{margin:0 12px 10px!important;padding:14px!important}
  .accountHead{align-items:flex-start!important}.accountHead h2{font-size:17px!important}.accountPhone{font-size:11px!important}.accountStatus{margin-top:1px!important}
  .accountDetail{font-size:11px!important;color:var(--m-muted)!important}
  .accountHealthStrip{grid-template-columns:1fr 1fr!important;gap:7px!important}
  .accountHealthStrip>div{padding:9px!important;border-radius:10px!important;background:var(--m-surface-2)!important}.accountHealthStrip>div:last-child{grid-column:1/-1!important}
  .accountHealthStrip span{font-size:8.5px!important}.accountHealthStrip strong{font-size:10px!important}
  .sessionRecoveryBox{padding:11px!important;border:1px solid var(--m-line)!important;border-radius:12px!important;background:#0b1419!important}
  .sessionRecoveryActions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}.sessionRecoveryActions>*{min-width:0!important}.sessionRecoveryActions button{width:100%!important;min-width:0!important;font-size:10px!important}
  .accountCard>.actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}.accountCard>.actions form{margin:0!important}.accountCard>.actions button{width:100%!important;min-width:0!important;padding:0 8px!important;font-size:10px!important}.accountCard>.actions form:last-child{grid-column:1/-1!important}
  .sessionRecoveryNotice{display:none!important}
  .addAccount{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}.addAccount input,.addAccount button{width:100%!important}

  /* ------------------------------ Chats ------------------------------- */
  body:has(.chatWorkspace){overflow:hidden!important;padding:0!important;background:var(--m-bg)!important}
  body:has(.chatWorkspace) .topbar,body:has(.chatWorkspace) .footer{display:none!important}
  body:has(.chatWorkspace) .wrap{width:100%!important;max-width:none!important;height:auto!important;margin:0!important;padding:0!important}

  body.chatListOnly .chatWorkspace,body:has(.chatWorkspace[data-chat=""]) .chatWorkspace{
    height:calc(var(--app-height,100dvh) - var(--m-nav-h) - env(safe-area-inset-bottom))!important;
    min-height:0!important;display:grid!important;grid-template-columns:1fr!important;
    border:0!important;border-radius:0!important;background:var(--m-surface)!important;box-shadow:none!important;
  }
  body.chatListOnly .chatRail,body:has(.chatWorkspace[data-chat=""]) .chatRail{
    display:flex!important;flex-direction:column!important;min-height:0!important;border:0!important;background:var(--m-surface)!important;
  }
  body.chatListOnly .chatStage,body:has(.chatWorkspace[data-chat=""]) .chatStage{display:none!important}

  .chatRailHeader{
    order:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
    min-height:calc(59px + env(safe-area-inset-top))!important;
    padding:calc(11px + env(safe-area-inset-top)) 10px 7px 16px!important;
    border:0!important;background:var(--m-surface)!important;box-shadow:none!important;
  }
  .chatRailHeader .sectionKicker,.chatRailHeader>.liveDotWrap{display:none!important}
  .chatRailHeader h1{margin:0!important;color:var(--m-text)!important;font-size:27px!important;line-height:1!important;font-weight:760!important;letter-spacing:-.8px!important}
  .mobileListActions{display:flex!important;align-items:center!important;gap:2px!important}
  .mobileHeaderIcon{
    width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;display:grid!important;place-items:center!important;
    border:0!important;border-radius:50%!important;background:transparent!important;color:#d3dde1!important;box-shadow:none!important;
  }
  .mobileHeaderIcon:active{background:rgba(255,255,255,.06)!important}
  .mobileHeaderIcon svg{width:21px!important;height:21px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
  .mobileChatsMoreButton svg{fill:currentColor!important;stroke:none!important}

  .chatSearch{order:1!important;display:block!important;margin:0!important;padding:4px 12px 7px!important;background:var(--m-surface)!important}
  .chatSearch .searchField{
    height:42px!important;min-height:42px!important;display:flex!important;align-items:center!important;
    border:1px solid transparent!important;border-radius:13px!important;background:var(--m-surface-2)!important;box-shadow:none!important;transition:.15s ease!important;
  }
  .chatSearch .searchField:focus-within{border-color:rgba(32,200,117,.38)!important;background:#19262c!important}
  .chatSearch .searchIcon{position:static!important;flex:0 0 40px!important;width:40px!important;height:40px!important;display:grid!important;place-items:center!important;color:#84949b!important}
  .chatSearch .searchIcon svg{width:18px!important;height:18px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important}
  .chatSearch input{height:40px!important;min-height:40px!important;padding:0 12px 0 0!important;border:0!important;background:transparent!important;color:var(--m-text)!important;outline:0!important;box-shadow:none!important}
  .chatSearch input::placeholder{color:#829199!important}.iconSearchBtn{display:none!important}

  .chatTypeTabs{
    order:2!important;display:flex!important;gap:7px!important;margin:0!important;padding:2px 12px 9px!important;
    overflow-x:auto!important;scrollbar-width:none!important;border:0!important;background:var(--m-surface)!important;
  }
  .chatTypeTabs::-webkit-scrollbar{display:none!important}
  .chatTypeTabs a{
    flex:0 0 auto!important;min-height:31px!important;padding:0 12px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
    border:1px solid var(--m-line)!important;border-radius:999px!important;background:transparent!important;color:#9eabb1!important;
    font-size:11.5px!important;font-weight:650!important;text-decoration:none!important;box-shadow:none!important;
  }
  .chatTypeTabs a.active{border-color:transparent!important;background:var(--m-green-soft)!important;color:#75e0a7!important}
  .chatTypeTabs .chatDeletedShortcut{color:#a7b2b7!important}

  .accountSwitcher{order:3!important;display:flex!important;margin:0!important;padding:0 12px 7px!important;background:var(--m-surface)!important}
  .accountSwitcher.singleAccountSwitcher{display:none!important}
  .accountSwitcher select{
    width:auto!important;max-width:84vw!important;height:30px!important;min-height:30px!important;padding:0 29px 0 11px!important;
    border:0!important;border-radius:9px!important;background:#121e24!important;color:#91a0a7!important;box-shadow:none!important;font-size:11px!important;font-weight:600!important;
  }
  .chatRailMeta{display:none!important}

  .chatListPro{
    order:4!important;flex:1!important;min-height:0!important;padding:0!important;overflow-y:auto!important;overflow-x:hidden!important;
    border:0!important;background:var(--m-surface)!important;scrollbar-width:none!important;overscroll-behavior-y:contain!important;-webkit-overflow-scrolling:touch!important;
  }
  .chatListPro::-webkit-scrollbar{display:none!important}
  .chatRowPro{
    position:relative!important;display:grid!important;grid-template-columns:52px minmax(0,1fr)!important;gap:11px!important;
    min-height:72px!important;margin:0!important;padding:10px 12px!important;border:0!important;border-radius:0!important;
    background:transparent!important;box-shadow:none!important;text-decoration:none!important;
  }
  .chatRowPro:after{content:""!important;position:absolute!important;left:75px!important;right:12px!important;bottom:0!important;height:1px!important;background:var(--m-line)!important}
  .chatRowPro:last-child:after{display:none!important}.chatRowPro:active{background:#142027!important}.chatRowPro.active{background:transparent!important}
  .chatAvatarWrap{width:52px!important;min-width:52px!important;position:relative!important}
  .chatAvatar,.chatAvatar.big{width:52px!important;height:52px!important;border:0!important;border-radius:50%!important;background:#24343b!important;color:#d9e2e5!important;box-shadow:none!important}
  .chatAvatar span{font-size:16px!important;font-weight:650!important}.chatAvatar img{width:100%!important;height:100%!important;border-radius:50%!important;object-fit:cover!important}
  .pinMark{right:-1px!important;bottom:0!important;width:14px!important;height:14px!important;border:2px solid var(--m-surface)!important;border-radius:50%!important;background:var(--m-green)!important;color:transparent!important;font-size:0!important}
  .chatRowBody{min-width:0!important;padding:2px 0 0!important}
  .chatRowTop{display:flex!important;align-items:baseline!important;gap:8px!important;min-width:0!important}
  .chatRowTop strong{flex:1!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#edf2f3!important;font-size:15.5px!important;line-height:1.28!important;font-weight:680!important;letter-spacing:-.15px!important}
  .chatRowTop time{flex:0 0 auto!important;color:#708087!important;font-size:10.5px!important;font-weight:500!important;font-variant-numeric:tabular-nums!important}
  .starMark{color:var(--m-green)!important;font-size:10px!important}.chatNumber,.miniBadges{display:none!important}
  .chatPreview{display:block!important;margin:5px 0 0!important;min-width:0!important;color:#8d9ba2!important}
  .chatPreview>span{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:inherit!important;font-size:12.5px!important;line-height:1.35!important}
  .chatPreview.deletedPreview>span{color:#8d9ba2!important;font-style:italic!important}
  .chatEmpty{padding:72px 28px!important;background:transparent!important;color:var(--m-muted)!important;text-align:center!important;font-size:13px!important}.chatEmpty span{color:var(--m-faint)!important}

  /* --------------------------- Open chat ------------------------------ */
  body.chatOpen{padding:0!important;overflow:hidden!important;background:var(--m-bg)!important}
  body.chatOpen .mobileBottomNav,body.chatOpen .topbar,body.chatOpen .footer{display:none!important}
  body.chatOpen .chatWorkspace,body:has(.chatWorkspace:not([data-chat=""])) .chatWorkspace{
    height:var(--app-height,100dvh)!important;min-height:0!important;display:grid!important;grid-template-columns:1fr!important;
    border:0!important;border-radius:0!important;background:var(--m-bg)!important;box-shadow:none!important;
  }
  body.chatOpen .chatRail,body:has(.chatWorkspace:not([data-chat=""])) .chatRail{display:none!important}
  body.chatOpen .chatStage,body:has(.chatWorkspace:not([data-chat=""])) .chatStage{
    display:flex!important;flex-direction:column!important;min-height:0!important;background:var(--m-bg)!important;
  }

  .contactBar{
    flex:0 0 auto!important;position:relative!important;z-index:20!important;display:flex!important;align-items:center!important;gap:3px!important;
    min-height:calc(58px + env(safe-area-inset-top))!important;padding:calc(5px + env(safe-area-inset-top)) 6px 5px 2px!important;
    border:0!important;border-bottom:1px solid var(--m-line)!important;background:#0f181d!important;box-shadow:0 2px 12px rgba(0,0,0,.10)!important;
  }
  .mobileChatBack{flex:0 0 40px!important;width:40px!important;height:42px!important;min-height:42px!important;padding:0!important;display:grid!important;place-items:center!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#dbe3e6!important;box-shadow:none!important;font-size:0!important}
  .mobileChatBack svg{width:24px!important;height:24px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
  .mobileChatBack:active,.mobileChatMenuButton:active,.contactActions>.secondary.compactAction:active{background:rgba(255,255,255,.06)!important}
  .contactMain{display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important;flex:1!important}
  .contactAvatar{width:39px!important;height:39px!important;flex:0 0 39px!important;border:0!important;border-radius:50%!important;background:#293a42!important;box-shadow:none!important;overflow:hidden!important}
  .contactAvatar img{width:100%!important;height:100%!important;border-radius:50%!important;object-fit:cover!important}
  .contactText{min-width:0!important;flex:1!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
  .contactTitleRow{display:block!important;min-width:0!important}.contactTitleRow h2{margin:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#f3f6f7!important;font-size:15.5px!important;line-height:1.22!important;font-weight:620!important;letter-spacing:-.1px!important}
  .contactNumber{margin-top:2px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#87969d!important;font-size:10.5px!important;line-height:1.2!important;font-weight:450!important}
  .contactNumber.mobileHideDuplicate{display:none!important}
  .mobileContactMeta{display:none!important;margin-top:3px!important;align-items:center!important;gap:5px!important;color:#839299!important;font-size:10px!important;line-height:1!important}
  .contactNumber.mobileHideDuplicate + .mobileContactMeta{display:flex!important}
  .mobileContactLiveDot{width:5px!important;height:5px!important;border-radius:50%!important;background:var(--m-green)!important;box-shadow:0 0 0 2px rgba(32,200,117,.10)!important}.mobileContactLiveDot.offline{background:#6e7d84!important;box-shadow:none!important}
  .contactSub,.favoritePill,.deletedCountPill{display:none!important}
  .contactActions{display:flex!important;align-items:center!important;gap:2px!important;margin-left:auto!important;flex:0 0 auto!important}
  .contactActions>.secondary.compactAction,.mobileChatMenuButton{width:38px!important;height:38px!important;min-height:38px!important;padding:0!important;display:grid!important;place-items:center!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#d6dfe2!important;box-shadow:none!important;font-size:0!important;appearance:none!important;-webkit-tap-highlight-color:transparent!important}
  .threadSearchAction{position:relative!important}.threadSearchAction svg{width:19px!important;height:19px!important;display:block!important;fill:none!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important;overflow:visible!important}.threadSearchAction span{display:none!important}.threadSearchAction::after{content:"";position:absolute!important;inset:0!important;border-radius:50%!important;pointer-events:none!important}.threadSearchAction:active::after,.mobileChatMenuButton:active::after{background:rgba(255,255,255,.07)!important}
  .contactActions .desktopActionMenu,.contactActions .quickForm{display:none!important}.mobileChatMenuButton svg{width:19px!important;height:19px!important;fill:currentColor!important}

  .threadSearchBar{flex:0 0 auto!important;padding:6px 8px!important;border:0!important;border-bottom:1px solid var(--m-line)!important;background:#111b21!important}
  .threadSearchBar .searchField{height:40px!important;min-height:40px!important;border:0!important;border-radius:11px!important;background:var(--m-surface-2)!important}.threadSearchBar input{height:40px!important;min-height:40px!important;border:0!important;background:transparent!important}.threadSearchBar .linkbtn{min-height:40px!important;padding:0 8px!important;color:#65d79b!important;font-size:11px!important}.threadSearchResults{border:0!important;border-radius:12px!important;background:#121d22!important;box-shadow:0 16px 40px rgba(0,0,0,.34)!important}

  .threadViewport{
    flex:1!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:none!important;
    background:linear-gradient(180deg,#091116 0%,#0a1318 55%,#091116 100%)!important;
    overscroll-behavior-y:contain!important;-webkit-overflow-scrolling:touch!important;
  }
  .threadViewport::-webkit-scrollbar{display:none!important}
  .threadInner{width:100%!important;max-width:none!important;margin:0!important;padding:11px 9px 18px!important}
  .loadOlderButton{display:block!important;margin:0 auto 10px!important;min-height:28px!important;padding:0 9px!important;border:0!important;border-radius:999px!important;background:#172329!important;color:#85959c!important;box-shadow:none!important;font-size:9.5px!important;font-weight:550!important}.loadOlderButton:disabled{display:none!important}
  .dateDivider{margin:5px 0 10px!important;text-align:center!important}.dateDivider span{display:inline-flex!important;align-items:center!important;min-height:25px!important;padding:0 9px!important;border:1px solid rgba(255,255,255,.04)!important;border-radius:8px!important;background:#172329!important;color:#a8b5ba!important;box-shadow:none!important;font-size:10px!important;font-weight:550!important}

  .proBubbleRow{display:flex!important;margin:2px 0!important;padding:0!important}.proBubbleRow.mine{justify-content:flex-end!important}.proBubbleRow.theirs{justify-content:flex-start!important}
  .proBubble{
    position:relative!important;max-width:min(82%,560px)!important;min-width:52px!important;margin:0!important;padding:7px 9px 5px!important;
    border:0!important;border-radius:12px!important;background:var(--m-in)!important;color:#edf2f3!important;box-shadow:0 1px 2px rgba(0,0,0,.18)!important;overflow:hidden!important;text-decoration:none!important;
  }
  .proBubbleRow.mine .proBubble{background:var(--m-out)!important}.proBubbleRow.mine + .proBubbleRow.mine,.proBubbleRow.theirs + .proBubbleRow.theirs{margin-top:1px!important}.proBubbleRow.mine + .proBubbleRow.theirs,.proBubbleRow.theirs + .proBubbleRow.mine{margin-top:7px!important}
  .proBubbleRow.mine + .proBubbleRow.mine .proBubble{border-top-right-radius:6px!important}.proBubbleRow.theirs + .proBubbleRow.theirs .proBubble{border-top-left-radius:6px!important}
  .proBubble:before{display:none!important}.proBubble.isLocalDeleted{outline:none!important}.proBubble.isDeleted{opacity:.93!important}.proBubbleRow.theirs + .proBubbleRow.theirs .bubbleAuthor{display:none!important}
  .bubbleAuthor{margin:0 0 3px!important;color:#66c9f4!important;font-size:10.5px!important;line-height:1.2!important;font-weight:620!important}
  .bubbleBody{color:#eef2f3!important;font-size:14.5px!important;line-height:1.34!important;letter-spacing:0!important;overflow-wrap:anywhere!important;white-space:pre-wrap!important}
  .bubbleFooter{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:5px!important;min-height:12px!important;margin-top:3px!important;color:#91a0a7!important;font-size:9px!important;line-height:1!important}
  .bubbleFooter time{font-size:9px!important;font-weight:450!important;font-variant-numeric:tabular-nums!important}
  .stateTag{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#91a0a7!important;font-size:8.5px!important;line-height:1!important;font-weight:500!important;text-transform:none!important;letter-spacing:0!important}.stateTag.deletedTag{color:#c9a0a5!important}.stateTag.localDeletedTag{color:#9aa8ae!important}
  .quotedReply{margin:0 0 5px!important;padding:5px 7px!important;border:0!important;border-left:3px solid var(--m-green)!important;border-radius:6px!important;background:rgba(0,0,0,.16)!important}.quotedReply small{font-size:8px!important}.quotedReply span{font-size:10.5px!important}
  .proBubble.hasInlineMedia{max-width:min(84%,520px)!important;padding:4px 4px 5px!important}.inlineMediaPreview{margin:0 0 5px!important;border:0!important;border-radius:9px!important;overflow:hidden!important;background:#0d161a!important;width:min(210px,64vw)!important;cursor:zoom-in!important}.inlineMediaPreview img{display:block!important;width:100%!important;max-height:180px!important;object-fit:cover!important}.inlineMediaPreview.stickerPreview{width:min(170px,56vw)!important;background:transparent!important}.inlineMediaPreview.stickerPreview img{max-height:170px!important;object-fit:contain!important}.inlineMediaFile{border:0!important;border-radius:9px!important;background:rgba(0,0,0,.14)!important}
  .newMessageJump{right:13px!important;bottom:12px!important;width:38px!important;min-width:38px!important;height:38px!important;min-height:38px!important;padding:0!important;border:1px solid var(--m-line)!important;border-radius:50%!important;background:#172329!important;color:#dce5e8!important;box-shadow:0 6px 18px rgba(0,0,0,.28)!important;font-size:0!important}.newMessageJump:before{content:"↓"!important;font-size:17px!important}

  .archiveStatusBar{display:none!important}
  .mobileArchiveComposer{
    flex:0 0 auto!important;display:flex!important;align-items:center!important;min-height:calc(49px + env(safe-area-inset-bottom))!important;
    padding:5px 9px calc(5px + env(safe-area-inset-bottom))!important;border-top:1px solid var(--m-line)!important;background:#0c151a!important;
  }
  .archiveComposerPill{min-width:0!important;flex:1!important;height:39px!important;padding:0 11px!important;display:flex!important;align-items:center!important;gap:8px!important;border:0!important;border-radius:12px!important;background:#151f25!important;box-shadow:none!important}
  .mobileArchiveLock{width:18px!important;height:18px!important;flex:0 0 18px!important;display:grid!important;place-items:center!important;background:transparent!important;color:#788990!important}.mobileArchiveLock svg{width:16px!important;height:16px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
  .mobileArchiveComposerText{min-width:0!important;flex:1!important;padding:0!important;background:transparent!important}.mobileArchiveComposerText strong{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#aebbc0!important;font-size:11.5px!important;font-weight:550!important}.mobileArchiveComposerText small{display:none!important}
  .archiveLiveBadge{flex:0 0 auto!important;display:inline-flex!important;align-items:center!important;gap:5px!important;height:22px!important;padding:0 7px!important;border-radius:999px!important;background:var(--m-green-soft)!important;color:#7ae4aa!important;font-size:8.5px!important;font-weight:700!important;letter-spacing:.02em!important}.archiveLiveBadge i{width:5px!important;height:5px!important;border-radius:50%!important;background:var(--m-green)!important;box-shadow:none!important}.archiveLiveBadge.offline{background:rgba(130,145,153,.10)!important;color:#87969d!important}.archiveLiveBadge.offline i{background:#718087!important}

  /* --------------------------- Bottom sheets -------------------------- */
  .mobileMoreSheet,.mobileChatActionSheet{position:fixed!important;inset:0!important;z-index:180!important;visibility:hidden!important;pointer-events:none!important}
  .mobileMoreSheet.open,.mobileChatActionSheet.open{visibility:visible!important;pointer-events:auto!important}
  .mobileSheetBackdrop,.mobileChatActionBackdrop{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0!important;border-radius:0!important;background:rgba(0,0,0,.58)!important;opacity:0!important;transition:opacity .18s ease!important}
  .mobileMoreSheet.open .mobileSheetBackdrop,.mobileChatActionSheet.open .mobileChatActionBackdrop{opacity:1!important}
  .mobileSheetCard,.mobileChatActionCard{position:absolute!important;left:0!important;right:0!important;bottom:0!important;max-height:min(78dvh,650px)!important;overflow:auto!important;padding:7px 12px calc(14px + env(safe-area-inset-bottom))!important;border:0!important;border-radius:22px 22px 0 0!important;background:#10191e!important;box-shadow:0 -24px 65px rgba(0,0,0,.45)!important;transform:translateY(102%)!important;transition:transform .22s ease!important;-webkit-overflow-scrolling:touch!important}
  .mobileMoreSheet.open .mobileSheetCard,.mobileChatActionSheet.open .mobileChatActionCard{transform:translateY(0)!important}
  .mobileSheetHandle{width:34px!important;height:4px!important;margin:2px auto 10px!important;border-radius:99px!important;background:#445159!important}
  .mobileSheetHead,.mobileChatActionHead{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:2px 2px 12px!important;border-bottom:1px solid var(--m-line)!important;margin-bottom:7px!important}
  .mobileSheetBrand{display:flex!important;align-items:center!important;gap:9px!important}.mobileSheetBrandIcon{width:32px!important;height:32px!important;display:grid!important;place-items:center!important;border-radius:10px!important;background:var(--m-green)!important;color:#052318!important;font-size:9px!important;font-weight:900!important}.mobileSheetBrand strong{display:block!important;font-size:14px!important}.mobileSheetBrand small{display:block!important;margin-top:2px!important;color:var(--m-faint)!important;font-size:9.5px!important}
  .mobileSheetClose,.mobileChatActionClose{width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;border:0!important;border-radius:50%!important;background:#18242a!important;color:#c5d0d4!important;font-size:21px!important;box-shadow:none!important}
  .mobileSheetGrid{display:grid!important;grid-template-columns:1fr!important;gap:4px!important}
  .mobileSheetLink,.mobileSheetGrid button.mobileSheetLink,.mobileActionRow{width:100%!important;min-height:54px!important;padding:8px 7px!important;display:flex!important;align-items:center!important;gap:11px!important;border:0!important;border-radius:12px!important;background:transparent!important;color:var(--m-text)!important;text-align:left!important;text-decoration:none!important;box-shadow:none!important}
  .mobileSheetLink:active,.mobileActionRow:active{background:#172329!important}.mobileSheetLinkIcon,.mobileActionIcon{width:36px!important;height:36px!important;flex:0 0 36px!important;display:grid!important;place-items:center!important;border-radius:11px!important;background:#17252b!important;color:#6dde9f!important}.mobileSheetLinkIcon svg,.mobileActionIcon svg{width:18px!important;height:18px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}.mobileSheetLink>span:last-child{min-width:0!important}.mobileSheetLink strong{display:block!important;font-size:13px!important;font-weight:650!important}.mobileSheetLink small{display:block!important;margin-top:2px!important;color:#77878e!important;font-size:9.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .mobileLogout{margin:7px 0 0!important;padding-top:8px!important;border-top:1px solid var(--m-line)!important}.mobileLogout button{width:100%!important;border-radius:11px!important;background:rgba(255,92,103,.08)!important;border-color:rgba(255,92,103,.18)!important;color:#ff8d96!important}
  .mobileChatActionHead>div{min-width:0!important}.mobileChatActionHead strong,.mobileChatActionHead small{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.mobileChatActionHead strong{font-size:14px!important}.mobileChatActionHead small{margin-top:2px!important;color:var(--m-faint)!important;font-size:9.5px!important}.mobileActionRow{min-height:52px!important;font-size:13px!important;font-weight:580!important}.mobileActionDetails>summary{list-style:none!important;cursor:pointer!important}.mobileActionDetails>summary::-webkit-details-marker{display:none!important}.mobileActionDetails[open]{border-radius:12px!important;background:#0c151a!important}.mobileExportGrid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important;padding:7px!important}.mobileExportGrid a{min-height:40px!important;display:grid!important;place-items:center!important;border:1px solid var(--m-line)!important;border-radius:10px!important;background:#172329!important;color:#dce5e8!important;font-size:11px!important;font-weight:700!important}.mobileInlineForm{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:6px!important;padding:7px!important}.mobileInlineForm input{min-width:0!important;height:42px!important;border-radius:10px!important}.mobileInlineForm button{min-height:42px!important;border-radius:10px!important}
  body.mobileSheetOpen,body.mobileChatActionsOpen{overflow:hidden!important}
}

@media (max-width:430px){
  .chatRailHeader h1{font-size:26px!important}
  .chatRowPro{grid-template-columns:50px minmax(0,1fr)!important;gap:10px!important;padding-left:10px!important;padding-right:10px!important}
  .chatAvatarWrap{width:50px!important;min-width:50px!important}.chatAvatar,.chatAvatar.big{width:50px!important;height:50px!important}.chatRowPro:after{left:70px!important;right:10px!important}
  .proBubble{max-width:86%!important}.proBubble.hasInlineMedia{max-width:85%!important}
  .mediaGrid{gap:7px!important;margin-left:10px!important;margin-right:10px!important}
}

@media(prefers-reduced-motion:reduce){
  .mobileSheetBackdrop,.mobileChatActionBackdrop,.mobileSheetCard,.mobileChatActionCard{transition:none!important}
}

/* v4.5 mobile Media: compact gallery + storage controls */
@media(max-width:780px){
  .mediaHeroV45{margin:0 12px 10px!important;padding:15px!important;border:1px solid var(--m-line)!important;border-radius:16px!important;background:var(--m-surface)!important}.mediaHeroV45 h1{font-size:22px!important}.mediaHeroV45 .muted{font-size:10.5px!important;line-height:1.45!important}.mediaHeroStorage{margin-top:10px!important;align-items:flex-start!important;padding:0!important;border:0!important;background:transparent!important}.mediaHeroStorage strong{font-size:19px!important}.mediaHeroStorage span{font-size:9px!important}
  .mediaNotice{margin:0 12px 10px!important;border-radius:12px!important;font-size:10px!important}
  .mediaStorageOverview{display:flex!important;gap:8px!important;margin:0 0 10px!important;padding:0 12px!important;overflow-x:auto!important;scroll-snap-type:x proximity!important;scrollbar-width:none!important}.mediaStorageOverview::-webkit-scrollbar{display:none}.mediaStorageStat{flex:0 0 72%!important;min-height:78px!important;padding:11px!important;border:1px solid var(--m-line)!important;border-radius:14px!important;background:var(--m-surface)!important;box-shadow:none!important;scroll-snap-align:start!important}.mediaStorageIcon{width:34px!important;height:34px!important;border-radius:10px!important}.mediaStorageStat strong{font-size:17px!important}.mediaStorageStat em{font-size:8px!important}
  .mediaControlPanel{margin:0 12px 10px!important;padding:13px!important}.mediaControlHead{margin-bottom:11px!important}.mediaControlHead h2{font-size:16px!important}.mediaControlHead p:not(.sectionKicker){font-size:9.5px!important;line-height:1.4!important}.mediaPolicyBadge{display:none!important}
  .mediaPolicyForm{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.mediaToggleField{grid-column:1/-1!important;min-height:56px!important;padding:9px 10px!important}.mediaToggleField strong{font-size:11px!important}.mediaToggleField small{font-size:8px!important}.mediaPolicyForm>label:not(.mediaToggleField){font-size:8.5px!important}.mediaPolicyForm select{height:43px!important;min-height:43px!important;font-size:14px!important}.mediaPolicyForm>label:nth-of-type(4){grid-column:1/-1!important}.mediaSavePolicy{grid-column:1/-1!important;min-height:44px!important}
  .mediaMaintenanceRow{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}.mediaMaintenanceRow form,.mediaMaintenanceRow button{width:100%!important}.mediaMaintenanceRow .secondary{min-height:40px!important;padding:6px 8px!important;font-size:9px!important}.mediaMaintenanceRow p{grid-column:1/-1!important;margin:0!important;font-size:8px!important;line-height:1.35!important}
  .mediaFilterPanel{margin:0 12px 10px!important;padding:11px!important}.mediaFilterPanel .mediaFilters{grid-template-columns:1fr 1fr!important}.mediaFilterPanel .mediaFilters>input[name="q"]{grid-column:1/-1!important}.mediaFilterPanel .mediaFilters>button{grid-column:1/-1!important}
  .mediaGrid.mediaGridV45{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:0!important;padding:0 12px 12px!important;background:transparent!important}.mediaCardV45{border:1px solid var(--m-line)!important;border-radius:14px!important;background:var(--m-surface)!important;overflow:hidden!important}.mediaCardV45:hover{transform:none!important}.mediaCardV45 .mediaPreview{height:auto!important;aspect-ratio:1/1!important;border-radius:0!important;background:var(--m-surface-2)!important}.mediaCardV45 .mediaPreview img,.mediaCardV45 .mediaPreview video{object-fit:cover!important}.mediaKindPill,.mediaSizePill,.mediaOptimizedPill{font-size:6.5px!important;padding:3px 5px!important}.mediaCardV45 .mediaInfo{padding:8px 9px!important}.mediaCardV45 .mediaInfo strong{font-size:10.5px!important}.mediaCardV45 .mediaInfo span{font-size:8.5px!important;margin-top:2px!important}.mediaCardV45 .mediaInfo small{font-size:7.5px!important;margin-top:2px!important}.mediaCardV45 .actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:5px!important;margin-top:6px!important}.mediaCardV45 .actions .button{min-height:31px!important;margin:0!important;padding:4px!important;font-size:8px!important}.mediaEmptyV45{grid-column:1/-1!important;margin:0!important}
}
@media(max-width:390px){.mediaStorageStat{flex-basis:82%!important}.mediaGrid.mediaGridV45{gap:6px!important;padding-left:10px!important;padding-right:10px!important}.mediaCardV45 .mediaInfo{padding:8px!important}.mediaMaintenanceRow{grid-template-columns:1fr!important}.mediaMaintenanceRow p{grid-column:1!important}}

/* v4.5.5 mobile chat header action cleanup */
@media (max-width:780px){
  .contactBar .contactActions{gap:4px!important;padding-right:2px!important}
  .contactBar .threadSearchAction,.contactBar .mobileChatMenuButton{flex:0 0 38px!important}
  .contactBar .threadSearchAction svg{transform:translateX(.5px)!important}
}
/* v4.6 mobile cleanup: theme/logout live in More only */
@media(max-width:780px){body:not(:has(.chatWorkspace)) .topActions{display:none!important}}

/* v4.6.1 mobile search icon regression fix */
@media (max-width:780px){
  .contactBar .threadSearchAction{
    text-indent:0!important;
    overflow:visible!important;
  }
  .contactBar .threadSearchAction::after,
  .contactBar .contactActions>.secondary.compactAction::after{
    content:none!important;
    display:none!important;
  }
  .contactBar .threadSearchAction svg{
    display:block!important;
    width:20px!important;
    height:20px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
    transform:none!important;
  }
}


/* v4.6.2 mobile in-chat search polish */
@media (max-width:780px){
  .threadSearchBar{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 40px!important;
    gap:7px!important;
    align-items:center!important;
    min-height:54px!important;
    padding:7px 8px!important;
    border:0!important;
    border-bottom:1px solid var(--m-line)!important;
    background:#0f181d!important;
    overflow:visible!important;
  }
  .threadSearchBar .searchField{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid #263941!important;
    border-radius:12px!important;
    background:#172329!important;
    box-shadow:none!important;
  }
  .threadSearchBar .searchField:focus-within{
    border-color:rgba(32,200,117,.48)!important;
    box-shadow:0 0 0 2px rgba(32,200,117,.10)!important;
  }
  .threadSearchBar .searchIcon{
    position:static!important;
    left:auto!important;
    top:auto!important;
    flex:0 0 38px!important;
    width:38px!important;
    height:38px!important;
    display:grid!important;
    place-items:center!important;
    color:#8c9ba2!important;
    font-size:0!important;
    pointer-events:none!important;
  }
  .threadSearchBar .searchIcon svg{
    width:18px!important;
    height:18px!important;
    display:block!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }
  .threadSearchBar input{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 10px 0 0!important;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#e9edef!important;
    font-size:14px!important;
    line-height:38px!important;
  }
  .threadSearchBar input:focus{border:0!important;box-shadow:none!important}
  .threadSearchBar input::placeholder{color:#88979e!important;opacity:1!important}
  .threadSearchBar>span{display:none!important}
  .threadSearchBar #threadSearchClose{
    position:relative!important;
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:transparent!important;
    color:#aebbc1!important;
    font-size:0!important;
    line-height:1!important;
    box-shadow:none!important;
  }
  .threadSearchBar #threadSearchClose::before{
    content:'×'!important;
    display:block!important;
    font-size:25px!important;
    font-weight:300!important;
    line-height:38px!important;
    text-align:center!important;
    color:currentColor!important;
  }
  .threadSearchBar #threadSearchClose:active{background:rgba(255,255,255,.06)!important}
  .threadSearchResults{
    left:8px!important;
    right:8px!important;
    top:52px!important;
    max-height:min(46dvh,390px)!important;
    border:1px solid #263941!important;
    border-radius:12px!important;
    background:#121d22!important;
    box-shadow:0 16px 40px rgba(0,0,0,.34)!important;
    overflow:auto!important;
    z-index:40!important;
  }
}

/* v4.7.2 in-chat search visibility/state regression fix */
@media (max-width:780px){
  .threadSearchBar.hidden{display:none!important}
  .threadSearchBar[hidden]{display:none!important}
}

/* v4.8.0 voice/reaction/detail mobile polish */
@media(max-width:780px){
  .voiceNotePlayer{width:min(250px,72vw)!important;min-width:0!important;padding:6px!important;border-radius:10px!important}
  .bubbleReactions{margin:3px 0 -1px!important}.bubbleReactions span{padding:2px 5px!important;font-size:9px!important}.bubbleReactions b{font-size:12px!important}
  .quotedReply.jumpable:active{background:rgba(0,168,132,.16)!important}
  body.messageInspectorOpen{overflow:hidden!important}
}

/* v5.2.1 chat flow */
@media(max-width:780px){.newMessageJump:before{content:none!important}.newMessageJump{display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important}.newMessageJump.hidden{display:none!important}.newMessageJump .jumpLatestIcon{display:block!important;font-size:18px!important;line-height:1!important}.newMessageJump .jumpLatestLabel{display:none!important}.newMessageJump .jumpLatestCount{position:absolute!important;right:-4px!important;top:-4px!important;font-size:8px!important}.callEventBubble{min-width:188px!important;max-width:88%!important}.callEventCard{gap:8px!important}}


/* v5.2.37 uploaded logo asset mobile */
body:not(:has(.chatWorkspace)) .brandIcon,.mobileSheetBrandIcon{background:transparent!important;border:0!important;box-shadow:none!important}
body:not(:has(.chatWorkspace)) .brandIcon img,.mobileSheetBrandIcon img{width:100%!important;height:100%!important;object-fit:contain!important}


/* v5.4.5 Media dark-mode polish */
@media(max-width:780px){
  html:not([data-theme="light"]) .mediaHeroV45{
    align-items:flex-start!important;
    background:var(--m-bg)!important;
    border:0!important;
    box-shadow:none!important;
  }
  html:not([data-theme="light"]) .mediaHeroStorage{display:none!important}

  html:not([data-theme="light"]) .mediaStorageStat,
  html:not([data-theme="light"]) .mediaControlPanel,
  html:not([data-theme="light"]) .mediaFilterPanel,
  html:not([data-theme="light"]) .mediaCardV45,
  html:not([data-theme="light"]) .mediaEmptyV45{
    background:var(--m-surface)!important;
    border-color:var(--m-line)!important;
    color:var(--m-text)!important;
    box-shadow:none!important;
  }
  html:not([data-theme="light"]) .mediaStorageIcon{
    background:rgba(32,200,117,.11)!important;
    border-color:rgba(32,200,117,.20)!important;
    color:#58dda0!important;
  }
  html:not([data-theme="light"]) .mediaStorageStat small,
  html:not([data-theme="light"]) .mediaStorageStat em,
  html:not([data-theme="light"]) .mediaControlHead p:not(.sectionKicker),
  html:not([data-theme="light"]) .mediaPolicyForm>label,
  html:not([data-theme="light"]) .mediaMaintenanceRow p,
  html:not([data-theme="light"]) .mediaEmptyV45 span{
    color:var(--m-muted)!important;
  }
  html:not([data-theme="light"]) .mediaStorageStat strong,
  html:not([data-theme="light"]) .mediaToggleField strong,
  html:not([data-theme="light"]) .mediaControlHead h2,
  html:not([data-theme="light"]) .mediaEmptyV45 strong{
    color:var(--m-text)!important;
  }
  html:not([data-theme="light"]) .mediaToggleField{
    background:var(--m-surface-2)!important;
    border-color:var(--m-line)!important;
  }
  html:not([data-theme="light"]) .mediaToggleField small{color:var(--m-muted)!important}
  html:not([data-theme="light"]) .mediaToggleField input{accent-color:var(--m-green)!important}

  html:not([data-theme="light"]) .mediaPolicyForm select,
  html:not([data-theme="light"]) .mediaFilters input,
  html:not([data-theme="light"]) .mediaFilters select{
    background:var(--m-surface-2)!important;
    border-color:var(--m-line)!important;
    color:var(--m-text)!important;
    color-scheme:dark!important;
    -webkit-text-fill-color:var(--m-text)!important;
  }
  html:not([data-theme="light"]) .mediaPolicyForm select:focus,
  html:not([data-theme="light"]) .mediaFilters input:focus,
  html:not([data-theme="light"]) .mediaFilters select:focus{
    border-color:rgba(32,200,117,.48)!important;
    box-shadow:0 0 0 3px rgba(32,200,117,.10)!important;
    outline:none!important;
  }
  html:not([data-theme="light"]) .mediaFilters input::placeholder{color:#74858d!important;opacity:1!important}
  html:not([data-theme="light"]) .mediaMaintenanceRow{border-top-color:var(--m-line)!important}
  html:not([data-theme="light"]) .mediaMaintenanceRow .secondary{
    background:var(--m-surface-2)!important;
    border-color:var(--m-line)!important;
    color:#d9e4e8!important;
  }
  html:not([data-theme="light"]) .mediaMaintenanceRow .secondary:active{background:var(--m-surface-3)!important}
  html:not([data-theme="light"]) .mediaCardV45 .mediaPreview{background:#0b1419!important}

  .mediaStorageOverview{padding-top:2px!important}
  .mediaStorageStat{flex-basis:78%!important}
  .mediaControlPanel,.mediaFilterPanel{border-radius:17px!important}
  .mediaPolicyForm select,.mediaFilters input,.mediaFilters select{border-radius:12px!important}
  .mediaSavePolicy{border-radius:12px!important;font-weight:780!important}
}

@media(max-width:390px){
  .mediaStorageStat{flex-basis:86%!important}
}

/* v5.5.28 Chats on a phone — the reading pass, sized for the thumb.
   This file loads last and the rules around it use !important, so these do too
   or they would simply be overridden. Nothing here changes layout that the
   phone layer already owns; it only refines type, spacing and colour. */
@media(max-width:780px){
  .chatWorkspace .chatRailHeader h1{font-size:21px!important;font-weight:700!important;letter-spacing:-.01em!important}
  .chatWorkspace .chatTypeTabs a{padding:7px 8px!important;font-size:12px!important;font-weight:600!important}
  .chatWorkspace .chatSearch .searchField{min-height:40px!important;border-radius:11px!important}
  .chatWorkspace .chatSearch input[name="q"]{font-size:13px!important}
  .chatWorkspace .chatRailMeta{display:none!important}
  .chatWorkspace .chatRowPro{min-height:70px!important;padding:9px 12px!important}
  .chatWorkspace .chatRowTop strong{font-size:14.5px!important;font-weight:600!important;letter-spacing:-.005em!important}
  .chatWorkspace .chatRowTop time{font-size:10.5px!important;font-variant-numeric:tabular-nums!important}
  .chatWorkspace .chatNumber{font-size:10px!important;line-height:1.35!important}
  .chatWorkspace .chatPreviewText{font-size:12.5px!important;line-height:1.4!important}
  .chatWorkspace .proBubble{max-width:86%!important;font-size:14px!important;line-height:1.42!important;padding:7px 10px 5px!important}
  .chatWorkspace .proBubbleRow.theirs .proBubble{border-radius:12px!important;border-top-left-radius:5px!important}
  .chatWorkspace .proBubbleRow.mine .proBubble{border-radius:12px!important;border-top-right-radius:5px!important}
  .chatWorkspace .bubbleAuthor{font-size:12px!important;font-weight:700!important;margin-bottom:2px!important}
  .chatWorkspace .bubbleFooter{font-size:9.5px!important;font-variant-numeric:tabular-nums!important}
  .chatWorkspace .dateDivider span,.chatWorkspace .loadOlderButton{font-size:10.5px!important;padding:4px 11px!important;border-radius:999px!important}
  .chatWorkspace .miniBadge{font-size:8.5px!important;padding:1px 6px!important;font-style:normal!important}
  .chatWorkspace .archiveStatusBar{font-size:9.5px!important;padding:6px 10px!important}
}