/* Shared turntable and playlist presentation for the homepage and ZAOZ. */
.music-room {
  --music-ink:#034b61; --music-muted:#577581; --music-line:#034b612d; --music-copper:#a34d5c;
  position:relative; color:var(--music-ink); border-top:1px solid var(--music-line);
  padding:60px 0 0; margin-top:74px; scroll-margin-top:100px;
}
.music-heading{display:grid;grid-template-columns:1fr 1fr;gap:12px 50px;align-items:end;margin-bottom:36px}
.music-eyebrow{grid-column:1/-1;font:11px/1.5 var(--font-mono,monospace);letter-spacing:.12em;color:var(--music-copper);text-transform:uppercase}
.music-heading h3{font:400 40px/1.3 var(--font-display,serif);letter-spacing:-.035em;color:var(--music-ink);margin:0}
.music-heading>p:last-child{color:var(--music-muted);font-size:14px;line-height:1.9;max-width:320px;margin:0;justify-self:end}
.music-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:90px;align-items:center;padding:0 0 44px}
.music-record{min-width:0;padding:25px 0 0;position:relative}
.music-turntable{display:block;position:relative;width:100%;max-width:380px;aspect-ratio:1.18;margin:0 0 28px;padding:0;border:1px solid #b5b8b0;border-radius:10px;background:linear-gradient(135deg,#eeede7,#ddded6 65%,#d0d3c9);box-shadow:inset 0 1px 1px #fff9,0 3px 0 #9b9f953d,0 16px 30px #10252b15;text-align:left;cursor:pointer;isolation:isolate;overflow:hidden}
.music-turntable:after{content:"";position:absolute;inset:3px;border:1px solid #fff6;border-radius:7px;pointer-events:none}
.music-platter{position:absolute;left:5.5%;top:7%;width:72%;aspect-ratio:1;border-radius:50%;padding:5px;background:linear-gradient(140deg,#f5f4ef,#8f958c 40%,#d9ded4 58%,#a0a69b);box-shadow:0 3px 7px #12252233}
.music-vinyl{position:relative;display:block;width:100%;height:100%;border-radius:50%;background:repeating-radial-gradient(circle,#18201d 0 1px,#303731 1.4px 2px,#161e1a 2.6px 3.6px);box-shadow:inset 0 0 0 1px #080e0b;animation:music-revolve 24s linear infinite;animation-play-state:paused}
.music-vinyl:before{content:"";position:absolute;inset:1%;border-radius:50%;background:conic-gradient(from 30deg,transparent,#ffffff15 12%,transparent 24% 50%,#ffffff1a 62%,transparent 76%);pointer-events:none}
.music-vinyl img{position:absolute;left:34%;top:34%;width:32%;height:32%;object-fit:cover;border-radius:50%;border:3px solid #ddcbb5;box-shadow:0 0 0 1px #0e1912}
.music-vinyl:after{content:"";position:absolute;left:calc(50% - 3px);top:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:#dcded6;box-shadow:0 0 0 1px #455342,1px 1px 3px #0005}
.music-tonearm{position:absolute;right:2.5%;top:5%;width:24%;height:79%;transform-origin:73% 11%;transition:transform .9s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(2px 3px 2px #18251a33);pointer-events:none}
.music-tonearm svg{width:100%;height:100%;overflow:visible;stroke:#acb2a6;stroke-width:5;stroke-linejoin:round;stroke-linecap:round}
.music-tonearm circle{fill:#d0d4ca;stroke:#969e91;stroke-width:2}.music-tonearm .music-cartridge{fill:#303a31;stroke:#273126;stroke-width:2}
.music-turntable .music-deck-brand{position:absolute;left:6.5%;bottom:6%;font-size:17px;line-height:1;color:#252c25;letter-spacing:-.07em}
.music-deck-speed{position:absolute;right:7%;bottom:6.5%;font:9px/1 var(--font-mono,monospace);color:#596353;letter-spacing:.04em}
.music-deck-light{position:absolute;right:23%;bottom:7%;width:4px;height:4px;border-radius:50%;background:#bb7258;box-shadow:0 0 0 3px #a35f4520}
@media(hover:hover){.music-turntable:hover .music-vinyl{animation-play-state:running}.music-turntable:hover .music-tonearm{transform:rotate(9deg)}}
@keyframes music-revolve{to{transform:rotate(360deg)}}
.music-record-info{padding-left:8px;max-width:390px}
.music-record-info .music-category{font:11px/1.6 var(--font-mono,monospace);color:var(--music-copper);margin-bottom:11px}
.music-record-info h4{font:400 24px/1.55 var(--font-display,serif);color:var(--music-ink);letter-spacing:-.02em;margin:0 0 11px}
.music-date{font:11px/1.7 var(--font-mono,monospace);color:#526f7a;margin:0}
.music-list{min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.music-list-label{font:11px/1.6 var(--font-mono,monospace);color:#526f7a;margin:0 0 12px;letter-spacing:.04em}
.music-pick{display:grid;grid-template-columns:14px 56px minmax(0,1fr) 18px;gap:17px;align-items:center;width:100%;background:transparent;border:0;border-top:1px solid var(--music-line);padding:19px 0;text-align:left;color:var(--music-muted);font:inherit;cursor:pointer;transition:color .2s}
.music-pick:last-child{border-bottom:1px solid var(--music-line)}
.music-pick>img{width:56px;height:56px;object-fit:cover;opacity:.75;transition:opacity .2s}
.music-pick>small{font:11px/1.5 var(--font-mono,monospace);color:#526f7a}
.music-pick-copy{min-width:0;display:grid;gap:7px}
.music-pick-copy b{font-size:13px;line-height:1.7;font-weight:400;color:inherit}
.music-pick-copy small{font-size:11px;line-height:1.6;color:#526f7a}
.music-pick-marker{width:15px;height:15px;border:1px solid #526f7a;border-radius:50%;display:grid;place-items:center;color:var(--music-copper)}
.music-pick-marker:after{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:0}
.music-pick[aria-pressed=true]{color:var(--music-ink)}
.music-pick[aria-pressed=true] img,.music-pick:hover img{opacity:1}
.music-pick[aria-pressed=true] .music-pick-marker{border-color:var(--music-copper)}
.music-pick[aria-pressed=true] .music-pick-marker:after{opacity:1}
.music-pick:hover{color:var(--music-ink)}
.music-actions{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:23px 0 0}
.music-open{display:inline-flex;align-items:center;gap:14px;padding:11px 0;background:transparent;border:0;color:var(--music-ink);border-bottom:1px solid #526f7a;font:13px/1.6 var(--font-sans,sans-serif);cursor:pointer;min-height:44px}
.music-open svg{width:12px;height:12px;fill:currentColor}
.music-open[aria-expanded=true] svg{display:none}
.music-original{font-size:12px;line-height:1.7;color:#4d6c78;text-decoration:none;border-bottom:1px solid #a1b9be;padding:7px 0}
.music-original span{margin-left:5px}
.music-status{font-size:12px;line-height:1.85;color:#577581;margin:19px 0 0;max-width:400px}
.music-platform-note{font-size:12px;line-height:1.85;color:#526f7a;margin:8px 0 0;max-width:400px}
.music-player-shell{border:1px solid #b6cbd0;background:#f7f7f7;margin:0;max-width:100%;overflow:hidden}
.music-player-shell[hidden]{display:none!important}
.music-player-shell iframe{display:block;width:100%;height:460px;border:0;margin:0;background:#f7f7f7}
.music-room button:focus-visible,.music-room a:focus-visible{outline:2px solid var(--music-copper);outline-offset:5px}
@media(max-width:1050px){
  .music-layout{gap:52px;grid-template-columns:.85fr 1.15fr}
  .music-pick{gap:13px;grid-template-columns:12px 48px minmax(0,1fr) 17px}
  .music-pick>img{width:48px;height:48px}
  .music-record-info h4{font-size:22px}
}
@media(max-width:780px){
  .music-room{padding-top:39px;margin-top:48px;scroll-margin-top:90px}
  .music-heading{display:block;margin-bottom:28px}
  .music-heading h3{font-size:31px;line-height:1.4}
  .music-eyebrow{margin-bottom:14px}
  .music-heading>p:last-child{font-size:13px;margin-top:13px;max-width:none}
  .music-layout{grid-template-columns:1fr;gap:33px;padding-bottom:27px}
  .music-record{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px;padding-top:10px}
  .music-turntable{margin:0;max-width:none}
  .music-record-info{padding:0;max-width:none}
  .music-record-info h4{font-size:20px;line-height:1.6}
  .music-pick{grid-template-columns:12px 48px minmax(0,1fr) 16px;padding:15px 0}
  .music-pick-copy b{font-size:12px}
  .music-actions{padding-top:17px}
  .music-status,.music-platform-note{max-width:none}
}
@media(max-width:420px){
  .music-record{gap:26px;grid-template-columns:.85fr 1.15fr}
  .music-record-info h4{font-size:18px}
  .music-record-info .music-category{margin-bottom:8px}
  .music-pick{gap:11px;grid-template-columns:11px 42px minmax(0,1fr) 14px}
  .music-pick>img{width:42px;height:42px}
  .music-original,.music-open{font-size:12px}
  .music-actions{gap:15px}
}
@media(prefers-reduced-motion:reduce){.music-pick,.music-pick>img{transition:none}}

.music-record-info h4,.music-pick-copy b{text-wrap:balance}

/* Opening the player replaces the record introduction in the same space. */
.music-room[data-music-state=loading] .music-record,.music-room[data-music-state=open] .music-record{display:block;padding-top:0}
.music-room[data-music-state=loading] .music-turntable,.music-room[data-music-state=open] .music-turntable,.music-room[data-music-state=loading] .music-record-info,.music-room[data-music-state=open] .music-record-info{display:none}
.music-record .music-player-shell{width:100%;max-width:440px;margin-inline:auto;border:0;background:transparent}
.music-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:-1px}
.music-room[data-music-phase=failed] .music-status{position:static;width:auto;height:auto;clip-path:none;margin:12px 0 0}

@media(prefers-reduced-motion:reduce){.music-vinyl{animation:none}.music-tonearm{transition:none}}
