.book3d{--w:170px;--t:30px;perspective:900px;width:var(--w);display:block}.book3d-inner{width:var(--w);aspect-ratio:2/3;transform-style:preserve-3d;transition:transform var(--dur-slow) var(--ease-out);display:block;position:relative;transform:rotateY(-28deg)}.book3d:hover .book3d-inner,.book3d:focus-visible .book3d-inner{transform:rotateY(-8deg)}.book3d-front{transform:translateZ(calc(var(--t) / 2));background:#1c2230;border-radius:2px 5px 5px 2px;display:block;position:absolute;inset:0;overflow:hidden;box-shadow:6px 8px 22px #14161b47}.book3d-front img{object-fit:cover}.book3d-inner:before{content:"";width:calc(var(--t) - 2px);transform:translateX(calc(var(--w) - var(--t) / 2 - 2px)) rotateY(90deg);background:repeating-linear-gradient(90deg,#fff 0 2px,#e4dfd3 2px 3px);position:absolute;top:3px;bottom:3px;left:0}.book3d-inner:after{content:"";transform:translateZ(calc(var(--t) / -2));background:#14161b;border-radius:2px 5px 5px 2px;position:absolute;inset:0}.book3d-blank{text-align:left;color:#fff;background:linear-gradient(160deg,#2a3142,#0d1016);flex-direction:column;justify-content:space-between;padding:16px;display:flex;position:absolute;inset:0}.book3d-blank b{font-family:var(--font-display);font-size:16px;font-weight:700;line-height:1.2}.book3d-blank i{font-style:normal;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:#ffffff8c;font-size:10px}