/* Companion Home actions use one geometry in every account state. */
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard :is(button#homeReliveMyMap, button#homeJourneyRecap, #homeJourney .life-chapter-import-row button.life-chapter-trip-start) {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 44px !important;
  align-items: center !important;
  width: min(100%, 600px) !important;
  max-width: 600px !important;
  min-width: 0 !important;
  height: 68px !important;
  min-height: 68px !important;
  min-block-size: 68px !important;
  margin-inline: auto !important;
  padding: 9px 11px !important;
  gap: 12px !important;
  border: 1px solid rgba(0, 36, 63, .12) !important;
  border-radius: 20px !important;
  color: var(--mymappi-action-navy, #00243f) !important;
  background: rgba(248, 253, 251, .96) !important;
  box-shadow: 0 8px 22px rgba(0, 36, 63, .07) !important;
  text-align: left !important;
  animation: none !important;
  transform: none !important;
  transition: border-color 160ms ease, transform 160ms ease !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard :is(button#homeReliveMyMap, button#homeJourneyRecap, #homeJourney .life-chapter-import-row button.life-chapter-trip-start)[hidden] { display: none !important; }
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard :is(button#homeReliveMyMap, button#homeJourneyRecap, #homeJourney .life-chapter-import-row button.life-chapter-trip-start):is(:hover, :focus-visible) {
  border-color: rgba(0, 36, 63, .3) !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard :is(button#homeReliveMyMap, button#homeJourneyRecap, #homeJourney .life-chapter-import-row button.life-chapter-trip-start):active:not(:disabled) { transform: scale(.99) !important; }
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-import-row .life-chapter-trip-active-actions {
  display: grid !important;
  width: 100% !important;
  max-width: 600px !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: center !important;
  gap: 8px !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-import-row .life-chapter-trip-end {
  width: auto !important;
  min-height: 44px !important;
  height: auto !important;
  color: #526f7c !important;
  background: transparent !important;
  box-shadow: none !important;
  border-color: transparent !important;
  font-size: .76rem !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start :is(.life-chapter-trip-start-icon, .life-chapter-trip-start-arrow) {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start .life-chapter-trip-start-icon {
  color: var(--mymappi-action-navy, #00243f) !important;
  background: rgba(115, 223, 200, .18) !important;
  border-radius: 36% !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start .life-chapter-trip-start-icon svg { width: 26px !important; height: 26px !important; }
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start .life-chapter-trip-start-arrow {
  background: var(--mymappi-action-navy, #00243f) !important;
  color: white !important;
  border-radius: 50% !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start .life-chapter-trip-start-arrow svg { width: 18px !important; height: 18px !important; }
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start .life-chapter-trip-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 3px !important;
  text-align: left !important;
}
html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard #homeJourney .life-chapter-trip-start .life-chapter-trip-copy .life-chapter-trip-start-label {
  font-size: clamp(.94rem, 2vw, 1.08rem) !important;
  font-weight: 860 !important;
  letter-spacing: -.018em !important;
  line-height: 1.18 !important;
  text-align: left !important;
  color: var(--mymappi-action-navy, #00243f) !important;
}

/* Calm, keyboard-safe trip setup and a clear first-memory handoff. */
html body :is(dialog#tripEntryDialog, dialog#activeTripDialog) {
  position: fixed !important;
  inset: var(--trip-dialog-top, 12px) auto auto 50% !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: min(560px, calc(100% - 24px)) !important;
  max-width: calc(100% - 24px) !important;
  height: auto !important;
  max-height: var(--trip-dialog-height, calc(100dvh - 24px)) !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 36, 63, .12) !important;
  border-radius: 26px !important;
  color: #00243f !important;
  background: linear-gradient(135deg, #e6f4fb, #edf9f1) !important;
}
html body :is(#tripEntryDialog, #activeTripDialog) [hidden] { display: none !important; }
html body :is(#tripEntryDialog .trip-entry-panel, #activeTripDialog .active-trip-panel) {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  max-height: var(--trip-dialog-height, calc(100dvh - 24px)) !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
  background: transparent !important;
}
html body :is(#tripEntryDialog, #activeTripDialog) :is(.trip-entry-header, .active-trip-header) { padding: 22px 22px 14px !important; }
html body :is(#tripEntryDialog, #activeTripDialog) :is(h2, p) { overflow-wrap: anywhere; }
html body :is(#tripEntryDialog, #activeTripDialog) h2 { color: #00243f !important; font-size: clamp(1.35rem, 3vw, 1.65rem) !important; line-height: 1.18 !important; }
html body :is(#tripEntryDialog, #activeTripDialog) :is(.trip-entry-body, .active-trip-body) { padding: 4px 22px 18px !important; }
html body #tripEntryDialog .trip-entry-options { grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; }
html body #tripEntryDialog .trip-entry-option {
  min-height: 100px !important;
  padding: 16px !important;
  grid-template-columns: 44px minmax(0, 1fr) 20px !important;
  gap: 12px !important;
  border: 1px solid rgba(0, 36, 63, .12) !important;
  border-radius: 20px !important;
  color: #00243f !important;
  background: rgba(255,255,255,.85) !important;
  box-shadow: none !important;
}
html body #tripEntryDialog .trip-entry-option:hover,
html body #tripEntryDialog .trip-entry-option:focus-visible {
  transform: none !important;
}
html body #tripEntryDialog .trip-entry-option-icon { background: #daf4ed !important; color: #00243f !important; width: 44px !important; height: 44px !important; }
html body #activeTripDialog .active-trip-fields { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
html body #activeTripDialog .active-trip-fields label { font-size: .82rem !important; }
html body #activeTripDialog input {
  box-sizing: border-box !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 48px !important;
  font-size: 16px !important;
  color: #00243f !important;
  background: white !important;
  border: 1px solid #ccdee4 !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
}
html body #activeTripDialog details { margin-block: 14px; }
html body #activeTripDialog summary { cursor: pointer; min-height: 44px; align-content: center; font-size: .85rem; font-weight: 750; color: #365d6c; }
html body #activeTripDialog :is([data-trip-search-status], [data-trip-draft-status]) { font-size: .8rem !important; line-height: 1.5 !important; color: #526f7c !important; }
html body #activeTripDialog [data-trip-draft-status][data-state="error"] { color: #a63245 !important; }
html body #activeTripDialog .active-trip-footer {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 14px 22px !important;
  border-top: 1px solid #ccdee4 !important;
  background: #edf7f5 !important;
}
html body #activeTripDialog .active-trip-footer button { min-height: 46px !important; min-width: 44px !important; padding: 10px 15px !important; font-size: .82rem !important; }
html body #activeTripDialog .active-trip-primary { background: #00243f !important; color: white !important; box-shadow: none !important; }
html body #activeTripDialog .trip-ready-note { display: flex; align-items: center; gap: 14px; padding: 14px; background: #daf4ed; border-radius: 18px; }
html body #activeTripDialog .trip-ready-note svg { width: 28px; height: 28px; flex: none; }
html body #activeTripDialog .trip-ready-note p { margin: 0; font-size: .95rem; line-height: 1.5; }
html body #activeTripDialog [data-trip-destination-results] { display: grid; gap: 8px; }
html body #activeTripDialog :is([data-trip-destination], [data-trip-search-retry], [data-trip-manual-location]) {
  min-height: 44px; width: 100%; padding: 12px; border: 1px solid #ccdee4; border-radius: 14px; background: #f8fdfb; color: #00243f; font: inherit; font-size: .82rem; text-align: left; cursor: pointer;
}
html body #activeTripDialog [data-trip-destination] { display: grid; grid-template-columns: minmax(0, 1fr) 20px; align-items: center; gap: 12px; }
html body #activeTripDialog [data-trip-destination] small { display: block; color: #526f7c; line-height: 1.5; margin-top: 4px; }
html body #activeTripDialog [data-trip-manual-location] { margin-top: 10px; background: transparent; text-align: center; }
html body :is(#activeTripDialog, #tripEntryDialog) :is(button, input, summary):focus-visible { outline: 3px solid #63cfc2 !important; outline-offset: 2px !important; }
@media (max-width: 720px), (max-height: 520px) and (hover: none) and (pointer: coarse) {
  html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard :is(button#homeReliveMyMap, button#homeJourneyRecap, #homeJourney .life-chapter-import-row button.life-chapter-trip-start) {
    height: 64px !important; min-height: 64px !important; min-block-size: 64px !important;
    width: 100% !important; max-width: 100% !important; gap: 8px !important; border-radius: 18px !important;
  }
}
@media (max-width: 420px) {
  html body :is(#tripEntryDialog, #activeTripDialog) :is(.trip-entry-header, .active-trip-header) { padding: 18px 16px 12px !important; }
  html body :is(#tripEntryDialog, #activeTripDialog) :is(.trip-entry-body, .active-trip-body) { padding-inline: 16px !important; }
  html body #activeTripDialog .active-trip-footer { padding: 12px 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body main.app-shell section.map-stage.home-focus #homeDashboard.home-dashboard :is(button#homeReliveMyMap, button#homeJourneyRecap, #homeJourney .life-chapter-import-row button.life-chapter-trip-start) { transition: none !important; transform: none !important; }
}