/* Skunkies — the record player on the Menu page (moved from the homepage, 28 Sep 2026).
   Same artwork as the homepage build; the colours are scoped to the section so
   nothing here depends on poster.css. */
.sleeve{
  --p-blue:#35B7F0;--p-blue-lt:#8FE3F7;--p-ink:#111111;--p-cream:#F6F7F2;--p-red:#FF3B30;
  overflow:hidden
}
.sleeve__wrap{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:clamp(90px,9vw,140px);align-items:center}
.sleeve__art{position:relative;aspect-ratio:1;width:100%;perspective:1200px}
.sleeve__jacket{position:absolute;inset:0;background:var(--p-ink);border:3px solid var(--p-ink);box-shadow:10px 10px 0 rgba(17,17,17,.15);overflow:hidden;transform:rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg));transition:transform .4s var(--ease);transform-style:preserve-3d}
.sleeve__jacket img{width:100%;height:100%;object-fit:contain;padding:14%;background:radial-gradient(circle at 50% 45%,#0A5578,#04293B)}
.sleeve__jacket-tape{position:absolute;top:-10px;left:50%;width:70px;height:20px;background:rgba(246,242,220,.5);transform:translateX(-50%) rotate(-3deg)}
.sleeve__disc{position:absolute;top:14%;left:44%;width:72%;height:72%;border-radius:50%;background:radial-gradient(circle at 50% 50%,#0d0d0d 0 30%,#1a1a1a 31% 40%,#0d0d0d 41% 100%);box-shadow:0 14px 36px rgba(0,0,0,.5);transform:rotate(var(--spin,0deg));will-change:transform}
.sleeve__grooves{position:absolute;inset:6%;border-radius:50%;background:repeating-radial-gradient(circle,rgba(255,255,255,.05) 0 2px,transparent 2px 5px)}
.sleeve__label{position:absolute;inset:32%;border-radius:50%;overflow:hidden;background:var(--p-blue);display:grid;place-items:center;border:2px solid var(--p-ink)}
.sleeve__label img{width:82%;height:82%;object-fit:contain}
.sleeve__hole{position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px;border-radius:50%;background:var(--p-cream)}
.sleeve__tonearm{position:absolute;right:-6%;top:-8%;width:44%;height:60%;transform-origin:92% 8%;transform:rotate(var(--arm,-18deg));transition:transform .5s var(--ease)}
.sleeve__tonearm-base{position:absolute;right:2%;top:0;width:20px;height:20px;border-radius:50%;background:var(--p-ink)}
.sleeve__tonearm-head{position:absolute;left:0;bottom:0;width:100%;height:5px;background:var(--p-ink);border-radius:3px;transform-origin:100% 50%}
.sleeve__tonearm-head::after{content:"";position:absolute;left:-3px;bottom:-4px;width:11px;height:11px;border-radius:2px;background:var(--p-red)}
@media (max-width:900px){.sleeve__wrap{grid-template-columns:1fr;gap:56px}.sleeve__art{max-width:320px;width:78%;margin-inline:auto 22%}}

.tracklist{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,34px);margin-top:30px}
.tracklist__side-h{font:700 .8rem/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:#04607F;margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid var(--p-ink)}
.track{display:grid;grid-template-columns:auto 1fr;column-gap:12px;padding:11px 4px;text-decoration:none;color:var(--p-ink);border-bottom:1px dashed rgba(17,17,17,.25);transition:background .2s,padding-left .2s}
.track:hover,.track:focus-visible{background:rgba(53,183,240,.12);padding-left:10px}
.track i{grid-row:1 / span 2;align-self:center;font-style:normal;font:700 .8rem/1 var(--mono);color:var(--p-blue-lt);background:var(--p-ink);border-radius:3px;padding:5px 7px;height:fit-content}
.track b{font-weight:700;font-size:1.02rem}
.track small{grid-column:2;color:rgba(17,17,17,.68);font-size:.95rem}
@media (max-width:640px){.tracklist{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.sleeve__disc,.sleeve__jacket{transform:none}.sleeve__tonearm{transition:none}}