/* Motion is progressive: the full content stays visible without JavaScript. */
.headline-line{display:block}
.reading-progress{position:absolute;left:0;right:0;bottom:-2px;height:3px;overflow:hidden;pointer-events:none}
.reading-progress>span{display:block;width:100%;height:100%;background:var(--teal);transform:scaleX(0);transform-origin:left}
.header{position:sticky}
.nav>.mobile-login{display:none}
@media(max-width:900px){.nav>.mobile-login{display:flex}}
.nav-cta-label,.nav-cta-label .nav-cta-extended{font:inherit!important;letter-spacing:inherit;white-space:nowrap}
.hero .highlight::after{transform-origin:left center}
.hero .motion-mark::after{animation:mark-draw 500ms cubic-bezier(.16,1,.3,1) 300ms backwards}
@keyframes mark-draw{from{transform:scaleX(0) rotate(-1deg)}to{transform:scaleX(1) rotate(-1deg)}}
.star-one{animation:none}
.quiz-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit;z-index:8;contain:strict}
.quiz-particles>i{position:absolute;width:7px;height:10px;pointer-events:none;opacity:0}
.demo-flashcard{backface-visibility:hidden;transform-origin:center center}
/* Every layout may shrink without forcing a horizontal page scrollbar. */
.hero>* ,.quiz-layout>*,.tour>*,.parent-layout>*,.pricing-grid>*,.faq>*{min-width:0}
.wrap{max-width:1240px}
body{overflow-wrap:break-word}
.hero-visual,.parent-art,.final-mascot{isolation:isolate}
.menu-btn,.privacy-close{min-width:44px;min-height:44px}
.nav>a,.login,.footer-main nav>a,.footer-privacy-button{min-height:44px;display:inline-flex;align-items:center}
.footer-main nav{align-items:center;gap:5px 20px}
.quiz-tabs button{min-height:44px}
.quiz-option{min-height:50px}
.quiz-next,.flip-card,.tip-button{min-height:44px}
.tour-tab{min-height:88px;touch-action:manipulation}
.btn,.quiz-option,.quiz-next,.quiz-tabs button,.flip-card,.tip-button,.menu-btn,.privacy-btn{touch-action:manipulation}
.privacy-close{right:-12px;top:-13px}
.parent-art img,.final-mascot img{aspect-ratio:683/1024}
@media(hover:hover) and (pointer:fine){
 .subject-visual:hover>span{translate:0 -3px;transition:translate .2s}
 .subjects-row>div>span{transition:translate .18s,background .18s}
 .subjects-row>div>span:hover{translate:0 -3px;background:#E9EDE6}
 .text-link>span:last-child{transition:translate .18s}
 .text-link:hover>span:last-child{translate:2px -2px}
}
@media(min-width:681px) and (max-width:980px){
 .wrap{width:calc(100% - 64px)}
 .hero{grid-template-columns:1.05fr 1fr;gap:26px;padding-block:55px 68px}
 .hero h1{font-size:clamp(46px,6vw,59px)}
 .hero-description{font-size:15px}
 .hero .eyebrow{font-size:8px}
 .hero-visual{padding-inline:8px}
 .mascot-stage{height:420px}
 .speech-bubble{font-size:11px;left:-5px;max-width:220px}
 .tip-button{right:-2px;font-size:10px;padding-inline:12px}
 .hero-sticker{left:-5px;font-size:10px;padding-inline:12px}
 .hero-sticker small{font-size:9px}
 .hero-ctas{flex-wrap:wrap;gap:18px}
 .hero-ctas .btn{font-size:11px;padding-inline:14px}
 .micro-copy{font-size:10px}
 .tour{grid-template-columns:1fr;gap:25px}
 .tour-selector{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:stretch}
 .tour-tab{display:grid;grid-template-columns:1fr auto;padding:19px 15px;align-content:start;gap:10px}
 .tour-tab>span:nth-child(2){grid-column:1/-1;grid-row:2}
 .tour-tab b{font-size:21px;line-height:1.2}
 .tour-tab small{font-size:12px;line-height:1.8}
 .tour-number{margin:0}
 .tour-arrow{grid-column:2;grid-row:1;font-size:19px}
 .tour-display{width:100%;max-width:720px;margin:auto;min-height:400px}
 .tour-screen{min-height:350px;padding-inline:35px}
 .chat-message{max-width:85%;font-size:15px}
 .chat-header{font-size:14px}
 .chat-prompt{font-size:12px}
 .parent-layout{gap:35px}
 .parent-copy h2{font-size:38px}
 .parent-art-frame{height:430px}
 .section-aside{font-size:14px}
 .journey-step>p{font-size:14px}
 .quiz-layout{gap:32px;grid-template-columns:.85fr 1.15fr}
 .quiz-intro h2{font-size:43px}
 .quiz-notebook{padding-right:18px;padding-left:32px}
 .quiz-tabs{gap:5px}
 .quiz-tabs button{font-size:10px;padding-inline:8px}
 .quiz-meta{font-size:7px}
 .quiz-feedback{font-size:12px}
 .quiz-intro>p:not(.eyebrow){font-size:14px}
 .quiz-guide img{width:49px;height:49px}
}
@media(min-width:681px) and (max-width:850px){
 .pricing-grid{grid-template-columns:1fr;max-width:640px;margin-inline:auto;gap:28px}
 .price-card{display:grid;grid-template-columns:1fr auto;column-gap:25px;padding:29px}
 .plan-intro{min-height:0}
 .plan-intro p{max-width:350px;font-size:14px}
 .price{margin:14px 0;text-align:right;white-space:nowrap}
 .price>span{font-size:12px}
 .price-card ul{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;font-size:13px;padding-top:22px;margin-top:22px}
 .price-card li{margin-bottom:3px}
 .price-card .btn{grid-column:1/-1;grid-row:4;margin-top:15px}
 .parent-layout{display:flex;flex-direction:column-reverse;gap:35px}
 .parent-copy{width:100%;max-width:640px}
 .parent-copy h2 br:nth-child(2){display:none}
 .parent-copy>p:not(.eyebrow),.parent-list p{max-width:100%}
 .parent-art{width:100%;max-width:370px;margin:auto}
 .parent-art-frame{height:360px}
 .parent-art img{top:65px;width:285px}
}
@media(max-width:680px){
 .wrap{width:calc(100% - 40px)}
 .header .wrap{width:calc(100% - 28px)}
 .nav-wrap{height:76px;gap:10px}
 .nav{top:76px}
 .nav.is-open{max-height:calc(100svh - 76px);overflow:auto}
 .nav-actions{gap:10px}
 .nav-actions>.btn{min-height:44px;box-shadow:0 4px 0 var(--edge)}
 .menu-btn{width:44px;height:44px;align-items:center;padding:10px;flex-shrink:0}
 .hero{padding-top:38px;gap:28px}
 .hero h1{font-size:clamp(43px,10.5vw,64px);line-height:1.1}
 .hero-description{font-size:15px;line-height:1.8}
 .hero-ctas{gap:20px}
 .hero-ctas .btn{min-height:52px;font-size:12px;padding-inline:18px}
 .hero-ctas .text-link{min-height:44px}
 .micro-copy{font-size:10px;line-height:1.8}
 .hero-visual{width:100%;max-width:430px}
 .mascot-stage{height:400px}
 .speech-bubble{max-width:min(240px,75%);font-size:11px}
 .hero-sticker{max-width:95%;padding-inline:12px}
 .hero-sticker small{font-size:9px}
 .tip-button{font-size:10px;bottom:102px}
 .journey-step{grid-template-columns:108px minmax(0,1fr);gap:17px}
 .step-visual{width:108px;height:178px}
 .journey-step>p{font-size:14px;line-height:1.8}
 .journey-step h3{font-size:22px;line-height:1.15}
 .section-top h2,.pricing-heading h2{font-size:clamp(31px,8.4vw,40px)}
 .underline{white-space:normal}
 .quiz-layout{gap:28px}
 .quiz-notebook{min-height:475px;margin-left:4px;margin-right:3px;padding-right:18px}
 .quiz-tabs{gap:5px}
 .quiz-tabs button{flex:1;padding-inline:7px;font-size:11px;min-width:0}
 .quiz-meta{font-size:7px;gap:10px}
 #question-title{font-size:25px;min-height:65px}
 .quiz-option{font-size:14px;padding:12px 10px;line-height:1.5}
 .quiz-options{gap:10px}
 .quiz-feedback{font-size:13px}
 .quiz-footnote{font-size:10px;line-height:1.7}
 .quiz-next{font-size:12px}
 .tour-tab b{font-size:23px}
 .tour-tab small{font-size:14px}
 .tour-display{min-height:410px}
 .tour-screen{padding-inline:20px;min-height:360px}
 .chat-message{font-size:14px;max-width:95%}
 .chat-prompt{font-size:11px;gap:12px}
 .demo-label{font-size:9px}
 .demo-flashcard{font-size:15px;padding-inline:18px}
 .feedback-row{font-size:13px}
 .feedback-row small{font-size:12px}
 .feedback-note{font-size:13px}
 .parent-list p{font-size:14px}
 .price-card ul{font-size:14px}
 .price-card .btn{min-height:48px}
 .pricing-note{font-size:12px}
 .footer-main nav{gap:2px 18px}
 .footer-main nav>a,.footer-privacy-button{font-size:12px}
 .footer-company{font-size:11px}
 .footer-bottom{font-size:10px}
 .cookie-banner{bottom:max(14px,env(safe-area-inset-bottom));max-height:calc(100svh - 100px)}
 .cookie-dialog{max-height:calc(100svh - 32px)}
 .privacy-close{right:-8px;top:-9px}
 .privacy-reset{min-height:44px}
 .legal-toc a{min-height:40px;display:inline-flex;align-items:center}
}
@media(max-width:400px){
 .nav-cta-extended{display:none}
 .brand img{width:29px;height:38px}
 .brand>span{font-size:25px}
 .brand{gap:5px}
 .nav-actions>.btn{font-size:10px;padding-inline:11px;gap:10px}
 .hero h1{font-size:clamp(39px,10.8vw,43px)}
 .hero .highlight{white-space:nowrap}
 .hero-ctas .btn{font-size:11px;gap:15px;padding-inline:13px}
 .hero-ctas{gap:14px}
 .journey-step{grid-template-columns:90px minmax(0,1fr);gap:14px}
 .step-visual{width:90px;height:194px}
 .journey-step h3{font-size:21px}
 .journey-step>p{font-size:13px}
 .quiz-tabs button{font-size:10px;padding-inline:5px}
 .quiz-intro h2{font-size:42px}
 #question-title{font-size:23px}
 .option-letter{width:24px;height:24px}
 .quiz-option{font-size:13px;gap:8px}
 .quiz-notebook{padding-left:30px;padding-right:14px}
 .price-card{padding-inline:20px;column-gap:12px}
 .plan-intro p{font-size:12px;max-width:150px}
 .price{font-size:38px}
 .price>span{font-size:10px}
 .price-card ul{font-size:13px}
 .final-inner h2{font-size:49px}
}
@media(hover:none){
 .btn:hover,.tip-button:hover,.quiz-option:not(:disabled):hover{transform:none}
 .btn:active{transform:translateY(4px)}
 .tip-button:active,.quiz-option:not(:disabled):active{transform:translateY(2px)}
}
@media(prefers-reduced-motion:reduce){
 .hero .motion-mark::after{animation:none}
 .star-one{animation:none}
 .quiz-particles{display:none}
 .reading-progress>span{transition:none}
 .reveal-ready{opacity:1;transform:none}
 .subject-visual:hover>span,.subjects-row>div>span:hover{translate:none}
}

/* All interface pictograms are authored SVG, never emoji glyphs. */
.ui-icon{display:inline-block;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.12em;flex-shrink:0}
.stage-star .ui-icon,.strip-doodle .ui-icon{display:block;width:1em;height:1em;stroke-width:1.8}
.hero-sticker>span .ui-icon{width:18px;height:18px}
.option-letter .ui-icon{width:14px;height:14px}
.privacy-close .ui-icon{width:20px;height:20px}
.check-stamp .ui-icon{width:1em;height:1em;stroke-width:3}
.price-card li:before{width:13px;height:13px;top:.35em;background-color:var(--teal);mask:url('/assets/icon-check.svg') center/contain no-repeat;-webkit-mask:url('/assets/icon-check.svg') center/contain no-repeat}
.price-featured li:before{background-color:var(--peach)}
