/* One shared icon/title/privacy grid for both scopes, in the existing rail.
   Reserve the chevron column in Our Map without implying a second action. */
html body #mapScopeCaption > [data-open-your-world] { display: none !important; }
html body main.app-shell section.map-stage.map-focus #mapScopeCaption {
  grid-template-columns: 14px minmax(0, 1fr) 8px;
  grid-template-rows: 14px 12px;
  align-content: center; align-items: center; justify-content: stretch !important;
  min-height: 44px !important; padding: 7px 5px !important;
  column-gap: 3px !important; row-gap: 2px !important;
  text-align: left !important;
}
html body .map-stage.map-focus #mapScopeCaption[data-scope="mm"] > :is(svg, strong, span) { visibility: hidden !important; }
html body .map-stage.map-focus #mapScopeCaption[data-scope="mm"] > [data-open-your-world] {
  /* Include the caption's border in the 44px tap target. */
  position: absolute !important; inset: -1px !important; display: grid !important;
  box-sizing: border-box !important;
  grid-template-columns: 14px minmax(0, 1fr) 8px; grid-template-rows: 14px 12px;
  align-content: center !important; align-items: center !important; justify-content: stretch !important;
  width: calc(100% + 2px) !important; height: calc(100% + 2px) !important; min-height: 44px !important;
  margin: 0 !important; padding: 7px 5px !important; column-gap: 3px !important; row-gap: 2px !important;
  border: 1px solid transparent !important; text-align: left !important;
  border-radius: inherit !important; color: #fff !important; background: transparent !important;
  box-shadow: none !important; cursor: pointer; font: 600 12px/1.2 system-ui !important;
  pointer-events: auto !important;
}
html body #mapScopeCaption > strong,
html body #mapScopeCaption .world-entry-title {
  grid-column: 2; grid-row: 1; margin: 0 !important; padding: 0 !important;
  color: #fff !important; font: 700 11px/14px system-ui !important;
  letter-spacing: -.01em !important; text-align: left !important; white-space: nowrap;
}
html body #mapScopeCaption > span,
html body #mapScopeCaption .world-entry-privacy {
  grid-column: 2; grid-row: 2; margin: 0 !important; padding: 0 !important;
  color: #bcd8dd !important; font: 500 10px/12px system-ui !important;
  letter-spacing: -.01em !important; text-align: left !important; white-space: nowrap;
}
html body #mapScopeCaption > svg,
html body #mapScopeCaption .world-entry-icon {
  grid-column: 1; grid-row: 1 / 3; align-self: center; justify-self: center;
  width: 14px !important; height: 14px !important; margin: 0 !important; color: #75d9c3 !important;
  min-width: 0 !important; font-size: 14px !important; line-height: 14px !important;
}
html body #mapScopeCaption .world-entry-chevron {
  grid-column: 3; grid-row: 1 / 3; align-self: center; justify-self: center;
  width: 8px !important; height: 12px !important; margin: 0 !important; color: #75d9c3 !important;
  min-width: 0 !important; font-size: 10px !important; line-height: 12px !important;
}
html body #mapScopeCaption :is(.world-entry-icon, .world-entry-chevron) > svg {
  display: block; width: 100% !important; height: 100% !important; margin: 0 !important;
}
html body #yourWorldDialog {
  box-sizing: border-box !important; padding: 0 !important; border: 1px solid #d9e6e5 !important;
  border-radius: 24px !important; width: min(600px, calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right))) !important;
  max-width: none !important; height: auto !important; min-height: 0 !important;
  max-height: calc(var(--mymappi-visible-height, 100dvh) - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  inset: 0 !important; margin: auto !important; overflow: hidden !important;
  color: #00243f !important; background: #fcfefd !important; box-shadow: 0 16px 55px #00243f33 !important;
}
html body #yourWorldDialog:not([open]) { display: none !important; }
html body #yourWorldDialog::backdrop { background: #00243f66; }
html body #yourWorldDialog .world-panel {
  box-sizing: border-box; margin: 0; padding: 0 22px 22px; overflow-y: auto; overscroll-behavior: contain;
  max-height: calc(var(--mymappi-visible-height, 100dvh) - 26px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  text-align: left; touch-action: pan-y; -webkit-overflow-scrolling: touch;
}
html body #yourWorldDialog :is(h2,h3,p,dl,dd,ul) { margin: 0; padding: 0; }
html body #yourWorldDialog :is(button,summary) { font: inherit; cursor: pointer; min-height: 44px; min-width: 44px; }
html body #yourWorldDialog button { box-sizing: border-box; color: #00243f; box-shadow: none; text-transform: none; letter-spacing: normal; }
html body #yourWorldDialog :is(button,summary):focus-visible,
html body #mapScopeCaption [data-open-your-world]:focus-visible { outline: 3px solid #147c80 !important; outline-offset: -3px !important; }
html body #yourWorldDialog svg { width: 22px; height: 22px; flex: 0 0 22px; }
html body #yourWorldDialog header { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 20px 0 14px; background: #fcfefd; border-bottom: 1px solid #e1eae8; }
html body #yourWorldDialog header small { color: #536e77; font-size: .65rem; font-weight: 650; letter-spacing: .1em; }
html body #yourWorldDialog h2 { font-size: 1.5rem; line-height: 1.25; }
html body #yourWorldDialog h3 { font-size: 1.1rem; line-height: 1.35; }
html body #yourWorldDialog [data-world-close] { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; background: #eef5f3; border: 1px solid #d4e2df; padding: 10px; }
html body #yourWorldDialog p { color: #536b75; font-size: .875rem; line-height: 1.55; }
html body #yourWorldDialog .world-intro { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 12px; row-gap: 5px; align-items: center; padding: 20px 0; }
html body #yourWorldDialog .world-intro > :is(svg, [data-icon]) { grid-column: 1; grid-row: 1 / 3; align-self: start; color: #278b81; width: 30px; height: 30px; margin: 2px 0 0; }
html body #yourWorldDialog .world-intro h3 { grid-column: 2; font-size: 1.25rem; line-height: 1.35; margin: 0; }
html body #yourWorldDialog .world-intro p { grid-column: 2; }
html body #yourWorldDialog .world-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-bottom: 26px; }
html body #yourWorldDialog .world-stats > div { display: flex; flex-direction: column-reverse; justify-content: end; gap: 3px; padding: 14px; border-radius: 14px; background: #eef6f3; }
html body #yourWorldDialog dt { font-size: .75rem; line-height: 1.4; color: #46636f; }
html body #yourWorldDialog dd { font-size: 1.7rem; font-weight: 650; }
html body #yourWorldDialog .world-milestones > p { margin: 6px 0 14px; }
html body #yourWorldDialog .world-milestones-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; }
html body #yourWorldDialog .world-milestones-heading small { color: #4b736b; font-size: .75rem; font-weight: 650; }
html body #yourWorldDialog .world-milestone { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px; margin: 10px 0; background: #fff; border: 1px solid #dbe7e3; border-radius: 16px; text-align: left; }
html body #yourWorldDialog .world-milestone.is-earned { background: #f1f9f4; border-color: #accdc0; }
html body #yourWorldDialog .world-stamp { display: grid; place-items: center; flex: 0 0 40px; height: 40px; color: #376b6b; border-radius: 50%; background: #e7f3ef; }
html body #yourWorldDialog .is-earned .world-stamp { background: #ceeade; color: #175c51; }
html body #yourWorldDialog .world-milestone-copy { display: grid; flex: 1; min-width: 0; gap: 5px; }
html body #yourWorldDialog .world-milestone-copy strong { font-size: 1rem; line-height: 1.35; }
html body #yourWorldDialog .world-milestone-copy > span { color: #526b75; font-size: .8rem; line-height: 1.4; }
html body #yourWorldDialog .world-milestone-copy small { font-size: .7rem; color: #416b64; }
html body #yourWorldDialog progress { width: 100%; height: 4px; border: none; border-radius: 3px; overflow: hidden; background: #e8eeeb; accent-color: #258579; }
html body #yourWorldDialog progress::-webkit-progress-bar { background: #e8eeeb; }
html body #yourWorldDialog progress::-webkit-progress-value { background: #258579; }
html body #yourWorldDialog .world-stories { border-top: 1px solid #dce8e3; padding-top: 20px; margin-top: 20px; }
html body #yourWorldDialog .world-milestones .world-stories { margin: -2px 0 18px; padding: 16px; border: 1px solid #cde2db; border-radius: 16px; background: #f5faf7; }
html body #yourWorldDialog .world-milestones .world-stories h3 { font-size: 1rem; }
html body #yourWorldDialog .world-stories[hidden] { display: none !important; }
html body #yourWorldDialog .world-stories p { margin: 8px 0; }
html body #yourWorldDialog .world-stories li { list-style: none; }
html body #yourWorldDialog .world-stories button { width: 100%; padding: 12px 2px; background: transparent; border: 0; border-bottom: 1px solid #e5ece8; display: flex; justify-content: space-between; align-items: center; gap: 12px; text-align: left; }
html body #yourWorldDialog .world-stories button > span { min-width: 0; }
html body #yourWorldDialog .world-stories strong { display: block; font-size: .9rem; line-height: 1.4; overflow-wrap: anywhere; }
html body #yourWorldDialog .world-stories small { display: block; font-size: .75rem; color: #536c76; margin-top: 4px; }
html body #yourWorldDialog .world-keepsakes-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 14px; padding: 12px 16px; border: 1px solid #b6d6cc; border-radius: 14px; background: #eef8f4; color: #074653; font-size: .875rem; font-weight: 650; }
html body #yourWorldDialog .world-keepsakes-toggle svg { width: 18px; height: 18px; flex-basis: 18px; }
html body #yourWorldDialog .world-counting { margin-top: 20px; font-size: .8rem; }
html body #yourWorldDialog summary { display: flex; align-items: center; font-weight: 600; }
html body #yourWorldDialog .world-counting p { margin-bottom: 10px; }
html body #yourWorldDialog footer { padding-top: 20px; }
html body #yourWorldDialog [data-world-create] { display: flex; gap: 10px; align-items: center; justify-content: center; width: 100%; padding: 13px; color: #fff; background: #00243f; border: 0; border-radius: 14px; font-weight: 650; }
html body #yourWorldDialog footer p { text-align: center; margin-top: 10px; font-size: .75rem; }
html body #yourWorldDialog .world-engagement { padding: 18px; margin-bottom: 26px; border: 1px solid #c7ded6; background: #f2f8f4; border-radius: 18px; }
html body #yourWorldDialog .world-mappi-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
html body #yourWorldDialog .world-mappi-heading img { object-fit: contain; flex: 0 0 48px; }
html body #yourWorldDialog .world-engagement small { color: #476e66; font-size: .68rem; line-height: 1.5; }
html body #yourWorldDialog .world-engagement p { margin: 8px 0; }
html body #yourWorldDialog .world-engagement button { padding: 10px 12px; border: 1px solid #bcd5ce; border-radius: 12px; background: #fff; }
html body #yourWorldDialog .world-engagement .world-primary { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; margin: 14px 0; color: #fff; background: #00243f; border: 0; font-weight: 650; }
html body #yourWorldDialog .world-moods { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
html body #yourWorldDialog .world-moods [aria-pressed="true"] { background: #75d7c3; color: #00243f; border-color: #247c71; }
html body #yourWorldDialog button:disabled { opacity: .6; cursor: default; }
html body #yourWorldDialog .world-adventure-compose label { display: block; font-size: .85rem; font-weight: 600; }
html body #yourWorldDialog .world-adventure-compose label small { display: block; font-weight: 400; }
html body #yourWorldDialog .world-adventure-refresh[hidden] { display: none !important; }
html body #yourWorldDialog input { box-sizing: border-box; width: 100%; min-width: 0; min-height: 44px; font: inherit; font-size: 16px; padding: 10px; margin: 8px 0; border: 1px solid #bcd5ce; border-radius: 10px; background: #fff; color: #00243f; }
html body #yourWorldDialog .world-adventure-result { background: #fff; padding: 14px; border: 1px solid #cadfd5; border-radius: 14px; margin: 14px 0; overflow-wrap: anywhere; }
html body #yourWorldDialog .world-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
html body #yourWorldDialog .world-actions > button { flex: 1 1 120px; }
html body #yourWorldDialog .world-actions > button:first-child { color: #fff; background: #00243f; }
html body #yourWorldDialog .world-local-note { font-size: .7rem; }
html body #yourWorldDialog .world-text-action { border: 0; background: transparent; text-decoration: underline; font-size: .8rem; margin-top: 8px; }
html body #yourWorldDialog .world-feedback:empty { display: none; }
html body #yourWorldDialog .world-feedback { color: #175c51; font-weight: 600; }
html body #yourWorldDialog .world-challenge { border-top: 1px solid #cadfd5; margin-top: 18px; padding-top: 18px; }
html body #yourWorldDialog .world-challenge > small:last-child { display: block; margin-top: 10px; }
html body #yourWorldDialog .world-receipts button { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; text-align: left; margin: 6px 0; }
html body #yourWorldDialog .world-area-choices { display: grid; gap: 8px; }
html body #yourWorldDialog :is(p,strong,h2,h3,button,dt) { overflow-wrap: anywhere; }
html body #mappiIntelligenceDialog .mi-adventure-entry { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 44px; padding: 12px 14px; margin-top: 12px; border: 1px solid #b9d9cf; border-radius: 14px; background: #eef8f2; color: #00243f; font: 600 .9rem/1.4 system-ui; }
html body #mappiIntelligenceDialog .mi-adventure-entry[hidden] { display: none !important; }
html body #memorySaveConfirmation .world-save-milestone { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid #bbd8d2; padding-top: 8px; }
html body #memorySaveConfirmation .world-save-milestone > span { color: inherit; font-size: .85rem; font-weight: 650; }
html body #memorySaveConfirmation .world-save-milestone > button { position: static; flex: 0 0 auto; width: auto; height: auto; min-height: 44px; padding: 8px 12px; border: 1px solid #9dc7bd; border-radius: 12px; color: #00243f; background: #dcf1e9; font-size: .8rem; }
@media (max-width: 360px) {
  html body #yourWorldDialog .world-panel { padding-inline: 14px; }
  html body #yourWorldDialog .world-milestone { padding: 12px 10px; gap: 8px; }
  html body #yourWorldDialog .world-stamp { flex-basis: 30px; height: 30px; }
}

