.album-shelf-wrap{grid-area:shelf;min-width:0;margin:0 7%;position:relative}
.listening-desk .album-shelf-wrap .record-shelf{grid-area:auto;margin:0;padding:40px 18px 62px;gap:38px;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.album-shelf-wrap .record-shelf::-webkit-scrollbar{display:none}
.listening-desk .album-shelf-wrap .shelf-item{flex:0 0 clamp(230px,21vw,290px);width:clamp(230px,21vw,290px);max-width:none;height:auto;aspect-ratio:1;margin:0;scroll-snap-align:start}
.album-shelf-controls{display:flex;align-items:flex-start;gap:25px;max-width:700px;margin:0 auto 18px;color:#d6c0a1;padding:0 12px}
.album-shelf-controls>button{width:58px;height:46px;padding:6px;flex-shrink:0;transition:color .2s,transform .2s;color:inherit}
.album-shelf-controls>button:hover:not(:disabled){color:#fff0d5;transform:translateX(-3px) rotate(-4deg)}.album-shelf-controls>.shelf-forward:hover:not(:disabled){transform:translateX(3px) rotate(4deg)}
.album-shelf-controls>button:disabled{opacity:.25;cursor:default}.album-shelf-controls svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(1px 2px 1px #0008)}
.shelf-scroll-line{flex:1;min-width:0;position:relative;padding-top:8px;text-align:center}.shelf-scroll-line:before{content:'';position:absolute;top:23px;left:0;right:0;border-top:1px solid #cfb89470;transform:rotate(-.5deg);pointer-events:none}
.shelf-scroll-line input{position:relative;display:block;width:100%;height:30px;appearance:none;-webkit-appearance:none;background:transparent;cursor:ew-resize;margin:0;touch-action:pan-y}
.shelf-scroll-line input::-webkit-slider-runnable-track{height:3px;border-top:1px solid #dfc29cb3;border-bottom:1px solid #dfc29c38;border-radius:50%}
.shelf-scroll-line input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:53px;height:16px;margin-top:-8px;border:2px solid #dfc5a0;border-radius:48% 43% 52% 45%;background:#31281c;box-shadow:inset 0 0 0 2px #b6997040,0 3px 5px #0007;transform:rotate(-5deg)}
.shelf-scroll-line input::-moz-range-track{height:2px;background:#c9ab7b}.shelf-scroll-line input::-moz-range-thumb{width:49px;height:13px;border:2px solid #dfc5a0;border-radius:48%;background:#31281c}
.shelf-scroll-line>span{display:block;font:22px/1.2 DeskHand,cursive;transform:rotate(-2deg);color:#c9ad88;margin-top:3px}.album-shelf-controls :focus-visible{outline:2px solid #e4b9a0;outline-offset:5px}
@media(max-width:700px){.album-shelf-wrap{margin:0;min-width:0}.listening-desk .album-shelf-wrap .record-shelf{margin:0 -7%;padding:33px 8% 60px;gap:27px}.listening-desk .album-shelf-wrap .shelf-item{flex-basis:185px;width:185px;height:185px}.album-shelf-controls{gap:10px;padding:0;margin-bottom:15px}.album-shelf-controls>button{width:44px}.shelf-scroll-line>span{font-size:19px}.shelf-scroll-line input::-webkit-slider-thumb{width:37px}}
.album-shelf-wrap .record-shelf{scroll-padding-inline:18px}
.listening-desk .album-shelf-wrap .record-shelf{margin:0;padding:40px 32px 62px;gap:38px;justify-content:space-evenly;overflow:visible;scroll-snap-type:none;min-width:0}
.listening-desk .album-shelf-wrap .shelf-item{flex:0 0 var(--shelf-cover-size,250px);width:var(--shelf-cover-size,250px);height:var(--shelf-cover-size,250px)}
.listening-desk .album-shelf-wrap .shelf-item[hidden]{display:none!important}
@media(max-width:700px){.listening-desk .album-shelf-wrap .record-shelf{margin:0;padding:36px 24px 62px;gap:38px}}
