/* Build 649: fixed Today Relive geometry, a calm Mappi no-photo state,
   and three protected Home actions on iPad. */

/* A text-only memory uses Mappi as the visual anchor. The feeling remains part
   of the saved memory, but it is intentionally absent from this photo area. */
html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-main.has-text-only .today-memory-text-fallback,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-main.has-text-only .today-memory-text-fallback {
  display: grid !important;
  box-sizing: border-box !important;
  min-height: clamp(330px, 38vw, 470px) !important;
  padding: clamp(30px, 4vw, 54px) 24px clamp(118px, 13vw, 150px) !important;
  place-items: center !important;
  overflow: hidden !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-text-fallback-mappi,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-text-fallback-mappi {
  display: block !important;
  width: clamp(138px, 18vw, 205px) !important;
  max-width: 46% !important;
  height: auto !important;
  max-height: 245px !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  filter: drop-shadow(0 18px 24px rgba(3, 58, 68, 0.16)) !important;
  transform: none !important;
}

/* Relive is a single fixed grid. Neither the label nor arrow may translate,
   resize, or change columns when a mouse enters the button. */
@media (min-width: 761px) {
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button:hover,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button:focus-visible,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button:active,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button:hover,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button:focus-visible,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button:active {
    display: grid !important;
    grid-template-columns: auto 28px !important;
    grid-template-rows: 28px !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 116px !important;
    min-width: 116px !important;
    max-width: 116px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 9px 0 15px !important;
    gap: 9px !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    translate: none !important;
    transform: translateY(-50%) !important;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, color 160ms ease !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button::before,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button::after,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button::before,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button::after {
    display: none !important;
    content: none !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button > span,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover > span,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible > span,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:active > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:active > span {
    display: grid !important;
    grid-column: 2 !important;
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    place-items: center !important;
    align-self: center !important;
    justify-self: center !important;
    border: 1px solid rgba(225, 255, 249, 0.14) !important;
    border-radius: 50% !important;
    background: rgba(238, 255, 251, 0.12) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
    font-size: 0.95rem !important;
    line-height: 1 !important;
    translate: none !important;
    transform: none !important;
    transition: background-color 160ms ease, border-color 160ms ease !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover > span,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible > span {
    border-color: rgba(225, 255, 249, 0.24) !important;
    background: rgba(238, 255, 251, 0.2) !important;
  }
}

@media (max-width: 760px) {
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-main.has-text-only .today-memory-text-fallback,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-main.has-text-only .today-memory-text-fallback {
    min-height: 286px !important;
    padding: 25px 18px 106px !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-text-fallback-mappi,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-text-fallback-mappi {
    width: clamp(118px, 35vw, 152px) !important;
    max-width: 48% !important;
    max-height: 180px !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:active,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:active {
    display: grid !important;
    grid-template-columns: 20px !important;
    grid-template-rows: 20px !important;
    place-items: center !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    gap: 0 !important;
    translate: none !important;
    transform: translateY(-50%) !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button > span,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover > span,
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:hover > span,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button:focus-visible > span {
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }
}

/* iPad Safari is a coarse-pointer device, so it previously inherited the
   narrow two-column phone rail. Restore one protected three-column row. */
@media (min-width: 721px) and (max-width: 1366px) {
  html body .app-shell .map-stage.home-focus #homeDashboard > .home-action-section,
  html body main.app-shell section.map-stage.home-focus #homeDashboard > .home-action-section {
    display: block !important;
    box-sizing: border-box !important;
    width: min(calc(100% - 32px), 840px) !important;
    max-width: 840px !important;
    min-width: 0 !important;
    margin: clamp(26px, 4vw, 40px) auto clamp(34px, 5vw, 52px) !important;
    padding: 0 max(8px, env(safe-area-inset-left)) !important;
    overflow: visible !important;
    transform: none !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-quick-actions,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-quick-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    gap: clamp(9px, 1.6vw, 14px) !important;
    overflow: visible !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card,
  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card.primary,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card.primary {
    grid-column: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 44px minmax(20px, auto) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 96px !important;
    margin: 0 !important;
    padding: 11px 8px 12px !important;
    align-content: center !important;
    align-items: center !important;
    justify-content: stretch !important;
    justify-items: center !important;
    gap: 6px !important;
    overflow: hidden !important;
    transform: none !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card .home-action-copy,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card .home-action-copy {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    place-items: center !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card .home-action-copy > strong,
  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card.primary .home-action-copy > strong,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card .home-action-copy > strong,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card.primary .home-action-copy > strong {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: clamp(0.76rem, 1.45vw, 0.92rem) !important;
    line-height: 1.12 !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    white-space: nowrap !important;
  }
}