.background-sound { position: fixed; right: max(18px, env(safe-area-inset-right)); bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 25; display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 16px; border: 1px solid #66503c; border-radius: 999px; background: #101211; color: #eee3d5; box-shadow: 0 4px 20px #0006; font: 600 12px/1.2 var(--body); cursor: pointer; touch-action: manipulation; }
.background-sound svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.background-sound[aria-pressed="true"] { color: #ff975e; border-color: #ff671c; }
.background-sound .sound-waves { display: none; }
.background-sound[aria-pressed="true"] .sound-waves { display: block; }
.background-sound[aria-pressed="true"] .sound-cross { display: none; }
.background-sound:hover { background: #22251f; }
.background-sound:focus-visible { outline: 2px solid #ff975e; outline-offset: 4px; }
body.menu-open .background-sound, body.modal-open .background-sound { visibility: hidden; }
@media (max-width: 600px) { .background-sound { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); padding: 10px 13px; } }