/* Desktop PoE2 / item-card media: keep product art fully visible.
   Mobile already has overrides in ugm-hotfix-pay-mqn.css (<=960px).
   Desktop was clipping via overflow:hidden + 3D tilt transforms. */

@media (min-width: 961px) {
  .shop-page.skin-poe2 .item-card--art,
  .shop-page.skin-poe2 .item-card--card-only,
  .shop-page.skin-poe2 .item-card--poe2-currency,
  .shop-page.skin-poe2 .item-grid .item-card {
    overflow: visible !important;
  }

  .shop-page.skin-poe2 .poe2-card-media,
  .shop-page.skin-poe2 .item-card--poe2-currency .poe2-card-media,
  .shop-page.skin-poe2 .item-card[data-desk='currency'] .poe2-card-media,
  .shop-page.skin-poe2 .item-card[data-desk='items'] .poe2-card-media,
  .shop-page.skin-poe2 .item-card--art .poe2-card-media {
    --poe2-media-max-h: 168px;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: 196px !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    /* keep radius clean, but pad enough so art never touches clipped corners */
    overflow: hidden !important;
    padding: 1.15rem 0.9rem 1.05rem !important;
    perspective: none !important;
    transform: none !important;
  }

  .shop-page.skin-poe2 .poe2-card-media img,
  .shop-page.skin-poe2 .item-card--poe2-currency .poe2-card-media img,
  .shop-page.skin-poe2 .item-card[data-desk='currency'] .poe2-card-media img,
  .shop-page.skin-poe2 .item-card[data-desk='items'] .poe2-card-media img,
  .shop-page.skin-poe2 .item-card--art .poe2-card-media img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
    max-width: min(100%, 168px) !important;
    max-height: var(--poe2-media-max-h, 168px) !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center center !important;
    image-rendering: auto !important;
    filter: none !important;
    transform: none !important;
    will-change: auto !important;
    pointer-events: none !important;
    z-index: 2 !important;
  }

  /* Tilt glare must not cover/clip the product art on desktop. */
  .shop-page.skin-poe2 .poe2-card-media--tilt::after,
  .shop-page.skin-poe2 .poe2-card-media--tilt.is-tilting::after,
  .shop-page.skin-poe2 .poe2-card-media--tilt:hover::after {
    opacity: 0 !important;
    display: none !important;
  }

  .shop-page.skin-poe2 .poe2-card-media--tilt.is-tilting img,
  .shop-page.skin-poe2 .poe2-card-media--tilt:hover img,
  .shop-page.skin-poe2 .item-card--poe2-currency .poe2-card-media--tilt.is-tilting img,
  .shop-page.skin-poe2 .item-card--poe2-currency .poe2-card-media--tilt:hover img,
  .shop-page.skin-poe2 .item-card[data-desk='currency'] .poe2-card-media--tilt.is-tilting img,
  .shop-page.skin-poe2 .item-card[data-desk='currency'] .poe2-card-media--tilt:hover img {
    transform: none !important;
    filter: none !important;
  }
}

/* Safety for any desktop width where item art cards still clip. */
@media (min-width: 961px) {
  .item-card--art .item-card-tilt,
  .item-card--art .product-showcase,
  .item-card--art .product-showcase img,
  .acc-card--art .acc-card-tilt img {
    max-width: 100% !important;
    object-fit: contain !important;
  }
}