/* Final Home rhythm: centered sections, one width system, and no sideways spill. */
html body main.app-shell section.map-stage.home-focus #homeDashboard,
html body .app-shell section.map-stage.home-focus #homeDashboard {
  box-sizing: border-box !important;
  display: grid !important;
  width: min(calc(100% - 32px), 1080px) !important;
  max-width: 1080px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-bottom: calc(var(--bottom-nav-height, 84px) + 70px) !important;
  padding-left: 0 !important;
  row-gap: clamp(38px, 4.5vw, 56px) !important;
  overflow-x: clip !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard > .home-section,
html body .app-shell section.map-stage.home-focus #homeDashboard > .home-section {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-heading,
html body .app-shell section.map-stage.home-focus #homeDashboard .home-section-heading {
  box-sizing: border-box !important;
  display: grid !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 16px !important;
  padding: 0 !important;
  gap: 6px !important;
  justify-items: center !important;
  text-align: center !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-heading > *,
html body .app-shell section.map-stage.home-focus #homeDashboard .home-section-heading > * {
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard .home-quick-actions,
html body .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: min(100%, 980px) !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  gap: clamp(10px, 1.4vw, 15px) !important;
  overflow: hidden !important;
}

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

html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay .memory-echo-feature,
html body .app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay .memory-echo-feature,
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney > :not(.home-section-heading),
html body .app-shell section.map-stage.home-focus #homeDashboard #homeJourney > :not(.home-section-heading),
html body main.app-shell section.map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-memories-panel,
html body .app-shell section.map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-memories-panel {
  box-sizing: border-box !important;
  width: min(100%, 980px) !important;
  max-width: 980px !important;
  min-width: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeOnThisDay,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeJourney,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeTimelineStrip,
html body .app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeOnThisDay,
html body .app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeJourney,
html body .app-shell section.map-stage.home-focus #homeDashboard.is-empty-home #homeTimelineStrip {
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .premium-empty-preview,
html body .app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .premium-empty-preview,
html body main.app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .memory-echo-feature-card,
html body .app-shell section.map-stage.home-focus #homeDashboard.is-empty-home .memory-echo-feature-card {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
}

html body main.app-shell section.map-stage.home-focus #homeDashboard > .home-mappi-bottom-note,
html body .app-shell section.map-stage.home-focus #homeDashboard > .home-mappi-bottom-note {
  width: 100% !important;
  margin: -10px auto 0 !important;
  text-align: center !important;
}

@media (max-width: 720px), (hover: none) and (pointer: coarse) and (max-width: 1024px) {
  html body main.app-shell section.map-stage.home-focus #homeDashboard,
  html body .app-shell section.map-stage.home-focus #homeDashboard {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    row-gap: 32px !important;
    padding-bottom: calc(var(--bottom-nav-height, 78px) + env(safe-area-inset-bottom) + 52px) !important;
  }

  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-heading,
  html body .app-shell section.map-stage.home-focus #homeDashboard .home-section-heading {
    margin-bottom: 12px !important;
  }

  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-quick-actions,
  html body .app-shell section.map-stage.home-focus #homeDashboard .home-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: min(100%, 390px) !important;
    gap: 9px !important;
  }

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

  html body main.app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay .memory-echo-feature,
  html body .app-shell section.map-stage.home-focus #homeDashboard #homeOnThisDay .memory-echo-feature,
  html body main.app-shell section.map-stage.home-focus #homeDashboard #homeJourney > :not(.home-section-heading),
  html body .app-shell section.map-stage.home-focus #homeDashboard #homeJourney > :not(.home-section-heading),
  html body main.app-shell section.map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-memories-panel,
  html body .app-shell section.map-stage.home-focus #homeDashboard #homeTimelineStrip .recent-memories-panel {
    width: 100% !important;
    max-width: 100% !important;
  }
}
