/* Personal passport: a CSS 3D book. Page content is real text sized to the page (cqw), independent of its decoration. */
.pp-passport{--ink:#3a1c6b;--soft-ink:#8b76b6;--paper:#fbf6ee;--pill:#e5e8f7;--purple:#7b4fc4;--turn-d:.9s;--ease:cubic-bezier(.45,.05,.25,1);--turn:var(--turn-d) var(--ease);color:var(--ink);padding:3px 8px 18px;max-width:1120px;margin:auto}
.pp-heading{display:flex;align-items:center;gap:12px;margin-bottom:20px}.pp-heading h2{margin:0 0 5px;font-size:clamp(22px,2.4vw,32px);color:#4e2271}.pp-heading p{margin:0;color:#a08bac;font-size:13px}.pp-heading-icon{font-size:32px;background:#f1e7ff;border-radius:16px;padding:9px}
.pp-partial{margin:0 0 6px;padding:8px 12px;border-radius:10px;background:#fff6e0;color:#7a5410;font-size:12px;text-align:center}
.pp-unavailable{display:flex;align-items:center;justify-content:center;gap:10px;padding:22px 12px;color:#7d6a92;font-size:13px}.pp-unavailable p{margin:0}
.pp-accessible{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden}

/* Stage and book */
.pp-stage{container-type:inline-size;display:grid;justify-items:center;padding:18px 0 34px;perspective:2600px;overflow-x:clip;touch-action:pan-y;background:radial-gradient(ellipse 60% 55% at 50% 50%,#ece1fa80,transparent 70%)}
.pp-book{position:relative;width:min(880px,94cqw);aspect-ratio:2746/2048;transform-style:preserve-3d;transition:transform var(--turn);user-select:none;-webkit-user-select:none}
.pp-book::after{content:'';position:absolute;inset:auto 4% -22px;transition:inset var(--turn);height:34px;border-radius:50%;background:radial-gradient(ellipse at center,#3b1a5a38,transparent 70%);pointer-events:none;transform:translateZ(-2px)}
.pp-book:not(.is-mobile)[data-state=closed]::after{inset-inline:53% 3%}.pp-book:not(.is-mobile)[data-state=end]::after{inset-inline:3% 53%}
.pp-passport[dir=rtl] .pp-book:not(.is-mobile)[data-state=closed],.pp-passport[dir=ltr] .pp-book:not(.is-mobile)[data-state=end]{transform:translateX(25%)}
.pp-passport[dir=ltr] .pp-book:not(.is-mobile)[data-state=closed],.pp-passport[dir=rtl] .pp-book:not(.is-mobile)[data-state=end]{transform:translateX(-25%)}
/* Each leaf turns by --pp-angle (0deg flat on the reading side, 180deg turned over). Dragging sets it inline; otherwise
   .is-turned decides it. Where the browser can animate a registered custom property (.is-smooth, see the script),
   the angle itself is animated so the shading below can follow it; elsewhere the transform is animated. Hidden
   leaves wait --pp-hide before disappearing, so nothing vanishes while a turn is still moving. */
.pp-leaf{--pp-z:calc(var(--pp-depth,0)*.6px);--pp-sign:1;--pp-angle:0deg;--pp-hide:0s;position:absolute;top:0;width:50%;height:100%;transform-style:preserve-3d;
 transform:translateZ(var(--pp-z)) rotateY(calc(var(--pp-angle)*var(--pp-sign)));
 transition-property:var(--pp-motion,transform),visibility;transition-duration:var(--turn-d),0s;transition-timing-function:var(--ease),linear;transition-delay:0s,var(--pp-hide)}
.pp-book.is-smooth .pp-leaf{--pp-motion:--pp-angle}
.pp-leaf.is-turned{--pp-angle:180deg}
.pp-leaf.is-dragging{transition:none;visibility:visible!important}
.pp-passport[dir=rtl] .pp-leaf{left:0;transform-origin:100% 50%}
.pp-passport[dir=ltr] .pp-leaf{--pp-sign:-1;right:0;transform-origin:0 50%}
.pp-face{position:absolute;inset:0;overflow:hidden;container-type:size;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--paper)}
.pp-back{transform:rotateY(180deg)}
.pp-passport[dir=rtl] .pp-front,.pp-passport[dir=ltr] .pp-back{border-radius:9px 2px 2px 9px}
.pp-passport[dir=ltr] .pp-front,.pp-passport[dir=rtl] .pp-back{border-radius:2px 9px 9px 2px}
.pp-face[data-kind=cover]{border-radius:0;background:transparent;cursor:pointer}
/* The shadow is a blurred rounded layer under the photo, placed on the leather's measured edges (front: 1.53/1.38/1.32/2.44%,
   back: 2.85/2.46/1.46/1.58% of the photo). Filters or a second mask on the 3D face break software rendering. */
.pp-face[data-kind=cover],.pp-face[data-kind=back]{overflow:visible}
.pp-cover-shadow{position:absolute;inset:-.6% -.7% 0 -.6%;border-radius:4cqw;background:#2b104a;opacity:.36;transform:translateY(1.4cqw);filter:blur(1.8cqw);pointer-events:none}
/* The cover photos sit on a white studio background. A mask built from each photo's leather outline
   (scripts/build_passport_cover_masks.py) hides that background; the photo files themselves stay untouched. */
/* Like a real book, the covers overhang the pages: once masked, the leather is 1.3-2.4% smaller than the photo, so it
   is scaled (uniformly, about the leather's centre) until it fully covers the leaf. Otherwise the page beneath shows
   as a pale frame around a cover while it closes. */
.pp-cover-image{position:relative;display:block;width:100%;height:100%;transform:scale(1.045);transform-origin:50.07% 49.44%;-webkit-mask:url(passport-cover-mask.png) center/100% 100% no-repeat;mask:url(passport-cover-mask.png) center/100% 100% no-repeat}
.pp-book.is-mobile{width:min(380px,92cqw);aspect-ratio:1373/2048}
.pp-book.is-mobile .pp-leaf{left:0;right:auto;width:100%}
.pp-book.is-mobile .pp-leaf.is-turned{visibility:hidden;--pp-hide:var(--turn-d)}
/* A single-page view has nothing on a page's reverse, so a leaf vanishes once it turns past edge-on instead of
   swinging out beside the book as a blank strip. */
.pp-book.is-mobile .pp-back{visibility:hidden}

/* Binding: one leather spine joins the front and back covers. It sits beneath every leaf, so an open spread shows
   it only as the bound edge above and below the gutter. */
.pp-spine{position:absolute;top:-1.1%;bottom:-1.1%;left:50%;width:2.4%;transform:translateX(-50%) translateZ(0);border-radius:7px;pointer-events:none;
 background:repeating-linear-gradient(0deg,#ffffff06 0 2px,transparent 2px 5px),linear-gradient(90deg,#240b40,#4b1d78 22%,#6a34a2 50%,#4b1d78 78%,#240b40);
 box-shadow:0 10px 18px #2a0f4640,inset 0 0 0 1px #1d0835}
.pp-spine::before,.pp-spine::after{content:'';position:absolute;top:1.4%;bottom:1.4%;width:0;border-left:1px dashed #b58fdc66}
.pp-spine::before{left:22%}.pp-spine::after{right:22%}
/* A closed book shows its cover alone: the spine and the leaves beneath it are hidden. The leaves hide only after
   the closing turn ends (and reappear at once when opening), so nothing pops out while a cover is moving. */
.pp-book[data-state=closed] .pp-spine,.pp-book[data-state=end] .pp-spine{visibility:hidden}
.pp-book[data-state=closed] .pp-leaf:not([data-pp-leaf="0"]),.pp-book[data-state=end] .pp-leaf:not(:last-child){visibility:hidden;--pp-hide:var(--turn-d)}
.pp-book.is-mobile .pp-spine{width:5%}
.pp-passport[dir=rtl] .pp-book.is-mobile .pp-spine{left:97.5%;transform:translateZ(0)}
.pp-passport[dir=ltr] .pp-book.is-mobile .pp-spine{left:-2.5%;transform:translateZ(0)}


/* Turning by hand: an outer-edge strip turns the page when pressed, and lifts it a little under a mouse.
   The single-page view also has a strip on the spine side to go back. */
.pp-stage:focus-visible{outline:2px solid #9a6fdc;outline-offset:6px;border-radius:12px}
.pp-book{cursor:grab}.pp-book:has(.is-dragging){cursor:grabbing}
.pp-edge{position:absolute;top:0;bottom:0;width:13%;z-index:4;cursor:pointer}
.pp-passport[dir=rtl] .pp-front .pp-edge,.pp-passport[dir=ltr] .pp-back .pp-edge{left:0}
.pp-passport[dir=ltr] .pp-front .pp-edge,.pp-passport[dir=rtl] .pp-back .pp-edge{right:0}
.pp-passport[dir=rtl] .pp-front .pp-edge-in{left:auto;right:0}.pp-passport[dir=ltr] .pp-front .pp-edge-in{right:auto;left:0}
.pp-edge-in,.pp-back .pp-edge-in{display:none}.pp-book.is-mobile .pp-front .pp-edge-in{display:block;width:9%}
@media(hover:hover) and (pointer:fine){
 .pp-book[data-state=open] .pp-leaf:not(.is-turned):not(.is-dragging):has(>.pp-front>.pp-edge:not(.pp-edge-in):hover){--pp-angle:11deg}
 .pp-book[data-state=open]:not(.is-mobile) .pp-leaf.is-turned:not(.is-dragging):has(.pp-edge:not(.pp-edge-in):hover){--pp-angle:169deg}
}

/* Light follows the turn: a page darkens from its spine as it lifts and casts a soft shadow, both strongest edge-on
   (sin of the turn angle). Covers keep their photo untouched. Without an animatable angle this simply stays off. */
.pp-shade{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:calc(sin(var(--pp-angle))*.95)}
.pp-passport[dir=rtl] .pp-front .pp-shade,.pp-passport[dir=ltr] .pp-back .pp-shade{background:linear-gradient(to left,#26103f5c,#26103f24 35%,#26103f0a 70%,transparent)}
.pp-passport[dir=ltr] .pp-front .pp-shade,.pp-passport[dir=rtl] .pp-back .pp-shade{background:linear-gradient(to right,#26103f5c,#26103f24 35%,#26103f0a 70%,transparent)}
.pp-face:not([data-kind=cover]):not([data-kind=back]){box-shadow:0 0 calc(sin(var(--pp-angle))*26px) rgb(36 16 64/calc(sin(var(--pp-angle))*.3))}

/* Paper */
.pp-face-inner{position:absolute;inset:0}
.pp-paper{background:radial-gradient(ellipse 70% 45% at 70% 30%,#e9e6fb99,transparent 70%),radial-gradient(ellipse 90% 60% at 30% 100%,#efe4f6aa,transparent 70%),var(--paper)}
.pp-paper::after{content:'';position:absolute;inset:0;pointer-events:none}
.pp-passport[dir=rtl] .pp-front .pp-paper::after,.pp-passport[dir=ltr] .pp-back .pp-paper::after{background:linear-gradient(to left,#5c3d2a24,#5c3d2a08 6%,transparent 14%)}
.pp-passport[dir=ltr] .pp-front .pp-paper::after,.pp-passport[dir=rtl] .pp-back .pp-paper::after{background:linear-gradient(to right,#5c3d2a24,#5c3d2a08 6%,transparent 14%)}
.pp-book.is-mobile .pp-face .pp-paper::after{background:linear-gradient(to left,#5c3d2a1c,transparent 7%)}
.pp-passport[dir=ltr] .pp-book.is-mobile .pp-face .pp-paper::after{background:linear-gradient(to right,#5c3d2a1c,transparent 7%)}
.pp-art{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#b8a9df;stroke-width:1;opacity:.5;pointer-events:none}
.pp-art-planet,.pp-art-hills{stroke:#b3a2dc;stroke-width:1.6}.pp-art-stars{fill:#c8b9ea;stroke:none}
.pp-page-body{position:relative;box-sizing:border-box;height:100%;display:flex;flex-direction:column;gap:4cqw;padding:9cqw 8cqw 12cqw}
.pp-page-head{text-align:center}
.pp-page-head h3{display:flex;align-items:center;justify-content:center;gap:2.4cqw;margin:0;font-size:7.6cqw;line-height:1.35;font-weight:700;color:var(--ink)}
.pp-page-head p{margin:1cqw 0 0;font-size:3.6cqw;color:var(--soft-ink)}
.pp-code-icon{font:600 6cqw Inter,sans-serif;color:#8d74c9;letter-spacing:-.04em}
.pp-folio{position:absolute;inset:auto 8cqw 4.5cqw;display:flex;justify-content:space-between;font-size:2.7cqw;color:#775e9a}

/* Identity */
.pp-identity{display:grid;grid-template-columns:minmax(0,1fr) 37cqw;gap:5cqw;align-items:start;margin-top:3cqw}
.pp-fields{margin:0}.pp-fields dt{font-size:3.6cqw;font-weight:600;color:#6c5b8f}
.pp-fields dd{margin:1.2cqw 0 3.6cqw;padding:2.1cqw 3.4cqw;border-radius:2.6cqw;background:var(--pill);font-size:4.4cqw;font-weight:700;color:#2b1a4c;line-height:1.45;overflow-wrap:anywhere}
.pp-photo{margin:0;display:grid;justify-items:center}
.pp-photo-frame{box-sizing:border-box;width:100%;aspect-ratio:3/4;padding:2.4cqw;background:#ece4d6;border-radius:1.4cqw;box-shadow:0 1.2cqw 2.6cqw #5a3f2a2e,inset 0 0 0 1.1cqw #f6f0e5;outline:.5cqw dashed #c9b99f;outline-offset:-1.8cqw;display:grid;place-items:center;overflow:hidden}
.pp-photo-frame img{width:100%;height:100%;object-fit:cover;border-radius:.8cqw}.pp-photo-frame span{font-size:16cqw;font-weight:700;color:#b08ac6}
.pp-photo figcaption{position:relative;margin-top:-4.6cqw;padding:1.3cqw 3.4cqw;border-radius:2cqw;background:var(--purple);color:#fff;font-size:3.2cqw;font-weight:600;white-space:nowrap;box-shadow:0 .8cqw 1.8cqw #4b238a40}
.pp-stats{list-style:none;margin:0;padding:0;display:grid;gap:2cqw;font-size:3.8cqw;color:#4d3a73}
.pp-stats li{display:flex;align-items:center;gap:2cqw}.pp-stats b{font-size:5cqw;color:var(--ink)}
.pp-stats span{display:inline-grid;place-items:center;width:5.4cqw;height:5.4cqw;border-radius:1.2cqw;background:#e6defa;color:var(--purple);font-size:3.2cqw}
.pp-motto{margin:auto 0 0;text-align:center;font-size:3.4cqw;color:#8a76ad}

/* Stamps */
.pp-head-planet{font-size:6cqw;filter:grayscale(.6)}
.pp-stamps{list-style:none;margin:2cqw 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5cqw 3.5cqw}
.pp-stamps li:nth-child(7){grid-column:2}
.pp-stamp{position:relative;aspect-ratio:1;border-radius:50%;text-align:center;box-sizing:border-box}
.pp-stamp-ring{position:absolute;inset:0;width:100%;height:100%}
.pp-stamp-icon{position:absolute;top:13%;left:31%;width:38%;height:38%}.pp-stamp-icon svg{display:block;width:100%;height:100%}
.pp-stamp-text{position:absolute;bottom:20%;left:13%;right:13%;display:grid;justify-items:center;gap:.5cqw}
.pp-stamp b{--base:3.3cqw;font-size:calc(var(--base)*var(--fit,1));line-height:1.15;font-weight:700;white-space:nowrap}.pp-stamp.is-long b{--base:2.45cqw}
.pp-stamp time,.pp-stamp small{font-size:2.15cqw;line-height:1.2;font-weight:700;white-space:nowrap}
.pp-passport[dir=ltr] .pp-stamp-text{left:18%;right:18%}.pp-passport[dir=ltr] .pp-stamp b{--base:2.6cqw;line-height:1.1;white-space:normal}.pp-passport[dir=ltr] .pp-stamp.is-long b{--base:2.35cqw}
.pp-passport[dir=ltr] .pp-stamp.is-long .pp-stamp-icon{top:12%;left:35%;width:30%;height:30%}.pp-passport[dir=ltr] .pp-stamp time,.pp-passport[dir=ltr] .pp-stamp small{font-size:1.95cqw}
/* Earned: inked in its own colour, set at a slight angle and a little translucent, so the paper's lines show through,
   then worn by the speckle overlay. */
.pp-stamp.earned{color:var(--stamp-color);transform:rotate(var(--stamp-angle));opacity:.93}
.pp-stamp.earned .cut{fill:var(--paper)}.pp-stamp.earned .cut-line{fill:none;stroke:var(--paper);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
/* The wear sits under the text: the ring and icon look stamped, while the name and date stay fully legible. */
.pp-stamp-text{z-index:2}.pp-stamp.earned .pp-stamp-text{color:var(--stamp-text,var(--stamp-color))}
.pp-stamp.earned::after{content:'';position:absolute;inset:0;z-index:1;border-radius:50%;pointer-events:none;background:var(--pp-ink-wear,none) var(--wear-x) var(--wear-y)/150% 150%}
.pp-stamp.locked{color:#bbb1ca}.pp-stamp.locked .pp-stamp-text{color:#7a6797}.pp-stamp.locked .pp-stamp-icon{color:#9585ac}.pp-stamp.locked .pp-stamp-icon,.pp-passport[dir=ltr] .pp-stamp.locked.is-long .pp-stamp-icon{top:15%;left:36%;width:28%;height:28%}.pp-stamp.locked b{font-weight:600}

/* Journey stops */
.pp-page-stations{--stop-purple:#6a3db4;--stop-gold:#d6a43c;--stop-ink:#2a1650}
.pp-page-stations::before{content:'';position:absolute;inset:3.4cqw;border:1px dashed #c9bfd6;border-radius:1.6cqw;pointer-events:none}
.pp-art-glyphs{fill:#cdbfe9;stroke:none;font:600 15px Inter,sans-serif;opacity:.75}
.pp-page-stations .pp-page-body{gap:2.6cqw;padding-bottom:11cqw}
.pp-page-stations .pp-page-head p{color:#7a52c2;font-weight:500}
.pp-compass{width:9.5cqw;height:auto;flex:none}
.pp-journey-total{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1.6cqw 3cqw;padding:2.2cqw 3cqw 2.2cqw;border-radius:3.4cqw;background:linear-gradient(180deg,#f4eefd,#ebe1fb);border:.55cqw solid #a985dc;box-shadow:0 0 0 1cqw #f5effd,0 0 0 1.4cqw #c6aee9,0 1.8cqw 3cqw #5d389924}
.pp-journey-count{display:flex;align-items:baseline;gap:2.4cqw;min-width:0}
.pp-journey-count strong{font-size:7.4cqw;line-height:1;font-weight:700;color:var(--stop-ink);white-space:nowrap}
.pp-journey-count span{font-size:3.4cqw;color:#4a3870}
.pp-journey-percent{display:grid;place-items:center;min-width:19cqw;padding:2.4cqw 2.6cqw;border-radius:2.2cqw;font-size:6.2cqw;font-weight:700;line-height:1;color:#fff;
 background:radial-gradient(circle at 18% 28%,#ffd86b 0 .35cqw,transparent .5cqw),radial-gradient(circle at 82% 22%,#fff 0 .3cqw,transparent .45cqw),radial-gradient(circle at 70% 78%,#ffd86b 0 .3cqw,transparent .45cqw),radial-gradient(circle at 30% 80%,#fff 0 .25cqw,transparent .4cqw),linear-gradient(135deg,#7d4fd0,#4f2397);box-shadow:inset 0 0 0 .4cqw #9b74df}
.pp-journey-bar{grid-column:1/-1;height:1.8cqw;border-radius:1cqw;background:#d9cbf1;overflow:hidden}
.pp-journey-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#9a6fdc,#5e30a8)}
.pp-stops{list-style:none;margin:.6cqw 0 0;padding:0;display:grid;gap:1.5cqw}
.pp-stop{position:relative;display:grid;grid-template-columns:10cqw minmax(0,1fr);gap:3cqw;align-items:center}
.pp-stop:not(:last-child)::after{content:'';position:absolute;inset-inline-start:5cqw;top:calc(50% + 5cqw);height:calc(100% - 10cqw + 1.5cqw);border-inline-start:.55cqw dashed #c9b8e6;transform:translateX(-50%)}
.pp-passport[dir=rtl] .pp-stop:not(:last-child)::after{transform:translateX(50%)}
.pp-stop.done:not(:last-child)::after{border-color:var(--stop-gold)}
.pp-stop-node{position:relative;display:grid;place-items:center;width:10cqw;height:10cqw}
.pp-stop-node svg{width:100%;height:100%;overflow:visible}
.pp-stop.done .pp-stop-node svg{filter:drop-shadow(0 .5cqw .7cqw #3b1a6a40)}
.pp-stop.next .pp-stop-node{box-sizing:border-box;border-radius:50%;background:#e9e5ee;border:.55cqw dashed #bdb4cb}
.pp-stop-number{font-size:3.6cqw;font-weight:700;color:#6b617d}
.pp-stop-lock{position:absolute;inset-inline-start:-1.2cqw;top:50%;width:4.4cqw;height:4.4cqw;transform:translateY(-50%);border-radius:50%;background:var(--paper);color:#8f889b}
.pp-stop-lock svg{width:100%;height:100%}
.pp-stop div{display:grid;min-width:0}
/* Stop text keeps WCAG AA (4.5:1) even on the darkest lavender tint of the paper (#f3eaf3); upcoming stops stay
   muted through weight and a greyer violet rather than through faint ink. */
.pp-stop small{font-size:2.7cqw;line-height:1.3;color:#6f6581}
.pp-stop b{font-size:4.1cqw;line-height:1.3;font-weight:700;color:var(--stop-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pp-stop div>span{font-size:2.9cqw;line-height:1.3;color:#6f6581}
.pp-stop.done div>span{color:var(--stop-purple);font-weight:600}
.pp-stop.current div>span{color:#4a3870}
.pp-stop.next b{color:#6f667d}.pp-stop.next small,.pp-stop.next div>span{color:#6f657e}
.pp-empty{margin:auto 0;text-align:center;font-size:3.8cqw;color:#745ba8}

/* Closing pages */
.pp-end{margin:auto 0;display:grid;justify-items:center;gap:3cqw;text-align:center}/* Faded silver logo on the closing page only: a display filter, the shared logo file stays untouched. */
.pp-end .pp-end-logo{width:30cqw;height:auto;filter:grayscale(1) sepia(.2) brightness(1.32) contrast(.56);opacity:.86}
.pp-end h3{margin:0;font-size:6.4cqw;color:var(--ink)}.pp-end p{margin:0;font-size:3.6cqw;line-height:1.7;color:var(--soft-ink)}
/* Back cover: the original file, never stretched. It is a little wider than the front cover (1792×2400 vs 1373×2048),
   so on desktop it matches the book's height and extends past the outer edge, anchored at the spine. */
.pp-face[data-kind=back]{background:transparent;border-radius:0}
.pp-back-cover-image{position:absolute;top:0;height:100%;width:auto;max-width:none;-webkit-mask:url(passport-back-cover-mask.png) center/100% 100% no-repeat;mask:url(passport-back-cover-mask.png) center/100% 100% no-repeat}
.pp-passport[dir=rtl] .pp-back-cover-image{left:0;transform-origin:2.85% 49.94%;transform:translateX(-3.3%) scale(1.045)}
.pp-passport[dir=ltr] .pp-back-cover-image{right:0;transform-origin:97.54% 49.94%;transform:translateX(3.3%) scale(1.045)}
.pp-book.is-mobile .pp-back-cover-image{inset:0;width:100%;height:100%;object-fit:contain;-webkit-mask-size:contain;mask-size:contain;transform:none}
.pp-face[data-kind=back]:has(img:not([data-loaded])) .pp-cover-shadow{visibility:hidden}
.pp-face[data-kind=back] .pp-cover-shadow{inset:-.6% auto 0 calc(100cqh*1792/2400*-.0045);width:calc(100cqh*1792/2400*.9895)}
.pp-passport[dir=ltr] .pp-face[data-kind=back] .pp-cover-shadow{inset:-.6% calc(100cqh*1792/2400*-.0045) 0 auto}
.pp-book.is-mobile .pp-face[data-kind=back] .pp-cover-shadow{inset:calc(50% - 100cqw*2400/1792*.4848) 2.46% calc(50% - 100cqw*2400/1792*.4848) 2.85%;width:auto}

/* Controls */
body[data-workspace] .pp-passport button{font:inherit;cursor:pointer;transform:none!important;animation:none!important;transition:background-color .15s,border-color .15s!important;line-height:1.6;min-height:44px}
.pp-navigation{display:flex;align-items:center;justify-content:center;gap:18px;margin:8px 0 16px}
.pp-navigation>span{font-size:12px;color:#7a5f8c;min-width:110px;text-align:center}
.pp-navigation button{padding:8px 16px;border-radius:11px;border:1px solid #e1d1f0!important;background:#f9f4ff!important;color:#8c60af!important;font-size:13px!important}
.pp-navigation button:hover:not(:disabled){background:#eee0fc!important}
.pp-navigation button:disabled{opacity:.35;cursor:default!important}
.pp-footnote{margin:0;text-align:center;font-size:12px;color:#7a5f8c}
@media(max-width:700px){.pp-passport{padding:0 3px 14px}.pp-stage{padding:10px 0 26px}.pp-navigation{gap:8px}.pp-navigation button{padding:8px 12px}.pp-navigation>span{font-size:11px;min-width:90px}.pp-footnote{font-size:11px}}
@media(prefers-reduced-motion:reduce){.pp-passport,.pp-leaf{--turn-d:0s}.pp-book{transition:none}}