/* ETHERION — 소리 단추 둘 (js/bgm.js): 모든 화면 오른쪽 아래. ♪ = 배경음, 스피커 = 효과음, 따로 끄고 켠다.
   꺼진 단추는 흐리고 빗금이 그어진다. 소리가 막혀 있으면 배경음 단추에 "음악 켜기"가 붙어 은은히 빛난다 */
.snd-ctl {
  position: fixed; right: 14px; bottom: 14px; z-index: 90;
  display: flex; gap: 4px; padding: 3px; border-radius: 999px;
  background: rgba(13, 16, 25, .62);
  border: 1px solid var(--line-gold, rgba(217, 180, 106, .38));
  box-shadow: 0 2px 10px rgba(0, 0, 0, .35);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  opacity: .8; transition: opacity .2s;
}
.snd-ctl:hover, .snd-ctl:focus-within { opacity: 1; }
.snd-btn {
  position: relative; display: inline-flex; align-items: center; gap: 6px;
  height: 32px; min-width: 32px; padding: 0 6px; border-radius: 999px; border: 0;
  font: inherit; font-size: 13px; letter-spacing: .02em;
  color: var(--gold-hi, #f6e2a8); background: transparent; cursor: pointer;
  transition: background .2s, color .2s;
}
.snd-btn svg { width: 19px; height: 19px; flex: none; }
.snd-btn .snd-slash { position: absolute; left: 6px; top: 50%; margin-top: -9.5px; color: #e07a6a; }
.snd-btn:hover, .snd-btn:focus-visible { background: rgba(217, 180, 106, .14); outline: none; }
.snd-btn.off { color: var(--muted, #8a8577); }
.snd-btn.blocked { padding-right: 11px; background: rgba(217, 180, 106, .12); animation: sndGlow 2.4s ease-in-out infinite; }
.snd-label { white-space: nowrap; }
@keyframes sndGlow { 50% { box-shadow: 0 0 16px rgba(217, 180, 106, .4); } }
/* 대전 화면: 생명 판과 겹치지 않게 더 작게 구석으로 */
.snd-ctl.in-battle { right: 3px; bottom: 3px; padding: 2px; gap: 2px; opacity: .6; }
.snd-ctl.in-battle .snd-btn { height: 26px; min-width: 26px; padding: 0 4px; }
.snd-ctl.in-battle .snd-btn svg { width: 16px; height: 16px; }
.snd-ctl.in-battle .snd-btn .snd-slash { left: 4px; margin-top: -8px; }
@media (max-width: 760px) { .snd-ctl { right: 8px; bottom: 8px; } .snd-btn { height: 28px; min-width: 28px; } }
@media (prefers-reduced-motion: reduce) { .snd-btn.blocked { animation: none; } }
/* v3.7.2 전장은 가운데 설정칸(툴바)의 소리 단추를 쓴다 — 오른쪽 아래 단추는 숨긴다 */
body:has(.tb-snd) .snd-ctl { display: none; }
/* v3.9.7 타이틀은 시작 단추 바로 아래의 소리 단추(#t-snd)를 쓴다 */
body:has(.screen-title) .snd-ctl { display: none; }