.bookshelf{--ink:#1a1208;color:#2a2620;background:repeating-linear-gradient(#0000 0 37px,#78a0cd47 37px 38px),#fffdf5;padding:30px 0 80px;position:relative;overflow:hidden}.bookshelf__shelf{z-index:1;max-width:1240px;margin:0 auto;padding:0 24px;position:relative}.bookshelf__shelf+.bookshelf__shelf{margin-top:60px}.bookshelf .bookshelf__heading{font-family:var(--font-display), sans-serif;text-transform:uppercase;color:var(--ink);flex-direction:column;gap:2px;margin:0 0 18px;font-size:clamp(1.8rem,3.2vw,2.6rem);font-weight:400;line-height:1;display:flex}.bookshelf__heading span{font-family:var(--font-nav), sans-serif;letter-spacing:.08em;color:#e2402f;font-size:1rem;font-weight:700}.bookshelf__shelf--house .bookshelf__heading{color:#4a2380}.bookshelf__shelf--house .bookshelf__heading span{color:#8a3fd1}.bookshelf__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 34px;margin:0;padding:0;list-style:none;display:grid}.bookshelf__link{color:var(--ink);flex-direction:column;display:flex}.bookshelf__num{font-family:var(--font-display), sans-serif;letter-spacing:-.01em;margin-top:6px;font-size:clamp(2.6rem,4vw,3.6rem);line-height:.9}.bookshelf__title{font-family:var(--font-body), sans-serif;color:var(--ink);margin-top:6px;font-size:1.22rem;font-weight:900;line-height:1.2}.bookshelf__meta{color:#5a5148;flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px;font-size:.92rem;font-weight:800;display:flex}.bookshelf__meta em{border:2px solid var(--ink);color:var(--ink);text-transform:uppercase;background:#ffe874;border-radius:99px;padding:1px 8px;font-size:.75rem;font-style:normal}.bookshelf__meta em.is-sample{background:#eee}.book3d{perspective:1300px;padding:2% 5% 8% 14%;display:block;position:relative;container-type:inline-size}.book3d__inner{--d:15cqw;aspect-ratio:.775;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.2,.8,.2,1);display:block;position:relative;transform:rotateY(34deg)}.bookshelf__link:hover .book3d__inner,.bookshelf__link:focus-visible .book3d__inner{transform:rotateY(22deg)translateY(-6px)}.book3d__front,.book3d__spine,.book3d__back{backface-visibility:hidden;position:absolute;top:0;bottom:0}.book3d__front{transform:translateZ(calc(var(--d) / 2));background:#fff;border-radius:2px 7px 7px 2px;left:0;right:0;overflow:hidden}.book3d__front img{object-fit:cover}.book3d__front:after{content:"";pointer-events:none;background:linear-gradient(90deg,#00000047 0 1.5%,#ffffff59 2.5%,#0000001f 4.5%,#0000 9%),linear-gradient(115deg,#ffffff38,#0000 38%);position:absolute;inset:0}.book3d__spine{width:var(--d);transform-origin:50%;filter:brightness(.7)saturate(1.15);background:#3d7fd6 100% 0/auto 100% no-repeat;border-radius:3px 0 0 3px;left:0;overflow:hidden;transform:translate(-50%)rotateY(-90deg)}.book3d__spine:after{content:"";background:linear-gradient(90deg,#00000059,#ffffff2e 45%,#0000004d);position:absolute;inset:0}.book3d__spine-title{z-index:1;text-align:center;white-space:nowrap;text-overflow:ellipsis;width:92cqw;font-family:var(--font-display), sans-serif;text-transform:uppercase;color:#fff;text-shadow:0 1px 2px #000000b3;font-size:7cqw;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)rotate(90deg)}.book3d__shadow{z-index:-1;filter:blur(5px);background:radial-gradient(at 45%,#1a12086b,#0000 70%);border-radius:50%;height:9%;position:absolute;bottom:3%;left:18%;right:0}.book3d__blank{text-align:center;color:#fff;background:linear-gradient(160deg,#43b9c3,#1c7fa3);flex-direction:column;justify-content:center;gap:10px;padding:14%;display:flex;position:absolute;inset:0}.book3d__blank b{font-family:var(--font-display), sans-serif;text-transform:uppercase;text-shadow:0 3px #00000059;font-size:11cqw;font-weight:400;line-height:1.05}.book3d__blank small{opacity:.85;font-size:5.5cqw;font-weight:800}.book3d--house .book3d__blank{background:radial-gradient(circle at 50% 30%,#6a45a0,#1b1229 78%)}.book3d--house .book3d__blank b{font-family:var(--font-goth), cursive;color:#9be564}.book3d--house .book3d__spine{background-color:#4a2380}.pdp .pdp__media.pdp__media--book3d{aspect-ratio:auto;box-shadow:none;background:0 0;border-radius:0;overflow:visible}.pdp--book .pdp__gallery--book:has(.pdp__media--book3d){max-width:470px}.book3d--lg{perspective:1900px;padding:3% 12% 10%}.book3d--lg .book3d__inner{--d:13cqw;transition:transform .9s cubic-bezier(.3,.7,.2,1);transform:rotateY(26deg)}.book3d--lg:hover .book3d__inner{transform:rotateY(18deg)translateY(-5px)}.book3d--lg.is-turned .book3d__inner{transform:rotateY(154deg)}.book3d--lg.is-turned:hover .book3d__inner{transform:rotateY(162deg)translateY(-5px)}.book3d--lg .book3d__spine-title{font-size:6cqw}.book3d--lg .book3d__shadow{height:8%;bottom:4%;left:9%;right:9%}.book3d__back{transform:rotateY(180deg) translateZ(calc(var(--d) / 2));background:#fff;border-radius:7px 2px 2px 7px;left:0;right:0;overflow:hidden}.book3d__back img{object-fit:cover}.book3d__back:after{content:"";pointer-events:none;background:linear-gradient(270deg,#00000047 0 1.5%,#ffffff59 2.5%,#0000001f 4.5%,#0000 9%),linear-gradient(245deg,#ffffff38,#0000 38%);position:absolute;inset:0}[data-world=house] .book3d--lg .book3d__shadow{background:radial-gradient(#000000d9,#0000 70%)}.bookshelf__doodle{z-index:0;pointer-events:none;height:auto;animation:10s ease-in-out infinite alternate bookshelf-drift;position:absolute}.bookshelf__doodle--gull{width:70px;top:20px;right:6%}.bookshelf__doodle--crown{width:56px;animation-delay:-4s;top:46%;left:3%}.bookshelf__doodle--bat{width:74px;animation-delay:-7s;bottom:120px;right:4%}@keyframes bookshelf-drift{to{transform:translate(22px,-10px)rotate(5deg)}}@media (prefers-reduced-motion:reduce){.bookshelf__doodle{animation:none}.book3d__inner{transition:none}}@media (max-width:1100px){.bookshelf__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:760px){.bookshelf{padding:20px 0 60px}.bookshelf__shelf{padding:0 16px}.bookshelf__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px}.bookshelf__title{font-size:1.02rem}.bookshelf__doodle{display:none}}.bookshelf__grid--night .bookshelf__title{color:#efe6ff}.bookshelf__grid--night .bookshelf__meta{color:#b9aed0}.bookshelf__grid--night .book3d__shadow{background:radial-gradient(at 45%,#000000bf,#0000 70%)}
