/* One card footprint for every rarity and promo. Only presentation changes. */
.card-artwork-frame {
  display:block;
  position:relative;
  aspect-ratio:5/7;
  width:100%;
  min-width:0;
  overflow:hidden;
  flex-shrink:0;
  isolation:isolate;
}
.card-artwork-frame[data-card-artwork] > img {
  display:block;
  position:absolute;
  left:var(--card-art-left,0%);
  top:var(--card-art-top,0%);
  width:var(--card-art-width,100%);
  height:var(--card-art-height,100%);
  max-width:none;
  max-height:none;
  margin:0;
  padding:0;
  aspect-ratio:auto;
  object-fit:contain;
  transform:none;
}
.footballer-card,
.footballer-card[data-rarity],
.footballer-card.base-artwork-card,
.footballer-card.rarity-artwork-card,
.binder-empty-slot {
  aspect-ratio:5/7;
}
.footballer-card.base-artwork-card,
.footballer-card.rarity-artwork-card {
  padding:0;
}
.footballer-card.base-artwork-card > .card-artwork-frame,
.footballer-card.rarity-artwork-card > .card-artwork-frame {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
/* Preserve each context's intentional thumbnail size with the same proportions. */
.card-artwork-frame.compact-base-card-art {width:42px;height:auto}
.card-artwork-frame.drafted-slot-card-art {width:76px;height:auto}
#results .card-artwork-frame.full-time-card-art {width:68px;height:auto}
.star-signing-card-detail > .card-artwork-frame {width:100%;max-width:190px;margin:auto}
/* Promo galleries use the same mobile card density as the POTM gallery. */
.potm-gallery,.star-signings-promo-detail {width:min(780px,100%)}
.star-signings-gallery-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.star-signings-gallery-card {padding:0 0 8px;gap:5px}
@media (min-width:761px) {
  .star-signings-gallery-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:720px) {
  /* The nine-slot binder has bounded rows as well as columns. Fitting only its
     height let max-width clamp the card into a skinny, mismatched rectangle. */
  .binder-slot {container-type:size}
  .binder-slot .footballer-card {
    width:min(100cqw,calc(100cqh * 5 / 7));
    height:auto;
  }
}
@media (max-width:520px) {
  .card-artwork-frame.compact-base-card-art {width:36px}
  .card-artwork-frame.drafted-slot-card-art {width:62px}
  #results .card-artwork-frame.full-time-card-art {width:58px}
}