.deck{aspect-ratio:1.04;border:0;border-radius:8px;background-color:#75441f;background-image:repeating-linear-gradient(2deg,#ffffff04 0 1px,#1209000a 1px 3px,transparent 3px 7px),linear-gradient(90deg,#8e542d,#72401f 50%,#8c532b);box-shadow:0 18px 30px #0006,inset 0 0 0 1px #b18253;padding-bottom:20%;margin-top:78px;margin-bottom:17px}.deck:before{inset:auto 0 20% 0;height:13px;border:0;border-radius:0;background:#131412;box-shadow:0 2px 3px #0008}.deck:after{content:"";position:absolute;bottom:-10px;left:5%;width:90%;height:11px;background:linear-gradient(90deg,#50534f 0 9%,transparent 9% 91%,#50534f 91%);z-index:-1}.retro-name{position:absolute;left:0;right:0;top:-29px;height:26px;background:linear-gradient(#b8bbb7,#7d827c);color:#191d19;font-size:11px;font-weight:500;padding:6px 12px;border-radius:2px;display:flex;justify-content:space-between}.retro-name span{font-size:9px;font-weight:400}.deck .platter{width:74%;left:5%;top:5%;border:8px solid #747874;box-shadow:0 3px 8px #0008,inset 0 0 0 2px #a1a5a0;background:#353a35}.deck .playing-disc{inset:4px;background:repeating-radial-gradient(circle,#303530 0 3px,#353a35 3px 4px,#303530 4px 8px);box-shadow:none;border:0}.deck .label{background:#303530;color:#babfb4;width:32%;font-size:18px}.deck .label small{font-size:6px}.deck .arm-pivot{right:6%;top:9%;width:12%;background:linear-gradient(90deg,#858a86,#d0d3cc 48%,#8d938e);border:2px solid #a6aca5}.deck .arm{top:35%;left:43%;height:290px;max-height:510%;width:7px;transform:rotate(0deg);background:linear-gradient(90deg,#808881,#e2e5dc 50%,#868d87);border:0}.deck .arm:before{width:18px;left:-6px;top:-24px;height:30px;background:linear-gradient(90deg,#878e87,#c8cec6,#858c85);border-top:3px solid #b9c0b7;border-radius:3px}.deck .arm i{background:#151b17;border:2px solid #474c42;border-bottom:5px solid #852f24;width:20px;height:35px;left:-6px}.deck .arm i:before{content:"";position:absolute;inset:5px;background:radial-gradient(circle,#aa8650 0 2px,transparent 3px);background-size:6px 9px}.deck.playing .arm{transform:rotate(25deg)}.deck-bottom{display:none}.retro-controls{position:absolute;bottom:3%;left:5%;right:5%;height:13%;display:grid;grid-template-columns:1.2fr 1fr;gap:18px;align-items:center}.transport{display:flex;justify-content:space-between;gap:7px}.transport button{width:38px;height:38px;border-radius:50%;background:linear-gradient(120deg,#b4b8b2,#818881);border:1px solid #c0c4bd;box-shadow:0 3px 4px #0006;color:#171e17;font-size:9px;padding:0;cursor:pointer}.transport button:hover{background:#c4ccbd}.transport button:active{transform:translateY(2px);box-shadow:none}.retro-display{align-self:stretch;min-width:0;background:#101c1c;border:3px solid #322b21;box-shadow:inset 0 2px 5px #000c;color:#8bc9ca;padding:5px 8px;display:flex;flex-direction:column;justify-content:center;font-family:monospace;font-size:9px;gap:3px}.retro-display strong{font-size:10px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.retro-display small{font-size:8px;color:#a7c5bc}.retro-display>span{font-size:9px}.album.is-selected .album-caption h2{color:#c6d9b6}.studio .intro{margin-bottom:0}
@font-face{font-family:Jost;src:url("assets/fonts/home/Jost.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url("assets/fonts/home/Manrope.ttf") format("truetype");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"D-DIN";src:url("assets/fonts/home/D-DIN.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{font-family:Manrope,Arial,sans-serif;font-weight:400}
.studio h1,.cover-type,.album-caption h2,header>a:first-child{font-family:Jost,Arial,sans-serif;font-weight:600}
header>a span{font-weight:400}
.retro-name,.retro-name span,.transport button,.retro-display,.retro-display strong,.retro-display small,.cover-foot,.album-caption p,footer{font-family:"D-DIN",Arial,sans-serif;font-weight:400}
.retro-display{font-variant-numeric:tabular-nums}
.deck .platter{width:70%;top:4%}
.deck .platter{border-color:#727673;box-shadow:0 7px 12px #0009,inset 0 0 0 1px #d1d3cb;background:#141616}
.deck .playing-disc{inset:3px;border:2px solid #151717;background:repeating-radial-gradient(circle at center,#141616 0 1px,#2a2d2d 1.3px 1.8px,#151717 2.2px 3px);box-shadow:inset 0 0 0 4px #202323,inset 0 0 0 5px #454a464d,inset 0 0 18px #0008}
.deck .playing-disc:before{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;background:conic-gradient(from 15deg,transparent 0deg,#dbe2dd08 32deg,#e8eeea20 48deg,#c9d4cf09 65deg,transparent 95deg,transparent 175deg,#dbe2dd08 208deg,#e8eeea18 230deg,transparent 260deg,transparent 360deg);box-shadow:inset 0 0 0 9px #0003}
.deck .label{position:relative;z-index:1;width:28%;background:radial-gradient(circle,#121414 0 9%,#454a46 10% 11%,#242827 12% 66%,#161918 67% 70%,#323735 71% 72%,#222624 73%);box-shadow:0 1px 3px #0009,inset 0 1px 2px #ffffff10;color:transparent;font-size:0}
.deck .spindle{inset:calc(50% - 4px);background:radial-gradient(circle at 30% 25%,#f5f4ed,#a3aaa3 45%,#505952 80%);border:1px solid #555e57;box-shadow:1px 2px 3px #0009}
@media(max-width:1050px){.deck .arm{height:225px}.retro-controls{gap:8px;left:4%;right:4%}.transport{gap:4px}.transport button{width:30px;height:30px;font-size:8px}.retro-display{padding:3px 5px}.retro-display strong{font-size:8px}.retro-display>span,.retro-display small{font-size:7px}}
@media(max-width:700px){.deck{margin-top:58px}.deck .arm{height:200px}.transport button{width:33px;height:33px}.retro-name{font-size:10px}.retro-name span{font-size:8px}.retro-display strong{font-size:8px}.deck .label{font-size:14px}}
