/* ==========================================================================
   Music — o que o botão da trilha tem de próprio.

   Posição e pilula vêm de controles.css; aqui fica só o sinal de estado.
   ========================================================================== */

/* O ponto à esquerda do rótulo é o único sinal: vazado quando a música
   está parada, preenchido quando toca. */
.music__botao::before {
  content: "";
  width: 6px;
  height: 6px;
  border: 1px solid currentColor;
  border-radius: 50%;
  transition: background-color var(--transition-fast);
}

.music__botao[aria-pressed="true"]::before {
  background-color: currentColor;
}