/* The soft keyboard and the chat screen (native build 5 / code 8, and every phone browser).
   - A conversation on a phone is a locked screen: a flex column of the visible height (--pk-vh, set by keyboard.js from the visual
     viewport; 100dvh before it runs), the message list the only scroller, the composer its last child. The page never scrolls
     under the header and the footer links are out of the way.
   - While the keyboard is up (html.pk-kbd, set by keyboard.js) the bottom bar and the footer links are hidden and the thread
     takes the whole visible height, so the composer sits directly on the keyboard. */
@media (max-width: 899px) {
  html:has(.pk-message-layout.has-conversation),
  html:has(.pk-message-layout.has-conversation) body { overflow: hidden; overscroll-behavior: none; }
  body.pk-messages-body:has(.pk-message-layout.has-conversation) .pk-message-page { height: calc(var(--pk-vh, 100dvh) - var(--pk-top-height)); min-height: 0; overflow: hidden; }
  body.pk-messages-body .pk-message-layout.has-conversation { height: 100%; min-height: 0; }
  body.pk-messages-body:has(.pk-message-layout.has-conversation) .pk-foot { display: none; }
  body.pk-messages-body .pk-message-layout.has-conversation .pk-message-scroll { overscroll-behavior: contain; overflow-anchor: auto; -webkit-overflow-scrolling: touch; scroll-padding-bottom: 12px; }
  html.pk-kbd body.pk-messages-body .pk-message-layout.has-conversation { height: 100%; }
  html.pk-kbd body.pk-messages-body .pk-message-page form.pk-message-reply { padding-bottom: 10px; }
}
@media (pointer: coarse) {
  html.pk-kbd :is(.pk-mobile-nav, .pk-mobile-bar, .pk-bottom-nav, .pk-foot, .pk-home-top) { display: none !important; }
  /* A focused field comes into view below the sticky header, never under it. */
  :is(input, textarea, select, [contenteditable="true"]) { scroll-margin-top: calc(var(--pk-top-height, 60px) + 12px); scroll-margin-bottom: 12px; }
}
@media (pointer: coarse) {
  /* Bars that sat above the bottom bar (the profile Save bar, the comment reply bar) drop onto the keyboard when the bottom bar is hidden. */
  html.pk-kbd :is(.pk-pe-bar, .pk-reply-bar) { bottom: calc(8px + env(safe-area-inset-bottom)); }
  html.pk-kbd .pk-toast-region .fs-toast { bottom: calc(12px + env(safe-area-inset-bottom)); }
}

/* Messages is its own screen on a phone (owner, 5 October): no global top bar on /messages, /messages/new, /messages/new-group, /messages/calls or in a
   conversation. The list keeps its own title row (Messages, search, new message, Calls) and the bottom bar; an open conversation has its own header
   (back, avatar and name, call, more) and no bottom bar. Nothing below depends on the hidden bar's height: --pk-top-height is 0 here. */
@media (max-width: 899px) {
  body.pk-messages-body { --pk-top-height: 0px; }
  body.pk-messages-body :is(.pk-top, .pk-spaces-label) { display: none; }
  body.pk-messages-body .pk-message-inbox { padding-top: calc(16px + env(safe-area-inset-top)); }
  body.pk-messages-body .pk-message-inbox > h1.fs-sr { position: static; width: auto; height: auto; margin: 0; padding: 0 4px; overflow: visible; clip: auto; clip-path: none; white-space: normal; font-size: 28px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; }
  body.pk-messages-body .pk-message-thread-head { padding-top: calc(10px + env(safe-area-inset-top)); }
  body.pk-messages-body:has(.pk-message-layout.has-conversation) :is(.pk-mobile-nav, .pk-mobile-bar, .pk-bottom-nav) { display: none !important; }
}