/* Parts of the shelf that belong to the data-driven layout: page change, pager and the page-in fade. */
.case.page-in{animation:shelf-in .28s ease-out}
@keyframes shelf-in{from{opacity:.55}to{opacity:1}}
.shelf-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;margin:22px 0 0}
.shelf-pager button{min-height:44px;padding:0 18px;border:1px solid #111;border-radius:999px;background:transparent;color:#111;font:600 11px/1 'DM Sans',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;touch-action:manipulation;transition:background-color .18s,border-color .18s}
.shelf-pager button:disabled{opacity:.38;cursor:default}
.shelf-pager button.browse{border-color:transparent;text-decoration:underline;text-decoration-color:var(--cobalt);text-decoration-thickness:2px;text-underline-offset:5px}
@media(hover:hover){.shelf-pager button:not(:disabled):hover{background:rgba(var(--cobalt-rgb),.1);border-color:var(--cobalt)}}
.shelf-pager button:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}
.shelf-status{min-width:9ch;text-align:center;font:600 11px/1 'DM Sans',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.case.page-in{animation:none}.shelf-pager button{transition:none}}

/* Preview frame inside the owner area: only the shelf is shown, nothing else on the page. */
html.shelf-preview body>header,html.shelf-preview body>footer,html.shelf-preview .skip-link,html.shelf-preview main>section:not(#collection),html.shelf-preview .hero-flyer,html.shelf-preview #purchase-note{display:none!important}
html.shelf-preview,html.shelf-preview body{overflow:hidden;min-height:0}

/* Reader for a book made in the owner area: its own cover shape (--r is width over height), never stretched. */
.reading-book.own-cover{height:400px;width:calc(400px * var(--r,.7048))}
.reading-book.own-cover.open{transform:translateX(125px)}
.cover-face.own-face{padding:0;background-color:var(--book);background-repeat:no-repeat}
.cover-face.own-face:after{display:none}
.cover-face.own-face h3{padding:0 18px;text-align:center}
@media(max-width:700px){.reading-book.own-cover{height:min(400px,56dvh);width:auto;aspect-ratio:var(--r,.7048)}.reading-book.own-cover.open{transform:translateX(0)}}
#buy-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:10px 0 0}
#buy-links:empty{display:none}
#buy-links .buy-link{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid currentColor;border-radius:999px;color:inherit;text-decoration:none;font-family:inherit;font-size:14px;font-weight:600;line-height:1.2}
#buy-links .buy-link:hover{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
#buy-links .buy-link:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}