@font-face{font-family:Patrick;src:url('assets/patrick-hand.ttf') format('truetype');font-display:swap}
@font-face{font-family:DM;src:url('assets/dm-sans.ttf') format('truetype');font-display:swap}
:root{--paper:#f7f5ed;--ink:#41463e;--muted:#777c70;--green:#718365;--line:#deded1;--pink:#c98575;--hand:Patrick,'Chalkboard SE',cursive;--sans:DM,Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:var(--sans);font-size:14px;background-color:var(--paper);background-image:radial-gradient(#b6b3a31f .65px,transparent .65px);background-size:5px 5px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button{border:0;background:none}button:focus-visible,a:focus-visible{outline:3px solid #b46d59;outline-offset:5px}button:disabled{cursor:default}button,a{touch-action:manipulation}.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linejoin:round;stroke-linecap:round;flex-shrink:0}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.page{max-width:1304px;padding:0 48px;margin:auto}.site-header{height:91px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font:25px var(--hand);text-decoration:none;color:var(--ink);letter-spacing:-.3px}.brand-paw{width:25px;height:25px;transform:rotate(-16deg);fill:#8e9c7e;stroke:#8e9c7e;stroke-width:.7}.brand-dot{color:var(--pink)}.header-actions{display:flex;align-items:center;gap:22px;font-size:12px}.text-button{display:flex;align-items:center;gap:8px}.question{display:grid;place-items:center;border:1px solid #9da292;border-radius:50%;height:16px;width:16px;font-size:10px}.header-divider{height:18px;width:1px;background:var(--line)}.sound-button{display:flex;gap:8px;align-items:center;padding:8px 0}.sound-button .icon{width:17px;height:17px}.sound-dot{width:6px;height:6px;border-radius:50%;background:#aaa99b;margin-left:1px}.sound-button[aria-pressed=true] .sound-dot{background:#7e9463;box-shadow:0 0 0 3px #7e946320}.intro{text-align:center;position:relative;padding:37px 0 31px}.eyebrow{font-size:9px;letter-spacing:2.7px;display:flex;align-items:center;justify-content:center;gap:12px;color:#818574}.little-line{width:23px;height:1px;background:#a7af98}.title-wrap{position:relative;display:inline-block}h1{font:76px/1.08 var(--hand);letter-spacing:-2.3px;margin:7px 0 8px;font-weight:400}h1 span{color:#8c9b7b;font-size:.82em;padding:0 5px}.title-spark{position:absolute;color:#afbd9b;font:49px var(--hand)}.spark-left{left:-62px;top:20px;transform:rotate(-13deg)}.spark-right{right:-50px;top:8px;font-size:32px}.title-heart{font:38px var(--hand);color:#c89183;position:absolute;right:-68px;bottom:-1px;transform:rotate(18deg)}.intro p{font-size:13px;color:#787d70;margin:4px 0}.intro-note{position:absolute;right:26px;bottom:19px;transform:rotate(7deg);font:18px var(--hand);color:#89917d}.intro-note svg{display:block;width:51px;height:35px;margin-left:auto;margin-right:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.storybook{border:1px solid #d4d7c8;border-radius:9px 10px 7px 11px;background:#fffdf7;box-shadow:0 6px 0 -3px #f1efe4,0 7px 0 -3px #d8dacd,0 12px 25px #595d4210;overflow:hidden;position:relative}.book-topbar{height:48px;border-bottom:1px solid #dce0d0;display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#fcfbf5}.episode-label{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:1.4px}.episode-dot{width:7px;height:7px;border:1px solid #869575;background:#b4c2a2;border-radius:50%}.slash{margin:0 2px;color:#c1c4b5}#episode-name{font-size:11px;letter-spacing:.2px}.page-number{font:15px var(--hand);color:#969b88}.page-number span{font-size:19px;margin-left:10px}.scene{aspect-ratio:1200/520;min-height:340px;position:relative;isolation:isolate;overflow:hidden;background:#f8f7e9}.park{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;pointer-events:none;z-index:-3}.scene-wash{position:absolute;inset:0;pointer-events:none;background:transparent;transition:background 1.4s;z-index:-2}.scene[data-chapter="3"] .scene-wash{background:#eeae6e24}.scene-caption{position:absolute;left:30px;top:22px;display:flex;flex-direction:column;gap:2px;font:18px var(--hand);color:#909683;transform:rotate(-3deg)}#scene-time{font:11px var(--sans);letter-spacing:1px;margin-top:7px;color:#a4aa94}.character{position:absolute;padding:0;width:19%;height:72%;bottom:9%;z-index:2;transform-origin:50% 100%;transition:left 1s,transform .3s}.character img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(1px 3px 0 #454c3508);pointer-events:none}.rita{left:32%;animation:sway 5s ease-in-out infinite}.katia{left:50%;animation:sway 5s ease-in-out -2.5s infinite}.character:hover img{filter:drop-shadow(0 0 5px #e1c98760)}.character-label{position:absolute;bottom:-2%;font:24px var(--hand);color:#65705a;white-space:nowrap}.rita .character-label{left:0%;transform:rotate(-8deg)}.katia .character-label{right:0%;transform:rotate(6deg)}.character-label span{display:inline-block;position:relative;font-size:28px;top:-7px;margin:0 5px}.speech{position:absolute;z-index:4;background:#fffef9ef;border:1.6px solid #7c8172;border-radius:43% 48% 42% 46%/48% 45% 49% 43%;padding:11px 19px 13px;min-width:159px;text-align:center;font:22px/1.15 var(--hand);filter:drop-shadow(1px 2px 0 #a6a88c12);transition:opacity .2s,transform .3s;pointer-events:none}.speech:after{content:"";position:absolute;bottom:-13px;width:15px;height:20px;background:#fffef9;border-right:1.6px solid #7c8172;border-bottom:1.6px solid #7c8172;transform:skewY(39deg) rotate(24deg);z-index:-1}.speech p{margin:0}.speech-rita{left:19%;top:15%;transform:rotate(-5deg)}.speech-rita:after{right:20px}.speech-katia{right:18%;top:9%;transform:rotate(4deg)}.speech-katia:after{left:23px;transform:skewY(-39deg) rotate(-24deg)}.speech-doodle{position:absolute;top:-19px;right:8px;font-size:29px;color:#ba8b7d;transform:rotate(18deg)}.cat{position:absolute;width:11%;height:26%;right:20%;bottom:9%;padding:0;z-index:3;transform-origin:50% 100%;animation:cat-breathe 3s ease-in-out infinite}.cat img{width:100%;height:100%;object-fit:contain;pointer-events:none}.cat-note{position:absolute;font:16px var(--hand);color:#8b9581;left:72%;top:35%;width:90px;transform:rotate(8deg);transition:opacity .3s;pointer-events:none}.cat:hover{filter:drop-shadow(0 0 4px #d4ac7250)}.sun-hotspot{position:absolute;right:10%;top:7%;width:9%;height:18%;border-radius:50%;z-index:1}.sun-hotspot:hover{box-shadow:0 0 25px 10px #e6cb6130}.flower-hotspot{position:absolute;width:4.4%;height:19%;left:15%;bottom:10%;transform:rotate(-9deg);transform-origin:bottom;z-index:2;transition:transform .3s}.flower-hotspot:hover{transform:rotate(7deg)}.flower-hotspot svg{width:100%;height:100%}.scene-footer{position:absolute;left:23px;right:23px;bottom:15px;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:5;font-size:10px;color:#7a856d}.pause-button{display:flex;align-items:center;gap:7px;padding:5px;font-size:10px;min-width:66px}#pause-icon{font-size:16px;line-height:1}.scene-hint{font:15px var(--hand);color:#929a84}.joy-counter{display:flex;align-items:center;gap:5px;background:#fffdf3b5;border:1px solid #d4dbc7;border-radius:20px;padding:7px 11px;white-space:nowrap}.joy-counter .icon{width:14px;height:14px;fill:#e6cd86;stroke:#b3a371;margin-right:2px}.joy-counter #joy-count{font-weight:bold}.picnic{position:absolute;left:33%;bottom:9%;width:36%;opacity:0;transform:scale(.8);transition:opacity .7s,transform .7s;z-index:-1}.picnic svg{width:100%}.scene[data-chapter="2"] .picnic,.scene[data-chapter="3"] .picnic{opacity:1;transform:scale(1)}.flower-crown{display:none;position:absolute;top:9%;left:28%;font:29px var(--hand);letter-spacing:-4px;color:#d3979d;text-shadow:1px 1px #685e4b;transform:rotate(-10deg);pointer-events:none}.has-crown .flower-crown{display:block}.story-controls{padding:26px 29px 25px;display:flex;align-items:center;justify-content:space-between;gap:28px;border-top:1px solid #daddcd;background:#fffef9;min-height:131px}.chapter-eyebrow{font-size:8px;letter-spacing:1.7px;color:#899378;margin-bottom:6px}h2{font:29px/1.2 var(--hand);font-weight:400;margin:0 0 6px}.story-copy p{font-size:11px;line-height:1.7;margin:0;color:#929384;max-width:480px}.choices{display:flex;gap:10px;align-items:center;flex-shrink:0}.choice,.primary-button{border:1px solid #728563;background:#788b69;color:#fffef6;border-radius:5px 7px 5px 7px;display:flex;align-items:center;justify-content:center;gap:9px;padding:15px 17px;font-size:11px;box-shadow:0 2px 0 #56674a25;transition:transform .2s,background .2s}.choice:nth-child(2){background:#fffdf6;color:#6b795e;border:1px solid #c5ccb9;box-shadow:0 2px 0 #bac3ad12}.choice:hover,.primary-button:hover{transform:translateY(-2px);background:#697d5d}.choice:nth-child(2):hover{background:#eef1e4}.choice .icon{width:16px;height:16px}.book-bottom{display:flex;align-items:center;justify-content:space-between;padding:15px 27px;border-top:1px dashed #e0e3d6;background:#fafbf4}.chapter-navigation{display:flex;align-items:center;gap:11px}.chapter-link{display:flex;align-items:center;gap:7px;color:#9caa8d;font-size:9px;padding:3px 0}.chapter-link span{display:grid;place-items:center;width:18px;height:18px;border:1px solid #cfd7c2;border-radius:50%;font-size:9px}.chapter-link.active{color:#67795b}.chapter-link.active span{background:#7f926e;color:#fff;border-color:#7f926e}.chapter-connector{width:28px;height:1px;background:#d6dfca}.restart-button{display:flex;align-items:center;gap:6px;font-size:9px;color:#8a947d}.restart-button .icon{width:13px;height:13px}.under-book{display:flex;align-items:center;justify-content:space-between;padding:22px 5px 25px;color:#99a08d}.under-book p{display:flex;align-items:center;gap:8px;font:17px var(--hand);margin:0}.under-book .icon{width:16px;height:16px;color:#bd9689;transform:rotate(-13deg)}.under-book>span{font-size:9px;letter-spacing:.5px}.site-footer{border-top:1px solid #e2e3d8;display:flex;align-items:center;justify-content:space-between;padding:17px 1px 22px;font-size:9px;color:#a2a694}.site-footer span:last-child{font:14px var(--hand)}.scene-toast{position:absolute;top:6%;left:50%;transform:translate(-50%,-15px);z-index:8;background:#fffef5f5;padding:9px 18px;border:1px solid #cbd2bb;border-radius:20px;color:#6f7d5f;box-shadow:0 4px 12px #68775412;font:17px var(--hand);opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;text-align:center}.scene-toast.show{opacity:1;transform:translate(-50%,0)}.particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:7}.particle{position:absolute;color:#c98e87;font:28px var(--hand);animation:float-away 1.7s ease-out forwards;pointer-events:none}.photo-flash{position:absolute;inset:0;background:#fff;opacity:0;z-index:9;pointer-events:none}.take-photo .photo-flash{animation:flash .7s}.paused .character,.paused .cat,.paused .particle{animation-play-state:paused}.character.hello{animation:hello .8s ease-in-out}.scene.completed .cat-note{opacity:0}dialog{color:var(--ink);width:min(460px,calc(100% - 32px));border:1px solid #c3cbb6;border-radius:11px 14px 12px 9px;padding:36px;background:#fdfbf2;box-shadow:0 20px 100px #32362930}dialog::backdrop{background:#353b3055;backdrop-filter:blur(3px)}.close-dialog{position:absolute;right:14px;top:8px;font:30px var(--hand);color:#819073}.modal-kicker{font-size:9px;letter-spacing:1.5px;color:#899378}dialog h2{font-size:34px;margin:9px 0 16px}dialog p,dialog li{font-size:13px;line-height:1.7;color:#7a806e}dialog ol{padding-left:19px}dialog li{margin:12px 0;padding-left:5px}dialog strong{color:#535f49;font-weight:600}.keyboard-note{font-size:11px!important;border-top:1px dashed #d7ddc9;padding-top:15px}.close-help{margin-top:20px;width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{background:#fff4db;padding:20px;text-align:center}.choice:active{transform:translateY(1px)}
@keyframes sway{0%,100%{transform:rotate(-.8deg) translateY(0)}50%{transform:rotate(.8deg) translateY(-3px)}}@keyframes cat-breathe{0%,100%{transform:scaleY(1) rotate(-1deg)}50%{transform:scaleY(1.025) rotate(1deg)}}@keyframes hello{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg) translateY(-8px)}65%{transform:rotate(5deg) translateY(-5px)}}@keyframes float-away{0%{transform:translate(0,0) scale(.5);opacity:0}15%{opacity:1}100%{transform:translate(var(--drift),-130px) rotate(30deg) scale(1.3);opacity:0}}@keyframes flash{0%,100%{opacity:0}15%{opacity:.9}30%{opacity:0}45%{opacity:.5}}
@media(min-width:1500px){.page{max-width:1440px}.intro{padding-top:43px;padding-bottom:38px}.scene{aspect-ratio:1200/530}.story-controls{padding:30px 34px}.story-copy p{font-size:12px}.choice{font-size:12px}}
@media(max-width:1100px){.page{padding:0 30px}.story-controls{gap:18px;padding:22px}.choices{gap:8px}.choice{padding:13px 11px;font-size:10px}.story-copy p{max-width:340px}.intro-note{right:5px;font-size:16px}.scene{aspect-ratio:1200/570}.speech{font-size:20px;min-width:143px}.speech-rita{left:16%}.speech-katia{right:14%}h2{font-size:27px}.character{height:69%}.flower-crown{font-size:25px}}
@media(max-width:800px){.page{padding:0 20px}.site-header{height:74px}.brand{font-size:23px}.intro{padding:30px 0 27px}h1{font-size:66px}.intro-note{display:none}.story-controls{align-items:flex-start;flex-direction:column;gap:18px}.story-copy p{max-width:100%;font-size:12px}.choices{width:100%}.choice{flex:1;font-size:12px;padding:15px 10px}.scene{aspect-ratio:1200/650;min-height:335px}.character{width:24%;height:67%;bottom:12%}.rita{left:28%}.katia{left:49%}.speech{font-size:18px;padding:10px 13px;min-width:135px}.speech-rita{left:12%;top:16%}.speech-katia{right:10%;top:11%}.cat{right:14%;bottom:14%;width:14%;height:23%}.cat-note{font-size:13px;left:63%;top:20%;width:70px}.scene-caption{font-size:14px;left:20px;top:17px}.scene-hint{display:none}.scene-footer{left:15px;right:15px;bottom:11px}.flower-hotspot{width:6%;left:12%;bottom:13%}.book-bottom{padding:15px 20px}.chapter-navigation{gap:7px}.chapter-connector{width:17px}.chapter-link{font-size:8px;gap:5px}.under-book>span{display:none}.under-book{justify-content:center}.scene-toast{font-size:16px;max-width:85%;width:max-content}.flower-crown{font-size:23px}}
@media(max-width:520px){.page{padding:0 13px}.site-header{height:65px}.brand{font-size:21px;gap:7px}.brand-paw{width:22px;height:22px}.header-actions{gap:12px}.header-divider{display:none}.text-button{font-size:0;gap:0}.question{font-size:11px;width:21px;height:21px}.sound-button{gap:5px;font-size:10px}.sound-dot{display:none}.intro{padding:27px 0 24px}.eyebrow{font-size:7px;letter-spacing:2px;gap:9px}h1{font-size:60px;margin-top:10px}.spark-left{font-size:34px;left:-35px;top:22px}.spark-right{font-size:24px;right:-25px;top:14px}.title-heart{font-size:29px;right:-36px;bottom:1px}.intro p{font-size:10px}.book-topbar{height:41px;padding:0 15px}.episode-label{font-size:8px;gap:7px;letter-spacing:1px}#episode-name{font-size:10px}.page-number{display:none}.scene{min-height:400px;aspect-ratio:1/.98}.park{width:190%;max-width:none;left:-45%;object-fit:fill;object-position:50% 50%;height:100%}.character{width:33%;height:59%;bottom:18%}.rita{left:16%}.katia{left:44%}.character-label{font-size:20px;bottom:-3%}.character-label span{font-size:22px;margin:0 1px}.rita .character-label{left:5%}.katia .character-label{right:-3%}.speech{font-size:17px;min-width:122px;padding:10px 11px}.speech-rita{left:5%;top:20%}.speech-katia{right:4%;top:13%}.speech-doodle{font-size:23px}.scene-caption{top:13px;left:16px;font-size:13px;max-width:155px}.scene-caption #scene-time{font-size:9px;margin-top:4px}.cat{width:23%;height:19%;right:6%;bottom:8%}.cat-note{left:26%;top:-10%;font-size:13px;transform:rotate(6deg)}.flower-hotspot{width:9%;left:9%;bottom:12%;height:16%}.sun-hotspot{right:3%;top:0;width:13%;height:12%}.scene-footer{bottom:10px;left:10px;right:10px}.joy-counter{font-size:9px;padding:6px 8px;gap:3px}.pause-button{font-size:9px;gap:5px}.story-controls{padding:21px 17px 22px;gap:18px}.chapter-eyebrow{font-size:7px;letter-spacing:1.4px}h2{font-size:27px;line-height:1.12;margin:7px 0 9px}.story-copy p{font-size:11px;line-height:1.7}.choices{flex-direction:column;gap:8px}.choice{width:100%;padding:14px 10px;font-size:12px}.book-bottom{padding:13px 12px}.chapter-navigation{gap:5px;flex:1;justify-content:space-around}.chapter-link{font-size:0;gap:0}.chapter-link span{width:22px;height:22px;font-size:10px}.chapter-link.active{font-size:9px;gap:7px}.chapter-connector{width:12px}.restart-button{margin-left:15px;padding:4px}.restart-button span{display:none}.restart-button .icon{width:16px;height:16px}.under-book{padding:21px 0}.under-book p{font-size:16px;gap:6px}.site-footer{font-size:8px;justify-content:center;padding:16px 0}.site-footer span:last-child{display:none}.scene-toast{top:3%;font-size:14px;padding:7px 12px}.picnic{left:16%;width:63%;bottom:17%}.flower-crown{font-size:22px;top:8%;left:27%}dialog{padding:30px 25px}dialog h2{font-size:29px}.sound-button .icon{width:16px;height:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.particle{display:none}}
/* Keep the fixed-height mobile stage within the available page width. */
.scene{width:100%}.story-copy{min-width:0}.sun-hotspot{padding:0;right:10%;top:4%;width:8%;height:auto;aspect-ratio:1}.sun-hotspot svg{display:block;width:100%;height:100%}
@media(max-width:520px){.sun-hotspot{right:6%;top:2%;width:14%}.speech-katia{top:17%}.speech-rita{top:24%}}
@media(max-width:350px){h1{font-size:48px}.brand{font-size:18px}.header-actions{gap:8px}.sound-button{font-size:9px}.scene-caption{max-width:150px}.speech{font-size:15px;min-width:108px}.chapter-link.active{font-size:8px}.title-spark{display:none}.title-heart{right:-24px}.episode-label{letter-spacing:.5px}}
@media(max-width:520px){.character{height:56%;bottom:15%}.speech-rita{top:16%}.speech-katia{top:13%}.cat-note{width:90px;left:6%;top:-10%;font-size:12px}.under-book p{text-align:center;font-size:15px}}