/* ============================================================
   Maze of Tales — ambient sound toggle (shared across pages)
   Fixed gold equaliser button, bottom-right. Uses brand tokens.
   ============================================================ */
/* Ambient sound toggle */
.bgm-toggle {
  position: fixed; right: 22px; bottom: 22px; z-index: 120;
  width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid var(--gold); background: rgba(0,0,0,0.55);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background 0.4s ease, transform 0.4s ease;
}
.bgm-toggle:hover { background: var(--gold); transform: translateY(-2px); }
.bgm-toggle svg { width: 18px; height: 18px; }
.bgm-toggle .bar { fill: var(--gold); transform-box: fill-box; transform-origin: bottom; transition: fill 0.3s ease; }
.bgm-toggle:hover .bar { fill: var(--bg); }
.bgm-toggle.playing .bar { animation: bgmEq 0.9s ease-in-out infinite; }
.bgm-toggle.playing .bar:nth-child(2) { animation-delay: 0.15s; }
.bgm-toggle.playing .bar:nth-child(3) { animation-delay: 0.30s; }
.bgm-toggle.playing .bar:nth-child(4) { animation-delay: 0.45s; }
@keyframes bgmEq { 0%, 100% { transform: scaleY(0.35); } 50% { transform: scaleY(1); } }
@media (max-width: 720px) { .bgm-toggle { right: 16px; bottom: 16px; width: 42px; height: 42px; } }