@font-face{font-family:DeskHand;src:url('assets/fonts/Caveat.ttf') format('truetype');font-weight:400 700;font-display:swap}
.record-sticky.listening-desk{background-image:linear-gradient(90deg,#090a096b,transparent 42%,#080a0910),url('assets/listening-desk-v3.webp');background-size:100% auto;--hand:DeskHand,'Segoe Print',cursive}
.listening-desk .record-info{align-self:start;margin-top:48px;padding:0 0 18px;transform:rotate(-1deg);text-shadow:0 1px 4px #000}
.listening-desk .record-info h3{font-size:clamp(28px,2.6vw,42px);margin:12px 0}
.listening-desk .record-info>p{margin-bottom:18px;font-size:11px}
.listening-desk #desk-tracklist>.tiny{font:500 24px/1.1 var(--hand);letter-spacing:0;text-transform:none;color:#e3c9ab;margin-bottom:12px}
.listening-desk #desk-tracklist ol{max-height:none;overflow:visible}
#desk-tracklist li{padding:5px 0;border:0;gap:12px;min-height:34px}
#desk-tracklist li>span{font:500 17px var(--hand);color:#cfa994;flex-basis:20px}
#desk-tracklist strong{font:500 22px/1.16 var(--hand);color:#f0e3cd}
#desk-tracklist li:nth-child(3n) strong{transform:rotate(.6deg)}
#desk-tracklist li:nth-child(2n) strong{transform:rotate(-.4deg)}
#desk-tracklist button[data-desk-save]{font:500 24px var(--hand);color:#dab598}
.desk-list-pages{display:flex;align-items:center;gap:15px;margin-top:14px;font:500 19px var(--hand);color:#d6bda5}
#desk-tracklist .desk-list-pages button{flex:0 0 36px;font:24px var(--hand);text-align:center;border:1px solid #c9ad864f;border-radius:45%;min-height:32px}
.desk-list-pages button:disabled{opacity:.3}
.listening-desk .record-actions{margin-top:20px}
.listening-desk .record-info>.tiny{font-size:10px;letter-spacing:1px}
.listening-desk .tonearm{width:41%;height:82%;left:72%;top:-6%;transform-origin:48% 18%;transform:rotate(-9deg);filter:drop-shadow(5px 7px 3px #000b)}
.tonearm img{width:100%;height:100%;display:block;object-fit:contain;user-select:none}
.disc-playing .listening-desk .tonearm{transform:rotate(calc(22deg + var(--needle-progress)*12deg));filter:drop-shadow(2px 3px 1px #0009)}
.desk-session{padding:27px 23px;min-height:380px}
.desk-session h3{font:600 36px/1 var(--hand);letter-spacing:0;transform:rotate(-2deg)}
.desk-session strong{font:500 23px/1.03 var(--hand);color:#35281c}
.desk-session li:nth-child(2n) strong{transform:rotate(-1deg)}
.desk-session li{padding:11px 0;align-items:baseline}
.desk-session li>span{font:17px var(--hand)}
.desk-session ol{max-height:370px}
.desk-session small{font-size:9px}
.desk-session-tabs button{font-size:11px}
.desk-session #desk-session-note{font:500 18px/1.2 var(--hand);color:#70543b}
.desk-session>.tiny{font-size:8px}
.desk-session-actions button{font-size:11px}
.paper-signoff{font:500 23px/1.1 var(--hand);color:#77563c;transform:rotate(-3deg)}
.desk-session>small{font-size:8px}
.listening-desk .turntable-caption{bottom:10%;left:10%;font-size:9px;letter-spacing:.7px;color:#cbb495}
.listening-desk .turntable-caption b{font:500 17px var(--hand);color:#e2c9a8;letter-spacing:0}
.desk-play-state{bottom:4%;left:10%;font:500 21px/1.1 var(--hand);letter-spacing:0;color:#d9c3a3;transform:rotate(-2deg)}
.desk-scribble{position:absolute;bottom:5%;right:2%;font:500 26px/.95 var(--hand);color:#e8d6b8;transform:rotate(-7deg);text-shadow:0 1px 3px #000;pointer-events:none}
.desk-shelf-heading{margin:16px 5% 0;color:#e0cbae;align-items:center;gap:25px}
.desk-shelf-heading>span:first-child{font:500 28px var(--hand);letter-spacing:0;transform:rotate(-3deg);text-transform:lowercase}
.desk-shelf-heading>span:last-child{font:500 28px/1.15 var(--hand);color:#f0ddbd;transform:rotate(2deg)}
.listening-desk .shelf-item span{font:500 20px/1 var(--hand);bottom:-28px;color:#e9d9bf;letter-spacing:0}
.shelf-item,.room-song{cursor:grab;user-select:none;-webkit-user-select:none}.shelf-item:active,.room-song:active{cursor:grabbing}.shelf-item img,.room-song img{-webkit-user-drag:none;user-select:none}
.desk-drag-ghost{position:fixed;top:0;left:0;width:130px;height:130px;object-fit:cover;z-index:99999;pointer-events:none;box-shadow:4px 14px 24px #0009;border:1px solid #e4c49688}
.desk-drop-message{display:none;position:absolute;inset:40% 5% auto;z-index:8;text-align:center;background:#14110fea;padding:20px;border:2px dashed #e0c1a1;border-radius:48%;font:600 28px var(--hand);color:#f5ddbc;pointer-events:none}
.dragging-record .desk-drop-message{display:block}.dragging-record .record-table{outline:2px dashed #c1a48399;outline-offset:-15px;border-radius:15%}.dragging-record .drop-ready{outline-color:#f3dfb6;background:#d9c19515}.drop-ready .desk-drop-message{background:#5c3b27ef}
.dragging-record .shelf-item{transition:none}.listening-desk .desk-bottom{font-size:10px;color:#bda991}
@media(min-width:1600px){#desk-tracklist strong{font-size:24px}.desk-session strong{font-size:25px}}
@media(max-width:1100px) and (min-width:701px){.listening-desk .record-info{margin-top:20px}.desk-session ol{max-height:280px}.desk-session h3{font-size:34px}.desk-scribble{font-size:23px}.desk-shelf-heading{margin-inline:0}}
@media(max-width:700px){.record-sticky.listening-desk{background-size:auto 1050px}.listening-desk .record-info{margin-top:0;transform:none;border-top:0}.listening-desk .record-table{margin-top:12px}.listening-desk .record-info h3{font-size:32px}.listening-desk .record-info>p{margin-bottom:16px}.listening-desk #desk-tracklist ol{max-height:none}.listening-desk #desk-tracklist strong{font-size:23px}.desk-session h3{font-size:38px}.desk-session strong{font-size:25px}.desk-session ol{max-height:410px}.desk-scribble{font-size:22px;bottom:15%;left:3%}.listening-desk .turntable-caption{font-size:8px;bottom:7%;left:3%}.listening-desk .turntable-caption b{font-size:15px}.desk-play-state{font-size:17px;bottom:0;left:3%}.desk-shelf-heading>span:first-child{font-size:26px}.desk-shelf-heading>span:last-child{font-size:25px;margin-top:12px}.listening-desk .shelf-item span{font-size:18px;bottom:-27px}.listening-desk .desk-bottom{font-size:9px}.listening-desk .record-shelf{padding-bottom:55px}.listening-desk .desk-bottom>span:last-child{font-size:9px}.desk-drop-message{font-size:24px}}

@media(min-width:701px){.record-sticky.listening-desk{background-size:100% var(--desk-scene-height,1200px)}.listening-desk .record-info{margin-top:25px}}
@media(max-width:700px){.desk-scribble{right:0;left:auto;bottom:12%;font-size:18px}.desk-play-state{font-size:16px}.listening-desk .turntable-caption{bottom:6%}}

.listening-desk .record-info{inset:auto;box-shadow:none}.listening-desk .record-shelf{inset:auto}.listening-desk .desk-bottom{inset:auto;position:relative}

@media(max-width:700px){.desk-scribble{display:none}}
