/* Darkapp V26 — image upload preservation + slot-driven rendering.
   Original upload bytes are never modified. CSS scales all images to each visual slot;
   a high-resolution WebP derivative is created only when an uploaded image has
   transparent outer padding that CSS alone cannot remove. */

html body .product-card > .product-media,
html body .custom-product-card > .product-media,
html body .plus-product-card > .product-media,
html body .social-product-card > .product-media,
html body .games-product-card > .product-media,
html body .tools-product-card > .product-media,
html body .category-store-products-v12 .product-card > .product-media,
html body .category-official-product-card .product-media {
  box-sizing:border-box !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  flex:0 0 auto !important;
  aspect-ratio:1 / 1 !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  position:relative !important;
  border-radius:inherit !important;
}

html body .product-card > .product-media > img,
html body .custom-product-card > .product-media > img,
html body .plus-product-card > .product-media > img,
html body .social-product-card > .product-media > img,
html body .games-product-card > .product-media > img,
html body .tools-product-card > .product-media > img,
html body .category-store-products-v12 .product-card > .product-media > img,
html body .category-official-product-card .product-media > img,
html body .discount-card-image > img,
html body .similar-card-img-wrap > img,
html body .cart-item-image > img,
html body .cart-page-image > img,
html body .direct-order-image > img,
html body .global-search-item > img,
html body .favorite-card > img,
html body .tools-product-media > img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  padding:0 !important;
  margin:0 !important;
  object-fit:cover !important;
  object-position:center center !important;
  image-rendering:auto !important;
}

html body .discount-card-image {
  box-sizing:border-box !important;
  overflow:hidden !important;
  padding:0 !important;
  border-radius:inherit !important;
}
html body .similar-card-img-wrap {overflow:hidden !important; border-radius:inherit !important;}
html body .cart-item-image,
html body .cart-page-image,
html body .direct-order-image,
html body .global-search-item > img,
html body .favorite-card > img,
html body .tools-product-media {overflow:hidden !important; border-radius:inherit !important;}
html body .cart-page-image,
html body .global-search-item > img,
html body .favorite-card > img {background:#080c16 !important;}
html body .tools-product-media {position:relative !important; padding:0 !important;}
html body .tools-product-media > img {object-fit:cover !important; object-position:center !important;}
html body .reviews-banner-wrap {aspect-ratio:1496 / 300 !important; height:auto !important; overflow:hidden !important;}
html body .reviews-banner {display:block !important; width:100% !important; max-width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important;}
html body .tools-hero > img {display:block !important; width:100% !important; max-width:100% !important; object-fit:cover !important; object-position:center !important;}
html body .cart-page-image,
html body .cart-item-image,
html body .direct-order-image {aspect-ratio:1 / 1 !important;}
html body .global-search-item > img {width:58px !important; height:58px !important; flex:0 0 58px !important; object-fit:cover !important;}
html body .favorite-card > img {width:100% !important; height:auto !important; aspect-ratio:1.15 / 1 !important; object-fit:cover !important;}
html body .tools-product-card > .tools-product-media {width:100% !important; max-width:100% !important; flex:0 0 auto !important; overflow:hidden !important; padding:0 !important;}
html body .tools-product-card > .tools-product-media > img {display:block !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important;}


/* Wide homepage and section banners use the slot proportions, with cover-cropping. */
html body #home > .hero-reference {
  aspect-ratio:1536 / 325 !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:hidden !important;
}
html body #home > .hero-reference > img {
  display:block !important; width:100% !important; height:100% !important;
  min-height:0 !important; max-height:none !important; object-fit:cover !important; object-position:center !important;
}
html body #home > .features-reference {overflow:hidden !important;}
html body #home > .features-reference > img {
  display:block !important; width:100% !important; height:85px !important;
  min-height:85px !important; max-height:85px !important; object-fit:cover !important;
}
html body #home .best-banner-wrap {
  aspect-ratio:1496 / 160 !important; height:auto !important; overflow:hidden !important;
}
html body #home .best-banner-wrap > .best-banner {
  display:block !important; width:100% !important; height:100% !important;
  object-fit:cover !important; object-position:center !important;
}
html body #home .plus-banner-wrap {height:auto !important; aspect-ratio:1280 / 340 !important; overflow:hidden !important;}
html body #home .social-banner-wrap {height:auto !important; aspect-ratio:1476 / 420 !important; overflow:hidden !important;}
html body #home .games-banner-wrap {height:auto !important; aspect-ratio:1460 / 416 !important; overflow:hidden !important;}
html body #home .plus-banner,
html body #home .social-banner,
html body #home .games-banner {
  display:block !important; width:100% !important; height:100% !important;
  min-height:0 !important; max-height:none !important; aspect-ratio:auto !important;
  object-fit:cover !important; object-position:center center !important;
}

