/* Phone layout: retain the desktop rail above 600px. */
@media(max-width:600px){
  html body.chat-page{padding-bottom:calc(82px + env(safe-area-inset-bottom));}
  html body.chat-page>header{margin-left:0!important;padding:14px 16px!important;min-height:68px;gap:10px;flex-wrap:nowrap!important;position:sticky;top:0;z-index:20}
  html body.chat-page h1{font-size:18px;white-space:nowrap;gap:6px}
  html body.chat-page h1 img{width:30px;height:30px}
  html body.chat-page>main{margin-left:0!important;width:100%;}
  html body.chat-page .header-actions{gap:2px!important;margin-left:auto;flex-wrap:nowrap!important}
  html body.chat-page .header-actions>:not(.account-profile):not(.header-home-symbol):not(#language-control){display:none!important}
  html body.chat-page .header-actions .account-profile,html body.chat-page .header-actions .header-home-symbol{flex-shrink:0}
  html body.chat-page .chat-rail{inset:auto 0 0 0!important;width:100%!important;height:calc(76px + env(safe-area-inset-bottom));padding:6px 8px calc(6px + env(safe-area-inset-bottom))!important;display:flex;flex-direction:row!important;justify-content:space-around;gap:2px!important;background:#f9f6ff!important;border-top:1px solid #e4d9f0;box-shadow:0 -5px 25px #3822510c;z-index:40;overflow:visible}
  html body.chat-page .chat-rail>img,html body.chat-page .chat-rail #showInvite,html body.chat-page .chat-rail #showGroups{display:none!important}
  html body.chat-page .chat-rail button{width:auto!important;flex:1;height:60px!important;min-height:60px;max-width:94px;color:#81718e;border-radius:18px;gap:7px}
  html body.chat-page .chat-rail button svg{width:24px;height:24px}
  html body.chat-page .chat-rail button span{font-size:10px!important;font-weight:600}
  html body.chat-page .chat-rail button[aria-pressed=true]{background:#7951b8!important;color:white!important;border-color:transparent!important;box-shadow:none}
  html body.chat-page .chat-rail #showChats{order:0}html body.chat-page .chat-rail button[aria-label="Channels"]{order:1}html body.chat-page .chat-rail button[aria-label="Communities"]{order:2}html body.chat-page .chat-rail #showSettings{order:3}
  html body.chat-page .layout{min-height:calc(100dvh - 155px)}
  html body.chat-page .chat-list{padding:12px 16px 90px!important}
  html body.chat-page .list-heading{margin:0 0 12px}
  html body.chat-page .list-heading h2{font-size:23px}
  html body.chat-page #newChat{position:fixed;right:20px;bottom:calc(96px + env(safe-area-inset-bottom));width:56px;height:56px;border-radius:19px;font-size:30px;z-index:30;box-shadow:0 8px 22px #7845ae44}
  html body.chat-page .chat-search{padding:0 15px;border-radius:26px;min-height:50px}
  html body.chat-page .chat-search input{font-size:15px;padding:14px 0}
  html body.chat-page .chat-filters{flex-wrap:nowrap;overflow-x:auto;padding:16px 0;gap:8px}
  html body.chat-page .chat-filters button{white-space:nowrap;padding:9px 16px}
  html body.chat-page #rooms .chat-row{padding:16px 2px;gap:13px;border-radius:14px}
  html body.chat-page .chat-avatar{width:52px;height:52px;flex-basis:52px}
  html body.chat-page .chat-copy strong{font-size:16px;font-weight:600}
  html body.chat-page .chat-copy small{font-size:13px}
  html body.chat-page .conversation{padding:12px 16px!important;min-height:calc(100dvh - 155px)}
  html body.chat-page #compose{position:sticky;bottom:calc(82px + env(safe-area-inset-bottom));background:#f5f0fc;padding:6px 0}
  html body.chat-page .local-label{margin-bottom:12px}
  html body.chat-page #channelsPanel,html body.chat-page #communitiesPanel{border-top:0;padding-top:8px}
  html body.chat-page .policy-floating-link{bottom:calc(90px + env(safe-area-inset-bottom))}
}
@media(max-width:600px){
  html body.chat-page .chat-rail{background:#f0eaf8!important;border-top:1px solid #e3d8ee!important;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  html body.chat-page .chat-rail button{color:#644780}
  html body.chat-page .layout{min-height:0}
  html body.chat-page .chat-list{padding:8px 14px 18px!important}
  html body.chat-page .chat-filters{padding:7px 0}
  html body.chat-page #rooms .chat-row{padding:8px 2px}
  html body.chat-page .chat-avatar{width:44px;height:44px;flex-basis:44px}
}