/* A landscape collection should show its invitation, not just its totals.
   Keep all four values and their labels together; larger text grows the row
   naturally inside the existing scroller instead of clipping the content. */
@media (orientation: landscape) and (min-width: 540px) {
  html body #yourWorldDialog .world-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  html body #yourWorldDialog .world-stats > div { min-width: 0; justify-content: start; padding: 10px 8px; }
  html body #yourWorldDialog dt { font-size: .6875rem; }
  html body #yourWorldDialog dd { font-size: 1.4rem; line-height: 1.2; overflow-wrap: anywhere; }
}
@media (orientation: landscape) and (max-height: 540px) {
  html body #yourWorldDialog .world-panel { padding: 0 18px 18px; }
  html body #yourWorldDialog header { padding: 10px 0; gap: 10px; }
  html body #yourWorldDialog header small { font-size: .625rem; }
  html body #yourWorldDialog h2 { font-size: 1.25rem; }
  html body #yourWorldDialog .world-intro { grid-template-columns: 26px minmax(0, 1fr); column-gap: 10px; row-gap: 3px; padding: 14px 0; }
  html body #yourWorldDialog .world-intro > :is(svg, [data-icon]) { width: 26px; height: 26px; }
  html body #yourWorldDialog .world-intro h3 { font-size: 1.125rem; }
  html body #yourWorldDialog .world-intro p { font-size: .8125rem; }
  html body #yourWorldDialog .world-stats { margin-bottom: 16px; }
  html body #yourWorldDialog .world-engagement { padding: 14px; margin-bottom: 20px; }
  html body #yourWorldDialog .world-mappi-heading { gap: 10px; margin-bottom: 8px; }
  html body #yourWorldDialog .world-engagement .world-primary { margin: 10px 0; }
}