/* WORLD PAGE MAP PATCH V2 — correct selectors for the actual page */

/* Reduce the visible map box to roughly 25% of the previous full-width footprint */
body[data-page="world"] .atlas-frame{
  width:25% !important;
  max-width:430px !important;
  min-width:0 !important;
  margin:0 auto !important;
  padding:8px !important;
  overflow:hidden !important;
  max-height:none !important;

  /* Match the approved Start Here transparency */
  background:linear-gradient(
    145deg,
    rgba(20,16,12,.30),
    rgba(8,10,13,.34)
  ) !important;
  backdrop-filter:blur(2px) !important;
  -webkit-backdrop-filter:blur(2px) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.28) !important;
}

/* Scale the map itself to fit the smaller box cleanly */
body[data-page="world"] .atlas-frame #map-image{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  display:block !important;
  transform:none !important;
}

/* Keep caption compact */
body[data-page="world"] .atlas-frame figcaption{
  padding:5px 2px 1px !important;
  margin:0 !important;
  line-height:1.2 !important;
}

/* Tighten map selector and tool controls */
body[data-page="world"] .map-switch{
  gap:6px !important;
  margin-bottom:8px !important;
}

body[data-page="world"] .map-tools{
  gap:6px !important;
  margin:8px 0 16px !important;
}

body[data-page="world"] .map-switch button,
body[data-page="world"] .map-tools .btn{
  margin:0 !important;
  padding:.55rem .75rem !important;
}

/* Tablet/mobile: keep it usable */
@media(max-width:900px){
  body[data-page="world"] .atlas-frame{
    width:48% !important;
    max-width:480px !important;
  }
}

@media(max-width:640px){
  body[data-page="world"] .atlas-frame{
    width:88% !important;
    max-width:none !important;
  }
}


/* V3: Make the three lower World-page information boxes match Start Here transparency */
body[data-page="world"] .world-grid > .panel,
body[data-page="world"] .grid-3 > .panel{
  background:linear-gradient(
    145deg,
    rgba(20,16,12,.30),
    rgba(8,10,13,.34)
  ) !important;
  backdrop-filter:blur(2px) !important;
  -webkit-backdrop-filter:blur(2px) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.28) !important;
}

/* Preserve readability */
body[data-page="world"] .world-grid > .panel p,
body[data-page="world"] .grid-3 > .panel p,
body[data-page="world"] .world-grid > .panel h3,
body[data-page="world"] .grid-3 > .panel h3{
  text-shadow:0 2px 3px rgba(0,0,0,.88) !important;
}
