.bookshelf{--wood-light:#c4a574;--wood-mid:#9a7348;--wood-dark:#6b4f30;--wood-shadow:#4a3622}.bookshelf-layout{grid-template-columns:minmax(0,1fr) minmax(220px,280px);align-items:stretch;gap:24px;display:grid}@media (max-width:768px){.bookshelf-layout{grid-template-columns:1fr;gap:16px}}.bookshelf-shelf-col{min-width:0}.bookshelf-preview{border:1px solid var(--line);background:var(--paper);flex-direction:column;min-height:320px;padding:20px 18px;transition:border-color .3s;display:flex}@media (min-width:769px){.bookshelf-preview{align-self:start;min-height:480px;position:sticky;top:1.5rem}}.bookshelf-preview--active{border-color:var(--line-dark)}.bookshelf-preview-empty{flex-direction:column;flex:1;justify-content:center;padding:12px 4px;display:flex}.bookshelf-preview-placeholder{font-family:var(--font-display), "Cormorant Garamond", Georgia, serif;color:var(--ink-soft);margin:0;font-size:1.25rem;font-weight:500;line-height:1.3}.bookshelf-preview-hint{font-family:var(--font-body), Newsreader, Georgia, serif;color:var(--muted);margin:10px 0 0;font-size:.95rem;line-height:1.5}.bookshelf-preview-inner{flex-direction:column;gap:18px;display:flex}.bookshelf-preview-cover{aspect-ratio:2/3;border:1px solid var(--line-dark);background:var(--paper-deep);width:100%;max-width:200px;margin:0 auto;overflow:hidden;box-shadow:4px 4px #15120e0f,0 10px 28px #15120e24}.bookshelf-preview-title{font-family:var(--font-display), "Cormorant Garamond", Georgia, serif;letter-spacing:-.02em;color:var(--ink);margin:0;font-size:1.4rem;font-weight:500;line-height:1.15}.bookshelf-preview-author{font-family:var(--font-body), Newsreader, Georgia, serif;color:var(--ink-soft);margin:6px 0 0;font-size:1rem;font-style:italic}.bookshelf-preview-desc{font-family:var(--font-body), Newsreader, Georgia, serif;color:var(--ink-soft);margin:12px 0 0;font-size:.95rem;line-height:1.55}.bookshelf-frame{border:2px solid var(--wood-dark);background:linear-gradient(180deg, var(--wood-shadow) 0%, var(--wood-mid) 8%, var(--wood-light) 50%, var(--wood-mid) 92%, var(--wood-shadow) 100%);position:relative;box-shadow:inset 0 2px 4px #ffffff26,inset 0 -3px 6px #0003,0 12px 32px #15120e2e}.bookshelf-inner{background:linear-gradient(#2a2218 0%,#1e1812 40%,#16120e 100%);margin:14px 12px 12px;position:relative;overflow:hidden;box-shadow:inset 0 0 40px #0000008c}.bookshelf-back{opacity:.35;pointer-events:none;background-image:repeating-linear-gradient(90deg,#0000,#0000 48px,#ffffff05 48px 49px);position:absolute;inset:0}.bookshelf-scene{perspective:1100px;perspective-origin:50% 60%;padding:20px 0 0;position:relative}.bookshelf-row-wrap{scrollbar-width:thin;scrollbar-color:var(--wood-mid) transparent;padding:0 12px;overflow:auto hidden}.bookshelf-row-wrap::-webkit-scrollbar{height:6px}.bookshelf-row-wrap::-webkit-scrollbar-thumb{background:var(--wood-mid);border-radius:3px}.bookshelf-row{min-height:220px;transform-style:preserve-3d;justify-content:flex-start;align-items:flex-end;gap:4px;width:max-content;min-width:100%;padding:8px 8px 4px;display:flex;transform:rotateX(3deg)}.bookshelf-book{cursor:pointer;transform-style:preserve-3d;-webkit-tap-highlight-color:transparent;background:0 0;border:none;flex-shrink:0;padding:0;position:relative}.bookshelf-book:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.bookshelf-book-body{width:var(--book-thickness);height:var(--book-height);transform-style:preserve-3d;transform-origin:bottom;transition:transform .4s cubic-bezier(.22,1,.36,1);position:relative}.bookshelf-book:hover .bookshelf-book-body,.bookshelf-book:focus-visible .bookshelf-book-body,.bookshelf-book--active .bookshelf-book-body{transform:translateY(-14px)translateZ(24px)rotateY(-10deg)}.bookshelf-book-spine{background:linear-gradient(90deg, color-mix(in srgb, var(--spine-color) 72%, black) 0%, var(--spine-color) 38%, color-mix(in srgb, var(--spine-color) 88%, white) 62%, var(--spine-color) 100%);backface-visibility:hidden;border-radius:1px 2px 2px 1px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;padding:14% 12% 10%;display:flex;position:absolute;inset:0;overflow:hidden;box-shadow:inset 1px 0 #ffffff24,inset -1px 0 3px #00000047,2px 4px 8px #00000059}.bookshelf-book-spine:before{content:"";pointer-events:none;border-top:1px solid #c9a36a73;border-bottom:1px solid #c9a36a73;position:absolute;inset:7% 18%}.bookshelf-spine-title{writing-mode:vertical-rl;text-orientation:mixed;font-family:var(--font-display), "Cormorant Garamond", Georgia, serif;font-size:clamp(8px, calc(var(--book-thickness) * .42px), 12px);letter-spacing:.03em;color:#fbf8f1f0;text-shadow:0 1px 2px #00000059;text-align:center;max-height:78%;font-weight:500;line-height:1.05;overflow:hidden;transform:rotate(180deg)}.bookshelf-spine-author{writing-mode:vertical-rl;text-orientation:mixed;font-family:var(--font-body), Newsreader, Georgia, serif;font-size:clamp(6px, calc(var(--book-thickness) * .28px), 8px);letter-spacing:.06em;color:#c9a36ae6;text-shadow:0 1px 1px #0000004d;flex-shrink:0;font-style:italic;transform:rotate(180deg)}.bookshelf-book-cover{width:calc(var(--book-height) * .62);transform-origin:0;background:var(--spine-color);height:100%;position:absolute;top:0;left:100%;overflow:hidden;transform:rotateY(88deg);box-shadow:2px 0 6px #0000004d}.bookshelf-book-cover img{object-fit:cover;width:100%;height:100%;display:block}.bookshelf-book-pages{width:var(--book-thickness);transform-origin:top;background:linear-gradient(#f5f0e6 0%,#e8e0d0 30%,#d8cfc0 100%);height:6px;position:absolute;top:0;left:0;transform:rotateX(90deg)translateZ(0);box-shadow:0 1px 2px #0003}.bookshelf-book-top{width:var(--book-thickness);height:calc(var(--book-height) * .62);transform-origin:bottom;opacity:.85;background:linear-gradient(90deg,#ebe4d6 0%,#f7f2e8 50%,#ebe4d6 100%);position:absolute;bottom:100%;left:0;transform:rotateX(90deg)}.bookshelf-plank{background:linear-gradient(180deg, var(--wood-light) 0%, var(--wood-mid) 40%, var(--wood-dark) 100%);height:14px;box-shadow:0 3px 0 var(--wood-shadow), 0 6px 12px #00000040, inset 0 2px 0 #fff3;margin:0 8px;position:relative}.bookshelf-plank:before{content:"";background:repeating-linear-gradient(90deg,#0000,#0000 3px,#0000000a 3px 4px);position:absolute;inset:0}.bookshelf-plank-face{background:linear-gradient(180deg, var(--wood-mid), var(--wood-dark));height:10px;box-shadow:inset 0 -2px 4px #0000004d}.bookshelf-caption{text-align:center;margin-top:12px}@media (prefers-reduced-motion:reduce){.bookshelf-book-body{transition:none}.bookshelf-book:hover .bookshelf-book-body,.bookshelf-book:focus-visible .bookshelf-book-body,.bookshelf-book--active .bookshelf-book-body{transform:translateY(-6px)}}.dark .bookshelf-frame{box-shadow:inset 0 2px 4px #ffffff14,inset 0 -3px 6px #00000059,0 12px 32px #0006}.dark .bookshelf-preview{background:var(--paper)}
.vinyl-station{border:2px solid var(--ink);box-shadow:8px 8px 0 var(--line-dark);background:var(--paper);grid-template-columns:minmax(280px,360px) 1fr;min-height:540px;display:grid}@media (max-width:768px){.vinyl-station{grid-template-columns:1fr;min-height:auto}}.turntable-side{border-right:2px solid var(--ink);background:linear-gradient(160deg,#3d2b1f 0%,#2a1d14 40%,#1f1610 100%);padding:1.25rem}@media (max-width:768px){.turntable-side{border-right:none;border-bottom:2px solid var(--ink)}}.turntable-plinth{background:linear-gradient(175deg,#6b4c35 0%,#4a3426 30%,#3a281c 100%);border-radius:6px;padding:1rem 1rem 1.25rem;position:relative;box-shadow:inset 0 1px #ffffff1f,inset 0 -2px 6px #00000059,0 4px 12px #0006}.turntable-plinth-grain{opacity:.18;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9 0.05' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");border-radius:6px;position:absolute;inset:0}.turntable-header{z-index:1;justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex;position:relative}.turntable-brand{font-family:var(--font-mono), monospace;letter-spacing:.22em;text-transform:uppercase;color:#ffffff73;font-size:9px}.turntable-power-led{background:#3a2a20;border-radius:50%;width:7px;height:7px;transition:background .3s,box-shadow .3s;box-shadow:inset 0 1px 2px #00000080}.turntable-power-led--on{background:#4ade80;box-shadow:0 0 8px #4ade80,0 0 2px #22c55e}.turntable-deck{z-index:1;background:linear-gradient(#1a1a1a 0%,#0d0d0d 100%);border-radius:4px;padding:1.25rem 1rem 1rem;position:relative;box-shadow:inset 0 2px 8px #0009}.turntable-platter-zone{aspect-ratio:1;width:min(100%,240px);margin:0 auto;position:relative}.turntable-platter-rim{background:linear-gradient(135deg,#c8c8c8 0%,#8a8a8a 40%,#b0b0b0 60%,#707070 100%);border-radius:50%;position:absolute;inset:-4%;box-shadow:0 2px 6px #00000080}.turntable-platter-base{background:conic-gradient(#aaa,#ddd,#999,#ccc,#888,#bbb,#aaa);border-radius:50%;position:absolute;inset:2%}.turntable-platter-mat{background:#111;border-radius:50%;position:absolute;inset:6%;box-shadow:inset 0 0 12px #000c}.turntable-vinyl{z-index:2;background:#0a0a0a;border-radius:50%;position:absolute;inset:8%;box-shadow:0 0 0 1px #ffffff0f,0 4px 12px #0009}.turntable-vinyl--spinning{animation:1.8s linear infinite turntable-spin}@keyframes turntable-spin{to{transform:rotate(360deg)}}.turntable-vinyl-grooves{background:repeating-radial-gradient(circle,#0000 0 1px,#ffffff08 1px 2px);border-radius:50%;position:absolute;inset:0}.turntable-vinyl-shine{pointer-events:none;background:linear-gradient(135deg,#ffffff14 0%,#0000 40% 60%,#ffffff0a 100%);border-radius:50%;position:absolute;inset:0}.turntable-label{aspect-ratio:1;z-index:1;border-radius:50%;width:44%;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000004d}.turntable-spindle{aspect-ratio:1;z-index:3;background:linear-gradient(145deg,#ddd 0%,#888 100%);border-radius:50%;width:12%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 1px 2px #00000080,inset 0 1px #fff6}.turntable-rpm-badge{font-family:var(--font-mono), monospace;letter-spacing:.08em;color:#ffffff40;z-index:4;pointer-events:none;font-size:7px;position:absolute;bottom:14%;left:50%;transform:translate(-50%)}.turntable-tonearm-mount{z-index:5;pointer-events:none;width:50%;height:50%;position:absolute;top:6%;right:4%}.turntable-pivot{z-index:2;background:linear-gradient(145deg,#bbb 0%,#666 100%);border-radius:50%;width:16px;height:16px;position:absolute;top:0;right:0;box-shadow:0 2px 4px #00000080}.turntable-tonearm{transform-origin:100% 0;width:100%;height:100%;transition:transform .7s cubic-bezier(.22,1,.36,1);position:absolute;top:6px;right:6px;transform:rotate(-32deg)}.turntable-tonearm--engaged{transform:rotate(8deg)}.turntable-tonearm-tube{transform-origin:100%;background:linear-gradient(90deg,#999 0%,#ccc 50%,#888 100%);border-radius:2px;width:72%;height:3px;position:absolute;top:0;right:0;box-shadow:0 1px 2px #0006}.turntable-counterweight{background:linear-gradient(#555 0%,#333 100%);border-radius:2px;width:14px;height:10px;position:absolute;top:-4px;right:68%;box-shadow:0 1px 2px #00000080}.turntable-headshell{background:#1a1a1a;border-radius:1px 1px 3px 3px;width:12px;height:18px;position:absolute;top:-3px;left:0;box-shadow:0 1px 3px #0009}.turntable-stylus{background:#c9a227;border-radius:0 0 1px 1px;width:2px;height:5px;position:absolute;bottom:-3px;left:50%;transform:translate(-50%)}.turntable-transport{z-index:1;justify-content:center;align-items:center;gap:1.25rem;margin-top:1rem;display:flex;position:relative}.turntable-transport-btn{color:#ffffff80;cursor:pointer;background:0 0;border:none;padding:.25rem .5rem;font-size:1.1rem;line-height:1;transition:color .2s}.turntable-transport-btn:hover{color:#ffffffe6}.turntable-start-btn{cursor:pointer;background:linear-gradient(#444 0%,#222 100%);border:2px solid #ffffff40;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:border-color .2s;display:flex;box-shadow:0 2px 6px #0006}.turntable-start-btn:hover{border-color:#ffffff80}.turntable-start-cap{background:linear-gradient(145deg,#e8e8e8 0%,#999 100%);border-radius:50%;width:14px;height:14px;transition:transform .15s;box-shadow:inset 0 1px #ffffff80}.turntable-start-cap--pressed{background:linear-gradient(145deg,#4ade80 0%,#22c55e 100%);transform:scale(.88)}.turntable-progress{z-index:1;background:#ffffff1a;border-radius:1px;height:2px;margin-top:.85rem;position:relative;overflow:hidden}.turntable-progress-fill{background:linear-gradient(90deg,#c9a227,#e8d48b);height:100%;transition:width .1s linear}.turntable-now-playing{z-index:1;margin-top:.85rem;position:relative}.turntable-now-playing-label{font-family:var(--font-mono), monospace;letter-spacing:.16em;text-transform:uppercase;color:#fff6;font-size:8px}.turntable-now-playing-title{font-family:var(--font-display), serif;color:#ffffffeb;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:.25rem;font-size:1.05rem;line-height:1.2;display:-webkit-box;overflow:hidden}.turntable-now-playing-artist{font-family:var(--font-body), serif;color:#ffffff80;-webkit-line-clamp:1;-webkit-box-orient:vertical;margin-top:.15rem;font-size:.75rem;display:-webkit-box;overflow:hidden}.album-wall{flex-direction:column;min-height:540px;display:flex;position:relative;overflow:hidden}.album-wall-texture{pointer-events:none;background:linear-gradient(#00000008 0%,#0000 30%),#c9b99a;position:absolute;inset:0}.dark .album-wall-texture{background:linear-gradient(#00000026 0%,#0000 30%),#2a241c}.album-wall-texture:after{content:"";opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}.album-wall-header{z-index:1;border-bottom:1px solid #00000014;justify-content:space-between;align-items:baseline;padding:1rem 1.25rem .5rem;display:flex;position:relative}.dark .album-wall-header{border-bottom-color:#ffffff14}.album-wall-title{font-family:var(--font-mono), monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);font-size:10px}.album-wall-count{font-family:var(--font-mono), monospace;letter-spacing:.12em;color:var(--muted);font-size:9px}.album-wall-grid{z-index:1;scrollbar-width:thin;scrollbar-color:var(--line-dark) transparent;flex:1;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));align-content:start;gap:.75rem;padding:1rem 1.25rem 1.25rem;display:grid;position:relative;overflow-y:auto}.album-wall-sleeve{cursor:pointer;transform:rotate(var(--sleeve-rot,0deg));background:0 0;border:none;flex-direction:column;align-items:center;gap:.35rem;padding:0;transition:transform .25s,filter .25s;display:flex}.album-wall-sleeve:hover{z-index:2;transform:rotate(0)translateY(-4px)scale(1.06)}.album-wall-sleeve--active{z-index:3;transform:rotate(0)translateY(-6px)scale(1.08)}.album-wall-sleeve-inner{aspect-ratio:1;border:1px solid #00000026;border-radius:2px;width:100%;transition:box-shadow .25s,border-color .25s;position:relative;overflow:hidden;box-shadow:2px 3px #0003,4px 6px 12px #00000026}.album-wall-sleeve:hover .album-wall-sleeve-inner,.album-wall-sleeve--active .album-wall-sleeve-inner{border-color:var(--accent);box-shadow:3px 4px #00000040,6px 10px 20px #0003}.album-wall-sleeve--active .album-wall-sleeve-inner{outline:2px solid var(--accent);outline-offset:2px}.album-wall-sleeve-gloss{pointer-events:none;background:linear-gradient(135deg,#fff3 0%,#0000 50%);position:absolute;inset:0}.album-wall-sleeve-title{font-family:var(--font-mono), monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);text-align:center;-webkit-line-clamp:2;opacity:0;-webkit-box-orient:vertical;max-width:100%;font-size:7px;line-height:1.3;transition:opacity .2s;display:-webkit-box;overflow:hidden}.album-wall-sleeve:hover .album-wall-sleeve-title,.album-wall-sleeve--active .album-wall-sleeve-title{opacity:1}@media (prefers-reduced-motion:reduce){.turntable-vinyl--spinning{animation:none}.album-wall-sleeve:hover,.album-wall-sleeve--active{transform:none}}