/* ==========================================================
   Free printables (printables.html, printables/*.html).
   Loaded after assets/style.css. Written for tools/build-printables.mjs.
   ========================================================== */

/* the printable's picture beside its name (same look as a game page) */
.game-hero-art {
  width: clamp(200px, 34vw, 420px); height: auto; border-radius: 28px;
  border: 6px solid #fff; background: #fff; rotate: -3deg;
  box-shadow: 0 10px 0 rgba(6,58,84,.18), 0 18px 32px rgba(6,58,84,.18);
}
@media (max-width: 640px) { .game-hero-art { width: min(100%, 340px); } }

.pr-downloads { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.1rem 0 .5rem; }
.pr-meta { margin: .3rem 0 0; font-size: .92rem; font-weight: 700; color: #0C4A63; }
.pr-pin { color: #A3104F; font-weight: 900; }
.pr-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin: 1.1rem 0 0; }

/* every page of the printable, small */
.pr-thumbs {
  list-style: none; padding: 0; margin: 1.6rem auto 0; max-width: 1040px;
  display: grid; gap: clamp(.6rem, 1.6vw, 1.1rem); justify-content: center;
  grid-template-columns: repeat(auto-fit, minmax(140px, 190px));
}
.pr-thumbs.is-many { grid-template-columns: repeat(auto-fit, minmax(104px, 128px)); }
.pr-thumbs img {
  display: block; width: 100%; height: auto; background: #fff; border-radius: 8px;
  border: 1px solid #E4E6EF; box-shadow: 0 4px 0 rgba(42,46,67,.08), 0 6px 14px rgba(42,46,67,.10);
}
.pr-again { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin: 1.6rem 0 0; }