/* Real demo-audio layer for the UTM V2 creative player. */
#utmAudio{display:none}

.waveform-shell.is-loading .waveform-bar{
  opacity:.28;
  animation:utmWaveLoading 1.1s ease-in-out infinite alternate;
}
.waveform-shell.is-ready .waveform-bar{opacity:1}
.waveform-shell.has-error{border-color:rgba(255,139,123,.35)}

.waveform-played{
  width:100%!important;
  clip-path:inset(0 calc(100% - var(--played,0%)) 0 0);
  transition:clip-path .05s linear;
}
.waveform-played-bars{width:100%!important}

.waveform-shell.is-ready::after{
  content:"";
  position:absolute;
  left:var(--playhead,0%);
  top:5px;
  bottom:5px;
  width:1px;
  background:rgba(255,255,255,.82);
  box-shadow:0 0 8px rgba(255,255,255,.2);
  z-index:6;
  pointer-events:none;
}

.player-track.is-demo strong::after{
  content:"DEMO";
  display:inline-flex;
  margin-left:7px;
  padding:2px 5px;
  border-radius:999px;
  border:1px solid rgba(192,154,85,.3);
  color:var(--brand-gold-bright);
  font-size:6px;
  letter-spacing:.11em;
  vertical-align:2px;
}

@keyframes utmWaveLoading{
  from{opacity:.16}
  to{opacity:.44}
}

@media(prefers-reduced-motion:reduce){
  .waveform-shell.is-loading .waveform-bar{animation:none}
  .waveform-played{transition:none}
}
