:root{color-scheme:light;--cream:#fff9ec;--ink:#294f46;--muted:#62766c;--coral:#e98270;--gold:#f3bf56;--leaf:#dceac3;--line:#e7e5d8;font-family:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#edf0df;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #247884;outline-offset:4px}button:disabled{cursor:default}img{max-width:100%;display:block}h1,h2,p{margin:0}button{border:0;background:none}dialog{color:var(--ink)}[hidden]{display:none!important}.app-shell{height:100dvh;min-height:520px;background:var(--cream);position:relative;isolation:isolate;overflow:hidden}#app{height:100%}.loading{height:100%;display:grid;place-content:center;justify-items:center;gap:18px;padding:24px;text-align:center}.loading img{width:140px;border-radius:50%}.loading h1{font-size:38px}.loading p{font-size:16px}.primary{display:flex;justify-content:center;align-items:center;gap:14px;min-height:66px;width:100%;padding:14px 18px;border-radius:24px;background:var(--ink);color:var(--cream);font-size:22px;font-weight:800;box-shadow:0 5px 0 #1f453536;transition:transform .15s,box-shadow .15s}.primary:active{transform:translateY(3px);box-shadow:0 1px 0 #1f453536}.primary.secondary{background:#759980}.primary:disabled{opacity:.65}.quiet{min-height:46px;font-size:14px;font-weight:700}.icon-button{width:48px;min-height:48px;display:grid;place-items:center;border-radius:50%;background:#294f4609;font-size:21px;flex-shrink:0}.icon-button svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.eyebrow{font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase}.lock{position:relative;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.lock.holding{animation:hold-glow 3s linear forwards}.lock small{position:absolute;top:100%;white-space:nowrap;font-size:11px;right:0;opacity:0}.lock:focus-visible small,.lock.holding small{opacity:1}.home{height:100%;overflow:auto;text-align:center;display:flex;flex-direction:column;padding:calc(12px + env(safe-area-inset-top)) 24px calc(16px + env(safe-area-inset-bottom));gap:10px}.home-top{display:flex;align-items:center;justify-content:space-between;text-align:left}.home-top .eyebrow{font-size:11px;letter-spacing:1.1px;line-height:1.6;max-width:240px;color:var(--muted)}.title{font-size:67px;letter-spacing:-2px;line-height:.98;overflow-wrap:anywhere}.title .intro{display:block;font-family:Georgia,serif;font-size:35px;font-weight:500;letter-spacing:-.7px;line-height:1.25;margin-bottom:4px}.subline{font-size:15px;margin-top:6px;color:var(--muted)}.subline span{color:#bd8b20}.hero{position:relative;flex:1;min-height:210px;max-height:400px;margin:0 -24px;overflow:hidden;isolation:isolate}.hero-landscape{position:absolute;inset:4% -1% 0;background:url('assets/meadow.png') center 15%/cover;border-radius:49% 49% 42% 42%;z-index:-1}.hero-bunny{position:absolute;width:104px;bottom:10%;left:27%;border:5px solid var(--cream);border-radius:50%;transform:rotate(-10deg);box-shadow:0 5px 16px #294f461a;animation:bob 4s ease-in-out infinite}.hero-person{position:absolute;right:20%;top:24%;transform:rotate(7deg)}.portrait{width:var(--photo-size,86px);height:var(--photo-size,86px);border:5px solid var(--cream);border-radius:50%;object-fit:cover;background:#f3d8ae;box-shadow:0 7px 21px #294f4620;display:grid;place-items:center;font-size:calc(var(--photo-size,86px)*.52);flex-shrink:0}.hero-heart{position:absolute;right:14%;top:16%;font-size:30px;color:var(--coral);animation:bob 3s ease-in-out infinite}.home-actions{display:grid;gap:9px;padding:0 4px}.home-meta{display:flex;justify-content:center;gap:17px;font-size:12px;color:var(--muted);padding:12px 0 2px}.photo-setup{color:var(--ink);text-decoration:underline;text-decoration-color:#a7b9a6;text-underline-offset:4px;font-size:14px;min-height:40px}.world{height:100%;display:flex;flex-direction:column}.hud{display:flex;justify-content:space-between;align-items:center;padding:calc(8px + env(safe-area-inset-top)) 17px 5px;gap:10px}.score{background:#fff;border-radius:30px;padding:9px 22px;font-size:27px;font-weight:800;display:flex;align-items:center;gap:8px}.heart{color:var(--coral)}.progress{display:flex;justify-content:center;align-items:center;gap:6px;padding:8px 0 13px}.progress i{width:9px;height:9px;border-radius:50%;background:#294f4612}.progress i.done{background:var(--coral)}.progress span{font-size:17px;margin-left:2px;color:var(--coral)}.world-scroll{flex:1;overflow:auto;scrollbar-width:none;overscroll-behavior:contain}.world-scroll::-webkit-scrollbar{display:none}.map{height:1490px;position:relative;background:#c9deaa url('assets/meadow.png') center/100% 100%;overflow:hidden}.map[data-theme="1"]{background-color:#e9daa0;background-blend-mode:luminosity}.map[data-theme="2"]{background-color:#b7d9cd;background-blend-mode:luminosity}.map-title{position:absolute;top:24px;left:0;right:0;text-align:center;font-family:Georgia,serif;font-size:25px;font-weight:700;text-shadow:0 1px 4px #fff;background:#fff9ecad;margin:auto;width:fit-content;padding:10px 16px;border-radius:30px}.route{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.station{position:absolute;width:88px;height:98px;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;isolation:isolate}.station .object{font-size:58px;filter:drop-shadow(0 4px 2px #294f4618);line-height:1.3}.station .step{border-radius:20px;background:var(--cream);font-size:13px;font-weight:800;min-width:31px;height:25px;display:grid;place-content:center;padding:0 7px}.station.active:before{content:"";position:absolute;width:100px;height:100px;border:3px dashed var(--gold);border-radius:50%;background:#fff9ecaa;z-index:-1;animation:halo 2.5s ease-in-out infinite}.station.active .step{background:var(--ink);color:var(--cream)}.station.active:after{content:"✦";position:absolute;color:#b98a23;right:-8px;top:-8px;font-size:29px}.traveler{position:absolute;width:57px;height:57px;border:3px solid var(--cream);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 3px 8px #294f4620;transition:top .8s ease,left .8s ease;z-index:3}.world-footer{padding:12px 22px calc(15px + env(safe-area-inset-bottom));background:var(--cream)}
dialog{border:0;padding:0;background:var(--cream);border-radius:30px;max-height:calc(100dvh - 30px);overscroll-behavior:contain;box-shadow:0 18px 90px #183d3850}dialog::backdrop{background:#294f4666;backdrop-filter:blur(2px)}#question-dialog{width:min(460px,calc(100% - 28px))}.question{padding:21px;display:grid;gap:18px;text-align:center}.question-header{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left}.question-header .eyebrow{font-size:11px;letter-spacing:1.5px;color:var(--muted)}.speaker{background:var(--leaf)}.speaker:disabled{opacity:.5}.question-visual{font-size:62px;min-height:94px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:7px;padding:5px 0;line-height:1.2}.question-visual.many{display:grid;grid-template-columns:repeat(5,1fr);font-size:35px;max-width:275px;justify-self:center;gap:8px}.question-visual.row{font-size:36px}.question h2{font-size:27px;line-height:1.25;overflow-wrap:anywhere}.answers{display:grid;grid-template-columns:repeat(var(--count,3),minmax(0,1fr));gap:10px}.answer-col{min-width:0}.answer{width:100%;min-height:146px;border:2px solid var(--line);border-radius:23px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12px 5px;transition:transform .15s,border-color .15s,background .15s}.answer:active{transform:scale(.95)}.answer.chosen{background:#fff0ca;border-color:#ebc875}.answer.chosen.correct{background:var(--leaf);border-color:#91af7b}.answer:not(.chosen):disabled{opacity:.65}.answer-label{font-size:14px;font-weight:750;line-height:1.2;overflow-wrap:anywhere}.symbol{width:70px;min-height:67px;display:grid;place-content:center;font-size:51px}.color-shape{width:59px;height:59px;background:var(--swatch)}.color-shape.circle{border-radius:50%}.color-shape.square{border-radius:7px}.color-shape.oval{height:42px;border-radius:50%;align-self:center}.color-shape.triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.dots{display:grid;grid-template-columns:repeat(var(--cols,3),auto);gap:7px;align-content:center;justify-content:center}.dots i{width:12px;height:12px;background:var(--coral);border-radius:50%;display:block}.number-symbol{font-size:34px;font-weight:850;line-height:1}.number-dots{margin-top:6px;gap:4px}.number-dots i{width:8px;height:8px}.read-answer{min-height:44px;min-width:46px;font-size:20px;margin:3px auto 0;display:grid;place-items:center}.read-answer:disabled{opacity:.4}.feedback{font-size:17px;font-weight:700;line-height:1.3;min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px}.question-back{min-height:44px;font-size:24px;justify-self:center;width:60px}.surprise-overlay{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:#fff9ec70;pointer-events:none;overflow:hidden}.surprise-heading{font-size:30px;font-weight:850;background:var(--cream);padding:12px 23px;border-radius:40px;z-index:2;text-align:center;max-width:94%;overflow-wrap:anywhere}.surprise-scene{width:280px;height:270px;position:relative;display:grid;place-items:center;isolation:isolate}.surprise-scene:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;background:#fff9ec60;z-index:-2}.surprise-photo{--photo-size:var(--peek-size,92px);position:absolute;left:95px;top:55px;animation:peek var(--duration) ease-in-out both;z-index:0}.surprise-object{position:absolute;font-size:173px;line-height:1;bottom:0;left:0;filter:drop-shadow(0 4px 5px #294f461a);z-index:1}.surprise-scene[data-kind="window"] .surprise-photo,.surprise-scene[data-kind="balcony"] .surprise-photo{z-index:2;left:89px;top:43px}.surprise-scene[data-kind="window"] .surprise-object,.surprise-scene[data-kind="balcony"] .surprise-object{font-size:235px;left:0}.surprise-scene[data-kind="car"],.surprise-scene[data-kind="bicycle"],.surprise-scene[data-kind="dash"]{animation:travel var(--duration) ease-in-out both}.surprise-scene[data-kind="car"] .surprise-photo,.surprise-scene[data-kind="bicycle"] .surprise-photo{top:12px;left:90px;animation:none}.surprise-scene[data-kind="car"] .surprise-object,.surprise-scene[data-kind="bicycle"] .surprise-object{left:22px;font-size:209px}.surprise-scene[data-kind="cloud"] .surprise-photo,.surprise-scene[data-kind="fence"] .surprise-photo{left:86px;top:25px;animation:peek-up var(--duration) ease-in-out both}.surprise-scene[data-kind="cloud"] .surprise-object{font-size:213px;left:14px}.surprise-scene[data-kind="hearts"] .surprise-photo,.surprise-scene[data-kind="dash"] .surprise-photo{--photo-size:155px;left:63px;top:45px;animation:none}.surprise-scene[data-kind="hearts"] .surprise-object{font-size:59px;left:188px;top:25px}.surprise-scene[data-kind="dash"] .surprise-object{font-size:50px;left:0;top:105px}.bonus{font-size:32px;color:var(--coral);font-weight:850;padding:10px 22px;border-radius:30px;background:var(--cream);z-index:2}.heart-rain{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}.floating-heart{position:absolute;left:var(--x);bottom:-50px;font-size:var(--size);color:var(--heart-color);animation:float-heart var(--speed) linear infinite;animation-delay:var(--delay)}.finish{height:100%;position:relative;overflow:auto;isolation:isolate;background:linear-gradient(#fff9eced,#fff9ece8),url('assets/meadow.png') center/cover}.finish-home{position:absolute;left:12px;top:calc(10px + env(safe-area-inset-top));z-index:3}.finish-content{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:calc(25px + env(safe-area-inset-top)) 29px calc(22px + env(safe-area-inset-bottom));position:relative;z-index:1;text-align:center}.finish .eyebrow{font-size:12px;color:var(--muted);letter-spacing:4px}.finish h1{font-size:43px;line-height:1.14;overflow-wrap:anywhere;max-width:100%}.finish-photo{--photo-size:206px;position:relative;margin:17px}.finish-photo:before,.finish-photo:after{content:"";position:absolute;inset:-12px;border:2px solid #f3bf5680;border-radius:50%}.finish-photo:after{inset:-24px;border:2px dashed #e9827050}.finish-photo img,.finish-photo .portrait{width:100%;height:100%}.finish-message{font-size:20px;font-weight:800;line-height:1.45}.finish-message small{font-size:17px;font-weight:500;display:block}.final-score{font-size:28px;font-weight:850;padding:12px 24px;border-radius:40px;background:#ffffffc9;color:var(--coral)}.finish-actions{display:grid;gap:14px;width:100%;margin-top:3px}
#parent-dialog{width:min(520px,calc(100% - 22px))}.gate{padding:30px;text-align:center;display:grid;gap:20px}.gate-icon{font-size:43px}.gate h2{font-size:27px}.gate p{font-size:16px;line-height:1.5}.gate .math{font-size:34px;font-weight:800}.gate input{font-size:27px;text-align:center;max-width:170px;margin:auto}.gate-error{color:var(--muted);font-size:14px;min-height:20px}.parent-heading{position:sticky;top:0;background:var(--cream);padding:18px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;z-index:3;gap:10px}.parent-heading h2{font-size:23px}.done{min-height:44px;border-radius:15px;color:var(--cream);background:var(--ink);padding:8px 15px;font-size:16px;font-weight:750}.parent-body{padding:20px;display:grid;gap:23px}.parent-section{display:grid;gap:14px}.parent-section h3{font-size:17px;margin:0}.parent-section p,.privacy-note{font-size:14px;line-height:1.5;color:var(--muted)}.photo-row{display:flex;gap:17px;align-items:center}.photo-actions{display:grid;justify-items:start;gap:7px}.photo-pick{min-height:47px;display:inline-flex;align-items:center;gap:8px;background:var(--leaf);border-radius:14px;padding:10px 15px;font-size:16px;font-weight:750;cursor:pointer}.file-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.photo-pick:focus-within{outline:3px solid #247884;outline-offset:3px}.danger-link{min-height:40px;color:#935347;font-size:14px;text-decoration:underline}.field{display:grid;gap:7px;font-size:14px;font-weight:650}input,select{border:1px solid #c5d1c0;background:#fff;padding:12px 13px;border-radius:13px;min-height:48px;width:100%;color:var(--ink);font-size:16px}select{appearance:auto}.toggle{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:16px;min-height:47px}.toggle input{appearance:none;width:50px;height:30px;min-height:0;border:0;border-radius:30px;position:relative;background:#c8d0c4;cursor:pointer;padding:0;flex-shrink:0}.toggle input:after{content:"";position:absolute;width:24px;height:24px;left:3px;top:3px;border-radius:50%;background:white;box-shadow:0 1px 4px #0002;transition:transform .15s}.toggle input:checked{background:var(--ink)}.toggle input:checked:after{transform:translateX(20px)}.soft-button{min-height:48px;border-radius:15px;background:var(--leaf);padding:10px 15px;font-size:16px;font-weight:700}.parent-divider{height:1px;background:var(--line);border:0;margin:0}.parent-status{font-size:14px;color:#915b2f;line-height:1.4}.notice{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);max-width:calc(100% - 30px);width:410px;background:var(--ink);color:white;border-radius:19px;padding:16px 20px;z-index:100;font-size:15px;line-height:1.4;box-shadow:0 5px 30px #183d382b}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes hold-glow{from{box-shadow:0 0 0 0 #f3bf5680}to{box-shadow:0 0 0 11px #f3bf56c0;background:#f3bf5640}}@keyframes halo{50%{box-shadow:0 0 0 6px #fff9ec44}}@keyframes peek{0%{translate:-43px 12px}30%,76%{translate:31px -12px}100%{translate:-40px 12px}}@keyframes peek-up{0%,100%{translate:0 55px}30%,76%{translate:0 -24px}}@keyframes travel{0%{translate:-210px 0}25%{translate:-80px 0}76%{translate:65px 0}100%{translate:280px 0}}@keyframes float-heart{0%{transform:translateY(0) rotate(-10deg);opacity:0}12%,80%{opacity:.7}100%{transform:translateY(-1050px) rotate(20deg);opacity:0}}
@media(min-width:640px){body{padding:22px;background:radial-gradient(ellipse at top,#f8f5e5,#e2e9d8);min-height:100dvh}.app-shell{width:500px;height:min(900px,calc(100dvh - 44px));min-height:600px;margin:auto;border-radius:32px;box-shadow:0 20px 75px #244a3821;border:1px solid #fff9;overflow:hidden}.title{font-size:74px}}
@media(max-height:760px){.home{gap:6px;padding-top:8px}.home-top .eyebrow{font-size:10px}.title{font-size:56px}.title .intro{font-size:29px}.hero{min-height:180px;max-height:290px}.home-meta{padding:5px 0 0}.home .primary{min-height:60px}.home-actions{gap:3px}.question{gap:12px;padding:18px}.question-visual{min-height:74px;font-size:55px}.question h2{font-size:24px}.answer{min-height:132px}.finish-content{gap:12px;padding-top:23px;padding-bottom:20px}.finish h1{font-size:32px}.finish-photo{--photo-size:140px;margin:12px}.finish-message{font-size:18px}.finish-message small{font-size:15px}.final-score{font-size:24px;padding:9px 23px}.finish-actions .primary{min-height:61px;font-size:20px}}
@media(max-width:360px){.home{padding-left:18px;padding-right:18px}.home-top .eyebrow{max-width:205px;font-size:10px}.question{padding:15px}.answers{gap:6px}.answer-label{font-size:13px}.symbol{width:60px}.color-shape{width:51px;height:51px}.primary{font-size:20px}.finish h1{font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.surprise-photo{translate:25px -10px!important}.surprise-scene[data-kind="cloud"] .surprise-photo,.surprise-scene[data-kind="fence"] .surprise-photo{translate:0 -20px!important}.floating-heart{bottom:var(--still-y);opacity:.5}}
