body{background:radial-gradient(ellipse at 50% 0,#fbf9ff,#ede4fb 65%,#d8c9ec) fixed}.wrap{max-width:1100px}.title{max-width:950px}.clay-cover{width:100%;max-width:820px;animation:none;border-radius:28px;margin:20px auto;box-shadow:0 7px #6334991a}.hook{font-weight:700}.lesson-brief{font-size:1.1rem;max-width:730px;margin:10px auto 24px}
.demo{height:126px;display:flex;align-items:center;justify-content:center;gap:10px}.demo img{width:112px;height:112px;object-fit:contain}.demo-method{flex-direction:column;font-size:.9rem;font-weight:700}.mini-switch{display:flex;align-items:center;gap:8px;background:#fff;padding:8px 12px;border-radius:14px;color:#5b1d99}.mini-switch i{width:34px;height:20px;border-radius:14px;background:#713bba;position:relative}.mini-switch i:after{content:"";position:absolute;right:3px;top:3px;width:14px;height:14px;background:#fff;border-radius:50%}.mini-jug{width:66px;height:94px;border:4px solid #bcb1d7;border-top:3px solid #a794cf;border-radius:5px 5px 16px 16px;background:#fff;position:relative;overflow:hidden}.mini-jug i{position:absolute;bottom:0;left:0;right:0;height:55%;background:linear-gradient(#79b3ec,#469de0)}
.news{padding:17px 20px}.news .method{font-size:1rem}.news .claim{font-size:1.2rem}.news small{color:#655475}.scene{grid-template-columns:1.4fr 1fr;align-items:stretch}.dc{padding:16px}.switch{display:grid;grid-template-columns:70px 1fr 52px;gap:10px;margin:8px 0;padding:9px 12px;box-shadow:0 3px #76609010;min-height:86px}.switch img{width:68px;height:68px;object-fit:contain}.switch .switch-copy{font-size:1rem;line-height:1.3}.switch small{display:block;margin-top:3px;font-weight:450;font-size:.84rem;color:#675779}.switch.on{background:#faf6ff}.switch .knob{width:52px}.switch-state{font-size:.78rem;font-weight:850;color:#665473}.switch.on .switch-state{color:#5b1d99}.switch-toggle{display:grid;gap:4px;place-items:center}
.meter{padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f9f5ff;border:2px solid #dfd1ef}.meter-title{font-size:.84rem;letter-spacing:.07em;text-transform:uppercase;font-weight:800;color:#5b1d99}.glass-holder{width:155px;height:210px;position:relative;margin:14px auto 8px}.glass{position:absolute;left:12px;top:0;width:118px;height:188px;overflow:hidden;border:5px solid #b6a5cf;border-top:6px solid #9e85c0;border-radius:7px 7px 22px 22px;background:linear-gradient(100deg,#fffefc,#eee8f560%,#fff);box-shadow:inset 4px 0 8px #fff,5px 8px 0 #5b318f19;z-index:2}.glass-handle{position:absolute;right:0;top:32px;width:35px;height:100px;border:8px solid #b6a5cf;border-radius:0 28px 28px 0;z-index:1}.glass-base{position:absolute;bottom:5px;left:3px;width:140px;height:16px;border-radius:50%;background:#ae8bd04a}.water-fill{position:absolute;bottom:0;left:0;width:100%;height:0;background:linear-gradient(90deg,#69bcf6,#318cd5);transition:height .55s ease;box-shadow:inset 6px 0 8px #b2e1ff88}.water-fill:before{content:"";position:absolute;top:0;width:100%;height:7px;background:#a4daf6;border-radius:50%;transform:translateY(-3px)}.readout strong{font-size:2rem;color:#54228b}.readout{font-size:1.1rem;margin:0;min-height:42px}.count-detail{font-size:.88rem;color:#554469;min-height:28px;margin:3px 0}.meter small{color:#625473}.same-answer{font-size:.86rem;max-width:300px;margin:12px 0 0;color:#655475}.boundary-note{margin:0;font-size:.88rem;color:#655475}.explore-hint{margin:0;font-size:.95rem}.count-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.count-actions .btn{min-height:48px}
@media(max-width:700px){.title h1{font-size:2.8rem}.clay-cover{margin:15px auto}.goal{font-size:1rem}.demo{grid-row:1/3;height:90px;gap:0}.demo img{width:48px;height:72px}.demo-method{font-size:.71rem;gap:6px}.mini-switch{font-size:.69rem;padding:5px}.mini-jug{height:73px;width:52px}.lesson-brief{font-size:1rem}.scene{display:flex;flex-direction:column;gap:10px;margin-top:10px}.meter{order:-1;display:grid;grid-template-columns:64px 1fr;column-gap:12px;text-align:left;padding:9px 12px;align-items:center}.glass-holder{grid-column:1;grid-row:1/5;width:60px;height:93px;margin:0}.glass{width:44px;height:79px;left:1px;border-width:3px;border-radius:4px 4px 9px 9px}.glass-handle{width:18px;height:39px;top:16px;border-width:4px}.glass-base{width:54px;height:8px;left:0}.meter-title,.readout,.count-detail,.meter small{grid-column:2}.meter-title{font-size:.72rem}.readout{font-size:.94rem;min-height:0}.readout strong{font-size:1.4rem}.count-detail{font-size:.78rem;min-height:0;margin:1px 0}.same-answer{display:none}.meter small{font-size:.73rem}.dc{padding:10px 12px}.switch{grid-template-columns:44px 1fr 38px;gap:7px;min-height:69px;padding:7px;margin:7px 0}.switch img{width:44px;height:48px}.switch .switch-copy{font-size:.9rem}.switch small{font-size:.74rem}.switch .knob{width:36px;height:22px}.switch .knob:after{width:16px;height:16px;top:3px;left:3px}.switch.on .knob:after{transform:translateX(14px)}.switch-state{font-size:.66rem}.switch-toggle{gap:2px}.news{padding:12px}.news .claim{font-size:1.05rem}.news .method{font-size:.94rem}.news small{font-size:.79rem}.count-actions .btn{font-size:.87rem;padding:11px 9px;flex:1}.count-actions{gap:8px;margin-top:11px}.task-title{font-size:1.2rem}.explore-hint{font-size:.88rem}.boundary-note{font-size:.76rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}


/* Four distinct views: title, illustrated lesson connection, rules, play. */
.connection{max-width:880px;margin:50px auto;display:grid;grid-template-columns:270px 1fr;gap:34px;align-items:center;min-height:430px}
.connection[hidden]{display:none}.connection-art{display:grid;place-items:center;background:radial-gradient(ellipse,#ffffffd9,transparent 70%);min-height:290px}.connection-art img{width:260px;height:280px;object-fit:contain;filter:drop-shadow(0 14px 10px #24324b17)}
.connection h2{font-size:2.25rem;line-height:1.12;margin:10px 0 20px}.connection-copy p:not(.eyebrow){font-size:1.12rem;line-height:1.55;max-width:520px}.connection .btn{margin-top:15px}.how h2{margin-bottom:25px}.how .small-note{max-width:720px;margin:14px auto 20px;line-height:1.5}.footer[hidden]{display:none}.feedback:empty{display:none}.brand{font-size:.8rem;opacity:.8}.bar{background:none;border:0;box-shadow:none}.progress-row{display:none}
@media(max-width:700px){.connection{grid-template-columns:1fr;gap:0;margin:12px auto 25px;min-height:0;text-align:center}.connection-art{min-height:170px}.connection-art img{width:175px;height:175px}.connection h2{font-size:1.7rem;margin:7px 0 15px}.connection-copy p:not(.eyebrow){font-size:1rem;line-height:1.5}.connection .btn{margin-top:8px}.how h2{font-size:1.5rem;margin-bottom:16px}.how .small-note{font-size:.84rem}}

/* A report beside a counting lab: a central jug and four selectable objects. */
.headline-lab{display:grid;grid-template-columns:285px minmax(0,1fr);gap:28px;align-items:center;margin-top:24px}.news{border:0;border-radius:3px;background:#fffef5;padding:24px;box-shadow:-5px 5px 0 #dad1bf,0 10px 22px #40235b16;transform:rotate(-1deg)}.report-number{display:block;border-bottom:1px solid #d4ccbc;padding-bottom:12px;margin-bottom:17px;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#766557}.news .label{font-size:.72rem;line-height:1.4}.news .claim{font-size:1.28rem;line-height:1.35;margin:14px 0 20px}.news .method{font-size:1rem;line-height:1.55;margin:0}.method strong{display:block;font-size:.73rem;text-transform:uppercase;letter-spacing:.04em;color:#756453;margin-bottom:6px}.scene{display:grid;grid-template-columns:175px minmax(0,1fr);gap:18px;margin:0;align-items:center}.meter{background:none;border:0;padding:0;box-shadow:none;min-width:0}.meter-title{font-size:.75rem}.glass-holder{margin:20px auto 9px}.readout{font-size:1.15rem;min-height:40px}.readout strong{font-size:2.25rem}.count-detail{text-align:center;line-height:1.5;font-size:.86rem;max-width:180px}.parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.switch{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;margin:0;padding:13px 8px 9px;min-height:190px;border:2px solid transparent;background:#ffffff8f;border-radius:26px;box-shadow:0 5px 0 #7353931b}.switch img{width:90px;height:90px;object-fit:contain;transition:transform .18s}.switch:hover:not(:disabled) img{transform:translateY(-5px)}.switch.on{background:#fff8df;border-color:#8661a9;box-shadow:0 5px 0 #7353933b}.switch.on img{transform:translateY(-4px)}.switch .switch-copy{font-size:.87rem;line-height:1.25}.switch small{font-size:.81rem;margin-top:4px}.switch-toggle{display:block}.switch-state{display:block;font-size:.76rem;background:#eee4f9;padding:4px 14px;border-radius:15px;color:#593981}.switch.on .switch-state{background:#624082;color:white}.practice-note{text-align:center;font-size:.76rem;line-height:1.4;color:#655475;margin:17px 0 5px}.count-actions{justify-content:center;margin-top:16px;flex-wrap:wrap}.count-actions .btn{font-size:.93rem}.explore-intro{text-align:center;margin:22px 0}.explore-intro h2{font-size:1.7rem;margin-bottom:8px}.explore-intro p{margin:0}.exploring{max-width:730px;margin:0 auto}.exploring .scene{grid-template-columns:220px minmax(0,1fr)}
@media(max-width:950px){.headline-lab{grid-template-columns:240px minmax(0,1fr);gap:18px}.scene{grid-template-columns:135px minmax(0,1fr);gap:10px}.parts{gap:9px}.switch img{width:75px;height:75px}.switch{min-height:180px}.news{padding:19px}.glass-holder{transform:scale(.84);margin:0 auto;width:135px}}
@media(max-width:700px){.headline-lab{grid-template-columns:1fr;gap:18px;margin-top:14px}.news{transform:none;padding:16px 18px}.report-number{padding-bottom:8px;margin-bottom:10px}.news .claim{font-size:1.1rem;margin:9px 0 12px}.news .method{font-size:.94rem;line-height:1.45}.method strong{margin-bottom:3px}.scene,.exploring .scene{display:grid;grid-template-columns:1fr;gap:15px;margin:0}.meter{display:grid;grid-template-columns:70px 1fr;grid-template-rows:auto auto auto;text-align:left;justify-content:center;max-width:275px;margin:0 auto;column-gap:15px;padding:0;order:0}.glass-holder{transform:none;grid-row:1/4;width:65px;height:98px;margin:0}.meter-title,.readout,.count-detail{grid-column:2;text-align:left}.readout{min-height:0;font-size:1.05rem}.readout strong{font-size:1.8rem}.count-detail{margin:0;max-width:190px;font-size:.82rem}.parts{gap:10px}.switch{min-height:165px;padding:10px 6px 9px;border-radius:22px;gap:4px}.switch img{width:72px;height:72px}.switch .switch-copy{font-size:.83rem}.switch small{font-size:.76rem}.switch-state{font-size:.73rem;padding:4px 12px}.practice-note{font-size:.7rem;margin-top:15px}.count-actions{margin-top:13px}.count-actions .btn{font-size:.87rem;min-height:47px}.explore-intro{margin:14px 0 22px}.explore-intro h2{font-size:1.35rem}.explore-intro p{font-size:.91rem}}

.demo-method img{width:85px;height:85px}.demo-method{gap:4px}.demo-counted{background:#624082;color:#fff;border-radius:15px;padding:4px 14px;font-size:.78rem}@media(max-width:700px){.demo-method img{width:58px;height:58px}.demo-counted{font-size:.69rem;padding:3px 9px}}
