/* One continuous capsule, with an anchored header and one story scroller.
   Suppress vertical edge bounce without intercepting photo swipes or zoom. */
html body main.app-shell #memoryBottomSheet,
html body main.app-shell #memoryBottomSheet .full-memory-capsule {
  overscroll-behavior-y: none !important;
}
html body main.app-shell #memoryBottomSheet .full-memory-capsule {
  scroll-padding-top: 80px;
}
html body main.app-shell #memoryBottomSheet .full-memory-capsule > .memory-capsule-topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  border-radius: 0 !important;
  flex-shrink: 0 !important;
}
html body main.app-shell #memoryBottomSheet .full-memory-capsule > .memory-capsule-visual {
  border-radius: 0 !important;
}
html body main.app-shell #memoryBottomSheet .full-memory-capsule .memory-capsule-photo-count {
  top: 16px !important;
}

/* One gallery frame, independent of photo aspect ratio or decode order. */
html body main.app-shell #memoryBottomSheet .full-memory-capsule .memory-capsule-visual.has-cover-photo {
  height: clamp(360px, 64svh, 660px) !important;
  min-height: clamp(360px, 64svh, 660px) !important;
  max-height: clamp(360px, 64svh, 660px) !important;
  transition: none !important;
}

/* The gallery has a stable height, but the legacy title layer kept a shorter
   independent vh height. Fill the same frame so metadata sits near its edge,
   not 100px above it. Photo fit/focus and the no-photo composition are intact. */
html body main.app-shell #memoryBottomSheet .full-memory-capsule .memory-capsule-visual.has-cover-photo .memory-capsule-hero {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  padding-bottom: clamp(20px, 3vw, 28px) !important;
}

/* The tablet editor used to depend on pointer/hover media queries. An iPad
   trackpad changed the panel width. New and Edit now share viewport geometry. */
@media (min-width: 721px) {
  html body main.app-shell section.map-stage #memoryForm#memoryForm.open {
    --memory-form-content: 720px;
    --memory-form-focus: 480px;
    width: min(860px, calc(100vw - 40px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))) !important;
    max-width: calc(100vw - 40px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) !important;
    min-width: 0 !important;
  }
}
/* Visible action separate from the destructive Remove targets. */
html body main.app-shell section.map-stage #memoryForm#memoryForm #memoryEditorChangeCoverButton:not([hidden]) {
  display: block !important; width: 100%; min-height: 44px !important;
  color: #fff !important; background: #00243f !important; border: 1px solid #366079 !important;
}
html body main.app-shell section.map-stage #memoryForm#memoryForm .memory-media-cover-label {
  position: absolute; left: 4px; right: 4px; bottom: 4px; z-index: 3;
  padding: 5px 3px; border-radius: 8px; color: #fff; background: #00243fe6;
  font: 700 11px/1.2 system-ui, sans-serif; pointer-events: none;
}

/* Travel owns the notice lane. A generic guide/nearby card must not compete
   with the Skip travel control or push another panel up the phone screen. */
html body main.app-shell section.map-stage.map-focus:has(.memory-journey-skip) :is(#mappiGuideBubble, #memoryPeekCard, #ourMapExplorerButton, #mapEmptyState, .memory-journey-toast) {
  visibility: hidden !important; pointer-events: none !important;
}

/* Explain device-only cover limits in normal flow, not an inaccessible tooltip. */
html body .app-shell :is(.memory-pending-cover-help, .life-chapter-framing-help):not([hidden]) {
  display: block;
  margin: 10px 0;
  padding: 12px 14px;
  border: 1px solid #b7cbd6;
  border-radius: 12px;
  background: #edf4f8;
  color: #00243f;
  font: 500 14px/1.5 system-ui, sans-serif;
  overflow-wrap: anywhere;
}
@media (max-width: 620px) {
  html body main.app-shell section.map-stage.map-focus .map-navigation-gadget {
    position: fixed !important;
    transition-property: opacity !important;
  }
}