/* Category/custom section banners and collection artwork follow their rounded box. */
html body .category-page-banner-wrap,
html body .category-store-banner-v12,
html body .category-official-banner-wrap,
html body .custom-section-banner-wrap {overflow:hidden !important;}
html body .category-page-banner-wrap,
html body .category-store-banner-v12,
html body .category-official-banner-wrap {aspect-ratio:1600 / 450 !important; height:auto !important;}
html body .custom-section-banner-wrap {aspect-ratio:1346 / 340 !important; height:auto !important;}
html body .category-page-banner-wrap > img,
html body .category-store-banner-v12 > img,
html body .category-official-banner-wrap > img,
html body .custom-section-banner-wrap > .custom-section-banner {
  display:block !important; width:100% !important; height:100% !important;
  min-height:0 !important; max-height:none !important; object-fit:cover !important; object-position:center center !important;
}
html body .game-group-card,
html body .category-official-group-image {overflow:hidden !important; border-radius:inherit !important;}
html body .game-group-card > img,
html body .category-official-group-image > img {width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important;}

/* Uploaded logo marks and invoice logos intentionally use contain to avoid cutting branding. */
html body .brand-v2-logo,
html body .brand-logo,
html body .footer-logo-ring img,
html body .da-maintenance-logo,
html body .invoice-logo img {object-fit:contain !important;}

@media (max-width:760px) {
  html body #home > .hero-reference {aspect-ratio:16 / 5 !important;}
  html body #home > .hero-reference > img {height:100% !important; object-fit:cover !important;}
  html body .reviews-banner-wrap {aspect-ratio:16 / 5 !important;}
}

/* Final coverage for every image-bearing storefront tile. Product art fills its
   viewport; branding/logos are excluded above so they are not cropped. */
html body .tools-product-media,
html body .product-media,
html body .plus-product-media,
html body .social-product-media,
html body .games-product-media {
  overflow:hidden !important;
  padding:0 !important;
  background:#080c16 !important;
}
html body .product-media,
html body .plus-product-media,
html body .social-product-media,
html body .games-product-media {
  border-top-left-radius:inherit !important;
  border-top-right-radius:inherit !important;
  border-bottom-left-radius:0 !important;
  border-bottom-right-radius:0 !important;
}
html body .discount-card-image > img,
html body .similar-card-img-wrap > img,
html body .cart-item-image > img,
html body .cart-page-image > img,
html body .direct-order-image > img,
html body .global-search-item > img,
html body .favorite-card > img,
html body .tools-product-media > img,
html body .product-detail .product-visual > img {
  image-rendering:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
}
html body .game-art > img,
html body .group-art > img,
html body .group-main-image,
html body .offer-image > img,
html body .group-image-preview > img,
html body .game-tile .game-art > img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
}
html body .game-art,
html body .group-art,
html body .offer-image,
html body .group-image-preview {overflow:hidden !important;}
html body .cart-page-image > img,
html body .cart-item-image > img,
html body .direct-order-image > img {border-radius:inherit !important;}
html body .global-search-item > img {border-radius:10px !important;}
html body .favorite-card > img {border-radius:inherit !important;}
