/* Keep the whole preview and its controls inside the space below the header. */
.book-product{--product-header-height:88px;--gallery-preview-height:330px}
.book-product .product-visuals{top:calc(var(--product-header-height) + 16px);max-width:100%}
.book-product .gallery-cover{min-height:0;padding:18px 18px 16px}
.book-product .gallery-zoom{padding:0;gap:12px;min-width:0}
.book-product .gallery-zoom>.book-cover{height:var(--gallery-preview-height);width:auto;max-width:100%;object-fit:contain;flex:none}
.book-product .gallery-zoom>.typography-cover{width:220px}
.book-product .digital-preview-frame{height:var(--gallery-preview-height);width:220px;max-width:100%}
.book-product .zoom-label{max-width:100%;text-align:center;justify-content:center;line-height:1.5}
.book-product .gallery-thumbnails{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-width:0;max-width:100%;padding:12px 2px 2px;overflow:visible}
.book-product .gallery-thumbnail{width:100%;min-width:0;min-height:104px;padding:8px 5px;gap:7px}
.book-product .gallery-thumbnail[aria-pressed="true"]{padding:7px 4px}
.book-product .gallery-thumbnail>span:last-child{font-size:var(--site-font-s14,.875rem);line-height:1.25;overflow-wrap:anywhere}
.book-product .gallery-thumbnail>.book-cover,.book-product .gallery-thumbnail>img{width:34px;height:51px;object-fit:contain}
.book-product .gallery-thumbnail>svg{width:28px;height:51px}
.book-product .product-visuals.gallery-in-flow{position:static}
@media(min-width:681px){
  .book-product{--gallery-preview-height:clamp(140px,calc(100dvh - var(--product-header-height) - 16rem),330px)}
}
/* A short window or enlarged text can use the ordinary page scroll. */
@media(max-height:520px){.book-product .product-visuals{position:static}}
@media(max-width:680px){
  .book-product .product-visuals{position:static}
  .book-product .gallery-thumbnails{gap:10px}
}

/* Serba images retain their own proportions instead of a portrait book frame. */
.book-product .digital-product-gallery .gallery-zoom>.digital-preview-frame{width:100%;height:auto;background:transparent}
.book-product .digital-product-gallery .digital-preview-frame>.book-cover{width:100%;height:auto;max-width:100%;object-fit:contain}