:root{--ink:#353052;--purple:#6550ae;--purple-dark:#483486;--mint:#91d9c7;--yellow:#ffd365;--blue:#dff2f8;--paper:#fffefa;--shadow:0 7px 0 #d8d4e7;--font:ui-rounded,'Trebuchet MS',Arial,sans-serif;color-scheme:light;font-family:var(--font);color:var(--ink);background:#e4f3f7;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:300px}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;color:inherit}button:focus-visible{outline:4px solid #e7a33c;outline-offset:5px}button:disabled{cursor:default}button,input{-webkit-user-select:none;user-select:none}img{max-width:100%;-webkit-user-drag:none;user-select:none}svg{display:block}h1,h2,p{margin:0}button{border:0} [hidden]{display:none!important}#app{max-width:1600px;min-height:100svh;margin:auto;overflow:hidden;background:linear-gradient(#e4f3f7 0%,#f1f7f6 65%,#eee8df 100%)}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;position:relative;z-index:4}.wordmark{font-weight:900;font-size:25px;background:transparent;letter-spacing:-1px;padding:8px 0}.wordmark span{color:#9b83be}.wordmark .tiny-shape{color:#efb549;font-size:16px;margin-left:9px}.top-actions{display:flex;gap:10px}.icon-button{width:45px;height:45px;border-radius:50%;background:#fffefa;box-shadow:0 3px 0 #d5dfe1;font-size:27px;color:#6550ae;line-height:1}.icon-button[aria-pressed="false"]{color:#85858c}.eyebrow{font-size:14px;font-weight:800;letter-spacing:2px;color:#706985;text-transform:uppercase}.welcome{text-align:center;position:relative;padding:12px 24px 30px;min-height:calc(100svh - 76px)}.welcome-title{position:relative;z-index:2}.welcome h1{font-size:clamp(48px,6.5vw,88px);line-height:1.12;letter-spacing:-4px;color:#51418d;margin:11px 0 5px}.welcome h1 span{font-size:.7em;color:#a18cc5}.welcome h2{font-size:clamp(23px,3vw,37px);font-weight:600;letter-spacing:-1px}.welcome-scene{height:clamp(250px,35vh,400px);width:min(850px,95%);position:relative;margin:20px auto -4px}.welcome-scene:before{content:'';position:absolute;width:100%;height:25%;border-radius:50%;background:#e3dccb;bottom:-2%;left:0;opacity:.65}.hello{position:absolute;height:98%;bottom:0;filter:drop-shadow(0 12px 5px #56492b16);animation:breathe 3.8s ease-in-out infinite}.hello.lilac{left:0}.hello.aster{right:0;transform:scaleX(-1);animation:breathe-flip 4.1s ease-in-out infinite}.welcome-train{position:absolute;height:93%;left:50%;bottom:-8%;transform:translateX(-50%)}.play-button{display:inline-flex;align-items:center;justify-content:center;gap:18px;background:var(--purple);color:white;border-radius:23px;box-shadow:0 7px 0 var(--purple-dark);padding:19px 34px;font-size:25px;font-weight:800;position:relative;transition:transform .15s,box-shadow .15s;min-height:66px}.play-button:hover{background:#725dbc}.play-button:active{transform:translateY(4px);box-shadow:0 3px 0 var(--purple-dark)}.play-icon{font-size:23px}.welcome-note{font-size:16px;line-height:1.5;margin-top:23px;font-weight:600;color:#6f667b}.input-note{margin-top:9px;font-size:15px;color:#766e7f}.quiet-button{font-size:14px;padding:12px;background:none;color:#70667d;text-decoration:underline;text-underline-offset:4px;margin-top:7px}.game{padding:0 28px 24px;min-height:calc(100svh - 76px);display:flex;flex-direction:column;align-items:center}.route{display:flex;justify-content:center;gap:23px;align-items:center;width:min(640px,90%);padding:4px 0 22px;position:relative}.route:before{content:'';position:absolute;top:21px;left:5%;right:5%;height:5px;background:#d1dce4;border-radius:5px}.route-stop{width:34px;height:34px;flex:0 0 34px;border-radius:50%;background:#d8e2e8;border:4px solid #e4f3f7;z-index:1;color:#677280;display:grid;place-items:center;font-size:14px;font-weight:bold}.route-stop.current{background:#6550ae;color:white;box-shadow:0 0 0 4px #cfc4ee}.route-stop.done{background:#ffce5c;color:#785c22}.stage-heading{text-align:center;z-index:2;min-height:79px}.stage-heading h1{font-size:clamp(24px,3vw,38px);line-height:1.25;margin-top:7px;letter-spacing:-.7px}.stage-heading .eyebrow{font-size:13px;letter-spacing:1.7px}.play-area{position:relative;width:100%;min-height:290px;height:clamp(280px,35vh,400px);max-width:1250px;margin:8px auto 0}.play-area:before{content:'';position:absolute;bottom:0;left:0;right:0;height:27%;background:#e6dece80;border-radius:50%}.guide{position:absolute;height:95%;bottom:0;object-fit:contain;width:24%;z-index:2;pointer-events:none;animation:breathe 4s ease-in-out infinite}.guide-lilac{left:-1%}.guide-aster{right:-1%;transform:scaleX(-1);animation:breathe-flip 4.3s ease-in-out infinite}.guide.celebrate{animation:cheer .5s ease-in-out 2}.guide-aster.celebrate{animation:cheer-flip .5s ease-in-out 2}.puzzle{position:absolute;inset:0 23%;display:flex;align-items:center;justify-content:center;gap:20px;z-index:3}.target-card{background:#fffdf6;border:3px solid white;box-shadow:0 7px 0 #dedacb88;border-radius:36px;padding:24px;width:195px;height:195px;display:flex;justify-content:center;align-items:center;position:relative}.target-card svg{width:100%;height:100%}.target-card:after{content:'?';position:absolute;bottom:-13px;right:-13px;background:#ffce62;color:#87651c;border:5px solid #f0f6f3;width:46px;height:46px;display:grid;place-items:center;border-radius:50%;font-weight:900;font-size:26px}.drop-target{background:#fffdf780;border:3px dashed #a99abb;border-radius:26px;display:flex;align-items:center;justify-content:center;min-width:88px;min-height:88px;position:relative;padding:12px;touch-action:none;transition:background .15s,transform .15s}.drop-target svg{width:100%;height:100%;pointer-events:none}.drop-target.hovered{background:#e9dbff;transform:scale(1.04)}.drop-target.filled{border:3px solid #6cbea8;background:#f3ffef}.drop-target:focus-visible{outline:4px solid #eba638;outline-offset:4px}.feedback-row{height:48px;display:flex;gap:20px;align-items:center;justify-content:center;margin:10px 0 7px;width:100%;font-size:19px;font-weight:700;z-index:2}.feedback-row #feedback{min-width:200px;text-align:center}.hint-button{padding:8px 13px;border:1px solid #d4c5e7;border-radius:17px;color:#706091;background:#fdfaff;font-size:16px;font-weight:700;min-height:40px}.hint-button:hover{background:#f0e8fe}.choices{display:flex;align-items:center;justify-content:center;gap:17px;min-height:144px;width:100%;flex-wrap:wrap;padding:6px 0 9px}.choice{position:relative;border:3px solid #fff;background:#fffdf9;border-radius:25px;width:clamp(103px,10vw,140px);height:clamp(108px,11vw,147px);padding:15px;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s,border-color .15s;touch-action:none;flex-shrink:0}.choice svg{width:100%;height:100%;pointer-events:none}.choice:hover{transform:translateY(-4px)}.choice.selected{border-color:#8466ce;box-shadow:0 0 0 4px #dbcdf6,0 6px 0 #baacd7;transform:translateY(-5px)}.choice.used{opacity:.18;box-shadow:none;pointer-events:none;transform:scale(.85)}.choice.hinted,.drop-target.hinted,.memory-card.hinted{animation:hint-pulse 1s ease-in-out 3;outline:4px solid #b893e5;outline-offset:3px}.choice.wiggle{animation:wiggle .45s ease-out}.gesture{color:#786f81;font-size:15px;line-height:1.5;text-align:center;margin-top:8px}.train-workshop{height:100%;aspect-ratio:620/660;position:relative}.train-workshop>img{width:100%;height:100%;object-fit:contain;pointer-events:none}.train-slot{position:absolute;min-height:0;min-width:0;padding:0;border-width:2px;background:#fffdfab8;border-radius:13px;transform:translate(-50%,-50%)}.train-slot.hovered{transform:translate(-50%,-50%) scale(1.05)}.train-slot.wheel1{left:23%;top:80.3%;width:25%;height:23%}.train-slot.wheel2{left:77%;top:80.3%;width:25%;height:23%}.train-slot.cabin{left:62%;top:49%;width:33%;height:31%}.train-slot.roof{left:62%;top:27%;width:45%;height:37%}.train-slot.filled{background:transparent;border-color:transparent}.sorting-bins{display:flex;justify-content:center;gap:15px;width:100%;height:190px}.sorting-bin{min-width:0;flex:1;border-radius:28px;display:flex;flex-direction:column;gap:8px;padding:15px 9px}.sorting-bin>svg{height:82px;flex-shrink:0}.sorted-mini{display:flex;justify-content:center;flex-wrap:wrap;gap:3px;pointer-events:none}.sorted-mini svg{width:28px;height:28px}.count-card{width:235px;height:220px;display:flex;flex-direction:column;padding:18px}.count-card svg{height:100%;width:100%}.number-card .number{font-size:35px;font-weight:900;line-height:1}.number-card svg{height:49px}.size-puzzle{display:flex;align-items:center;justify-content:center;gap:20px;background:#fffdf6;border-radius:32px;padding:26px;width:95%;max-width:380px;box-shadow:0 7px 0 #dfdacd}.size-puzzle svg{width:100px;height:100px}.size-puzzle .size-indicator{font-size:38px;font-weight:bold;color:#9d87ba}.pattern-strip{display:flex;gap:7px;align-items:center;justify-content:center;background:#fffdf6;padding:18px 14px;border-radius:27px;width:100%;box-shadow:0 7px 0 #dfdacd}.pattern-strip svg{width:clamp(35px,4.5vw,75px);height:75px;min-width:0;flex:1}.pattern-strip .question{font-size:40px;color:#8d73af;display:grid;place-items:center;width:60px;font-weight:bold;flex-shrink:0}.memory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:95%;max-width:430px}.memory-card{border-radius:22px;background:#8c7ac1;box-shadow:0 5px 0 #65559b;border:3px solid #a497d0;aspect-ratio:1.12;display:flex;align-items:center;justify-content:center;padding:12px;color:#e4dcfa;font-size:36px;touch-action:manipulation}.memory-card svg{width:80%;height:80%;pointer-events:none}.memory-card.open{background:#fffdf8;border-color:white}.memory-card.matched{background:#e2f6e6;box-shadow:0 3px 0 #acd5b7;border-color:#afdbba;cursor:default}.confetti{position:absolute;inset:0;pointer-events:none;z-index:5;overflow:hidden}.confetti i{position:absolute;left:50%;top:35%;width:11px;height:17px;border-radius:4px;background:var(--c);animation:confetti 1.15s ease-out forwards}.stop-complete,.ending{text-align:center;min-height:calc(100svh - 76px);padding:25px 24px 40px}.stop-complete h1,.ending h1{font-size:clamp(36px,5vw,63px);letter-spacing:-2px;margin:8px 0 10px;color:#55428e}.big-star{font-size:72px;color:#edb247;text-shadow:0 5px 0 #c9902e;margin-bottom:15px;animation:small-bounce 2s ease-in-out infinite}.celebration-friends{display:flex;justify-content:center;align-items:end;height:clamp(210px,31vh,335px);gap:65px;margin:18px auto 20px}.celebration-friends img{height:100%;object-fit:contain}.celebration-friends img:nth-child(2){transform:scaleX(-1)}.end-copy{font-size:20px;color:#746687;line-height:1.5}.final-stars{font-size:30px;letter-spacing:9px;color:#dca13a;margin-top:16px}.ending-scene{display:flex;justify-content:center;align-items:end;height:clamp(230px,36vh,370px);max-width:850px;margin:15px auto 26px;gap:15px}.ending-scene img{height:100%;width:30%;object-fit:contain}.ending-scene img:nth-child(2){width:40%;height:95%}.ending-scene img:nth-child(3){transform:scaleX(-1)}dialog{width:min(470px,calc(100% - 32px));max-height:90svh;overflow:auto;border:0;border-radius:30px;padding:40px 32px;background:#fffefa;color:var(--ink);box-shadow:0 20px 90px #261d4966;text-align:center}dialog::backdrop{background:#3b315285;backdrop-filter:blur(5px)}dialog h2{font-size:29px;letter-spacing:-.8px;line-height:1.2;margin:0 0 16px}dialog p{font-size:17px;line-height:1.6;margin-bottom:18px;color:#766d80}dialog .play-button{font-size:20px;width:100%;padding:16px 20px}dialog .secondary-button{width:100%;margin-top:19px}.secondary-button{font-size:17px;background:#ede6f8;color:#665287;border-radius:17px;padding:15px 20px;font-weight:700;min-height:50px}.dialog-close{position:absolute;top:10px;right:12px;font-size:27px;background:none;color:#7a6b8d;width:38px;height:38px}.drag-ghost{position:fixed;width:95px;height:95px;border-radius:25px;background:#fffdf9dc;box-shadow:0 10px 25px #4b365440;z-index:100;pointer-events:none;padding:10px;transform:translate(-50%,-50%)}.drag-ghost svg{width:100%;height:100%}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes breathe{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes breathe-flip{0%,100%{transform:scaleX(-1) translateY(0) rotate(-1deg)}50%{transform:scaleX(-1) translateY(-5px) rotate(1deg)}}@keyframes cheer{50%{transform:translateY(-20px) rotate(-3deg)}}@keyframes cheer-flip{50%{transform:scaleX(-1) translateY(-20px) rotate(-3deg)}}@keyframes hint-pulse{50%{filter:brightness(1.07);outline-offset:9px}}@keyframes wiggle{25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}@keyframes small-bounce{50%{transform:translateY(-5px) rotate(4deg)}}@keyframes confetti{to{transform:translate(var(--x),var(--y)) rotate(var(--r));opacity:0}}
@media(min-width:1500px){.play-area{height:380px}.choices{gap:23px}.welcome-scene{height:370px}}@media(max-width:800px){.topbar{height:64px;padding:0 20px}.wordmark{font-size:22px}.game{padding:0 15px 22px}.play-area{min-height:250px;height:30vh;max-height:320px}.guide{height:77%;width:22%}.puzzle{inset:0 20%}.choices{gap:13px}.choice{width:104px;height:115px}.route{gap:15px;padding-bottom:18px}.stage-heading{min-height:71px}.feedback-row{font-size:17px;margin-top:8px}.welcome{padding-top:18px}.sorting-bins{gap:7px;height:165px}.sorting-bin{padding:10px 7px}.sorting-bin>svg{height:66px}.target-card{width:165px;height:165px}.welcome h1{letter-spacing:-2px}.welcome-scene{margin-top:30px}.pattern-strip{gap:4px;padding:12px}.pattern-strip svg{height:58px}.pattern-strip .question{width:35px;font-size:32px}.memory-grid{gap:8px}.memory-card{border-radius:17px;padding:8px}.train-workshop{min-height:240px}.size-puzzle{padding:16px;gap:10px}.size-puzzle svg{width:80px;height:80px}}
@media(max-width:520px){.topbar{padding:0 17px;height:62px}.wordmark{font-size:21px}.icon-button{width:41px;height:41px}.welcome{padding:14px 15px 25px}.welcome .eyebrow{font-size:11px;letter-spacing:1.6px}.welcome h1{font-size:49px;margin:9px 0 6px}.welcome h2{font-size:25px}.welcome-scene{height:240px;width:100%;margin:30px auto 12px}.hello{height:83%;bottom:6%}.hello.lilac{left:-4%}.hello.aster{right:-4%}.welcome-train{height:81%;bottom:-7%}.play-button{font-size:22px;padding:17px 28px;border-radius:21px;min-height:63px;gap:13px}.welcome-note{font-size:14px;max-width:280px;margin:22px auto 0}.input-note{font-size:14px}.game{padding:0 10px 23px}.route{width:96%;gap:9px;padding:3px 0 18px}.route-stop{width:30px;height:30px;flex-basis:30px;border-width:3px;font-size:12px}.route:before{top:18px}.stage-heading{min-height:66px}.stage-heading .eyebrow{font-size:11px;letter-spacing:1px}.stage-heading h1{font-size:26px;line-height:1.2;margin-top:8px}.play-area{height:252px;min-height:252px;margin-top:5px}.puzzle{inset:0 9% 33px;gap:12px}.guide{height:118px;width:24%;bottom:-2px;opacity:1;z-index:1}.guide-lilac{left:-3%}.guide-aster{right:-3%}.target-card{width:151px;height:151px;padding:21px;margin-top:-18px;border-radius:29px}.target-card:after{height:39px;width:39px;font-size:22px;right:-8px}.feedback-row{margin:2px 0 2px;height:42px;gap:6px;justify-content:center;font-size:16px}.feedback-row #feedback{min-width:150px;max-width:210px}.hint-button{font-size:14px;min-height:36px;padding:5px 9px}.hint-button span{font-size:13px}.choices{gap:11px;min-height:108px;padding-top:10px;align-content:center}.choice{height:94px;width:91px;border-radius:21px;padding:13px;box-shadow:0 5px 0 #d8d4e7;border-width:2px}.choices.six .choice{width:86px;height:87px;padding:12px}.choices.four .choice{width:73px;height:88px;padding:9px}.gesture{font-size:13px;line-height:1.5;max-width:310px;margin-top:9px}.train-workshop{height:246px;min-height:246px;margin-top:-22px}.sorting-bins{height:146px;gap:7px;margin-top:-17px}.sorting-bin>svg{height:54px}.sorting-bin{border-radius:21px;padding:12px 7px}.sorted-mini svg{width:21px;height:21px}.count-card{width:180px;height:180px;padding:16px}.number-card .number{font-size:28px}.number-card svg{height:32px}.pattern-strip{gap:4px;border-radius:23px;padding:15px 10px;margin-top:-25px}.pattern-strip svg{height:52px}.memory-grid{max-width:260px;width:92%;gap:9px;margin-top:-11px}.memory-card{aspect-ratio:1.1;font-size:28px;border-radius:17px}.size-puzzle{margin-top:-20px;padding:17px;width:90%;gap:14px}.size-puzzle svg{width:80px;height:80px}.stop-complete,.ending{padding:20px 18px 35px}.big-star{font-size:60px;margin:7px 0 20px}.celebration-friends{height:230px;gap:13px;margin:25px auto 22px}.celebration-friends img{width:43%;object-fit:contain}.stop-complete h1,.ending h1{font-size:39px;letter-spacing:-1.4px}.end-copy{font-size:17px;max-width:250px;margin:auto}.final-stars{font-size:25px;letter-spacing:3px;margin-top:22px}.ending-scene{height:230px;gap:0;margin:25px auto 20px}.ending-scene img{width:32%;height:89%}.ending-scene img:nth-child(2){width:38%;height:78%}.ending .play-button{font-size:19px;padding:17px 24px}dialog{padding:39px 25px 30px}dialog h2{font-size:27px}dialog p{font-size:16px}}
@media(max-height:580px) and (min-width:650px){.topbar{height:53px}.welcome{padding-top:0;min-height:0}.welcome .eyebrow{display:none}.welcome h1{font-size:43px;margin:0}.welcome h2{font-size:22px}.welcome-scene{height:190px;width:570px;margin:0 auto -5px}.welcome .play-button{font-size:20px;padding:13px 28px;min-height:51px}.welcome-note{margin-top:17px;font-size:14px}.welcome .input-note,.welcome .quiet-button{display:none}.game{padding-bottom:13px}.route{padding-bottom:12px}.stage-heading{min-height:52px}.stage-heading h1{font-size:27px;margin-top:3px}.stage-heading .eyebrow{font-size:11px}.play-area{height:205px;min-height:205px;margin:0}.puzzle{inset:0 27%}.guide{height:98%}.target-card{width:135px;height:135px;padding:17px}.feedback-row{height:30px;margin:2px 0;font-size:16px}.choices{min-height:92px;padding-top:3px}.choice{height:82px;width:92px;padding:11px;border-radius:19px}.gesture{font-size:12px;margin-top:5px}.train-workshop{height:210px;min-height:210px}.sorting-bins{height:145px}.memory-grid{max-width:270px}.memory-card{padding:7px}.celebration-friends{height:180px;margin:8px auto 15px}.big-star{font-size:45px;margin:0}.stop-complete h1,.ending h1{font-size:34px}.ending-scene{height:175px;margin:0 auto 8px}.final-stars{margin-top:7px;font-size:23px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition:none!important}.guide-aster,.hello.aster{transform:scaleX(-1)}}
@media(max-width:520px){.play-area{height:270px;min-height:270px}.puzzle{inset:0 9% 70px}.guide{height:100px;width:21%;bottom:0}.guide-lilac{left:-3%}.guide-aster{right:-3%}}
