/* =============================================================
   OBJECTS — Mag-parity bookcloth (dye, dense nap, mottle, one lamp)
   Cream ink pressed. Shelf mode is live; Hadid river kept below if restored.
   ============================================================= */
#p-photobooks.pbw,#p-photobooks.pb-shelf-mode{
  overflow:auto;background:#12182a;color:#f4ead8;
  --ink:#f4ead8;--ink-2:rgba(244,234,216,.88);--ink-3:rgba(244,234,216,.56);--rule:rgba(180,190,220,.28);--guide:rgba(190,198,220,.45);--sun:#d7d3c4;
  --emb:0 1px 0 rgba(255,236,190,.28),0 -1px 0 rgba(12,8,4,.5),0 -1px 2px rgba(12,8,4,.24);
  --cloth:#1c1814;--paper:#f3eee3;
  --mm:1.875px;--nx:320px;--gut:56px;--z:12;--z3:32;--S:1440px;--H:900px;--ay:450px;
  --fw-land:1100px;--fw-cloth:980px;--fw-plates:1600px;--fw-end:1000px}
html:has(body.w-pb),
body.w-pb,body.w-pb #app,body.w-pb #views{--ink:#f4ead8;--ink-2:rgba(244,234,216,.88);--ink-3:rgba(244,234,216,.56);background:#12182a}
body.w-pb #hdr{background:linear-gradient(rgba(14,18,32,.88) 40%,rgba(14,18,32,0))}
body.w-pb .hmark{color:#f1e8d8;text-shadow:none}
body.w-pb .horb{width:28px;height:28px;background:none;box-shadow:0 0 0 1px rgba(241,232,216,.4);transition:box-shadow .5s cubic-bezier(.22,.68,.26,1)}
body.w-pb .horb:hover{transform:none;box-shadow:0 0 0 1px #e0be84}
body.w-pb .horb i{background:#f1e8d8;width:4px;height:4px;margin:-2px 0 0 -2px}
body.w-pb .horb:focus-visible{outline:1px solid #e0be84;outline-offset:5px}

/* ---- shelf landing: Mag-style ground layers ---- */
.pb-ground{position:fixed;inset:0;height:auto;margin:0;pointer-events:none;z-index:0;overflow:hidden;background:#12182a}
.pb-fibre{position:absolute;inset:0;background-size:512px 512px;background-repeat:repeat;opacity:.42}
.pb-mottle{position:absolute;inset:0;background-size:640px 640px;background-repeat:repeat;opacity:.88;mix-blend-mode:soft-light}
.pb-lamp{position:absolute;inset:0;
  background:
    radial-gradient(80% 60% at calc(46% + var(--lx,-.42)*16%) calc(34% + var(--ly,-.61)*12%),rgba(214,210,255,.16),transparent 58%),
    radial-gradient(120% 100% at 50% 88%,rgba(0,0,0,0) 32%,rgba(6,8,16,.55))}
/* the lamp on the cloth — a rise, never a wipe */
.pb-peel{
  position:fixed;inset:0;z-index:6;pointer-events:none;
  background:radial-gradient(88% 72% at 46% 38%,rgba(18,18,20,.18),rgba(18,18,20,.86));
  opacity:1;
  transition:opacity 1.8s cubic-bezier(.22,.68,.26,1);
}
#p-photobooks.pb-in .pb-peel{opacity:0}
.pb-shelf-pg{position:relative;z-index:1;max-width:1680px;margin:0 auto;padding:0 var(--gut,56px) clamp(64px,10vh,120px)}
.pb-run{position:relative;height:280vh}
.pb-stage{
  position:sticky;top:0;height:100vh;height:100dvh;box-sizing:border-box;
  display:flex;flex-direction:column;padding:104px 0 24px;z-index:1;
}
.pb-stage .pb-shelf-k{display:flex;justify-content:space-between;width:100%}
.pb-read{
  flex:1;min-height:0;display:grid;place-items:center;
  opacity:var(--book,0);
  transform:translateY(calc((1 - var(--book,0)) * 36px));
}
#p-photobooks .pb-shelf-pg .pb-word,
#p-photobooks .pb-shelf-pg .pb-lede,
#p-photobooks .pb-shelf-pg .pb-shelf-k{opacity:1}
.pb-shelf-pg .pb-shelf-k{color:var(--ink-3);opacity:0;
  transition:opacity .36s cubic-bezier(.22,.68,.26,1)}
#p-photobooks.pb-in .pb-shelf-pg .pb-shelf-k,
#p-photobooks.rr-settled .pb-shelf-pg .pb-shelf-k{opacity:1}
.pb-shelf-pg .pb-word{
  position:relative;
  font-size:clamp(64px,10.2vw,156px);
  color:#f4ead8;margin:.02em 0 .04em -.03em;white-space:nowrap;padding-top:.04em;
  transform:translateY(calc(var(--word-lift,0) * -1.6vh)) rotate(-.55deg);transform-origin:0 80%;
  text-shadow:
    0 0 calc(var(--halo-b,40) * 1.2px) rgba(214,210,255,calc(var(--halo-a,.9) * .8)),
    0 0 calc(var(--halo-b,40) * 2.2px) rgba(120,140,210,calc(var(--halo-a,.9) * .4)),
    0 1px 0 rgba(8,10,20,.45);
}
.pb-halo{
  position:absolute;left:36%;top:62%;z-index:0;pointer-events:none;
  width:min(130vw,1500px);height:min(74vh,700px);
  transform:translate(calc(-38% + var(--hx,0px)),-58%) scale(var(--halo-s,1.6));
  background:
    radial-gradient(ellipse 34% 32% at 50% 46%,
      rgba(236,232,255,calc(var(--halo-a,1) * .62)) 0%,
      rgba(120,140,210,calc(var(--halo-a,1) * .28)) 34%,
      rgba(40,52,110,0) 70%);
  filter:blur(calc(var(--halo-b,44) * 1px));
}
.pb-word-in{position:relative;z-index:1}
#p-photobooks.pb-word-in .pb-shelf-pg .pb-word,
#p-photobooks.pb-settled .pb-shelf-pg .pb-word,
#p-photobooks.rr-settled .pb-shelf-pg .pb-word{opacity:1}
.pb-shelf-pg .pb-lede{
  position:relative;left:auto;bottom:auto;width:auto;z-index:1;
  color:var(--ink);opacity:0;transform:rotate(.35deg);
  margin:0 0 clamp(8px,1.5vh,16px);
  transition:opacity .4s cubic-bezier(.22,.68,.26,1) .06s;
}
#p-photobooks.pb-word-in .pb-shelf-pg .pb-lede,
#p-photobooks.pb-settled .pb-shelf-pg .pb-lede,
#p-photobooks.rr-settled .pb-shelf-pg .pb-lede{opacity:.92}
.pb-scans-row{margin:0 0 clamp(10px,1.6vh,18px);display:flex;gap:.7em;align-items:baseline;flex-wrap:wrap;
  opacity:0;transition:opacity .4s cubic-bezier(.22,.68,.26,1) .08s}
#p-photobooks.pb-word-in .pb-scans-row,
#p-photobooks.pb-settled .pb-scans-row,
#p-photobooks.rr-settled .pb-scans-row{opacity:1}
.pb-scans{font:italic 400 18px/1.2 'Instrument Serif',Georgia,serif;color:inherit;text-decoration:none;
  border-bottom:1px solid rgba(23,23,21,.28);padding-bottom:1px}
.pb-scans-row span{font:400 12px/1.3 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.08em;color:var(--ink-3)}
@media (max-width:820px){
  .pb-shelf-pg .pb-word{transform:none;white-space:normal;font-size:clamp(64px,18vw,120px)}
  .pb-shelf-pg .pb-lede{transform:none}
  #p-photobooks.pb-word-in .pb-shelf-pg .pb-lede,
  #p-photobooks.pb-settled .pb-shelf-pg .pb-lede{transform:none}
}

.pb-run{position:absolute;inset:0;overflow:hidden;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;background:#2c2d30;
  --pb-depth:1;--pb-bench:1;--pb-needle:0}
#p-photobooks.pb-shelf-mode{overflow:visible}
#p-photobooks.pb-shelf-mode .pb-run{
  position:relative;inset:auto;overflow:visible;height:280vh;
  cursor:auto;touch-action:auto;user-select:auto;background:none;
}
.pb-run.drag{cursor:grabbing}

.pb-paper{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0}
.pb-run .pb-cloth{position:absolute;inset:0;z-index:0;pointer-events:none;display:block !important}
.pb-run .pb-lamp{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(90% 80% at calc(50% + var(--lx,-.57)*38%) calc(42% + var(--ly,-.82)*32%),rgba(255,220,170,.14),rgba(255,220,170,0) 62%),
    radial-gradient(130% 110% at 50% 100%,rgba(10,8,6,.38),rgba(10,8,6,0) 52%)}
.pb-thread,.pb-needle,.pb-ruler,.pb-reg{display:none !important}

.pb-track{position:absolute;left:0;top:0;height:100%;z-index:2;display:flex;align-items:stretch;will-change:transform;background:none}

/* ---- continuous fields (not slide stations) ---- */
.pb-field{position:relative;flex:none;height:100%;color:var(--ink);overflow:visible}
.pb-field.f-land{width:var(--fw-land);z-index:3}
.pb-field.f-cloth{width:var(--fw-cloth);margin-left:calc(var(--fw-land)*-.18);z-index:2;
  transform:rotate(-1.1deg);transform-origin:20% 60%}
.pb-field.f-plates{width:var(--fw-plates);margin-left:calc(var(--fw-cloth)*-.12);z-index:4;
  display:flex;flex-direction:column;justify-content:center;padding-right:calc(var(--mm)*28);
  transform:rotate(.65deg);transform-origin:10% 50%}
.pb-field.f-end{width:var(--fw-end);margin-left:calc(var(--fw-plates)*-.08);z-index:3;
  transform:rotate(-.55deg);transform-origin:0 70%}

.pb-crop *{fill:none;stroke:rgba(241,232,216,.32);stroke-width:1;vector-effect:non-scaling-stroke}

/* type rides the field — relative islands, not a shared absolute gut box */
.pb-k{position:absolute;left:var(--gut);top:calc(var(--H)*.12);width:min(calc(var(--S) - 2*var(--gut)),48em);display:flex;justify-content:space-between;gap:24px;margin:0;color:var(--ink-3);font-size:9px;letter-spacing:.22em;text-transform:uppercase;opacity:.72}
.f-land .pb-k{display:none}
.pb-island{position:absolute;left:calc(var(--gut) + 4%);top:calc(var(--H)*.18);width:min(38em,72%);
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(140px,38%);gap:clamp(18px,3vw,40px) clamp(20px,3vw,48px);align-items:end}
.pb-island .pb-h2{position:static;grid-column:1/-1;margin:0 0 .15em;max-width:14em}
.pb-island .pb-fig{position:static;grid-column:2;grid-row:2}
.pb-island .pb-p{position:static;grid-column:1;grid-row:2;width:auto;max-width:28em;margin:0}

.pb-h2{margin:0;font:400 clamp(40px,min(6.2vw,11vh),118px)/.92 var(--display);letter-spacing:-.02em;color:var(--ink);text-shadow:var(--emb);text-wrap:balance}
.pb-h2-drift{position:relative;left:var(--gut);top:calc(var(--H)*.16);margin:0 0 clamp(24px,4vh,48px);max-width:min(14em,70vw);
  transform:translateY(calc(var(--H)*-.02)) rotate(-1.4deg)}
.pb-p{margin:0;font:400 clamp(15px,1.12vw,17px)/1.6 var(--serif);color:var(--ink-2);text-wrap:pretty}

.pb-h1{position:absolute;left:var(--gut);top:calc(var(--H)*.16);margin:0;z-index:3;font:400 clamp(72px,14vw,220px)/.84 var(--display);letter-spacing:-.028em;white-space:nowrap;color:#f1e8d8;
  opacity:calc(.4 + .6*var(--pb-depth,1));transition:opacity 1.5s cubic-bezier(.22,.68,.26,1);
  transform:rotate(-.8deg);transform-origin:0 80%}
.pb-h1.foiled,.pb-h1.plain,.pb-h1.pb-emboss{opacity:calc(.45 + .55*var(--pb-depth,1))}

.pb-show{position:absolute;left:calc(var(--fw-land) - max(var(--gut),4vw) - min(32vw,360px));right:auto;top:48%;z-index:3;margin:0;width:min(32vw,360px);aspect-ratio:.72;
  transform:translate3d(0,-48%,0) rotate(2.4deg);opacity:calc(.2 + .8*var(--pb-depth,1));
  transition:opacity 1.6s cubic-bezier(.22,.68,.26,1) .06s}
.pb-show-vol{position:absolute;inset:0;display:block;border-radius:1px;overflow:hidden;
  box-shadow:
    inset calc(var(--lx,-.42)*-1.2px) calc(var(--ly,-.61)*-1.2px) 0 rgba(255,248,236,.18),
    inset calc(var(--lx,-.42)*1.2px) calc(var(--ly,-.61)*1.2px) 0 rgba(0,0,0,.32),
    calc(var(--sx,.57)*2px) calc(var(--sy,.82)*2px) 0 #1e1a16,
    calc(var(--sx,.57)*4px) calc(var(--sy,.82)*4px) 0 #ebe4d6,
    calc(var(--sx,.57)*6px) calc(var(--sy,.82)*6px) 0 #d4cbb8,
    calc(var(--sx,.57)*8px) calc(var(--sy,.82)*8px) 0 #ebe4d6,
    calc(var(--sx,.57)*10px) calc(var(--sy,.82)*10px) 0 #c2b8a4,
    calc(var(--sx,.57)*12px) calc(var(--sy,.82)*12px) 0 #4a433a,
    calc(var(--sx,.57)*14px) calc(var(--sy,.82)*14px) 0 #2e2924,
    calc(var(--sx,.57)*18px) calc(var(--sy,.82)*22px) 4px rgba(12,8,4,.45),
    calc(var(--sx,.57)*40px) calc(var(--sy,.82)*52px) 64px -14px rgba(8,6,4,.55)}
.pb-show-cv{display:block;width:100%;height:100%;position:absolute;inset:0}
.pb-show-cloth,.pb-show-mark{display:none !important}

.pb-lede{position:absolute;left:var(--gut);bottom:calc(var(--H)*.12);z-index:3;margin:0;width:min(16em,42vw);font:italic 400 clamp(22px,2.2vw,34px)/1.22 var(--display);letter-spacing:-.005em;color:var(--ink);
  opacity:calc(.25 + .75*var(--pb-depth,1));transition:opacity 1.6s cubic-bezier(.22,.68,.26,1) .18s;
  transform:rotate(.4deg)}

.pb-on-land .pb-rail,.pb-on-land .pb-vig{opacity:0 !important;pointer-events:none !important;visibility:hidden}

.pb-fig{position:relative;margin:0}
.pb-fc{position:absolute;inset:0;width:100%;height:100%;display:block}
.pb-fs{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.pb-fs path{fill:none;stroke:rgba(241,232,216,.4);stroke-width:1px;vector-effect:non-scaling-stroke}
.pb-lb{position:absolute;transform:translate(0,-50%);white-space:nowrap;color:var(--ink-2);pointer-events:none;font-size:9px}
.pb-lb.c{transform:translate(-50%,-50%)}
.pb-lb.r{transform:translate(-100%,-50%)}
.pb-lb.w{color:var(--ink-3)}

.pb-sec{width:calc(var(--mm)*var(--z)*32);height:calc(var(--mm)*var(--z)*14)}
.pb-macro{position:relative;width:calc(var(--mm)*52);height:calc(var(--mm)*64);
  box-shadow:calc(var(--sx,.57)*2px) calc(var(--sy,.82)*3px + 2px) 18px rgba(8,6,4,.4);
  transform:rotate(3.2deg)}
.pb-macro figcaption{position:absolute;left:0;right:0;bottom:-28px;display:flex;justify-content:space-between;gap:12px;font-size:9px;color:var(--ink-3)}
.pb-scale{display:inline-flex;align-items:center;gap:6px}
.pb-scale i{display:block;width:calc(var(--mm)*10);height:1px;background:var(--ink-3)}
.pb-sew{width:calc(var(--mm)*var(--z3)*12);height:calc(var(--mm)*var(--z3)*8)}

/* plates fan along the river — slight stagger, not a card carousel */
.pb-plates{position:relative;left:var(--gut);display:flex;gap:clamp(14px,1.8vw,28px);align-items:flex-end;padding:clamp(8px,2vh,24px) 0 0}
.pb-plate{position:relative;display:block;width:clamp(132px,15vw,200px);text-decoration:none;color:inherit;flex:none;
  transition:transform .55s cubic-bezier(.22,.68,.26,1)}
.pb-plate:nth-child(odd){transform:translateY(-2.5vh) rotate(-2.2deg)}
.pb-plate:nth-child(even){transform:translateY(1.8vh) rotate(1.6deg)}
.pb-plate:nth-child(3n){transform:translateY(-.8vh) rotate(.9deg)}
.pb-plate:hover,.pb-plate:focus-visible{transform:translateY(-3.2vh) rotate(0deg)}
.pb-no{display:block;font:400 clamp(28px,3vw,42px)/1 var(--display);letter-spacing:-.02em;margin-bottom:8px;text-shadow:var(--emb)}
.pb-dm{display:flex;align-items:center;gap:6px;margin-bottom:10px;font-size:8px;color:var(--ink-3)}
.pb-dm i{flex:1;height:1px;background:var(--rule)}
.pb-sheet{position:relative;display:block;aspect-ratio:4/5;background:#ebe4d6;box-shadow:
  inset 0 0 0 1px rgba(12,8,4,.2),
  calc(var(--sx,.57)*1px) calc(var(--sy,.82)*2px + 1px) 14px rgba(8,6,4,.4)}
.pb-pg{position:absolute;inset:8%;overflow:hidden;background:#cfcabb}
.pb-pg canvas{display:block;width:100%;height:100%}
.pb-crop{position:absolute;inset:-2% -2%;width:104%;height:104%;pointer-events:none}
.pb-cap{display:flex;justify-content:space-between;gap:8px;margin-top:10px;font-size:9px;color:var(--ink-3)}
.pb-plate:focus-visible{outline:1px solid var(--ink);outline-offset:8px}

.pb-end-band{position:absolute;left:var(--gut);top:calc(var(--H)*.22);right:var(--gut);display:flex;align-items:flex-end;gap:clamp(28px,4vw,56px);
  transform:rotate(.8deg);transform-origin:0 100%}
.pb-book{display:block;width:min(260px,28vw);aspect-ratio:3/4;text-decoration:none;flex:none;
  transform:rotate(-3.5deg)}
.pb-bk{display:block;width:100%;height:100%;background:#2a2620;box-shadow:
  calc(var(--sx,.57)*3px) calc(var(--sy,.82)*4px + 2px) 24px rgba(8,6,4,.5),
  inset -1px 0 0 rgba(255,255,255,.06)}
.pb-bkc{display:block;width:100%;height:100%}
.pb-bkc canvas,.pb-bkc img{display:block;width:100%;height:100%;object-fit:cover}
.pb-endtx{flex:1;max-width:22em;padding-bottom:clamp(12px,2vh,28px)}
.pb-endtx .pb-h2{margin:0 0 .35em;font-size:clamp(36px,5vw,72px)}
.pb-endtx .pb-p{position:static;width:auto}
.pb-voyage{margin-top:18px}
.pb-more{display:flex;gap:18px;margin-top:18px}
.pb-more a{color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--guide);padding-bottom:.15em}
.pb-more a:hover{color:var(--ink);border-bottom-color:var(--ink)}

.pb-vig{position:absolute;inset:0;z-index:4;pointer-events:none;
  background:linear-gradient(90deg,rgba(18,18,20,.42),transparent 18%,transparent 82%,rgba(18,18,20,.42))}

.pb-rail{display:none !important}

@media (max-width:820px){
  .pb-field.f-cloth,.pb-field.f-plates,.pb-field.f-end{margin-left:-6vw;transform:none}
  .pb-h1{top:calc(var(--H)*.10);white-space:normal;max-width:calc(var(--S) - 2*var(--gut));font-size:clamp(56px,16vw,96px);transform:none}
  .pb-show{left:auto;right:var(--gut);top:auto;bottom:calc(var(--H)*.28);width:min(200px,46vw);transform:rotate(1.5deg)}
  .pb-lede{bottom:calc(var(--H)*.08);width:calc(var(--S) - 2*var(--gut));font-size:clamp(18px,4vw,26px);transform:none}
  .pb-island{position:relative;left:var(--gut);top:calc(var(--H)*.2);width:calc(100% - 2*var(--gut));grid-template-columns:1fr;gap:20px}
  .pb-h2-drift{transform:none;top:calc(var(--H)*.12)}
  .pb-plates{flex-wrap:wrap;max-width:calc(100% - 2*var(--gut))}
  .pb-plate:nth-child(n){transform:none}
  .pb-end-band{flex-direction:column;align-items:flex-start;top:calc(var(--H)*.18);transform:none}
  .pb-book{width:min(200px,42vw);transform:rotate(-1.5deg)}
}
@media (min-width:1100px){
  .pb-h1{max-width:calc(var(--fw-land) - var(--gut) - min(32vw,360px) - 48px)}
}
@media (prefers-reduced-motion:reduce){
  .pb-h1,.pb-lede,.pb-show{opacity:1 !important;transition:none !important}
  .pb-field.f-cloth,.pb-field.f-plates,.pb-field.f-end,.pb-show,.pb-h1,.pb-lede,.pb-macro,.pb-book,.pb-end-band,.pb-h2-drift{transform:none !important}
  .pb-plate:nth-child(n){transform:none !important}
}
