/**
 * Color bleed halo for Visualizer modal footer artwork (mobile layout).
 * Overrides vendor overflow:hidden on .wavyl-visualizer-artwork so blur can extend.
 */
@media (max-width: 1024px) {
  /* Vendor footer uses overflow-x: hidden; allow horizontal halo bleed */
  #wavyl-visualizer-modal .wavyl-visualizer-footer,
  #wavylvision-visualizer-modal .wavyl-visualizer-footer {
    overflow-x: visible;
  }

  #wavyl-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork,
  #wavylvision-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork {
    position: relative;
    isolation: isolate;
    overflow: visible;
  }

  #wavyl-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork .wavyl-visualizer-artwork__glow,
  #wavylvision-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork .wavyl-visualizer-artwork__glow {
    position: absolute;
    z-index: 0;
    left: 4%;
    right: 4%;
    top: 4%;
    bottom: 4%;
    border-radius: 14px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: blur(44px) saturate(1.12);
    opacity: 0.55;
    transform: scale(1.15);
    pointer-events: none;
    transition: opacity 0.35s ease;
  }

  #wavyl-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork > img,
  #wavylvision-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork > img {
    position: relative;
    z-index: 1;
  }

  #wavyl-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork.wavyl-visualizer-artwork--empty .wavyl-visualizer-artwork__glow,
  #wavylvision-visualizer-modal .wavyl-visualizer-footer .wavyl-visualizer-artwork.wavyl-visualizer-artwork--empty .wavyl-visualizer-artwork__glow {
    opacity: 0;
    visibility: hidden;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wavyl-visualizer-artwork__glow {
    display: none !important;
  }
}