@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:600;src:url(/assets/baloo-2-latin-600-normal-tIfxVoAe.woff2)format("woff2"),url(/assets/baloo-2-latin-600-normal-B4tNaogw.woff)format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(/assets/baloo-2-latin-800-normal-BbF3Etk1.woff2)format("woff2"),url(/assets/baloo-2-latin-800-normal-B8BXfZF7.woff)format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:600;src:url(/assets/baloo-2-vietnamese-600-normal-C5EqHgu0.woff2)format("woff2"),url(/assets/baloo-2-vietnamese-600-normal-CGkk4Wtx.woff)format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(/assets/baloo-2-vietnamese-800-normal-ConLnEgt.woff2)format("woff2"),url(/assets/baloo-2-vietnamese-800-normal-GQACmpuv.woff)format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/nunito-latin-600-normal-Br8yIETf.woff2)format("woff2"),url(/assets/nunito-latin-600-normal-Cd0eNu1l.woff)format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:800;src:url(/assets/nunito-latin-800-normal-Dz8SOQK_.woff2)format("woff2"),url(/assets/nunito-latin-800-normal-D-J0wlBY.woff)format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/nunito-vietnamese-600-normal-BY8O6Cug.woff2)format("woff2"),url(/assets/nunito-vietnamese-600-normal-DO1RqFw5.woff)format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:800;src:url(/assets/nunito-vietnamese-800-normal-D_CZYdm9.woff2)format("woff2"),url(/assets/nunito-vietnamese-800-normal-Dz0hZPb5.woff)format("woff")}:root{--cream:#fff4dc;--cream-deep:#ffe7b8;--ink:#4a2c12;--ink-soft:#7a5432;--accent:#ff7a2f;--accent-dark:#d4561a;--wood:#b97a45;--wood-dark:#8a5528;--focus:#2f7dff;--font-display:"Baloo 2", "Nunito", system-ui, sans-serif;--font-body:"Nunito", system-ui, sans-serif;--radius-s:12px;--radius-m:20px;--radius-l:28px;--shadow-soft:0 6px 18px #4a2c1229;--shadow-lift:0 14px 30px #4a2c123d;--bounce:cubic-bezier(.34, 1.56, .64, 1);--topbar-h:64px;--book-cover:#ffb648;--book-cover-dark:#e0821f;--book-paper:#fffaf0;--book-ink:var(--ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0}body{background-color:var(--cream);color:var(--ink);font-family:var(--font-body);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;background-image:radial-gradient(#4a2c120f 1.2px,#0000 1.4px);background-size:22px 22px;font-weight:600}[hidden]{display:none!important}button,a{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:4px solid var(--focus);outline-offset:3px}.icon{fill:none;stroke:currentColor;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round;width:26px;height:26px}.app{flex-direction:column;min-height:100dvh;display:flex}.topbar{z-index:5;height:var(--topbar-h);padding:0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left));background:#fff4dceb;border-bottom:3px dashed #b97a4559;align-items:center;gap:10px;display:flex;position:sticky;top:0}.topbar__title{font-family:var(--font-display);text-overflow:ellipsis;white-space:nowrap;color:var(--ink);flex:1;margin:0;font-size:clamp(1.3rem,1rem + 1.6vw,1.9rem);font-weight:800;line-height:1;overflow:hidden}.topbar__title:focus{outline:none}.topbar__actions{gap:8px;display:flex}.icon-btn{width:48px;height:48px;color:var(--ink);transition:transform .15s var(--bounce), box-shadow .15s;background:#fff;border:0;border-radius:50%;place-items:center;padding:0;display:inline-grid;box-shadow:0 3px #4a2c122e}.icon-btn:hover:not(:disabled){transform:translateY(-2px)rotate(-4deg)}.icon-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px #4a2c122e}.icon-btn:disabled{opacity:.35;cursor:default}.icon-btn--big{width:56px;height:56px}.toggle .icon--off,.toggle[aria-pressed=false] .icon--on{display:none}.toggle[aria-pressed=false] .icon--off{display:block}.toggle[aria-pressed=true]{background:var(--accent);color:#fff}.pill{min-height:52px;font-family:var(--font-display);transition:transform .15s var(--bounce);background:#fff;border:3px solid;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 24px;font-size:1.15rem;font-weight:800;display:inline-flex;box-shadow:0 4px #4a2c1233}.pill:hover{transform:translateY(-2px)scale(1.03)}.pill:active{transform:translateY(2px)}.pill--primary{background:var(--accent);color:#fff;border-color:#0000}.shelf{flex:1;width:min(1180px,100%);margin:0 auto;padding:24px 16px 48px}.shelf__title{font-family:var(--font-display);text-align:center;color:var(--ink);margin:4px 0 28px;font-size:clamp(1.6rem,1.1rem + 2.4vw,2.6rem);font-weight:800}.shelf__grid{margin-inline:auto;grid-template-columns:repeat(2,1fr);row-gap:36px;max-width:900px;margin:0;padding:0;list-style:none;display:grid}.shelf__item:last-child:nth-child(odd){grid-column:1/-1}.shelf__item:last-child:nth-child(odd) .shelf__book{width:calc(50% - 2*clamp(8px,2vw,22px))}@media (min-width:760px){.shelf__grid{grid-template-columns:repeat(3,1fr)}.shelf__item:last-child:nth-child(odd){grid-column:auto}.shelf__item:last-child:nth-child(odd) .shelf__book{width:100%}.shelf__item:last-child:nth-child(3n+1){grid-column:2}}.shelf__item{background:linear-gradient(to bottom, transparent calc(100% - 22px), var(--wood) calc(100% - 22px), var(--wood) calc(100% - 8px), var(--wood-dark) calc(100% - 8px));justify-content:center;padding:0 clamp(8px,2vw,22px) 22px;display:flex}.shelf__book{transform-origin:bottom;width:100%;max-width:230px;transition:transform .25s var(--bounce);border-radius:6px 16px 16px 6px;text-decoration:none;display:block}.shelf__book:hover,.shelf__book:focus-visible{transform:translateY(-10px)rotate(-2.5deg)}.shelf__book:active{transform:translateY(-4px)scale(.97)}.shelf__item:nth-child(3n+2) .shelf__book:hover{transform:translateY(-10px)rotate(2.5deg)}.cover{aspect-ratio:3/4;background:radial-gradient(circle at 20% 15%, #ffffff59 0 9%, transparent 9.5%), radial-gradient(circle at 85% 30%, #ffffff38 0 6%, transparent 6.5%), radial-gradient(circle at 70% 85%, #ffffff2e 0 12%, transparent 12.5%), linear-gradient(155deg, var(--book-cover), var(--book-cover-dark));color:#fff;text-align:center;flex-direction:column;justify-content:flex-end;align-items:center;padding:0 8% 9%;display:flex;position:relative;overflow:hidden;container-type:inline-size}.cover--shelf{box-shadow:inset 10px 0 0 #0000001f, inset 13px 0 0 #ffffff38, 6px 6px 0 #fffaf0, 7px 7px 0 #4a2c1233, var(--shadow-lift);border-radius:6px 16px 16px 6px}.cover--page{aspect-ratio:auto;height:100%;box-shadow:inset 14px 0 18px -10px #00000059}.cover__art{flex:1;width:100%;position:relative}.cover__pic{filter:drop-shadow(0 2.5cqi 2cqi #00000038);position:absolute}.cover__pic--1{width:58%;animation:3.2s ease-in-out infinite bob;top:16%;left:50%;translate:-50%}.cover__pic--2{width:32%;bottom:2%;left:4%;rotate:-10deg}.cover__pic--3{width:30%;top:6%;right:4%;rotate:10deg}.cover__title{font-family:var(--font-display);text-shadow:0 .8cqi 0 var(--book-cover-dark), 0 1.6cqi 0 #0000002e;margin:0;font-size:15cqi;font-weight:800;line-height:.95;display:block}.cover__subtitle{opacity:.95;margin-top:2.5cqi;font-size:max(.7rem,6cqi);font-weight:800;line-height:1.2}.cover__hint{color:var(--book-cover-dark);background:#ffffffe6;border-radius:999px;margin-top:4cqi;padding:1.6cqi 4cqi;font-size:4.4cqi;font-weight:800;animation:1.8s ease-in-out infinite pulse}.reader{height:calc(100dvh - var(--topbar-h));padding:12px max(8px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));background:radial-gradient(ellipse at 50% 40%, #ffffff8c, transparent 70%), color-mix(in srgb, var(--book-cover) 35%, var(--cream));flex:none;grid-template-rows:minmax(0,1fr);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;display:grid;overflow:hidden}.reader__stage{align-self:stretch;place-items:center;min-width:0;min-height:0;display:grid}.flip-book{filter:drop-shadow(0 18px 24px #4a2c1247)}.turn-btn{width:60px;height:60px;color:var(--book-cover-dark);transition:transform .15s var(--bounce), opacity .2s;background:#fff;border:0;border-radius:50%;place-items:center;padding:0;display:grid;box-shadow:0 4px #4a2c1233}.turn-btn .icon{stroke-width:3px;width:34px;height:34px}.turn-btn:hover:not(:disabled){transform:scale(1.08)}.turn-btn:active:not(:disabled){transform:scale(.94)}.turn-btn:disabled{opacity:0;pointer-events:none}@media (max-width:640px){.reader{grid-template-columns:1fr}.turn-btn{bottom:max(14px, env(safe-area-inset-bottom));z-index:3;width:54px;height:54px;position:fixed}.turn-btn--prev{left:14px}.turn-btn--next{right:14px}}.page{background:radial-gradient(#00000009 1px, transparent 1.2px) 0 0 / 16px 16px, var(--book-paper);color:var(--book-ink);overflow:hidden;box-shadow:inset 0 0 0 1px #0000000f;container-type:size}.page__inner,.page__animals{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:4cqh;padding:8cqh 8cqw 12cqh;display:flex;position:absolute;inset:0}.page__title{font-family:var(--font-display);margin:0;font-size:clamp(1.1rem,8cqw,2.2rem);font-weight:800;line-height:1.1}.page__text{margin:0;font-size:clamp(.95rem,5.4cqw,1.35rem);line-height:1.45}.page__text--hint{color:var(--ink-soft);font-size:clamp(.8rem,4.2cqw,1rem)}.page__number{background:var(--book-cover);color:#fff;width:34px;height:34px;font-family:var(--font-display);border-radius:50%;place-items:center;font-weight:800;display:grid;position:absolute;bottom:14px;left:50%;translate:-50%}.page--welcome .page__inner{gap:3cqh;padding:6cqh 6cqw 12cqh}.contents{grid-template-columns:repeat(4,1fr);gap:2cqw;width:100%;display:grid}.contents__item{aspect-ratio:1;background:radial-gradient(circle, #fff 58%, color-mix(in srgb, var(--book-cover) 40%, #fff) 60%);min-width:44px;box-shadow:0 .6cqh 0 color-mix(in srgb, var(--book-cover-dark) 35%, transparent);transition:transform .18s var(--bounce);border:0;border-radius:50%;place-items:center;padding:1.5cqw;display:grid}.contents__item>*{pointer-events:none}.contents__item:hover{transform:scale(1.1)rotate(-4deg)}.contents__item:active{transform:scale(.92)}.contents__pic{object-fit:contain;width:100%;height:100%}.page__animals{flex-flow:wrap;align-content:center;gap:4cqh 6cqw}.animal{transition:transform .2s var(--bounce);background:0 0;border:0;flex-direction:column;align-items:center;gap:1.5cqh;padding:0;display:flex;position:relative}.animal>*{pointer-events:none}.animal__pic{aspect-ratio:1;object-fit:contain;background:radial-gradient(circle, #fff 55%, color-mix(in srgb, var(--book-cover) 45%, #fff) 56%);width:64cqw;max-height:46cqh;box-shadow:0 1.2cqh 0 color-mix(in srgb, var(--book-cover-dark) 40%, transparent);border-radius:50%;padding:5cqw;animation:3.4s ease-in-out infinite bob}.page--n2 .animal__pic{width:44cqw;max-height:30cqh}.page--n3 .animal__pic{width:36cqw;max-height:22cqh}.animal:nth-child(2) .animal__pic{animation-delay:-1.2s}.animal__name{background:var(--book-cover-dark);color:#fff;font-family:var(--font-display);border-radius:999px;padding:.6cqh 4cqw;font-size:clamp(1rem,7cqw,1.8rem);font-weight:800}.animal:hover{transform:rotate(-3deg)scale(1.04)}.animal:active{transform:scale(.94)}.goodbye__pics{flex-wrap:wrap;justify-content:center;gap:2cqw;display:flex}.goodbye__pic{width:11cqw}.cover--back{aspect-ratio:auto;justify-content:center;gap:4cqi;position:absolute;inset:0}.back__pic{opacity:.85;width:30%}.back__title{font-family:var(--font-display);font-size:10cqi;font-weight:800}.card{border:6px solid var(--book-cover);border-radius:var(--radius-l);background:var(--book-paper);width:min(560px,100vw - 24px);max-height:calc(100dvh - 24px);color:var(--book-ink);box-shadow:var(--shadow-lift);padding:18px 20px 14px;overflow-y:auto}.card[open]{animation:card-in .35s var(--bounce)}.card::backdrop{background:#2818088c}.card__head{align-items:center;gap:12px;display:flex}.card__pic{background:color-mix(in srgb, var(--book-cover) 30%, #fff);border-radius:50%;flex:none;width:72px;height:72px;padding:6px}.card__heading{flex:1;min-width:0}.card__name{font-family:var(--font-display);margin:0;font-size:clamp(1.5rem,1.1rem + 2vw,2rem);font-weight:800;line-height:1.05}.card__intro{color:var(--ink-soft);margin:4px 0 0;font-size:.98rem;line-height:1.35}.card__stage{touch-action:pan-y;margin-top:14px}.card__count{color:var(--book-cover-dark);font-family:var(--font-display);letter-spacing:.02em;text-transform:uppercase;margin:14px 0 4px;font-size:1.05rem;font-weight:800}.card__text{margin:0;font-size:clamp(1.12rem,1rem + .6vw,1.3rem);font-weight:700;line-height:1.5}.card__notice{border-radius:var(--radius-s);background:#fff2c4;margin:10px 0 0;padding:8px 12px;font-size:.95rem}.card__controls{justify-content:space-between;align-items:center;gap:12px;margin-top:16px;display:flex}.speak{background:var(--accent);color:#fff;min-height:60px;font-family:var(--font-display);white-space:nowrap;box-shadow:0 5px 0 var(--accent-dark);transition:transform .15s var(--bounce), box-shadow .15s;border:0;border-radius:999px;flex:1;justify-content:center;align-items:center;gap:10px;padding:0 14px;font-size:clamp(1rem,.8rem + 1.2vw,1.25rem);font-weight:800;display:inline-flex}.speak:active{box-shadow:0 2px 0 var(--accent-dark);transform:translateY(3px)}.speak .icon{width:30px;height:30px}.speak .icon--stop,.speak[aria-pressed=true] .icon--speak{display:none}.speak[aria-pressed=true] .icon--stop{animation:1s ease-in-out infinite pulse;display:block}.speak[aria-pressed=true]{background:var(--book-cover-dark);box-shadow:0 5px #00000040}.card__dots{justify-content:center;gap:4px;margin-top:10px;display:flex}.card__dot{background:0 0;border:0;place-items:center;width:44px;height:36px;padding:0;display:grid}.card__dot:before{content:"";border:3px solid var(--book-cover-dark);width:16px;height:16px;transition:transform .2s var(--bounce), background .2s;border-radius:50%}.card__dot[aria-current=true]:before{background:var(--book-cover-dark);transform:scale(1.25)}.card__source{color:var(--ink-soft);text-align:center;margin-top:4px;font-size:.8rem;font-weight:600;display:block}.scene{aspect-ratio:16/10;border-radius:var(--radius-m);background:radial-gradient(ellipse at 50% 120%, color-mix(in srgb, var(--book-cover) 55%, #fff) 0 45%, transparent 46%), linear-gradient(#e9f7ff, #fdfbf3);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;box-shadow:inset 0 0 0 3px #0000000d;container-type:size}.scene--night{background:radial-gradient(circle at 20% 30%,#ffffff80 0 .4cqw,#0000 .5cqw),radial-gradient(circle at 70% 15%,#fff9 0 .3cqw,#0000 .4cqw),radial-gradient(circle at 88% 60%,#fff6 0 .3cqw,#0000 .4cqw),linear-gradient(#1f2f6b,#4a4f9c)}.scene__item{left:var(--x);top:var(--y);width:var(--w);aspect-ratio:1;animation-delay:calc(var(--i,0) * .35s);position:absolute;translate:-50% -50%}img.scene__item{object-fit:contain;filter:drop-shadow(0 .8cqh .6cqh #0000002e)}.scene__ground,.scene__track{background:#4a2c1240;border-radius:1cqh;height:.8cqh;position:absolute;top:90%;left:4%;right:4%}.scene__track{background:repeating-linear-gradient(90deg,#4a2c124d 0 4cqw,#0000 4cqw 7cqw);top:92%}.scene__badge{color:var(--book-cover-dark);font-family:var(--font-display);animation:pop .5s var(--bounce) .6s backwards;background:#fff;border-radius:999px;padding:1cqh 3cqw;font-size:max(.95rem,4.6cqw);font-weight:800;position:absolute;top:4cqh;right:3cqw;box-shadow:0 .8cqh #0000001f}.scene__number{left:var(--x);top:var(--y);background:var(--book-cover-dark);color:#fff;min-width:6cqw;font-family:var(--font-display);text-align:center;animation-delay:calc(var(--i,0) * .35s);border-radius:999px;padding:0 1cqw;font-size:3.8cqw;font-weight:800;line-height:1.3;position:absolute;translate:-50% -50%}.scene__arrow{left:var(--x);top:var(--y);color:var(--book-cover-dark);animation-delay:calc(var(--i,0) * .35s);font-size:8cqw;font-weight:800;position:absolute;translate:-50% -50%}.scene__runner{left:var(--x);top:var(--y);width:var(--w);aspect-ratio:1;animation:2.6s linear infinite dash;position:absolute;translate:-50% -50%}.scene__runner--slow{animation-duration:4.2s}.scene__puff{opacity:.8}.scene__wave{left:var(--x);top:var(--y);width:var(--w);aspect-ratio:1;border:.8cqw solid color-mix(in srgb, var(--book-cover-dark) 60%, transparent);opacity:.25;animation:2.4s ease-out infinite wave;animation-delay:calc(var(--i,0) * .8s);border-radius:50%;position:absolute;translate:-50% -50%}.scene__ring-track,.scene__ring-fill{fill:none;stroke-width:12px}.scene__ring-track{stroke:#ffffff40}.scene__ring-fill{stroke:#ffd34d;stroke-linecap:round;transform-origin:50%;transform:rotate(-90deg)}.is-pop{animation:pop .55s var(--bounce) backwards;animation-delay:calc(var(--i,0) * .35s)}.is-pop.is-bob{animation:pop .55s var(--bounce) calc(var(--i,0) * .35s) backwards, bob 2.8s ease-in-out 1s infinite}.is-pop.is-float{animation:pop .55s var(--bounce) calc(var(--i,0) * .35s) backwards, bob 3.6s ease-in-out 1s infinite}.is-float{animation:3.6s ease-in-out infinite bob}.is-breathe{animation:3s ease-in-out infinite breathe}.is-chomp{animation:1.6s ease-in-out infinite chomp}.is-shout{animation:1.2s ease-in-out infinite shout}.is-fly{animation:2.4s ease-in infinite fly;animation-delay:calc(var(--i,0) * .8s)}.is-rise,.is-zzz{animation:2.6s ease-out infinite rise;animation-delay:calc(var(--i,0) * .85s)}.is-search{animation:2.4s ease-in-out infinite search}.is-twinkle{animation:1.6s ease-in-out infinite twinkle}@keyframes pop{0%{opacity:0;rotate:-12deg;scale:.2}70%{opacity:1;scale:1.12}}@keyframes bob{50%{transform:translateY(-4%)}}@keyframes pulse{50%{transform:scale(1.06)}}@keyframes breathe{50%{transform:scale(1.04,.97)}}@keyframes chomp{0%,60%,to{transform:none}70%{transform:scale(1.08,.9)}80%{transform:scale(.96,1.05)}}@keyframes shout{50%{transform:scale(1.06)rotate(-3deg)}}@keyframes dash{0%{transform:translate(-80cqw)}35%,60%{transform:translate(0)}to{transform:translate(80cqw)}}@keyframes fly{0%,15%{opacity:1;transform:none}85%{transform:translate(var(--dx), var(--dy)) scale(.3);opacity:.9}to{transform:translate(var(--dx), var(--dy)) scale(0);opacity:0}}@keyframes wave{0%{opacity:.7;transform:scale(.7)}to{opacity:0;transform:scale(2)}}@keyframes rise{0%{opacity:0;transform:translateY(20%)scale(.6)}30%{opacity:1}to{opacity:0;transform:translateY(-120%)scale(1.1)}}@keyframes search{50%{transform:translate(30%)rotate(10deg)}}@keyframes twinkle{50%{opacity:.6;transform:scale(1.2)rotate(12deg)}}@keyframes card-in{0%{opacity:0;transform:translateY(30px)scale(.92)}}.about{border-radius:var(--radius-l);background:var(--cream);width:min(520px,100vw - 24px);color:var(--ink);box-shadow:var(--shadow-lift);border:0;padding:0}.about::backdrop{background:#2818088c}.about__body{padding:24px;line-height:1.5}.about__body h2{font-family:var(--font-display);margin-top:0;font-weight:800}.about__body a{color:var(--accent-dark)}.fatal{border-radius:var(--radius-m);color:#7a1f00;text-align:center;background:#ffe1d6;padding:16px;font-weight:800;position:fixed;inset:auto 16px 16px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}