/* The theme books, 2026-10-19u: the Custom hub (custom.html, .th) and the eighteen book pages (theme/<slug>.html, .tp).
   White pages (owner, 2026-10-19: no cream backgrounds), mobile first, the type of the Five Books of Moses and New Testament
   pages: Instrument Serif headings, Schibsted Grotesk text, EB Garamond for Scripture (/assets/torah-books/fonts/fonts.css,
   /assets/nt-books-20261020/fonts/fonts.css). The free-shipping stamp is the shared /css/free-shipping-20261019.css; only its
   spacing is set here. Every image has its size, so nothing moves as it arrives. Motion is transform and opacity only, and
   none at all for prefers-reduced-motion. No hover state changes a book into a flat, darkened picture. */
body.tbk-page{margin:0;background:#fff;color:#161616;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.tbk{--fg:#161616;--muted:#5c5b57;--line:#e6e5e1;--chip:#d3d1cc;--accent:#7a2430;--wj:#9e1b26;--ok:#1f7a3f;
  --display:'Instrument Serif',Georgia,serif;--ui:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;--text:'EB Garamond',Garamond,Georgia,serif;
  background:#fff;color:var(--fg);font-family:var(--ui);font-size:15px;line-height:1.55}
.tk-dialog:not([open]){display:none}
.tbk *,.tbk *::before,.tbk *::after{box-sizing:border-box}
.tbk :where(p,blockquote,figure,dl,dd,h1,h2,h3){margin:0}
.tbk :where(ul,ol){margin:0;padding:0;list-style:none}
.tbk :where(h1,h2,h3){font-family:var(--display);font-weight:400;color:var(--fg);letter-spacing:0}
.tbk a{color:inherit}
.tbk img{max-width:100%}
.tbk :focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.tbk [hidden]{display:none!important}
.tbk .wj{color:var(--wj)}
.tbk .lord{font-variant-caps:small-caps}
.tbk q{quotes:"“" "”"}
.tbk svg{flex:none}
.tbk .eu-guarantee-notice{width:100%;margin:48px 0 0;background:#fff;border-color:var(--line)}

/* shared pieces */
.tp-kicker,.th-kicker{display:block;font:600 11.5px/1.4 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.tp-mini{font-size:12.5px;color:var(--muted)}
.tp-btn,.th-btn{appearance:none;-webkit-appearance:none;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;margin:0;padding:12px 24px;border:1px solid var(--fg);border-radius:999px;background:var(--fg);color:#fff;font:600 15px/1.1 var(--ui);text-decoration:none;text-align:center;transition:background-color .2s ease,border-color .2s ease,color .2s ease,opacity .2s ease;-webkit-tap-highlight-color:transparent}
.tbk a.tp-btn,.tbk a.th-btn{color:#fff}
.tp-btn.ghost,.th-btn.ghost,.tbk a.th-btn.ghost{background:#fff;color:var(--fg)}
@media (hover:hover){.tp-btn:hover:not(:disabled),.th-btn:hover{background:#3a3a38;border-color:#3a3a38;color:#fff}.tp-btn.ghost:hover:not(:disabled),.th-btn.ghost:hover,.tbk a.th-btn.ghost:hover{background:#f2f2f0;color:var(--fg);border-color:var(--fg)}}
.tp-btn:disabled{cursor:default;opacity:.4}
.tp-btn svg,.th-btn svg{width:18px;height:18px}

/* ======================================================================================================================
   THE BOOK PAGE (theme/<slug>.html)
   ====================================================================================================================== */
.tp{padding-bottom:88px}
.tp-wrap{max-width:1160px;margin:0 auto;padding:0 max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))}
.tp-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:0 2px;font-size:13px;color:var(--muted)}
.tp-crumbs li{display:flex;align-items:center}
.tp-crumbs li+li::before{content:"/";padding:0 8px;color:#a9a7a1}
.tp-crumbs a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.tp-crumbs a:hover{text-decoration:underline;text-underline-offset:3px}
.tp-crumbs [aria-current]{color:var(--fg)}

.tp-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
/* the book: a casewrap drawn from its front cover, at rest at an angle; on a desktop it follows the pointer a few degrees,
   eased, and settles back. It never flattens or darkens on hover. */
.tp-media{position:relative;display:grid;justify-items:center;padding:4px 0 0;isolation:isolate}
.tp-media::before{content:"";position:absolute;z-index:-1;left:50%;top:46%;width:min(96%,440px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 13%,transparent) 0%,color-mix(in srgb,var(--c) 6%,transparent) 55%,transparent 100%);pointer-events:none}
.tp-book{appearance:none;-webkit-appearance:none;display:block;margin:0;padding:12px 24px 26px;border:0;background:none;cursor:pointer;perspective:1500px;-webkit-tap-highlight-color:transparent;position:relative}
div.tp-book{cursor:default}
.tp-book::after{content:"";position:absolute;left:22%;right:10%;bottom:18px;height:22px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.26),rgba(0,0,0,0));filter:blur(3px);z-index:-1}
.tb3{--w:clamp(136px,37vw,200px);--d:calc(var(--w) * .045);position:relative;display:block;width:var(--w);aspect-ratio:2/3;transform-style:preserve-3d;
  transform:rotateY(calc(22deg + var(--ty,0deg))) rotateX(calc(3deg + var(--tx,0deg)))}
.tb3>span{position:absolute;top:0;display:block;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.tb3-front{inset:0;transform:translateZ(calc(var(--d) / 2));border-radius:1px 3px 3px 1px;overflow:hidden;box-shadow:0 1px 1px rgba(0,0,0,.2),14px 22px 36px -14px rgba(0,0,0,.42)}
.tb3-front img{display:block;width:100%;height:100%;object-fit:cover}
.tb3-front::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,rgba(255,255,255,.18),rgba(255,255,255,0) 24%,rgba(0,0,0,0) 72%,rgba(0,0,0,.08))}
.tb3-front::before{content:"";position:absolute;z-index:1;left:4.5%;top:0;bottom:0;width:1.5px;background:rgba(0,0,0,.16);box-shadow:1px 0 0 rgba(255,255,255,.22)}
/* the spine of the casewrap: the paper colour, the book's colour at the head */
.tb3-spine{left:calc(var(--d) / -2);width:var(--d);height:100%;transform:rotateY(-90deg);background:linear-gradient(var(--c,#777) 0 9%,#e7e3da 9%);filter:brightness(.84)}
.tb3-edge{left:calc(var(--w) - var(--d) / 2);width:var(--d);height:96%;top:2%!important;transform:rotateY(90deg);background:repeating-linear-gradient(90deg,#fbfaf7 0 1px,#e9e6df 1px 2px)}
.tp-book:focus-visible{outline:2px solid var(--fg);outline-offset:-6px;border-radius:8px}
.tp-look-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 12px;margin-top:-6px}
.tp-look{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0;padding:10px 18px;border:1px solid var(--fg);border-radius:999px;background:#fff;color:var(--fg);font:600 14px/1 var(--ui);cursor:pointer;-webkit-tap-highlight-color:transparent}
.tp-look svg{width:18px;height:18px}
@media (hover:hover){.tp-look:hover{background:var(--fg);color:#fff}}
.tp-look-note{display:none;font-size:12.5px;color:var(--muted)}

.tp-info{padding-top:12px}
.tp-info h1{font-size:clamp(46px,13vw,80px);line-height:.95;margin:6px 0 14px;text-wrap:balance;overflow-wrap:break-word}
.tp-verse blockquote{font:italic 400 clamp(22px,6vw,30px)/1.18 var(--display);text-wrap:balance}
.tp-verse figcaption{margin-top:6px;font-size:12.5px;color:var(--muted)}
.tp-desc{margin-top:14px;font-size:16px;line-height:1.6;color:var(--muted);max-width:52ch}
.tp-facts{margin-top:10px;font-size:14px;color:var(--muted)}
.tp-facts strong{color:var(--fg);font-weight:600}

.tp-buy{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);scroll-margin-top:16px}
.tp-opt{margin:0 0 12px;padding:0;border:0;min-width:0}
.tp-opt legend{padding:0;margin-bottom:6px;font:600 11.5px/1.4 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tp-chips{display:flex;flex-wrap:wrap;gap:8px}
.tp-chips label{position:relative;display:inline-flex;cursor:pointer;-webkit-tap-highlight-color:transparent}
.tp-chips input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.tp-chips span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--chip);border-radius:999px;background:#fff;font:600 14px/1 var(--ui);color:var(--fg);transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.tp-chips input:checked+span{background:var(--fg);border-color:var(--fg);color:#fff}
.tp-chips input:focus-visible+span{outline:2px solid var(--fg);outline-offset:2px}
@media (hover:hover){.tp-chips label:hover input:not(:checked)+span{border-color:var(--fg)}}
.tp-optnote{margin:-2px 0 14px;font-size:12.5px;line-height:1.5;color:var(--muted);max-width:60ch}
.tp-pricebox{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin-bottom:14px}
.tp-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.tp-price strong{font:400 42px/1 var(--display);color:var(--fg);font-variant-numeric:lining-nums}
.tp-price span{font:600 11.5px/1.3 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tp-pricebox .ship-note{margin:0;flex-basis:100%}
.tp-actions{display:flex;gap:10px}
.tp-actions .tp-btn{min-height:54px;font-size:16px}
#tpBuy{flex:1 1 auto;min-width:150px}
#tpAdd{flex:0 1 auto}
.tp-status{margin-top:10px;font-weight:600;color:var(--accent)}
.tp-status:empty{display:none}
.tp-status a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-underline-offset:3px}
.tp-assure{display:grid;gap:6px;margin-top:16px;font-size:13.5px;color:var(--muted)}
.tp-assure li{display:flex;gap:8px;align-items:flex-start}
.tp-assure li::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;background:var(--ok);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}

.tp-rule{margin-top:52px;padding-top:30px;border-top:1px solid var(--line)}
.tp-rule h2{font-size:clamp(32px,8vw,44px);line-height:1.05;margin-bottom:18px}
/* given for */
.tp-give-list{display:grid;gap:12px}
.tp-give-list a{display:grid;gap:4px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;text-decoration:none;transition:border-color .2s ease,transform .3s ease}
.tp-give-name{font:400 23px/1.15 var(--display)}
.tp-give-why{font:400 17px/1.4 var(--text);color:#2b2a27}
.tp-give-more{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font:600 13px/1.3 var(--ui);color:var(--muted)}
.tp-give-more svg{width:16px;height:16px}
@media (hover:hover){.tp-give-list a:hover{border-color:var(--fg)}.tp-give-list a:hover .tp-give-more{color:var(--fg)}}
/* inside the book */
.tp-inside{display:grid;gap:28px}
.tp-inside-copy>p{font-size:16px;color:var(--muted);max-width:56ch}
.tp-sections{display:grid;gap:0;margin-top:18px;counter-reset:none}
.tp-sections li{display:grid;grid-template-columns:42px 1fr;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--line);font:400 18px/1.35 var(--text)}
.tp-sections li span{font:600 11.5px/1 var(--ui);letter-spacing:.08em;color:var(--muted)}
.tp-spread{margin:0}
.tp-spread button{appearance:none;-webkit-appearance:none;position:relative;display:block;width:100%;margin:0;padding:0;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.tp-spread img{display:block;width:100%;height:auto;aspect-ratio:4/3;border-radius:3px;box-shadow:0 1px 2px rgba(0,0,0,.12),0 18px 40px -18px rgba(0,0,0,.35)}
.tp-spread-cta{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:999px;background:#fff;color:var(--fg);font:600 13px/1 var(--ui);box-shadow:0 2px 10px rgba(0,0,0,.14)}
.tp-spread-cta svg{width:16px;height:16px}
.tp-spread figcaption{margin-top:10px;font-size:12.5px;color:var(--muted)}
.tp-from h3{font:600 11.5px/1.4 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.tp-from ul{display:grid;gap:14px}
.tp-from li{padding-left:16px;border-left:2px solid var(--c,#999);font:400 19px/1.45 var(--text)}
.tp-from cite{display:block;margin-top:4px;font:normal 600 12px/1.3 var(--ui);color:var(--muted)}
.tp-from q::before,.tp-from q::after{content:none}
.tp-from .tp-mini{margin-top:12px}
/* more themes */
.tp-more-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.tp-more-head h2{margin-bottom:16px}
.tp-more-head a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font:600 14px/1 var(--ui);text-decoration:none;white-space:nowrap}
.tp-more-head a svg{width:16px;height:16px}
/* more theme books (owner, 2026-10-20): a grid of four, two a row on a phone (down to 320 px), four a row from 600 px */
.tp-more-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px;margin:0;padding:6px 0 0}
.tp-more-list li{min-width:0}
.tp-more-list a{display:grid;gap:4px;text-decoration:none}
.tp-more-cover{display:block;margin-bottom:6px}
.tp-more-cover img{display:block;width:100%;height:auto;aspect-ratio:2/3;border-radius:1px 3px 3px 1px;box-shadow:0 1px 2px rgba(0,0,0,.14),0 12px 22px -12px rgba(0,0,0,.4);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
@media (hover:hover){.tp-more-list a:hover img{transform:translateY(-4px)}}
.tp-more-title{font:400 21px/1.1 var(--display);overflow-wrap:break-word}
.tp-more-label{font-size:12.5px;color:var(--muted)}
.tp-fine{margin-top:44px;max-width:82ch;font-size:12.5px;line-height:1.6;color:var(--muted)}

/* the bar a phone keeps in view while the Buy button is off screen */
.tp-bar{position:fixed;z-index:70;left:0;right:0;bottom:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;
  padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  background:#fff;border-top:1px solid var(--line,#e6e5e1);box-shadow:0 -8px 24px rgba(0,0,0,.06);
  font-family:'Schibsted Grotesk',system-ui,sans-serif;color:#161616;transform:translateY(105%);transition:transform .3s cubic-bezier(.2,.7,.2,1);will-change:transform}
.tp-bar.is-on{transform:none}
.tp-bar>img{display:none}
.tp-bar-what{display:grid;min-width:0;margin:0;line-height:1.25}
.tp-bar-what strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 19px/1.1 'Instrument Serif',Georgia,serif}
.tp-bar-what span{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.3;color:#5c5b57}
.tp-bar-price{display:grid;justify-items:end;gap:2px;margin:0}
body.tp-bar-on #cookie-settings{bottom:calc(80px + env(safe-area-inset-bottom,0px))}
.tp-bar-price strong{font:400 22px/1 'Instrument Serif',Georgia,serif}
.tp-bar-price .ship-note{margin:2px 0 0;font-size:11px;line-height:1.3}
.tp-bar .tp-btn{min-height:48px;padding:10px 22px}
@media (max-width:379px){.tp-bar{gap:9px}.tp-bar .tp-btn{padding:10px 17px}}
@media (min-width:400px){.tp-bar{grid-template-columns:34px minmax(0,1fr) auto auto}.tp-bar>img{display:block;width:34px;height:51px;object-fit:cover;border-radius:1px 2px 2px 1px;box-shadow:0 1px 3px rgba(0,0,0,.25)}}
@media (min-width:900px){.tp-bar{display:none!important}.tp{padding-bottom:0}}

@media (min-width:600px){
  .tp-wrap{padding-left:32px;padding-right:32px}
  .tp-look-note{display:inline}
  .tp-give-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-more-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 20px}
  .tp-sections{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
}
@media (min-width:760px){
  .tp-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
  .tp-media{position:sticky;top:12px;padding:28px 0 12px}
  .tb3{--w:min(300px,28vw)}
  .tp-info{padding:20px 0 12px}
  .tp-info h1{font-size:clamp(44px,6.2vw,80px)}
}
@media (min-width:900px){
  .tp-crumbs{padding-top:8px}
  .tp-give-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tp-inside{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);column-gap:56px;align-items:start}
  .tp-inside-copy{grid-row:span 2}
  .tp-more-list{gap:36px 32px}
}
@media (min-width:1200px){.tb3{--w:320px}}

/* Look inside: the opening pages as real left/right spreads, one page at a time below 640 px */
.tk-dialog{--fg:#161616;--muted:#5c5b57;--line:#e0dfdb;width:min(1080px,calc(100vw - 24px));max-width:none;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);margin:auto;padding:0;border:0;border-radius:10px;overflow:auto;overscroll-behavior:contain;background:#fff;color:var(--fg);box-shadow:0 30px 80px rgba(0,0,0,.45);font-family:var(--ui)}
.tk-dialog::backdrop{background:rgba(10,10,10,.78)}
.tk-dialog[open]{animation:tk-rd-in .22s ease-out}
@keyframes tk-rd-in{from{opacity:0;transform:translateY(10px)}}
.tk-rd{display:grid;gap:12px;padding:16px 20px 18px}
.tk-rd-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tk-rd-kicker{font:600 11px/1.3 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.tk-dialog h2{font-size:26px;line-height:1.1;text-wrap:balance}
.tk-rd-bar{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;justify-content:space-between}
.tk-rd-ctrl{display:flex;gap:8px}
.tk-rd-ctrl button,.tk-rd-close{appearance:none;-webkit-appearance:none;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:44px;margin:0;padding:8px 16px;border:1px solid var(--chip,#d3d1cc);border-radius:999px;font:600 13.5px/1 var(--ui);color:var(--fg);background:#fff}
.tk-rd-close{flex:none;border-color:var(--fg)}
@media (hover:hover){.tk-rd-ctrl button:hover:not(:disabled),.tk-rd-close:hover{background:var(--fg);border-color:var(--fg);color:#fff}}
.tk-rd-ctrl button:disabled{opacity:.35;cursor:default}
.tk-rd-where{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.tk-rd-pages{--room:calc(100vh - 232px);display:grid;grid-template-columns:1fr 1fr;aspect-ratio:4/3;width:min(100%,calc(var(--room) * 4 / 3));margin:0 auto;background:#fff;box-shadow:0 2px 3px rgba(0,0,0,.12),0 18px 40px rgba(0,0,0,.2);touch-action:pan-y pinch-zoom}
@supports (height:100dvh){.tk-rd-pages{--room:calc(100dvh - 232px)}}
.tk-rd-pages.single{grid-template-columns:1fr;aspect-ratio:2/3;width:min(100%,520px,calc(var(--room) * 2 / 3))}
.tk-pg{position:relative;min-width:0;aspect-ratio:2/3;overflow:hidden;background-color:#fff;background-repeat:no-repeat;background-size:200% 100%}
.tk-pg.verso{background-position:0 0}
.tk-pg.recto{background-position:100% 0}
.tk-pg img{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;transition:opacity .18s ease}
.tk-pg.is-loaded img{opacity:1}
.tk-pg::after{content:"";position:absolute;inset:0;pointer-events:none}
.tk-rd-pages.double .tk-pg.verso::after{background:linear-gradient(90deg,transparent 88%,rgba(0,0,0,.07))}
.tk-rd-pages.double .tk-pg.recto::after{background:linear-gradient(90deg,rgba(0,0,0,.09),transparent 12%)}
.tk-pg.is-missing::before{content:attr(data-msg);position:absolute;inset:0;display:grid;place-items:center;padding:12%;text-align:center;font:italic 16px/1.4 var(--display);color:var(--muted)}
.tk-rd-end{grid-column:1/-1;display:grid;gap:14px;align-content:center;justify-items:center;text-align:center;padding:24px 20px;background:#fff;min-height:0}
.tk-rd-end h3{font-size:30px;line-height:1.1}
.tk-rd-end p{max-width:46ch;color:var(--muted)}
.tk-rd-end .tp-actions{justify-content:center;flex-wrap:wrap}
.tk-rd-note{font-size:12px;color:var(--muted);text-align:center}
@media (max-width:639px){.tk-rd{padding:12px 14px 14px;gap:10px}.tk-dialog h2{font-size:22px}.tk-rd-end h3{font-size:24px}.tk-rd-end{padding:16px 14px}}
@media (max-height:520px) and (min-width:640px){.tk-rd{gap:6px;padding:8px 14px 10px}.tk-rd-note,.tk-rd-kicker{display:none}.tk-rd-pages{--room:calc(100vh - 130px)}@supports (height:100dvh){.tk-rd-pages{--room:calc(100dvh - 130px)}}}

/* ======================================================================================================================
   THE HUB (custom.html)
   ====================================================================================================================== */
.th-wrap{max-width:1160px;margin:0 auto;padding:0 max(16px,env(safe-area-inset-right,0px)) 72px max(16px,env(safe-area-inset-left,0px))}
.th-rule{margin-top:56px;padding-top:32px;border-top:1px solid var(--line)}
.th-head{display:grid;gap:8px;max-width:64ch;margin-bottom:22px}
.th-head h2{font-size:clamp(34px,8.6vw,52px);line-height:1.02;text-wrap:balance}
.th-head p{font-size:16px;color:var(--muted)}
.th-head a{text-underline-offset:3px}

/* ---------- the hero: the headline among floating covers ----------
   Phones and tablets: the covers float in a band above the headline, never over it. From 1024 px: two zones beside the
   headline. Each cover: .th-fc places and tilts it, .th-fc-par carries the pointer parallax (js/theme-hub-20261019u.js sets
   --px/--py on .th-float), .th-fc-bob bobs it, out of phase with the others. */
.th-hero{--band:232px;position:relative;overflow:hidden;overflow:clip;background:#fff}
.th-float{position:absolute;inset:0 0 auto 0;height:var(--band);pointer-events:none}
.th-zone{position:absolute;top:14px;bottom:0;width:calc(50% - 14px)}
.th-zone-l{left:12px}
.th-zone-r{right:12px}
.th-fc{--cw:calc(var(--mw,60) * 1px);position:absolute;display:none;z-index:var(--zi,1);width:var(--cw);left:calc((100% - var(--cw)) * var(--mx,0));top:calc((100% - var(--cw) * 1.5) * var(--my,0));
  transform:rotate(var(--r));pointer-events:auto;text-decoration:none;-webkit-tap-highlight-color:transparent}
.th-fc.is-m{display:block}
.th-fc-par,.th-fc-bob{display:block;position:relative}
.th-fc-par{transform:translate3d(calc(var(--px,0) * var(--z) * -26px),calc(var(--py,0) * var(--z) * -16px),0)}
.th-fc img{display:block;width:100%;height:auto;aspect-ratio:2/3;border-radius:1px 3px 3px 1px;
  box-shadow:0 1px 2px rgba(0,0,0,.14),0 calc(6px + var(--z) * 16px) calc(14px + var(--z) * 28px) calc(-4px - var(--z) * 6px) rgba(20,20,20,calc(.18 + var(--z) * .16));
  transition:opacity .7s ease,transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease}
.th-js .th-fc img:not(.is-in){opacity:0}
.th-fc-name{position:absolute;left:50%;top:calc(100% + 8px);z-index:2;transform:translate(-50%,-4px);padding:5px 10px;border-radius:999px;background:#fff;color:var(--fg);box-shadow:0 2px 10px rgba(0,0,0,.14);
  font:600 12px/1 var(--ui);white-space:nowrap;opacity:0;transition:opacity .3s ease,transform .3s ease;pointer-events:none}
@media (hover:hover){.th-fc:hover img{transform:translateY(-6px) scale(1.03)}.th-fc:hover .th-fc-name{opacity:1;transform:translate(-50%,0)}}
.th-fc:focus-visible{outline:none}
.th-fc:focus-visible img{outline:2px solid var(--fg);outline-offset:4px}
.th-fc:focus-visible .th-fc-name{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:no-preference){
  .th-fc{animation:th-in 1s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i) * 70ms + 80ms)}
  .th-fc-bob{animation:th-bob var(--t) ease-in-out var(--d) infinite;will-change:transform}
  .th-float.is-paused .th-fc-bob{animation-play-state:paused}
}
@keyframes th-in{from{opacity:0;transform:translateY(22px) rotate(var(--r)) scale(.94)}to{opacity:1;transform:rotate(var(--r))}}
@keyframes th-bob{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(0,calc(-4px - var(--z) * 8px),0) rotate(.8deg)}}
@media (prefers-reduced-motion:reduce){.th-fc-par{transform:none}.th-fc img{transition:none}}

.th-copy{position:relative;z-index:20;max-width:620px;margin:0 auto;padding:calc(var(--band) + 22px) 16px 40px;text-align:center}
.th-copy h1{margin:10px 0 0;font-size:clamp(44px,12.4vw,86px);line-height:.98;letter-spacing:-.005em;text-wrap:balance}
.th-lede{margin:16px auto 0;max-width:46ch;font-size:16.5px;line-height:1.6;color:var(--muted)}
.th-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:24px}
.th-cta .th-btn{flex:1 1 0;max-width:230px;min-width:0;padding-left:14px;padding-right:14px}
.th-price{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 16px;margin-top:20px}
.th-price p{font-size:14px;color:var(--muted)}
.th-price strong{font:400 26px/1 var(--display);color:var(--fg);vertical-align:-2px}
.th-price .ship-note{margin:0;flex-basis:100%;text-align:center;font-size:12.5px;color:inherit}
.th-status{margin-top:12px;font-weight:600;color:var(--accent)}
.th-status:empty{display:none}

/* Phones (2026-10-19): the covers hover around the copy as on a computer: four above the kicker, one peeking in at each side
   of the headline, four below the price. Positions: --qx (0-1 across the hero, beyond to peek in), --qy (px from the top, or
   from the bottom for .is-pb), --qw (width in px). The covers a phone shows load at once, so none is still fading in. */
@media (max-width:599px){
  .th-hero{--band:150px;--below:178px}
  .th-float{inset:0;height:auto}
  .th-zone{inset:0;width:auto}
  .th-fc.is-m:not(.is-p){display:none}
  .th-fc.is-p{display:block;--cw:calc(var(--qw) * 1px);left:calc((100% - var(--cw)) * var(--qx));top:calc(var(--qy) * 1px)}
  .th-fc.is-p.is-pb{top:auto;bottom:calc(var(--qy) * 1px)}
  .th-copy{padding:calc(var(--band) + 18px) 16px var(--below)}
  .th-copy h1{max-width:12ch;margin-left:auto;margin-right:auto}
  .th-fc img{transition:opacity .35s ease,transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease}
}
@media (max-width:599px) and (prefers-reduced-motion:no-preference){.th-fc{animation-duration:.6s;animation-delay:calc(var(--i) * 35ms + 40ms)}}
@media (min-width:600px){
  .th-hero{--band:300px}
  .th-fc{--cw:calc(var(--mw,60) * 1.28px)}
  .th-fc.is-tab{display:block}
  .th-zone{top:22px;width:calc(50% - 40px)}
  .th-zone-l{left:32px}.th-zone-r{right:32px}
}
@media (min-width:1200px){
  .th-hero{--k:.8;display:grid;place-items:center;min-height:clamp(600px,calc(100vh - 106px),780px);min-height:clamp(600px,calc(100svh - 106px),780px)}
  .th-float{inset:0;height:auto}
  .th-zone{top:30px;bottom:30px;width:calc(50% - 318px)}
  .th-zone-l{left:max(20px,2.4vw)}.th-zone-r{right:max(20px,2.4vw)}
  .th-fc{display:block;--cw:calc(var(--w) * var(--k) * 1px);left:calc((100% - var(--cw)) * var(--x));top:calc((100% - var(--cw) * 1.5) * var(--y))}
  .th-copy{padding:72px 0}
}
@media (min-width:1400px){.th-hero{--k:.88}}
@media (min-width:1680px){.th-hero{--k:1}}

/* ---------- shop by occasion: a tab per occasion ---------- */
.th-occasions{scroll-margin-top:12px}
.th-tabs{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:16px;margin:0 -16px;padding:2px 16px 12px;scrollbar-width:none}
.th-tabs::-webkit-scrollbar{display:none}
.th-tab{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 17px;border:1px solid var(--chip);border-radius:999px;background:#fff;color:var(--fg);font:600 14px/1 var(--ui);text-decoration:none;white-space:nowrap;scroll-snap-align:start;transition:background-color .15s ease,color .15s ease,border-color .15s ease;-webkit-tap-highlight-color:transparent}
.tbk a.th-tab[aria-selected="true"]{background:var(--fg);border-color:var(--fg);color:#fff}
@media (hover:hover){.th-tab:hover{border-color:var(--fg)}}
.th-panel{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;padding-top:18px;outline:none;scroll-margin-top:16px}
.th-js .th-panel:not(.is-on){display:none}
.th-js .th-occasions:not(.th-tabs-ready) .th-panel:target{display:grid}
.th-panel+.th-panel{margin-top:32px}
.th-js .th-panel+.th-panel{margin-top:0}
.th-panel-copy h3{margin:6px 0 8px;font-size:clamp(30px,7.6vw,40px);line-height:1.05}
.th-panel-copy>p{font-size:16px;color:var(--muted);max-width:48ch}
.th-reasons{display:grid;gap:7px;margin-top:14px;font-size:14.5px}
.th-reasons li{display:flex;gap:9px;align-items:flex-start}
.th-reasons li::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;background:var(--ok);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
.th-shelf{display:grid;grid-auto-flow:column;grid-auto-columns:42%;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin:0 -16px;padding:8px 16px 14px;scrollbar-width:none}
.th-shelf::-webkit-scrollbar{display:none}
.th-shelf li{scroll-snap-align:start}
.th-bk{display:grid;align-content:start;gap:5px;text-decoration:none}
.th-bk-cover{display:block;margin-bottom:8px}
.th-bk-cover img,.th-gc-cover img{display:block;width:100%;height:auto;aspect-ratio:2/3;border-radius:1px 3px 3px 1px;box-shadow:0 1px 2px rgba(0,0,0,.14),0 14px 26px -14px rgba(0,0,0,.42);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease}
@media (hover:hover){.th-bk:hover img,.th-gc:hover img{transform:translateY(-5px);box-shadow:0 1px 2px rgba(0,0,0,.14),0 22px 30px -16px rgba(0,0,0,.45)}}
.th-bk-title,.th-gc-title{font:400 22px/1.08 var(--display)}
.th-bk-why{font:400 16px/1.35 var(--text);color:#3a3936}
.th-bk-go{display:inline-flex;align-items:center;gap:6px;min-height:32px;font:600 13px/1 var(--ui);color:var(--muted)}
.th-bk-go svg{width:16px;height:16px}
@media (hover:hover){.th-bk:hover .th-bk-go{color:var(--fg)}}

/* ---------- every theme ---------- */
/* every theme (owner, 2026-10-20): two a row on a phone down to 320 px, three on a tablet, four on a desktop with bigger covers */
.th-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 14px}
.th-grid li{min-width:0}
.th-gc-title{overflow-wrap:break-word}
.th-grid li{display:grid;align-content:start;justify-items:start;scroll-margin-top:16px}
.th-gc{display:grid;gap:3px;width:100%;text-decoration:none}
.th-gc-cover{display:block;margin-bottom:9px}
.th-gc-label{font-size:13px;color:var(--muted)}
.th-gc-price{margin-top:3px;font-size:13.5px;font-weight:600}
.th-head .ship-note{margin:10px 0 0}

/* ---------- inside every book ---------- */
.th-anat{display:grid;grid-auto-flow:column;grid-auto-columns:40%;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin:0 -16px;padding:4px 16px 12px;scrollbar-width:none}
.th-anat::-webkit-scrollbar{display:none}
.th-anat li{scroll-snap-align:start}
.th-anat-page{display:block;margin-bottom:8px;border:1px solid var(--line);box-shadow:0 10px 22px -16px rgba(0,0,0,.4)}
.th-anat-page img{display:block;width:100%;height:auto;aspect-ratio:2/3}
.th-anat p{font-size:13px;color:var(--muted);line-height:1.4}
.th-anat strong{display:block;font:400 18px/1.15 var(--display);color:var(--fg)}

/* ---------- why, questions ---------- */
.th-why-grid{display:grid;gap:18px}
.th-why-grid li{padding-top:14px;border-top:2px solid var(--fg)}
.th-why-grid h3{font-size:24px;line-height:1.1;margin-bottom:6px}
.th-why-grid p{font-size:15px;color:var(--muted)}
.th-faq-list details{border-top:1px solid var(--line)}
.th-faq-list details:last-child{border-bottom:1px solid var(--line)}
.th-faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:10px 0;cursor:pointer;list-style:none;font:400 21px/1.2 var(--display)}
.th-faq-list summary::-webkit-details-marker{display:none}
.th-faq-list summary::after{content:"+";flex:none;font:400 22px/1 var(--ui);color:var(--muted);transition:transform .2s ease}
.th-faq-list details[open] summary::after{transform:rotate(45deg)}
.th-faq-list p{padding:0 0 18px;max-width:70ch;font-size:15.5px;color:var(--muted)}
.th-fine{margin-top:28px;max-width:82ch;font-size:12.5px;line-height:1.6;color:var(--muted)}

@media (min-width:600px){
  .th-wrap{padding-left:32px;padding-right:32px}
  .th-tabs,.th-shelf,.th-anat{margin:0 -32px;padding-left:32px;padding-right:32px;scroll-padding-inline:32px}
  .th-shelf{grid-auto-columns:28%}
  .th-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px}
  .th-anat{grid-auto-columns:22%}
  .th-why-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
}
@media (min-width:900px){
  .th-rule{margin-top:80px;padding-top:40px}
  .th-tabs{flex-wrap:wrap;overflow:visible;margin:0;padding:0 0 8px}
  .th-panel{grid-template-columns:minmax(250px,340px) minmax(0,1fr);gap:56px;align-items:center;padding-top:28px}
  .th-shelf{grid-auto-flow:row;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));max-width:calc(var(--n,5) * 196px);overflow:visible;margin:0;padding:0;gap:24px}
  .th-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 32px}
  .th-anat{grid-auto-flow:row;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible;margin:0;padding:0}
  .th-why-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1200px){.th-grid{gap:56px 44px}.th-tab{padding:0 15px;font-size:13.5px}.th-tabs{gap:7px}}
@media (prefers-reduced-motion:reduce){.tk-dialog[open]{animation:none}.tk-pg img,.tp-bar,.th-bk-cover img,.th-gc-cover img,.tp-more-cover img{transition:none}}

/* css/store-shell.css gives every button and summary a ring of its text colour and a darker filter on hover, every link
   an underline and every linked image a brighter filter. Not on these pages: a filter on the book would flatten its 3D
   into a dark, ringed picture (owner, 2026-10-19: "it snaps to a 2d like state with black margins and a black overlay").
   Each control here has its own hover state instead; the store's focus ring stays. */
@media (hover:hover){
  .tbk .tp-book:hover,.tbk .tp-spread button:hover,.tbk .tp-look:hover,.tbk .tp-btn:hover,.tbk .th-faq-list summary:hover,.tbk.tk-dialog button:hover,.tbk.tp-bar .tp-btn:hover{box-shadow:none;filter:none}
  .tbk a[href]:has(img):hover img{filter:none}
  .tbk a.th-fc:hover,.tbk a.th-bk:hover,.tbk a.th-gc:hover,.tbk .tp-give-list a:hover,.tbk .tp-more-list a:hover,.tbk a.th-tab:hover,.tbk a.th-btn:hover,.tbk .tp-more-head a:hover{text-decoration:none!important}
  .tbk .tp-crumbs a:hover{text-decoration-thickness:1px!important;text-underline-offset:3px!important}
}

/* the theme release (2026-10-21): an eBook is shown as its front on a tablet screen, flat, as on the Five Books, New Testament and
   Black/White Edition pages; never as a book (the printed bindings show their v2 renders) */
.tb3.is-ebook{transform:none;width:clamp(150px,40vw,236px);aspect-ratio:auto;padding:3.4%;border-radius:20px/14px;background:linear-gradient(160deg,#3a3b3d,#141516 55%,#0b0b0c);box-shadow:0 1px 1px rgba(0,0,0,.25),0 18px 36px -16px rgba(0,0,0,.45)}
.tb3.is-ebook>span{position:relative;top:auto}
.tb3.is-ebook .tb3-spine,.tb3.is-ebook .tb3-edge{display:none}
.tb3.is-ebook .tb3-front{inset:auto;transform:none;border-radius:4px;box-shadow:none;aspect-ratio:2/3}
.tb3.is-ebook .tb3-front::before,.tb3.is-ebook .tb3-front::after{display:none}
/* the format chips carry their price under the name, as on the Black Edition page (customer, 2026-10-21) */
.tp-format-chips{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));max-width:480px}
.tp-format-chips label{display:flex}
.tp-format-chips span{width:100%;flex-direction:column;justify-content:center;gap:2px;min-height:58px;padding:6px 10px;line-height:1.25;text-align:center}
.tp-chip-price{font:400 13px var(--ui);color:var(--muted)}
.tp-chips input:checked+span .tp-chip-price{color:rgba(255,255,255,.8)}
.tp-chip-price:empty{display:none}
