@charset "UTF-8";
:root{--ink:#292344;--muted:#827c96;--purple:#7953df;--purple-dark:#6040b6;--line:#eeeaf5;--yellow:#ffce56;--mint:#b9e9cd;--font:"Yuanti SC","Hiragino Maru Gothic ProN","PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:#fff;color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.6}button,a,input{font:inherit}button{cursor:pointer;color:inherit}button{border:0;background:none}button,a{-webkit-tap-highlight-color:transparent}button:disabled{cursor:default;opacity:.4}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #8f6de6;outline-offset:5px}svg{width:22px;height:22px;flex-shrink:0;vertical-align:middle}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}.wrap{max-width:1180px;width:calc(100% - 80px);margin-left:auto;margin-right:auto}.site-header{max-width:1320px;margin:auto;min-height:100px;padding:20px 40px;display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{display:flex;align-items:center;gap:11px;white-space:nowrap;font-size:24px;font-weight:900;letter-spacing:1px}.brand-sub{display:block;font-size:10px;letter-spacing:2px;color:#9a94a7;font-weight:500;margin-top:-2px}.brand-mark{display:grid;grid-template-columns:repeat(2,15px);gap:3px;transform:rotate(-7deg)}.brand-mark i{height:15px;background:var(--purple);border-radius:4px}.brand-mark i:nth-child(2){background:#ffcf57}.brand-mark i:nth-child(3){background:#ff8b85}.brand-mark i:nth-child(4){background:#9cdbbd}.site-header nav{display:flex;gap:37px;align-items:center}.site-header nav>a,.site-header nav>button{position:relative;font-size:14px;padding:10px 0;font-weight:600;color:#777187}.site-header nav .nav-active{color:var(--purple)}.nav-active:after{content:"";position:absolute;width:17px;height:4px;border-radius:6px;background:var(--purple);bottom:0;left:calc(50% - 8px)}.header-actions{display:flex;align-items:center;gap:17px}.parent-button{font-size:13px;display:flex;align-items:center;gap:7px;color:#878098}.parent-button svg{width:17px}.sound-button{background:#f5f2fc;border-radius:50%;width:38px;height:38px;display:grid;place-content:center;color:var(--purple)}.sound-button[aria-pressed=false]{color:#999}.hero{display:grid;grid-template-columns:.93fr 1.07fr;align-items:center;gap:30px;min-height:407px;padding-top:16px;padding-bottom:33px}.hero-copy{padding:10px 0 12px}.age-tag{display:inline-flex;gap:7px;align-items:center;color:#51896d;background:#edf9f1;border-radius:20px;padding:5px 12px;font-size:11px;font-weight:600;letter-spacing:1px}.age-tag>span{height:6px;width:6px;background:#71b68c;border-radius:50%}h1,h2,h3,p{margin:0}h1{font-size:48px;line-height:1.35;letter-spacing:1.4px;font-weight:900;margin:20px 0 16px;position:relative;width:max-content}.headline-spark{position:absolute;color:#ffc746;font-size:38px;right:-43px;top:40px;transform:rotate(15deg)}.hero-copy>p{font-size:16px;line-height:1.9;color:#8b849c;letter-spacing:.4px}.primary-button{background:var(--purple);color:#fff;min-height:53px;padding:13px 24px;display:inline-flex;align-items:center;justify-content:center;gap:20px;border-radius:14px;font-weight:700;box-shadow:0 5px 0 #6040ba;transition:transform .15s,box-shadow .15s}.primary-button:hover{background:#6c45d1;transform:translateY(-2px)}.primary-button:active{transform:translateY(3px);box-shadow:0 2px 0 #6040ba}.hero .primary-button{margin-top:25px}.hero-note{font-size:10px;color:#a39bad;margin-top:21px;display:flex;align-items:center;gap:5px}.tiny-check{background:#edf6ef;color:#73a482;border-radius:50%;width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;font-size:10px}.note-dot{padding:0 5px;color:#c8c1d3}.island-scene{position:relative;min-height:352px;border-radius:46% 44% 24% 25%;background:#edf8ff;isolation:isolate;margin:0 0 0 6px}.sun{position:absolute;right:49px;top:23px;width:50px;height:50px;border-radius:50%;background:#ffda68;box-shadow:0 0 0 9px #fff1bd80}.sun:before,.sun:after{content:"";position:absolute;top:20px;width:4px;height:5px;border-radius:50%;background:#c28e2e}.sun:before{left:17px}.sun:after{right:17px}.sun span{position:absolute;width:10px;height:5px;border:2px solid #c28e2e;border-top:0;border-radius:0 0 10px 10px;top:28px;left:20px}.cloud{position:absolute;background:#fff;border-radius:30px;height:20px;width:70px}.cloud:after,.cloud:before{content:"";position:absolute;background:#fff;border-radius:50%}.cloud:before{width:30px;height:30px;left:15px;top:-13px}.cloud:after{width:23px;height:23px;right:5px;top:-7px}.cloud-one{left:29px;top:70px;transform:scale(.85)}.cloud-two{right:-10px;top:131px;transform:scale(.65)}.speech-bubble{position:absolute;left:29%;top:23px;border-radius:16px 16px 16px 3px;padding:11px 18px;background:#fff;color:#655679;transform:rotate(-5deg);font-size:13px;font-weight:700;box-shadow:0 5px 12px #728bb309}.speech-bubble span{display:block;font-size:10px;margin-top:2px;color:#a39ab4;font-weight:400}.scene-spark{position:absolute;z-index:2;color:#b6a2e8;font-size:20px}.spark-one{right:19px;top:75px}.spark-two{left:72px;top:136px;color:#efd785}.island-ground{position:absolute;z-index:-1;bottom:30px;border-radius:50%;width:105%;left:-2.5%;height:108px}.ground-back{background:#d3efdc;bottom:37px;transform:rotate(-3deg)}.ground-front{background:#bce5ca;bottom:20px;height:76px;transform:rotate(2deg)}.hero-friends{position:absolute;display:flex;align-items:flex-end;justify-content:center;gap:20px;left:16px;right:20px;bottom:100px}.block-friend{--block-color:#ff8580;--block-dark:#e76b67;--size:39px;position:relative;display:inline-flex;flex-direction:column;align-items:center;isolation:isolate;padding:0;border:0;background:none;transform:rotate(var(--tilt,0deg));transform-origin:50% 100%;transition:transform .2s}.block-friend:hover{transform:rotate(0deg) translateY(-9px)}.friend-number{font-family:"Trebuchet MS",sans-serif;color:var(--block-dark);font-size:28px;font-weight:900;line-height:1.3;margin-bottom:4px}.block-grid{display:grid;grid-template-columns:repeat(var(--cols,1),var(--size));gap:2px;position:relative}.block-cell{height:var(--size);width:var(--size);background:var(--block-color);border:2px solid var(--block-dark);border-radius:5px;box-shadow:inset 0 -4px 0 #00000009,inset 0 2px 0 #ffffff45}.friend-face{position:absolute;top:9px;left:50%;transform:translateX(-50%);height:25px;width:calc(var(--size) - 3px);z-index:2}.friend-eye{position:absolute;top:0;background:#fff;border:1px solid #0000000d;border-radius:50%;height:13px;width:12px}.friend-eye:first-child{left:3px}.friend-eye:nth-child(2){right:3px}.friend-eye:after{content:"";position:absolute;width:5px;height:7px;background:#332b4a;border-radius:50%;left:3px;top:4px}.friend-mouth{position:absolute;width:11px;height:5px;border-bottom:2px solid #603d4c;border-radius:0 0 50% 50%;top:16px;left:calc(50% - 5px)}.friend-arm{position:absolute;bottom:15px;width:17px;height:19px;border-bottom:4px solid var(--block-dark);border-radius:50%;z-index:-1}.arm-left{left:-14px;transform:rotate(38deg)}.arm-right{right:-14px;transform:rotate(-38deg)}.friend-feet{position:absolute;bottom:-11px;display:flex;width:32px;justify-content:space-between}.friend-feet:before,.friend-feet:after{content:"";width:9px;height:13px;background:var(--block-dark);border-radius:0 0 5px 5px}.flower{position:absolute;z-index:3;font-size:24px;color:#fff6b0}.flower-one{bottom:49px;left:33px;transform:rotate(10deg)}.flower-two{right:41px;bottom:39px;font-size:20px;color:#fff}.grass{position:absolute;z-index:3;width:20px;height:14px;border-left:3px solid #79b893;border-radius:50%;bottom:50px;transform:rotate(20deg)}.grass-one{left:125px}.grass-two{right:133px;bottom:62px}.scene-footnote{position:absolute;text-align:center;left:0;right:0;bottom:-4px;font-size:11px;color:#7a9a8a;letter-spacing:1px}.journey{display:flex;align-items:center;gap:17px;background:#f8f5ff;border:1px solid #ebe4fa;border-radius:19px;padding:20px 25px;margin-top:17px}.journey-icon{background:#ffe8a8;width:45px;height:45px;display:grid;place-items:center;border-radius:14px;transform:rotate(-7deg);color:#e8ae2b}.journey-icon svg{width:26px;height:26px}.journey-copy h2{font-size:15px;letter-spacing:.5px}.journey-copy p{color:#a197b3;font-size:11px;margin-top:3px}.journey-progress{width:170px;margin-left:auto}.journey-progress>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:#a299b4;margin-bottom:7px}.journey-progress strong{color:#8a70bb;font-weight:600}.progress-track{background:#e9e1f6;border-radius:8px;height:7px;overflow:hidden}.progress-track>span{display:block;background:var(--purple);border-radius:8px;height:100%;width:0;transition:width .5s}.text-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;color:#8b72b5;font-size:11px;white-space:nowrap}.text-button svg{width:16px;height:16px}.journey>.text-button{margin-left:15px}.adventures{padding-top:47px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.section-heading>div{display:flex;gap:10px;align-items:center}.section-heading h2{font-size:25px;letter-spacing:.5px;font-weight:800}.section-doodle{color:#b19ae6;font-size:31px;line-height:1}.section-heading>p{font-size:11px;color:#a49aac}.island-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.island-tab{display:flex;align-items:center;gap:13px;text-align:left;background:#faf9fc;border:1.5px solid #f0edf4;border-radius:16px;padding:17px 20px;min-height:86px;transition:background .2s,border-color .2s}.island-tab.active{background:#f5f0ff;border-color:#aa8ce8;box-shadow:0 3px 0 #e5dcf6}.tab-icon{font-size:29px;display:grid;place-items:center;width:44px;height:44px;flex-shrink:0}.tab-copy{display:flex;flex-direction:column;gap:1px}.tab-copy strong{font-size:19px;line-height:1.5;font-weight:800}.tab-copy small{font-size:10px;color:#a299b2;white-space:nowrap}.active .tab-copy strong{color:#7953c7}.tab-status{font-size:9px;color:#a58ccc;background:#eae0ff;border-radius:20px;margin-left:auto;padding:4px 8px;white-space:nowrap}.tab-chevron{margin-left:auto;color:#c9c2d3;font-size:22px}.island-explainer{display:flex;align-items:center;gap:7px;color:#a093b2;font-size:11px;margin:16px 4px 20px}.island-explainer>svg{color:#c4afd8;width:15px;height:17px}.island-explainer button{padding:0 4px;color:#b2a3c7}.island-explainer button svg{width:15px}.activity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.activity-card{--card-bg:#fff5e4;--card-accent:#e5ad42;--card-text:#ad8542;display:flex;flex-direction:column;align-items:stretch;text-align:left;border-radius:21px;padding:19px 21px;background:var(--card-bg);border:1px solid #f0e7db;transition:transform .2s,box-shadow .2s;min-width:0}.activity-card:hover{transform:translateY(-5px);box-shadow:0 8px 0 color-mix(in srgb,var(--card-accent) 15%,transparent)}.card-top{display:flex;align-items:center;justify-content:space-between;gap:5px}.game-kind{font-size:9px;color:var(--card-text);letter-spacing:.7px}.game-stars{font-size:11px;color:var(--card-accent);white-space:nowrap;letter-spacing:1px}.card-compare{--card-bg:#eef8f1;--card-accent:#82ba99;--card-text:#77a58a;border-color:#deeee2}.card-split{--card-bg:#fff0f0;--card-accent:#e69c9f;--card-text:#c08a91;border-color:#f4dfdf}.card-line{--card-bg:#edf5ff;--card-accent:#8aafe0;--card-text:#7e9fc7;border-color:#dfeaf8}.card-art{height:128px;display:flex;justify-content:center;align-items:center;gap:15px;position:relative}.card-art .block-friend{--size:24px;pointer-events:none}.card-art .friend-number{font-size:20px}.card-art .friend-face{top:4px;width:23px;transform:translateX(-50%) scale(.75);transform-origin:50% 0}.card-art .friend-arm{width:13px;height:13px;bottom:10px;border-bottom-width:3px}.card-art .arm-left{left:-10px}.card-art .arm-right{right:-10px}.card-art .friend-feet{height:10px;width:22px;bottom:-7px}.card-art .friend-feet:after,.card-art .friend-feet:before{width:6px;height:9px}.art-spark{position:absolute;color:#e5c16c;font-size:16px;left:16px;top:16px}.art-bubble{position:absolute;right:5px;top:15px;font-size:17px;font-weight:800;color:#cfac5c;transform:rotate(10deg)}.activity-card>strong{font-size:19px;font-weight:800;letter-spacing:.3px}.card-description{font-size:10px;color:#9b8e99;line-height:1.8;margin-top:5px;min-height:35px}.card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:13px;font-size:9px;color:#b1a3aa}.play-circle{display:grid;place-items:center;width:28px;height:28px;border:1px solid #ffffffc9;border-radius:50%;background:#ffffff98;color:var(--card-accent)}.play-circle svg{height:16px;width:16px}.compare-sign{font-size:26px;font-weight:800;color:#85ae95}.mini-plus{font-size:25px;color:#d4a0a6}.mini-train{display:flex;gap:4px;position:relative}.train-car{width:43px;height:38px;background:#b6d3f4;color:#5a83b5;border:2px solid #92b9e6;border-radius:6px;display:grid;place-items:center;font:bold 22px "Trebuchet MS",sans-serif;position:relative}.train-car:nth-child(2){background:#fff;border-style:dashed}.train-car:after{content:"";position:absolute;bottom:-7px;left:6px;height:8px;width:8px;border-radius:50%;background:#779ecc;box-shadow:21px 0 #779ecc}.train-track{position:absolute;left:-15px;right:-15px;bottom:-13px;border-top:2px solid #9eb9d8;border-bottom:2px solid #9eb9d8;height:7px;background:repeating-linear-gradient(90deg,transparent 0 11px,#9eb9d8 11px 14px)}.lab{margin-top:49px;background:#faf8fe;border:1px solid #efeaf8;border-radius:25px;padding:32px 35px;display:grid;grid-template-columns:.85fr 1.5fr;gap:35px}.lab-tag{color:#a493c3;font-size:10px;display:flex;align-items:center;gap:7px}.lab-tag svg{width:14px;height:17px}.lab-intro h2{font-size:26px;line-height:1.6;margin:14px 0 9px;letter-spacing:.5px}.lab-intro>p{font-size:12px;line-height:1.9;color:#a59bad}.lab-tip{margin-top:21px;display:flex;gap:10px;align-items:flex-start;max-width:280px}.lab-tip>span{background:#eee6fa;color:#9e83bf;padding:1px 7px;font-size:9px;white-space:nowrap;border-radius:5px;line-height:1.9}.lab-tip p{font-size:10px;color:#a79ab9;line-height:1.9}.lab-workbench{background:#fff;border-radius:18px;border:1px solid #eee8f6;padding:20px 24px;align-self:center}.lab-toolbar{display:flex;justify-content:space-between;gap:15px;align-items:center}.lab-toolbar strong{font-size:12px;color:#a093b1;font-weight:500}.lab-toolbar button{font-size:9px;color:#b1a1c5}.lab-visual{display:flex;align-items:center;justify-content:center;min-height:127px;padding:20px 0 10px;overflow:auto}.quantity{display:flex;gap:8px;justify-content:center;align-items:flex-end;flex-wrap:wrap;max-width:100%;min-width:0}.unit-group{display:grid;grid-template-columns:repeat(5,19px);gap:4px;align-self:center;align-content:center}.unit{display:block;width:19px;height:19px;border:1.5px solid #9872d6;background:#b390e7;border-radius:4px;box-shadow:inset 0 2px #ffffff40}.ten-rods{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;max-width:290px}.ten-rod{display:flex;flex-direction:column;gap:0;position:relative;overflow:hidden;border:1.5px solid #d7a342;border-radius:4px;background:#ffd16b}.ten-rod i{width:12px;height:10px;display:block;border-bottom:1px solid #d7a34290}.ten-rod i:last-child{border:0}.quantity-label{font-size:10px;color:#9c8bac;text-align:center;display:block;margin-top:7px}.zero-cloud{border:2px dashed #e2daef;border-radius:19px;width:130px;padding:16px;text-align:center;color:#b0a3c2;font-size:13px}.lab-equation{text-align:center;font-size:13px;color:#9784b2;min-height:24px}.lab-equation strong{color:#7653a6;font-size:17px}.lab-controls{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:16px}.lab-controls button{width:45px;min-height:48px;font-family:"Trebuchet MS",var(--font);font-size:21px;color:#956ccb;border:1px solid #eee4fb;border-radius:12px;background:#f7f1ff;line-height:1.3;padding:4px 0;flex-shrink:0}.lab-controls button span{display:block;font-family:var(--font);font-size:8px;white-space:nowrap;line-height:1.9;color:#b198cf}.lab-controls output{font-family:"Trebuchet MS",sans-serif;font-size:33px;font-weight:700;min-width:38px;text-align:center;color:#6f4e9e}.lab-controls .ten-control{width:59px;font-size:18px;background:#fff8e9;border-color:#f5ead0;color:#c39538}.lab-controls .ten-control span{color:#c3a362}.lab-controls .reset-control{font:9px var(--font);width:auto;min-height:30px;padding:4px 7px;background:transparent;border:0;color:#b6a9c3}.lab-feedback{text-align:center;font-size:10px;color:#aaa0b7;min-height:17px;margin-top:14px}.kind-note{display:flex;align-items:center;gap:20px;padding:32px 21px;margin-top:10px}.note-art{color:#c4abeb;font-size:40px;transform:rotate(-15deg);line-height:1}.kind-note h2{font-size:14px;font-weight:600;color:#8a7a9a}.kind-note p{font-size:10px;color:#b0a4b8;margin-top:4px}.kind-note>.text-button{margin-left:auto}.site-footer{border-top:1px solid #f1edf5;display:flex;gap:20px;align-items:center;padding:24px 0 30px;font-size:9px;color:#bcb3c6}.footer-brand{display:flex;align-items:center;gap:8px;color:#ada0bd;font-size:13px;font-weight:700}.brand-mark.small{grid-template-columns:repeat(2,8px);gap:2px}.brand-mark.small i{height:8px;border-radius:2px}.site-footer>span{margin-left:auto}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,15px);opacity:0;z-index:20;background:#383047;color:white;padding:12px 22px;border-radius:15px;box-shadow:0 6px 20px #29234422;max-width:90%;font-size:13px;pointer-events:none;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}
dialog{color:var(--ink);font-family:var(--font);border:0;padding:0;max-height:92dvh;border-radius:27px;box-shadow:0 20px 100px #37275d2b}dialog::backdrop{background:#30224670;backdrop-filter:blur(7px)}body:has(dialog[open]){overflow:hidden}.game-dialog{width:min(790px,calc(100% - 32px));background:#fffcf8}.game-header{padding:22px 28px;display:flex;align-items:center;gap:15px;border-bottom:1px solid #efe9e5}.game-header h2{font-size:18px;flex:1}.game-header .round-label{font-size:12px;color:#a79aac}.icon-button{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#f0eaf8;color:#9e8bb2}.icon-button svg{width:19px}.game-progress{display:flex;gap:8px;padding:20px 30px 0;justify-content:center}.game-progress span{width:34px;height:8px;background:#ebe5ef;border-radius:10px}.game-progress .done{background:#b293e9}.game-progress .current{background:#f4c85c}.game-body{text-align:center;padding:22px 34px 28px}.game-prompt{font-size:23px;line-height:1.6;margin-bottom:5px}.game-subtitle{font-size:12px;color:#a195a6;min-height:20px}.game-stage{min-height:180px;display:flex;align-items:center;justify-content:center;gap:22px;padding:24px 0 16px}.game-stage .quantity{padding:17px 22px;border-radius:19px;background:#f4ecfc;min-height:105px}.game-stage .unit{width:26px;height:26px;border-radius:6px}.game-stage .unit-group{grid-template-columns:repeat(5,26px);gap:6px}.game-stage .ten-rod i{width:17px;height:12px}.game-stage .ten-rods{max-width:290px;gap:7px}.game-stage .quantity.ungrouped.many-units .unit-group{grid-template-columns:repeat(10,17px);gap:3px}.game-stage .quantity.ungrouped.many-units .unit{width:17px;height:17px;border-radius:3px}.game-stage button.quantity{border:2px solid transparent;cursor:pointer;transition:border .2s,transform .2s;max-width:45%;min-height:160px;align-content:center}.game-stage button.quantity:hover{border-color:#c9b1e8;transform:translateY(-3px)}.pile-label{width:100%;font-size:22px;font-weight:700;color:#816199}.pile-compare-label{display:block;width:100%;font-size:10px;color:#a08bae;margin-top:9px}.comparison-vs{font-size:25px;color:#c6b9cd}.compare-visual{background:#e9f6ec!important}.compare-visual .unit{background:#99d5b2;border-color:#70af8b}.game-controls{display:flex;justify-content:center;gap:12px;margin-top:12px}.choice-button{border:2px solid #e6dbf2;background:#fff;border-radius:16px;min-width:74px;min-height:64px;padding:8px 18px;color:#79569e;font:bold 30px "Trebuchet MS",sans-serif;box-shadow:0 3px 0 #e8e0ee;transition:transform .15s,background .15s}.choice-button:hover{background:#f2e9ff;transform:translateY(-2px)}.choice-button.correct{background:#e5f5e8;color:#50956a;border-color:#a4d3af}.choice-button.retry{animation:wiggle .3s;background:#fff6dc;border-color:#efd684}.feedback{font-size:14px;min-height:29px;margin:15px auto 3px;color:#9c87b5;max-width:530px;line-height:1.8}.feedback.success{color:#6a9c70;font-weight:700}.game-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 30px 24px}.hint-button{font-size:12px;color:#ac96c3;display:flex;align-items:center;gap:6px}.hint-button svg{width:16px}.next-button{min-height:43px;padding:9px 21px;border-radius:12px;gap:9px;font-size:13px;box-shadow:0 4px 0 #6040ba}.game-principle{padding:14px 25px;background:#f2ecf8;color:#a18bb4;font-size:11px;text-align:center}.round-star{color:#e7b748;display:inline-flex;align-items:center;gap:5px;font-size:13px}.round-star svg{width:18px}.split-equation{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;font:bold 30px "Trebuchet MS",sans-serif;color:#9272ae}.part-pile{background:#f5ebfb;border-radius:16px;padding:15px;min-width:120px}.part-pile .quantity{background:none;min-height:80px;padding:0}.part-pile strong{display:block;font-size:27px;margin-top:8px}.missing-part{background:#fff0d8;border:2px dashed #edcc8c;border-radius:16px;min-width:110px;min-height:120px;display:grid;place-items:center;color:#d0a650;font-size:45px}.whole-label{margin-top:10px;color:#b19bc2;font-size:11px;font-family:var(--font);font-weight:400}.whole-label strong{font-size:18px;color:#9470b4}.line-train{display:flex;gap:10px;position:relative;padding:15px 0}.line-train .train-car{width:75px;height:65px;font-size:35px;background:#d9eafa}.line-train .train-car:after{width:12px;height:12px;bottom:-10px;box-shadow:38px 0 #779ecc}.line-train .train-car.missing{border-style:dashed;background:#fff5d7;color:#d4aa4e;border-color:#e3bf67}.line-train .train-car:before{content:"";position:absolute;right:-12px;width:10px;border-top:3px solid #91b2d8;bottom:10px}.line-train .train-car:last-of-type:before{display:none}.line-train .train-track{bottom:1px}.line-caption{font-size:12px;color:#9daec2;margin-top:12px}.sort-button{margin:0 auto 4px;display:block;font-size:11px;color:#a28cb9;text-decoration:underline;text-underline-offset:4px}.result{padding:38px 35px 35px;text-align:center}.result-medal{width:100px;height:100px;margin:0 auto 24px;display:grid;place-items:center;border:6px solid #ffe9a8;border-radius:50%;background:#ffcf57;box-shadow:0 8px 0 #dfb34e;color:#fff5ca}.result-medal svg{height:55px;width:55px;filter:drop-shadow(0 2px 0 #dfa344)}.result h2{font-size:27px;margin-bottom:10px}.result p{font-size:13px;color:#a798b5;line-height:1.9}.earned-stars{display:flex;justify-content:center;gap:12px;margin:23px 0;color:#efbf4d}.earned-stars svg{width:31px;height:31px}.result-secret{border-radius:17px;background:#f1eafa;color:#9e83b8;font-size:13px;padding:17px;margin:20px auto;max-width:480px}.result-actions{display:flex;justify-content:center;gap:15px;margin-top:22px;align-items:center}.secondary-button{border:1px solid #dfd1ed;color:#a185ba;border-radius:12px;padding:11px 20px;font-size:13px;min-height:46px}.info-dialog{width:min(600px,calc(100% - 30px));background:#fff}.info-header{display:flex;justify-content:space-between;align-items:center;padding:23px 26px;border-bottom:1px solid #f0eaf5}.info-header h2{font-size:20px}.info-body{padding:25px 28px 32px}.info-body>p{font-size:13px;color:#a394ae;line-height:1.9;margin-bottom:17px}.stars-total{text-align:center;background:#fff7dc;border-radius:20px;padding:22px;margin-bottom:22px;color:#c79c3e}.stars-total strong{font:bold 45px "Trebuchet MS",sans-serif;display:block;color:#b38424}.stars-total span{font-size:12px}.badge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.badge{border:1px solid #ede7f3;border-radius:16px;text-align:center;padding:20px 5px 14px;background:#fbf9fe;color:#bdafcb}.badge .badge-icon{font-size:34px;filter:grayscale(1);opacity:.35}.badge.earned{background:#fbf2d8;border-color:#f3dda8;color:#b28c4e}.badge.earned .badge-icon{filter:none;opacity:1}.badge strong{display:block;font-size:13px;margin-top:9px}.badge small{font-size:9px;display:block;margin-top:4px}.records{margin-top:25px}.records h3{font-size:14px;margin-bottom:12px}.record-row{display:flex;align-items:center;justify-content:space-between;font-size:12px;padding:12px 0;border-top:1px solid #f0eaf5;color:#ae9eba}.record-row strong{font-weight:500;color:#8b72a7}.storage-note{margin-top:22px;font-size:10px!important;color:#bcafc7!important;margin-bottom:0!important}.parent-idea{display:flex;gap:15px;margin:23px 0}.parent-idea>span{width:31px;height:31px;flex-shrink:0;border-radius:10px;display:grid;place-content:center;background:#f0e8fb;color:#a48ac2;font:bold 16px "Trebuchet MS",sans-serif}.parent-idea h3{font-size:14px;margin:1px 0 6px}.parent-idea p{font-size:12px;color:#a493af;line-height:1.9}.parents-foot{background:#edf7ed;color:#8aa88a;font-size:12px;border-radius:14px;padding:16px}.confetti-layer{position:fixed;inset:0;pointer-events:none;z-index:50;overflow:hidden}.confetti-layer i{position:absolute;top:-20px;width:9px;height:14px;border-radius:2px;animation:confetti-fall 1.8s ease-in forwards}.tapped{animation:friend-hop .45s ease-out}.lab-pop{animation:lab-pop .3s ease-out}@keyframes friend-hop{50%{transform:translateY(-20px) rotate(-8deg)}}@keyframes lab-pop{50%{transform:scale(1.035)}}@keyframes confetti-fall{to{transform:translateY(110vh) rotate(650deg);opacity:.3}}@keyframes wiggle{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(min-width:1450px){.hero{min-height:445px}.hero-copy h1{font-size:53px}.island-scene{min-height:370px}.activity-card{padding:22px}.card-art{height:137px}}
@media(max-width:1100px){.site-header nav{gap:22px}.brand{font-size:21px}.wrap{width:calc(100% - 60px)}.hero{gap:10px}.hero h1{font-size:39px}.headline-spark{right:-31px;font-size:27px}.hero-friends{gap:15px}.hero-friends .block-friend{--size:32px}.hero-friends .friend-number{font-size:25px}.hero-friends .friend-face{transform:translateX(-50%) scale(.85);transform-origin:50% 0}.speech-bubble{left:24%}.island-scene{min-height:330px}.activity-grid{gap:13px}.activity-card{padding:17px}.card-art{height:122px;gap:11px}.card-art .block-friend{--size:21px}.activity-card>strong{font-size:17px}.card-description{font-size:9px}.tab-status{display:none}.island-tab{padding:15px;gap:8px}.tab-copy strong{font-size:18px}.journey-progress{width:135px}.lab{gap:25px;padding:28px}.lab-intro h2{font-size:23px}.lab-workbench{padding:18px}.train-car{width:36px}.train-car:after{box-shadow:16px 0 #779ecc}}
@media(max-width:800px){.site-header{min-height:85px;padding:16px 24px;gap:15px}.site-header nav{gap:18px}.site-header nav>a,.site-header nav>button{font-size:12px}.brand-sub{font-size:8px;letter-spacing:1px}.brand{font-size:20px;gap:9px}.brand-mark{grid-template-columns:repeat(2,12px)}.brand-mark i{height:12px}.parent-button span{display:none}.header-actions{gap:8px}.parent-button{padding:0}.sound-button{height:33px;width:33px}.hero{grid-template-columns:1fr 1fr;min-height:350px}.hero h1{font-size:31px;letter-spacing:.4px;margin-top:16px}.hero-copy>p{font-size:12px}.hero-note{font-size:8px;gap:2px;white-space:nowrap}.note-dot{padding:0 3px}.hero .primary-button{font-size:13px;min-height:47px;gap:10px;padding:12px 18px}.age-tag{font-size:9px;letter-spacing:0}.island-scene{min-height:280px;margin-left:10px}.sun{width:38px;height:38px;right:30px;top:16px;transform:scale(.8)}.speech-bubble{font-size:10px;padding:8px 11px;top:28px;left:20%}.speech-bubble span{font-size:8px}.hero-friends{gap:10px;left:10px;right:8px;bottom:87px}.hero-friends .block-friend{--size:26px}.hero-friends .friend-number{font-size:21px}.hero-friends .friend-face{transform:translateX(-50%) scale(.68)}.hero-friends .friend-feet{width:24px}.hero-friends .friend-arm{width:12px;height:15px}.hero-friends .arm-left{left:-10px}.hero-friends .arm-right{right:-10px}.scene-footnote{font-size:8px;letter-spacing:0;bottom:0}.island-ground{bottom:33px;height:70px}.ground-front{bottom:22px;height:55px}.flower-one{bottom:43px;left:16px}.grass-one{left:80px}.journey{padding:17px;gap:12px}.journey-copy h2{font-size:13px}.journey-copy p{font-size:9px}.journey>.text-button{display:none}.journey-icon{height:37px;width:37px}.journey-progress{width:115px}.section-heading h2{font-size:22px}.section-heading>p{font-size:10px}.activity-grid{grid-template-columns:repeat(2,1fr);gap:18px}.activity-card{padding:20px 24px}.card-art{height:133px;gap:25px}.activity-card>strong{font-size:20px}.card-description{font-size:11px;min-height:24px}.card-art .block-friend{--size:27px}.card-art .friend-face{transform:translateX(-50%) scale(.85)}.game-kind{font-size:10px}.card-bottom{font-size:10px}.island-tabs{gap:10px}.island-tab{padding:13px 10px;gap:5px;min-height:78px}.tab-icon{font-size:24px;width:32px}.tab-copy strong{font-size:16px}.tab-copy small{font-size:8px}.tab-chevron{display:none}.lab{grid-template-columns:.8fr 1.2fr;gap:20px;padding:24px}.lab-intro h2{font-size:20px}.lab-intro>p{font-size:10px}.lab-tip{flex-direction:column;gap:4px}.lab-workbench{padding:15px}.lab-toolbar{gap:5px}.lab-toolbar strong{font-size:10px}.lab-toolbar button{font-size:8px}.lab-controls{gap:8px}.lab-controls .reset-control{display:none}.kind-note{padding:27px 8px;gap:14px}.kind-note>.text-button{font-size:9px}.kind-note h2{font-size:12px}.kind-note p{font-size:9px}.line-train{gap:8px}.line-train .train-car{width:65px}.train-car{width:43px}.train-car:after{box-shadow:21px 0 #779ecc}}
@media(max-width:590px){.wrap{width:calc(100% - 36px)}.site-header{padding:17px 20px;min-height:77px;flex-wrap:wrap;gap:17px}.site-header nav{order:3;width:100%;justify-content:center;gap:37px;border-top:1px solid #f4eff9;padding-top:4px}.site-header nav>a,.site-header nav>button{font-size:12px;padding:7px 0}.brand{font-size:21px}.brand-sub{font-size:8px}.parent-button span{display:block;font-size:10px}.header-actions{gap:12px}.parent-button svg{width:15px}.sound-button{height:29px;width:29px}.sound-button svg{width:17px}.hero{display:flex;flex-direction:column;gap:0;padding-top:23px;padding-bottom:15px;min-height:0}.hero-copy{align-self:stretch;text-align:center;padding-bottom:18px}.hero h1{font-size:37px;margin:17px auto 11px;letter-spacing:1px;line-height:1.38}.headline-spark{font-size:29px;right:-31px;top:35px}.hero-copy>p{font-size:13px;line-height:1.9}.hero .primary-button{margin-top:20px;min-height:48px;font-size:14px;padding:12px 25px;gap:20px}.hero-note{justify-content:center;font-size:9px;margin-top:18px;gap:4px}.age-tag{font-size:9px}.island-scene{width:95%;max-width:420px;margin:2px 0 10px;min-height:273px}.hero-friends .block-friend{--size:30px}.hero-friends{gap:18px;bottom:89px}.hero-friends .friend-face{transform:translateX(-50%) scale(.8)}.speech-bubble{font-size:12px;top:12px;left:27%;padding:9px 14px}.speech-bubble span{font-size:9px}.sun{right:22px;top:18px}.scene-footnote{font-size:9px}.journey{margin-top:7px;padding:15px 13px;border-radius:15px;gap:11px}.journey-icon{height:35px;width:35px;border-radius:11px;flex-shrink:0}.journey-icon svg{width:22px}.journey-copy h2{font-size:12px}.journey-copy p{font-size:9px;max-width:185px;line-height:1.8}.journey-progress{width:67px;flex-shrink:0}.journey-progress>div:first-child{font-size:8px;gap:3px}.adventures{padding-top:31px}.section-heading{margin-bottom:18px}.section-heading h2{font-size:21px}.section-heading>p{display:none}.section-doodle{font-size:27px}.island-tabs{gap:8px}.island-tab{flex-direction:column;align-items:center;text-align:center;padding:12px 4px;gap:5px;min-height:105px;border-radius:13px}.tab-copy small{font-size:8px}.tab-icon{height:30px;font-size:25px}.tab-copy strong{font-size:16px}.island-explainer{font-size:9px;align-items:flex-start;margin:14px 0 17px;gap:5px}.island-explainer>svg{width:14px;flex-shrink:0}.island-explainer>span{flex:1}.activity-grid{gap:12px}.activity-card{padding:15px 14px;border-radius:17px}.card-art{height:115px;gap:17px}.card-art .block-friend{--size:21px}.card-art .friend-face{transform:translateX(-50%) scale(.68)}.card-art .friend-number{font-size:18px}.game-kind{font-size:8px;letter-spacing:0}.game-stars{font-size:8px;letter-spacing:0}.activity-card>strong{font-size:17px;letter-spacing:0;white-space:nowrap}.card-description{font-size:9px;min-height:33px;margin-top:5px}.card-bottom{font-size:8px;margin-top:9px}.play-circle{height:23px;width:23px}.card-art .train-car{width:32px;height:32px;font-size:18px}.card-art .train-car:after{box-shadow:13px 0 #779ecc;left:5px}.card-art .mini-train{gap:3px}.card-art .mini-plus{font-size:18px}.card-art .compare-sign{font-size:21px}.art-bubble{font-size:13px;right:0}.art-spark{left:2px;font-size:12px}.lab{display:flex;flex-direction:column;gap:20px;margin-top:30px;padding:23px 19px;border-radius:20px}.lab-intro h2{font-size:24px;margin-top:10px;line-height:1.5}.lab-intro h2 br{display:none}.lab-intro>p{font-size:11px;line-height:1.8;margin-top:8px}.lab-intro>p br{display:none}.lab-tip{margin-top:14px;flex-direction:row;gap:9px;max-width:100%}.lab-tip p{font-size:10px}.lab-tag{font-size:9px}.lab-workbench{width:100%;padding:17px}.lab-visual{min-height:128px}.lab-toolbar strong{font-size:11px}.lab-toolbar button{font-size:9px}.lab-controls{gap:15px}.lab-controls .reset-control{display:block}.lab-controls button{width:40px}.lab-controls .ten-control{width:54px}.lab-controls output{font-size:29px;min-width:30px}.lab-feedback{font-size:9px}.kind-note{padding:28px 2px;gap:13px;flex-wrap:wrap}.kind-note h2{font-size:12px}.kind-note p{font-size:9px}.kind-note>.text-button{margin:0 0 0 44px;font-size:10px}.note-art{font-size:35px}.site-footer{flex-wrap:wrap;gap:9px 13px;padding:20px 0}.site-footer>span{font-size:8px;width:100%;margin-left:29px}.site-footer p{font-size:9px}.game-header{padding:15px}.game-header h2{font-size:15px}.game-header .round-label{font-size:10px}.game-header .icon-button{width:30px;height:30px}.game-progress{padding-top:16px}.game-body{padding:19px 14px 15px}.game-prompt{font-size:19px}.game-subtitle{font-size:10px}.game-stage{gap:9px;padding:20px 0 15px;min-height:165px}.game-stage .quantity{padding:13px 9px;gap:7px}.game-stage .unit{height:22px;width:22px}.game-stage .unit-group{grid-template-columns:repeat(5,22px);gap:4px}.game-stage .ten-rod i{width:10px;height:10px}.game-stage .ten-rods{gap:4px;max-width:150px}.game-stage button.quantity{min-height:150px;flex:1;max-width:45%}.game-stage button.quantity .unit-group{grid-template-columns:repeat(5,17px);gap:3px}.game-stage button.quantity .unit{width:17px;height:17px}.game-stage .quantity.ungrouped.many-units .unit-group{grid-template-columns:repeat(10,12px);gap:2px}.game-stage .quantity.ungrouped.many-units .unit{width:12px;height:12px}.comparison-vs{font-size:17px}.choice-button{min-height:56px;min-width:56px;font-size:25px;padding:7px 12px}.game-controls{gap:10px}.feedback{font-size:12px;min-height:37px;margin-top:14px}.game-footer{padding:0 16px 18px}.game-principle{font-size:10px;padding:12px 16px}.hint-button{font-size:11px}.next-button{font-size:12px;min-height:41px;padding:8px 16px}.split-equation{gap:8px;font-size:22px}.part-pile{min-width:90px;padding:12px}.part-pile .quantity .unit-group{grid-template-columns:repeat(5,16px);gap:3px}.part-pile .quantity .unit{width:16px;height:16px}.part-pile .quantity{min-height:70px;padding:0}.missing-part{min-width:70px;min-height:110px;font-size:36px}.part-pile strong{font-size:24px}.line-train{gap:7px}.line-train .train-car{width:45px;height:48px;font-size:24px}.line-train .train-car:after{height:9px;width:9px;left:5px;box-shadow:23px 0 #779ecc;bottom:-8px}.line-train .train-car:before{right:-9px;width:8px}.line-caption{font-size:10px}.result{padding:30px 20px}.result h2{font-size:23px}.result p{font-size:12px}.result-secret{font-size:12px}.result-actions{gap:10px}.result-actions>.primary-button{font-size:13px;min-height:46px;padding:10px 17px}.secondary-button{font-size:12px;padding:10px 15px}.info-header{padding:19px 20px}.info-header h2{font-size:18px}.info-body{padding:20px}.badge-grid{gap:8px}.badge{padding:17px 4px 13px}.badge strong{font-size:12px}.badge small{font-size:8px}.record-row{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.confetti-layer{display:none}}
/* Unit dimensions follow the same grid token at every breakpoint. */
.unit-group{grid-template-columns:repeat(var(--unit-cols,5),var(--unit-size,19px))!important}.unit{width:var(--unit-size,19px)!important;height:var(--unit-size,19px)!important;padding:0}.game-stage .unit-group{--unit-size:26px}.game-stage .quantity.ungrouped.many-units .unit-group{--unit-size:17px}.part-pile .quantity .unit-group{--unit-size:22px}.count-quantity .unit{transition:filter .15s}.game-stage .pile-choice>.quantity{padding:0!important;min-height:0!important;background:transparent!important;width:100%}.game-stage .pile-choice{align-items:center;justify-content:center;flex-wrap:wrap;flex-direction:column;gap:8px}.lab-visual .quantity.ungrouped{max-width:100%}.card-art .quantity{gap:4px}.card-art .ten-rods{gap:4px}.card-art .ten-rod i{width:9px;height:7px}.card-art .unit-group{--unit-size:13px;gap:3px}.card-art .quantity{max-width:90px}.game-stage .ten-rod{padding:0}.game-controls [aria-disabled=true]{cursor:default}.next-button[hidden]{display:none}.game-stage .missing-part .quantity{padding:9px;min-height:0;max-width:155px;background:transparent}.game-stage .missing-part .unit-group{--unit-size:15px;gap:3px}.game-stage .missing-part .ten-rod i{height:8px;width:8px}
@media(max-width:590px){.game-stage .unit-group{--unit-size:22px}.game-stage .quantity.ungrouped.many-units .unit-group{--unit-size:12px}.game-stage .pile-choice .unit-group{--unit-size:17px}.part-pile .quantity .unit-group{--unit-size:16px}.lab-controls{gap:10px}}
@media(max-width:350px){.lab-controls{flex-wrap:wrap;gap:8px}.lab-controls .reset-control{flex-basis:100%}.game-stage .split-equation{gap:5px}.game-stage .part-pile{min-width:80px}}
@media(max-width:350px){.headline-spark{right:-11px;font-size:23px}}