/* maps.css — the Language Maps gallery (/languages/maps/ only). Ported from
   fab-svelte's MapBlock.svelte. */
.map-block { display:grid; grid-template-columns:repeat(2,1fr); gap:2rem 1rem; list-style:none;
  margin:1.5rem auto 0; padding-inline:1rem; max-width:72rem; }
.map-block a { position:relative; display:block; color:inherit; }
.map-block a:hover { text-decoration:none; }
.map-thumb { display:block; width:100%; aspect-ratio:10/7; border-radius:.5rem; background:var(--surface-2);
  overflow:hidden; box-shadow:0 0 0 2px #22c55e, 0 0 0 4px var(--surface); }
.map-thumb img { object-fit:cover; display:block; width:100%; height:100%; }
.map-name { margin:.5rem 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:.875rem; font-weight:700; color:var(--fg); }
.map-size { margin:0; font-size:.8rem; font-weight:500; color:var(--muted); }

@media (min-width:640px) {
  .map-block { grid-template-columns:repeat(3,1fr); gap:1.5rem; }
}

@media (min-width:1024px) {
  .map-block { grid-template-columns:repeat(4,1fr); }
}
