.nxpf{--nxpf-bg:#eef0f3;--nxpf-page:#fff;--nxpf-ink:#1f2328;--nxpf-control:#fff;--nxpf-control-bg:rgba(22,25,29,.82);width:100%;margin:1.5rem auto;position:relative;color:var(--nxpf-ink);contain:layout style}.nxpf__stage{display:grid;place-items:center;width:100%;background:var(--nxpf-bg);padding:clamp(10px,2.4vw,30px);box-sizing:border-box;overflow:visible}.nxpf__book{position:relative;width:100%;max-width:1200px;perspective:2200px;transform-style:preserve-3d;touch-action:pan-y;user-select:none;flex:0 0 auto}.nxpf__page{position:absolute;top:0;margin:0;background:var(--nxpf-page);overflow:hidden;backface-visibility:hidden;display:none}.nxpf__page img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.nxpf[data-fit="cover"] .nxpf__page img{object-fit:cover}.nxpf__page.is-left,.nxpf__page.is-right,.nxpf__page.is-single{display:block}.nxpf__page.is-left{left:0;width:50%;height:100%;transform-origin:right center;box-shadow:-14px 16px 38px rgba(20,24,31,.16)}.nxpf__page.is-right{left:50%;width:50%;height:100%;transform-origin:left center;box-shadow:14px 16px 38px rgba(20,24,31,.16)}.nxpf__page.is-single{left:0;width:100%;height:100%;transform-origin:left center;box-shadow:0 16px 42px rgba(20,24,31,.18)}.nxpf__page.is-turn-under{z-index:1}.nxpf__page.is-turn-static{z-index:2}.nxpf__page.is-left::after,.nxpf__page.is-right::after{content:"";position:absolute;top:0;bottom:0;width:7%;pointer-events:none;z-index:2;opacity:.62}.nxpf__page.is-left::after{right:0;background:linear-gradient(to left,rgba(12,15,20,.16),rgba(12,15,20,.045) 38%,transparent)}.nxpf__page.is-right::after{left:0;background:linear-gradient(to right,rgba(12,15,20,.16),rgba(12,15,20,.045) 38%,transparent)}
.nxpf__turner{position:absolute;top:0;left:50%;width:50%;height:100%;display:none;transform-origin:left center;transform-style:preserve-3d;z-index:20}.nxpf__turner-face,.nxpf__turner-back{position:absolute;inset:0;background:var(--nxpf-page) center/contain no-repeat;box-shadow:none;backface-visibility:hidden}.nxpf__turner-back{transform:rotateY(180deg)}.nxpf__turner-face::after,.nxpf__turner-back::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.44}.nxpf.is-turning-next .nxpf__turner-face::after{background:linear-gradient(to left,rgba(0,0,0,.03),rgba(0,0,0,.18))}.nxpf.is-turning-next .nxpf__turner-back::after{background:linear-gradient(to right,rgba(0,0,0,.18),rgba(0,0,0,.03))}.nxpf.is-turning-prev .nxpf__turner-face::after{background:linear-gradient(to right,rgba(0,0,0,.03),rgba(0,0,0,.18))}.nxpf.is-turning-prev .nxpf__turner-back::after{background:linear-gradient(to left,rgba(0,0,0,.18),rgba(0,0,0,.03))}.nxpf__turner.is-active{display:block;animation:nxpfFlipNext .46s cubic-bezier(.52,.05,.22,1) forwards}.nxpf__turner.is-prev{display:block;left:0;transform-origin:right center;animation:nxpfFlipPrev .46s cubic-bezier(.52,.05,.22,1) forwards}.nxpf__book.is-single .nxpf__turner{left:0;width:100%}
.nxpf__controls{display:flex;justify-content:center;align-items:center;gap:8px;padding:10px 0;flex-wrap:wrap}.nxpf__btn{appearance:none;border:0;border-radius:999px;min-width:38px;height:38px;padding:0 12px;display:inline-grid;place-items:center;background:var(--nxpf-control-bg);color:var(--nxpf-control);font:600 20px/1 system-ui,sans-serif;text-decoration:none;cursor:pointer}.nxpf__btn:hover{filter:brightness(1.08);color:var(--nxpf-control)}.nxpf__btn:disabled{opacity:.35;cursor:default}.nxpf__counter{font:600 12px/1 system-ui,sans-serif;min-width:64px;text-align:center}.nxpf.is-buffering .nxpf__next:not(:disabled),.nxpf.is-buffering .nxpf__prev:not(:disabled){opacity:.55}.nxpf__zoom-open svg{display:block;pointer-events:none}
.nxpf--editorial{--nxpf-bg:#f3efe7;--nxpf-ink:#171717}.nxpf--editorial .nxpf__stage{border:1px solid rgba(78,60,39,.12)}.nxpf--dark{--nxpf-bg:#14171b;--nxpf-ink:#e9edf2;--nxpf-control-bg:#f1f3f5;--nxpf-control:#111;--nxpf-page:#111418}.nxpf--minimal{--nxpf-bg:transparent}.nxpf--minimal .nxpf__stage{padding:6px}.nxpf:fullscreen{background:var(--nxpf-bg);display:grid;grid-template-rows:1fr auto;padding:0}.nxpf:fullscreen .nxpf__stage{height:calc(100vh - 60px)}.nxpf:fullscreen .nxpf__book{max-width:none}.nxpf-empty-front{padding:14px;border:1px dashed #ccd0d4;background:#f6f7f7}
@keyframes nxpfFlipNext{0%{transform:rotateY(0)}100%{transform:rotateY(-180deg)}}@keyframes nxpfFlipPrev{0%{transform:rotateY(0)}100%{transform:rotateY(180deg)}}

/* StPageFlip base styles, locally scoped in our stylesheet. */
.stf__parent{position:relative;display:block;box-sizing:border-box;transform:translateZ(0);-ms-touch-action:pan-y;touch-action:pan-y}.stf__wrapper{position:relative;width:100%;box-sizing:border-box}.stf__parent canvas{position:absolute;width:100%;height:100%;left:0;top:0}.stf__block{position:absolute;width:100%;height:100%;box-sizing:border-box;perspective:2000px}.stf__item{display:none;position:absolute;transform-style:preserve-3d}.stf__outerShadow,.stf__innerShadow,.stf__hardShadow,.stf__hardInnerShadow{position:absolute;left:0;top:0}

/* 1.3: real page curl engine. Crucially: no segmented strips. */
.nxpf--realistic-engine .nxpf__book{perspective:none;transform-style:flat;overflow:visible}.nxpf--realistic-engine .nxpf__turner{display:none!important}.nxpf--realistic-engine .nxpf__page{display:none;background:transparent;box-shadow:none!important;backface-visibility:visible}.nxpf--realistic-engine .nxpf__page::before,.nxpf--realistic-engine .nxpf__page::after{display:none!important}.nxpf--realistic-engine .nxpf__page img{width:100%;height:100%;object-fit:contain;background:transparent}.nxpf--realistic-engine[data-fit="cover"] .nxpf__page img{object-fit:cover}.nxpf--realistic-engine .stf__item.nxpf__page{display:none}.nxpf--realistic-engine .stf__item.nxpf__page[style*="display: block"],.nxpf--realistic-engine .stf__item.nxpf__page[style*="display:block"]{display:block}.nxpf--realistic-engine .stf__block{background:transparent}.nxpf--realistic-engine .stf__outerShadow,.nxpf--realistic-engine .stf__innerShadow,.nxpf--realistic-engine .stf__hardShadow,.nxpf--realistic-engine .stf__hardInnerShadow{pointer-events:none}.nxpf--realistic-engine.is-page-folding .nxpf__book{cursor:grabbing}.nxpf--realistic-engine:not(.is-page-folding) .nxpf__book{cursor:grab}

@media(max-width:720px){.nxpf__stage{padding:10px}.nxpf__controls{padding:8px 0}.nxpf__btn{min-width:36px;height:36px}.nxpf__counter{min-width:54px}.nxpf--realistic-engine .nxpf__book{touch-action:pan-y}}
@media(prefers-reduced-motion:reduce){.nxpf__turner.is-active,.nxpf__turner.is-prev{animation-duration:.01ms}}

/* 1.5: independent commercial-reader style zoom viewer. */
html.nxpf-zoomview-open,body.nxpf-zoomview-open{overflow:hidden!important}
.nxpf-zoomview{position:fixed;inset:0;z-index:2147483000;display:none;grid-template-rows:auto minmax(0,1fr);background:rgba(8,10,13,.96);color:#f7f8fa;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overscroll-behavior:none}
.nxpf-zoomview.is-open{display:grid}
.nxpf-zoomview__topbar{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;min-height:58px;padding:8px 14px;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(14,17,21,.94);backdrop-filter:blur(12px);box-sizing:border-box}
.nxpf-zoomview__nav,.nxpf-zoomview__tools{display:flex;align-items:center;gap:7px}
.nxpf-zoomview__tools{justify-content:center}
.nxpf-zoomview__nav{justify-content:flex-start}
.nxpf-zoomview__page{min-width:68px;text-align:center;font:650 12px/1 system-ui,sans-serif;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.82)}
.nxpf-zoomview__btn,.nxpf-zoomview__close,.nxpf-zoomview__value,.nxpf-zoomview__native{appearance:none;border:0;color:#fff;background:rgba(255,255,255,.09);cursor:pointer;display:inline-grid;place-items:center;box-sizing:border-box}
.nxpf-zoomview__btn{width:36px;height:36px;border-radius:50%;font:500 22px/1 system-ui,sans-serif}
.nxpf-zoomview__btn:hover,.nxpf-zoomview__close:hover,.nxpf-zoomview__value:hover,.nxpf-zoomview__native:hover{background:rgba(255,255,255,.16)}
.nxpf-zoomview__btn:disabled{opacity:.28;cursor:default}
.nxpf-zoomview__close{justify-self:end;width:40px;height:40px;border-radius:50%;font:300 30px/1 system-ui,sans-serif}
.nxpf-zoomview__value,.nxpf-zoomview__native{height:34px;padding:0 11px;border-radius:8px;font:650 11px/1 system-ui,sans-serif;white-space:nowrap}
.nxpf-zoomview__native{background:transparent;border:1px solid rgba(255,255,255,.16)}
.nxpf-zoomview__range{--nxpf-zv-progress:25%;appearance:none;-webkit-appearance:none;width:min(22vw,180px);height:28px;margin:0 2px;background:transparent;cursor:pointer}
.nxpf-zoomview__range::-webkit-slider-runnable-track{height:3px;border-radius:20px;background:rgba(255,255,255,.28)}
.nxpf-zoomview__range::-moz-range-track{height:3px;border-radius:20px;border:0;background:rgba(255,255,255,.28)}
.nxpf-zoomview__range::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5.5px;border:2px solid #11161b;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.4)}
.nxpf-zoomview__range::-moz-range-thumb{width:12px;height:12px;border:2px solid #11161b;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.4)}
.nxpf-zoomview__viewport{position:relative;min-width:0;min-height:0;overflow:auto;padding:28px;box-sizing:border-box;overscroll-behavior:contain;scrollbar-color:rgba(255,255,255,.32) transparent;touch-action:pan-x pan-y;cursor:grab;display:block}
.nxpf-zoomview.is-panning .nxpf-zoomview__viewport{cursor:grabbing}
.nxpf-zoomview__canvas{position:relative;display:block;margin:auto;min-width:1px;min-height:1px;box-shadow:0 22px 70px rgba(0,0,0,.48);background:#fff;transform:translateZ(0)}
.nxpf-zoomview__image{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none}
.nxpf-zoomview__loader{position:fixed;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;display:none;place-items:center;background:rgba(0,0,0,.64);pointer-events:none}
.nxpf-zoomview.is-loading .nxpf-zoomview__loader{display:grid}
.nxpf-zoomview__loader span{width:20px;height:20px;border:2px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:nxpfZoomSpin .65s linear infinite}
@keyframes nxpfZoomSpin{to{transform:rotate(360deg)}}
@media(max-width:720px){
  .nxpf-zoomview__topbar{grid-template-columns:auto 1fr auto;gap:8px;padding:7px 8px;min-height:54px}
  .nxpf-zoomview__nav .nxpf-zoomview__btn{display:none}
  .nxpf-zoomview__page{min-width:48px;font-size:11px}
  .nxpf-zoomview__tools{gap:4px;justify-self:center}
  .nxpf-zoomview__range{display:none}
  .nxpf-zoomview__native{display:none}
  .nxpf-zoomview__value{padding:0 9px;min-width:62px}
  .nxpf-zoomview__btn{width:34px;height:34px}
  .nxpf-zoomview__close{width:36px;height:36px}
  .nxpf-zoomview__viewport{padding:14px 10px 22px}
}
@media(prefers-reduced-motion:reduce){.nxpf-zoomview__loader span{animation-duration:1.2s}}


/* 1.5.3: optional open-book depth.
   In Realistic mode the shading belongs to each physical page, not to an overlay above
   the whole book. StPageFlip therefore clips/transforms it together with the page and
   a turning sheet naturally occludes the shadow underneath. */
.nxpf[data-open-shadow="0"] .nxpf__page.is-left,
.nxpf[data-open-shadow="0"] .nxpf__page.is-right,
.nxpf[data-open-shadow="0"] .nxpf__page.is-single{box-shadow:none}
.nxpf[data-open-shadow="0"] .nxpf__page.is-left::after,
.nxpf[data-open-shadow="0"] .nxpf__page.is-right::after{opacity:0}
.nxpf[data-open-shadow="1"] .nxpf__page.is-left{box-shadow:-8px 10px 24px rgba(20,24,31,.11)}
.nxpf[data-open-shadow="1"] .nxpf__page.is-right{box-shadow:8px 10px 24px rgba(20,24,31,.11)}
.nxpf[data-open-shadow="1"] .nxpf__page.is-single{box-shadow:0 10px 28px rgba(20,24,31,.12)}
.nxpf[data-open-shadow="1"] .nxpf__page.is-left::after,
.nxpf[data-open-shadow="1"] .nxpf__page.is-right::after{opacity:.42}

/* Remove the old spread-wide overlay completely. It sat above StPageFlip pages and
   could be seen through a sheet while it was curling. */
.nxpf--realistic-engine .stf__wrapper::after{content:none!important}

/* Page-local depth for StPageFlip. These pseudo-elements live inside the clipped page,
   so the turning page always covers the stationary page beneath it. */
.nxpf--realistic-engine .stf__item.nxpf__page::after{
  content:""!important;
  display:block!important;
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  opacity:0;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.nxpf[data-open-shadow="1"].nxpf--realistic-engine .stf__item.nxpf__page.--left::after{
  opacity:1;
  background:
    linear-gradient(to left,rgba(10,14,18,.105) 0,rgba(10,14,18,.042) 2.2%,rgba(10,14,18,.012) 5.2%,transparent 9.5%),
    linear-gradient(to right,rgba(10,14,18,.032),transparent 2.4%);
}
.nxpf[data-open-shadow="1"].nxpf--realistic-engine .stf__item.nxpf__page.--right::after{
  opacity:1;
  background:
    linear-gradient(to right,rgba(10,14,18,.105) 0,rgba(10,14,18,.042) 2.2%,rgba(10,14,18,.012) 5.2%,transparent 9.5%),
    linear-gradient(to left,rgba(10,14,18,.032),transparent 2.4%);
}
.nxpf[data-open-shadow="0"].nxpf--realistic-engine .stf__item.nxpf__page::after{opacity:0!important}

/* 1.5.1: fullscreen is always contain and keeps controls in a dedicated row. */
.nxpf:fullscreen{
  width:100vw;
  height:100vh;
  height:100dvh;
  max-width:none;
  max-height:none;
  margin:0;
  padding:0;
  overflow:hidden;
  contain:none;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  background:var(--nxpf-bg)
}
.nxpf:fullscreen .nxpf__stage{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  padding:clamp(10px,2vw,26px);
  overflow:visible;
  box-sizing:border-box
}
.nxpf:fullscreen .nxpf__book{max-width:none;margin:auto}
.nxpf:fullscreen .nxpf__page img{object-fit:contain!important}
.nxpf:fullscreen .nxpf__turner-face,.nxpf:fullscreen .nxpf__turner-back{background-size:contain!important}
.nxpf:fullscreen .nxpf__controls{
  position:relative;
  z-index:200;
  flex:0 0 auto;
  width:100%;
  min-height:56px;
  margin:0;
  padding:8px max(12px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  box-sizing:border-box;
  background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.08))
}
@media(max-width:720px){
  .nxpf:fullscreen .nxpf__stage{padding:8px}
  .nxpf:fullscreen .nxpf__controls{min-height:52px;padding-top:6px}
}
