.audio-settings {position:fixed;z-index:131;top:max(24px,env(safe-area-inset-top));right:max(24px,env(safe-area-inset-right));font:18px/1.4 system-ui,sans-serif;color:#183b30}
.audio-panel .music-toggle {display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin-bottom:16px;padding:8px 14px;border:1px solid #92703c;border-radius:8px;background:#f6e7c7;color:#183b30;font:600 18px/1.3 system-ui,sans-serif;cursor:pointer;touch-action:manipulation}
.music-toggle svg {width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.music-toggle .music-slash {display:none}
.audio-panel .music-toggle[data-music-enabled="false"] {background:#efddb7;color:#60563e}
.music-toggle[data-music-enabled="false"] .music-slash {display:block}
.audio-panel .music-toggle:hover {background:#e7d1a0;color:#183b30}
.audio-panel .music-toggle:active {background:#dbe4bc}
.music-toggle:focus-visible {outline:3px solid #21634d;outline-offset:3px}
body:has(>.audio-settings).edge-to-edge-map .map-restart {position:fixed;top:max(86px,env(safe-area-inset-top));right:max(24px,env(safe-area-inset-right))}
.audio-settings>summary {display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px 14px;list-style:none;cursor:pointer;background:#f6e7c7;border:1px solid #92703c;border-radius:8px}
.audio-settings>summary::-webkit-details-marker {display:none}
.audio-settings svg {width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.audio-panel {position:absolute;right:0;top:calc(100% + 8px);width:min(320px,calc(100vw - 32px));padding:20px;background:#f6e7c7;border:1px solid #92703c;border-radius:10px;box-sizing:border-box;max-height:calc(100dvh - 170px);overflow:auto}
.audio-panel label {display:grid;gap:4px;margin-bottom:16px;font-size:18px;cursor:pointer}
.audio-panel .audio-mute {display:flex;align-items:center;gap:12px;min-height:44px}
.audio-panel input {accent-color:#234b3a;cursor:pointer}
.audio-panel input[type=range] {width:100%;min-height:44px;margin:0;touch-action:pan-y}
.audio-panel input[type=checkbox] {width:24px;height:24px;flex:none}
.audio-panel p {font-size:16px;line-height:1.4;margin:12px 0 0}
.audio-panel p:empty {display:none}
.audio-settings :is(summary,button,input):focus-visible {outline:3px solid #21634d;outline-offset:3px}
.title-settings>.audio-settings {position:relative;top:auto;right:auto;align-self:end;z-index:5}
.title-settings>.audio-settings>summary {min-height:64px}
body.autobattle-open>.audio-settings {top:max(14px,env(safe-area-inset-top));z-index:130}
body.autobattle-open>.audio-settings>summary>span {display:none}
@media(max-width:600px) {
  body:has(>.audio-settings).edge-to-edge-map .map-restart {top:82px;right:max(12px,env(safe-area-inset-right))}
  .audio-settings {right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top))}
  .audio-settings>summary {padding:8px}
  .audio-settings>summary>span {display:none}
  .title-settings>.audio-settings>summary>span {display:inline}
  .title-settings>.audio-settings {grid-column:1/-1;justify-self:end}
  .title-settings>.audio-settings>summary {min-height:48px;padding:8px 16px}
  .title-settings>.audio-settings .audio-panel {max-height:calc(100dvh - 310px)}
}