/* Navigation belongs outside the coordinate-bearing map stage. */
#view-world .world-map-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;padding:12px 18px;background:#111f34;border-block:1px solid #43516a;scroll-margin-top:112px}
#view-world .world-stage-actions,#view-world .world-breadcrumb,#view-world .world-stage-legend,#view-world .world-location-caption{position:static;inset:auto;transform:none;max-width:none;z-index:auto}
#view-world .world-stage-actions{display:flex;gap:8px;flex-shrink:0}
#view-world .world-stage-actions:not(:has(button:not(.hidden))){display:none}
#view-world .world-stage-actions .button{min-height:42px;padding:10px 16px;font-size:12px}
#view-world .world-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-left:auto;padding:0;border:0;background:none;box-shadow:none;overflow:visible}
#view-world .world-breadcrumb button,#view-world .world-breadcrumb b{font-size:12px;white-space:normal;word-break:keep-all}
#view-world .world-breadcrumb button{min-height:42px;padding:8px 12px}
#view-world .world-map-key{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 16px;padding:10px 18px;background:#111f34;border-bottom:1px solid #43516a}
#view-world .world-stage-legend{display:flex;flex-wrap:wrap;gap:12px;padding:0;background:none;backdrop-filter:none}
#view-world .world-stage-legend span{width:auto;height:auto;font-size:11px;padding:3px 0;white-space:nowrap}
#view-world .world-stage-legend i{font-size:12px}
#view-world .world-location-caption{padding:0;border:0;background:none;box-shadow:none;font-size:12px;color:#c8d6e9}
/* The map is the single location picker; below it, only the selected record. */
#view-world .world-info{grid-template-columns:minmax(0,1fr)}
#view-world .world-info>:is(.world-info-header,.country-detail,.related-block){grid-column:1/-1;min-width:0}
#view-world .world-info>:is(.country-detail,.related-block):empty{display:none}

@media(max-width:800px){
  /* Anchor name, actions and pagination to one shared hero, not a text offset. */
  #view-home .hero-grid{height:clamp(560px,calc(100svh - 175px),650px);min-height:0;padding:0}
  #view-home .hero-copy{position:static;padding-top:24px}
  #view-home .hero-logo{width:62%;max-width:225px;margin:9px 0 0}
  #view-home .hero-copy .eyebrow{margin:0;font-size:8px}
  #view-home .hero h1{font-size:22px;line-height:1.25;margin:9px 0 6px}
  #view-home .hero-copy>p{font-size:11px;line-height:1.65;max-width:85%;margin:0}
  #view-home .hero-copy>:not(.hero-actions):not(.home-hero-stats){position:relative;z-index:3}
  #view-home .hero-actions{top:auto;bottom:60px;left:0;right:0;z-index:4;align-items:stretch}
  #view-home .hero-actions .button{min-height:48px}
  #view-home .hero-character-caption{bottom:130px}
  #view-home .home-hero-stats{display:none}
  #view-home .hero-dots{bottom:8px}

  /* A partial fifth item plus a tappable edge makes overflow unmistakable. */
  #mobileNav{grid-template-columns:none;grid-auto-columns:calc((100% - 18px)/4.5);gap:6px;padding-inline:26px;scroll-padding-inline:26px;overflow-y:hidden;scroll-snap-type:x proximity;overscroll-behavior-inline:contain}
  #mobileNav button{min-width:0;min-height:44px;scroll-snap-align:start;white-space:nowrap}
  #mobileNav.has-more-right{mask-image:linear-gradient(90deg,#000 0%,#000 calc(100% - 24px),transparent 100%)}
  #mobileNav.has-more-left{mask-image:linear-gradient(90deg,transparent 0%,#000 24px,#000 100%)}
  #mobileNav.has-more-left.has-more-right{mask-image:linear-gradient(90deg,transparent 0%,#000 24px,#000 calc(100% - 24px),transparent 100%)}
  body.mh-redesign .mobile-nav-edge{display:grid!important;place-items:center;position:fixed;z-index:95;width:26px;min-height:44px;margin:0;padding:0 0 max(0px,env(safe-area-inset-bottom));border:0;border-radius:0;background:#101b2ff0;color:#e6d2ad;font:500 27px var(--font-ui);opacity:0;visibility:hidden;pointer-events:none;transform:none;animation:none;transition:opacity .18s}
  body.mh-redesign .mobile-nav-edge.visible{opacity:1;visibility:visible;pointer-events:auto;transform:none;animation:none}
  body.mh-redesign .mobile-nav-edge-left{left:0;right:auto}
  body.mh-redesign .mobile-nav-edge-right{right:0;left:auto}
  body.mh-redesign .mobile-nav-edge:focus-visible{outline:2px solid #e6d2ad;outline-offset:-3px}

  #view-world .world-map-controls{gap:8px;padding:10px 12px;scroll-margin-top:108px}
  #view-world .world-breadcrumb{width:100%;margin-left:0;gap:5px}
  #view-world .world-breadcrumb button,#view-world .world-breadcrumb b{font-size:11px}
  #view-world .world-stage{position:relative;top:auto;z-index:auto}
  #view-world .world-map-key{padding:9px 12px}
  #view-world .world-stage-legend{gap:14px}
  #view-world .world-stage-legend span{font-size:11px}
}
@media(prefers-reduced-motion:reduce){body.mh-redesign .mobile-nav-edge{transition:none}}
