/* A miniature turntable, drawn in CSS so it stays crisp at every size. */
.studio-player{position:fixed;left:max(20px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));width:144px;z-index:45;color:#563744;isolation:isolate;filter:drop-shadow(0 9px 16px #6238421a)}
.studio-player[hidden],.studio-volume[hidden]{display:none}
.turntable{position:relative;width:144px;height:108px;border:1px solid #fff9;border-radius:14px;background:linear-gradient(145deg,#f8e6dd,#e8bcb6 85%);box-shadow:inset 0 2px 1px #fff8,inset 0 -5px 1px #c38e8555,0 3px 0 #c59d94,0 5px 0 -1px #a8786d;transform:rotate(-3deg);transition:transform .3s ease}
.turntable::before,.turntable::after{content:"";position:absolute;width:19px;height:5px;background:#6a514b;border-radius:0 0 4px 4px;bottom:-8px;z-index:-1}
.turntable::before{left:14px}.turntable::after{right:14px}
.vinyl{position:absolute;left:9px;top:8px;width:90px;height:90px;border:3px solid #28232a;border-radius:50%;background:repeating-radial-gradient(circle at center,transparent 0 2px,#e8deee14 2.4px 2.8px,transparent 3.3px 4px),conic-gradient(from 25deg,#242028,#55505b 35deg,#27232c 75deg,#221f25 140deg,#554c54 205deg,#29242c 260deg,#242028);box-shadow:0 2px 3px #3c272858,inset 0 0 0 1px #7c737e;animation:vinyl-turn 5.5s linear infinite;animation-play-state:paused}
.vinyl-label{position:absolute;inset:15px;border-radius:50%;border:1px solid #efd5b9;background:#f3d9ba;display:grid;place-items:center;color:#b97878;box-shadow:inset 0 0 0 3px #eacbac}
.vinyl-label>span{position:absolute;font-size:11px;top:0;left:20px;line-height:1}.vinyl-label>i{width:4px;height:4px;background:#574a51;border-radius:50%}
.record-toggle{position:absolute;left:32px;top:31px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #fff5;border-radius:50%;background:#b77579;color:#fff9eb;box-shadow:inset 0 1px 1px #fffd,0 2px 4px #3c232335;cursor:pointer;z-index:3;transition:background .2s,box-shadow .2s}
.record-toggle:hover{background:#9f606a;box-shadow:0 0 0 5px #f4d8c652}.record-toggle:active{background:#885564}
.record-toggle svg{width:23px;height:23px;fill:currentColor}.record-toggle .record-pause{display:none}
.tonearm{position:absolute;right:7px;top:6px;width:34px;height:73px;transform-origin:58% 15%;transform:rotate(-18deg);transition:transform .7s ease;pointer-events:none;filter:drop-shadow(1px 2px 1px #71514844)}
.turntable-flower{position:absolute;right:13px;top:55px;color:#975c6a80;font-size:13px;line-height:1;pointer-events:none}
.turntable-light{position:absolute;left:105px;bottom:10px;width:4px;height:4px;border-radius:50%;background:#b98c83;transition:background .3s,box-shadow .3s}
.record-volume{position:absolute;right:2px;bottom:-1px;width:34px;height:34px;border:0;border-radius:50%;padding:10px;background:transparent;color:#655349;cursor:pointer}
.record-volume::before{content:"";position:absolute;inset:8px;border:1px solid #b0998a;border-radius:50%;background:linear-gradient(140deg,#faf0df,#c9bba5);box-shadow:0 1px 2px #7055433a;z-index:-1}
.record-volume svg{width:14px;height:14px;display:block}.record-volume:hover{color:#9e4864}
.record-caption{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;letter-spacing:.015em;line-height:1.4;margin:11px auto 0;width:max-content;max-width:160px;padding:5px 11px;border:1px solid #fff8;border-radius:99px;background:#fff8;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);white-space:nowrap}
.music-notes{font-size:13px;color:#aa6d84}
.studio-player.is-playing .vinyl{animation-play-state:running}.studio-player.is-playing .record-play{display:none}.studio-player.is-playing .record-pause{display:block}.studio-player.is-playing .tonearm{transform:rotate(7deg)}
.studio-player.is-playing .turntable-light{background:#778f64;box-shadow:0 0 5px #90ac70}
.studio-volume{position:absolute;left:0;bottom:calc(100% + 16px);width:184px;padding:14px 17px 12px;background:#fff6f2ed;border:1px solid #fff;border-radius:17px;box-shadow:0 9px 25px #5637441a;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.studio-volume label{font-size:12px;font-weight:500}.studio-volume>div{display:flex;align-items:center;gap:9px;height:36px}.studio-volume input{width:100%;min-width:0;accent-color:#a7667e;cursor:pointer;height:26px}.studio-volume>div>span{font-size:13px}
.record-toggle:focus-visible,.record-volume:focus-visible,.studio-volume input:focus-visible{outline:3px solid #75415c;outline-offset:4px}
.music-status{position:absolute;overflow:hidden;clip-path:inset(50%);white-space:nowrap;width:1px;height:1px}
.site-footer{padding-bottom:160px}
@keyframes vinyl-turn{to{transform:rotate(360deg)}}
@media(max-width:600px){
 .studio-player{left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));width:116px}
 .turntable{width:116px;height:88px;border-radius:12px}
 .vinyl{left:7px;top:7px;width:72px;height:72px;border-width:2px}
 .vinyl-label{inset:9px}.vinyl-label>span{left:19px}
 .record-toggle{left:21px;top:21px}
 .tonearm{right:4px;top:4px;width:29px;height:61px}
 .turntable-flower{right:11px;top:46px;font-size:10px}
 .turntable-light{left:82px;bottom:10px;width:3px;height:3px}
 .record-volume{right:-1px;bottom:-3px;width:32px;height:32px;padding:9px}
 .record-caption{font-size:10px;margin-top:10px;gap:4px;padding:4px 9px}
 .site-footer{padding-bottom:140px}
}
@media(prefers-reduced-motion:reduce){.studio-player .vinyl{animation:none}.tonearm,.turntable{transition:none}}
@media print{.studio-player{display:none}}