#am-musicControl{position:fixed;z-index:40;display:flex;align-items:center;gap:6px;box-sizing:border-box;height:var(--am-music-size,46px);border-radius:999px;background:var(--am-hud,#263e2ee8);backdrop-filter:blur(12px);color:#fff;padding:0;font:inherit}
#am-musicControl[hidden],#am-musicControl [hidden]{display:none!important}
#am-musicControl button{border:0;color:inherit;background:transparent;cursor:pointer;font:inherit;min-height:36px;padding:4px 8px;border-radius:999px}
#am-musicControl [data-speaker]{width:var(--am-music-size,46px);height:var(--am-music-size,46px);padding:11px;flex:none;display:grid;place-items:center}#am-musicControl svg{width:100%;height:100%}
#am-musicControl .am-musicOptions{display:flex;align-items:center;gap:4px;min-width:0;flex:1;padding-right:5px;font-size:12px;white-space:nowrap}
#am-musicControl label{display:flex;align-items:center;gap:4px;min-width:0;flex:1}#am-musicControl input{width:100%;min-width:35px;accent-color:#91b987}#am-musicControl [data-close]{font-size:24px;padding:0 7px;flex:none}
#am-musicControl button:focus-visible,#am-musicControl input:focus-visible{outline:2px solid #b7d6f6;outline-offset:1px}
@media(max-width:640px){#am-musicControl label span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}

/* 재생 실패는 게임 진입을 막지 않고 조작 위치에서 다시 시도할 수 있게 알린다. */
#am-musicControl [data-status]{position:absolute;right:0;top:calc(100% + 6px);box-sizing:border-box;width:max-content;max-width:min(280px,calc(100vw - 24px));padding:6px 10px;border-radius:12px;background:var(--am-hud);color:#fff;font-size:12px;line-height:1.4}
#am-musicControl [data-play],#am-musicControl [data-mute],#am-musicControl [data-close]{min-height:44px}
@media(max-width:640px){#am-musicControl.is-open{height:auto;min-height:44px}#am-musicControl .am-musicOptions{flex-wrap:wrap;padding:4px}#am-musicControl label{flex-basis:50px}#am-musicControl [data-mute]{font-size:11px;padding:4px}#am-musicControl [data-play]{padding:4px}#am-musicControl [data-close]{padding:0 5px}}

/* 스피커는 음소거, 옆 펼침 버튼은 음량창 열기/닫기만 담당한다. */
#am-musicControl{gap:0}
#am-musicControl [data-settings]{width:var(--am-music-size,46px);height:var(--am-music-size,46px);min-width:44px;min-height:44px;padding:13px;flex:none;display:grid;place-items:center}
#am-musicControl .am-musicOptions{flex-wrap:nowrap;gap:2px;padding:0 4px}
#am-musicControl label{flex:1;min-width:32px}
#am-musicControl input[type=range]{appearance:none;-webkit-appearance:none;box-sizing:border-box;height:44px;min-width:0;width:100%;padding:0;margin:0;border:0;box-shadow:none;outline:none;background:transparent;cursor:pointer}
#am-musicControl input[type=range]::-webkit-slider-runnable-track{height:6px;border:0;border-radius:999px;background:#91b987}
#am-musicControl input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:16px;height:16px;margin-top:-5px;border:0;border-radius:50%;background:#c8e0c0;box-shadow:none}
#am-musicControl input[type=range]::-moz-range-track{height:6px;border:0;border-radius:999px;background:#91b987}
#am-musicControl input[type=range]::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:#c8e0c0}
#am-musicControl input[type=range]:focus-visible{outline:2px solid #b7d6f6;outline-offset:1px}
#am-musicControl:not(.is-open)::before{display:none}
@media(max-width:700px),(max-width:900px) and (max-height:500px){#am-musicControl:not(.is-open) [data-speaker],#am-musicControl:not(.is-open) [data-settings]{background:radial-gradient(circle closest-side,var(--am-hud) 80%,transparent 83%)}}

/* 접힌 HUD에는 열기 버튼 하나만 두며 음소거는 펼친 패널에서 조작한다. */
#am-musicControl [data-open]{width:var(--am-music-size,46px);height:var(--am-music-size,46px);min-width:44px;min-height:44px;padding:11px;flex:none;display:grid;place-items:center}
#am-musicControl [data-speaker]{min-width:44px;min-height:44px}
#am-musicControl:not(.is-open){background:transparent;backdrop-filter:none}
#am-musicControl:not(.is-open) [data-open]{background:var(--am-hud,#263e2ee8)}