.bookshelf-patterns{--spine-pyramid:linear-gradient(315deg,transparent 75%,rgba(255,255,255,0.1) 0),linear-gradient(45deg,transparent 75%,rgba(255,255,255,0.1) 0),linear-gradient(135deg,rgba(255,255,255,0.2) 166px,transparent 0),linear-gradient(45deg,rgba(0,0,0,0.1) 75%,transparent 0);--spine-pyramid-size:20px 20px;--spine-stairs:repeating-linear-gradient(63deg,rgba(255,255,255,0.1),rgba(255,255,255,0.1) 1px,transparent 3px,transparent 0),linear-gradient(127deg,rgba(255,255,255,0.1),rgba(255,255,255,0.1) 90px,transparent 55%,transparent 0),linear-gradient(transparent 51%,rgba(0,0,0,0.1) 170px);--spine-stairs-size:70px 120px;--spine-argyle:repeating-linear-gradient(120deg,rgba(255,255,255,0.1),rgba(255,255,255,0.1) 1px,transparent 0,transparent 60px),repeating-linear-gradient(60deg,rgba(255,255,255,0.1),rgba(255,255,255,0.1) 1px,transparent 0,transparent 60px),linear-gradient(60deg,rgba(0,0,0,0.1) 25%,transparent 0,transparent 75%,rgba(0,0,0,0.1) 0,rgba(0,0,0,0.1)),linear-gradient(120deg,rgba(0,0,0,0.1) 25%,transparent 0,transparent 75%,rgba(0,0,0,0.1) 0,rgba(0,0,0,0.1));--spine-argyle-size:70px 120px;--spine-tartan:repeating-linear-gradient(transparent,transparent 50px,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.4) 53px,transparent 0,transparent 63px,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.4) 66px,transparent 0,transparent 116px,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.5) 166px,rgba(255,255,255,0.2) 0,rgba(255,255,255,0.2) 169px,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.5) 179px,rgba(255,255,255,0.2) 0,rgba(255,255,255,0.2) 182px,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.5) 232px,transparent 0),repeating-linear-gradient(270deg,transparent,transparent 50px,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.4) 53px,transparent 0,transparent 63px,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.4) 66px,transparent 0,transparent 116px,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.5) 166px,rgba(255,255,255,0.2) 0,rgba(255,255,255,0.2) 169px,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.5) 179px,rgba(255,255,255,0.2) 0,rgba(255,255,255,0.2) 182px,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.5) 232px,transparent 0),repeating-linear-gradient(125deg,transparent,transparent 2px,rgba(0,0,0,0.2) 0,rgba(0,0,0,0.2) 3px,transparent 0,transparent 5px,rgba(0,0,0,0.2) 0);--spine-tartan-size:232px 232px}.bookshelf{width:100%;display:flex;flex-wrap:wrap;align-items:flex-end;perspective:1200px;padding:0 4px}.book{width:50px;height:280px;position:relative;margin-left:1px;transform-style:preserve-3d;transform:translateZ(0) rotateY(0);transition:transform .6s cubic-bezier(.23,1,.32,1);cursor:pointer}.book-side{position:absolute;border:1.5px solid rgba(0,0,0,.15);border-radius:2px;font-weight:700;text-align:center;transform-origin:center left}:is(.dark) .book-side{border-color:rgba(255,255,255,.08)}.book-spine{position:relative;width:50px;height:280px;transform:rotateY(0deg) translateZ(0)}.book-spine-title{margin:6px 4px;top:0;left:0;font-size:11px;font-weight:600;color:rgba(255,255,255,.9);writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:.02em;line-height:1.2;max-height:calc(100% - 30px);overflow:hidden}.book-spine-author,.book-spine-title{position:absolute;text-shadow:0 1px 2px rgba(0,0,0,.3)}.book-spine-author{font-size:8px;font-weight:500;color:rgba(255,255,255,.65);bottom:6px;left:50%;transform:translateX(-50%);white-space:nowrap}.book-top{width:50px;height:190px;top:-2px;background-image:linear-gradient(90deg,hsl(0 0% 92%) 90%,hsl(0 0% 80%) 0);background-size:5px 5px;transform:rotateX(90deg) translateZ(95px) translateY(-95px)}:is(.dark) .book-top{background-image:linear-gradient(90deg,hsl(0 0% 20%) 90%,hsl(0 0% 12%) 0)}.book-cover{width:190px;height:280px;top:0;background-color:hsl(0 0% 85%);background-size:cover;background-position:50%;background-repeat:no-repeat;left:50px;transform:rotateY(90deg) translateZ(0);transition:transform .6s cubic-bezier(.23,1,.32,1)}:is(.dark) .book-cover{background-color:hsl(0 0% 18%)}.book:hover{z-index:1;transform:rotateX(-25deg) rotateY(-40deg) rotate(-15deg) translateY(50px) translateX(-30px)}.shelf-row{width:100%;display:flex;flex-wrap:wrap;align-items:flex-end;perspective:1200px;padding-bottom:12px;margin-bottom:8px;border-bottom:3px solid hsl(var(--border));box-shadow:0 2px 4px -1px rgba(0,0,0,.06)}