.sunnybe-listening { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr); gap:clamp(28px,5vw,76px); align-items:center; width:min(1220px,100%); margin:auto; padding:clamp(24px,4.7vw,64px); color:#fff7eb; border:1px solid #e4bd713b; border-radius:26px; background:linear-gradient(125deg,#15100dec,#251b14ed 58%,#100f0ff5); box-shadow:0 30px 100px #0008; backdrop-filter:blur(16px); scroll-margin-top:100px; }
.sunnybe-listening .home-kicker { margin:0 0 24px; color:#e8c17a; font-size:.72rem; letter-spacing:.15em; }
.listening-copy { min-width:0; }
.sunnybe-listening .releases { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; list-style:none; padding:0; margin:0; }
.sunnybe-listening .release { display:flex; align-items:center; gap:22px; text-decoration:none; max-width:400px; }
.sunnybe-listening .sleeve { width:clamp(78px,7.5vw,96px); flex:none; box-shadow:3px 9px 24px #0007; }
.sunnybe-listening .release-name { font:650 clamp(1rem,1.6vw,1.35rem)/1.2 system-ui,sans-serif; margin:0; }
.listening-deck { min-width:0; }
.sunnybe-listening .deck-panel { position:relative; width:100%; max-width:none; margin:0; color:#f8f0e4; }
.camera-stage { padding:15px 0 26px; perspective:900px; }
.sunnybe-listening .turntable { transform:translate3d(-4px,8px,0) rotateX(14deg) rotateZ(-5deg) scale(.87); transform-origin:50% 60%; transition:transform 2.9s cubic-bezier(.22,.72,.25,1),box-shadow 2.9s; box-shadow:0 20px 26px -8px #000c; }
.sunnybe-listening .camera-near .turntable { transform:translate3d(0,-3px,28px) rotateX(0) rotateZ(0) scale(1.015); box-shadow:0 28px 38px -11px #000e; }
.sunnybe-listening .console { display:block; }
.sunnybe-listening .now { padding:10px 13px 0; background:#0d0e10a8; border-color:#d2b0743d; }
.sunnybe-listening .now h3 { font:600 clamp(.93rem,1.4vw,1.16rem)/1.25 system-ui,sans-serif; margin:4px 0 0; }
.sunnybe-listening .micro { font-size:.61rem; color:#bbae9a; }
.sunnybe-listening .timeline { padding:5px 13px 9px; background:#0d0e10a8; border-color:#d2b0743d; font-size:.69rem; }
.sunnybe-listening input[type=range] { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.sunnybe-listening .buttons { display:flex; align-items:center; }
.sunnybe-listening .skip { display:grid; }
.sunnybe-listening button { cursor:pointer; }
.sunnybe-listening .buttons button { min-width:48px; height:48px; }
.sunnybe-listening .deck-options { margin-top:7px; }
.sunnybe-listening #motion-toggle { color:#e2ca9e; border:1px solid #e4bd714d; border-radius:16px; padding:10px 14px; background:transparent; min-height:44px; font:inherit; font-size:.75rem; }
.sunnybe-listening #volume-bar { background:transparent; }
.deck-caption { margin:14px 0 0; color:#e2ca9e; font-size:.82rem; line-height:1.5; text-align:center; }
.sunnybe-listening [hidden] { display:none!important; }
.sunnybe-listening :focus-visible { outline:2px solid #f2ce83; outline-offset:5px; }
.home-listening { padding:70px max(20px,calc((100vw - 1280px)/2)); background:radial-gradient(ellipse at 75% 45%,#3e2a17,#15100c 70%); }
.home-v11 .home-actions { flex-wrap:wrap; }
.home-v11 .home-button-secondary { border:1px solid #f3d69c66; color:#fff5e5; background:#17120b91; gap:10px; }
.media-main { padding:120px 26px 50px; }
.motion-off .sunnybe-listening *, .motion-off .travelling-record { transition:none!important; animation:none!important; }
.motion-off .sunnybe-listening .turntable { transform:none!important; }
.motion-off .tonearm { transition:none!important; }
@media(max-width:850px) {
 .sunnybe-listening { gap:30px; padding:30px; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); }
 .sunnybe-listening .release { gap:13px; }
 .sunnybe-listening .sleeve { width:78px; }
}
@media(max-width:650px) {
 .media-main { padding:96px 14px 30px; }
 .sunnybe-listening { grid-template-columns:minmax(0,1fr); padding:25px 22px 22px; gap:15px; border-radius:22px; }
 .sunnybe-listening .releases { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 14px; }
 .sunnybe-listening .release { flex-direction:column; align-items:flex-start; gap:9px; max-width:none; }
 .sunnybe-listening .sleeve { width:min(108px,100%); }
 .sunnybe-listening .release-name { font-size:.92rem; }
 .camera-stage { padding:16px 0 16px; }
 .home-listening { padding:36px 14px; }
 .deck-caption { font-size:.8rem; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .sunnybe-listening .turntable { transition:none; } }
/* An explicit player opt-in overrides the site's blanket reduced-motion rule
   only for the camera and tonearm. All other page motion stays reduced. */
@media(prefers-reduced-motion:reduce) {
 .player-motion-on .sunnybe-listening .turntable { transition:transform 2.9s cubic-bezier(.22,.72,.25,1),box-shadow 2.9s!important; }
 .player-motion-on .sunnybe-listening .tonearm { transition:transform 1.45s cubic-bezier(.4,0,.2,1),filter 1.45s!important; }
}