/* A failed Home module keeps its place and offers one calm, local retry. */

/* The clearer desktop action needs room for its complete label. Photo-led
   cards intentionally keep their compact circular arrow control. */
@media (min-width: 761px) {
  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-main.has-text-only .today-memory-copy,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-main.has-text-only .today-memory-copy {
    padding-right: 164px !important;
  }

  html body .app-shell .map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-main.has-text-only .today-memory-relive-button,
  html body main.app-shell section.map-stage.home-focus #homeMemoryOfDay .today-memory-card.has-today-memory .today-memory-main.has-text-only .today-memory-relive-button {
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
  }
}

html body .app-shell .map-stage.home-focus #homeDashboard > .home-section.home-section-render-failed,
html body main.app-shell section.map-stage.home-focus #homeDashboard > .home-section.home-section-render-failed {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: min(100%, 980px) !important;
  max-width: 980px !important;
  min-height: 112px !important;
  margin: 0 auto !important;
  padding: clamp(18px, 2.4vw, 24px) !important;
  gap: 14px !important;
  overflow: hidden !important;
  color: #123f46 !important;
  border: 1px solid rgba(20, 119, 105, 0.17) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 10% 10%, rgba(80, 213, 171, 0.14), transparent 42%),
    rgba(250, 255, 252, 0.96) !important;
  box-shadow: 0 14px 34px rgba(18, 67, 71, 0.09) !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-mark,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-mark {
  display: grid !important;
  width: 44px !important;
  height: 44px !important;
  place-items: center !important;
  color: #087d70 !important;
  border: 1px solid rgba(10, 137, 116, 0.18) !important;
  border-radius: 50% !important;
  background: rgba(79, 210, 166, 0.14) !important;
  font: 700 24px/1 ui-rounded, "SF Pro Rounded", system-ui, sans-serif !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-copy,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 5px !important;
  text-align: left !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-copy strong,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-copy strong {
  color: #103f46 !important;
  font: 750 clamp(15px, 1.8vw, 17px)/1.25 ui-rounded, "SF Pro Rounded", system-ui, sans-serif !important;
  letter-spacing: -0.01em !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-copy small,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-copy small {
  max-width: 56ch !important;
  color: rgba(19, 66, 72, 0.72) !important;
  font: 580 13px/1.45 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-retry,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-retry {
  box-sizing: border-box !important;
  min-width: 112px !important;
  min-height: 44px !important;
  padding: 10px 17px !important;
  color: #ffffff !important;
  border: 1px solid rgba(4, 89, 83, 0.14) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #0b927e, #087369) !important;
  box-shadow: 0 8px 18px rgba(8, 115, 105, 0.18) !important;
  font: 720 13px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  cursor: pointer !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-retry:hover,
html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-retry:focus-visible,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-retry:hover,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-retry:focus-visible {
  filter: brightness(1.05) saturate(1.04) !important;
  transform: translateY(-1px) !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-retry:focus-visible,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-retry:focus-visible {
  outline: 3px solid rgba(47, 189, 157, 0.34) !important;
  outline-offset: 3px !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery.is-retrying .home-section-recovery-mark,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery.is-retrying .home-section-recovery-mark {
  animation: mymappi-home-recovery-spin 0.8s linear infinite !important;
}

html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-retry:disabled,
html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-retry:disabled {
  opacity: 0.72 !important;
  cursor: wait !important;
  transform: none !important;
}

@keyframes mymappi-home-recovery-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 600px) {
  html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    min-height: 0 !important;
    padding: 17px !important;
    gap: 12px !important;
    border-radius: 21px !important;
  }

  html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery-retry,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery-retry {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .app-shell .map-stage.home-focus #homeDashboard .home-section-recovery.is-retrying .home-section-recovery-mark,
  html body main.app-shell section.map-stage.home-focus #homeDashboard .home-section-recovery.is-retrying .home-section-recovery-mark {
    animation: none !important;
  }
}