/* Books: each book stands as a bound object, turned, and comes to face the reader. */
.shelf{display:grid;gap:clamp(64px,9vw,140px);max-width:var(--max)}
.shelf-book{display:grid;grid-template-columns:minmax(220px,4fr) minmax(0,7fr);gap:clamp(32px,7vw,110px);align-items:center}
.shelf-book:nth-child(even) .tome{order:2}
.shelf-copy{display:grid;gap:20px;max-width:var(--measure)}
.shelf-copy h2{font-size:var(--s-h2)}
.shelf-copy h2 a{text-decoration:none}
.shelf-desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:9;overflow:hidden}
.shelf-acts{display:flex;flex-wrap:wrap;gap:8px}
.price{font-size:var(--s-h3);font-variant-numeric:lining-nums tabular-nums;color:var(--accent)}
.price del{color:var(--muted);margin-inline-end:.5em}.price ins{text-decoration:none}

/* The bound book. A real box in 3D: no filter, opacity or overflow on the turning element, since any of them flattens it. */
.tome{display:block;width:100%;max-width:360px;justify-self:center}
.b3d{--w:min(100%,360px);display:block;position:relative;aspect-ratio:2/3;width:100%;max-width:360px;margin-inline:auto;perspective:1500px;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;text-decoration:none;container-type:inline-size}
.b3d:active{cursor:grabbing}
.b3d-shelf{cursor:pointer}
.b3d::after{content:"";position:absolute;inset:auto 8% -5% 8%;height:7%;background:radial-gradient(closest-side,rgba(8,20,17,.32),transparent);pointer-events:none;transform:translateZ(-140px)}
.b3d-body{--ry:24deg;--rx:4deg;--d:10.1cqw;position:absolute;inset:0;display:block;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry))}
.b3d-glide{transition:transform .8s var(--ease-out)}
.b3d-body>*{position:absolute;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.b3d-front,.b3d-back{inset:0;width:100%;height:100%;object-fit:cover}
.b3d-front{transform:translateZ(calc(var(--d)/2));border-radius:1px 3px 3px 1px}
.b3d-back{transform:rotateY(180deg) translateZ(calc(var(--d)/2));border-radius:1px 3px 3px 1px}
.b3d-spine{top:0;left:50%;width:var(--d);height:100%;margin-left:calc(var(--d)/-2);object-fit:cover;transform:rotateY(-90deg) translateZ(50cqw)}
.b3d-plain{background:var(--accent,#0a2d4d)}
.b3d-edge{background:repeating-linear-gradient(0deg,#f5f1e4 0 1px,#dcd6c4 1px 2px)}
.b3d-edge-r{top:.6%;left:50%;width:calc(var(--d) - 2px);height:98.8%;margin-left:calc((var(--d) - 2px)/-2);transform:rotateY(90deg) translateZ(calc(50cqw - 2px))}
.b3d-edge-t,.b3d-edge-b{left:0;width:calc(100% - 3px);height:calc(var(--d) - 2px);top:50%;margin-top:calc((var(--d) - 2px)/-2);background:repeating-linear-gradient(90deg,#f5f1e4 0 1px,#dcd6c4 1px 2px)}
.b3d-edge-t{transform:rotateX(90deg) translateZ(75cqw)}
.b3d-edge-b{transform:rotateX(-90deg) translateZ(75cqw)}
.b3d:focus-visible{outline:2px solid var(--accent);outline-offset:8px}
@media (hover:hover) and (pointer:fine){.b3d-shelf:hover .b3d-body{--ry:8deg;--rx:2deg}}
.b3d-shelf .b3d-body{transition:transform .8s var(--ease-out)}
.tome-page{display:grid;gap:12px;justify-items:center}
.tome-flip{margin-top:28px}
.tome-hint{margin:0;color:var(--muted);font-size:var(--s-small)}

/* The chooser of region */
.region{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 clamp(24px,4vw,48px)}
.region label{color:var(--muted);font-size:var(--s-small)}
.region select{min-height:44px;padding:0 12px;background:var(--surface);color:inherit;border:1px solid var(--line,currentColor);border-radius:2px;font:inherit}
.region-note{flex-basis:100%;margin:0;color:var(--muted);font-size:var(--s-small)}
.book-copy .region{margin-bottom:0}

/* one book */
.book-page{display:grid;grid-template-columns:minmax(240px,5fr) minmax(0,7fr);gap:clamp(32px,7vw,110px);align-items:start;max-width:var(--max);margin-inline:auto;padding:clamp(32px,6vw,88px) var(--gutter) var(--sec)}
.book-page>.woocommerce-notices-wrapper{grid-column:1/-1}
.book-art{position:sticky;top:calc(var(--bar-h) + 40px)}
.book-copy{display:grid;gap:22px;min-width:0}
.book-buy form.cart{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.book-buy .quantity input{width:72px;height:48px;padding:0 10px;background:var(--surface);border:0}
.book-buy .single_add_to_cart_button{min-height:48px;padding:0 26px;background:var(--accent);color:var(--accent-ink);font-size:var(--s-small);font-weight:600}
.book-buy .stock{color:var(--muted);font-size:var(--s-small)}

/* notices, and the store's cart and checkout blocks in the theme's colours */
.woocommerce-message,.woocommerce-error,.woocommerce-info,.wc-block-components-notice-banner{list-style:none;margin:0 0 16px;padding:14px 18px;background:var(--surface);color:var(--ink);border:0;border-radius:0}
.wc-block-cart,.wc-block-checkout{font-family:var(--f-text);color:var(--ink)}
.wc-block-components-button:not(.is-link),.wc-block-cart__submit-button,.wc-block-components-checkout-place-order-button{background:var(--accent)!important;color:var(--accent-ink)!important;border:0!important;border-radius:0!important;min-height:48px;text-decoration:none}
.wc-block-components-text-input input,.wc-block-components-combobox input,.wc-blocks-components-select select,.wc-block-components-textarea{border-radius:0!important;background:var(--plate)!important;color:var(--ink)!important}
.wc-block-components-panel,.wc-block-components-totals-wrapper,.wc-block-components-order-summary{border-color:var(--surface-2)!important}
.wc-block-components-product-name{color:var(--ink)}

/* the home page's shelf */
.home-books{padding:var(--sec) var(--gutter) 0;max-width:var(--max);margin-inline:auto}

/* the cart link */
.cart-link{position:relative;text-decoration:none}
.cart-n{font-size:.8125rem;font-variant-numeric:tabular-nums}

@media (max-width:760px){
  .shelf-book,.book-page{grid-template-columns:minmax(0,1fr)}
  .shelf-book:nth-child(even) .tome{order:0}
  .tome,.b3d{max-width:min(68vw,300px)}
  .book-art{position:static}
}
