/* Phone layout for share pages: pin the preview, drop clutter. Desktop unchanged. */
@media (max-width: 736px) {
  /* Pin the info/preview box fully at the top instead of letting it slide 20em off-screen */
  .share__box.share__box__info { top: 7em !important; max-height: 60vh; overflow: hidden; }
  /* Hide name/size/modified rows, section headers and the QR code: noise on a phone */
  .share__box__info > .share__box__element:has(> strong),
  .share__box__info > .share__box__header,
  .share__box__info canvas { display: none !important; }
  /* Compact download row */
  .share__box__info > .share__box__element { padding: .4em !important; }
  .share__box__info .button { height: auto !important; }
  /* Preview: use the width, keep whole photo visible */
  .share__box__info img { width: 100%; height: 100%; object-fit: contain; }
  /* Stop scroll chaining / rubber-band from dragging the page under the preview */
  html, body { overscroll-behavior-y: none; }
}
@media (max-width: 736px) {
  /* The info-box Download button zips the whole folder; say so (it would otherwise read as "this photo") */
  .share__box__info .button div { font-size: 0; }
  .share__box__info .button div i { font-size: 24px; }
  .share__box__info .button div::after { content: "Download all (zip, large)"; font-size: 14px; }
}