.music-section{padding:55px 5% 65px}.music-section h2{font-size:clamp(38px,5vw,68px)}.deck{position:relative;width:min(1000px,100%);margin:auto}.deck>img{width:100%;display:block}.deck-button{position:absolute;top:71%;height:10%;width:6%;background:transparent;border:0;border-radius:5px;cursor:pointer}.deck-button:hover,.deck-button.is-active{background:#fbf2cb25;box-shadow:0 0 12px #f36f2580}.previous{left:8.4%}.play{left:15.3%}.stop{left:22.1%}.next{left:29%}.pause{left:35.9%}.deck-button:focus-visible{outline:3px solid var(--cream)}.meter{position:absolute;width:12.5%;height:7%;top:18.5%;overflow:hidden;border-radius:50% 50% 0 0;background:linear-gradient(0deg,#17110a,#613511)}.meter-left{left:60.2%}.meter-right{left:76.9%}.meter:before{content:'−20    −10    0    +3';position:absolute;top:5%;left:5%;right:5%;color:#ff9a31;font-size:clamp(5px,1vw,11px);border-top:2px solid #d87922;border-radius:50%;padding-top:3px}.meter span{position:absolute;bottom:0;left:50%;width:2px;height:90%;background:#ffd18a;transform-origin:bottom;transform:rotate(-48deg);box-shadow:0 0 3px #ffa028}.music-panel{width:min(700px,100%);margin:15px auto 0;text-align:left;padding:25px;background:#163e2d15;border:1px solid #fbf2cb55;border-radius:20px}.music-meta{display:flex;justify-content:space-between;font-size:12px}.music-panel h3{font-size:32px;margin:18px 0}.music-panel input[type=range]{accent-color:var(--green);width:100%}.music-volume{display:flex;align-items:center;gap:15px;margin:15px 0;font-size:12px}.music-volume input{max-width:150px}.music-track{display:flex;width:100%;justify-content:space-between;gap:15px;color:var(--cream);background:#fbf2cb20;border:1px solid transparent;border-radius:20px;padding:13px 16px;margin-top:8px;text-align:left;cursor:pointer}.music-track[aria-current=true]{border-color:var(--cream);background:#163e2d30}.load-music{display:inline-block;font-size:11px;font-weight:bold;border:1px solid var(--cream);padding:12px 16px;border-radius:25px;margin-top:20px;cursor:pointer}.load-music input{display:block;max-width:100%;margin-top:10px;font-size:11px}.music-panel #music-status{font-size:12px;line-height:1.6;margin-bottom:0}@media(max-width:600px){.music-panel{padding:20px}.music-panel h3{font-size:26px}.deck-button{min-height:0}.meter:before{font-size:5px}}
#soundcloud-player{border:0;margin:20px 0 12px;border-radius:10px}.sc-playing .meter span{animation:sc-vu .55s ease-in-out infinite alternate}.sc-playing .meter-right span{animation-delay:-.25s}@keyframes sc-vu{from{transform:rotate(-32deg)}to{transform:rotate(22deg)}}@media(prefers-reduced-motion:reduce){.sc-playing .meter span{animation:none;transform:rotate(-10deg)}}
/* Original pressed-button artwork replaces the temporary glow. */
.deck-button:hover,.deck-button.is-active{background:transparent;box-shadow:none}
.deck-button:active{background:#0000000c}
.volume-dial{position:absolute;left:84.3%;top:51.3%;width:8.2%;aspect-ratio:1;z-index:3;border-radius:50%;cursor:ns-resize;touch-action:none;user-select:none;background:#24221e}
.volume-art{position:absolute;inset:0;border-radius:50%;overflow:hidden;pointer-events:none;transform-origin:center}
.volume-art img{position:absolute;width:1220%;max-width:none;height:auto;left:-1028%;top:-470%;pointer-events:none}
.volume-dial:focus-visible{outline:3px solid var(--cream);outline-offset:4px}
/* Center the corrected circular knob artwork on its rotation axis. */
.volume-dial{left:84.74%;top:51.29%;width:7.6%;background:transparent}
.volume-art img{width:1316.36%;left:-1115.91%;top:-506.36%}
/* Three-column listening section: introduction, deck, playlist. */
.music-section{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(0,1.6fr) minmax(240px,1fr);align-items:center;gap:35px;padding:65px 5%;text-align:left}
.listen-intro h2{font-size:clamp(35px,3.4vw,62px);line-height:1;margin:15px 0 20px}
.listen-intro>.label{font-size:11px;letter-spacing:.17em}
.listen-intro p{font-size:15px;line-height:1.65;max-width:290px;margin:0}
.music-section .deck{width:100%;margin:0;filter:drop-shadow(0 18px 13px rgba(54,25,9,.42))}
/* Hide the stray top-edge line baked into the deck state images. */
.music-section .deck>img{clip-path:inset(1% 0 0 0)}
.music-section .music-panel{width:100%;margin:0;padding:22px;border-radius:12px}
.music-panel h3{font-size:28px}
.music-meta{font-size:11px;gap:10px}
.music-section audio{display:none}
@media(min-width:1700px){.music-section{gap:55px;padding-top:85px;padding-bottom:85px}.listen-intro p{font-size:18px;max-width:350px}}
@media(max-width:1100px){.music-section{grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr);gap:25px}.listen-intro{grid-column:1/-1}.listen-intro h2{margin:12px 0}.listen-intro p{max-width:none}}
@media(max-width:700px){.music-section{grid-template-columns:1fr;padding:45px 6%;gap:25px}.listen-intro{grid-column:1}.listen-intro h2{font-size:42px}.music-section .music-panel{padding:20px}.music-section .deck{filter:drop-shadow(0 12px 9px rgba(54,25,9,.38))}}
/* Replace the whole meter interior so the printed and live scales do not overlap. */
.meter{top:16.1%;width:13.9%;height:8.8%;border-radius:3px;background:radial-gradient(ellipse at 50% 110%,#e78622 0,#71380f 50%,#24170d 90%);box-shadow:inset 0 0 8px #000b;overflow:hidden}
.meter-left{left:58.7%}.meter-right{left:75.1%}
.meter:before{content:'−20   −10   −7   −3   0   +3';top:18%;left:6%;right:6%;font-family:Arial,sans-serif;font-size:clamp(4px,.62vw,11px);font-weight:700;letter-spacing:0;text-align:center;color:#ff962e;border-top:0;border-bottom:2px solid #f36f25;border-radius:0 0 50% 50%;padding:0 0 7%;white-space:nowrap}
.meter:after{content:'VU';position:absolute;left:0;right:0;top:58%;text-align:center;color:#ffa33e;font-size:clamp(6px,.9vw,15px);font-weight:800}
.meter span{height:68%;bottom:1%;z-index:2;width:2px;background:#ffd38b;box-shadow:0 0 2px #ffb446}
@media(max-width:700px){.meter:before{font-size:4px}.meter:after{font-size:6px}.meter span{width:1px}}
/* Supplied VU artwork at its original position, with live needles above it. */
.vu-face-art{position:absolute;left:58.01%;top:15.56%;width:32.25%;height:10.13%;overflow:hidden;pointer-events:none}
.vu-face-art img{position:absolute;width:310.06%;max-width:none;height:auto;left:-179.87%;top:-153.64%}
.meter{background:transparent;box-shadow:none;border-radius:0;top:16.1%;height:8.8%;pointer-events:none}
.meter:before,.meter:after{display:none}
.meter span{height:68%;bottom:1%;background:#ffd38b;z-index:2}
