.with-music{flex-wrap:wrap}.with-music>.back{margin-left:auto}.site-music{display:flex;align-items:center;gap:9px;margin-left:0;border:1px solid #aaa;border-radius:4px;background:#f5f5f3;color:#161616;position:relative;font:13px/1.3 system-ui,-apple-system,sans-serif;flex:none;box-shadow:inset 0 1px #fff;z-index:3}.site-music button,.site-music summary{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}.music-play{display:flex;align-items:center;gap:10px;padding:0 10px;border:0;background:transparent;min-height:44px}.music-symbol{width:15px;font-size:13px}.music-dots{display:flex;gap:3px}.music-dots i{display:block;width:5px;height:5px;border-radius:50%;background:#b72d2a}.music-dots i:nth-child(2){background:#258647}.music-dots i:nth-child(3){background:#285aa6}.music-dots i:nth-child(4){background:#b98b00}.music-options summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;font-size:22px;list-style:none;border-left:1px solid #d0d0ce}.music-options summary::-webkit-details-marker{display:none}.music-options summary::marker{content:''}.music-panel{position:absolute;right:-1px;top:calc(100% + 7px);width:260px;max-width:calc(100vw - 32px);padding:16px;background:#f5f5f3;border:1px solid #888;border-radius:4px;box-shadow:0 6px 18px #0002}.music-track{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.music-time{font-variant-numeric:tabular-nums;color:#444}.music-panel label{display:block;font-size:12px;margin-top:10px}.music-panel input{display:block;width:100%;min-height:32px;margin:0;accent-color:#161616}.music-panel p{font-size:12px;line-height:1.5;margin:10px 0 0;color:#444}.site-music :is(button,summary,input):focus-visible{outline:3px solid #285aa6;outline-offset:3px}.site-music button:hover,.music-options summary:hover{background:#e8e8e5}.site-music.is-playing .music-dots i{animation:music-step 1.2s steps(2,end) infinite alternate}.site-music.is-playing .music-dots i:nth-child(2){animation-delay:-.3s}.site-music.is-playing .music-dots i:nth-child(3){animation-delay:-.6s}.site-music.is-playing .music-dots i:nth-child(4){animation-delay:-.9s}@keyframes music-step{from{transform:translateY(-2px)}to{transform:translateY(2px)}}@media(prefers-reduced-motion:reduce){.site-music.is-playing .music-dots i{animation:none}}@media(max-width:600px){.with-music{gap:12px}.with-music .site-music{margin-left:auto}.music-panel{width:248px}}
.music-scene{position:absolute;inset:0 0 auto;aspect-ratio:3/2;pointer-events:none;container-type:inline-size}.music-piano{position:absolute;left:49%;top:91%;width:max(44px,8.2cqw);height:max(44px,8.2cqw);padding:0;border:0;background:none;cursor:pointer;pointer-events:auto;touch-action:manipulation;transform:translate(-50%,-50%);display:grid;place-items:center}.music-piano img{display:block;width:8.2cqw;height:auto;max-width:none;pointer-events:none}.music-piano:focus-visible{outline:3px solid #285aa6;outline-offset:3px}.music-piano:hover{filter:brightness(.9)}.music-speaker{position:absolute;left:89%;top:27%;width:8%;opacity:0}.music-scene.is-playing .music-speaker{opacity:1}.music-scene.is-playing .music-speaker path[class]{animation:music-sound 1.8s ease-out infinite}.music-scene.is-playing .sound-two{animation-delay:.2s}.music-scene.is-playing .sound-three{animation-delay:.4s}@keyframes music-sound{0%,100%{opacity:.15}40%{opacity:1}}@media(prefers-reduced-motion:reduce){.music-scene.is-playing .music-speaker path[class]{animation:none}}