:root{color-scheme:light;--leaf:#42c957;--leaf-dark:#168845;--lime:#b8f34a;--mint:#e8fff0;--sky:#dff6ff;--sun:#ffd44d;--berry:#7a4cff;--ink:#173124;--muted:#5e7568;--line:#c9e8d2;--paper:#fff;--soft:#f7fbf8;--danger:#c84747;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:var(--soft);margin:0;line-height:1.5}a{color:inherit}img,svg{max-width:100%;display:block}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.site-shell{min-height:100vh}.container{width:min(1120px,100% - 32px);margin:0 auto}.site-header{z-index:20;backdrop-filter:blur(16px);background:#ffffffe0;border-bottom:1px solid #16884526;position:sticky;top:0}.nav{justify-content:space-between;align-items:center;gap:24px;min-height:72px;display:flex}.brand{align-items:center;gap:10px;font-size:1.25rem;font-weight:900;text-decoration:none;display:inline-flex}.brand-mark{border:2px solid var(--leaf-dark);background:linear-gradient(135deg, var(--lime), var(--leaf));border-radius:12px;place-items:center;width:38px;height:38px;display:grid;box-shadow:0 6px #1688452e}.brand-eye{background:var(--ink);width:9px;height:9px;box-shadow:12px 0 0 var(--ink);border-radius:999px}.nav-links{align-items:center;gap:8px;display:flex}.nav-links a{color:var(--muted);border-radius:999px;padding:10px 14px;font-weight:800;text-decoration:none}.nav-links a:hover,.nav-links a:focus-visible{color:var(--ink);background:var(--mint);outline:none}.nav-actions{align-items:center;gap:10px;display:flex}.nav-play,.nav-topic{background:linear-gradient(135deg, var(--leaf), var(--leaf-dark));color:#fff;border-radius:999px;justify-content:center;align-items:center;min-height:44px;padding:10px 16px;font-weight:1000;text-decoration:none;display:inline-flex;box-shadow:0 5px #16884533}.nav-topic{border:2px solid var(--line);color:var(--leaf-dark);background:#fff;box-shadow:0 5px #1688451a}.nav-play:hover,.nav-play:focus-visible,.nav-topic:hover,.nav-topic:focus-visible{outline-offset:3px;outline:3px solid #b8f34a99;transform:translateY(-1px)}.button{background:var(--ink);color:#fff;cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;min-height:48px;padding:12px 20px;font-weight:900;text-decoration:none;display:inline-flex;box-shadow:0 6px #17312429}.button:hover,.button:focus-visible{outline-offset:3px;outline:3px solid #b8f34aa6;transform:translateY(-1px)}.button.secondary{color:var(--ink);border:2px solid var(--line);background:#fff}.start-button{background:linear-gradient(135deg, var(--leaf), var(--leaf-dark));color:#fff;min-height:68px;padding:18px 34px;font-size:1.2rem;box-shadow:0 9px #16884538}.start-button:before{content:"▶";margin-right:10px;font-size:.9em}.start-button:hover,.start-button:focus-visible{box-shadow:0 10px #16884542}.topic-button{border:2px solid var(--leaf);min-height:62px;color:var(--leaf-dark);background:#fff;font-size:1.12rem}.topic-button:before{content:"▦";margin-right:10px;font-size:.95em}.hero{background:radial-gradient(circle at 10% 20%,#ffd44d59,#0000 24%),radial-gradient(circle at 88% 16%,#7a4cff29,#0000 22%),linear-gradient(#f1fff5 0%,#e1f7ff 100%);padding:56px 0 34px;position:relative;overflow:hidden}.hero:after{content:"";background:linear-gradient(135deg,#1688451f 25%,#0000 25%) 0 0/64px 64px,linear-gradient(225deg,#1688451f 25%,#0000 25%) 0 0/64px 64px;height:72px;position:absolute;bottom:0;left:0;right:0}.hero-grid{z-index:1;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);align-items:center;gap:44px;display:grid;position:relative}.eyebrow{color:var(--leaf-dark);text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px;font-weight:900}h1,h2,h3,p{overflow-wrap:anywhere}h1{letter-spacing:0;max-width:760px;margin:0;font-size:clamp(2.55rem,7vw,5.8rem);line-height:.94}h2{letter-spacing:0;margin:0;font-size:clamp(2rem,4vw,3.15rem);line-height:1.05}h3{letter-spacing:0;margin:0;font-size:1.2rem}.lead{max-width:660px;color:var(--muted);margin:22px 0 0;font-size:clamp(1.08rem,2vw,1.34rem)}.hero-actions{flex-wrap:wrap;gap:14px;margin-top:30px;display:flex}.trust-line{color:var(--muted);flex-wrap:wrap;gap:12px;margin-top:26px;font-weight:800;display:flex}.trust-line span{align-items:center;gap:8px;display:inline-flex}.trust-line span:before{background:var(--leaf);content:"";border-radius:999px;width:10px;height:10px}.monster-stage{background:linear-gradient(#fffc,#fff6),linear-gradient(90deg,#42c95724 50%,#ffffff24 50%) 0 0/56px 56px,#cbf1dc;border:3px solid #1688452e;border-radius:28px;min-height:420px;position:relative;box-shadow:0 22px 56px #1688452e}.garden-ground{background:linear-gradient(#7edb77,#42b85c);border-radius:0 0 24px 24px;height:34%;position:absolute;bottom:0;left:0;right:0}.monster{aspect-ratio:1;background:radial-gradient(circle at 42% 42%,#ffffffd9,#0000 0 18%,#0000 19%),radial-gradient(circle at 60% 42%,#ffffffd9,#0000 0 18%,#0000 19%),linear-gradient(145deg,#caff62,#4ad65b 58%,#24a84b);border:4px solid #14773c;border-radius:44% 48% 42% 46%;width:min(270px,66%);position:absolute;bottom:18%;right:12%;box-shadow:inset -18px -22px #1688452e,0 18px #1688452e}.monster:before,.monster:after{background:var(--ink);content:"";border-radius:999px;width:21%;height:15%;position:absolute;top:34%}.monster:before{left:31%}.monster:after{right:31%}.monster-smile{border-bottom:5px solid var(--ink);border-radius:0 0 999px 999px;width:28%;height:12%;position:absolute;bottom:29%;right:36%}.leaf-chip{min-width:84px;min-height:54px;color:var(--leaf-dark);background:#fff;border:2px solid #16884533;border-radius:18px;place-items:center;font-size:1.45rem;font-weight:1000;display:grid;position:absolute;box-shadow:0 10px #1688451f}.leaf-chip.one{top:15%;left:10%;transform:rotate(-6deg)}.leaf-chip.two{top:28%;right:9%;transform:rotate(5deg)}.leaf-chip.three{bottom:16%;left:12%;transform:rotate(4deg)}.section{padding:72px 0}.section.alt{background:#fff}.section-head{gap:14px;max-width:780px;margin-bottom:32px;display:grid}.section-head p{color:var(--muted);margin:0;font-size:1.12rem}.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}.feature{border:2px solid var(--line);background:var(--paper);border-radius:8px;align-content:start;gap:12px;min-height:188px;padding:22px;display:grid}.feature-icon{background:var(--mint);width:50px;height:50px;color:var(--leaf-dark);border-radius:16px;place-items:center;font-weight:1000;display:grid}.feature p{color:var(--muted);margin:0}.steps{counter-reset:steps;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.step{border-left:4px solid var(--leaf);background:#ffffffad;min-height:164px;padding:18px 18px 18px 22px;position:relative}.step:before{background:var(--ink);color:#fff;content:counter(steps);counter-increment:steps;border-radius:999px;place-items:center;width:34px;height:34px;margin-bottom:14px;font-weight:900;display:inline-grid}.step p{color:var(--muted);margin:8px 0 0}.grade-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;display:grid}.grade-tile{color:#fff;text-align:center;border:3px solid #ffffffe6;border-radius:22px;place-items:center;min-height:150px;text-decoration:none;display:grid;position:relative;overflow:hidden;box-shadow:0 10px #17312429}.grade-tile:before,.grade-tile:after{content:"";background:#ffffff3d;border-radius:999px;width:28px;height:28px;position:absolute}.grade-tile:before{top:14px;left:14px}.grade-tile:after{bottom:14px;right:14px}.grade-tile strong{z-index:1;text-shadow:0 3px #0000002e;letter-spacing:0;font-size:clamp(2.3rem,6vw,4rem);line-height:.95;display:block;position:relative}.grade-tile span{z-index:1;margin-top:6px;font-weight:900;position:relative}.grade-tile.active{background:linear-gradient(145deg,#ff7f96,#e82d52)}.grade-tile.locked{filter:grayscale(.9);opacity:.58;cursor:not-allowed}.tile-pre{background:linear-gradient(145deg,#c16cff,#7a4cff)}.tile-k{background:linear-gradient(145deg,#ff76cb,#da27a4)}.tile-2{background:linear-gradient(145deg,#ffab4a,#f15f2f)}.tile-3{background:linear-gradient(145deg,#ffd84d,#f5a800)}.tile-4{background:linear-gradient(145deg,#c8f146,#76be24)}.tile-5{background:linear-gradient(145deg,#75e6a2,#23a96c)}.tile-6{background:linear-gradient(145deg,#55e5e9,#17a6b9)}.tile-7{background:linear-gradient(145deg,#5db6ff,#2074e6)}.tile-8{background:linear-gradient(145deg,#7f73ff,#3429df)}.topic-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.topic{border:2px solid var(--line);background:#fff;border-radius:8px;gap:10px;min-height:170px;padding:22px;text-decoration:none;display:grid}.topic:hover,.topic:focus-visible{border-color:var(--leaf);outline-offset:3px;outline:3px solid #b8f34a73}.topic small{color:var(--leaf-dark);text-transform:uppercase;letter-spacing:.08em;font-weight:900}.topic p{color:var(--muted);margin:0}.legal{max-width:780px;padding:64px 0}.legal h1{font-size:clamp(2.2rem,6vw,4rem)}.legal h2{margin-top:34px;font-size:1.55rem}.legal p,.legal li{color:var(--muted);font-size:1.05rem}.site-footer{border-top:1px solid var(--line);background:#fff;padding:30px 0}.game-shell{background:radial-gradient(circle at 15% 18%,#ffd44d4d,#0000 24%),linear-gradient(#e9fff0,#e5f7ff 62%,#f7fbf8);min-height:calc(100vh - 143px);padding:32px 0 64px}.game-board,.consent-panel{width:min(1120px,100% - 32px);margin:0 auto}.consent-panel{border:2px solid var(--line);background:#fff;border-radius:8px;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px;padding:18px;display:flex}.consent-panel h2,.consent-panel p{margin:0}.consent-panel p{color:var(--muted);margin-top:6px}.consent-actions{flex-wrap:wrap;gap:10px;display:flex}.game-board{grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr);align-items:stretch;gap:20px;display:grid}.game-panel,.game-side,.results-board .result-content{background:#ffffffeb;border:2px solid #16884533;border-radius:8px;box-shadow:0 18px 50px #16884521}.game-panel{gap:18px;padding:clamp(18px,3vw,28px);display:grid}.game-side{align-content:start;gap:18px;padding:18px;display:grid}.game-side p{color:var(--muted);margin:0;font-weight:800}.game-topline{color:var(--leaf-dark);text-transform:uppercase;letter-spacing:.08em;flex-wrap:wrap;justify-content:space-between;gap:10px;font-weight:1000;display:flex}.question-card{border:3px solid var(--line);background:linear-gradient(90deg,#b8f34a2e 50%,#0000 50%) 0 0/44px 44px,#fff;border-radius:8px;align-content:center;min-height:190px;padding:clamp(20px,4vw,34px);display:grid}.question-card h1{font-size:clamp(2rem,5vw,4.5rem);line-height:1}.game-eyebrow{color:var(--leaf-dark);text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px;font-weight:1000}.feedback-box{border-left:5px solid var(--sun);min-height:56px;color:var(--ink);background:#fffbe8;padding:14px 16px;font-size:1.08rem;font-weight:850;transition:background .16s,border-color .16s,color .16s,transform .16s}.feedback-box.correct{border-left-color:var(--leaf-dark);color:#0e6933;background:#eaffef;animation:.42s feedback-pop}.feedback-box.incorrect{border-left-color:var(--danger);color:#8f2727;background:#fff0f0;animation:.42s feedback-shake}.choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.choice-button,.pad-key,.game-button,.game-link{touch-action:manipulation;border-radius:8px;min-height:60px;font-weight:950}.choice-button,.pad-key{appearance:none;color:var(--ink);cursor:pointer;background:#fff;border:2px solid #16884533}.choice-button{padding:18px 20px;font-size:clamp(1.2rem,2vw,1.6rem)}.choice-button:focus-visible,.pad-key:focus-visible{border-color:var(--leaf);outline-offset:2px;background:#fff;outline:3px solid #b8f34a80}.choice-button:focus,.choice-button:active,.choice-button:hover{color:var(--ink);background:#fff}.choice-button.is-correct{border-color:var(--leaf-dark);color:#0e6933;background:#eaffef;box-shadow:inset 0 0 0 3px #16884524}.choice-button.is-wrong{border-color:var(--danger);color:#8f2727;background:#fff0f0;animation:.42s feedback-shake}.choice-button:disabled,.pad-key:disabled,.game-button:disabled{cursor:not-allowed}.choice-button:disabled:not(.is-correct),.pad-key:disabled,.game-button:disabled{opacity:.6}.number-pad-wrap{gap:12px;display:grid}.number-display{border:2px solid var(--line);min-height:62px;color:var(--ink);background:#fff;border-radius:8px;place-items:center;font-size:1.8rem;font-weight:1000;display:grid}.number-pad{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.pad-key{font-size:1.35rem}.pad-key.utility{color:var(--leaf-dark);font-size:1rem}.game-button{background:var(--ink);color:#fff;cursor:pointer;text-align:center;border:0;justify-content:center;align-items:center;padding:14px 18px;text-decoration:none;display:inline-flex;box-shadow:0 6px #17312429}.game-button.secondary{border:2px solid var(--line);color:var(--ink);background:#fff}.sound-toggle{gap:8px}.sound-toggle:before{background:var(--leaf);content:"";border:2px solid #17312438;border-radius:999px;width:14px;height:14px;display:inline-block;box-shadow:inset 0 0 0 3px #fff}.sound-toggle.is-off{color:var(--muted)}.sound-toggle.is-off:before{background:#aeb8af}.answer-submit{width:100%}.game-controls{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.game-link{color:var(--muted);cursor:pointer;text-underline-offset:4px;background:0 0;border:0;align-items:center;padding:0 12px;text-decoration:underline;display:inline-flex}@media (hover:hover) and (pointer:fine){.choice-button:hover,.pad-key:hover{border-color:var(--leaf);background:#fff}.choice-button.is-correct:hover,.choice-button.is-correct:focus-visible{background:#eaffef}.choice-button.is-wrong:hover,.choice-button.is-wrong:focus-visible{background:#fff0f0}}.game-scene{background:linear-gradient(#ffffffb8,#ffffff3d),linear-gradient(90deg,#42c95721 50%,#ffffff29 50%) 0 0/48px 48px,#cff4dd;border-radius:8px;place-items:center;min-height:260px;display:grid;position:relative;overflow:hidden}.game-scene:after{content:"";background:linear-gradient(#86dc7c,#39af57);height:34%;position:absolute;bottom:0;left:0;right:0}.confetti-burst{z-index:4;pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti-piece{background:var(--paper-color);opacity:0;width:9px;height:16px;animation:confetti-splash .92s cubic-bezier(.12, .75, .22, 1) var(--delay) forwards;border-radius:2px;position:absolute;top:43%;left:50%;transform:translate(-50%,-50%)scale(.3)rotate(0);box-shadow:0 2px #1731241f}.confetti-piece:nth-child(3n){width:12px;height:8px}.confetti-piece:nth-child(4n){border-radius:999px}.game-monster{z-index:1;aspect-ratio:1;background:radial-gradient(circle at 42% 42%,#ffffffe6,#0000 0 18%,#0000 19%),radial-gradient(circle at 60% 42%,#ffffffe6,#0000 0 18%,#0000 19%),linear-gradient(145deg,#caff62,#4ad65b 58%,#24a84b);border:4px solid #14773c;border-radius:44% 48% 42% 46%;width:min(190px,72%);transition:transform .18s,filter .18s,background .18s;position:relative;box-shadow:inset -14px -18px #1688452e,0 14px #1688452e}.game-monster:before,.game-monster:after{background:var(--ink);content:"";border-radius:999px;width:20%;height:14%;position:absolute;top:34%}.game-monster:before{left:31%}.game-monster:after{right:31%}.game-monster-smile{border-bottom:5px solid var(--ink);border-radius:0 0 999px 999px;width:28%;height:12%;transition:right .16s,bottom .16s,width .16s,height .16s,border .16s;position:absolute;bottom:29%;right:36%}.monster-tear{z-index:2;background:linear-gradient(#bdeeff,#4aa9ff);border-radius:999px 999px 999px 4px;width:12px;height:26px;display:none;position:absolute;box-shadow:0 3px #1731241f}.tear-left{top:48%;left:34%}.tear-right{top:49%;right:33%;transform:scaleX(-1)}.mood-thinking{transform:rotate(-2deg)}.mood-happy{animation:.62s cubic-bezier(.2,.9,.2,1) monster-happy-pop;transform:translateY(-10px)rotate(2deg)scale(1.04)}.mood-happy .game-monster-smile,.mood-celebrate .game-monster-smile{border-bottom-width:7px;width:38%;height:15%;bottom:27%;right:31%}.mood-oops{filter:saturate(.8);animation:.68s monster-oops-wobble;transform:translate(-5px)rotate(-5deg)}.mood-oops:before,.mood-oops:after{border-radius:999px;height:8%;top:38%}.mood-oops:before{transform:rotate(16deg)}.mood-oops:after{transform:rotate(-16deg)}.mood-oops .game-monster-smile{border-top:5px solid var(--ink);border-bottom:0;border-radius:999px 999px 0 0;width:26%;height:12%;bottom:23%;right:37%}.mood-oops .monster-tear{animation:.78s ease-out tear-drop;display:block}.mood-celebrate{animation:.9s cubic-bezier(.2,.9,.2,1) infinite alternate monster-celebrate;transform:translateY(-10px)scale(1.05)}@keyframes feedback-pop{0%{transform:scale(.98)}55%{transform:scale(1.02)}to{transform:scale(1)}}@keyframes feedback-shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}55%{transform:translate(5px)}75%{transform:translate(-3px)}}@keyframes confetti-splash{0%{opacity:0;transform:translate(-50%,-50%)scale(.25)rotate(0)}12%{opacity:1}72%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--x)), calc(-50% + var(--y))) scale(1) rotate(var(--rotate))}}@keyframes monster-happy-pop{0%{transform:translateY(0)rotate(0)scale(1)}45%{transform:translateY(-18px)rotate(4deg)scale(1.08)}to{transform:translateY(-10px)rotate(2deg)scale(1.04)}}@keyframes monster-oops-wobble{0%,to{transform:translate(-5px)rotate(-5deg)}30%{transform:translate(5px)rotate(4deg)}60%{transform:translate(-8px)rotate(-6deg)}}@keyframes monster-celebrate{0%{transform:translateY(-8px)rotate(-2deg)scale(1.04)}to{transform:translateY(-18px)rotate(3deg)scale(1.08)}}@keyframes tear-drop{0%{opacity:0;transform:translateY(-8px)scale(.6)}20%{opacity:1}to{opacity:.95;transform:translateY(12px)scale(1)}}.progress-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.progress-strip span{border:2px solid var(--line);min-height:72px;color:var(--muted);text-align:center;background:#fff;border-radius:8px;place-items:center;font-weight:900;display:grid}.progress-strip strong{color:var(--ink);font-size:1.45rem;display:block}.results-board{align-items:center}.results-board .result-content{gap:16px;padding:clamp(22px,4vw,34px);display:grid}.result-content h2{font-size:clamp(2.2rem,5vw,4.8rem)}.result-content p{color:var(--muted);margin:0;font-size:1.1rem;font-weight:800}.footer-grid{justify-content:space-between;align-items:center;gap:20px;display:flex}.footer-links{flex-wrap:wrap;gap:14px;display:flex}.footer-links a{color:var(--muted);font-weight:800;text-decoration:none}.footer-links a:hover,.footer-links a:focus-visible{color:var(--ink)}@media (width>=881px) and (width<=1180px){.container,.game-board,.consent-panel{width:min(100% - 24px,1120px)}.nav-links{display:none}.game-shell{padding:20px 0 38px}.consent-panel{align-items:stretch;gap:14px;padding:14px}.game-board{grid-template-columns:minmax(0,1fr) minmax(230px,.36fr);gap:14px}.game-panel{gap:14px;padding:18px}.game-side{gap:12px;padding:14px}.question-card{min-height:152px;padding:22px}.question-card h1{font-size:clamp(2rem,4.1vw,3.55rem);line-height:1.03}.feedback-box{min-height:62px;padding:14px 16px;font-size:1.02rem}.choice-grid{gap:10px}.choice-button,.pad-key,.game-button{min-height:68px}.choice-button{padding:14px 16px;font-size:clamp(1.25rem,2.1vw,1.8rem)}.number-display{min-height:64px}.game-scene{min-height:216px}.game-monster{width:min(172px,76%)}.progress-strip span{min-height:66px;font-size:.86rem}.progress-strip strong{font-size:1.25rem}.game-controls{gap:8px}.game-link{min-height:48px;padding:0 10px}}@media (width>=881px) and (width<=1180px) and (height<=760px){.site-header{position:static}.nav{min-height:60px}.game-shell{min-height:auto;padding:14px 0 28px}.question-card{min-height:132px}.question-card h1{font-size:clamp(1.75rem,3.7vw,3rem)}.game-scene{min-height:184px}}@media (width<=880px){.hero-grid,.feature-grid,.steps,.topic-grid,.game-board{grid-template-columns:1fr}.hero{padding-top:40px}.monster-stage{min-height:350px}.grade-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-grid{flex-direction:column;align-items:flex-start}.consent-panel{flex-direction:column;align-items:stretch}.question-card h1{font-size:clamp(2rem,6.8vw,3.8rem);line-height:1.04}.choice-button,.pad-key,.game-button{min-height:68px}.game-side{order:2}}@media (width<=560px){.container{width:min(100% - 24px,1120px)}.nav{min-height:64px}.nav-links{display:none}.nav-actions{gap:8px}.nav-topic{display:none}.nav-play{min-height:42px;padding:9px 13px;font-size:.92rem}.hero-actions .button,.button,.consent-actions .game-button{width:100%}.grade-grid{gap:12px}.grade-tile{border-radius:18px;min-height:124px}.section{padding:54px 0}.choice-grid{grid-template-columns:1fr}.game-board,.consent-panel{width:min(100% - 24px,1120px)}.game-controls .game-button,.topic-button{width:100%}.question-card h1{font-size:clamp(1.65rem,9vw,2.9rem)}}