/* A colorful book-world, keeping the existing cover and dialog interactions. */
:root{--cream:#fffdf5;--ink:#123c52;--muted:#4b6876;--coral:#c4452d;--peach:#ffe98c;--teal:#a9def3;--line:#dce8e5;--serif:Geist,Arial,sans-serif;--blue:#0875b1;--yellow:#ffdf64;--mint:#c9e8ba;--pink:#ffd1be}
body{background:var(--cream)}
.site-header{height:100px;border-bottom:2px dashed #d2e1dc}
.brand-name{font-weight:850;color:var(--blue);font-size:46px}
.brand-sub{font-weight:800;letter-spacing:1.4px}
.waving-wordmark{flex-direction:column;align-items:flex-start;gap:5px}
.waving-wordmark .brand-name{display:flex;align-items:center;line-height:1;gap:7px}
.waving-wordmark .brand-pixel{display:block;width:.85em;height:auto;flex-shrink:0;transform:rotate(5deg)}
.waving-wordmark .brand-sub{max-width:none;white-space:nowrap;font-size:9px;line-height:1;letter-spacing:1.8px}
.site-header nav a{font-weight:700}
.header-cta{background:var(--yellow);padding:10px 17px;border:2px solid var(--ink);border-radius:30px;box-shadow:3px 3px 0 var(--ink);font-size:12px}
.header-cta:hover{background:#ffe98c}
.hero{padding-block:52px 64px;min-height:640px}
.hero .eyebrow{font-size:9px;letter-spacing:1.35px;background:#e3f2f7;border-radius:20px;display:inline-flex;padding:8px 13px;color:#12648b;margin-bottom:24px}
.tiny-star{color:#0875b1;font-size:20px}
h1{font-weight:850;font-size:clamp(50px,5.15vw,73px);line-height:1.08;letter-spacing:-3.9px;margin-bottom:26px}
h1 em{position:relative;display:inline-block;font-style:normal;color:var(--blue);isolation:isolate}
h1 em svg{position:absolute;bottom:-11px;left:0;width:100%;height:22px;z-index:-1;overflow:visible;fill:none;stroke:var(--yellow);stroke-width:9;stroke-linecap:round}
.hero-description{font-size:15px;line-height:1.85;max-width:411px}
.button{background:var(--blue);border:2px solid var(--ink);border-radius:40px;padding:14px 24px;box-shadow:4px 4px 0 var(--ink);font-weight:700;font-size:13px}
.button:hover{background:#005d91;transform:translateY(-2px);box-shadow:4px 6px 0 var(--ink)}
.hero-note{font-size:10px;margin-top:26px}.note-line{height:3px;border-radius:3px;background:#ee8e63}
.pixel-stage{height:516px}
.stage-shape{inset:41px 9px 51px 7px;background:#78cceb;border-radius:48% 51% 46% 42% / 43% 43% 49% 49%;transform:rotate(-8deg)}
.stage-sun{position:absolute;top:21px;right:39px;width:117px;height:117px;background:var(--yellow);border-radius:50%;z-index:-1}
.orbit-doodle{position:absolute;inset:37px 0 auto;width:100%;height:400px;fill:none;stroke:#fffdf4;stroke-width:2.5;stroke-dasharray:7 9;opacity:.8;z-index:-1}
.pixel{width:390px;top:40px;filter:drop-shadow(8px 10px 0 #0875b118)}
.waving-hand{transform-origin:109px 313px;animation:reference-wave 5s ease-in-out infinite}
.hello-bubble{font:750 23px/1.1 Geist,Arial,sans-serif;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);top:19px;left:0;padding:17px 21px;transform:rotate(-7deg);background:white;border-radius:23px 23px 4px 23px;max-width:230px}
.doodle-star{top:39px;right:15px;color:#0875b1;font-size:61px;animation:doodle-drift 6s ease-in-out infinite}
.doodle-star svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.doodle-question{top:175px;right:-4px;color:#0a6696;font-family:Geist,Arial,sans-serif;font-style:normal;font-weight:800;font-size:84px;transform:rotate(15deg)}
.doodle-spark{top:276px;left:4px;stroke:#fff4b4;stroke-width:4;width:46px;animation:doodle-drift 7s ease-in-out infinite reverse}
.pixel-shadow{bottom:77px;width:210px}
.stage-caption{bottom:28px;left:48%;font-family:Geist,Arial,sans-serif;font-style:normal;font-size:12px;font-weight:650;transform:translateX(-50%) rotate(-3deg);background:#fffdf2;padding:6px 11px;border-radius:8px}
.caption-arrow{font-size:22px}.motion-toggle{bottom:-14px;font-size:10px;color:#35606d;min-height:40px}
.pixel-sticker{position:absolute;right:5px;bottom:74px;font-size:14px;font-weight:800;line-height:1.05;text-align:center;width:85px;height:85px;display:grid;align-content:center;background:#c9e8ba;border:2px dashed #397759;border-radius:50%;transform:rotate(13deg);box-shadow:3px 4px 0 #123c5214}
.chapter-strip{background:var(--yellow);border:0;padding-block:19px;transform:rotate(-.5deg)}
.chapter-strip .wrap{font-size:10px;font-weight:800;letter-spacing:1.1px}.chapter-strip .wrap span:nth-child(even){color:#0875b1;font-size:23px}
.books-section{padding-block:77px 64px}
h2{font-weight:800;letter-spacing:-2px;font-size:45px;line-height:1.12}
.section-heading h2{font-size:44px}.wonder-word{color:var(--blue)}
.section-heading .eyebrow{color:#bd4b2e}.section-heading>p{font-size:12px;font-weight:500;line-height:1.9}
.book-grid{gap:32px}.book-card{border:2px solid #123c5226;border-radius:25px;overflow:hidden;background:white;box-shadow:5px 6px 0 #123c520b}
.book-art{border-radius:0;min-height:446px;padding:44px 24px 24px}
.story-card .book-art{background:#a9def3}.coloring-card .book-art{background:#ffd1be}
.book-art::before{content:'';position:absolute;top:36px;left:50%;transform:translateX(-50%) rotate(-8deg);width:305px;height:335px;border:2px dashed #ffffffc9;border-radius:45% 45% 42% 46%}
.coloring-card .book-art::before{transform:translateX(-50%) rotate(10deg)}
.book-object{width:221px;margin-top:18px;margin-bottom:33px}.book-art>.coming-soon{top:19px;left:18px;border:1.5px solid var(--ink);background:#fff9d2;color:var(--ink);font-weight:800;font-size:9px;transform:rotate(-4deg);z-index:2}
.coloring-card .book-art>.coming-soon{background:#e7f4dc;transform:rotate(3deg)}
.art-squiggle{left:25px;bottom:83px;color:#258aaf;font-size:59px}.art-star{right:25px;bottom:89px;stroke:#c15639;fill:#ffea8b;width:54px}
.cover-switch{border:1.5px solid #123c5238;background:#ffffffb8;padding:4px}.cover-switch button{font-weight:650;font-size:10px;padding:7px 14px}.cover-switch button[aria-pressed=true]{background:var(--blue)}
.book-copy{padding:26px 28px 11px}.book-category{letter-spacing:1.1px;color:#17688c;font-size:9px;font-weight:750}
.coloring-card .book-category{color:#a74931}.book-copy h3{font-weight:800;letter-spacing:-1.1px;font-size:30px;line-height:1.13}
.book-subtitle{font-weight:650;font-size:12px;margin-bottom:17px}.book-copy>p:not(.book-category):not(.book-subtitle){font-size:12px;line-height:1.85}
.text-link{font-size:12px;font-weight:750;padding-block:15px}.text-link span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e7f3f8;font-size:19px}.coloring-card .text-link span{background:#ffebe2}
.release-note{font-size:10px}.release-note span{color:#af472b}
.meet-section{background:#1476a3;padding-block:66px;border:0;color:white;position:relative;overflow:hidden}
.meet-section::before{content:'?';position:absolute;left:-25px;bottom:-85px;color:#ffffff0b;font-size:390px;font-weight:850;line-height:1;transform:rotate(-15deg)}
.meet-section .eyebrow{color:#ffed9b;font-weight:750}.meet-heading h2{font-weight:850;font-size:51px;letter-spacing:-2.5px}.meet-heading h2 em{color:#ffdf64;font-style:normal}
.meet-heading p:not(.eyebrow){color:#f0f9ff;font-size:13px;max-width:395px}
.meet-layout{gap:65px;align-items:center}.question-list{display:flex;flex-direction:column;gap:17px;padding:8px}
.question-list>div,.question-list>div:first-child,.question-list>div:last-child{border:0;padding:21px 22px 21px 63px;border-radius:15px;color:var(--ink);box-shadow:5px 5px 0 #064c7726;background:#fff3ba;transform:rotate(-2deg)}
.question-list>div:nth-child(2){background:#ffd6c0;transform:rotate(2deg)}.question-list>div:nth-child(3){background:#d7edc4;transform:rotate(-1deg)}
.question-list h3{font-weight:800;font-size:24px;letter-spacing:-.8px;line-height:1.2}.question-list p{color:#435b64;font-size:11px;line-height:1.75}
.question-number{left:20px;top:21px;color:var(--ink);font-size:11px;font-weight:750;padding:4px;width:28px;height:28px;border:1.5px solid #123c5233;border-radius:50%;text-align:center;line-height:17px}
.pixel-activities{display:flex;gap:12px;align-items:center;margin-top:26px;flex-wrap:wrap}.pixel-activities span{font-size:13px;font-weight:800;padding:6px 15px;color:var(--ink);background:#ffdf64;border-radius:7px;transform:rotate(-7deg)}.pixel-activities span:nth-child(2){background:#ffd2bc;transform:rotate(5deg)}.pixel-activities span:nth-child(3){background:#d5edc4;transform:rotate(-3deg)}
.closing{padding-block:69px}.closing>p{font-weight:800;font-size:46px;letter-spacing:-1.8px;line-height:1.12}.closing-star{color:#ecad26}.closing-spark{color:#e37750}
.site-footer{border-top:2px dashed #d2e1dc}.site-footer .brand-name{font-size:38px}.site-footer .brand-sub{font-weight:750}.site-footer p{font-size:10px}
.book-dialog{border:2px solid var(--ink);border-radius:24px;box-shadow:9px 9px 0 #123c5244}.dialog-copy h2{font-weight:800;font-size:32px;letter-spacing:-1.2px}.dialog-copy .coming-soon{background:var(--yellow);border:1px solid var(--ink)}.dialog-copy ul{color:#486875}.dialog-image img{border-radius:5px}
.motion-paused .doodle{animation-play-state:paused}
@keyframes reference-wave{0%,8%,34%,100%{transform:rotate(0)}15%,28%{transform:rotate(12deg)}21%{transform:rotate(-7deg)}}
@keyframes doodle-drift{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -7px;rotate:9deg}}
@media(min-width:1500px){.hero h1{font-size:76px}.pixel-stage{scale:1.04}}
@media(max-width:1000px){h1{font-size:54px;letter-spacing:-3px}.hero{min-height:610px}.pixel-stage{height:489px}.pixel{width:353px;top:46px}.stage-shape{inset:51px 0 45px}.stage-sun{right:22px;width:98px;height:98px;top:38px}.hello-bubble{font-size:20px;padding:14px 16px;left:1px;top:30px}.pixel-sticker{width:74px;height:74px;right:-3px;bottom:78px;font-size:12px}.doodle-star{font-size:46px;right:0;top:49px}.doodle-question{font-size:63px;right:0}.stage-caption{font-size:10px;bottom:27px}.pixel-shadow{bottom:77px}.book-copy{padding-inline:22px}.book-copy h3{font-size:26px}.book-category{font-size:8px}.section-heading h2{font-size:38px}.meet-layout{gap:35px}.meet-heading h2{font-size:44px}.question-list>div,.question-list>div:first-child,.question-list>div:last-child{padding:20px 16px 20px 56px}.question-number{left:16px;top:20px}.question-list h3{font-size:21px}}
@media(max-width:760px){.site-header{height:87px}.brand-name{font-size:39px}.hero{padding-top:34px;padding-bottom:35px;min-height:0;gap:16px}.hero .eyebrow{font-size:8px;letter-spacing:.85px;padding:7px 10px;margin-bottom:21px}.hero-copy{max-width:100%}h1{font-size:clamp(43px,8.8vw,63px);letter-spacing:-2.8px;line-height:1.1}.hero-description{font-size:14px;max-width:420px;margin-bottom:24px}.hero-note{font-size:9px;margin-top:22px}.hero .button{padding:13px 23px;font-size:13px}h1 em svg{height:17px;bottom:-10px}.pixel-stage{height:455px;max-width:450px}.stage-shape{inset:39px 1px 46px}.pixel{width:342px;top:19px}.stage-sun{top:20px;right:31px;width:94px;height:94px}.hello-bubble{top:8px;left:14px;font-size:21px;padding:14px 16px}.orbit-doodle{inset:22px 0 auto;height:350px}.doodle-question{right:6px;top:156px;font-size:66px}.doodle-star{right:4px;top:31px;font-size:50px}.doodle-spark{left:3px;top:265px;width:40px}.pixel-sticker{right:2px;bottom:68px;width:78px;height:78px;font-size:13px}.pixel-shadow{bottom:82px;width:180px}.stage-caption{bottom:32px;font-size:11px;left:45%;padding:6px 9px}.motion-toggle{bottom:-10px}.chapter-strip{padding-block:17px}.chapter-strip .wrap{font-size:8px;letter-spacing:.7px;gap:10px}.chapter-strip .wrap span:nth-child(even){font-size:18px}.books-section{padding-block:49px 43px}.section-heading h2{font-size:35px;letter-spacing:-1.8px}.section-heading>p{margin-top:14px}.book-grid{gap:28px}.book-card{border-radius:20px}.book-art{min-height:427px;padding-top:39px}.book-object{width:215px;margin-top:17px}.book-art::before{width:280px;height:315px;top:42px}.book-copy{padding:24px 23px 8px}.book-copy h3{font-size:29px}.book-category{font-size:8px}.meet-section{padding-block:45px}.meet-heading h2{font-size:43px}.meet-layout{gap:22px}.question-list{gap:15px;padding-inline:5px}.question-list>div,.question-list>div:first-child,.question-list>div:last-child{padding:20px 18px 20px 58px}.question-list h3{font-size:23px}.question-list p{font-size:12px}.question-number{left:16px}.meet-section::before{bottom:-100px;font-size:300px}.closing{padding-block:54px}.closing>p{font-size:35px;letter-spacing:-1.5px}.closing-star{font-size:35px;top:62px}.closing-spark{font-size:32px;bottom:69px}.closing .button{font-size:12px;padding:13px 20px;gap:22px}.site-footer .brand-name{font-size:35px}.site-footer p{font-size:9px}.dialog-copy h2{font-size:29px}}
@media(max-width:380px){h1{font-size:40px;letter-spacing:-2.7px}.hero .eyebrow{font-size:7px;letter-spacing:.65px;padding-inline:8px}.hero .eyebrow .tiny-star{font-size:17px}.hero-description{font-size:13px}.pixel-stage{height:424px}.pixel{width:307px;top:29px}.hello-bubble{left:0;top:12px;font-size:19px}.stage-sun{right:19px;width:85px;height:85px}.doodle-star{font-size:43px;right:-4px}.doodle-question{right:0;font-size:55px;top:169px}.pixel-sticker{right:-3px;bottom:63px;width:68px;height:68px;font-size:11px}.stage-caption{font-size:9px;left:42%;bottom:28px}.pixel-shadow{bottom:76px;width:155px}.doodle-spark{width:31px;top:263px}.chapter-strip .wrap{font-size:7px;gap:6px;letter-spacing:.2px}.section-heading h2{font-size:30px}.book-copy{padding-inline:18px}.book-copy h3{font-size:25px}.book-art>.coming-soon{font-size:8px;padding:8px 10px;left:12px}.book-art::before{width:251px}.art-squiggle{left:12px;font-size:44px}.art-star{right:13px;width:41px}.meet-heading h2{font-size:38px}.question-list h3{font-size:21px}.closing>p{font-size:31px}.site-header nav{font-size:10px;gap:12px}.brand-sub{font-size:7px;max-width:55px}.brand-name{font-size:36px}}
