.jr{--paper:#FFFBF3;--buttercream:#FFF2D9;--card:#FFFFFF;--strawberry:#F4A6BC;--strawberry-soft:#FCE4EB;--lilac:#C9B6E8;--lilac-soft:#EFE8F8;--ocean:#A9DCE8;--ocean-soft:#E3F4F8;--mint:#C5E5D1;--mint-soft:#E8F5EC;--sunny:#F6C935;--ink:#59483F;--ink-strong:#3F322B;--ink-muted:#75655C;--graphite:#4A4542;--magenta:#C2185B;--magenta-deep:#A3134C;--line:#E9DCCB;--line-strong:#8C7B70;--shadow-soft:0 1px 0 rgba(89,72,63,.06),0 6px 18px rgba(89,72,63,.08);--shadow-lift:0 2px 0 rgba(89,72,63,.06),0 14px 32px rgba(89,72,63,.14);--shadow-pop:0 24px 64px rgba(63,50,43,.24);--ease-out:cubic-bezier(.22,1,.36,1);--ease-bounce:cubic-bezier(.34,1.4,.64,1);--turn:cubic-bezier(.45,.05,.25,1);--hand:"Zia Handwriting","Nunito",system-ui,sans-serif;--sans:"Nunito",ui-rounded,system-ui,-apple-system,"Segoe UI",sans-serif;container-type:inline-size;container-name:jr;position:relative;width:100%;min-height:100%;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}.jr *{box-sizing:border-box}.jr h1,.jr h2,.jr h3,.jr p{margin:0}.jr a{color:var(--magenta)}.jr :focus-visible{outline:3px solid var(--magenta-deep);outline-offset:3px;border-radius:12px}.desk{background:var(--buttercream);padding:40px 0 56px;border-bottom:1px solid var(--line)}.desk-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 32px;margin-bottom:28px}.desk-head h1{font-family:var(--hand);font-weight:400;font-size:56px;line-height:1.05;color:var(--ink-strong)}.desk-head p{font-size:18px;color:var(--ink-strong);max-width:34em}.tools{display:flex;flex-wrap:wrap;gap:10px}.tool{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 20px;border-radius:999px;border:2px solid var(--line-strong);background:var(--card);font:800 16px/1.1 var(--sans);color:var(--ink-strong);cursor:pointer;transition:background-color .12s var(--ease-out),border-color .12s}.tool svg{width:20px;height:20px}.tool:hover{background:var(--strawberry-soft);border-color:var(--magenta)}.tool[aria-pressed=true]{background:var(--ink-strong);border-color:var(--ink-strong);color:var(--paper)}.stage{position:relative;max-width:1100px;margin-inline:auto}.book{position:relative;width:100%;aspect-ratio:1.414/1;perspective:2800px;border-radius:6px 14px 14px 6px;box-shadow:2px 2px #fff,3px 3px 0 var(--line),5px 5px #fff,6px 6px 0 var(--line),8px 8px #fff,9px 9px 0 var(--line-strong),0 34px 60px #3f322b38}.book:focus-visible{outline:3px solid var(--magenta-deep);outline-offset:8px}.binding{position:absolute;left:-14px;top:-6px;bottom:-6px;width:20px;border-radius:8px 3px 3px 8px;background:var(--magenta);border:2px solid var(--graphite);z-index:6;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}.binding i{display:block;width:8px;height:8px;border-radius:50%;background:var(--paper);border:1.5px solid var(--graphite)}.layer{position:absolute;inset:0}.under{z-index:1}.flipper{z-index:4;transform-origin:left center;transform-style:preserve-3d}.flipper.next{animation:turnNext .9s var(--turn) forwards}.flipper.prev{animation:turnPrev .9s var(--turn) forwards}.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:4px 12px 12px 4px;overflow:hidden}.face.back{transform:rotateY(180deg)}.page-back{position:absolute;inset:0;background:linear-gradient(90deg,#F3EADB,var(--paper) 40%,#F6EEE1)}.flipper .front:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#3f322b00,#3f322b47);animation:frontShade .9s var(--turn) forwards;pointer-events:none}.under.shading .face:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#3f322b52,#3f322b00 55%);animation:underShade .9s var(--turn) forwards;pointer-events:none}.curl{position:absolute;bottom:0;z-index:5;width:60px;height:60px;border:0;padding:0;cursor:pointer;transition:width .22s var(--ease-bounce),height .22s var(--ease-bounce);filter:drop-shadow(-3px -3px 4px rgba(63,50,43,.18))}.curl.c-next{right:0;border-radius:14px 0 12px;background:linear-gradient(315deg,var(--buttercream) 0 49%,#EFE3D0 50%,#FBF4E8 100%)}.curl.c-prev{left:0;border-radius:0 14px 0 4px;background:linear-gradient(45deg,var(--buttercream) 0 49%,#EFE3D0 50%,#FBF4E8 100%);filter:drop-shadow(3px -3px 4px rgba(63,50,43,.18))}.curl:hover,.curl:focus-visible{width:84px;height:84px}.page{position:absolute;inset:0;container-type:size;container-name:pg;--u:1cqw;background:var(--paper);color:var(--ink-strong);overflow:hidden;font-family:var(--sans)}.pad{position:absolute;inset:0}.wash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(42% 52% at 0% 0%,#c9b6e88c,#c9b6e800 72%),radial-gradient(38% 48% at 100% 0%,#f4a6bc73,#f4a6bc00 72%),radial-gradient(46% 54% at 100% 100%,#c9b6e880,#c9b6e800 72%),radial-gradient(42% 50% at 0% 100%,#f4a6bc80,#f4a6bc00 72%)}.dz{position:absolute;display:block;pointer-events:none}.dz svg{display:block;width:100%;height:100%}.art{position:absolute;display:block;height:auto;filter:drop-shadow(0 0 1.5px rgba(255,251,243,1)) drop-shadow(0 0 5px rgba(255,251,243,.9))}.pnum{position:absolute;left:0;right:0;bottom:3%;text-align:center;font:600 calc(var(--u)*1.15)/1 var(--sans);color:var(--ink-muted);letter-spacing:.08em}.cv-center{position:absolute;left:22%;right:22%;top:30%;display:flex;flex-direction:column;align-items:center;text-align:center}.cv-name{font-family:var(--hand);font-size:calc(var(--u)*3.6);line-height:1.1;color:var(--magenta)}.cv-title{font-family:var(--hand);font-size:calc(var(--u)*10.5);line-height:.95;color:var(--magenta);margin-top:calc(var(--u)*.4)}.cv-sub{font-family:var(--hand);font-size:calc(var(--u)*3);line-height:1.2;color:var(--ink-strong);margin-top:calc(var(--u)*1.4)}.cv-themes{font-family:var(--hand);font-size:calc(var(--u)*2.3);line-height:1.2;color:var(--magenta);margin-top:calc(var(--u)*.6)}.cv-rule{display:flex;align-items:center;gap:calc(var(--u)*1);margin-top:calc(var(--u)*1.8)}.cv-rule span{display:block;width:calc(var(--u)*7);height:2px;background:var(--line-strong);border-radius:2px}.cv-rule svg{width:calc(var(--u)*2.2);height:calc(var(--u)*2.2)}.cv-date{font-family:var(--hand);font-size:calc(var(--u)*2.6);color:var(--ink-strong);margin-top:calc(var(--u)*1.4)}.cv-aanya{left:4%;top:5%;width:18%}.cv-jack{left:3%;bottom:3%;width:19%}.cv-dolphin{left:27%;top:3%;width:21%}.cv-whale{right:3%;top:4%;width:27%}.cv-ice{right:7%;bottom:7%;width:10%}.cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.pa .cv-in{animation:coverA 1s var(--ease-out) both}.pb .cv-in{animation:coverB 1s var(--ease-out) both}.pa .tw-star,.pb .tw-star{animation:twinkle 2.8s ease-in-out 1.2s infinite alternate;opacity:0}@keyframes coverA{0%{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}@keyframes coverB{0%{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}@keyframes twinkle{0%{opacity:0;transform:scale(.4) rotate(-30deg)}60%{opacity:.95;transform:scale(1)}to{opacity:.35;transform:scale(.8) rotate(15deg)}}@container pg (max-aspect-ratio:1/1){.cover-img{object-fit:contain}.tw-star{display:none}}.note-img{position:absolute;left:50%;top:50%;width:34%;height:auto;transform:translate(-50%,-50%)}.col{position:absolute;inset:12% 26% 8%;display:flex;flex-direction:column;justify-content:center;gap:calc(var(--u)*1.3);overflow:auto}.letter p{font-size:calc(var(--u)*1.55);line-height:1.6;color:var(--ink-strong)}.letter .it{font-style:italic}.about{align-items:center;text-align:center;left:27%;right:27%}.about p{font-size:calc(var(--u)*1.75);line-height:1.5;color:var(--ink-strong)}.about h2{font-family:var(--hand);font-weight:400;font-size:calc(var(--u)*4.4);line-height:1.1;color:var(--magenta);margin-top:calc(var(--u)*1)}.about .tagline{font-family:var(--hand);font-size:calc(var(--u)*2.6);color:var(--magenta);margin-top:calc(var(--u)*1)}.ab-dolphin{left:3%;top:18%;width:19%}.ab-aanya{left:5%;bottom:4%;width:17%}.ab-whale{right:3%;top:9%;width:21%}.ch-bg{position:absolute;inset:0}.ch-center{position:absolute;left:10%;right:10%;top:22%;display:flex;flex-direction:column;align-items:center;text-align:center}.ch-kicker{font:800 calc(var(--u)*1.3)/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-strong)}.ch-title{font-family:var(--hand);font-size:calc(var(--u)*11);line-height:1;color:var(--ink-strong);margin-top:calc(var(--u)*1.2)}.ch-count{font-family:var(--hand);font-size:calc(var(--u)*2.8);color:var(--magenta);margin-top:calc(var(--u)*1.2)}.ch-peek{right:8%;bottom:8%;width:20%;transform:rotate(6deg)}.ch-peek2{left:8%;bottom:10%;width:15%;transform:rotate(-6deg)}.dr{position:absolute;inset:5% 5% 8% 6%;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:5%;align-items:center}.frame{position:relative;height:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-lift);transform:rotate(-1.2deg);padding:4%;display:grid;place-items:center}.frame img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.tape{position:absolute;top:-3%;left:38%;width:24%;height:7%;background:#f4a6bcbf;transform:rotate(-4deg);clip-path:polygon(0 8%,6% 0,12% 10%,18% 0,24% 8%,100% 0,94% 50%,100% 100%,30% 92%,24% 100%,18% 90%,12% 100%,6% 92%,0 100%,4% 50%);z-index:2}.dr-info{display:flex;flex-direction:column;align-items:flex-start;gap:calc(var(--u)*1)}.kick{display:inline-flex;align-items:center;gap:calc(var(--u)*.6);font:800 calc(var(--u)*1.1)/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-strong)}.kick i{display:block;width:calc(var(--u)*1.1);height:calc(var(--u)*1.1);border-radius:50%;border:1.5px solid var(--graphite)}.dr-title{font-family:var(--hand);font-weight:400;font-size:calc(var(--u)*5.2);line-height:1.05;color:var(--ink-strong)}.dr-meta{font:600 calc(var(--u)*1.45)/1.4 var(--sans);color:var(--ink)}.badge{display:inline-flex;align-items:center;gap:calc(var(--u)*.5);background:var(--strawberry-soft);border:2px solid var(--magenta);color:var(--magenta-deep);border-radius:999px;padding:calc(var(--u)*.3) calc(var(--u)*1.1);font:800 calc(var(--u)*1.15)/1.3 var(--sans)}.badge svg{width:calc(var(--u)*1.3);height:calc(var(--u)*1.3)}.znote{background:var(--card);border:1px dashed var(--line-strong);border-radius:12px;padding:calc(var(--u)*1) calc(var(--u)*1.4);display:grid;gap:2px}.znote small{font:800 calc(var(--u)*1)/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted)}.znote span{font-family:var(--hand);font-size:calc(var(--u)*2.5);line-height:1.15;color:var(--magenta)}.closer{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 calc(var(--u)*1.6);margin-top:calc(var(--u)*.6);border-radius:999px;border:2px solid var(--magenta);background:var(--card);color:var(--magenta);font:800 clamp(14px,calc(var(--u)*1.35),18px)/1 var(--sans);cursor:pointer}.closer:hover{background:var(--strawberry-soft)}.closer svg{width:18px;height:18px}.end-center{position:absolute;left:12%;right:12%;top:18%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:calc(var(--u)*1.2)}.end-kick{font-family:var(--hand);font-size:calc(var(--u)*2.6);color:var(--ink-strong)}.end-title{font-family:var(--hand);font-size:calc(var(--u)*8);line-height:1;color:var(--magenta)}.end-love{display:inline-flex;align-items:center;gap:calc(var(--u)*1);font-family:var(--hand);font-size:calc(var(--u)*3.4);color:var(--ink-strong)}.end-love img{height:calc(var(--u)*7);width:auto}.end-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:calc(var(--u)*1.4)}.pbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:999px;border:2px solid var(--magenta);background:var(--card);color:var(--magenta)!important;font:800 16px/1 var(--sans);text-decoration:none;cursor:pointer}.pbtn.primary{background:var(--magenta);color:#fff!important;box-shadow:0 3px 0 var(--magenta-deep)}.pbtn:hover{background:var(--strawberry-soft)}.pbtn.primary:hover{background:var(--magenta-deep)}.end-ice{left:7%;bottom:8%;width:11%}.end-kitten{right:7%;bottom:6%;width:16%}.pa .rv{animation:drawA 1.2s var(--ease-out) .38s both}.pb .rv{animation:drawB 1.2s var(--ease-out) .38s both}.pa .wt{animation:wipeA .8s var(--ease-out) .9s both}.pb .wt{animation:wipeB .8s var(--ease-out) .9s both}.pa .up{animation:upA .6s var(--ease-out) .7s both}.pb .up{animation:upB .6s var(--ease-out) .7s both}.pa .pp{animation:popA .46s var(--ease-bounce) 1.3s both}.pb .pp{animation:popB .46s var(--ease-bounce) 1.3s both}.pa .fl,.pb .fl{animation:floaty 6s ease-in-out 1.6s infinite alternate}.pa .frame,.pb .frame{animation:settle .7s var(--ease-bounce) .2s both}.d1{animation-delay:.15s!important}.d2{animation-delay:.3s!important}.d3{animation-delay:.45s!important}.d4{animation-delay:.6s!important}@keyframes drawA{0%{clip-path:inset(0 100% 0 0);opacity:.4}to{clip-path:inset(0 0 0 0);opacity:1}}@keyframes drawB{0%{clip-path:inset(0 100% 0 0);opacity:.4}to{clip-path:inset(0 0 0 0);opacity:1}}@keyframes wipeA{0%{clip-path:inset(-20% 100% -20% 0)}to{clip-path:inset(-20% 0 -20% 0)}}@keyframes wipeB{0%{clip-path:inset(-20% 100% -20% 0)}to{clip-path:inset(-20% 0 -20% 0)}}@keyframes upA{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes upB{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes popA{0%{opacity:0;transform:scale(.3) rotate(-40deg)}to{opacity:1;transform:none}}@keyframes popB{0%{opacity:0;transform:scale(.3) rotate(-40deg)}to{opacity:1;transform:none}}@keyframes floaty{0%{translate:0 0}to{translate:0 -8px}}@keyframes settle{0%{transform:rotate(-5deg) scale(.96)}to{transform:rotate(-1.2deg)}}@keyframes turnNext{0%{transform:rotateY(0)}88%{opacity:1}to{transform:rotateY(-180deg);opacity:0}}@keyframes turnPrev{0%{transform:rotateY(-180deg);opacity:0}12%{opacity:1}to{transform:rotateY(0)}}@keyframes frontShade{0%{opacity:0}to{opacity:1}}@keyframes underShade{0%{opacity:1}to{opacity:0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@container pg (max-aspect-ratio:1/1){.page *{--u:2.15cqw}.cv-center{left:6%;right:6%;top:33%}.cv-title{font-size:calc(var(--u)*9.5)}.cv-aanya{left:4%;top:3%;width:30%}.cv-whale{right:3%;top:5%;width:46%}.cv-dolphin{display:none}.cv-jack{left:4%;bottom:2%;width:27%}.cv-ice{right:6%;bottom:3%;width:17%}.note-img{width:70%}.col{inset:6% 8% 7%;justify-content:flex-start}.letter p{font-size:calc(var(--u)*1.75)}.about{left:8%;right:8%;top:20%}.about p{font-size:calc(var(--u)*1.75)}.ab-dolphin{left:3%;top:2%;width:30%}.ab-whale{right:3%;top:2%;width:32%}.ab-aanya{display:none}.ch-center{top:18%}.ch-peek{width:34%;right:6%;bottom:6%}.ch-peek2{width:26%;left:6%;bottom:8%}.dr{inset:5% 6% 8%;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1.25fr) auto;gap:4%;align-items:start}.dr-title{font-size:calc(var(--u)*4.6)}.end-center{top:14%}.end-ice{width:20%}.end-kitten{width:28%}}.controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px;max-width:1100px;margin:36px auto 0}.nav-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:0 26px;border-radius:999px;border:2px solid var(--magenta);background:var(--card);color:var(--magenta);font:800 17px/1 var(--sans);cursor:pointer;transition:background-color .12s var(--ease-out),transform .22s var(--ease-bounce)}.nav-btn.primary{background:var(--magenta);color:#fff;box-shadow:0 3px 0 var(--magenta-deep)}.nav-btn:hover{transform:translateY(-2px)}.nav-btn.primary:hover{background:var(--magenta-deep)}.nav-btn:not(.primary):hover{background:var(--strawberry-soft)}.nav-btn[disabled]{background:#efe7dc;color:#9a8c82;border-color:transparent;box-shadow:none;transform:none;cursor:not-allowed}.nav-btn svg{width:20px;height:20px}.where{display:grid;gap:8px;justify-items:center;text-align:center}.where p{font-weight:800;font-size:17px;color:var(--ink-strong)}.where p span{font-weight:600;color:var(--ink)}.track{position:relative;width:100%;max-width:520px;height:12px}.track svg{position:absolute;inset:0;width:100%;height:100%}.track .bar{position:absolute;left:0;top:2px;height:8px;border-radius:8px;background:var(--magenta);transition:width .6s var(--ease-out)}.track .base{position:absolute;inset:2px 0;border-radius:8px;background:var(--card);border:1px solid var(--line)}.hint{text-align:center;margin-top:14px;font-size:15px;color:var(--ink-muted)}.thumbs{max-width:1100px;margin:28px auto 0;background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-soft);padding:24px;animation:fadeIn .22s var(--ease-out)}.thumbs h2{font-family:var(--hand);font-weight:400;font-size:32px;color:var(--ink-strong);margin-bottom:16px}.thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;list-style:none;margin:0;padding:0}.thumb{width:100%;display:grid;gap:6px;background:none;border:0;padding:0;cursor:pointer;text-align:left;color:var(--ink-strong)}.thumb .tb{aspect-ratio:1.414/1;border:2px solid var(--line);border-radius:8px;background:var(--paper);display:grid;place-items:center;overflow:hidden;padding:6px;transition:border-color .12s var(--ease-out),transform .22s var(--ease-bounce)}.thumb .tb img{max-width:100%;max-height:100%;object-fit:contain}.thumb .tb b{font-family:var(--hand);font-weight:400;font-size:24px;line-height:1;color:var(--magenta);text-align:center}.thumb:hover .tb{border-color:var(--magenta);transform:translateY(-3px)}.thumb[aria-current=page] .tb{border-color:var(--magenta);box-shadow:0 0 0 3px var(--strawberry)}.thumb span{font:700 13px/1.3 var(--sans)}.zoom{position:absolute;inset:-16px;z-index:20;display:grid;place-items:center;animation:fadeIn .22s var(--ease-out)}.zoom-scrim{position:absolute;inset:0;background:#3f322b8c;border:0;border-radius:24px;cursor:pointer}.zoom-panel{position:relative;width:min(92%,880px);height:92%;background:var(--paper);border-radius:24px;box-shadow:var(--shadow-pop);padding:24px;display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px}.zoom-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.zoom-top h2{font-family:var(--hand);font-weight:400;font-size:36px;color:var(--ink-strong)}.zoom-x{display:grid;place-items:center;width:48px;height:48px;border-radius:999px;border:2px solid var(--line-strong);background:var(--card);color:var(--ink-strong);cursor:pointer}.zoom-x svg{width:22px;height:22px}.zoom-img{min-height:0;display:grid;place-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}.zoom-img img{max-width:100%;max-height:100%;object-fit:contain}@container jr (max-width:1023px){.desk-head h1{font-size:48px}}@container jr (max-width:767px){.desk{padding:28px 0 40px}.desk-head{margin-bottom:22px}.desk-head h1{font-size:44px}.desk-head p{font-size:17px}.tools{width:100%}.tool{flex:1 1 0;justify-content:center;padding:0 12px}.book{aspect-ratio:.72/1}.binding{left:-10px;width:14px}.controls{grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}.controls .where{grid-column:1 / -1;grid-row:1}.nav-btn{width:100%;padding:0 12px}.hint{display:none}.thumb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.zoom-panel{padding:16px}.zoom-top h2{font-size:28px}}@media(prefers-reduced-motion:reduce){.jr *,.jr *:before,.jr *:after{animation:none!important;transition-duration:1ms!important}}.foot{padding:40px 0 28px}.foot-logo img{width:200px}.foot-note{margin-top:24px}
