/* MONSTARICA v42 — Prevent illustration clipping.
 * Keep original square artwork, the existing card aspect ratio and all finish layers.
 * v41 left .card-art in normal flow; in compact cards it overlapped the stat panel.
 * Anchor illustration to the area ABOVE the panel. Image itself is always contained.
 */
.game-card[data-rarity-tier] .card-art {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 34% !important;
  left: 0 !important;
  inset: 0 0 34% 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}
.game-card[data-rarity-tier] .card-art > img {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  flex: 0 0 100% !important;
  transform: none !important;
  scale: 1 !important;
}
/* The mobile five-card view uses a 31% information band. */
.mobile-five-card .game-card[data-rarity-tier] .card-art {
  inset: 0 0 31% 0 !important;
  bottom: 31% !important;
}
/* This mobile panel had been set to 31% earlier, but a later rule reset it to 34%.
   Pin both parts to the same boundary to avoid an 8px overlap. */
.mobile-five-card .game-card[data-rarity-tier] .card-info {
  height: 31% !important;
}
/* Keep the information panel in its own layer; effects stay above art background only. */
.game-card[data-rarity-tier] .card-info {
  z-index: 7;
}