.audio-controls { position: fixed; z-index: 200; bottom: 87px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid #c7b69d30; border-radius: 20px; background: #fffdf4a8; }
.audio-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 30px; min-width: 74px; padding: 4px 10px; border: 0; border-radius: 16px; background: transparent; color: #a09888; font: 11px/1.3 -apple-system,'PingFang SC',sans-serif; cursor: pointer; }
.audio-toggle[aria-pressed='true'] { color: #8d654c; background: #f1e5d26e; }
.audio-toggle:hover { background: #f1e5d2; }
.audio-toggle:focus-visible { outline: 2px solid #8d654c; outline-offset: 2px; }
.audio-toggle svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; }
.audio-toggle .music-note { font: 16px/1 Georgia,serif; }
.audio-toggle.is-playing .music-note { animation: music-sway 2.6s ease-in-out infinite; }
.audio-status { position: fixed; bottom: 127px; left: 50%; transform: translateX(-50%); max-width: calc(100vw - 28px); margin: 0; border-radius: 10px; padding: 7px 11px; background: #fffaf0; color: #8d654c; font: 11px/1.5 -apple-system,'PingFang SC',sans-serif; z-index: 230; }
.audio-status:empty { display: none; }
@keyframes music-sway { 0%,100% { transform: rotate(-9deg); } 50% { transform: rotate(9deg); } }
@media (max-width: 780px) { .audio-controls { bottom: 59px; } .audio-status { bottom: 153px; } }
@media (prefers-reduced-motion: reduce) { .audio-toggle.is-playing .music-note { animation: none; } }