/* Provisional presentation only. Playback JS knows nothing about the mark or pulse.
 * To return to waveform + attribution, remove waveform suppression below, make
 * the mark static, and reposition it beside metadata. Keep the Spotify link.
 */
[data-spotify-active][hidden], [data-spotify-close][hidden] { display: none; }
/* Click feedback precedes controller readiness. On removal, the existing Audio
 * image rules ease back to active/hover (.7s) or rest (1s), including cancellation.
 */
.card--audio[data-spotify-uri].is-spotify-pending .card__media-button .card__media img { filter: brightness(.64); transition: filter .7s cubic-bezier(.45, 0, .3, 1); }
[data-spotify-uri].is-playing .card__audio-waveform { display: none; }
[data-spotify-uri].is-playing .card__spotify-metadata { opacity: .72; transform: none; }
.card__spotify-metadata { white-space: pre-line; text-align: left; max-width: calc(100% - 2rem); pointer-events: none; }
.card__spotify-mark { position: absolute; top: 1rem; right: 1rem; z-index: 2; display: block; width: 2.1rem; height: 2.1rem; opacity: .68; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .55)); }
.card--audio-has-context .card__spotify-mark { right: auto; left: 1rem; }
.card__spotify-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.card__spotify-mark:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.is-playing .card__spotify-mark { transform-origin: center; animation: abp-spotify-opacity 2.5875s ease-in-out infinite alternate; }
@keyframes abp-spotify-opacity { from { opacity: .5; transform: scale(1); } to { opacity: .85; transform: scale(.98); } }
/* Keep the transparent host in the viewport: clipping it completely prevents
 * Spotify's lazy-loaded iframe from loading and emitting ready. The iframe
 * itself remains untouched; inert/aria-hidden keep concealed controls inert.
 */
.card__spotify-player { position: absolute; top: 0; left: 0; width: 100%; height: 152px; opacity: 0; pointer-events: none; }
.card__spotify-player.is-visible { z-index: 4; opacity: 1; pointer-events: auto; }
.card--audio.has-spotify-controls { overflow: visible; z-index: 4; }
.card__spotify-close { position: absolute; top: 152px; right: 0; z-index: 5; border: 0; padding: .4rem .6rem; color: #fff; background: #191414; cursor: pointer; }
.card__spotify-close:focus-visible { outline: 2px solid #fff; }
/* Deactivation must restore the original surface immediately, without ghost branding. */
[data-spotify-uri]:not(.is-playing) .card__audio-duration,
[data-spotify-uri]:not(.is-playing) .card__audio-speaker,
[data-spotify-uri]:not(.is-playing) .card__audio-context { transition: none; }
@media (prefers-reduced-motion: reduce) {
	.is-playing .card__spotify-mark { animation: none; opacity: .68; transform: none; }
}
