/* Build 750: intentional public OM stories without changing private MM memories. */

html body .our-map-story-dialog {
  width: min(472px, calc(100vw - 24px)) !important;
  max-width: 472px !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 25px !important;
  color: #123f46 !important;
  background: transparent !important;
}

html body .our-map-story-dialog::backdrop {
  background: rgba(2, 24, 34, 0.62) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

html body .our-map-story-panel {
  box-sizing: border-box !important;
  display: grid !important;
  max-height: calc(100dvh - 24px) !important;
  gap: 13px !important;
  padding: 20px !important;
  overflow: auto !important;
  border: 1px solid rgba(175, 224, 211, 0.76) !important;
  border-radius: 25px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(98, 226, 190, 0.2), transparent 33%),
    #fbfffd !important;
  box-shadow: 0 28px 70px rgba(0, 27, 39, 0.36), inset 0 1px 0 #ffffff !important;
}

html body .our-map-story-panel > header {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 44px !important;
  gap: 10px !important;
  align-items: center !important;
}

html body .our-map-story-mark {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center !important;
  border-radius: 15px !important;
  color: #ffffff !important;
  background: linear-gradient(145deg, #ee7860, #d64f53) !important;
  box-shadow: 0 8px 18px rgba(139, 41, 41, 0.22) !important;
  font-size: 1.1rem !important;
  font-weight: 950 !important;
}

html body .our-map-story-panel header small {
  display: block !important;
  color: #0a8678 !important;
  font-size: 0.55rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

html body .our-map-story-panel h2 {
  margin: 2px 0 0 !important;
  color: #0c3942 !important;
  font-size: 1.16rem !important;
  line-height: 1.15 !important;
}

html body #ourMapStoryClose {
  display: grid !important;
  width: 44px !important;
  height: 44px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #42686a !important;
  background: #eaf6f1 !important;
  cursor: pointer !important;
}

html body #ourMapStoryIntro {
  margin: 0 !important;
  color: #60787a !important;
  font-size: 0.72rem !important;
  line-height: 1.45 !important;
}

html body .our-map-story-place {
  display: grid !important;
  grid-template-columns: 39px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 10px 11px !important;
  border: 1px solid rgba(15, 128, 112, 0.13) !important;
  border-radius: 15px !important;
  background: #edf8f4 !important;
}

html body .our-map-story-place > span {
  display: grid !important;
  width: 38px !important;
  height: 38px !important;
  place-items: center !important;
  border-radius: 13px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 10px rgba(14, 87, 83, 0.1) !important;
  font-size: 1rem !important;
}

html body .our-map-story-place small,
html body .our-map-story-place strong {
  display: block !important;
}

html body .our-map-story-place small {
  color: #61807f !important;
  font-size: 0.54rem !important;
  font-weight: 780 !important;
}

