/* The common navigation remains outside the canvas. The graph keeps its engine. */
body.map-page { --map-top: 210px; margin: 0; height: 100dvh; width: 100%; overflow: hidden !important; background: #102d46; }
.map-page .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.map-page > .site-header { position: relative; top: auto; z-index: 45; width: 100%; }
.map-toolbar { position: relative; z-index: 24; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; padding: 12px 24px; border-bottom: 1px solid #547189; background: #102d46; color: #f6f3ed; }
.map-toolbar-title h1 { margin: 0; color: #fff; font-size: 21px; line-height: 1.3; }
.map-toolbar-title p { max-width: 60ch; margin: 4px 0 0; color: #dceaf3; font-size: 13px; }
.map-toolbar-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.map-toolbar button, .map-toolbar select, .map-toolbar input { min-height: 44px; border: 1px solid #829eb3; border-radius: 4px; padding: 8px 10px; background: #fff; color: #102d46; font-size: 13px; }
.map-toolbar select { width: min(340px, 100%); max-width: 36vw; }
.map-toolbar input { width: 205px; }
.map-page #search-input { width: 100%; min-height: 44px; background: #fff; color: #102d46; }
.map-page #search-input::placeholder { color: #405e70; }
.map-page .map-state-message { margin: 8px 0 0; padding: 6px 10px; border-left: 3px solid #c4ae8f; color: #f6f3ed; font-size: 13px; }
.map-toolbar button { font-weight: 700; cursor: pointer; }
.map-local-search { position: relative; }
.map-local-search #search-results { position: absolute; top: 50px; right: 0; z-index: 60; width: min(390px, 90vw); max-height: min(480px, 50dvh); overflow: auto; background: #102d46; border: 1px solid #829eb3; box-shadow: 0 10px 30px #0008; }
.map-page #brain-canvas { position: fixed; inset: var(--map-top) 0 0; width: 100%; height: calc(100dvh - var(--map-top)); }
.map-page #navigation-sidebar, .map-page #inspection-drawer { position: fixed; top: var(--map-top); bottom: 0; height: calc(100dvh - var(--map-top)); z-index: 35; }
.map-page .graph-list-panel { position: fixed; top: calc(var(--map-top) + 12px); z-index: 40; }
.map-page #loop-banner { position: fixed; top: calc(var(--map-top) + 10px); max-height: calc(100dvh - var(--map-top) - 22px); overflow: auto; }
.map-page #loop-banner-close { min-width: 44px; min-height: 44px; flex-shrink: 0; }
.map-page .graph-quick-card { position: fixed; top: calc(var(--map-top) + 16px); max-height: calc(100dvh - var(--map-top) - 105px); overflow: auto; }
.map-page #inspection-drawer.fullscreen-drawer { width: min(1040px,100vw); }
.map-page #drawer-section-nav { position: relative; top: auto; min-height: auto; }
.map-page .graph-tools, .map-page .graph-minimap, .map-page .graph-popover { position: fixed; }
.map-page #map-prompt { display: none; }
.map-page .map-canonical-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; padding: 8px 12px; border: 1px solid currentColor; border-radius: 4px; color: #fff; font-weight: 700; font-size: 13px; }
.map-page .graph-quick-card .map-canonical-link { color: #205b90; background: #fff; }
.map-page .map-relation-status { display: block; margin-top: 4px; color: #dceaf3; font-size: 11px; line-height: 1.4; }
.map-actor-role { font-size: 11px; color: #dceaf3; }
#map-copy-fallback { display: block; width: 100%; min-height: 170px; padding: 10px; background: #fff; color: #102d46; font-size: 13px; }
.map-page .map-registry-status { padding-top: 12px; font-size: 12px; color: #405e70; }
.map-nojs { position: fixed; top: var(--map-top); bottom: 0; left: 0; right: 0; z-index: 44; padding: 30px; background: #f6f3ed; color: #102d46; overflow: auto; }
.map-nojs a { text-decoration: underline; }
@media (max-width: 900px) {
  .map-toolbar { padding: 9px 12px; gap: 8px; }
  .map-toolbar-title p { display: none; }
  .map-toolbar-title h1 { font-size: 18px; }
  .map-toolbar-controls { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr); }
  .map-toolbar select { width: 100%; max-width: none; }
  .map-toolbar input { width: 100%; }
  .map-local-search { min-width: 0; }
  .map-page .graph-tools { bottom: 12px; }
  .map-page .graph-quick-card { top: auto; bottom: 10px; max-height: min(50dvh,calc(100dvh - var(--map-top) - 20px)); }
  .map-page .graph-list-panel { top: calc(var(--map-top) + 6px); bottom: 8px; }
  .map-page #tour-bar { max-height: min(42dvh,calc(100dvh - var(--map-top) - 16px)); }
}
@media (prefers-reduced-motion:reduce) { .map-page * { scroll-behavior: auto !important; } }

.map-page #main-content { min-height: 0; height: 0; width: 100%; }

/* One readable journey card on narrow screens; modal centering survives reset CSS. */
.map-page .guide-conclusion { position: fixed; inset: 0; margin: auto; }
@media (max-width: 760px) {
  .map-page #tour-bar:not(.tour-bar-docked) { left: 10px; right: 10px; bottom: 10px; width: auto; max-width: none; max-height: calc(100dvh - var(--map-top) - 20px); transform: none; }
  .map-page.map-tour-active .graph-quick-card { display: none; }
  .map-page #tour-concept-link { margin-top: 0; }
}

.map-page .map-stage-status { display: block; margin: 5px 0 0; color: #fff; font-weight: 700; font-size: 13px; }
@media (min-width: 761px) {
  .map-page #tour-bar:not(.tour-bar-docked) { left: 16px; right: 420px; bottom: 24px; width: auto; max-width: 672px; max-height: calc(100dvh - var(--map-top) - 40px); overflow-y: auto; transform: none; }
}