/* A shared decorative interlude for navigation between documents. */
.page-transition{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:var(--cream);color:var(--purple);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s;isolation:isolate}
.page-transition::before{content:'';position:absolute;width:min(600px,100vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--lavender),transparent 70%);z-index:-1}
.page-transition.is-active{opacity:1;visibility:visible;pointer-events:auto}
.transition-art{position:relative;width:100px;height:80px;perspective:500px}
.transition-book{position:absolute;inset:8px 0;background:var(--cream);border:3px solid var(--purple);border-radius:5px 10px 10px 5px;box-shadow:0 6px 0 #44406b15;transform:rotate(-8deg)}
.transition-book::before{content:'';position:absolute;top:0;bottom:0;left:50%;width:1px;background:#44406b40}
.transition-book::after{content:'';position:absolute;top:12px;left:12px;width:23px;height:2px;background:#44406b40;box-shadow:0 9px 0 #44406b40,0 18px 0 #44406b40}
.transition-page{position:absolute;top:0;left:50%;width:50%;height:100%;background:var(--lavender);border:1px solid #44406b40;border-radius:0 7px 7px 0;transform-origin:left center}
.transition-spark{position:absolute;right:-26px;top:-12px;font-size:30px}
.page-transition.is-active .transition-page{animation:transition-page-turn .8s ease-in-out infinite;animation-delay:var(--turn-phase,0s)}
.page-transition.is-active .transition-spark{animation:transition-spark-pop .9s ease-in-out infinite;animation-delay:var(--spark-phase,0s)}
.transition-caption{font-family:var(--serif);font-style:italic;font-size:21px;text-align:center;padding:0 20px}
@keyframes transition-page-turn{0%,10%{transform:rotateY(0deg)}90%,100%{transform:rotateY(-180deg)}}
@keyframes transition-spark-pop{0%,100%{transform:scale(.8) rotate(-15deg);opacity:.5}50%{transform:scale(1.2) rotate(15deg);opacity:1}}
@media(prefers-reduced-motion:reduce){.page-transition{display:none}.transition-page,.transition-spark{animation:none!important}}
