@keyframes iago20-page {
  from {opacity:.45;transform:translateY(9px)}
  to {opacity:1;transform:none}
}
@keyframes iago20-dialog {
  from {opacity:.65;transform:translateY(11px) scale(.99)}
  to {opacity:1;transform:none}
}
@keyframes iago20-body {
  from {opacity:.3;transform:translateY(12px)}
  to {opacity:1;transform:none}
}
@keyframes iago20-backdrop {
  from {opacity:0}
  to {opacity:1}
}

.page:not([hidden]) {
  animation:iago20-page .35s ease-out both;
}
#productDialog[open] {
  animation:iago20-dialog .3s ease-out both;
}
#productDialog[open]::backdrop {
  animation:iago20-backdrop .28s ease both;
}
#productDialog .product-grid {
  animation:iago20-body .36s ease-out both;
}
#productDialog .v19-more {
  animation:iago20-body .42s .07s ease-out both;
}

.catalog-card {
  transition:
    transform .28s ease,
    border-color .25s,
    box-shadow .3s;
}
.catalog-card .card-media {
  position:relative;
  isolation:isolate;
}
.catalog-card .card-media::after {
  content:"";
  position:absolute;
  inset:0;
  border-radius:12px;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(
    130deg,
    rgba(255,215,160,.11),
    transparent 35%,
    rgba(248,97,198,.09) 90%
  );
  transition:opacity .26s;
}

@media(hover:hover) and (pointer:fine) {
  .catalog-card:hover {
    transform:translateY(-4px);
    border-color:rgba(255,185,103,.48);
    box-shadow:
      0 18px 34px rgba(8,0,14,.48),
      0 0 18px rgba(231,107,200,.14);
  }
  .catalog-card:hover .card-media::after {
    opacity:1;
  }
}

.catalog-card:focus-within {
  border-color:rgba(255,197,117,.8);
  box-shadow:0 0 0 2px rgba(255,188,97,.35);
}

#productDialog .product-cover .cover-art {
  box-shadow:
    0 18px 44px rgba(0,0,0,.43),
    0 0 28px color-mix(
      in srgb,
      var(--v20-tone,#f5a544) 20%,
      transparent
    );
}

#productDialog .v19-related-card {
  transition:
    transform .23s ease,
    border-color .24s ease,
    box-shadow .25s ease;
}

@media(hover:hover) and (pointer:fine) {
  #productDialog .v19-related-card:hover {
    transform:translateY(-3px);
    border-color:var(--v20-tone,#ffbd6a);
    box-shadow:0 14px 24px rgba(9,1,15,.35);
  }
}

@media(prefers-reduced-motion:reduce) {
  .page:not([hidden]),
  #productDialog[open],
  #productDialog[open]::backdrop,
  #productDialog .product-grid,
  #productDialog .v19-more {
    animation:none!important;
  }
  .catalog-card,
  #productDialog .v19-related-card {
    transition:none!important;
  }
  .catalog-card:hover,
  #productDialog .v19-related-card:hover {
    transform:none!important;
  }
}