.music-widget{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:60;color:#fff}
.music-widget[hidden],.music-panel[hidden]{display:none}
.is-transitioning .music-widget{visibility:hidden;pointer-events:none}
.music-panel{position:relative;width:min(448.5px,calc(100vw - 32px - env(safe-area-inset-right)),calc((100dvh - 32px - env(safe-area-inset-bottom)) * 650 / 778));aspect-ratio:650/778;background:#000;overflow:hidden;box-shadow:0 6px #0005;container-type:inline-size;--music-u:calc(100cqw / 650)}
.music-stage{position:absolute;inset:0 0 auto;height:84.70437%;background:var(--red)}
.music-edge{position:absolute;left:0;top:75.32133%;width:100%;height:15.03856%;pointer-events:none}
.music-cover{position:absolute;display:block;aspect-ratio:1;background:#000;transition:filter .18s,box-shadow .18s}
.music-cover img{display:block;width:100%;height:auto;aspect-ratio:1;pointer-events:none}
.music-cover--previous,.music-cover--next{top:13.75321%;width:61.53846%;opacity:.5;z-index:1}
.music-cover--previous{left:4.30769%}
.music-cover--next{left:33.38462%}
.music-cover--current{top:8.86889%;left:13.38462%;width:73.23077%;z-index:2}
.music-cover:hover{filter:brightness(1.08)}
.music-cover--current[aria-pressed=true]{box-shadow:0 0 0 2px #fff5}
.music-mute{position:absolute;top:6.04113%;left:93.53846%;display:grid;place-items:center;width:44px;height:44px;transform:translate(-50%,-50%);z-index:3;transition:opacity .18s}
.music-mute img{width:calc(56 * var(--music-u));height:auto;pointer-events:none}
.music-mute[aria-pressed=false] .music-sound-mute,.music-mute[aria-pressed=true] .music-sound-on{display:none}
.music-mute:hover{opacity:.75}
.music-volume{position:absolute;left:4.30769%;bottom:2.9563%;width:22.15385%;display:flex;flex-direction:column;align-items:center;z-index:4;color:#fff}
.music-volume output{font-size:12px;line-height:1.2;font-weight:700}
.music-volume input{--volume:40%;appearance:none;-webkit-appearance:none;display:block;width:100%;height:44px;margin:0;padding:0;background:transparent;cursor:pointer;touch-action:pan-y}
.music-volume input::-webkit-slider-runnable-track{height:4px;background:linear-gradient(to right,var(--red) var(--volume),#534f4f var(--volume))}
.music-volume input::-moz-range-track{height:4px;background:#534f4f}
.music-volume input::-moz-range-progress{height:4px;background:var(--red)}
.music-volume input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:16px;margin-top:-6px;background:#fff;border:0;border-radius:0;box-shadow:inset 0 -3px #bfb9b9}
.music-volume input::-moz-range-thumb{width:12px;height:16px;background:#fff;border:0;border-radius:0;box-shadow:inset 0 -3px #bfb9b9}
.music-volume input:focus-visible{outline:2px solid #fff;outline-offset:2px}
.music-playback{position:absolute;bottom:4.49871%;left:30.61538%;width:38.61538%;display:flex;justify-content:space-between;align-items:center}
.music-arrow{display:grid;place-items:center;width:44px;height:44px;font-size:clamp(28px,4.4vw,44px);line-height:1;color:#fff;transition:color .18s,transform .12s}
.music-arrow:hover{color:var(--red)}
.music-arrow:active{transform:scale(.94)}
.music-toggle{display:grid;place-items:center;width:64px;height:64px;background:transparent;box-shadow:none;transition:filter .18s,transform .12s}
.music-toggle img{width:44px;height:auto;pointer-events:none}
.music-widget:not(.is-open) .music-toggle-open,.music-widget.is-open .music-toggle-closed{display:none}
.music-toggle:hover{filter:drop-shadow(0 0 4px var(--red))}
.music-toggle:active{transform:translateY(2px)}
.music-widget.is-open .music-toggle{position:absolute;right:5.07692%;bottom:2.9563%;width:10.76923%;height:10.02571%;min-width:44px;min-height:44px;background:none;box-shadow:none;z-index:4}
.music-widget.is-open .music-toggle img{width:100%;height:auto}
.music-widget button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.music-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(hover:hover) and (pointer:fine){.music-widget button,.music-widget button *,.music-volume input{cursor:url('/assets/cursor-pixel-hand.svg') 8 2,pointer}}
@media(max-width:599px){.music-widget{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}.music-panel{width:min(448.5px,calc(100vw - 24px - env(safe-area-inset-right)),calc((100dvh - 24px - env(safe-area-inset-bottom)) * 650 / 778))}.music-toggle{width:56px;height:56px}.music-toggle img{width:38px}}
@media(prefers-reduced-motion:reduce){.music-widget button{transition:none}}
