/* Audio cards: artwork and generated waveform covers fill the whole card. */
.gallery-audio-card.gallery-audio-card{position:relative;isolation:isolate}
.gallery-audio-card.gallery-audio-card>img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;border-radius:0;z-index:-2}
.gallery-audio-card.gallery-audio-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,transparent 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.8) 75%,rgba(0,0,0,.96) 100%)}
.gallery-audio-card.gallery-audio-card>span{grid-row:2}
.gallery-audio-card.gallery-audio-card>strong{grid-row:3;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.inspiration-card .image-wrap.market-audio-card.market-audio-card>img{inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;padding:0!important;border-radius:inherit;background:none}
.inspiration-card .image-wrap.market-audio-card .card-shade{opacity:1;background:linear-gradient(to bottom,transparent 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.8) 75%,rgba(0,0,0,.96) 100%)}
.inspiration-card .image-wrap.market-audio-card::before{z-index:1;padding:4px 6px;border-radius:5px;background:rgba(0,0,0,.53)}
/* Popup covers span the top horizontally, separate from the player controls. */
.gallery-audio-player.gallery-audio-player,
.market-audio-player.market-audio-player{--audio-cover-inset:28px;padding:var(--audio-cover-inset)!important;justify-content:flex-start;overflow:hidden}
.gallery-audio-player.gallery-audio-player>.gallery-audio-cover,
.market-audio-player.market-audio-player>.market-audio-art{position:static!important;display:block;box-sizing:border-box;flex:none;width:calc(100% + var(--audio-cover-inset) * 2)!important;height:auto!important;max-width:none!important;max-height:none!important;aspect-ratio:16/9;object-fit:cover!important;border-radius:0;padding:0;background:none;margin:calc(-1 * var(--audio-cover-inset)) calc(-1 * var(--audio-cover-inset)) 4px!important}
@media(max-width:767px){.gallery-audio-player.gallery-audio-player,.market-audio-player.market-audio-player{--audio-cover-inset:20px}}

/* Tall audio popups must start within the phone viewport, not above it. */
@media(max-width:767px){
  .panel-overlay.centered:has(.market-audio-player){align-items:flex-start!important;overflow-y:auto;overscroll-behavior:contain}
  .market-audio-controls label,.gallery-audio-controls label{min-height:32px;display:flex;align-items:center}
  .market-audio-controls input[type="range"],.gallery-audio-controls input[type="range"]{min-height:32px}
}

@media(max-width:767px){
 .explore-community-dialog:has(.gallery-audio-player){box-sizing:border-box;width:calc(100% - 16px)!important;max-width:calc(100% - 16px)!important;padding:44px 12px 12px!important;overflow-x:hidden}
 .explore-community-dialog .community-detail-media:has(.gallery-audio-player),#studio-dialog.file-detail-dialog .detail-media:has(.gallery-audio-player){padding:0!important;display:block;min-width:0;width:100%}
 .explore-community-dialog:has(.gallery-audio-player) .community-detail-grid{grid-template-columns:minmax(0,1fr);min-width:0}
 .explore-community-dialog:has(.gallery-audio-player) .community-detail-grid>*{min-width:0;max-width:100%;box-sizing:border-box}
 .gallery-audio-controls label{max-width:100%;gap:8px}
 .gallery-audio-controls input[type="range"]{min-width:0;max-width:100%}
}