.music-player{position:fixed;z-index:25;top:110px;left:20px;display:flex;align-items:center;gap:11px;padding:10px 13px 10px 10px;min-width:166px;max-width:calc(100vw - 24px);border:1px solid #b4b7a4;background:linear-gradient(120deg,#f8f5e9f5,#e9ecddf2);box-shadow:3px 4px 0 #cad0bf66,0 8px 24px #293d2920;color:#364b3c;backdrop-filter:blur(10px)}
.music-player::before,.music-player::after{content:"";position:absolute;width:5px;height:5px;border:1px solid #8b9b81;pointer-events:none}.music-player::before{top:3px;left:3px;border-right:0;border-bottom:0}.music-player::after{bottom:3px;right:3px;border-left:0;border-top:0}
.music-toggle{flex:none;display:grid;place-items:center;width:35px;height:39px;padding:0;border:1px solid #9b3d3180;background:transparent;color:var(--red);transform:rotate(-3deg)}.music-toggle:hover{background:#9b3d3110}.music-toggle:focus-visible{outline-offset:3px}.music-play{font-size:13px;line-height:1}.music-pause{display:none;width:11px;height:14px;border-left:3px solid currentColor;border-right:3px solid currentColor}.music-player[data-state="playing"] .music-play{display:none}.music-player[data-state="playing"] .music-pause{display:block}
.music-copy{min-width:0;line-height:1.5}.music-title{display:block;font-family:var(--serif);font-size:19px;letter-spacing:5px}.music-state{display:block;font-size:9px;letter-spacing:1px;color:#77816b;white-space:nowrap}.music-note{font-family:var(--serif);writing-mode:vertical-rl;font-size:9px;letter-spacing:2px;padding-left:9px;border-left:1px solid #c5cbb8;color:#8e977f;line-height:1.3}
body:has(#main-nav.is-open) .music-player{visibility:hidden}.portrait-image img.portrait-vertical{object-fit:contain;background:#e2e6de}.portrait-caption h3{min-width:0;overflow-wrap:anywhere}
@media(max-width:760px){.music-player{top:94px;left:12px;min-width:148px;gap:8px;padding:7px 10px 7px 8px}.music-toggle{width:31px;height:35px}.music-title{font-size:17px;letter-spacing:4px}.music-note{font-size:8px;padding-left:7px}.music-state{font-size:8px}.portrait-caption:has(h3) {gap:8px}}
@media(max-width:380px){.portrait-caption h3{font-size:20px}.portrait-caption>span{font-size:9px}}