/* v56: single, shared chat lane for header, message feed, composer.
   All three use the SAME containing block and SAME horizontal formula. */
body[data-page="chat"] main#shell .chat {
  --chat-lane-width: min(760px, calc(100% - 48px));
  position: relative !important;
  min-width: 0 !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
/* Center the same 760px lane in the chat region, never the browser viewport. */
body[data-page="chat"] main#shell .chat > .chatHeader.telegramHeader,
body[data-page="chat"] main#shell .chat > .composer,
body[data-page="chat"] main#shell .chat > .messages {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  width: var(--chat-lane-width) !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  box-sizing: border-box !important;
}
body[data-page="chat"] main#shell .chat > .chatHeader.telegramHeader {
  top: 12px !important;
  bottom: auto !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  padding: 7px 12px !important;
  z-index: 7 !important;
}
body[data-page="chat"] main#shell .chat > .composer {
  top: auto !important;
  bottom: 12px !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  z-index: 7 !important;
}
body[data-page="chat"] main#shell .chat > .composer > .composerPill {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
body[data-page="chat"] main#shell .chat > .messages {
  top: 0 !important;
  bottom: 0 !important;
  height: 100% !important;
  max-height: none !important;
  padding: 92px 0 92px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 9px !important;
}
body[data-page="chat"] main#shell .chat > .messages > .bubble {
  flex: 0 0 auto !important;
  width: fit-content !important;
  max-width: min(78%, 560px) !important;
  align-self: flex-start !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}
body[data-page="chat"] main#shell .chat > .messages > .bubble.mine {
  align-self: flex-end !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}
body[data-page="chat"] main#shell .chat > .pinnedMessageBar:not([hidden]) {
  position: absolute !important;
  top: 84px !important;
  left: 50% !important;
  right: auto !important;
  width: var(--chat-lane-width) !important;
  max-width: none !important;
  transform: translateX(-50%) !important;
  box-sizing: border-box !important;
}
body[data-page="chat"] main#shell .chat:has(> .pinnedMessageBar:not([hidden])) > .messages {padding-top: 160px !important}
@media(max-width:650px){
 body[data-page="chat"] main#shell .chat{--chat-lane-width:calc(100% - 24px)}
 body[data-page="chat"] main#shell .chat > .chatHeader.telegramHeader,
 body[data-page="chat"] main#shell .chat > .composer{height:56px!important;min-height:56px!important;max-height:56px!important}
 body[data-page="chat"] main#shell .chat > .composer > .composerPill{height:56px!important;min-height:56px!important;max-height:56px!important}
 body[data-page="chat"] main#shell .chat > .messages{padding-top:80px!important;padding-bottom:80px!important}
 body[data-page="chat"] main#shell .chat > .messages > .bubble{max-width:88%!important}
}