/* Build 660: final Home and Explore alignment locks.
   This file intentionally loads last so older release layers cannot split the
   Today Relive control or move first-memory confirmations into the map gadget. */

/* The empty Today surface uses the same calm 760px visual rail as the visible
   surface of a populated Today card. Its copy remains narrower for readability. */
@media (min-width: 1025px) {
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .empty-memory-invite,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .empty-memory-invite {
    box-sizing: border-box !important;
    width: min(100%, 760px) !important;
    max-width: 760px !important;
    min-width: 0 !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .empty-memory-invite,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .empty-memory-invite {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .empty-memory-invite,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .empty-memory-invite {
    justify-self: stretch !important;
    min-height: clamp(270px, 31vw, 330px) !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-empty-preview-card,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-empty-preview-card {
    box-sizing: border-box !important;
    width: min(100%, 640px) !important;
    max-width: 640px !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}

/* Relive is one centered label-and-arrow unit. Every interactive state keeps
   identical geometry; only the surface color is allowed to respond. */
@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 .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button.is-relive-launching,
  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,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button.is-relive-launching {
    position: absolute !important;
    top: 50% !important;
    right: 12px !important;
    bottom: auto !important;
    left: auto !important;
    display: inline-grid !important;
    grid-template-columns: max-content 24px !important;
    grid-template-rows: 28px !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;
    margin: 0 !important;
    padding: 0 12px !important;
    align-content: center !important;
    align-items: center !important;
    justify-content: center !important;
    justify-items: center !important;
    column-gap: 7px !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    font-size: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    translate: none !important;
    transform: translateY(-50%) !important;
    animation: none !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-card.has-today-memory .today-memory-relive-button > .today-memory-relive-label,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button > .today-memory-relive-label {
    position: static !important;
    inset: auto !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex: none !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: inherit !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 0.74rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-align: center !important;
    translate: none !important;
    transform: none !important;
    animation: none !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button > .today-memory-relive-icon,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button > .today-memory-relive-icon {
    position: static !important;
    inset: auto !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid !important;
    flex: none !important;
    box-sizing: border-box !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    place-items: center !important;
    border: 1px solid rgba(225, 255, 249, 0.16) !important;
    border-radius: 50% !important;
    color: inherit !important;
    background: rgba(238, 255, 251, 0.13) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
    font-size: 0.92rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    translate: none !important;
    transform: none !important;
    animation: none !important;
  }
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button::before,
html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button::after,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button::before,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button::after {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  content: none !important;
  animation: none !important;
  box-shadow: none !important;
}

@media (max-width: 760px) {
  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 .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button.is-relive-launching,
  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,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button.is-relive-launching {
    position: absolute !important;
    top: 50% !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;
    display: grid !important;
    grid-template-columns: 20px !important;
    grid-template-rows: 20px !important;
    box-sizing: border-box !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    place-content: center !important;
    place-items: center !important;
    gap: 0 !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    font-size: 0 !important;
    line-height: 1 !important;
    translate: none !important;
    transform: translateY(-50%) !important;
    animation: none !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-card.has-today-memory .today-memory-relive-button > .today-memory-relive-label,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button > .today-memory-relive-label {
    display: none !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button > .today-memory-relive-icon,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-relive-button > .today-memory-relive-icon {
    position: static !important;
    inset: auto !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: grid !important;
    flex: none !important;
    box-sizing: border-box !important;
    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;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: inherit !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 1.08rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    translate: none !important;
    transform: none !important;
    animation: none !important;
  }
}

/* Center the welcome copy while preserving its safe lane beside the gadget. */
html body .app-shell .map-stage.map-focus #mapEmptyState.is-visible > strong,
html body .app-shell .map-stage.map-focus #mapEmptyState.is-visible > span,
html body main.app-shell section.map-stage.map-focus #mapEmptyState.is-visible > strong,
html body main.app-shell section.map-stage.map-focus #mapEmptyState.is-visible > span {
  justify-self: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
  text-wrap: balance !important;
}

/* Successful saves belong above the center + button. Other alerts retain the
   side lane so they never collide with the map gadget. */
@media (max-width: 720px), (hover: none) and (pointer: coarse) and (max-width: 1024px) {
  html body .app-shell .map-stage #memorySaveConfirmation.memory-save-confirmation[data-kind="success"],
  html body main.app-shell section.map-stage #memorySaveConfirmation.memory-save-confirmation[data-kind="success"] {
    position: fixed !important;
    right: auto !important;
    bottom: calc(var(--bottom-nav-height, 78px) + env(safe-area-inset-bottom) + 132px) !important;
    left: 50% !important;
    box-sizing: border-box !important;
    width: min(360px, calc(100vw - 28px)) !important;
    max-width: calc(100vw - 28px) !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    text-align: center !important;
    translate: none !important;
    transform: translate(-50%, 16px) scale(0.985) !important;
  }

  html body .app-shell .map-stage #memorySaveConfirmation.memory-save-confirmation[data-kind="success"].show,
  html body main.app-shell section.map-stage #memorySaveConfirmation.memory-save-confirmation[data-kind="success"].show {
    transform: translate(-50%, 0) scale(1) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button,
  html body .app-shell .map-stage #memorySaveConfirmation.memory-save-confirmation[data-kind="success"],
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-relive-button,
  html body main.app-shell section.map-stage #memorySaveConfirmation.memory-save-confirmation[data-kind="success"] {
    transition: none !important;
  }
}

/* Build 663: one Home system for both the first visit and a lived-in map.
   The Today rail, calm status, actions, and small controls keep the same
   geometry as content changes, so adding a memory never reflows the page. */

/* Empty and populated Today surfaces share one owner for width, gutter, and
   corners at every viewport. The inner empty copy remains intentionally
   narrower, but the visible card is exactly the same rail as a saved memory. */
html body .app-shell .map-stage.home-focus #homeMemoryOfDay,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay,
html body .app-shell #homeDashboard #homeMemoryOfDay,
html body main.app-shell #homeDashboard #homeMemoryOfDay {
  --home-today-rail: 760px;
  --home-today-radius: 28px;
  box-sizing: border-box !important;
  width: min(100%, var(--home-today-rail)) !important;
  max-width: var(--home-today-rail) !important;
  min-width: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card:is(.is-empty-today, .has-today-memory),
html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card:is(.is-empty-today, .has-today-memory) .today-memory-main,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card:is(.is-empty-today, .has-today-memory),
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card:is(.is-empty-today, .has-today-memory) .today-memory-main {
  box-sizing: border-box !important;
  width: min(100%, var(--home-today-rail)) !important;
  max-width: var(--home-today-rail) !important;
  min-width: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: var(--home-today-radius) !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.is-empty-today .empty-memory-invite,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.is-empty-today .empty-memory-invite,
html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today .empty-memory-invite,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeMemoryOfDay .today-memory-card.is-empty-today .empty-memory-invite {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-column: 1 / -1 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  margin-right: auto !important;
  margin-left: auto !important;
  overflow: hidden !important;
  border-radius: var(--home-today-radius) !important;
}

@media (max-width: 699px) {
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay {
    --home-today-radius: 24px;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-quick-actions,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home .home-quick-actions,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-quick-actions,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .home-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card.primary,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home .home-action-card.primary,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card.primary,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .home-action-card.primary {
    display: grid !important;
    grid-column: 1 / -1 !important;
  }
}

/* All remaining arrow-bearing Home actions meet the same minimum touch size. */
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay .memory-echo-relive,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney .life-chapter-actions button {
  box-sizing: border-box !important;
  min-height: 44px !important;
}

/* The Today call to action and the center + already teach the first action.
   Repeating a three-step journey adds visual weight on desktop and iPad. */
html body .app-shell .map-stage.home-focus .first-memory-journey,
html body main.app-shell section.map-stage.home-focus .first-memory-journey {
  display: none !important;
}

/* Keep one centered trust signal below the stats. Contextual monthly copy and
   its divider are intentionally removed so long account text cannot clip. */
html body .app-shell .map-stage.home-focus .home-calm-status,
html body main.app-shell section.map-stage.home-focus .home-calm-status {
  display: flex !important;
  box-sizing: border-box !important;
  width: fit-content !important;
  max-width: calc(100% - 24px) !important;
  min-width: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  text-align: center !important;
}

html body .app-shell .map-stage.home-focus .home-calm-status .home-mappi-moment,
html body .app-shell .map-stage.home-focus .home-calm-status-divider,
html body main.app-shell section.map-stage.home-focus .home-calm-status .home-mappi-moment,
html body main.app-shell section.map-stage.home-focus .home-calm-status-divider {
  display: none !important;
}

html body .app-shell .map-stage.home-focus .home-calm-status .home-sync-confidence,
html body main.app-shell section.map-stage.home-focus .home-calm-status .home-sync-confidence {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 1 auto !important;
  overflow: visible !important;
  white-space: normal !important;
}

html body .app-shell .map-stage.home-focus .home-calm-status .home-sync-confidence > span,
html body main.app-shell section.map-stage.home-focus .home-calm-status .home-sync-confidence > span {
  min-width: 0 !important;
  overflow: visible !important;
  text-align: center !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

/* iPad portrait and landscape keep three equal destinations. Phones retain the
   established primary 1 + secondary 2 composition below this breakpoint. */
@media (min-width: 700px) and (max-width: 1100px) {
  html body .app-shell .map-stage.home-focus #homeDashboard .home-quick-actions,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home .home-quick-actions,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .home-quick-actions,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-quick-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: min(100%, 980px) !important;
    max-width: 980px !important;
    gap: clamp(10px, 1.4vw, 15px) !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home .home-action-card,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .home-action-card,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card {
    display: grid !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-action-card.primary,
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home .home-action-card.primary,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .home-action-card.primary,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-action-card.primary {
    grid-column: auto !important;
  }
}

/* Supporting language is quieter than the section title but darker than the
   previous washed-out gray. This applies only to descriptions and unlock cues. */
html body .app-shell .map-stage.home-focus #homeDashboard .home-section-heading > strong,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-heading > strong {
  color: rgba(18, 68, 75, 0.76) !important;
  font-weight: 680 !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard #homeOnThisDay.is-empty .memory-echo-reason,
html body .app-shell .map-stage.home-focus #homeDashboard #homeOnThisDay.is-empty .memory-echo-copy-main > small,
html body .app-shell .map-stage.home-focus #homeDashboard #homeOnThisDay.is-empty .memory-echo-empty-unlock,
html body .app-shell .map-stage.home-focus #homeDashboard #homeJourney .life-chapter-empty-copy > span,
html body .app-shell .map-stage.home-focus #homeDashboard #homeJourney .life-chapter-empty-copy > small,
html body .app-shell .map-stage.home-focus #homeDashboard #homeJourney .life-chapter-empty-cue,
html body .app-shell .map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-empty-copy > small,
html body .app-shell .map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-empty-copy > em,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay.is-empty .memory-echo-reason,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay.is-empty .memory-echo-copy-main > small,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay.is-empty .memory-echo-empty-unlock,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney .life-chapter-empty-copy > span,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney .life-chapter-empty-copy > small,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney .life-chapter-empty-cue,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-empty-copy > small,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-empty-copy > em {
  color: rgba(25, 75, 81, 0.74) !important;
  font-weight: 620 !important;
}

/* A 44px hit area surrounds the same small artwork. No label, arrow, or icon
   grows visually; only the transparent interactive perimeter is larger. */
@media (max-width: 760px) {
  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 {
    box-sizing: border-box !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    border: 1px solid transparent !important;
    background-clip: padding-box !important;
  }
}

html body .app-shell .map-stage.home-focus #homeJourney .life-chapter-scroll,
html body main.app-shell section.map-stage.home-focus #homeJourney .life-chapter-scroll {
  box-sizing: border-box !important;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  border: 5px solid transparent !important;
  background-clip: padding-box !important;
}

html body .app-shell .map-stage.home-focus #homeTimelineStrip .recent-memory-view-all,
html body main.app-shell section.map-stage.home-focus #homeTimelineStrip .recent-memory-view-all {
  box-sizing: border-box !important;
  min-height: 44px !important;
  padding-top: 11px !important;
  padding-bottom: 11px !important;
}

/* The closing sentiment repeats the Home promise and reads like a stray pill
   after Recent Memories, so the section sequence now ends cleanly. */
html body .app-shell .map-stage.home-focus #homeDashboard > .home-mappi-bottom-note,
html body main.app-shell section.map-stage.home-focus #homeDashboard > .home-mappi-bottom-note {
  display: none !important;
}

/* Build 663 completion: empty previews contain only their requested title and
   supporting sentence, so the former kicker/footer rows no longer reserve air. */
html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeOnThisDay .memory-echo-feature-card.is-empty,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeOnThisDay .memory-echo-feature-card.is-empty {
  grid-template-areas: "art copy" !important;
  grid-template-columns: 104px minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  align-items: center !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeJourney .life-chapter-empty.premium-empty-preview,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeJourney .life-chapter-empty.premium-empty-preview {
  grid-template-areas: "book copy" !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  align-items: center !important;
}

/* Photo progress is now a quiet, non-interactive indicator. Swipe the photo to
   browse; this avoids presenting tiny dots as undersized buttons. */
html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot {
  position: relative !important;
  display: block !important;
  flex: none !important;
  box-sizing: border-box !important;
  width: 12px !important;
  min-width: 12px !important;
  max-width: 12px !important;
  height: 12px !important;
  min-height: 12px !important;
  max-height: 12px !important;
  border-radius: 999px !important;
  background: transparent !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot::after,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot::after {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 4px !important;
  height: 4px !important;
  content: "" !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.62) !important;
  transform: translate(-50%, -50%) !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot.active,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot.active {
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot.active::after,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-photo-dots .today-photo-dot.active::after {
  width: 10px !important;
  background: #c8fff0 !important;
}

/* Memory Echo arrows expose a full 44px target while the visible circle stays
   at the established 26px size. Carousel dots are indicators, not controls. */
html body .app-shell .map-stage.home-focus #homeOnThisDay .memory-echo-nav-button,
html body main.app-shell section.map-stage.home-focus #homeOnThisDay .memory-echo-nav-button {
  display: grid !important;
  box-sizing: border-box !important;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  padding: 0 !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #285d66 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0 !important;
}

html body .app-shell .map-stage.home-focus #homeOnThisDay .memory-echo-nav-button > span,
html body main.app-shell section.map-stage.home-focus #homeOnThisDay .memory-echo-nav-button > span {
  display: grid !important;
  box-sizing: border-box !important;
  width: 26px !important;
  height: 26px !important;
  place-items: center !important;
  border: 1px solid rgba(19, 91, 99, 0.1) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 252, 0.66) !important;
  box-shadow: none !important;
  font-size: 1rem !important;
  line-height: 1 !important;
}

/* Today's memory selector uses a 44px target with a compact thumbnail inside.
   The touch area grows without recreating the oversized slider treatment. */
html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice,
html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice.active,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice,
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice.active {
  display: grid !important;
  box-sizing: border-box !important;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  padding: 6px !important;
  place-items: center !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice :is(img, span),
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice :is(img, span) {
  display: grid !important;
  box-sizing: border-box !important;
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.26) !important;
  border-radius: 10px !important;
  background-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 5px 12px rgba(0, 18, 24, 0.14) !important;
  object-fit: cover !important;
}

html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice.active :is(img, span),
html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-choice.active :is(img, span) {
  border-color: rgba(255, 255, 255, 0.86) !important;
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.32),
    0 7px 16px rgba(0, 25, 31, 0.18) !important;
}

@media (max-width: 720px) {
  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeOnThisDay .memory-echo-feature-card.is-empty,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeOnThisDay .memory-echo-feature-card.is-empty {
    grid-template-areas: "art copy" !important;
    grid-template-columns: 66px minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard.is-empty-home #homeJourney .life-chapter-empty.premium-empty-preview,
  html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeJourney .life-chapter-empty.premium-empty-preview {
    grid-template-areas: "book copy" !important;
    grid-template-columns: 66px minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
  }
}

/* Final Today shell contract: the empty invitation and a saved moment use the
   same outer rail, corner tokens, padding, and section gap. Content may grow,
   but the component never changes its design system after the first save. */
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeMemoryOfDay {
  --home-today-radius: 28px;
  --home-today-inner-radius: 23px;
  --home-today-card-padding: 10px;
  --home-today-card-gap: 10px;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard #homeMemoryOfDay .today-memory-card.today-memory-card:is(.is-empty-today, .has-today-memory) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  box-sizing: border-box !important;
  width: min(100%, var(--home-today-rail)) !important;
  max-width: var(--home-today-rail) !important;
  min-width: 0 !important;
  gap: var(--home-today-card-gap) !important;
  padding: var(--home-today-card-padding) !important;
  overflow: hidden !important;
  border-radius: var(--home-today-radius) !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard #homeMemoryOfDay .today-memory-card.today-memory-card:is(.is-empty-today, .has-today-memory) .today-memory-main {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: var(--home-today-inner-radius) !important;
}

@media (max-width: 699px) {
  html body main.app-shell section.map-stage.home-focus #homeDashboard #homeMemoryOfDay {
    --home-today-radius: 24px;
    --home-today-inner-radius: 19px;
    --home-today-card-padding: 8px;
    --home-today-card-gap: 8px;
  }
}

/* Final touch-target lock, kept after every older Home override. */
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay .memory-echo-relive,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney .life-chapter-actions button {
  box-sizing: border-box !important;
  min-height: 44px !important;
}