html body .our-map-story-place strong {
  margin-top: 1px !important;
  overflow: hidden !important;
  color: #144d51 !important;
  font-size: 0.75rem !important;
  font-weight: 900 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .our-map-story-panel > label:not(.our-map-story-consent) {
  display: grid !important;
  gap: 5px !important;
  color: #204f54 !important;
  font-size: 0.65rem !important;
  font-weight: 850 !important;
}

html body .our-map-story-panel > label > small {
  color: #738688 !important;
  font-size: 0.54rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

html body .our-map-story-panel input[type="text"],
html body .our-map-story-panel textarea {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 46px !important;
  padding: 11px 12px !important;
  border: 1px solid rgba(26, 105, 101, 0.18) !important;
  border-radius: 13px !important;
  outline: none !important;
  color: #143f45 !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 2px rgba(4, 58, 63, 0.04) !important;
  font: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 650 !important;
}

html body .our-map-story-panel textarea {
  min-height: 112px !important;
  resize: vertical !important;
  line-height: 1.45 !important;
}

html body .our-map-story-panel input:focus,
html body .our-map-story-panel textarea:focus {
  border-color: #0d8e80 !important;
  box-shadow: 0 0 0 3px rgba(15, 151, 134, 0.13) !important;
}

html body .our-map-story-consent {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  gap: 9px !important;
  align-items: flex-start !important;
  padding: 11px !important;
  border: 1px solid rgba(224, 91, 77, 0.16) !important;
  border-radius: 14px !important;
  color: #72524f !important;
  background: #fff4ef !important;
  cursor: pointer !important;
}

html body .our-map-story-consent input {
  width: 20px !important;
  height: 20px !important;
  margin: 1px 0 0 !important;
  accent-color: #0d897c !important;
}

html body .our-map-story-consent strong,
html body .our-map-story-consent small {
  display: block !important;
}

html body .our-map-story-consent strong {
  color: #8e3d38 !important;
  font-size: 0.64rem !important;
  font-weight: 900 !important;
}

html body .our-map-story-consent small {
  margin-top: 2px !important;
  font-size: 0.56rem !important;
  line-height: 1.35 !important;
}

html body .our-map-story-safety {
  display: flex !important;
  gap: 8px !important;
  margin: 0 !important;
  color: #60777a !important;
  font-size: 0.56rem !important;
  line-height: 1.4 !important;
}

html body .our-map-story-status {
  min-height: 0 !important;
  margin: 0 !important;
  color: #526f72 !important;
  font-size: 0.62rem !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
}

html body .our-map-story-status:empty {
  display: none !important;
}

html body .our-map-story-status.is-error {
  color: #a13c3c !important;
}

html body .our-map-story-status.is-success {
  color: #08766a !important;
}

html body .our-map-story-panel > footer {
  display: grid !important;
  grid-template-columns: 0.7fr 1.3fr !important;
  gap: 9px !important;
}

html body .our-map-story-panel > footer button {
  min-height: 48px !important;
  border-radius: 15px !important;
  font-size: 0.7rem !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

html body .our-map-story-cancel {
  border: 1px solid rgba(31, 102, 99, 0.14) !important;
  color: #527173 !important;
  background: #edf6f3 !important;
}

html body .our-map-story-publish {
  border: 0 !important;
  color: #ffffff !important;
  background: linear-gradient(145deg, #087d72, #18aa93) !important;
  box-shadow: 0 9px 20px rgba(5, 94, 87, 0.2) !important;
}

html body .our-map-story-publish:disabled {
  opacity: 0.58 !important;
  cursor: wait !important;
}

html body .our-map-public-story-action {
  width: 100% !important;
  min-height: 42px !important;
  margin-top: 6px !important;
  border: 1px solid rgba(13, 133, 119, 0.2) !important;
  border-radius: 12px !important;
  color: #08776d !important;
  background: #e7f8f3 !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

@media (max-width: 720px) {
  html body .our-map-story-panel {
    padding: 17px !important;
  }
}

@media (max-width: 370px) {
  html body .our-map-story-panel > footer {
    grid-template-columns: 1fr !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .our-map-story-dialog::backdrop {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

html body .our-map-stories-dialog {
  width: min(472px, calc(100vw - 24px)) !important;
  max-width: 472px !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 25px !important;
  color: #123f46 !important;
  background: transparent !important;
}

html body .our-map-stories-dialog::backdrop {
  background: rgba(2, 24, 34, 0.62) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

html body .our-map-stories-panel {
  box-sizing: border-box !important;
  display: grid !important;
  max-height: calc(100dvh - 24px) !important;
  gap: 13px !important;
  padding: 20px !important;
  overflow: auto !important;
  border: 1px solid rgba(175, 224, 211, 0.76) !important;
  border-radius: 25px !important;
  background: radial-gradient(circle at 8% 0%, rgba(98, 226, 190, 0.2), transparent 33%), #fbfffd !important;
  box-shadow: 0 28px 70px rgba(0, 27, 39, 0.36), inset 0 1px 0 #ffffff !important;
}

html body .our-map-stories-panel > header {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 44px !important;
  gap: 10px !important;
  align-items: center !important;
}

html body .our-map-stories-mark {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center !important;
  border-radius: 15px !important;
  color: #ffffff !important;
  background: linear-gradient(145deg, #ee7860, #d64f53) !important;
  box-shadow: 0 8px 18px rgba(139, 41, 41, 0.22) !important;
  font-size: 1.1rem !important;
  font-weight: 950 !important;
}

html body .our-map-stories-panel header small {
  display: block !important;
  color: #0a8678 !important;
  font-size: 0.55rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

html body .our-map-stories-panel h2 {
  margin: 2px 0 0 !important;
  color: #0c3942 !important;
  font-size: 1.12rem !important;
  line-height: 1.15 !important;
}

html body #ourMapStoriesClose {
  display: grid !important;
  width: 44px !important;
  height: 44px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #42686a !important;
  background: #eaf6f1 !important;
  cursor: pointer !important;
}

html body #ourMapStoriesIntro {
  margin: 0 !important;
  color: #60787a !important;
  font-size: 0.7rem !important;
  line-height: 1.45 !important;
}

html body .our-map-stories-place {
  display: grid !important;
  grid-template-columns: 39px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 10px 11px !important;
  border: 1px solid rgba(15, 128, 112, 0.13) !important;
  border-radius: 15px !important;
  background: #edf8f4 !important;
}

html body .our-map-stories-place > span {
  display: grid !important;
  width: 38px !important;
  height: 38px !important;
  place-items: center !important;
  border-radius: 13px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 10px rgba(14, 87, 83, 0.1) !important;
  font-size: 1rem !important;
}

html body .our-map-stories-place small,
html body .our-map-stories-place strong {
  display: block !important;
}

html body .our-map-stories-place small {
  color: #0a8074 !important;
  font-size: 0.52rem !important;
  font-weight: 850 !important;
}

html body .our-map-stories-place strong {
  margin-top: 1px !important;
  overflow: hidden !important;
  color: #144d51 !important;
  font-size: 0.75rem !important;
  font-weight: 900 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .our-map-stories-status {
  margin: 0 !important;
  color: #5c7678 !important;
  font-size: 0.61rem !important;
  font-weight: 760 !important;
  line-height: 1.35 !important;
}

html body .our-map-stories-status.is-error {
  color: #a13c3c !important;
}

html body .our-map-stories-list {
  display: grid !important;
  gap: 9px !important;
}

html body .our-map-public-story-card {
  display: grid !important;
  gap: 7px !important;
  padding: 13px !important;
  border: 1px solid rgba(25, 109, 103, 0.11) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 7px 18px rgba(7, 67, 70, 0.07) !important;
}

html body .our-map-public-story-card > header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

html body .our-map-public-story-card header strong {
  color: #0a8074 !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
}

html body .our-map-public-story-card header small {
  color: #849394 !important;
  font-size: 0.52rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html body .our-map-public-story-card h3 {
  margin: 0 !important;
  color: #173f45 !important;
  font-size: 0.76rem !important;
  line-height: 1.25 !important;
}

html body .our-map-public-story-card p {
  margin: 0 !important;
  color: #556f72 !important;
  font-size: 0.66rem !important;
  line-height: 1.48 !important;
}

html body .our-map-public-story-card > footer {
  display: flex !important;
  gap: 7px !important;
  padding-top: 3px !important;
}

html body .our-map-public-story-card > footer button {
  min-height: 36px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(37, 104, 101, 0.12) !important;
  border-radius: 10px !important;
  color: #677c7e !important;
  background: #f1f7f5 !important;
  font-size: 0.56rem !important;
  font-weight: 850 !important;
  cursor: pointer !important;
}

html body .our-map-stories-empty,
html body .our-map-stories-loading {
  display: grid !important;
  min-height: 124px !important;
  place-items: center !important;
  align-content: center !important;
  gap: 5px !important;
  padding: 18px !important;
  border: 1px dashed rgba(23, 126, 115, 0.2) !important;
  border-radius: 16px !important;
  color: #0c8175 !important;
  background: #f1faf7 !important;
  text-align: center !important;
}

html body .our-map-stories-empty > span,
html body .our-map-stories-loading > span {
  font-size: 1rem !important;
}

html body .our-map-stories-empty strong,
html body .our-map-stories-loading strong {
  color: #245458 !important;
  font-size: 0.7rem !important;
  font-weight: 900 !important;
}

html body .our-map-stories-empty small {
  max-width: 290px !important;
  color: #6e8384 !important;
  font-size: 0.59rem !important;
  line-height: 1.4 !important;
}

html body .our-map-stories-safety {
  display: flex !important;
  gap: 8px !important;
  margin: 0 !important;
  color: #60777a !important;
  font-size: 0.56rem !important;
  line-height: 1.4 !important;
}

html body .our-map-stories-panel > footer {
  display: grid !important;
  grid-template-columns: 1fr 0.7fr !important;
  gap: 9px !important;
}

html body .our-map-stories-panel > footer button {
  min-height: 48px !important;
  border-radius: 15px !important;
  font-size: 0.7rem !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

html body .our-map-stories-add {
  border: 0 !important;
  color: #ffffff !important;
  background: linear-gradient(145deg, #087d72, #18aa93) !important;
  box-shadow: 0 9px 20px rgba(5, 94, 87, 0.18) !important;
}

html body .our-map-stories-done {
  border: 1px solid rgba(31, 102, 99, 0.14) !important;
  color: #527173 !important;
  background: #edf6f3 !important;
}

html body .our-map-story-stack-count {
  border: 1px solid rgba(226, 83, 75, 0.18) !important;
  cursor: pointer !important;
}

@media (max-width: 720px) {
  html body .our-map-stories-panel {
    padding: 17px !important;
  }
}