@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600&display=swap');
:root{--bg:#e9e6dd;--ink:#292d24;--muted:#717565;--line:#c4c7b7;--lime:#d6e58d}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,svg:focus-visible{outline:2px solid #748843;outline-offset:5px}header,footer{display:flex;align-items:center;justify-content:space-between;padding:25px 4.5%;border-bottom:1px solid var(--line)}.logo{font-size:26px;font-weight:700;letter-spacing:-1.5px}.back{font-size:12px}.header-note,.eyebrow{font-size:9px;letter-spacing:1.8px}.header-note{color:var(--muted)}main{padding:0 4.5%}.intro{padding:55px 0 42px;display:flex;justify-content:space-between;align-items:end}h1,h2{font-family:Manrope,sans-serif;font-weight:500;letter-spacing:-2.5px}h1{font-size:clamp(36px,4.4vw,65px);line-height:1.1;margin:20px 0 0}.intro p{font-size:13px;line-height:1.9;color:var(--muted);margin:0 0 4px}.listening{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:7%;align-items:start;padding:15px 0 75px}.machine{background:linear-gradient(120deg,#bcc0aa,#a2aa91);border:1px solid #969e86;border-radius:12px;box-shadow:0 10px 0 #7e876e,0 25px 45px #3c422122;overflow:hidden}.machine-head{display:flex;justify-content:space-between;align-items:center;margin:22px 22px 0;font-size:8px;letter-spacing:1px}.machine-head i{display:inline-block;background:#505e3c;width:5px;height:5px;border-radius:50%;margin-right:4px}.format{display:flex;border:1px solid #899578;border-radius:20px;padding:3px}.format button{font-size:8px;letter-spacing:.5px;background:transparent;border:0;padding:7px 9px;border-radius:20px;color:var(--ink)}.format button.active{background:#333e29;color:#e3ead6}.deck{position:relative}.deck svg{width:100%;height:auto;display:block;touch-action:pan-y;cursor:grab;user-select:none}.deck svg.dragging{cursor:grabbing;touch-action:none}#record-spin{transform-origin:230px 250px;animation:spin 9s linear infinite;animation-play-state:paused}body.playing #record-spin{animation-play-state:running}#arm{transition:transform .35s cubic-bezier(.2,.7,.3,1);filter:drop-shadow(5px 5px 3px #0004)}.dragging #arm{transition:none}.deck-instruction{font-size:9px;letter-spacing:.4px;text-align:center;color:#4f5c42;margin:-1px 0 23px}.machine-bottom{display:flex;gap:15px;align-items:center;margin:0 22px 23px;padding-top:20px;border-top:1px solid #8e997e}.transport{background:#313d28;color:#e1e8d5;border:0;border-radius:50%;width:44px;height:44px;flex-shrink:0}.transport:disabled{opacity:.4;cursor:default}.play-info{min-width:0;flex:1}.play-info span{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.play-info small{display:block;color:#536147;font-size:9px;line-height:1.6;margin-top:5px}.led{width:6px;height:6px;background:#778166;border-radius:50%;margin-right:10px}body.playing .led{background:#e4ff92;box-shadow:0 0 10px #dfff83}.album-panel{padding:7px 0}.album-panel h2{font-size:36px;line-height:1.12;margin:12px 0 8px}.album-panel>p{font-size:11px;color:var(--muted);min-height:14px;margin:0 0 20px}.selected-sleeve{display:none}.track-head{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;border-bottom:1px solid var(--line);padding:8px 0 12px}.track{display:grid;grid-template-columns:25px 1fr 35px;align-items:center;gap:10px;width:100%;background:none;border:0;border-bottom:1px solid #cdd0c0;text-align:left;padding:12px 7px;color:var(--ink);font-size:12px}.track span:first-child{font-size:9px;color:var(--muted)}.track small{font-size:10px;color:var(--muted);text-align:right}.track.active{background:#d6ddbf}.track.active span:first-child{color:#50652e}.track:hover{background:#dfe2d2}.empty-tracks{font-size:13px;line-height:1.8;color:var(--muted);padding:26px 0}.full-link{font-size:11px;display:inline-block;border-bottom:1px solid #9aa08a;padding-bottom:6px;margin-top:23px}.time{display:flex;justify-content:space-between;font-size:8px;color:var(--muted);letter-spacing:.4px;margin-top:6px}#progress{accent-color:#596c3a;width:100%;margin:22px 0 0;height:3px;cursor:pointer}.collection{border-top:1px solid var(--ink);padding:45px 0 55px}.collection-heading{display:flex;justify-content:space-between;align-items:end}.collection h2{font-size:48px;margin:12px 0 25px}.collection input{border:0;border-bottom:1px solid #9ca38c;background:transparent;font-size:12px;padding:10px 0;width:220px;margin-bottom:28px;color:var(--ink)}.legend{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:var(--muted);border-top:1px solid var(--line);padding:18px 0 28px}.record-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:35px 30px}.record-card{background:none;border:0;text-align:left;min-width:0;padding:0;color:var(--ink)}.record-object{position:relative;width:100%;aspect-ratio:1.28;isolation:isolate;margin-bottom:17px;padding-right:24%}.sleeve{position:absolute;inset:0 23% 0 0;background:var(--color,#7b836c);box-shadow:0 6px 12px #242e2022;z-index:2;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:17px;color:#f1f0e7;border:1px solid #0001;transition:transform .4s}.sleeve:after{content:'';position:absolute;inset:0;box-shadow:inset 2px 0 4px #fff3,inset -3px 0 5px #0002;pointer-events:none}.sleeve img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.sleeve strong{font-family:Manrope,sans-serif;font-weight:500;line-height:1.15;font-size:clamp(13px,1.6vw,24px);letter-spacing:-.7px}.sleeve small{font-size:7px;letter-spacing:1.5px}.sleeve em{font-style:normal;font-size:8px;letter-spacing:1px}.mini-record{position:absolute;width:72%;aspect-ratio:1;left:24%;top:4%;border-radius:50%;background:repeating-radial-gradient(circle,#151712 0px,#151712 2px,#30332a 3px,#1c1e18 4px);box-shadow:3px 7px 12px #25282035;transition:transform .45s}.mini-label{position:absolute;inset:34%;border-radius:50%;background:var(--color,#acb58c);overflow:hidden;display:grid;place-items:center;font-size:6px;letter-spacing:1px;color:#f4f2e7}.mini-label img{width:100%;height:100%;object-fit:cover}.mini-label:after{content:'';position:absolute;width:5px;height:5px;background:#dedfd5;border-radius:50%}.record-card:hover .mini-record,.record-card.selected .mini-record{transform:translateX(12%) rotate(15deg)}.record-card:hover .sleeve{transform:translateX(-3%) rotate(-2deg)}.record-card.selected .sleeve{outline:2px solid #7d8a5d;outline-offset:4px}.record-card h3{font-size:12px;font-weight:500;line-height:1.5;margin:0 0 7px}.record-card .meta{font-size:9px;color:var(--muted);display:flex;justify-content:space-between;gap:5px}.cd-mode .mini-record{background:conic-gradient(#e6e9e0,#a8bcb4,#d0c0d5,#e1dfbe,#afbfc3,#e6e9e0)}.cd-mode .sleeve{border:3px solid #cbd0c1;border-radius:3px}.archive-note{max-width:750px;line-height:1.8;font-size:10px;color:var(--muted);margin:45px 0 0}footer{border-top:1px solid var(--line);border-bottom:0;font-size:10px}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}@media(max-width:950px){.listening{gap:4%}.machine-head{margin:18px 14px 0}.machine-head>span{font-size:6px}.album-panel h2{font-size:30px}.record-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sleeve strong{font-size:20px}.intro p{display:none}}@media(max-width:640px){header,footer{padding:20px 5%}.header-note{display:none}main{padding:0 5%}.intro{padding-top:35px}h1{letter-spacing:-1.7px}.listening{grid-template-columns:1fr;gap:42px;padding-bottom:45px}.machine{max-width:540px;width:100%;margin:auto}.album-panel h2{font-size:34px}.record-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}.sleeve{padding:12px}.sleeve strong{font-size:18px}.collection-heading{display:block}.collection h2{font-size:40px}.collection input{width:100%;margin-bottom:20px}.legend{font-size:7px;letter-spacing:.3px;gap:10px}.machine-head>span{font-size:8px}.format button{font-size:8px}.deck-instruction{font-size:9px}.logo{font-size:23px}}

[hidden]{display:none!important}

#cd-art,.cd-center,#cd-light{display:none}.cd-mode #cd-art,.cd-mode .cd-center,.cd-mode #cd-light{display:block}.cd-mode #arm,.cd-mode #arm-base,.cd-mode #arm-cap,.cd-mode #grooves,.cd-mode #track-rings,.cd-mode #disc-label{display:none}#cd-light{pointer-events:none}#cd-cursor{transition:none}.cd-mode .deck svg{cursor:pointer}.cd-mode #record-spin{animation-duration:12s}

/* The sleeve opens when a song is selected. */
.deck-cover{position:absolute;z-index:3;width:74%;aspect-ratio:1;left:6%;top:10%;background:#75816c;box-shadow:0 12px 24px #242e2044;display:flex;flex-direction:column;justify-content:space-between;padding:28px;color:#f1f0e7;pointer-events:none;transform-origin:left center;transition:transform 1s cubic-bezier(.22,.7,.2,1),opacity .8s;overflow:hidden}
.deck-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.deck-cover strong{font:500 clamp(24px,3vw,44px) Manrope,sans-serif;letter-spacing:-1px;line-height:1.15}
.deck-cover small,.deck-cover span{font-size:10px;letter-spacing:2px}
.deck svg{opacity:0;transform:translateX(-8%) scale(.94);transition:opacity .8s,transform 1s cubic-bezier(.22,.7,.2,1)}
.disc-revealed .deck-cover{transform:translateX(-115%) rotate(-8deg);opacity:0}
.disc-revealed .deck svg{opacity:1;transform:translateX(0) scale(1)}

#source-label{display:none!important}
