/* Smuggler physical merchandise + deal sheet imagery. */
#cofp-smuggler-preview .smg-hotspot > span {
  display: none !important;
}

.smg-sheet .smg-popup-asset {
  width: 100%;
  height: 230px;
  margin: 14px 0 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(255,60,207,.18);
  background: radial-gradient(circle at 50% 45%, rgba(255,60,207,.08), rgba(0,0,0,.08) 58%, rgba(0,0,0,.32));
}
.smg-sheet .smg-popup-asset img,
.smg-sheet .smg-popup-asset canvas {
  width: 92%;
  height: 92%;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 12px 18px rgba(0,0,0,.58));
}

@media (min-width: 769px) {
  #cofp-smuggler-preview .smg-hotspot {
    overflow: visible !important;
    perspective: 640px;
    transform-style: preserve-3d;
  }
  #cofp-smuggler-preview .smg-merch-object {
    position: absolute;
    left: var(--smg-anchor-x, 50%);
    top: var(--smg-anchor-y, 55%);
    width: var(--smg-object-width, 130%);
    height: var(--smg-object-height, 170%);
    transform: translate(-50%, -100%);
    transform-origin: 50% 100%;
    pointer-events: none;
    z-index: 2;
  }
  #cofp-smuggler-preview .smg-merch-plane {
    width: 100%;
    height: 100%;
    transform-origin: 50% 100%;
    transform-style: preserve-3d;
    transform: perspective(640px) rotateZ(var(--smg-z, 0deg)) rotateX(var(--smg-x, 0deg)) rotateY(var(--smg-y, 0deg));
    transition: transform .18s ease, filter .18s ease;
  }
  #cofp-smuggler-preview .smg-merch-img,
  #cofp-smuggler-preview .smg-merch-keyed {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 4px 5px rgba(0,0,0,.46));
  }
  #cofp-smuggler-preview .smg-hotspot:hover .smg-merch-plane {
    transform: perspective(640px) rotateZ(var(--smg-z, 0deg)) rotateX(var(--smg-x, 0deg)) rotateY(var(--smg-y, 0deg)) scale(1.02);
    filter: brightness(1.08);
  }

  /* The crate art intentionally spills well outside its original table hotspot.
     Let the rendered crate itself receive the click and bubble it to product 0. */
  #cofp-smuggler-preview .smg-h1 {
    z-index: 6;
  }
  #cofp-smuggler-preview .smg-h1 .smg-object-crate {
    pointer-events: auto;
    cursor: pointer;
  }

  #cofp-smuggler-preview .smg-object-crate { --smg-anchor-x:82%; --smg-anchor-y:132%; --smg-object-width:142%; --smg-object-height:178%; --smg-z:-9deg; --smg-x:34deg; --smg-y:-9deg; }
  #cofp-smuggler-preview .smg-object-hot-pack { --smg-anchor-x:74%; --smg-anchor-y:119%; --smg-object-width:98%; --smg-object-height:133%; --smg-z:7deg; --smg-x:49deg; --smg-y:-8deg; }
  #cofp-smuggler-preview .smg-object-repair { --smg-anchor-x:73%; --smg-anchor-y:116%; --smg-object-width:132%; --smg-object-height:174%; --smg-z:7deg; --smg-x:44deg; --smg-y:-11deg; }
  #cofp-smuggler-preview .smg-object-ring { --smg-anchor-x:49%; --smg-anchor-y:101%; --smg-object-width:96%; --smg-object-height:131%; --smg-z:9deg; --smg-x:46deg; --smg-y:-13deg; }
}
