.music-toggle {
  width: 36px;
  min-width: 36px;
  height: 36px;
  padding: 0 !important;
  display: grid;
  place-items: center;
  border-color: #dfd1be !important;
  background: #f7eddd !important;
  color: #8b6b55 !important;
  font: 800 20px Fredoka, sans-serif !important;
  transition: transform .2s, background .2s, color .2s;
}

.music-toggle.music-on {
  background: #e3efe1 !important;
  border-color: #b7cdb8 !important;
  color: #52745b !important;
}

.music-toggle.music-on span {
  animation: musicNoteSway 1.8s ease-in-out infinite;
}

.music-toggle:active {
  transform: scale(.92);
}

@keyframes musicNoteSway {
  0%, 100% { transform: rotate(-7deg) translateY(0); }
  50% { transform: rotate(7deg) translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
  .music-toggle.music-on span { animation: none; }
}