.book-entrance{background:#f4eee3;animation:book-world-exit 1s 4.55s cubic-bezier(.65,0,.25,1) both;clip-path:none;perspective:1400px;pointer-events:auto}.book-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,#e1cfe066,transparent 55%)}.book-sky>span{position:absolute;color:#b49b7f;font:400 24px Fraunces;animation:twinkle 2s ease-in-out infinite alternate}.book-sky>span:nth-child(1){left:15%;top:22%;font-size:40px}.book-sky>span:nth-child(2){right:18%;top:35%}.book-sky>span:nth-child(3){right:27%;top:14%;animation-delay:.5s}.book-sky>span:nth-child(4){left:22%;bottom:19%;animation-delay:1s}.book-welcome{text-align:center;position:absolute;top:7%;left:5%;right:5%;animation:welcome-away .7s 3.8s both}.book-welcome>span{font:500 27px Caveat;color:#765584}.book-welcome p{font:400 clamp(25px,3vw,40px)/1.2 Fraunces;margin:12px 0;color:#504154;letter-spacing:-.8px}.book-welcome em{color:#8f687a}.book-stage{position:absolute;top:49%;left:50%;width:270px;height:330px;margin-left:-135px;margin-top:-105px;perspective:1600px;animation:book-stage-arrive .8s both;transform-style:preserve-3d}.storybook{width:270px;height:330px;position:relative;transform-style:preserve-3d;transform:rotateX(8deg) rotateY(-12deg) rotateZ(-4deg);animation:open-center 1.4s .75s cubic-bezier(.3,.65,.2,1) forwards,book-zoom 1s 4.2s ease-in both}.book-pages{position:absolute;inset:4px 0 2px 0;background:repeating-linear-gradient(0deg,#fff9eb 0px,#fff9eb 3px,#e6dcc8 4px);border:1px solid #cfbda6;border-radius:1px 12px 12px 1px;box-shadow:12px 18px 40px #4d31432b,0 4px 0 #b59c7a;overflow:hidden}.page-art{position:absolute;inset:12px;background:#fffaf0;display:flex;flex-direction:column;align-items:center;justify-content:center}.page-art img{width:91%;height:155px;object-fit:cover;border-radius:100px 100px 2px 2px;opacity:.85}.page-art>span{font:500 25px Caveat;color:#826676;margin-top:19px}.page-art>i{position:absolute;font:400 40px Fraunces;color:#b99966;top:9px;right:8px;font-style:normal}.book-cover{position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;animation:cover-open 1.65s .8s cubic-bezier(.45,.1,.15,1) forwards;z-index:6}.cover-front,.cover-inside{position:absolute;inset:0;backface-visibility:hidden;border-radius:2px 12px 12px 2px}.cover-front{background:#705770;display:flex;flex-direction:column;align-items:center;padding:24px 15px;color:#f3e5c8;box-shadow:inset 5px 0 0 #fff1,inset 12px 0 15px #30223533,5px 5px 0 #584258;overflow:hidden;border:1px solid #8a7088}.cover-front:before{content:'';position:absolute;inset:12px;border:1px solid #e4c68c88;border-radius:1px 6px 6px 1px;pointer-events:none}.cover-small{font:500 19px Caveat}.cover-title{font:400 33px/1.02 Fraunces;text-align:center;letter-spacing:-1px;margin-top:18px}.cover-drawing{position:absolute;bottom:31px;left:15px;width:240px;height:135px}.cover-bottom{font:500 14px Caveat;position:absolute;bottom:19px}.cover-inside{transform:rotateY(180deg);background:#f9f1df;border:4px solid #705770;padding:40px 22px;box-shadow:inset -15px 0 25px #88715b26;display:flex;align-items:center;justify-content:center;flex-direction:column}.cover-inside>span{font:400 25px/1.25 Fraunces;color:#7d6774;text-align:center}.cover-inside em{color:#a18063}.cover-inside svg{width:170px;height:65px;margin-top:15px}.book-spine{position:absolute;left:-3px;top:0;bottom:0;width:9px;background:linear-gradient(90deg,#5a435c,#a2869c,#6f536f);border-radius:3px;z-index:1}.page-leaf{position:absolute;inset:5px 0 4px 0;background:#faf2e1;border:1px solid #d9c9b5;border-radius:1px 10px 10px 1px;transform-origin:0 50%;z-index:3;animation:page-open 1.5s 1.05s both}.leaf-two{animation-delay:1.25s;z-index:2;background:#fff8e9}.book-friends{position:absolute;inset:0;pointer-events:none;z-index:7}.book-friend{position:absolute;width:100px;height:140px;left:calc(50% - 50px);top:55%;opacity:0;filter:drop-shadow(0 15px 12px #735c6c16);animation:friend-leap 2s var(--delay) cubic-bezier(.2,.75,.25,1) both}.book-friend svg{width:100%;height:100%;overflow:visible}.friend-bunny{--x:-260px;--y:-150px;--r:-15deg;--delay:1.65s;width:110px;height:150px}.friend-fox{--x:220px;--y:-90px;--r:12deg;--delay:1.9s;width:125px;height:155px}.friend-star{--x:-150px;--y:-245px;--r:-20deg;--delay:2.05s;width:95px;height:100px}.friend-bird{--x:155px;--y:-245px;--r:12deg;--delay:2.2s;width:110px;height:110px}.friend-note{--x:15px;--y:-290px;--r:15deg;--delay:2.35s;width:70px;height:110px}.book-magic{position:absolute;inset:0;pointer-events:none;z-index:8}.book-magic i{position:absolute;left:50%;top:60%;font:400 27px Fraunces;color:#c6a26c;font-style:normal;opacity:0;animation:magic-flight 2s var(--d) both;--dx:-300px;--dy:-90px}.book-magic i:nth-child(1){--d:1.7s;--dx:-320px;--dy:-80px}.book-magic i:nth-child(2){--d:1.9s;--dx:310px;--dy:-180px;font-size:45px}.book-magic i:nth-child(3){--d:2.1s;--dx:-250px;--dy:-300px}.book-magic i:nth-child(4){--d:2.3s;--dx:65px;--dy:-355px}.book-magic i:nth-child(5){--d:2.4s;--dx:280px;--dy:10px}.book-magic i:nth-child(6){--d:2.5s;--dx:-100px;--dy:-170px}.book-whisper{position:absolute;bottom:7%;left:5%;right:5%;text-align:center;font:500 26px Caveat;color:#826776;opacity:0;animation:whisper-in .7s 2.5s both}.skip-entrance{animation:skip-hide .1s 5.5s both}.story-hero .intro{animation-delay:4.2s}.story-hero h1{animation-delay:4.35s}.story-hero .hero-copy>p{animation-delay:4.5s}.story-hero .hero-actions{animation-delay:4.65s}.hero-signature{animation-delay:4.75s}.hero-memory{animation-delay:4.65s}.hero-doodle{animation-delay:4.8s}.hero-landscape>img{animation:landscape-in 2.5s 3.8s both,slow-scene 24s 6.3s ease-in-out infinite alternate}.entrance-skipped .story-hero .intro,.entrance-skipped .story-hero h1,.entrance-skipped .story-hero .hero-copy>p,.entrance-skipped .story-hero .hero-actions,.entrance-skipped .hero-signature,.entrance-skipped .hero-memory,.entrance-skipped .hero-doodle{animation-delay:0s}.entrance-skipped .hero-landscape>img{animation-delay:0s,2.5s}
@keyframes book-stage-arrive{from{opacity:0;translate:0 50px}to{opacity:1;translate:0 0}}@keyframes cover-open{0%{transform:rotateY(0deg)}100%{transform:rotateY(-165deg)}}@keyframes page-open{0%{transform:rotateY(0deg)}100%{transform:rotateY(-156deg)}}@keyframes open-center{from{transform:rotateX(8deg) rotateY(-12deg) rotateZ(-4deg)}to{transform:translateX(125px) rotateX(8deg) rotateY(0deg) rotateZ(0deg)}}@keyframes book-zoom{from{scale:1;opacity:1}to{scale:2.8;opacity:0;filter:blur(4px)}}@keyframes friend-leap{0%{opacity:0;transform:translate(0,40px) scale(.12) rotate(0deg)}18%{opacity:1}65%{opacity:1;transform:translate(var(--x),var(--y)) scale(1.05) rotate(var(--r))}100%{opacity:1;transform:translate(var(--x),calc(var(--y) - 12px)) scale(1) rotate(var(--r))}}@keyframes magic-flight{0%{opacity:0;transform:translate(0,0) scale(.1)}20%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.1) rotate(80deg)}}@keyframes whisper-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes welcome-away{to{opacity:0;transform:translateY(-20px)}}@keyframes book-world-exit{0%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;pointer-events:none}}@keyframes twinkle{from{opacity:.35;transform:scale(.8) rotate(-10deg)}to{opacity:.9;transform:scale(1.1) rotate(10deg)}}
@media(max-height:700px) and (min-width:801px){.book-stage{scale:.8;top:48%}.book-welcome{top:3%}.book-welcome p{font-size:28px}.book-whisper{bottom:2%}}@media(max-width:800px){.book-stage{scale:.7;top:51%;margin-top:-95px}.book-welcome{top:10%}.book-welcome p{font-size:28px;line-height:1.25}.book-welcome>span{font-size:25px}.book-friend{scale:.75;top:56%}.friend-bunny{--x:-140px;--y:-150px}.friend-fox{--x:130px;--y:-80px}.friend-star{--x:-90px;--y:-270px}.friend-bird{--x:85px;--y:-235px}.friend-note{--x:5px;--y:-320px}.book-whisper{bottom:13%;font-size:24px}.book-sky>span:nth-child(1){left:7%;top:32%}.book-sky>span:nth-child(2){right:8%;top:28%}.book-magic{scale:.6;transform-origin:50% 60%}.skip-entrance{right:20px;bottom:25px}}@media(max-width:380px){.book-stage{scale:.62}.book-friend{scale:.65}.book-welcome p{font-size:25px}.book-whisper{font-size:22px}}@media(prefers-reduced-motion:reduce){.book-entrance,.skip-entrance{display:none!important}.story-hero .hero-copy>*,.hero-memory,.hero-signature,.hero-doodle{animation:none;opacity:1;transform:none}}
