:root{--paper:#FFF8EC;--white:#fffdf5;--ink:#34233E;--muted:#626456;--line:#ccc5b5;--sage:#dce3cf;--rose:#e6c6b6;--yellow:#ecd69b;--serif:Georgia,'Times New Roman',serif;--kiddo-purple:#57306D;--kiddo-lavender:#EEE6F2;--kiddo-peach:#F7C9B4;--kiddo-cream-yellow:#F5E8BB;--kiddo-warm-white:#FFF8EC;--kiddo-text:#34233E;}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65;background-image:radial-gradient(#8e816411 .7px,transparent .7px);background-size:7px 7px}a{color:inherit;text-underline-offset:4px}a:hover{text-decoration-color:#a9694e}img{display:block;max-width:100%;height:auto}button,input,select{font:inherit;color:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button,summary{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #81543e;outline-offset:5px}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.12;font-family:var(--serif);font-weight:400}h1{font-size:clamp(30px,3.6vw,44px);letter-spacing:-1px}h2{font-size:clamp(24px,2.6vw,32px);letter-spacing:-.6px}h3{font-size:25px;letter-spacing:-.4px}p{color:var(--muted)}.wrap{width:min(1160px,calc(100% - 80px));margin-inline:auto}.skip{position:absolute;top:-100px;left:20px;z-index:20;background:var(--ink);color:white;padding:12px}.skip:focus{top:10px}.site-header{margin-top:14px;display:flex;align-items:center;justify-content:space-between;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 var(--ink);padding:10px 16px;gap:12px}.brand{text-decoration:none;white-space:nowrap;font-size:19px;font-weight:900;letter-spacing:-.6px;line-height:1.1}.brand-logo{width:30px;height:30px}.brand span{display:block;text-transform:uppercase;font-size:8px;letter-spacing:1.8px;font-weight:500;margin-top:3px}.site-header nav{display:flex;gap:15px;align-items:center;font-size:11.5px;font-weight:600}.site-header nav a{text-decoration:none}.site-header nav a:hover,.site-header nav a[aria-current]{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--yellow)}.search-link{border:1px solid var(--ink);padding:5px 9px;display:flex;align-items:center;gap:6px}.hero{padding-top:74px;padding-bottom:78px;display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center}.tape-label{display:inline-block;background:#e9d9a4;padding:5px 17px;font-size:12px;letter-spacing:.3px;transform:rotate(-2deg);margin-bottom:26px;clip-path:polygon(1% 0,100% 4%,98% 100%,0 95%)}.hero h1{font-size:clamp(34px,4vw,50px);line-height:1.01;letter-spacing:-2px;margin-bottom:26px}.hero h1 em{font-style:normal;white-space:nowrap;background:linear-gradient(transparent 79%,#dfb49d 79%,#dfb49d 93%,transparent 93%)}.hero-copy>p{font-size:19px;line-height:1.55}.hero-copy .hero-description{font-size:15px;max-width:365px;margin:17px 0 26px;line-height:1.7}.button{display:inline-flex;align-items:center;justify-content:center;gap:27px;border:1px solid var(--ink);background:var(--ink);color:var(--white);padding:12px 21px;box-shadow:3px 3px 0 #c79a7a;font-size:13px;font-weight:600;text-decoration:none;min-height:46px;transition:transform .15s,box-shadow .15s}.button:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 #c79a7a}.hero-footnote{display:block;margin-top:20px;font-size:11px;color:var(--muted)}.scrapbook{position:relative;min-height:352px}.hero-paper{background:var(--white);padding:12px 12px 17px;border:1px solid #c7c1b1;box-shadow:3px 7px 12px #53402a19;position:absolute}.hero-paper:before,.activity-photo:before{content:'';position:absolute;top:-13px;left:34%;width:34%;height:32px;background:#e3cfa4bf;transform:rotate(-5deg);z-index:1}.hero-paper figcaption{font-family:var(--serif);font-style:italic;font-size:17px;text-align:center;padding-top:9px}.main-paper{width:63%;top:7px;right:1%;transform:rotate(6deg)}.small-paper{width:53%;bottom:2px;left:0;transform:rotate(-8deg)}.scribble{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.3;position:absolute;left:4%;top:5px;transform:rotate(-11deg)}.scribble svg{width:95px;height:50px}.round-stamp{position:absolute;right:8%;bottom:12px;border:1px dashed #73816a;border-radius:50%;width:131px;height:131px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;transform:rotate(9deg);background:#e2e5d1;font-size:8px;letter-spacing:1px}.round-stamp strong{font-family:var(--serif);font-size:29px;line-height:1;letter-spacing:-.7px;font-weight:400;margin-top:8px}.promise-strip{border-block:1px dashed #b9b39f;background:#ece6d8}.promise-strip .wrap{display:flex;justify-content:space-around;padding:13px 0;font-size:11px;letter-spacing:1.5px;text-transform:uppercase}.promise-strip span:before{content:'+';margin-right:16px}.section{padding-block:66px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:34px}.eyebrow{display:block;font-size:10px;letter-spacing:2px;font-weight:700;margin-bottom:15px}.text-link{font-size:13px;font-weight:600;text-decoration:underline;display:inline-block;white-space:normal}.subject-section{background:#faf6eb;border-bottom:1px dashed var(--line)}.subject-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.subject-card{display:block;border:1px solid var(--ink);box-shadow:3px 4px 0 #45483a;padding:25px 25px 19px;text-decoration:none;transform:rotate(-.8deg);transition:transform .15s}.subject-card:nth-child(even){transform:rotate(.7deg)}.subject-card:hover{transform:rotate(0) translateY(-3px)}.subject-card h3{font-size:29px;margin-bottom:10px}.subject-card p{font-size:13px;max-width:240px}.subject-end{border-top:1px solid #343b3030;margin-top:22px;padding-top:11px;display:flex;justify-content:space-between;font-size:10px}.subject-end span{font-size:18px;line-height:1}.art{background:#e7c9b9}.science{background:#d6dfc9}.nature{background:#e0dfbd}.maths{background:#eddaa4}.literacy{background:#d4dfe0}.engineering{background:#dbd2c4}.activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:27px}.activity-card{background:var(--white);border:1px solid #d2cbbc;box-shadow:2px 4px 0 #7e786515;transform:rotate(-.6deg);transition:transform .15s}.activity-card:nth-child(even){transform:rotate(.7deg)}.activity-card:hover{transform:rotate(0) translateY(-3px)}.activity-card>a{display:block;text-decoration:none;height:100%;padding:10px}.card-image{position:relative}.card-image img{width:100%;aspect-ratio:4/3;object-fit:cover}.image-label{position:absolute;left:12px;bottom:12px;background:var(--white);padding:4px 10px;font-size:9px;letter-spacing:1px;text-transform:uppercase;border:1px solid #dfd8c8}.card-copy{padding:19px 10px 15px}.card-meta{display:flex;flex-wrap:wrap;gap:5px 14px;font-size:10px;color:var(--muted);margin-bottom:11px}.card-copy h3{font-size:25px;margin-bottom:11px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.card-copy h3 span{font-size:20px}.card-copy p{font-size:13px;line-height:1.65}.notebook{background:repeating-linear-gradient(#fffdf5 0px,#fffdf5 31px,#dbe0d2 32px,#fffdf5 33px);border:1px solid var(--line);box-shadow:5px 6px 0 #d9d1c1;padding:43px 54px 45px 75px;position:relative;transform:rotate(-.4deg)}.notebook:before{content:'';position:absolute;top:0;bottom:0;left:42px;width:1px;background:#dba5a0}.notebook h2{max-width:680px}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:37px}.steps-grid>div>span{font-family:var(--serif);font-style:italic;font-size:25px;color:#8b7855}.steps-grid h3{font-size:23px;margin:10px 0 13px}.steps-grid p{font-size:13px;line-height:1.8}.age-panel{background:var(--ink);color:var(--white);padding:44px;box-shadow:6px 6px 0 #cbb183;transform:rotate(.3deg)}.age-panel>p{color:#d5d9c9;max-width:650px;font-size:14px;margin-top:16px}.age-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:29px}.age-grid>a{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;border:1px dashed #a8ad99;padding:22px;text-decoration:none;gap:15px}.age-grid>a:hover{background:#ffffff0c}.age-number{font-family:var(--serif);font-size:45px;line-height:1;flex-basis:100%}.age-number small{font-family:Arial,sans-serif;font-size:11px;margin-left:9px}.age-grid strong{display:block;font-family:var(--serif);font-weight:400;font-size:20px}.age-grid small{font-size:11px;color:#d5d9c9;display:block}.age-number small{display:inline}.feature{padding:30px;background:#d8e0c9;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px;border:1px solid var(--ink);box-shadow:4px 5px 0 var(--ink);transform:rotate(-.4deg)}.feature>img{border:11px solid var(--white);border-bottom-width:27px;transform:rotate(-2deg);box-shadow:2px 4px 10px #343b3012}.feature h2{font-size:43px;margin:0 0 20px}.feature p{font-size:14px;margin-bottom:23px}.feature .tape-label{margin-bottom:20px;background:#f0e0ae;font-size:9px}.feature>div{padding-right:20px}footer{margin-top:55px;background:#e8e0d1;border-top:1px dashed #a9a28e;padding:49px 0 22px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr;gap:35px}.footer-grid .brand{font-size:22px}.footer-grid p{font-size:13px;margin-top:20px}.footer-grid h2{font:600 12px Arial,sans-serif;letter-spacing:0;margin-bottom:17px}.footer-grid>div>a:not(.brand){display:block;font-size:12px;text-decoration:none;margin-block:8px}.footer-grid>div>a:hover{text-decoration:underline}.footer-grid .footer-note{font-family:var(--serif);font-style:italic;font-size:19px;margin:0;transform:rotate(-5deg)}.footer-bottom{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);border-top:1px solid #cfc5b2;margin-top:35px;padding-top:17px}.breadcrumbs{display:flex;flex-wrap:wrap;gap:10px;font-size:11px;color:var(--muted);padding-top:35px}.breadcrumbs a{text-decoration:none}.breadcrumbs a:hover{text-decoration:underline}.page-heading{padding-top:48px;padding-bottom:30px}.page-heading h1{max-width:900px}.page-heading p{max-width:650px;font-size:17px;margin-top:22px}.compact{padding-top:20px}.collection-note{font-size:14px;margin-top:38px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:16px;align-items:end;background:#e9e4d7;padding:23px;border:1px solid var(--line)}.filters label{display:block;font-size:11px;font-weight:bold;margin-bottom:8px}.filters input,.filters select{width:100%;height:45px;border:1px solid #9b9a85;background:var(--white);border-radius:0;padding:10px;font-size:13px}.search-field>div{position:relative}.search-field svg{position:absolute;left:12px;top:13px}.filters input{padding-left:39px}.clear-button{background:transparent;border:0;text-decoration:underline;font-size:12px;min-height:45px;padding:6px}.result-count{font-size:12px;margin:25px 0}.empty-state{padding:60px 20px;text-align:center;background:var(--white);border:1px dashed var(--line)}.empty-state p{margin:20px 0}.notice{padding:15px;background:var(--yellow);font-size:14px}.activity-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:65px;align-items:center;padding-top:46px;padding-bottom:60px}.activity-hero h1{font-size:clamp(30px,3.6vw,44px)}.title-dot{color:#a66446}.activity-subtitle{font-family:var(--serif);font-style:italic;font-size:24px;margin-top:17px;line-height:1.4}.activity-tags{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.activity-tags span{border:1px solid #c4c3af;padding:4px 10px;font-size:10px;background:#e6e7d6}.activity-hero>div>p:not(.activity-subtitle){font-size:14px}.button-row{display:flex;gap:25px;align-items:center;flex-wrap:wrap;margin-top:28px}.activity-photo{position:relative;background:var(--white);border:1px solid #d0cab9;padding:12px;transform:rotate(3deg);box-shadow:3px 5px 0 #ded5c3}.activity-photo figcaption{font-size:12px;font-family:var(--serif);font-style:italic;text-align:center;padding:13px 8px 5px}.activity-layout{display:grid;grid-template-columns:310px 1fr;gap:65px;align-items:start}.supplies{background:#ece5d2;padding:29px;border:1px solid #c8c0ae;transform:rotate(-.4deg)}.supplies h2{font-size:30px}.small{font-size:12px!important}.supplies>.small{margin-top:12px}.checklist{padding:0;list-style:none;margin:22px 0}.checklist li{border-bottom:1px dashed #c2bca9;padding:12px 0;font-size:13px}.checklist label{display:flex;align-items:flex-start;gap:10px;cursor:pointer}.checklist input{appearance:auto;accent-color:var(--ink);width:17px;height:17px;flex-shrink:0;margin-top:3px}.checklist input:checked+span{text-decoration:line-through;color:#777967}.safety{border-top:1px solid #c2bca9;padding-top:20px;margin-top:20px}.safety h3{font-size:21px}.safety p{font-size:12px;line-height:1.8;margin:12px 0 18px}.instructions section{margin-bottom:45px;scroll-margin-top:30px}.instructions h2{font-size:34px}.instruction-list{padding:0;counter-reset:instruction;list-style:none;margin:27px 0}.instruction-list li{position:relative;padding-left:56px;margin-bottom:29px;counter-increment:instruction}.instruction-list li:before{content:counter(instruction,decimal-leading-zero);font-family:var(--serif);font-size:23px;position:absolute;left:0;top:0;background:#e2d6b7;width:37px;height:37px;display:flex;align-items:center;justify-content:center;transform:rotate(-4deg)}.instruction-list h3{font-size:24px;margin-bottom:11px}.instruction-list p,.instructions section>p,.adaptations p,.questions{font-size:14px;line-height:1.85}.learning-note{background:#e1e6d3;padding:28px 30px;border-left:3px solid #879474}.learning-note p{margin-top:17px}.questions{padding-left:20px;margin-top:22px;color:var(--muted)}.questions li{padding-left:5px;margin-bottom:8px}.adaptations{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:23px}.adaptations h3{font-size:23px;margin-bottom:12px}details{border-block:1px solid var(--line);margin-top:26px;padding:16px 0}summary{font-size:14px;font-weight:600}details p{font-size:14px;padding-top:14px}.download-note{padding:28px;background:#ede0bd;border:1px solid #c5b890;display:grid;grid-template-columns:1fr 140px;gap:23px;align-items:center}.download-note h2{font-size:31px}.download-note p{margin-top:16px;font-size:13px}.download-note .button{margin-top:20px;gap:14px}.download-note img{border:1px solid #b9b7a7;box-shadow:3px 3px 0 #b4a78940;transform:rotate(4deg)}.sheet-preview{display:block;font-size:11px;margin-top:17px}.usage-note{margin-top:-20px}.prose{max-width:760px;padding-top:15px;padding-bottom:55px}.prose h2{font-size:29px;margin:29px 0 16px}.prose p{font-size:15px;margin-bottom:18px}.error-actions{display:flex;gap:28px;align-items:center;padding-bottom:100px}[hidden]{display:none!important}
@media(min-width:1250px){.hero{gap:50px}.scrapbook{min-height:495px}}
@media(max-width:950px){.wrap{width:calc(100% - 48px)}.site-header{padding:12px;flex-wrap:wrap;gap:10px}.site-header nav{gap:10px 14px;font-size:12px;flex-wrap:wrap}.parents-link{display:none}.hero{gap:15px}.hero h1{font-size:44px}.scrapbook{min-height:410px}.scribble{font-size:16px;top:0}.main-paper{top:40px}.round-stamp{width:110px;height:110px;right:0}.subject-grid{gap:22px}.subject-card{padding:21px}.subject-card h3{font-size:26px}.activity-grid{gap:18px}.card-copy{padding:16px 5px}.card-copy h3{font-size:23px}.age-panel{padding:32px}.age-grid{gap:15px}.age-grid>a{padding:17px}.age-grid strong{font-size:19px}.feature{gap:30px}.feature h2{font-size:34px}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.footer-note{display:none}.activity-hero{gap:38px}.activity-layout{grid-template-columns:255px 1fr;gap:35px}.supplies{padding:22px}.download-note{grid-template-columns:1fr}.download-note img{display:none}.filters{grid-template-columns:2fr 1fr 1fr}.clear-button{grid-column:1/-1;justify-self:start;min-height:25px;padding:0}}
@media(max-width:680px){.wrap{width:calc(100% - 36px)}.site-header{margin-top:10px;padding:10px;flex-wrap:wrap;gap:10px}.brand{font-size:24px}.site-header nav{width:100%;justify-content:space-between;gap:10px;font-size:11px}.search-link{padding:5px 8px}.hero{grid-template-columns:1fr;padding-top:43px;padding-bottom:37px;gap:20px}.hero h1{font-size:clamp(34px,7.6vw,46px);letter-spacing:-1.2px}.hero-copy>p{font-size:18px}.hero-copy .hero-description{max-width:400px}.tape-label{margin-bottom:23px}.scrapbook{min-height:390px;width:min(450px,100%);margin-inline:auto}.main-paper{width:72%;top:25px;right:4%}.small-paper{width:50%;left:3%;bottom:5px}.scribble{top:1px;left:5%;font-size:16px}.round-stamp{bottom:11px;right:5%;width:105px;height:105px}.round-stamp strong{font-size:25px}.promise-strip .wrap{gap:15px;justify-content:space-between;font-size:8px;letter-spacing:.6px}.promise-strip span:before{display:none}.section{padding-block:39px}.section-heading{align-items:flex-start;flex-direction:column;gap:17px;margin-bottom:27px}.section-heading h2{font-size:34px}.eyebrow{font-size:9px;letter-spacing:1.7px}.subject-grid{grid-template-columns:1fr 1fr;gap:18px 15px}.subject-card{padding:20px 15px 15px}.subject-card .eyebrow{font-size:8px;letter-spacing:1px}.subject-card h3{font-size:24px}.subject-card p{font-size:12px}.subject-end{font-size:9px}.activity-grid{grid-template-columns:1fr;gap:27px}.activity-card{max-width:470px;width:100%;margin-inline:auto}.card-copy{padding:18px 12px}.card-copy h3{font-size:28px}.card-copy p{font-size:14px}.card-meta{font-size:11px}.notebook{padding:31px 24px 31px 41px}.notebook:before{left:23px}.notebook h2{font-size:31px}.steps-grid{grid-template-columns:1fr;gap:25px;margin-top:26px}.steps-grid h3{margin-top:4px}.age-panel{padding:28px 23px}.age-panel h2{font-size:33px}.age-grid{grid-template-columns:1fr;gap:14px}.age-grid>a{flex-wrap:nowrap;gap:15px}.age-number{flex-basis:auto;font-size:38px;min-width:75px}.age-number small{display:block;margin:4px 0 0}.age-grid strong{font-size:21px}.age-grid small{font-size:10px}.feature{grid-template-columns:1fr;padding:22px;gap:32px}.feature>div{padding-right:0;padding-bottom:7px}.feature h2{font-size:36px}.feature .tape-label{font-size:8px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px 20px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{align-items:flex-start;gap:15px}.footer-bottom span:last-child{text-align:right;max-width:140px}.breadcrumbs{font-size:10px;padding-top:27px}.page-heading{padding-top:31px}.page-heading h1{font-size:34px;letter-spacing:-1px}.page-heading p{font-size:15px}.compact{padding-top:12px}.filters{grid-template-columns:1fr 1fr;padding:18px;gap:13px}.search-field{grid-column:1/-1}.activity-hero{grid-template-columns:1fr;gap:38px;padding-top:31px;padding-bottom:40px}.activity-hero h1{font-size:38px;letter-spacing:-1.2px}.activity-photo{width:94%;margin-inline:auto;transform:rotate(2deg)}.activity-layout{grid-template-columns:1fr;gap:40px}.supplies{padding:28px;transform:none}.checklist li{padding-block:10px}.instructions h2{font-size:32px}.instruction-list li{padding-left:48px}.instruction-list h3{font-size:24px}.adaptations{grid-template-columns:1fr;gap:22px}.download-note{padding:25px}.download-note img{display:block;width:130px;margin:auto}.download-note{grid-template-columns:1fr}.learning-note{padding:24px}.error-actions{flex-direction:column;align-items:flex-start}.prose{padding-bottom:20px}.prose h2{font-size:27px}}
@media(max-width:360px){.hero h1{font-size:36px}.scrapbook{min-height:350px}.subject-card h3{font-size:21px}.site-header nav{font-size:11px;gap:8px}.search-link svg{display:none}.activity-hero h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
@media print{body{background:white;color:#111}.site-header,footer,.breadcrumbs,.button-row,.skip,.supplies>a,.download-note,.usage-note,main>section.section,.filters{display:none!important}.wrap{width:100%;max-width:none}.activity-hero{display:block;padding:0}.activity-photo{display:none}.activity-layout{display:block}.supplies{transform:none;margin:20px 0;break-inside:avoid}.instructions section{margin-bottom:20px}h1{font-size:32px!important}h2{font-size:24px!important}h3{font-size:19px!important}.instruction-list li{break-inside:avoid}.button{display:none}details>p{display:block}a{color:inherit}*{box-shadow:none!important}}


/* Brighter scrapbook colour direction — standalone review example */
:root{--paper:#fff9e9;--white:#fffef9;--ink:#243956;--muted:#46546b;--line:#d9c9aa;--sage:#baf0cc;--rose:#ffb9ae;--yellow:#ffda54}
body{background-image:radial-gradient(#e8c97d40 .8px,transparent .8px);background-size:12px 12px}
.site-header{border:2px solid var(--ink);box-shadow:5px 5px 0 #80cbed;border-radius:8px;background:#fffef9}
.brand{color:#2952a0}.brand span{color:#42516a}.site-header nav a:hover{text-decoration-color:#ffcf43}.search-link{background:#ffe27b;border:2px solid var(--ink);border-radius:6px}
h1,h2,h3{font-weight:700}.hero h1{color:#244677}.hero h1 em{color:#df543d;background:linear-gradient(transparent 77%,#ffdb57 77%,#ffdb57 95%,transparent 95%)}
.tape-label{background:#ffe16c;color:#29394f;font-weight:700}.button{background:#315fbe;color:white;border:2px solid #243956;box-shadow:4px 4px 0 #ffc940;border-radius:7px;font-size:14px}.button:hover{background:#254b9b;box-shadow:6px 6px 0 #ffc940}
.hero-paper{border:2px solid #304967;box-shadow:5px 7px 0 #badfd970}.hero-paper:before{background:#ffe075d9}.round-stamp{background:#c2edff;border:2px dashed #315fbe;color:#244677}.scribble{color:#be4d40}
.promise-strip{background:#ffe16a;border-block:2px dashed #b8912a}.promise-strip .wrap{font-weight:700;color:#3e4260}
.subject-section{background:#edf8ff;border-bottom:2px dashed #9cbcd5}.subject-card{border:2px solid var(--ink);border-radius:8px;box-shadow:4px 5px 0 var(--ink)}
.art{background:#ffbdb6}.science{background:#b9edc6}.nature{background:#d3ed94}.maths{background:#ffe06a}.literacy{background:#b9dfff}.engineering{background:#d8c5fc}.subject-card p{color:#34465c}.subject-card .eyebrow{color:#3c5066}.subject-card h3{color:#263d5c}
.activity-card{border:2px solid #304967;box-shadow:4px 5px 0 #e4ce9f;border-radius:7px}.card-image{overflow:hidden;border-radius:3px}.image-label{background:#fff6b6;border:1px solid #756534;font-weight:700;color:#3d4654}.card-copy h3{color:#284c86}
.notebook{border:2px solid #597293;box-shadow:6px 7px 0 #bddff3;background:repeating-linear-gradient(#fffef8 0px,#fffef8 31px,#cbdff2 32px,#fffef8 33px)}.notebook:before{background:#f09b9a}.steps-grid>div>span{display:inline-flex;align-items:center;justify-content:center;width:43px;height:43px;border-radius:50%;background:#ffdc60;color:#2c4464;font-style:normal;font-weight:bold}.steps-grid>div:nth-child(2)>span{background:#ffbdb6}.steps-grid>div:nth-child(3)>span{background:#b9edc6}
.age-panel{background:#365fc0;box-shadow:6px 6px 0 #ffd654;border:2px solid #243956;border-radius:7px}.age-panel>p{color:#fff}.age-grid>a{border:2px dashed #b7d4ff;border-radius:7px;background:#ffffff0c}.age-grid>a:hover{background:#ffffff20}.age-grid small{color:#eef5ff}.age-number{color:#ffdf69}
.feature{background:#c1eed1;border:2px solid #304967;border-radius:7px;box-shadow:5px 6px 0 #304967}.feature h2{color:#265d49}.feature .tape-label{background:#ffdf69}
footer{background:#dff1ff;border-top:2px dashed #85abc9}.footer-bottom{border-top-color:#afcadd}.preview-note{text-align:center;background:#fff0bb;color:#354b70;font-size:11px;padding:8px 18px;letter-spacing:.5px}.preview-note strong{margin-right:10px}.hero{padding-top:64px}.eyebrow{color:inherit}
@media(max-width:680px){.hero{padding-top:38px}.hero h1{font-size:clamp(33px,7.4vw,44px)}.preview-note{font-size:10px}.subject-card h3{font-size:23px}.subject-card{padding:18px 13px}.age-panel h2{font-size:31px}}

/* Theme two: The Colourful Classroom */
:root{--paper:#fffdfa;--white:#fff;--ink:#292445;--muted:#5b5870;--line:#e4e0ee;--serif:'Trebuchet MS',Arial,sans-serif}
body{background:#fffdfa;background-image:none;font-family:'Trebuchet MS',Arial,sans-serif}.preview-note{background:#eee8ff;color:#554191;padding:9px 18px}.site-header{border:0;border-bottom:2px solid #ece7f2;border-radius:0;box-shadow:none;background:transparent;padding:20px 0;margin-top:8px}.brand{color:#6948bf;font-size:27px;letter-spacing:-1.4px}.brand span{color:#777086;font-size:9px;letter-spacing:2px}.site-header nav{font-size:14px}.site-header nav a:hover{text-decoration-color:#ae95eb}.search-link{background:#eee7ff;border:0;border-radius:24px;padding:11px 17px;color:#593aac}
h1,h2,h3{font-family:'Trebuchet MS',Arial,sans-serif;font-weight:800;letter-spacing:-1px}.hero{background:#fff;border-radius:30px;position:relative;padding:26px 38px 24px;margin-top:20px;margin-bottom:22px;gap:30px;overflow:hidden}.hero-copy{position:relative;z-index:1}.hero h1{color:#36275b;font-size:clamp(42px,4.9vw,62px);letter-spacing:-2.6px;line-height:1.06;margin-bottom:16px}.hero h1 em{color:#7250c5;background:none;white-space:normal}.hero-copy>p{color:#504367;font-size:17px}.hero-copy .hero-description{color:#665877}.tape-label{clip-path:none;transform:none;border-radius:30px;background:#fff;color:#6747aa;font-size:11px;padding:8px 16px;font-weight:700;margin-bottom:20px}.button{background:#7751c8;color:white;border:0;border-radius:28px;box-shadow:0 5px 0 #51348f;padding:14px 24px;font-size:14px;gap:25px}.button:hover{background:#6540b5;box-shadow:0 6px 0 #51348f}.hero-footnote{color:#6b5a83}.hero-paper{border:5px solid white;border-radius:23px;padding:0 0 12px;overflow:hidden;box-shadow:0 14px 30px #5f468229}.hero-paper:before{display:none}.hero-paper img{border-radius:16px 16px 0 0}.hero-paper figcaption{font-family:'Trebuchet MS',sans-serif;font-style:normal;font-weight:700;font-size:14px;color:#57436e;padding:12px 8px 0}.main-paper{transform:rotate(5deg);top:6px;width:52%;right:1%}.small-paper{transform:rotate(-7deg);width:44%;bottom:8px;left:0}.scrapbook{min-height:412px}.scribble{display:none}.round-stamp{border:0;border-radius:24px;background:#ffd968;color:#644a1e;transform:rotate(9deg);width:100px;height:100px;right:0;top:12px;bottom:auto;box-shadow:0 6px 0 #d8b34e}.round-stamp strong{font-family:'Trebuchet MS',sans-serif;font-weight:800;font-size:26px}.promise-strip{background:transparent;border:0}.promise-strip .wrap{padding:4px 0 22px;justify-content:center;gap:38px;color:#777084;font-size:10px;letter-spacing:1px}.promise-strip span:before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:#ef8b72;margin-right:10px}.promise-strip span:nth-child(2):before{background:#85bf99}.promise-strip span:nth-child(3):before{background:#a48add}.section{padding-block:52px}.eyebrow{color:#826b9f;font-size:10px;letter-spacing:2px}.section-heading h2{font-size:36px;color:#34274d;line-height:1.2}.text-link{color:#6b49ad;font-size:13px}.subject-section{background:#fffdfa;border:0}.subject-grid{gap:20px}.subject-card,.subject-card:nth-child(even){transform:none;border:0;border-radius:22px;box-shadow:none;padding:28px;position:relative;overflow:hidden}.subject-card:hover{transform:translateY(-5px)}.subject-card:after{content:'';position:absolute;width:82px;height:82px;border:16px solid #ffffff55;border-radius:50%;right:-26px;top:-21px}.subject-card h3{font-size:27px;letter-spacing:-.7px;color:#352d50}.subject-card .eyebrow{color:#635372}.subject-card p{color:#544f61;font-size:13px}.subject-end{font-size:11px;border-top-color:#ffffff88;margin-top:24px}.subject-end span{background:#ffffff99;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;margin-top:-5px}.art{background:#ffddd1}.science{background:#d4f0dc}.nature{background:#e8efbf}.maths{background:#ffedb0}.literacy{background:#d9ebff}.engineering{background:#e8dcfa}.activity-card,.activity-card:nth-child(even){transform:none;border:1px solid #e7e1ee;border-radius:24px;box-shadow:0 6px 18px #30213c06;overflow:hidden}.activity-card:hover{transform:translateY(-5px)}.activity-card>a{padding:0}.card-image{border-radius:0}.card-copy{padding:24px}.card-copy h3{font-size:25px;color:#35264d;line-height:1.2}.image-label{border:0;border-radius:22px;padding:7px 12px;background:white;color:#564573;font-size:9px}.card-copy p{font-size:13px}.card-meta{font-size:10px;color:#7a7288}.notebook{transform:none;border:0;border-radius:30px;box-shadow:none;background:#fff1d1;padding:40px 44px}.notebook:before{display:none}.notebook h2{font-size:33px;color:#5b4124;line-height:1.2}.notebook .eyebrow{color:#957447}.steps-grid>div>span{border-radius:14px;background:#ffce75;color:#674623;font-family:'Trebuchet MS',sans-serif;font-size:21px}.steps-grid>div:nth-child(2)>span{background:#f4b29c}.steps-grid>div:nth-child(3)>span{background:#b1d9bb}.steps-grid h3{font-size:21px;color:#604934;letter-spacing:-.5px}.steps-grid p{color:#77634a}.age-panel{transform:none;background:#f0eaff;border:0;border-radius:30px;box-shadow:none;color:#3f2d62;padding:40px}.age-panel h2{font-size:35px;line-height:1.2}.age-panel>p{color:#6d5b85}.age-panel .eyebrow{color:#8a70ad}.age-grid>a{background:white;border:0;border-radius:20px;padding:25px;color:#59447b}.age-grid>a:hover{background:#fffaf0}.age-number{color:#7e55c3;font-family:'Trebuchet MS',sans-serif;font-size:43px;font-weight:800;letter-spacing:-2px}.age-number small{letter-spacing:0}.age-grid strong{font-family:'Trebuchet MS',sans-serif;font-size:19px;font-weight:700}.age-grid small{color:#877893}.age-grid>a:nth-child(2) .age-number{color:#d5824d}.age-grid>a:nth-child(3) .age-number{color:#489b83}.feature{transform:none;border:0;border-radius:30px;box-shadow:none;background:#e2f3eb;padding:35px;gap:45px}.feature>img{transform:rotate(-3deg);border:7px solid white;border-radius:22px;box-shadow:0 7px 20px #275e3514}.feature h2{font-size:37px;line-height:1.15;color:#2e6953}.feature .tape-label{background:#fff;color:#367c61}.feature p{color:#517361}.feature .button{background:#378666;box-shadow:0 5px 0 #235d47}footer{background:#f2edf8;border:0;margin-top:35px}.footer-grid h2{color:#5b4a75}.footer-grid p,.footer-grid>div>a:not(.brand){color:#6b5f7b}.footer-grid .footer-note{font-family:'Trebuchet MS',sans-serif;font-size:17px;font-style:normal;transform:none;font-weight:700;color:#a28aba}.footer-bottom{border-top-color:#ddd3e9;color:#6b5f75}.footer-grid .brand{font-size:24px}
@media(max-width:950px){.hero{padding:30px 26px}.hero h1{font-size:42px}.scrapbook{min-height:344px}.round-stamp{width:88px;height:88px;font-size:7px;top:10px}.round-stamp strong{font-size:20px}.feature h2{font-size:32px}.subject-card{padding:24px}.card-copy{padding:19px}.subject-card h3{font-size:24px}}
@media(max-width:680px){.site-header{padding:13px 0;gap:19px}.site-header nav{font-size:12px}.search-link{padding:7px 12px}.hero{padding:20px 16px 18px;margin-top:16px;border-radius:22px;gap:18px}.hero h1{font-size:clamp(28px,6.6vw,38px);letter-spacing:-1px}.hero-copy>p{font-size:17px}.hero-copy .hero-description{font-size:14px}.hero-footnote{font-size:10px}.scrapbook{min-height:296px}.main-paper{top:4px;width:58%;right:0}.small-paper{bottom:4px;width:47%}.round-stamp{width:74px;height:74px;right:0;top:8px;bottom:auto}.round-stamp strong{font-size:20px}.hero-paper figcaption{font-size:10px;padding-top:8px}.hero-paper{border-width:4px;padding-bottom:9px;border-radius:16px}.promise-strip .wrap{gap:12px;justify-content:space-between;font-size:8px;letter-spacing:.2px}.promise-strip span:before{display:none}.section{padding-block:34px}.section-heading h2{font-size:29px}.subject-grid{gap:14px}.subject-card{padding:23px 15px 17px;border-radius:18px}.subject-card h3{font-size:22px}.subject-card p{font-size:12px}.subject-card:after{width:59px;height:59px;border-width:11px}.subject-end{font-size:9px}.notebook{padding:29px 25px}.notebook h2{font-size:28px}.steps-grid{gap:23px}.age-panel{padding:29px 23px}.age-panel h2{font-size:29px}.age-grid>a{padding:21px 17px}.age-grid strong{font-size:18px}.age-number{font-size:36px}.feature{padding:24px;gap:29px}.feature h2{font-size:31px}.card-copy{padding:23px}.card-copy h3{font-size:26px}.footer-grid h2{font-family:Arial,sans-serif;font-size:12px}}

/* Theme 3: Pink classroom, golden yellow and purple */
:root{--paper:#FFF8EC;--white:#fff;--ink:#34233E;--muted:#6b5772;--yellow:#efb51d;--kiddo-purple:#57306D}body{background:var(--paper)}.preview-note{background:#f6c640;color:#543457}.brand{color:#ae327a}.brand span{color:#84517c}.site-header{border-bottom-color:#f1cee4}.search-link{background:#f8d3e9;color:#82306d}.hero{background:#fff}.hero h1{color:var(--kiddo-purple)}.hero h1 em{color:#b83079}.hero-copy>p,.hero-copy .hero-description{color:#744366}.tape-label{background:#f6cc50;color:#603253}.button{background:#8a45b4;box-shadow:0 5px 0 #60277f}.button:hover{background:#76379e;box-shadow:0 6px 0 #60277f}.hero-footnote{color:#80516f}.round-stamp{background:#efb51d;color:#553451;box-shadow:0 7px 0 #c48d0b}.hero-paper{box-shadow:0 14px 30px #9a356221}.hero-paper figcaption{color:#813c72}.promise-strip .wrap{color:#8e6080}.promise-strip span:before{background:#e783b9}.promise-strip span:nth-child(2):before{background:#e2ad17}.promise-strip span:nth-child(3):before{background:#9c65c8}.subject-section{background:var(--kiddo-lavender)}.eyebrow{color:#8c4577}.section-heading h2{color:#652967}.text-link{color:#8b3baa}.art{background:#f9bddb}.science{background:#e4cdf7}.nature{background:#f6d877}.maths{background:#f1c24b}.literacy{background:#f8d5e9}.engineering{background:#d8bcf0}.subject-card h3{color:#612d63}.subject-card p{color:#65485d}.subject-card .eyebrow{color:#6d425c}.activity-card{border-color:#efd2e4}.card-copy h3{color:#71326d}.image-label{background:#fff0bb;color:#693f57}.card-meta{color:#896d83}.notebook{background:#f9db77}.notebook h2{color:#643757}.notebook .eyebrow{color:#7e553b}.steps-grid h3{color:#70385a}.steps-grid p{color:#795342}.steps-grid>div>span{background:#e8ad18;color:#603353}.steps-grid>div:nth-child(2)>span{background:#eea3cd}.steps-grid>div:nth-child(3)>span{background:#c99be4}.age-panel{background:#8042a7;color:white}.age-panel h2{color:white}.age-panel>p,.age-panel .eyebrow{color:#f4dcff}.age-grid>a{background:#fff5fb}.age-number,.age-grid>a:nth-child(2) .age-number,.age-grid>a:nth-child(3) .age-number{color:#b53483}.age-grid strong{color:#703271}.age-grid small{color:#8d648b}.feature{background:#f5cde5}.feature h2{color:#762d70}.feature .tape-label{background:#f4c842;color:#704256}.feature p{color:#895477}.feature .button{background:#9144b4;box-shadow:0 5px 0 #64267e}footer{background:#f2e4fa}.footer-grid .brand{color:#a53179}.footer-grid h2{color:#77336f}.footer-bottom{border-color:#dfc3e7}.footer-grid .footer-note{color:#9e6a9c}
.write-panel{background:#f0e0fa;border:2px solid #d9b7ed;border-radius:30px;padding:36px}.write-heading{display:flex;justify-content:space-between;align-items:start;gap:25px;margin-bottom:25px}.write-heading h2{color:#693174;font-size:35px}.write-heading p{font-size:14px;max-width:620px;margin-top:13px}.try-label{background:#efb51d;color:#57314f;border-radius:50%;width:82px;height:82px;flex-shrink:0;display:grid;place-items:center;text-align:center;transform:rotate(10deg);font-weight:800;font-size:13px;line-height:1.2}.writing-tools{display:flex;align-items:end;gap:16px;flex-wrap:wrap;margin-bottom:18px}.writing-tools label{display:grid;gap:5px;font-size:12px;font-weight:700;color:#714073}.writing-tools select{height:42px;max-width:100%;border:1px solid #ba91d0;border-radius:10px;background:white;padding:7px 12px}.pen-colors{display:flex;gap:7px;align-items:center;border:0;margin:0;padding:0}.pen-colors legend{font-size:12px;font-weight:700;color:#714073;margin-bottom:5px}.pen-color{border:3px solid transparent;width:38px;height:38px;border-radius:50%;background:var(--pen);box-shadow:inset 0 0 0 3px #ffffff77}.pen-color[aria-pressed=true]{border-color:#3d2252;outline:2px solid white}.practice-prompt{font-size:16px;font-weight:700;color:#8d3476;padding:13px 17px;background:#fff0c4;border-radius:12px 12px 0 0}.canvas-wrap{background:white;border:2px solid #bd90d4;border-radius:0 0 16px 16px;overflow:hidden;position:relative}#handwriting{display:block;width:100%;height:310px;touch-action:none;cursor:crosshair;background:#fffefb}.writing-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;align-items:center}.tool-btn{border:1px solid #be91ce;background:white;border-radius:24px;padding:10px 17px;color:#72378a;font-size:13px;font-weight:700;min-height:44px}.tool-btn:hover{background:#fff0fa}.writing-actions .button{margin-left:auto;padding:10px 20px;min-height:44px}.tool-btn:disabled{opacity:.45;cursor:default}.writing-note{font-size:11px;margin-top:17px;color:#7a5885}.writing-status{font-size:12px;min-height:22px;margin-top:10px;color:#784084}.write-panel a:focus-visible,.write-panel button:focus-visible,.write-panel select:focus-visible,#handwriting:focus-visible{outline:3px solid #762c91;outline-offset:4px}
@media(max-width:680px){.write-panel{padding:23px 17px;border-radius:24px}.write-heading{gap:10px}.write-heading h2{font-size:28px}.write-heading p{font-size:13px}.try-label{width:60px;height:60px;font-size:11px}.writing-tools{gap:12px}.writing-tools>label:first-child{width:100%}.writing-actions .button{margin-left:0}#handwriting{height:270px}.practice-prompt{font-size:13px}.writing-actions{gap:8px}.tool-btn{font-size:12px;padding:9px 14px}.writing-actions .button{font-size:12px}.writing-note{font-size:10px}}

#handwriting{touch-action:none}.handwriting-cta{background:#f9d2e8;padding:22px 25px;border-radius:18px;margin:0 0 25px;display:flex;gap:18px;align-items:center;justify-content:space-between}.handwriting-cta p{font-size:14px}.handwriting-cta h2{font-size:25px;margin-bottom:7px}@media(max-width:680px){.handwriting-cta{display:block}.handwriting-cta .button{margin-top:16px}}

.pen-color[data-pen="#803bab"]{--pen:#803bab}.pen-color[data-pen="#ca3782"]{--pen:#ca3782}.pen-color[data-pen="#a57500"]{--pen:#a57500}
.bean-links{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:22px 0}.bean-links a{display:flex;flex-direction:column;background:white;padding:22px;border:1px solid #e4c6e9;border-radius:16px;text-decoration:none;gap:9px}.bean-links a>span{color:#ae3481;font-size:12px;font-weight:bold}.bean-links strong{color:#743779;font-size:19px}.bean-links small{color:#886489}.bean-overview{max-width:850px;margin-bottom:28px}.bean-overview>p{margin-bottom:17px}.bean-safety{font-size:13px;padding:17px;background:#fff1c9;border-radius:12px}.bean-work-controls{display:flex;gap:20px;align-items:end;flex-wrap:wrap;margin:23px 0}.bean-work-controls label{display:grid;gap:7px;font-size:12px;font-weight:bold}.bean-work-controls select{padding:10px;border:1px solid #bb92cf;background:white;border-radius:10px}.bean-task{background:white;border:1px solid #e8cee7;border-radius:22px;padding:28px;margin:25px 0}.bean-task h2{font-size:28px;color:#713276}.bean-task>p{font-size:14px;margin:15px 0}.bean-canvas{display:block;width:100%;height:260px;border:2px solid #dfc4e8;border-radius:12px;touch-action:none;cursor:crosshair}.bean-canvas:focus-visible,.bean-fields textarea:focus-visible{outline:3px solid #9450ba;outline-offset:3px}.bean-canvas-actions{display:flex;gap:12px;margin:12px 0 22px}.bean-canvas-actions button{background:#faedf6;border:1px solid #e1b7d6;border-radius:18px;padding:9px 15px;font-size:12px}.bean-canvas-actions button:disabled{opacity:.45;cursor:default}.bean-fields{display:grid;grid-template-columns:1fr 1fr;gap:17px}.bean-fields label{display:grid;gap:8px;font-size:13px;font-weight:bold;color:#774079}.bean-fields textarea{resize:vertical;width:100%;padding:13px;border:1px solid #d9bbdf;border-radius:10px;background:#fffafd;font-size:16px;line-height:1.5;min-height:82px}.bean-status{font-size:13px;color:#803780;margin:18px 0}.bean-learning{background:#fae4a0;border-radius:20px;padding:26px;margin:30px 0}.bean-learning h2,.bean-next h2{font-size:28px;margin-bottom:15px}.bean-next{margin:40px 0}.bean-download{margin:30px 0}.bean-download img{max-width:320px;max-height:460px;object-fit:contain;border:1px solid #e1d7df;margin-bottom:18px}.bean-download a{margin-right:17px}@media(max-width:680px){.bean-links{grid-template-columns:1fr}.bean-fields{grid-template-columns:1fr}.bean-task{padding:20px 15px}.bean-canvas{height:240px}.bean-work-controls{gap:13px}.bean-work-controls .button{width:100%}.bean-download img{max-width:100%}}

.bean-links .bean-thumb{width:100%;height:190px;object-fit:contain;background:#fff9fd;border-radius:10px;border:1px solid #f2deef}.bean-links a>p{font-size:14px;line-height:1.55;margin:0;color:#614768}.bean-links small{margin-top:auto}.bean-explainer{margin:30px 0 38px}.bean-explainer-intro{display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center}.bean-explainer-intro img{width:200px;height:300px;object-fit:contain;background:white;border:1px solid #e4c6e9;border-radius:14px}.bean-explainer-intro h2{font-size:30px;margin:12px 0}.bean-explainer-intro p{margin:12px 0}.bean-lesson-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}.bean-lesson-grid section{padding:23px;background:#fff;border:1px solid #e4c6e9;border-radius:16px}.bean-lesson-grid section:nth-child(3n+2){background:#fff7d9}.bean-lesson-grid section:nth-child(3n+3){background:#f5ebfc}.bean-lesson-grid h3{font-size:20px;color:#743779;margin-bottom:12px}.bean-lesson-grid p{font-size:16px;line-height:1.7}@media(max-width:680px){.bean-explainer-intro{grid-template-columns:1fr;gap:16px}.bean-explainer-intro img{width:160px;height:240px}.bean-lesson-grid{grid-template-columns:1fr}.bean-links .bean-thumb{height:180px}}

.sink-project{background:#fff;padding:1px 0}.sink-project .bean-task,.sink-project .bean-lesson-grid section,.sink-project .bean-learning,.sink-project .bean-safety{background:#fff}.sink-project .bean-learning,.sink-project .bean-safety{border:1px solid #e4c6e9}

.weather-page{background:#fff}.weather-visual{display:grid;grid-template-columns:minmax(0,3fr) minmax(240px,2fr);gap:36px;align-items:center;margin:12px 0 40px}.weather-visual>a{display:block}.weather-visual img{display:block;width:100%;height:auto;max-height:850px;object-fit:contain}.weather-visual p{margin:18px 0;line-height:1.7}.weather-links .bean-thumb{height:320px;background:white}.weather-links{grid-template-columns:repeat(3,minmax(0,1fr))}.weather-page .activity-photo{transform:none;background:white}.weather-page .activity-photo img{height:auto;max-height:700px;object-fit:contain}.weather-project .bean-task,.weather-project .bean-safety,.weather-project .bean-learning{background:#fff;border:1px solid #e4c6e9}.weather-page .title-dot{display:none}.weather-page .page-heading{padding-bottom:12px}@media(max-width:760px){.weather-visual{grid-template-columns:1fr;gap:18px}.weather-links{grid-template-columns:repeat(2,minmax(0,1fr))}.weather-links .bean-thumb{height:260px}}@media(max-width:480px){.weather-links{grid-template-columns:1fr}.weather-links .bean-thumb{height:320px}}

/* Preserve artwork proportions on every surface. */
:root{--kid-font:'Chalkboard SE','Comic Sans MS','Comic Sans','Trebuchet MS',sans-serif}
h1,h2,h3,.brand,.bean-links strong{font-family:var(--kid-font);letter-spacing:0}
.card-image{position:relative;background:#fff;overflow:hidden}
.card-image img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
.card-image .image-title{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);margin:0;padding:7px 12px;background:#fffffff2;border:1px solid #ead9e9;border-radius:10px;color:#71326d;font-family:var(--kid-font);font-size:16px;font-weight:700;line-height:1.3;letter-spacing:0}
.card-copy{padding:16px 20px 20px}.card-copy p{font-size:14px;line-height:1.6}.card-meta{margin-bottom:8px}
.activity-grid{align-items:start}.activity-card{align-self:start}
.bean-links .bean-thumb,.weather-links .bean-thumb{display:block;width:100%;height:auto;max-height:none;background:#fff}
.bean-links strong{font-size:18px;line-height:1.35}.bean-links a{padding:14px}
.activity-photo img,.weather-page .activity-photo img,.hero-paper img{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
.bean-explainer-intro img{height:auto}
.weather-visual img{height:auto;max-height:none}
.page-heading h1,.activity-hero h1{font-size:clamp(28px,3.5vw,44px);letter-spacing:0}.section-heading h2{font-size:clamp(25px,3vw,34px);letter-spacing:0}
@media(max-width:600px){.card-image .image-title{font-size:15px}.bean-links .bean-thumb,.weather-links .bean-thumb{height:auto}.bean-links strong{font-size:17px}}
.fc-intro{margin-top:36px}.fc-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}.fc-chips span{border:1.5px solid var(--ink);background:var(--white);padding:7px 14px;border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.4px}.fc-lede{max-width:780px;font-size:17.5px;color:var(--ink)}
.fc-section{margin-top:56px}.fc-hint{margin-top:10px;font-size:14px}
.fc-stages{margin-top:22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.fc-stage{border:1.5px solid var(--line);background:var(--white);padding:18px 20px;display:flex;flex-direction:column;gap:10px}.fc-stage-pills{display:flex;gap:8px;flex-wrap:wrap}.fc-stage-pills .fc-age{background:var(--ink);color:var(--white);padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:700}.fc-stage-pills .fc-class{border:1.5px solid var(--ink);background:var(--yellow);padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:700}.fc-stage-subjects{display:flex;gap:6px;flex-wrap:wrap}.fc-stage-subjects span{border:1.5px solid var(--line);background:var(--paper);padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:600;color:var(--muted)}.fc-stage p{font-size:13.5px;line-height:1.6}
.fc-grid{margin-top:22px;display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:22px}.fc-grid-2{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.fc-card{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);display:flex;flex-direction:column}.fc-card a{display:block}.fc-card img{width:100%;height:auto;display:block;background:#fff}
.fc-card figcaption{padding:13px 15px 15px;border-top:1.5px solid var(--line)}.fc-card figcaption strong{display:block;font-family:var(--serif);font-size:19px;color:var(--ink)}.fc-card figcaption span{display:block;margin-top:3px;font-size:13px;color:var(--muted)}
.fc-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:16px;max-width:840px}.fc-steps li{display:flex;gap:16px;align-items:flex-start;border:1.5px solid var(--line);background:var(--white);padding:16px 18px}.fc-stepnum{font-family:var(--serif);font-size:22px;color:#a9694e;min-width:34px}.fc-steps h3{font-size:20px}.fc-steps p{margin-top:4px;font-size:14.5px}
.fc-why{border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 var(--ink);padding:26px 28px;max-width:900px}.fc-why p{margin-top:10px;color:var(--ink)}
.fc-adapt{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;max-width:900px}.fc-adapt div{border:1.5px solid var(--line);background:var(--white);padding:18px 20px}.fc-adapt h3{font-size:20px}.fc-adapt p{margin-top:6px;font-size:14.5px}
.fc-safety{margin-top:18px;border-left:4px solid #a9694e;background:var(--white);padding:13px 16px;font-size:14px;max-width:900px;color:var(--ink)}
.fc-back{margin-top:50px;margin-bottom:26px}
.fc-setcard{position:relative;display:flex;flex-direction:column;min-width:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:6px 6px 0 var(--ink);text-decoration:none}.fc-setcard-visual{display:flex;align-items:center;justify-content:center;height:225px;padding:16px;background:#fff;border-bottom:1.5px solid var(--line)}.fc-setcard-visual img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}.fc-setcard-copy{display:flex;flex-direction:column;flex:1;min-width:0;padding:18px 20px 22px;border-top:0}.fc-setcard-copy h2{font-size:24px;letter-spacing:-.3px;margin-top:6px}.fc-setcard-copy p{margin-top:9px;font-size:14.5px;line-height:1.55}
.fc-setcard:hover .fc-open{text-decoration-thickness:2px}
.fc-guide-figure{max-width:460px;margin:22px auto 0;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14)}.fc-guide-figure img{display:block;width:100%;height:auto}.fc-guide-figure figcaption{padding:13px 15px 15px;border-top:1.5px solid var(--line)}.fc-guide-figure figcaption strong{display:block;font-family:var(--serif);font-size:19px;color:var(--ink)}.fc-guide-figure figcaption span{display:block;margin-top:3px;font-size:13px;color:var(--muted)}
.fc-open{display:inline-block;margin-top:14px;font-weight:700;font-size:14px;color:#71326d;text-decoration:underline;text-underline-offset:4px}
.fc-soon{margin-top:44px;border:1.5px dashed var(--ink);background:var(--sage);padding:24px 26px;max-width:880px}.fc-soon p{margin-top:8px}
@media(max-width:700px){.fc-setcard-visual{height:190px;padding:12px}.fc-steps li{flex-direction:column;gap:6px}}
/* Newborn lesson pages (Kiddo School classes) */
.lesson-hero{margin-top:30px;max-width:860px}
.lesson-chips span{border:1.5px solid var(--ink);background:var(--white);padding:6px 13px;border-radius:999px;font-size:12.5px;font-weight:600}
.lesson-chips strong{font-weight:800;margin-right:5px;text-transform:uppercase;font-size:10.5px;letter-spacing:.8px}
.lesson-lede{margin-top:16px;font-size:17px;max-width:74ch;color:var(--ink)}
.lesson-start{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.lesson-start-hint{font-size:13px;color:var(--muted);max-width:34ch}
.lesson-section{margin-top:56px}
.lesson-classheading{margin-top:30px}
.lv-frame{margin-top:20px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:18px}
.lv-stage{display:none;margin:0 auto;max-width:520px}
.lv-figure{margin:0}
.lv-stage img{width:100%;height:auto}
.lv-controls{display:none;align-items:center;justify-content:center;gap:14px;margin-top:16px;flex-wrap:wrap}
.lv-count{font-size:13px;font-weight:700;letter-spacing:.5px;min-width:9ch;text-align:center}
.lv-btn{border:1.5px solid var(--ink);background:var(--white);padding:10px 16px;font-weight:700;font-size:13px;box-shadow:3px 3px 0 rgba(52,59,48,.18);min-height:44px}
.lv-btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(52,59,48,.22)}
.lv-btn:disabled{opacity:.35;cursor:default;box-shadow:none}
.lv-actions{display:none;justify-content:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.lv-begin{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;margin-top:6px}
.lv-beginhint{font-size:13px;color:var(--muted)}
.lv-done{margin-top:14px;border-left:4px solid #a9694e;background:var(--white);padding:12px 15px;font-size:14px;color:var(--ink)}
.lv-done[hidden]{display:none}
.lv-grid{margin-top:20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.lv-card{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12)}
.lv-card img{width:100%;height:auto}
.is-live .lv-stage{display:block}
.is-live .lv-controls,.is-live .lv-actions{display:flex}
.is-live .lv-begin{display:none}
.is-live ~ .lv-grid{display:none}
.lv-frame:fullscreen{display:flex;flex-direction:column;justify-content:center;padding:14px;max-width:none}
.lv-frame:fullscreen .lv-stage img{max-height:82vh;width:auto;max-width:100%;margin-inline:auto}
.lv-frame.is-fs{position:fixed;inset:0;z-index:80;margin:0;display:flex;flex-direction:column;justify-content:center;padding:14px}
.lv-frame.is-fs .lv-stage img{max-height:80vh;width:auto;max-width:92vw;margin-inline:auto}
.lesson-note{margin-top:22px;border-left:4px solid #a9694e;background:var(--white);padding:13px 16px;font-size:14px;max-width:900px;color:var(--ink)}
.lesson-linkrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.lesson-pill-link{border:1.5px solid var(--ink);background:var(--white);padding:10px 18px;border-radius:999px;font-weight:700;text-decoration:none;font-size:14px;box-shadow:3px 3px 0 rgba(52,59,48,.14)}
.lesson-pill-link:hover{background:var(--yellow);text-decoration:none}
.lesson-next{margin-top:26px;font-size:15px;color:var(--ink)}
.lesson-next strong{font-weight:800}
.lesson-card-link{text-decoration:none}
.lesson-card-link:hover{background:var(--sage)}
.lesson-card-link h3{text-decoration:underline;text-underline-offset:4px}
.lesson-soon{opacity:.8;border-style:dashed}
.lesson-feature{max-width:900px}
@media(max-width:700px){.lesson-hero{margin-top:20px}.lv-frame{padding:12px}.lv-grid{grid-template-columns:repeat(2,1fr);gap:10px}}
/* Shared Kiddo School lesson engine (lessons 2+) */
.lesson-hero-cover{display:grid;gap:28px;align-items:start}
.lesson-cover{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);max-width:400px}
.lesson-cover img{width:100%;height:auto;object-fit:contain}
@media(min-width:920px){.lesson-hero-cover{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}.lesson-cover{justify-self:end}}
.lesson-copy{margin-top:14px;max-width:76ch;color:var(--ink)}
.lesson-copy:first-of-type{margin-top:22px}
.lesson-prompts{margin-top:18px;padding:0;list-style:none;max-width:76ch;display:grid;gap:10px}
.lesson-prompts li{border-left:4px solid var(--yellow);background:var(--white);padding:10px 14px;font-size:15px;color:var(--ink)}
.lesson-path{margin-top:18px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.lv-stage img{object-fit:contain}
.lv-frame:fullscreen .lv-stage img,.lv-frame.is-fs .lv-stage img{object-fit:contain}

/* Kiddo School: digital school upgrade — learning path, toddler class games, school voice */
.button-ghost{background:var(--white);color:var(--ink);box-shadow:3px 3px 0 var(--sage)}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:6px}
.lp-stages{margin-top:26px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.lp-stage{display:flex;flex-wrap:wrap;align-items:center;gap:8px;border:1.5px solid var(--ink);background:var(--white);padding:11px 13px;text-decoration:none;color:var(--ink);box-shadow:3px 3px 0 rgba(52,59,48,.14);min-height:46px}
.lp-stage:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(52,59,48,.2)}
.lp-range{font-weight:700;font-size:13px}
.lp-open{margin-left:auto;font-weight:700;color:#71326d}
.lp-path{margin-top:26px;display:grid;gap:22px;max-width:820px}
.lp-row{display:grid;grid-template-columns:54px 1fr;gap:16px;align-items:start}
.lp-marker span{display:flex;align-items:center;justify-content:center;width:54px;height:54px;border:1.5px solid var(--ink);border-radius:999px;background:var(--yellow);font-weight:700;font-size:16px}
.lp-stage-card{border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:20px 22px}
/* the magic games: a separate shelf outside the numbered class sequence */
.lp-row.lp-magic{margin-top:26px}
.lp-row.lp-magic .lp-marker span{background:#71326d;color:#fff;border-color:#71326d}
.lp-row.lp-magic .lp-stage-card{background:#faf6ff;border-style:dashed}
.lp-stage-card h2{margin:12px 0 4px;font-size:23px}
.lp-class{margin:2px 0 0;font-size:15px}
.lp-class a{font-weight:700}
.lp-hublink{margin:8px 0 0;font-size:13px;color:var(--muted)}
.lp-next{border-style:dashed;background:var(--sage)}
.lv-caption{display:none;margin:14px auto 0;max-width:520px;text-align:center;font-size:16px;font-weight:700;color:var(--ink)}
.is-live .lv-caption{display:block}
.lv-caption:after{content:"";display:block;margin-top:2px}
.tc-flow{margin:22px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;counter-reset:none}
.tc-flow li{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);background:var(--white);padding:10px 12px;font-size:14px;font-weight:600}
.tc-flow li span{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;border-radius:999px;background:var(--ink);color:var(--white);font-size:12px;font-weight:700}
.tc-note-block{border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:20px 22px;max-width:760px}
.tc-teacher{background:#fdf6ec}
.tc-principal{background:var(--sage)}
.tc-parents{background:var(--white)}
.tc-say{font-size:18px;font-weight:600;margin:10px 0 4px}
.tc-who{margin:6px 0 0;font-size:13.5px;color:var(--muted)}
.tc-round{margin-top:26px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12);padding:20px;max-width:640px}
.tc-ask{margin:0 0 14px;font-size:19px;font-weight:700}
.tc-target{margin:0 0 14px;border:1.5px solid var(--ink);background:var(--white);padding:8px;max-width:250px}
.tc-target img{width:100%;height:auto;display:block}
.tc-choices{display:flex;flex-wrap:wrap;gap:14px}
.tc-choice{border:1.5px solid var(--ink);background:var(--white);padding:8px;box-shadow:3px 3px 0 rgba(52,59,48,.16);cursor:pointer;min-width:88px;min-height:88px;transition:transform .15s,box-shadow .15s}
.tc-choice img{width:96px;height:auto;display:block;object-fit:contain}
.tc-match .tc-choice img{width:78px}
.tc-choice:hover,.tc-choice:focus-visible{transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(52,59,48,.24)}
.tc-round.is-done .tc-choice{opacity:.55}
.tc-round.is-done .tc-choice.is-picked{opacity:1;outline:3px solid #71326d;outline-offset:2px}
.tc-round.is-done .tc-choice{pointer-events:none}
.tc-feedback{margin:14px 0 0;font-size:16px;font-weight:700;color:#71326d}
/* Position-answer buttons: the card stays the prompt and the big numbered
   buttons underneath are the honest tap targets — no fake image hitboxes. */
.tc-nums{gap:16px}
.tc-num{display:inline-flex;align-items:center;justify-content:center;min-width:88px;min-height:88px;padding:8px;font-size:30px;font-weight:800;line-height:1;color:var(--ink);border:1.5px solid var(--ink);border-radius:6px;font-family:inherit}
.tc-num span{pointer-events:none}
.tc-prompt .tc-target{max-width:280px}
/* What-can-we-do guide rows: a small card thumb and one sentence to borrow. */
.tc-guide{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:12px;max-width:640px}
.tc-guide-row{display:flex;align-items:center;gap:16px;border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.12);padding:10px 14px}
.tc-guide-row img{width:110px;height:auto;border:1px solid var(--line)}
.tc-guide-row h3{margin:0;font-size:17px}
.tc-guide-say{margin:2px 0 0;font-size:16px;font-weight:600;color:var(--ink)}
.tc-hunt{margin-top:18px}
.tc-hunt h3{margin:0 0 6px}
.parents-principal{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start;max-width:980px}
.parents-principal .tc-note-block h2{margin:0 0 10px;font-size:27px}
.final-cta{border:1.5px solid var(--ink);background:#d8e0c9;box-shadow:5px 6px 0 var(--ink);padding:44px 40px;text-align:center;transform:rotate(-.4deg)}
.final-cta h2{margin:0 0 10px;font-size:38px}
.final-cta p{margin:0 auto 20px;max-width:52ch}
.final-cta .hero-actions{justify-content:center;margin-top:0}
@media(max-width:950px){.parents-principal{grid-template-columns:1fr}}
@media(max-width:700px){.hero-actions .button{width:100%}.lp-row{grid-template-columns:40px 1fr}.lp-marker span{width:40px;height:40px;font-size:13px}.lp-stage-card{padding:16px}.lp-stage-card h2{font-size:19px}.tc-choice img{width:82px}.tc-round{padding:16px}.tc-ask{font-size:17px}.final-cta h2{font-size:29px}.final-cta{padding:32px 22px}.tc-flow{grid-template-columns:1fr 1fr}.parents-principal .tc-note-block h2{font-size:22px}}
@media(max-width:360px){.tc-flow{grid-template-columns:1fr}.tc-choice img{width:72px}.tc-choice{min-width:76px;min-height:76px}}
@media(max-width:700px){.tc-guide-row{padding:8px 10px;gap:10px}.tc-guide-row img{width:82px}}
@media(prefers-reduced-motion:reduce){.tc-choice,.lp-stage{transition:none}}
@media(max-width:680px){.site-header nav{flex-wrap:wrap;row-gap:8px}}

/* Colors & Shapes printable activity pack */
.tc-printables .tc-pack-head{margin-top:24px;display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center;border:1.5px solid var(--ink);background:#fdf6ec;box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:22px 24px}
.tc-pack-head h3{margin:10px 0 4px;font-size:24px}
.tc-pack-meta{margin:0;font-weight:700;font-size:14px;color:#71326d}
.tc-pack-audience{margin:8px 0 0;font-size:14.5px;color:var(--ink)}
.tc-print-actions{margin-top:4px}
.tc-print-actions .button{min-height:48px}
.tc-pack-contents{margin:24px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;counter-reset:none}
.tc-pack-contents li{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);background:var(--white);padding:10px 12px;font-size:14px;font-weight:600}
.tc-pack-contents li span{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;border-radius:999px;background:#71326d;color:var(--white);font-size:12px;font-weight:700}
.tc-pack-grid{margin-top:24px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tc-pack-card{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12)}
.tc-pack-card a{display:block}
.tc-pack-card img{width:100%;height:auto;display:block}
.tc-pack-card figcaption{display:flex;justify-content:space-between;gap:8px;padding:9px 12px;font-size:12.5px;border-top:1.5px solid var(--line)}
.tc-pack-card figcaption span{color:var(--muted);white-space:nowrap}
.print-head{margin-top:34px;max-width:820px}
.print-head h1{margin:0 0 6px}
.tc-print-pages{margin-top:34px;display:grid;gap:34px;max-width:820px}
.tc-print-page{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12);padding:0}
.tc-print-page img{width:100%;height:auto;display:block}
.tc-print-page figcaption{padding:10px 14px;font-size:13.5px;border-top:1.5px solid var(--line);color:var(--muted)}
@media(max-width:950px){.tc-printables .tc-pack-head{grid-template-columns:1fr}}
@media(max-width:700px){.tc-pack-grid{grid-template-columns:repeat(2,1fr);gap:12px}.tc-pack-head{padding:18px}.tc-pack-head h3{font-size:20px}.tc-print-actions .button{width:100%}}
@media print{
 body.print-view{background:#fff}
 .print-view main{padding:0}
 .print-view .print-head{margin:0;max-width:none}
 .print-view .tc-print-pages{margin-top:0;gap:0;max-width:none;display:block}
 .print-view .tc-print-page{border:0;box-shadow:none;page-break-after:always;break-after:page;margin:0;padding:0}
 .print-view .tc-print-page:last-child{page-break-after:auto;break-after:auto}
 .print-view .tc-print-page img{width:100%;height:auto;max-height:97vh;object-fit:contain;page-break-inside:avoid}
 .print-view .tc-print-page figcaption{display:none}
 .print-view .tc-print-actions{display:none}
 .print-view .print-head{display:none}
}
/* Vehicle Learning Cards print view: landscape cards, two per sheet */
.tc-print-sheet{margin-top:14px;display:grid;gap:14px}
@media print{
 .print-view .tc-print-sheet{gap:10mm;page-break-after:always;break-after:page;margin:0}
 .print-view .tc-print-sheet:last-child{page-break-after:auto;break-after:auto}
 .print-view .tc-print-sheet .tc-print-page{page-break-after:auto;break-after:auto;page-break-inside:avoid}
 .print-view .tc-print-sheet .tc-print-page img{max-height:105mm;object-fit:contain}
}

/* ---- Circle Time: one moment at a time (hello-school) ---- */
.ct-wrap{max-width:880px;margin-inline:auto;padding-inline:20px}
.ct-runner{scroll-margin-top:24px}
.ct-runner .ct-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ct-dots{display:flex;justify-content:center;gap:9px;padding:4px 0 22px}
.ct-dots span{width:11px;height:11px;border:1.5px solid var(--ink);border-radius:50%;background:var(--white);transition:background .2s}
.ct-dots span.is-on{background:var(--ink)}
.ct-step{border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:30px 34px 34px;text-align:center;animation:ctIn .35s ease}
.ct-step:focus{outline:none}
.ct-step:focus-visible{outline:3px solid #81543e;outline-offset:5px}
.ct-step .eyebrow{margin-bottom:8px}
.ct-step h2{font-size:clamp(28px,4vw,38px);margin-bottom:14px}
@keyframes ctIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ct-scene{margin:0 0 20px;border:1.5px solid var(--line)}
.ct-scene img{width:100%;height:auto;display:block}
.ct-scene-small{max-width:520px;margin-inline:auto}
.ct-sayblock{max-width:560px;margin:0 auto 6px}
.ct-say{font-family:var(--serif);font-size:clamp(20px,3vw,25px);line-height:1.35;color:var(--ink)}
.ct-who{margin-top:8px;font-size:13.5px;color:var(--muted)}
.ct-lead{font-family:var(--serif);font-size:clamp(21px,3vw,26px);color:var(--ink);max-width:560px;margin:0 auto 18px}
.ct-big{font-family:var(--serif);font-size:clamp(30px,5.6vw,44px);line-height:1.15;color:var(--ink);max-width:640px;margin:6px auto 0}
.ct-big-say{font-size:clamp(24px,4vw,34px)}
.ct-hint{font-size:13px;margin-top:14px}
.ct-actions{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}
.ct-actions .button{min-height:52px;font-size:15px;padding-inline:26px}
.ct-rhythm{display:flex;justify-content:center;align-items:flex-end;gap:clamp(14px,4vw,30px);font-size:clamp(58px,13vw,96px);line-height:1;margin-top:6px;min-height:1.2em}
.ct-rhythm span{opacity:.25;transform:scale(.72)}
.ct-rhythm.is-playing span{animation:ctBeat .55s ease forwards}
.ct-rhythm.is-playing span:nth-child(2){animation-delay:.55s}
.ct-rhythm.is-playing span:nth-child(3){animation-delay:1.1s}
@keyframes ctBeat{0%{opacity:.25;transform:scale(.72)}55%{opacity:1;transform:scale(1.14)}100%{opacity:1;transform:scale(1)}}
.ct-rhythm:not(.is-playing) span{opacity:1;transform:none}
.ct-storynav{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:22px;flex-wrap:wrap}
.ct-storynav .button{min-height:44px}
.ct-complete{border-top:1.5px dashed var(--line);margin-top:26px;padding-top:24px}
.ct-stamp{display:inline-block;border:2px solid var(--ink);background:var(--sage);padding:9px 18px;font-weight:800;font-size:13px;letter-spacing:2px;text-transform:uppercase;transform:rotate(-2deg)}
.ct-complete .hero-actions{margin-top:20px;justify-content:center}
@media (max-width:640px){.ct-step{padding:22px 18px 26px}.ct-actions{gap:10px}.ct-actions .button{width:100%;max-width:340px}.ct-storynav .button{width:auto}}
@media (prefers-reduced-motion:reduce){.ct-step{animation:none}.ct-rhythm span{opacity:1;transform:none}.ct-rhythm.is-playing span{animation:none}}

/* ---- My Classroom ---- */
.mc-stage{position:relative;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14)}
.mc-stage>img{width:100%;height:auto;display:block}
.mc-hotspots{position:absolute;inset:0;pointer-events:none}
.mc-hot{pointer-events:auto;position:absolute;transform:translate(-50%,-50%);background:var(--white);border:1.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);padding:9px 15px;font-size:12.5px;font-weight:700;letter-spacing:.4px;text-decoration:none;white-space:nowrap;min-height:40px;display:inline-flex;align-items:center;transition:transform .15s}
.mc-hot:hover{transform:translate(-50%,-50%) translateY(-2px)}
.mc-hot-board{left:38%;top:13%}
.mc-hot-library{left:16%;top:35%}
.mc-hot-principal{left:80%;top:41%}
.mc-hot-door{left:auto;right:2%;top:9%;transform:translateY(-50%)}
.mc-hot-door:hover{transform:translateY(-50%) translateY(-2px)}
.mc-hot-rug{left:41%;top:81%;background:var(--sage)}
.mc-panel{border:1.5px solid var(--ink);border-top:0;background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:28px 34px 32px;scroll-margin-top:24px}
.mc-panel h2{font-size:clamp(30px,4vw,40px)}
.mc-panel p{max-width:60ch;margin-top:10px}
.mc-panel .hero-actions{margin-top:18px}
@media (max-width:719px){
 .mc-stage>img{border-bottom:1.5px solid var(--ink)}
 .mc-hotspots{position:static;pointer-events:auto;display:flex;flex-wrap:wrap;gap:10px;padding:16px;justify-content:center}
 .mc-hot,.mc-hot-door{position:static;transform:none}
 .mc-hot:hover{transform:translateY(-2px)}
}

/* ============================================================= MY WORK */
.mw-lede{font-size:clamp(22px,2.6vw,28px);color:var(--ink);margin-top:12px}
.mw-choices,.pp-choices{margin-top:26px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.mw-choice{display:flex;align-items:center;gap:18px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:20px 22px;text-decoration:none;transition:transform .15s,box-shadow .15s}
.mw-choice:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 rgba(52,59,48,.18)}
.mw-choice-copy{display:flex;flex-direction:column;gap:4px}
.mw-choice-copy strong{font-family:var(--serif);font-size:24px;font-weight:400;letter-spacing:-.4px}
.mw-choice-copy span{color:var(--muted);font-size:14.5px}
.mw-choice .fc-open{margin-left:auto;white-space:nowrap;font-size:13px;font-weight:700}
.mw-tile{flex:0 0 120px;background:var(--paper);border:1.5px solid var(--line);padding:8px;display:inline-flex;justify-content:center}
.mw-small{min-height:44px;padding:9px 16px;font-size:13px}
.mw-nojs{border:1.5px dashed var(--line);background:var(--white);padding:14px 18px;color:var(--muted)}
.mw-count,.pp-count{font-size:13px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-top:18px}
.mw-live{min-height:1.4em;font-size:clamp(18px,2.2vw,22px);color:var(--ink);font-weight:600}
.mw-cheer{font-family:var(--serif);font-size:clamp(30px,4vw,44px);letter-spacing:-1px;color:var(--ink)}
.mw-panel{margin-top:22px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:26px 28px}
.mw-panel p{margin-top:10px;max-width:60ch}
.mw-devicenote{margin-top:12px}
/* Draw & Scribble */
.mw-promptbar{display:flex;align-items:center;flex-wrap:wrap;gap:14px;border:1.5px solid var(--ink);background:var(--sage);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:16px 20px;margin-top:22px}
.mw-prompt-label{font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase}
.mw-prompt{font-family:var(--serif);font-size:clamp(24px,3vw,32px);letter-spacing:-.6px;color:var(--ink)}
.mw-promptbar .button{margin-top:0;margin-left:auto}
.mw-canvas-frame{position:relative;margin-top:18px;border:1.5px solid var(--ink);background:#fffdf5;box-shadow:5px 5px 0 rgba(52,59,48,.14);aspect-ratio:3/2;max-height:62vh;overflow:hidden}
@supports (aspect-ratio:3/2){.mw-canvas-frame{height:auto}}
.mw-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:crosshair;touch-action:none}
.mw-tools{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:18px}
.mw-colors{display:flex;gap:10px;flex-wrap:wrap}
.mw-color{width:58px;height:58px;border-radius:50%;border:2.5px solid var(--ink);background:var(--swatch);box-shadow:2.5px 2.5px 0 rgba(52,59,48,.25);display:inline-flex;align-items:center;justify-content:center;color:var(--ink);transition:transform .12s}
.mw-color:hover{transform:translateY(-2px)}
.mw-color.is-on{outline:3px solid #81543e;outline-offset:4px}
.mw-eraser{background:var(--white)}
.mw-edit{display:flex;gap:10px;margin-left:auto}
.mw-tool{min-width:58px;min-height:58px;border:1.5px solid var(--ink);background:var(--white);box-shadow:2.5px 2.5px 0 rgba(52,59,48,.2);display:inline-flex;align-items:center;justify-content:center;transition:transform .12s}
.mw-tool:hover{transform:translateY(-2px)}
.mw-donebar{margin-top:20px}
/* Trace & Follow */
.mw-trace-step h2{font-size:clamp(26px,3vw,34px)}
.mw-trace-frame{position:relative;margin-top:14px;border:1.5px solid var(--ink);background:#fffdf5;box-shadow:5px 5px 0 rgba(52,59,48,.14)}
.mw-trace-frame svg{display:block;width:100%;height:auto}
.mw-tracepath{fill:none;stroke:#a49f8d;stroke-width:13;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:.1 5.5}
.mw-trace-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}
.mw-trace-actions{display:flex;gap:14px;margin-top:16px;min-height:52px}
@media (max-width:640px){
 .mw-choice{flex-wrap:wrap}
 .mw-tile{flex:0 0 96px}
 .mw-tile svg{width:96px;height:auto}
 .mw-edit{margin-left:0}
 .mw-color{width:52px;height:52px}
 .mw-tool{min-width:52px;min-height:52px}
}

/* ================================================== PLAY & PRACTICE */
.pp-ask{font-family:var(--serif);font-size:clamp(26px,3.4vw,38px);letter-spacing:-.8px;color:var(--ink);margin-top:14px}
.pp-game{margin-top:8px}
.pp-round{margin-top:10px}
.pp-target{margin-top:16px;display:flex;justify-content:center}
.pp-card{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:10px;max-width:300px}
.pp-card img{width:100%;height:auto;display:block}
.pp-choices-row{margin-top:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start}
.pp-choice{border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.16);padding:10px;cursor:pointer;transition:transform .12s,box-shadow .12s;display:block}
.pp-choice img{width:100%;height:auto;display:block;pointer-events:none}
.pp-choice:hover{transform:translate(-2px,-2px)}
.pp-choice.is-found{outline:4px solid #4a7c3f;outline-offset:3px;background:var(--sage)}
.pp-choice:disabled{cursor:default}
.pp-choice:disabled:hover{transform:none}
.pp-next{min-height:56px;margin-top:18px}
.pp-zones{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pp-zone{border:2px dashed var(--ink);background:var(--white);padding:14px;display:flex;flex-direction:column;align-items:center;gap:10px;min-height:150px;cursor:pointer;transition:background .15s}
.pp-zone.is-target{background:var(--sage);border-style:solid}
.pp-zone.is-nudge{background:var(--rose)}
.pp-zone-thumb{margin:0;width:88px}
.pp-zone-thumb img{width:100%;height:auto;display:block}
.pp-zone-label{font-size:15px;font-weight:700;letter-spacing:.4px}
.pp-tray{margin-top:18px;border:1.5px solid var(--line);background:var(--white);padding:16px;display:flex;justify-content:center;min-height:190px;align-items:center}
.pp-item-slot{position:relative;display:flex;justify-content:center}
.pp-item{border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.16);padding:10px;cursor:grab;touch-action:none;max-width:230px;display:block}
.pp-item img{width:100%;height:auto;display:block;pointer-events:none}
.pp-item.is-picked{outline:3.5px solid #81543e;outline-offset:3px}
.pp-item.is-drag{cursor:grabbing;box-shadow:8px 8px 0 rgba(52,59,48,.2);z-index:5;position:relative}
@media (max-width:640px){
 .pp-choices-row{gap:10px}
 .pp-card{max-width:230px;padding:8px}
 .pp-choice{padding:7px}
 .pp-tray{min-height:170px;padding:12px}
 .pp-item{max-width:190px}
 .pp-zone{min-height:130px;padding:10px}
 .pp-zone-thumb{width:72px}
}

/* ====================================================== MY SCHOOL BAG */
.bag-area{margin-top:34px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:26px 28px 30px}
.bag-area h2{font-size:clamp(26px,3vw,34px)}
.bag-gallery{margin-top:16px}
.bag-empty{text-align:left;padding:8px 0}
.bag-empty-title{font-family:var(--serif);font-size:24px;letter-spacing:-.4px;color:var(--ink)}
.bag-empty .button{margin-top:16px}
.bag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px}
.bag-item{margin:0;border:1.5px solid var(--ink);background:var(--paper);padding:10px;display:flex;flex-direction:column;gap:8px}
.bag-item img{width:100%;height:auto;display:block;border:1px solid var(--line);background:#fff}
.bag-item figcaption{display:flex;flex-direction:column;gap:8px}
.bag-date{font-size:13px;font-weight:700;color:var(--muted)}
.bag-actions{display:flex;gap:8px;flex-wrap:wrap}
.bag-confirm{border:1.5px solid #81543e;background:var(--rose);padding:10px 12px}
.bag-confirm p{margin:0 0 8px;font-weight:700;color:var(--ink)}
.bag-openview{margin-top:18px;border:1.5px solid var(--ink);background:var(--paper);padding:16px}
.bag-openview img{max-width:100%;height:auto;border:1.5px solid var(--line);background:#fff}
.bag-printables{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.bag-print{display:flex;flex-direction:column;border:1.5px solid var(--ink);background:var(--paper);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:14px;text-decoration:none;transition:transform .15s}
.bag-print:hover{transform:translate(-2px,-2px)}
.bag-print .pp-card{max-width:170px;border-color:var(--line);box-shadow:none;padding:6px;margin:0 0 10px}
.bag-print .mw-choice-copy span{font-size:13.5px}
.bag-print .fc-open{margin-top:8px;font-size:13px;font-weight:700}

/* ==================================================== LEARNING LIBRARY */
.lib-ages{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:22px}
.lib-ages-label{font-size:13px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.lib-age{border:1.5px solid var(--ink);background:var(--white);padding:9px 15px;text-decoration:none;font-size:13.5px;font-weight:700;min-height:40px;display:inline-flex;align-items:center}
.lib-age.is-on{background:var(--sage)}
.lib-age:hover{transform:translateY(-2px)}
.lib-section{margin-top:36px}
.lib-section h2{font-size:clamp(26px,3.2vw,36px);padding-bottom:8px;border-bottom:1.5px solid var(--line)}
.lib-grid{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.lib-item{display:flex;align-items:center;gap:14px;border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.12);padding:12px 14px;text-decoration:none;transition:transform .15s}
.lib-item:hover{transform:translate(-2px,-2px)}
.lib-thumb{flex:0 0 64px;width:64px;height:80px;border:1px solid var(--line);background:var(--paper);overflow:hidden;display:flex;align-items:center;justify-content:center}
.lib-thumb img{width:100%;height:100%;object-fit:contain}
.lib-doodle{display:flex;align-items:center;justify-content:center}
.lib-doodle svg{width:56px;height:auto}
.lib-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.lib-copy strong{font-family:var(--serif);font-size:18.5px;font-weight:400;letter-spacing:-.2px}
.lib-kind{font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
.lib-item .fc-open{margin-left:auto;white-space:nowrap;font-size:12.5px}

/* ======================================================= OUR CLASSROOM */
.oc-grid{margin-top:26px;display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:16px}
.oc-rule{display:flex;align-items:center;gap:12px;border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.14);padding:14px 16px;cursor:pointer;text-align:left;transition:transform .15s}
.oc-rule:hover{transform:translate(-2px,-2px)}
.oc-rule-icon{flex:0 0 auto;display:inline-flex}
.oc-rule .mw-choice-copy strong{font-size:19px}
.oc-act{margin-top:30px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:26px 28px 30px}
.oc-act h2{font-size:clamp(28px,3.4vw,38px)}
.oc-ask{margin-top:8px;font-size:clamp(18px,2.2vw,22px);color:var(--ink)}
.oc-step,.oc-kindstep{margin-top:16px}
.oc-choices{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
.oc-choices .button{margin-top:0}
.oc-ball{display:block;margin:26px auto 6px;width:150px;height:150px;border-radius:50%;border:2.5px solid var(--ink);background:radial-gradient(circle at 34% 30%,#e46a4f,#c9452c 62%);box-shadow:0 7px 0 #8e3520,4px 4px 0 rgba(52,59,48,.2);cursor:pointer}
.oc-ball-inner{display:block;width:34%;height:34%;margin:18% 0 0 20%;border-radius:50%;background:#f4efe3;opacity:.75}
.oc-ball.is-bump{animation:oc-bump .45s ease}
@keyframes oc-bump{0%{transform:scale(1)}35%{transform:scale(1.07)}70%{transform:scale(.97)}100%{transform:scale(1)}}
.oc-turnsay{text-align:center;font-size:clamp(24px,3vw,32px);font-family:var(--serif);color:var(--ink);margin-top:8px}
.oc-teddy{display:block;margin:22px auto 8px;border:0;background:none;cursor:pointer;transition:transform .15s}
.oc-teddy:hover{transform:scale(1.02)}
.oc-teddy .oc-heart{opacity:0;transition:opacity .3s}
.oc-teddy.is-soothed .oc-heart{opacity:1}
.oc-teddy.is-soothed{transform:scale(1.03)}
.oc-room{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch}
.oc-boxzone{border:2.5px dashed var(--ink);background:var(--paper);display:flex;align-items:center;justify-content:center;min-height:210px;cursor:pointer;transition:background .15s}
.oc-boxzone.is-target{background:var(--sage);border-style:solid}
.oc-boxzone.is-nudge{background:var(--rose)}
.oc-boxlabel{font-size:15px;font-weight:700;letter-spacing:.4px;color:var(--muted)}
.oc-toys{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;min-height:210px;align-content:center}
.oc-toy{border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.16);padding:10px;cursor:grab;touch-action:none;transition:transform .12s}
.oc-toy.is-picked{outline:3.5px solid #81543e;outline-offset:3px}
.oc-toy.is-drag{cursor:grabbing;z-index:5;position:relative;box-shadow:7px 7px 0 rgba(52,59,48,.2)}
.oc-pattern{margin-top:18px;font-size:clamp(52px,8vw,84px);letter-spacing:12px;text-align:center;min-height:1.3em}
@media (max-width:640px){
 .oc-room{grid-template-columns:1fr}
 .oc-ball{width:120px;height:120px}
}
@media (prefers-reduced-motion:reduce){
 .oc-ball.is-bump{animation:none}
 .oc-teddy,.oc-teddy:hover,.mw-choice:hover,.pp-choice:hover,.lib-item:hover,.bag-print:hover,.oc-rule:hover{transition:none;transform:none}
}

/* ======================================================== LET'S EXPLORE */
.le-grid .le-mission{display:flex;align-items:center;gap:12px;border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.14);padding:14px 16px;text-decoration:none;transition:transform .15s}
.le-grid .le-mission:hover{transform:translate(-2px,-2px)}
.le-mission .mw-choice-copy strong{font-size:19px}
.le-mission .mw-choice-copy span{display:block;color:var(--muted);font-size:13.5px}
.le-view{margin-top:30px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:26px 28px 30px}
.le-view h2{font-size:clamp(28px,3.4vw,38px)}
.le-instruction{margin-top:10px;font-size:clamp(24px,3vw,34px);font-family:var(--serif);letter-spacing:-.6px;color:var(--ink)}
.le-instruction strong{color:#81543e}
.le-go{min-height:56px;margin-top:16px}
.le-away{margin-top:20px;text-align:center;border:1.5px solid var(--line);background:var(--paper);padding:26px 18px 22px}
.le-big{font-family:var(--serif);font-size:clamp(30px,4.4vw,48px);letter-spacing:-1px;color:var(--ink)}
.le-visual-art{margin-top:14px;width:180px;height:auto}
.le-away .ct-actions,.le-back .ct-actions{justify-content:center;margin-top:16px}
.le-back{margin-top:20px;border-top:1.5px solid var(--line);padding-top:14px}
.le-back .ct-big{text-align:center}
.le-back .fc-hint{text-align:center}

/* ===================================================== STICKY NOTE WALL */
.wall-board{margin-top:24px;border:1.5px solid var(--ink);background:var(--sage);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:22px 20px 30px;background-image:radial-gradient(#8e816414 .8px,transparent .8px);background-size:9px 9px}
.wall-examples-label{display:inline-block;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);background:var(--white);border:1px solid var(--line);padding:5px 10px}
.wall-notes{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:22px 18px}
.wall-note{position:relative;margin:0;padding:26px 18px 30px;box-shadow:2px 4px 7px rgba(52,59,48,.18);border-top:solid 7px rgba(52,59,48,.12);font-family:'Comic Sans MS','Segoe Print',var(--serif);font-size:16.5px;line-height:1.45;color:#3c3527;min-height:120px}
.wall-note::before{content:'';position:absolute;top:-9px;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;background:rgba(52,59,48,.22);box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.wall-text{display:block;overflow-wrap:anywhere}
.wall-note:nth-child(6n+1){background:#fdf3b4;transform:rotate(-1.6deg)}
.wall-note:nth-child(6n+2){background:#fbd9dd;transform:rotate(1.2deg);font-size:16px}
.wall-note:nth-child(6n+3){background:#d3e4f7;transform:rotate(-.8deg)}
.wall-note:nth-child(6n+4){background:#d9edd3;transform:rotate(1.7deg);font-size:17px}
.wall-note:nth-child(6n+5){background:#fde5cd;transform:rotate(-1.1deg)}
.wall-note:nth-child(6n+6){background:#efe6f7;transform:rotate(.9deg);font-size:16px}
.wall-formwrap{margin-top:34px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:26px 28px 30px;max-width:640px}
.wall-formwrap h2{font-size:clamp(26px,3vw,34px)}
.wall-form{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.wall-form label{font-weight:700;font-size:14.5px}
.wall-optional{color:var(--muted);font-weight:400}
.wall-form input[type=text],.wall-form textarea{border:1.5px solid var(--ink);background:var(--paper);padding:12px 14px;font:inherit;width:100%}
.wall-help{margin:0}
.wall-count{margin:0;text-align:right}
.wall-confirm{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:14px;color:var(--muted);margin-top:4px}
.wall-confirm input{width:22px;height:22px;margin-top:2px;flex:0 0 auto;accent-color:#4a7c3f}
.wall-form .button{align-self:flex-start;margin-top:8px}
@media (prefers-reduced-motion:reduce){
 .wall-note{transition:none}
}

/* New My Classroom hotspots: rules poster, notice wall, toy shelf, desk, backpack */
.mc-hot-rules{left:65%;top:22%}
.mc-hot-wall{left:80%;top:25%}
.mc-hot-shelf{left:69%;top:55%}
.mc-hot-desk{left:76%;top:78%}
.mc-hot-bag{left:93%;top:87%}

/* Main navigation: Parents dropdown (desktop + mobile), School Home active state */
.nav-parents{position:relative;display:inline-flex}
.nav-parents-btn{background:none;border:0;padding:0;display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:11.5px;font-weight:600;color:inherit;min-height:36px}
.nav-parents-btn svg{flex:0 0 auto;transition:transform .15s ease}
.nav-parents[data-open="true"] .nav-parents-btn svg{transform:rotate(180deg)}
.nav-parents[data-active="true"]>.nav-parents-btn,.nav-parents[data-open="true"]>.nav-parents-btn{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--yellow)}
.nav-parents-menu{position:absolute;top:calc(100% + 12px);right:0;min-width:215px;background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:8px;z-index:40}
.nav-parents-menu a{display:flex;align-items:center;min-height:40px;padding:8px 12px;font-size:12px;font-weight:600;text-decoration:none;white-space:nowrap}
.nav-parents-menu a:hover,.nav-parents-menu a[aria-current]{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--yellow)}
@media(max-width:950px){.nav-parents-btn{font-size:13px}}
@media(max-width:680px){
 .nav-parents{flex:1 1 100%;flex-direction:column;align-items:center;justify-content:center}
 .nav-parents-menu{position:static;min-width:0;width:100%;max-width:360px;box-shadow:none;margin-top:6px}
 .nav-parents-menu a{justify-content:center;min-height:48px}
}
@media(max-width:360px){.nav-parents-btn{font-size:12px}}
@media (prefers-reduced-motion:reduce){.nav-parents-btn svg{transition:none}}

.mc-panel+.mc-panel{border-top:1.5px dashed var(--line)}

/* ---- Art Wall: pinned-up classroom display (view only) ---- */
.aw-intro{max-width:640px;margin-top:12px}
.aw-wall{list-style:none;margin:30px 0 0;padding:16px 10px 6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:36px 26px;user-select:none;-webkit-user-select:none}
.aw-piece{margin:0;background:var(--white);border:1.5px solid var(--line);box-shadow:3px 6px 14px rgba(52,59,48,.16);padding:10px 10px 14px;transform:rotate(-1.5deg)}
.aw-piece:nth-child(3n+1){transform:rotate(-1.5deg)}
.aw-piece:nth-child(3n+2){transform:rotate(1.2deg)}
.aw-piece:nth-child(3n){transform:rotate(-.7deg)}
.aw-piece img{width:100%;height:auto;display:block;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.aw-note{margin-top:34px}
@media (max-width:640px){
 .aw-wall{grid-template-columns:1fr 1fr;gap:26px 16px;padding:12px 6px 2px}
 .aw-piece{padding:7px 7px 10px}
}
@media (max-width:380px){.aw-wall{grid-template-columns:1fr;max-width:340px;margin-inline:auto}}

/* My Classroom: two more hotspots, aligned to what the classroom picture
   already shows — the pinned-up drawings (the art wall) and the wall calendar. */
.mc-hot-calendar{left:85%;top:49%}

/* School Calendar (/school-calendar/): a gentle weekly rhythm. All dates are
   filled locally by calendar.js; without JS the rhythm rows still work. */
.sc-today{background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:30px 34px 34px}
.sc-today h2{font-size:clamp(30px,4vw,40px)}
.sc-date-line{font-family:var(--serif);font-size:21px;margin-top:8px;color:var(--ink)}
.sc-today-plain{margin-top:10px;max-width:60ch}
.sc-plan-line{margin-top:16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sc-plan-line .text-link{font-weight:700}
.sc-nearby{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.sc-near-chip{border:1.5px dashed var(--line);background:var(--paper);padding:9px 14px;font-size:13px;display:inline-flex;gap:8px;align-items:baseline}
.sc-near-chip strong{letter-spacing:.4px}
.sc-near-now{border:1.5px solid var(--ink);background:var(--sage)}
.sc-live{margin-top:12px;font-size:13px;min-height:1em}
.sc-week-lede{max-width:70ch;margin-top:10px}
.sc-weeknav{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:24px 0 2px}
.sc-weeklabel{font-family:var(--serif);font-size:19px;min-width:200px;text-align:center}
.sc-week{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:14px}
.sc-day{display:grid;grid-template-columns:190px minmax(0,1fr);gap:10px 26px;background:var(--white);border:1.5px solid var(--line);padding:18px 22px 20px}
.sc-day.is-today{border:1.5px solid var(--ink);background:var(--sage);box-shadow:4px 4px 0 rgba(52,59,48,.14)}
.sc-when{display:flex;flex-direction:column;gap:3px}
.sc-dayname{font-weight:900;font-size:17px;letter-spacing:.2px}
.sc-date{font-size:13px;color:var(--muted)}
.sc-theme{display:inline-block;width:max-content;font-size:10.5px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase;border:1.5px solid var(--ink);background:var(--yellow);padding:4px 9px}
.sc-day .sc-plan p{margin-top:9px;max-width:65ch}
.sc-day .text-link{display:inline-block;margin-top:9px;font-weight:700}
.sc-missed{margin-top:32px}
@media (max-width:700px){
 .sc-day{grid-template-columns:1fr;gap:7px;padding:16px 16px 18px}
 .sc-today{padding:24px 18px 28px}
 .sc-weeknav{gap:10px}
 .sc-weeknav .button{flex:1;min-width:0}
 .sc-weeklabel{min-width:0;flex-basis:100%;order:-1;text-align:left}
}

/* Principal's Office (/principals-office/): a grown-ups' note box. The form is
   honest about the fact that no backend exists — nothing is sent or stored. */
.po-room{display:grid;gap:26px}
.po-form{background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:30px 34px 34px}
.po-offline{border:1.5px dashed var(--ink);background:var(--paper);padding:14px 16px;font-size:14px;margin:0 0 24px}
.po-cats{border:0;padding:0;margin:0}
.po-cats legend{font-weight:900;font-size:14px;letter-spacing:.3px;padding:0}
.po-cat{display:inline-flex;align-items:center;gap:7px;margin:10px 16px 0 0}
.po-cat input{width:17px;height:17px;accent-color:#81543e;flex:none}
.po-cat label{font-size:14px;font-weight:700;cursor:pointer}
.po-field{display:grid;gap:8px;font-weight:900;font-size:14px;margin-top:20px}
.po-req,.po-opt{font-size:10px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted);font-family:Arial,Helvetica,sans-serif}
.po-field input,.po-field textarea{border:1.5px solid var(--line);background:var(--white);padding:12px 14px;font-size:16px;width:100%}
.po-field input::placeholder,.po-field textarea::placeholder{color:#9a9b8c}
.po-field textarea{resize:vertical;min-height:130px}
.po-privacy{margin:22px 0 0;font-size:14px;border-top:1.5px dashed var(--line);padding-top:16px}
.po-actions{margin-top:22px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.po-status{font-size:14px;font-weight:700;margin:0}
.po-rules{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:14px;max-width:820px}
.po-rules li{background:var(--white);border:1.5px solid var(--line);padding:16px 20px}
.po-rules li p{margin-top:6px}
@media (max-width:700px){
 .po-form{padding:22px 18px 28px}
 .po-actions .button{width:100%}
}

/* ---- Family feedback: four-reaction review + approved comments (cm-) ---- */
.cm .cm-reactions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 6px}
.cm-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 20px;border:1.5px solid var(--line,#d9d2c0);border-radius:14px;background:#fff;font:inherit;font-size:15px;cursor:pointer;min-width:118px;color:inherit;transition:transform .12s ease,border-color .12s ease}
.cm-btn .cm-emoji{font-size:28px;line-height:1}
.cm-btn:hover,.cm-btn:focus-visible{border-color:var(--sage,#5b7a63);outline:3px solid rgba(91,122,99,.35);outline-offset:2px}
.cm-btn[aria-pressed="true"]{border-color:var(--sage,#5b7a63);background:#eef3ee;transform:translateY(-2px)}
.cm-form{margin:16px 0 8px;padding:20px;border:1px solid var(--line,#d9d2c0);border-radius:14px;background:#fffdf7;max-width:620px}
.cm-form label{display:block;font-weight:600;margin:14px 0 6px}
.cm-form textarea,.cm-form input[type="text"]{width:100%;padding:10px 12px;border:1px solid var(--line,#d9d2c0);border-radius:10px;font:inherit;background:#fff}
.cm-optional{font-weight:400;font-style:italic;color:#6b6553;font-size:14px}
.cm-confirm{display:flex;gap:10px;align-items:flex-start;font-weight:400!important;font-size:15px;margin-top:16px}
.cm-confirm input{width:20px;height:20px;margin-top:2px;flex:none}
.cm-status{min-height:1.4em;font-style:italic;color:#4c5b3c}
.cm-form .button{margin-top:6px}
.cm-chosen{font-style:italic;color:#4c5b3c;margin:0 0 4px}
.cm-comments{margin-top:26px}
.cm-comments h3{margin-bottom:10px}
.cm-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.cm-comment{background:#fff;border:1px solid var(--line,#d9d2c0);border-radius:12px;padding:14px 18px}
.cm-comment .cm-who{font-size:14px;font-weight:700;color:#4c5b3c;margin:0}
.cm-comment .cm-text{margin:6px 0 0;overflow-wrap:anywhere}
.cm-family .cm-empty{font-style:italic;color:#6b6553}
/* honeypot fields are removed from view and from the tab order, but stay
   real inputs so naive bots still fill them */
.po-hp,.wall-hp,.aw-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
/* ---- Sticky Note Wall: approved family notes ---------------------------- */
.wall-note-family{background:#fff8e0}
.wall-note .wall-name{display:block;margin-top:6px;font-size:14px;color:#6b6553;font-style:italic}
/* ---- Art Wall: submission form + approved family artwork ---------------- */
.aw-form{margin:18px 0;padding:22px;border:1px solid var(--line,#d9d2c0);border-radius:14px;background:#fffdf7;max-width:620px}
.aw-form .aw-field{display:block;margin:14px 0}
.aw-form .aw-field input[type="text"]{display:block;width:100%;margin-top:6px;padding:10px 12px;border:1px solid var(--line,#d9d2c0);border-radius:10px;font:inherit;background:#fff}
.aw-form .aw-field input[type="file"]{display:block;margin-top:6px;font:inherit}
.aw-confirm{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin-top:16px}
.aw-confirm input{width:20px;height:20px;margin-top:2px;flex:none}
.aw-status{min-height:1.4em;font-style:italic;color:#4c5b3c}
.aw-piece-family .aw-family-meta{font-size:14px;color:#6b6553;font-style:italic;margin:8px 0 0;text-align:center}
@media (max-width:640px){
 .cm-btn{flex:1 1 40%;min-width:0}
 .cm-form,.aw-form{padding:16px}
}
/* =================================================== BOOK READER (library)
   A real interactive picture book: closed cover → two-page spreads with a
   gentle 3D page turn on wide screens; one page at a time on phones.
   The book is the visual focus — the chrome around it stays quiet. */
.bk-reader{margin-top:14px}
.bk-stage{position:relative;padding:18px 6px 26px;overflow:hidden}
.bk-book{position:relative;width:min(1080px,100%);margin-inline:auto;display:flex;perspective:2400px}
.bk-slot{position:relative;width:50%;background:var(--white)}
.bk-slot--left{border:1.5px solid var(--ink);border-right:0;border-radius:12px 0 0 12px;box-shadow:-6px 7px 0 rgba(52,59,48,.12)}
.bk-slot--right{border:1.5px solid var(--ink);border-left:0;border-radius:0 12px 12px 0;box-shadow:6px 7px 0 rgba(52,59,48,.12)}
.bk-book--closed .bk-slot--left{background:transparent;border-color:transparent;box-shadow:none}
.bk-desk{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.bk-desk-hint{font-size:13px;font-weight:600;letter-spacing:.4px;color:var(--muted);border:1.5px dashed var(--line);border-radius:999px;padding:10px 20px;background:transparent}
.bk-book::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:30px;transform:translateX(-50%);z-index:2;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(52,59,48,.13) 42%,rgba(52,59,48,.2) 50%,rgba(52,59,48,.13) 58%,transparent)}
.bk-book--closed::after{display:none}
.bk-page{position:relative;background:var(--white);overflow:hidden;border-radius:inherit}
.bk-page img{width:100%;height:auto;display:block}
.bk-pagetext{margin:0;padding:12px 20px 26px;font-family:var(--serif);font-size:clamp(17px,1.7vw,21px);color:var(--ink);min-height:2.9em}
.bk-prompt{margin:0;padding:10px 20px 0;font-size:12.5px;font-style:italic;color:var(--muted)}
.bk-prompt::before{content:'\2753\00a0';font-style:normal}
.bk-folio{position:absolute;right:14px;bottom:8px;font-size:10.5px;font-weight:700;letter-spacing:1px;color:var(--muted)}
.bk-page.bk-cover,.bk-page.bk-end{display:flex;flex-direction:column}
.bk-page.bk-cover img{min-height:100%;object-fit:cover}
.bk-inside{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:300px;height:100%;background:repeating-linear-gradient(-45deg,var(--sage) 0 14px,#e4ead6 14px 28px);text-align:center;padding:24px}
.bk-stamp{background:var(--white);border:1.5px solid var(--ink);border-radius:10px;box-shadow:3px 3px 0 rgba(52,59,48,.14);padding:18px 26px;max-width:34ch;transform:rotate(-1.5deg)}
.bk-stamp-name{display:block;font-weight:900;letter-spacing:2.2px;font-size:13px;margin-bottom:6px}
.bk-stamp p{font-size:14px;color:var(--muted);margin:0}
.bk-taphint{font-size:12px;color:var(--muted);letter-spacing:.3px;margin:0}
.bk-end{align-items:center;justify-content:center;text-align:center;gap:10px;min-height:300px;height:100%;padding:26px;background:var(--white)}
.bk-end-title{font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);color:var(--ink)}
.bk-end-sub{font-size:14px;color:var(--muted);max-width:38ch;margin:0 0 8px}
.bk-end-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.bk-leaf{position:absolute;top:0;bottom:0;left:50%;right:0;z-index:5;transform-origin:left center;transform-style:preserve-3d;transition:transform .85s cubic-bezier(.45,.05,.35,1)}
.bk-leaf[hidden]{display:none}
.bk-leafface{position:absolute;inset:0;overflow:hidden;background:var(--white);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.bk-leafface--front{border:1.5px solid var(--ink);border-left:0;border-radius:0 12px 12px 0;box-shadow:6px 7px 0 rgba(52,59,48,.12)}
.bk-leafface--back{transform:rotateY(180deg);border:1.5px solid var(--ink);border-right:0;border-radius:12px 0 0 12px;box-shadow:-6px 7px 0 rgba(52,59,48,.12)}
.bk-leafface .bk-page{min-height:100%}
.bk-leafface .bk-page img{min-height:calc(100% - 0px);object-fit:cover}
.bk-hit{position:absolute;top:0;bottom:0;width:27%;background:transparent;border:0;padding:0;z-index:6}
.bk-hit--prev{left:0}
.bk-hit--next{right:0}
.bk-hit:disabled{cursor:default;pointer-events:none}
.bk-hit:focus-visible{outline:3px solid #81543e;outline-offset:-4px;border-radius:12px}
.bk-bar{width:min(1080px,100%);margin:10px auto 0;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.bk-bar-main{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.bk-bar-extra{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.bk-small{min-height:40px;padding:8px 14px;font-size:12px;box-shadow:2px 2px 0 #c79a7a}
.bk-indicator{min-width:15ch;text-align:center;font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}
.bk-stage--single .bk-single{width:min(730px,100%);margin-inline:auto}
.bk-stage--single .bk-page{border:1.5px solid var(--ink);border-radius:12px;box-shadow:6px 7px 0 rgba(52,59,48,.12)}
.bk-stage--single .bk-page.bk-cover img,.bk-stage--single .bk-page.bk-end img{object-fit:cover}
.bk-stage--single .bk-page.bk-end,.bk-stage--single .bk-inside{min-height:0}
.bk-enter-next{animation:bkNext .24s ease-out}
.bk-enter-prev{animation:bkPrev .24s ease-out}
@keyframes bkNext{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes bkPrev{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
/* static pre-JS cover + no-JS story: same card language, zero layout shift */
.bk-covercard{width:min(730px,100%);margin:0 auto;border:1.5px solid var(--ink);border-radius:12px;background:var(--white);box-shadow:6px 7px 0 rgba(52,59,48,.12);overflow:hidden}
.bk-covercard img{width:100%;height:auto}
.bk-noscript{margin-top:8px}
.bk-noscript h2{margin-bottom:14px}
.bk-noscript-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.bk-noscript-grid figcaption{padding:10px 14px;font-size:14px;color:var(--muted)}
@media (max-width:859px){
 .bk-stage{padding:10px 2px 18px}
 .bk-pagetext{padding:10px 14px 22px;font-size:15.5px}
 .bk-prompt{padding:8px 14px 0;font-size:12px}
 .bk-bar{justify-content:center}
 .bk-bar-main{order:2;width:100%;justify-content:center}
 .bk-bar-extra{order:1;width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
 .bk-leaf{transition:none}
 .bk-enter-next,.bk-enter-prev{animation:none}
 .bk-page,.bk-leaf,.bk-leafface{transition:none}
}
/* landscape book cover inside the library's portrait thumbnail box */
.lib-thumb--book{flex:0 0 96px;width:96px;height:74px}
.lib-thumb--book img{width:100%;height:100%;object-fit:contain;background:#fff}


/* ===== Flashcards: set pages, card pages, reactions, reviews, comments ===== */
.fc2-h2{font-size:1.15rem;letter-spacing:.02em;margin:26px 0 4px;color:#4a4438}
/* .fc2-cover removed — the set cover was the library thumbnail shown twice
   (library wall, then again atop every set page) and landscape covers were
   cropped into a 1414/2000 portrait box. Set pages now open on the cards. */
.fc2-cards{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px}
.fc2-cardlink{display:flex;flex-direction:column;gap:0;background:#fff;border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 4px 14px rgba(63,52,32,.10);transition:transform .15s ease,box-shadow .15s ease;max-width:100%}
.fc2-cardlink:hover,.fc2-cardlink:focus-visible{transform:translateY(-3px);box-shadow:0 10px 24px rgba(63,52,32,.16)}
.fc2-cardimg{display:block}
/* Every card shows at its TRUE aspect ratio — landscape cards wide, portrait
   cards tall, nothing ever cropped. Tiles bottom-align into a card wall. */
.fc2-cardimg img{height:200px;width:auto;max-width:100%;object-fit:contain;display:block;margin:0 auto;background:#fff}
.fc2-cardword{display:flex;flex-direction:column;gap:2px;padding:10px 12px 12px}
.fc2-cardword strong{font-size:1rem}
.fc2-cardword span{font-size:.78rem;color:#8a8172}
.fc2-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.fc2-hero{max-width:560px;margin:0 0 16px}
.fc2-hero img{width:100%;height:auto;object-fit:contain;background:#fff;border-radius:14px;box-shadow:0 10px 30px rgba(63,52,32,.14)}
.fc2-hero figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:.9rem;color:#6b6353}
.fc2-do{background:#fff;border-radius:14px;padding:20px 22px;box-shadow:0 4px 14px rgba(63,52,32,.08);margin:0 0 14px}
.fc2-do h2{font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase;color:#b3552e;margin:0 0 8px}
.fc2-do p{margin:0}
.fc2-say{font-size:1.25rem;line-height:1.5;color:#3f3420}
.fc2-note{background:#f1ead9}
.fc2-note h2{color:#5c7a4d}
.fc2-lesson{margin:14px 0 0;font-size:.95rem;color:#6b6353}
.fc2-pn{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fc2-pn-btn{display:flex;flex-direction:column;gap:4px;padding:14px 16px;background:#fff;border-radius:14px;box-shadow:0 4px 14px rgba(63,52,32,.08);text-decoration:none;color:inherit}
.fc2-pn-next{text-align:right}
.fc2-pn-btn strong{font-size:1.05rem}
.fc2-pn-btn span:last-child{font-size:.78rem;color:#8a8172}
.fc2-pn-btn:hover,.fc2-pn-btn:focus-visible{box-shadow:0 10px 24px rgba(63,52,32,.16)}
.fc2-relrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.fc2-relcard{display:flex;flex-direction:column;gap:4px;background:#fff;border-radius:14px;padding:16px;text-decoration:none;color:inherit;box-shadow:0 4px 14px rgba(63,52,32,.08)}
.fc2-relcard span{font-size:.85rem;color:#8a8172}
.fc2-block{margin-top:34px;padding-top:22px;border-top:2px solid #e7dfcc}
.fc2-count{display:inline-block;min-width:1.4em;padding:0 6px;border-radius:999px;background:#f1ead9;color:#4a4438;font-size:.8rem;line-height:1.4}
.fc2-inline{margin:12px 0 0;color:#5c7a4d;font-size:.95rem}
.fc2-listwrap{margin:0 0 14px}
.fc2-stars{border:0;padding:0;margin:0 0 12px}
.fc2-stars legend{font-size:.95rem;padding:0}
.fc2-star-row{display:flex;gap:6px;flex-wrap:wrap}
.fc2-star{display:flex;align-items:center;gap:6px;padding:8px 12px;border:2px solid #e7dfcc;border-radius:12px;cursor:pointer;background:#fff}
.fc2-star input{accent-color:#b3552e}
.fc2-star .fc2-star-text{font-size:.85rem}
.fc2-star:has(input:checked){border-color:#b3552e;background:#fdf6ec}
.fc2-review-stars{color:#d99a2b;font-size:1.1rem;letter-spacing:.12em;margin:0}
@media (max-width:640px){.fc2-pn{grid-template-columns:1fr}.fc2-pn-next{text-align:left}}
/* ---- Card page: card left, downloads + share + community right ---- */
.fc2-dual{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:30px;align-items:start;margin-top:26px}
.fc2-main{min-width:0}
.fc2-main .fc2-hero{max-width:none}
.fc2-main .fc2-hero img{max-height:70vh;object-fit:contain}
.fc2-pn{margin:0 0 18px}
.fc2-learn{display:block}
.fc2-rail{min-width:0;font-size:.95rem}
.fc2-rail .fc2-block{margin-top:0;padding-top:0;border-top:0}
.fc2-rail .fc2-block+.fc2-block,.fc2-rail .fc2-share-block+.cm{margin-top:26px;padding-top:22px;border-top:2px solid #e7dfcc}
.fc2-rail .button{font-size:.9rem;padding:9px 14px}
.fc2-rail h2{font-size:1.15rem;margin:6px 0 10px}
.fc2-share{display:flex;flex-wrap:wrap;gap:8px}
.fc2-share-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1.5px solid var(--ink,#343b30);border-radius:999px;background:#fff;color:var(--ink,#343b30);font:inherit;font-size:.88rem;text-decoration:none;cursor:pointer}
.fc2-share-btn:hover,.fc2-share-btn:focus-visible{background:#fdf6ec;box-shadow:2px 2px 0 rgba(52,59,48,.18)}
@media (max-width:920px){.fc2-dual{grid-template-columns:1fr}.fc2-rail{font-size:1rem}}
@media (max-width:640px){.fc2-cardimg img{height:150px}}

/* ---- Alphabet class (Age 3): letter tiles, group chips, sound block ---- */
/* Big letter tiles: programmatic text buttons for find-the-letter and
   big-and-little play. Buttons are real <button>s; the "face" variant is a
   non-interactive span used for the prompt side of a round. */
button.tc-letter{display:inline-flex;align-items:center;justify-content:center;min-width:96px;min-height:96px;padding:6px 12px;border:2px solid var(--ink,#343b30);border-radius:10px;background:#fff;color:var(--ink,#343b30);font-family:inherit;font-size:44px;font-weight:800;line-height:1;cursor:pointer;box-shadow:3px 3px 0 rgba(52,59,48,.16);transition:transform .15s,box-shadow .15s}
button.tc-letter:hover,button.tc-letter:focus-visible{transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(52,59,48,.24)}
button.tc-letter-big{min-width:116px;min-height:116px;font-size:58px}
.tc-letter-face{display:inline-flex;align-items:center;justify-content:center;min-width:96px;min-height:96px;padding:6px 12px;border:2px dashed rgba(52,59,48,.55);border-radius:10px;background:#fff;font-size:44px;font-weight:800;line-height:1;color:var(--ink,#343b30)}
.tc-letter-face.tc-letter-big{min-width:116px;min-height:116px;font-size:58px}
.tc-target-letter{display:flex;align-items:center;justify-content:center;min-height:132px}
.tc-pair-arrow{align-self:center;font-size:26px;font-weight:800;color:rgba(52,59,48,.55);padding:0 2px}
/* Group chips under the letter-card viewer (revealed by alphabet-class.js). */
.lv-groups{display:none;flex-wrap:wrap;gap:10px;margin:20px 0 4px}
.lv-groups[data-ready="true"]{display:flex}
.lv-group-chip{border:2px solid var(--ink,#343b30);border-radius:999px;background:#fff;color:var(--ink,#343b30);padding:9px 18px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:transform .15s}
.lv-group-chip:hover,.lv-group-chip:focus-visible{transform:translate(-1px,-1px)}
.lv-group-chip.is-on{background:var(--ink,#343b30);color:#fff}
/* Letter-sound note on alphabet card pages. */
.fc2-sound{border-left:5px solid #a66446}
@media (max-width:700px){button.tc-letter,.tc-letter-face{min-width:80px;min-height:80px;font-size:36px}button.tc-letter-big,.tc-letter-face.tc-letter-big{min-width:92px;min-height:92px;font-size:46px}.tc-choices{gap:10px}}

/* ---- Age 3 Class 2 & 3: Numbers & Counting + Shapes & Patterns ---- */
/* Screen-reader-only helper (count-and-match dot groups). */
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap}
/* Count-and-match: dot groups are generated to be EXACTLY n dots, in tidy,
   uncrowded rows — the counting is always mathematically correct. */
.dots{display:inline-flex;flex-direction:column;gap:10px;padding:4px 0}
.dot-row{display:flex;gap:10px}
.dot{width:26px;height:26px;border-radius:50%;background:#e2495b;border:2px solid rgba(52,59,48,.85);box-shadow:inset -3px -3px 0 rgba(52,59,48,.14)}
.tc-target-dots{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
/* Number Order boards: tiles render in order without JS (a counting line);
   with JS they become real buttons, shuffle, and are tapped back into order. */
.ord-pool{display:flex;flex-wrap:wrap;gap:12px;align-items:center;min-height:92px}
.ord-tile{display:inline-flex;align-items:center;justify-content:center;min-width:84px;min-height:84px;padding:6px 10px;border:2px solid var(--ink,#343b30);border-radius:10px;background:#fff;color:var(--ink,#343b30);font-family:inherit;font-size:40px;font-weight:800;line-height:1;box-shadow:3px 3px 0 rgba(52,59,48,.16)}
button.ord-tile{cursor:pointer;transition:transform .15s,box-shadow .15s}
button.ord-tile:hover,button.ord-tile:focus-visible{transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(52,59,48,.24)}
button.ord-tile.is-picked{outline:3px solid #71326d;outline-offset:2px}
button.ord-tile:disabled{cursor:default}
.ord-status{margin-top:12px;font-weight:700}
.ord-status.is-good{color:#2e6b3f}
/* Programmatic shape tiles for Find the Shape / Match Shapes / patterns —
   drawn by the page itself, never dependent on an image asset. Flat, calm,
   no animation beyond the shared gentle hover. */
.shape-face{display:inline-block;width:56px;height:56px;flex:0 0 auto}
.sf-circle{border-radius:50%;background:#e2495b;border:3px solid var(--ink,#343b30)}
.sf-square{background:#f2c14e;border:3px solid var(--ink,#343b30)}
.sf-rectangle{width:84px;height:52px;background:#6aa84f;border:3px solid var(--ink,#343b30)}
.sf-oval{width:74px;height:52px;border-radius:50%;background:#9b59d0;border:3px solid var(--ink,#343b30)}
.sf-diamond{width:46px;height:46px;background:#2aa7a0;border:3px solid var(--ink,#343b30);transform:rotate(45deg)}
.sf-triangle,.sf-star,.sf-pentagon,.sf-hexagon,.sf-octagon{position:relative;border:0;background:var(--ink,#343b30)}
.sf-triangle{width:64px;height:56px;clip-path:polygon(50% 0%,100% 100%,0% 100%)}
.sf-triangle::before,.sf-star::before,.sf-pentagon::before,.sf-hexagon::before,.sf-octagon::before{content:'';position:absolute;inset:3px;background:#6aa84f}
.sf-triangle::before{clip-path:polygon(50% 0%,100% 100%,0% 100%);background:#6aa84f}
.sf-star{width:60px;height:58px;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.sf-star::before{clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:#f2b01e}
.sf-pentagon{width:60px;height:58px;clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%)}
.sf-pentagon::before{clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%);background:#e2607f}
.sf-hexagon{width:64px;height:58px;clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%)}
.sf-hexagon::before{clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);background:#2aa7a0}
.sf-octagon{width:62px;height:62px;clip-path:polygon(30% 0%,70% 0%,100% 30%,100% 70%,70% 100%,30% 100%,0% 70%,0% 30%)}
.sf-octagon::before{clip-path:polygon(30% 0%,70% 0%,100% 30%,100% 70%,70% 100%,30% 100%,0% 70%,0% 30%);background:#e2812e}
.sf-heart{position:relative;width:56px;height:50px}
.sf-heart::before,.sf-heart::after{content:'';position:absolute;top:0;width:28px;height:44px;border-radius:28px 28px 0 0;background:#d9455c}
.sf-heart::before{left:28px;transform:rotate(-45deg);transform-origin:0 100%}
.sf-heart::after{left:0;transform:rotate(45deg);transform-origin:100% 100%}
.sf-crescent{width:56px;height:56px;border-radius:50%;box-shadow:inset 16px 9px 0 0 #f2c14e}
/* Shape choices sit inside the shared .tc-choice buttons. */
.tc-choice.tc-shape{display:inline-flex;align-items:center;justify-content:center}
.tc-target-shape{display:flex;align-items:center;justify-content:center;min-height:132px}
/* Pattern rows: read the rhythm aloud, then tap what lands next. */
.pat-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:2px 0 16px}
.pat-row .shape-face{width:44px;height:44px}
.pat-row .sf-rectangle{width:66px;height:40px}
.pat-row .sf-oval{width:58px;height:40px}
.pat-row .sf-triangle,.pat-row .sf-pentagon,.pat-row .sf-hexagon,.pat-row .sf-star{width:50px;height:46px}
.pat-row .sf-octagon,.pat-row .sf-crescent{width:48px;height:48px}
.pat-row .sf-heart{width:46px;height:42px}
.pat-row .sf-heart::before,.pat-row .sf-heart::after{width:23px;height:36px;border-radius:23px 23px 0 0}
.pat-row .sf-heart::before{left:23px}
.pat-row .sf-diamond{width:36px;height:36px}
.pat-gap{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2.5px dashed rgba(52,59,48,.55);border-radius:8px;font-size:22px;font-weight:800;color:rgba(52,59,48,.6)}
@media (max-width:700px){
 .dot{width:22px;height:22px}.dots{gap:8px}.dot-row{gap:8px}
 .ord-tile{min-width:68px;min-height:68px;font-size:32px}
 .shape-face{width:46px;height:46px}
 .sf-rectangle{width:68px;height:42px}.sf-oval{width:60px;height:42px}
 .pat-gap{width:38px;height:38px}
}
@media (prefers-reduced-motion:reduce){button.ord-tile{transition:none}}

/* ---- Age 3 Class 4: Colors & Color Mixing ---- */
/* Color swatch tiles: programmatic paint-splash blobs. Pure CSS — the
   find-the-color game never depends on a picture that might not load. */
.color-face{display:inline-block;width:84px;height:84px;border-radius:46% 54% 52% 48%/50% 44% 56% 50%;box-shadow:inset -6px -8px 0 rgba(0,0,0,.14),0 3px 8px rgba(52,59,48,.18);border:2px solid rgba(52,59,48,.28)}
.color-face.is-target{width:96px;height:96px}
.cf-red{background:#d93a3a}.cf-blue{background:#2f6fd0}.cf-yellow{background:#f5c531}.cf-green{background:#4d9e3f}
.cf-orange{background:#f07f28}.cf-purple{background:#8f4fc0}.cf-pink{background:#f28ab8}.cf-brown{background:#8a5a33}
.cf-black{background:#2b2b2b}.cf-gray{background:#a9a9a9}
.cf-white{background:#fffdf5}
.cf-rainbow{background:linear-gradient(180deg,#e8483f 0%,#f4a12c 20%,#f5d327 40%,#5cb548 60%,#3b7fd4 80%,#8f4fc0 100%)}
button.tc-color{padding:10px}
button.tc-color .color-face{pointer-events:none}
/* The paint mixer: three stations. Without JS the results stay visible as
   a chart; with JS colors-class.js parks each result behind the button. */
.mix-board{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:6px 0 4px}
.mix-station{border:1.5px solid var(--ink);background:var(--white);padding:20px 18px;box-shadow:4px 4px 0 rgba(52,59,48,.14);display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.mix-drops{display:flex;align-items:center;gap:9px}
.mix-drop{width:52px;height:52px;border-radius:46% 54% 52% 48%/50% 44% 56% 50%;box-shadow:inset -4px -6px 0 rgba(0,0,0,.14);border:2px solid rgba(52,59,48,.28)}
.mix-result{transition:transform .25s ease,opacity .25s ease}
.mix-result.is-unknown{opacity:.18;transform:scale(.72);filter:grayscale(1)}
.mix-result.is-mixed{opacity:1;transform:scale(1.12)}
.mix-plus{font-size:24px;font-weight:800;color:rgba(52,59,48,.6)}
.mix-line{font-size:15px;color:var(--muted)}
.mix-line strong{color:var(--ink)}
@media (max-width:760px){.mix-board{grid-template-columns:1fr}}
/* Rainbow strip: an ordered legend without JS; tappable check-offs with it. */
.rb-strip{display:flex;flex-wrap:wrap;gap:12px;list-style:none;padding:0;margin:0 0 14px}
.rb-chip{display:flex;align-items:center;gap:9px;padding:10px 18px;border-radius:999px;border:2px solid rgba(52,59,48,.35);color:#fff;font-weight:800;text-shadow:0 1px 3px rgba(0,0,0,.5);box-shadow:3px 3px 0 rgba(52,59,48,.16);font-size:15px}
.rb-chip .rb-num{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.85);color:var(--ink);font-size:12px;text-shadow:none}
.rb-chip .rb-check{opacity:0;font-size:17px;transition:opacity .2s}
button.rb-chip{cursor:pointer;transition:transform .15s,box-shadow .15s;font-family:inherit}
button.rb-chip:hover,button.rb-chip:focus-visible{transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(52,59,48,.24)}
button.rb-chip.is-found .rb-check{opacity:1}
button.rb-chip.is-found{outline:3px solid #71326d;outline-offset:2px}
.rb-chip.cf-white .rb-name,.rb-chip.cf-yellow .rb-name{color:var(--ink);text-shadow:none}
@media (prefers-reduced-motion:reduce){.mix-result,.rb-check,button.rb-chip{transition:none}}
/* Color card pages: the splash and its picture side by side, both at the
   true 1414×2000 ratio — never cropped, stacking on small screens. */
.fc2-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:720px;margin:0 0 16px}
.fc2-pair .fc2-hero{margin:0}
.fc2-pair .fc2-hero img{width:100%;height:auto;object-fit:contain;background:#fff;border-radius:14px;box-shadow:0 10px 30px rgba(63,52,32,.14)}
@media (max-width:640px){.fc2-pair{grid-template-columns:1fr 1fr;gap:8px}.fc2-pair .fc2-hero figcaption{flex-direction:column;gap:2px;font-size:.78rem}}
@media (max-width:400px){.fc2-pair{grid-template-columns:1fr}}
/* Mixer drops share the swatch palette (md- prefix on mix stations). */
.md-red{background:#d93a3a}.md-blue{background:#2f6fd0}.md-yellow{background:#f5c531}.md-green{background:#4d9e3f}
.md-orange{background:#f07f28}.md-purple{background:#8f4fc0}.md-pink{background:#f28ab8}.md-brown{background:#8a5a33}
.md-black{background:#2b2b2b}.md-gray{background:#a9a9a9}.md-white{background:#fffdf5}
.mix-drop.md-white{box-shadow:inset -4px -6px 0 rgba(0,0,0,.08),0 0 0 2px rgba(52,59,48,.2)}

/* ---- Age 3 Class 5: Opposites & Comparing ---- */
/* Learn slides get a small word line under each card; the pair order means
   every opposite sits right beside its partner in the scroll grid. */
.lv-grid .lv-word{display:block;padding:8px 12px;font-weight:800;font-size:15px;border-top:1.5px solid rgba(52,59,48,.14)}
/* Match the opposite pairs: six cards on the left, their opposites
   deliberately unaligned on the right. Without JS this is an honest chart
   for pointing; with JS, opposites-class.js runs the tap-tap game. */
.match-board{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:8px 0 4px}
.match-col{border:1.5px solid var(--ink,#343b30);background:var(--white,#fff);padding:16px;box-shadow:4px 4px 0 rgba(52,59,48,.14)}
.match-col h3{margin:0 0 10px;font-size:16px}
.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
button.op-card{display:flex;flex-direction:column;align-items:center;gap:6px;border:1.5px solid var(--ink,#343b30);background:#fff;padding:8px;box-shadow:3px 3px 0 rgba(52,59,48,.16);cursor:pointer;font-family:inherit;transition:transform .15s,box-shadow .15s}
button.op-card img{width:100%;max-width:160px;height:auto;border-radius:6px;background:#fff}
button.op-card .op-word{font-weight:800;font-size:14px;color:var(--ink,#343b30)}
button.op-card:hover,button.op-card:focus-visible{transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(52,59,48,.24)}
button.op-card.is-picked{outline:3px solid #71326d;outline-offset:2px}
button.op-card.is-matched{opacity:.55;outline:3px solid #2e6b3f;outline-offset:2px;pointer-events:none}
.match-status{margin-top:12px;font-weight:700;min-height:1.4em}
/* Compare two pictures: the two choice cards render bigger than in the
   find-it rounds, because the whole point is seeing the size difference. */
.tc-round.tc-compare .tc-choices{gap:18px}
.tc-choice.tc-op img{width:210px;max-width:44vw}
@media (max-width:700px){
 .match-board{grid-template-columns:1fr}
 .tc-choice.tc-op img{width:150px}
}
@media (prefers-reduced-motion:reduce){button.op-card{transition:none}}

/* Choose Your Child's Age (homepage) */
.age-choose{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.age-card{display:flex;flex-direction:column;gap:6px;background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:20px 20px 18px;text-decoration:none}.age-card:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}.age-card h3{font-size:24px}.age-card p{font-size:14px;line-height:1.55}.age-when{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:#8e6080;font-weight:700}.age-card .fc-open{margin-top:auto;padding-top:10px;font-size:14px;font-weight:700;color:#b83079}@media(max-width:950px){.age-choose{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.age-choose{grid-template-columns:1fr}}
/* Animals & Their Sounds (Age 3, Class 6) */
.an-sound-board{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.an-sound-card{background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:14px;display:flex;flex-direction:column;gap:10px}
.an-sound-img{margin:0}
.an-sound-img img{width:100%;height:auto}
.an-play{display:flex;align-items:center;gap:10px;width:100%;background:#f9d2e8;border:2px solid var(--ink);border-radius:14px;padding:12px 14px;font-weight:700;font-size:15px;color:#602865;box-shadow:0 4px 0 #d592b8}
.an-play:hover{transform:translateY(-1px);box-shadow:0 5px 0 #d592b8}
.an-play:active{transform:translateY(3px);box-shadow:0 1px 0 #d592b8}
.an-play-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#602865;color:#f9d2e8;font-size:13px;flex:none}
.an-replay{display:block;font-size:11px;font-weight:500;color:#8e6080}
.an-play.is-playing .an-play-icon{animation:an-pulse .9s ease-in-out infinite}
@keyframes an-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@media(prefers-reduced-motion:reduce){.an-play.is-playing .an-play-icon{animation:none}}
.an-play-round{max-width:340px;margin-bottom:18px}
.an-play-card{max-width:340px;margin:10px 0 2px}
.an-wordcard{font-family:var(--serif);font-style:italic;font-size:clamp(24px,3vw,34px);color:#602865;padding:18px 10px;display:block;text-align:center}
@media(max-width:950px){.an-sound-board{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.an-sound-board{grid-template-columns:1fr}}

/* Fruits & Vegetables (Age 3, Class 8): word buckets for the sorting game
   and the color-row thumbs. Reuses .tc-choice/.tc-guide base styles. */
.fv-bucket{font-size:clamp(18px,3vw,24px);font-weight:800;color:var(--ink,#343b30);padding:10px 18px;min-width:140px}
.fv-thumb{display:block;width:86px;flex:none}
.fv-thumb img{width:100%;height:auto;border-radius:6px;display:block}
@media(max-width:640px){.fv-thumb{width:64px}.tc-guide-row{gap:12px}}

/* Animated doodle characters (school/animated-doodles on R2): small,
   in-flow greeting images. Animations start only when doodles.js marks the
   doodle .doodle-live (scroll into view); body.calm-mode (the parent
   toggle in the footer) and prefers-reduced-motion both stop everything.
   Doodles are normal flow images — they can never cover text or buttons. */
.doodle{display:block;width:clamp(64px,9vw,96px);height:auto;margin:6px auto 2px;border-radius:18px}
.doodle-pencil{transform-origin:50% 92%;margin-bottom:10px}
.doodle-star{margin-bottom:8px}
.doodle-book,.doodle-butterfly,.doodle-moon{margin-bottom:8px}
.doodle-rainbow{margin:0 auto 10px}
.doodle-live.doodle-pencil{animation:doodle-wave 2.4s ease-in-out infinite}
.doodle-live.doodle-star{animation:doodle-bounce 1.8s cubic-bezier(.34,1.56,.64,1) infinite}
.doodle-live.doodle-book{animation:doodle-wiggle 3.2s ease-in-out infinite}
.doodle-live.doodle-butterfly{animation:doodle-flutter 2.6s ease-in-out infinite}
.doodle-live.doodle-rainbow{animation:doodle-float 4.5s ease-in-out infinite}
.doodle-live.doodle-moon{animation:doodle-sway 5.5s ease-in-out infinite}
@keyframes doodle-wave{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(6deg)}}
@keyframes doodle-bounce{0%,100%{transform:translateY(0)}35%{transform:translateY(-8px)}70%{transform:translateY(-2px)}}
@keyframes doodle-wiggle{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
@keyframes doodle-flutter{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(3deg) translateY(-5px)}}
@keyframes doodle-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes doodle-sway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
body.calm-mode .doodle{animation:none!important;transform:none}
@media(prefers-reduced-motion:reduce){.doodle{animation:none!important;transform:none}}
.doodle-calm{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--ink,#343b30);border-radius:999px;background:var(--white,#fff);color:var(--ink,#343b30);font-family:inherit;font-size:12.5px;font-weight:700;padding:6px 13px;cursor:pointer;transition:transform .15s}
.doodle-calm:hover,.doodle-calm:focus-visible{transform:translate(-1px,-1px)}
.doodle-calm[aria-pressed="true"]{background:var(--ink,#343b30);color:#fff}

/* ---- Magic games (Age 3): Fruit Basket, Color Mixing, Animal Playground,
   Shape Builder. Server-rendered screens stay visible without JavaScript
   (the whole game reads as a scroll-through activity); with JavaScript,
   magic-*.js shows one screen at a time and wires the real interactions.
   No scores, no timers, no streaks anywhere. Animations are gentle and
   triple-gated: body.calm-mode (parent toggle in the footer) and
   prefers-reduced-motion both stop them, and JS never forces movement. */
.mg-game{margin-top:8px}
.mg-screens{margin-top:22px}
.mg-screen{margin-top:26px}
.mg-live{min-height:1.5em;font-size:clamp(18px,2.2vw,22px);font-weight:600;color:var(--ink)}
.mg-cover{margin:18px auto 0;max-width:420px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:14px;text-align:center}
.mg-cover img{width:100%;height:auto}
.mg-hint{font-size:14px;color:var(--muted)}
.mg-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:18px}
.mg-next{min-height:58px;margin-top:20px}
/* Big picture tiles: Meet the Fruits / Meet the Animals / find-choice grids */
.mg-tiles{margin-top:18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}
button.mg-tile{border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.16);padding:10px 10px 8px;cursor:pointer;font-family:inherit;display:block;width:100%;transition:transform .15s,box-shadow .15s}
button.mg-tile:hover,button.mg-tile:focus-visible{transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(52,59,48,.24)}
button.mg-tile img{width:100%;height:auto;pointer-events:none}
.mg-tile-word{display:block;margin-top:6px;font-weight:800;font-size:15px;color:var(--ink)}
.mg-tile-say{display:block;font-size:12.5px;font-weight:600;color:var(--muted)}
button.mg-tile.is-playing{outline:3px solid #71326d;outline-offset:2px}
.mg-note{margin-top:22px;border-left:4px solid #a9694e;background:var(--white);padding:13px 16px;font-size:14px;max-width:900px;color:var(--ink)}
/* ---- Magic Color Mixing (pure CSS/SVG, no image assets) ---- */
.mg-palette{margin-top:18px;display:flex;flex-wrap:wrap;gap:22px;justify-content:center}
button.mg-splash{width:112px;height:112px;border:0;background:none;padding:0;cursor:pointer;font-family:inherit;transition:transform .18s}
button.mg-splash:hover,button.mg-splash:focus-visible{transform:translateY(-4px) scale(1.04)}
button.mg-splash svg{width:100%;height:auto;display:block;pointer-events:none}
button.mg-splash .mg-blob{filter:drop-shadow(3px 4px 0 rgba(52,59,48,.18))}
button.mg-splash[aria-pressed="true"] svg{transform:scale(1.1)}
button.mg-splash[aria-pressed="true"] .mg-pick{opacity:1}
.mg-pick{opacity:0;font-size:30px;font-weight:800;fill:#343b30;transition:opacity .15s}
.mg-pot{margin:20px auto 0;max-width:380px;text-align:center;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:22px 18px}
.mg-pot-svg{width:100%;max-width:230px;height:auto;display:block;margin:0 auto}
.mg-drip{transform-origin:50% 20%}
.mg-mixing .mg-drip-a{animation:mg-drip-a 1.1s ease-in-out infinite}
.mg-mixing .mg-drip-b{animation:mg-drip-b 1.1s ease-in-out infinite}
@keyframes mg-drip-a{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(14px) scale(1.08)}}
@keyframes mg-drip-b{0%,100%{transform:translateY(0) scale(1.08)}50%{transform:translateY(14px) scale(1)}}
.mg-result-blob{transition:opacity .45s ease,transform .45s ease}
.mg-result-blob.is-waiting{opacity:.12;transform:scale(.7)}
.mg-result-name{min-height:1.5em;font-weight:800;font-size:clamp(20px,3vw,26px);color:var(--ink)}
.mg-recipe{display:flex;align-items:center;gap:10px;justify-content:center;font-weight:700;color:var(--ink)}
.mg-recipe .mg-mini{width:34px;height:34px;border-radius:46% 54% 52% 48%/50% 44% 56% 50%;box-shadow:inset -3px -5px 0 rgba(0,0,0,.14);border:2px solid rgba(52,59,48,.28)}
.mg-recipes{margin-top:18px;display:grid;gap:12px;max-width:420px;margin-inline:auto}
.mg-recipes li{list-style:none;border:1.5px solid var(--line);background:var(--white);padding:10px 14px}
/* ---- Magic Animal Playground ---- */
.mg-playground{margin-top:18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:18px}
button.mg-animal{border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.16);padding:12px;cursor:pointer;font-family:inherit;transition:transform .15s,box-shadow .15s}
button.mg-animal:hover,button.mg-animal:focus-visible{transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(52,59,48,.24)}
button.mg-animal img{width:100%;height:auto;pointer-events:none}
button.mg-animal .mg-tile-word{font-size:16px}
button.mg-animal.is-moving img{animation:var(--mgm) 1.1s ease-in-out}
.mgm-trot{--mgm:mgm-trot}.mgm-stretch{--mgm:mgm-stretch}.mgm-sway{--mgm:mgm-sway}.mgm-waddle{--mgm:mgm-waddle}.mgm-bounce{--mgm:mgm-bounce}.mgm-hop{--mgm:mgm-hop}
@keyframes mgm-trot{0%,100%{transform:none}25%{transform:translateY(-6px) rotate(-2deg)}60%{transform:translateY(-3px) rotate(2deg)}}
@keyframes mgm-stretch{0%,100%{transform:none}40%{transform:scaleX(1.06) scaleY(.96)}70%{transform:scaleX(.98) scaleY(1.03)}}
@keyframes mgm-sway{0%,100%{transform:rotate(0)}30%{transform:rotate(-4deg)}70%{transform:rotate(4deg)}}
@keyframes mgm-waddle{0%,100%{transform:rotate(0)}25%{transform:rotate(-6deg) translateY(-4px)}50%{transform:rotate(5deg)}75%{transform:rotate(-4deg) translateY(-4px)}}
@keyframes mgm-bounce{0%,100%{transform:none}30%{transform:translateY(-10px) scale(1.02)}60%{transform:translateY(-4px)}}
@keyframes mgm-hop{0%,100%{transform:none}35%{transform:translateY(-22px) scale(1.04)}70%{transform:translateY(-8px)}}
.mg-listen-btn{margin:0 0 4px}
button.mg-play-snd{display:inline-flex;align-items:center;gap:10px;border:2px solid var(--ink);background:#f9d2e8;border-radius:14px;padding:12px 16px;font-weight:800;font-size:15px;color:#602865;box-shadow:0 4px 0 #d592b8;cursor:pointer;font-family:inherit}
button.mg-play-snd:active{transform:translateY(3px);box-shadow:0 1px 0 #d592b8}
.mg-play-ic{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#602865;color:#f9d2e8;font-size:12px}
button.mg-play-snd.is-playing .mg-play-ic{animation:mg-pulse .9s ease-in-out infinite}
@keyframes mg-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}/* ---- Look & Draw — Magic Shapes: free drawing on a white canvas ---- */
.ld-layout{margin-top:18px;display:grid;gap:22px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start}
.ld-ref{border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:12px;text-align:center}
.ld-ref img{width:100%;height:auto;max-width:250px;margin:0 auto}
.ld-ref figcaption{font-size:13px;font-weight:700;color:var(--muted);margin-top:6px}
button.ld-how{margin-top:10px}
.ld-steps{text-align:left;margin:12px 0 0;padding-left:22px;font-size:15px;line-height:1.55;color:var(--ink)}
.ld-steps li{margin:4px 0}
.ld-playcol{min-width:0}
/* the canvas is always white, never overlaid: no absolutely positioned
   element may sit on top of it, and tools always flow BELOW it */
.ld-canvas-wrap{position:relative;border:2px solid var(--ink);background:#ffffff;box-shadow:5px 5px 0 rgba(52,59,48,.16);padding:8px;max-width:640px}
.ld-canvas-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:1/1;background:#ffffff;touch-action:none;cursor:crosshair}
.ld-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px;max-width:640px}
.ld-sep{width:2px;height:38px;background:var(--line);margin:0 4px}
.ld-color{position:relative;width:54px;height:54px;border-radius:50%;border:2.5px solid var(--ink);background:var(--lc);cursor:pointer;padding:0;transition:transform .12s}
.ld-color:hover,.ld-color:focus-visible{transform:scale(1.08)}
.ld-color[aria-pressed="true"]{transform:scale(1.14);box-shadow:0 0 0 3px var(--white),0 0 0 6px var(--ink)}
.ld-size{width:54px;height:54px;border-radius:50%;border:2px solid var(--ink);background:var(--white);cursor:pointer;display:grid;place-items:center;padding:0;transition:transform .12s}
.ld-size i{display:block;border-radius:50%;background:var(--ink)}
.ld-size i[data-ld-dot="1"]{width:7px;height:7px}
.ld-size i[data-ld-dot="2"]{width:16px;height:16px}
.ld-size i[data-ld-dot="3"]{width:28px;height:28px}
.ld-size:hover,.ld-size:focus-visible{transform:scale(1.08)}
.ld-size[aria-pressed="true"]{background:var(--yellow);transform:scale(1.12)}
button.ld-tool{height:54px;padding:0 18px;border:2px solid var(--ink);background:var(--white);border-radius:14px;font-weight:800;font-size:15px;font-family:inherit;color:var(--ink);cursor:pointer;box-shadow:3px 3px 0 rgba(52,59,48,.16);transition:transform .12s}
button.ld-tool:hover,button.ld-tool:focus-visible{transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(52,59,48,.24)}
button.ld-tool[aria-pressed="true"]{background:#71326d;color:#fff;border-color:#71326d}
.ld-status{margin-top:12px;font-weight:700;min-height:1.5em}
.ld-parent{margin-top:8px;font-size:15px;color:var(--ink);border-left:4px solid var(--yellow);padding-left:12px}
.ld-choose .ld-tile-sub{display:block;font-size:12.5px;font-weight:700;color:var(--muted);margin-top:2px}
/* grouped gallery: shelf lines + letterboxed tiles + overflow-crop windows
   for the files whose object is cut out of its raw square (banner-free) */
.ld-groupline{grid-column:1/-1;font-weight:800;font-size:19px;color:var(--ink);margin:10px 0 2px;padding-bottom:6px;border-bottom:2px dashed var(--line)}
.ld-tilebox{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1/1;background:var(--white)}
.ld-tilebox img{width:100%;height:auto;pointer-events:none}
.ld-crop{position:relative;display:block;overflow:hidden}
.ld-crop img{position:absolute;height:auto;max-width:none;display:block}
.ld-ref .ld-crop{width:100%;max-width:250px;margin:0 auto}
@media(max-width:860px){.ld-layout{grid-template-columns:1fr}.ld-canvas-wrap,.ld-tools{max-width:520px}}
/* ---- Magic games: calm + reduced-motion gates ---- */
body.calm-mode .mg-mixing .mg-drip-a,body.calm-mode .mg-mixing .mg-drip-b,body.calm-mode button.mg-animal.is-moving img{animation:none!important}
@media(prefers-reduced-motion:reduce){.mg-mixing .mg-drip-a,.mg-mixing .mg-drip-b,button.mg-animal.is-moving img{animation:none!important}button.mg-tile,button.mg-animal,button.mg-splash,button.ld-color,button.ld-size,button.ld-tool{transition:none}.mg-result-blob{transition:none}}
/* ---- Today's Class recommendation, child profiles & real progress ---- */
.tc-day-hint{margin-top:10px;font-size:13.5px;color:var(--muted)}
.tc-day-panel{margin-top:16px;border:1.5px solid var(--ink);background:var(--white);box-shadow:5px 5px 0 rgba(52,59,48,.14);padding:18px 20px}
.tc-day-lead{font-weight:600}
.tc-day-ages{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 4px}
button.tc-day-age{border:2px solid var(--ink);background:var(--white);border-radius:999px;padding:12px 18px;font-weight:800;font-size:15px;font-family:inherit;color:var(--ink);cursor:pointer}
button.tc-day-age:hover,button.tc-day-age:focus-visible{transform:translateY(-1px)}
button.tc-day-age.is-on{background:var(--yellow)}
.tc-day-classes{margin-top:14px;display:grid;gap:8px}
a.tc-day-class{display:flex;gap:10px;align-items:baseline;border:1.5px solid var(--line);background:var(--white);padding:11px 14px;text-decoration:none;color:var(--ink)}
a.tc-day-class:hover,a.tc-day-class:focus-visible{border-color:var(--ink);background:#fdfbf5}
a.tc-day-class.is-rec{border:2px solid #71326d;background:#faf6ff}
.tc-day-classnum{font-weight:800;font-size:13px;color:var(--muted);white-space:nowrap}
.tc-day-classname{font-weight:700}
.tc-day-classname em{font-style:normal;color:#71326d;font-weight:800}
.tc-day-done{color:#4a6b3f;font-weight:800;font-size:13px}
.tc-day-complete{margin-top:18px;border:2px dashed #4a6b3f;background:#f3f7ec;padding:16px 18px}
.tc-day-complete.is-done{border-style:solid}
.tc-day-complete p{margin:0 0 8px}
.mc-desk{border-width:2px}
.mc-desk h3{margin:0 0 6px;font-size:22px}
.tc-desk-line{margin:4px 0}
.tc-desk-big{margin:10px 0 2px;font-weight:600}
.tc-desk-class{font-size:19px;margin:2px 0 10px}
.tc-desk-progress{margin:10px 0 6px;font-weight:600}
.tc-desk-kids{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0 4px}
.tc-desk-label{font-weight:700;font-size:14px}
.tc-desk-kids select{font-family:inherit;font-size:15px;font-weight:600;padding:10px 12px;border:2px solid var(--ink);background:var(--white);border-radius:10px}
.tc-desk-kids button.text-link{cursor:pointer}
/* ---- Library: books-only bookshelf ---- */
.chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;margin-left:4px;border:1.5px solid var(--ink);border-radius:999px;background:var(--paper);font-size:11.5px;font-weight:800;color:var(--ink)}
.lib-age.is-on .chip-count{background:var(--white)}
.lib-blurb{margin-top:10px;font-size:15px}
.lib-shelf{padding-bottom:20px;border-bottom:8px solid #d9c19e;border-radius:0 0 14px 14px;background:linear-gradient(180deg,transparent 78%,rgba(217,193,158,.18) 100%)}
.bookshelf{margin-top:20px}
.bookcard{display:flex;flex-direction:column;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);overflow:hidden;transition:transform .15s}
.bookcard:hover{transform:translate(-2px,-2px)}
.bookcard-cover{display:block;border-bottom:1.5px solid var(--line);background:var(--paper)}
.bookcard-cover img{width:100%;height:auto}
.bookcard-body{display:flex;flex-direction:column;gap:9px;padding:14px 16px 18px;flex:1}
.lib-kind{font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#a9694e}
.bookcard-body h3{font-size:23px}
.bookcard-body h3 a{text-decoration:none}
.bookcard-body h3 a:hover{text-decoration:underline}
.bookcard-body>p{font-size:14.5px;flex:1}
.bookcard-pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;align-items:center;border:1.5px solid var(--line);background:var(--paper);padding:4px 11px;font-size:12px;font-weight:700;color:var(--muted)}
.bookcard-read{margin-top:4px;text-align:center}
.lib-empty{border:2px dashed var(--line);border-radius:14px;background:var(--white);padding:26px 22px;text-align:center}
.lib-empty p{max-width:46ch;margin-inline:auto}
.lib-empty p+p{margin-top:8px;font-size:14px}
.bk-premium-badge{display:inline-block;border:1.5px solid var(--ink);background:var(--yellow);box-shadow:3px 3px 0 rgba(52,59,48,.16);padding:10px 18px;font-weight:800;letter-spacing:.2px}
@media(max-width:680px){.lib-shelf{border-bottom-width:6px}.bookcard-body{padding:12px 13px 15px}.bookcard-body h3{font-size:20px}}
/* ---- Explore Our School (homepage locations) ---- */
.explore-grid{margin-top:22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.explore-card{display:flex;flex-direction:column;gap:9px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:20px 22px 22px;text-decoration:none;transition:transform .15s}
.explore-card:hover{transform:translate(-2px,-2px)}
.explore-eyebrow{font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#a1644a}
.explore-card h3{font-size:25px}
.explore-card p{font-size:14.5px;flex:1}
/* ---- How-to-draw tutorials (Activities → Drawing, reusable step viewer) ---- */
.dt-sub{font-size:19px;color:var(--ink);font-weight:700;margin-top:10px}
.dt-lede{max-width:62ch;margin-top:12px}
.dt{margin-top:20px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:22px 24px 26px}
.dt-topbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;min-height:26px}
.dt-count{font-weight:800;font-size:15px;letter-spacing:.4px;color:var(--ink);margin:0}
.dt-dots{display:flex;gap:7px}
.dt-dot{width:11px;height:11px;border:1.5px solid var(--ink);border-radius:50%;background:transparent}
.dt-dot.is-on{background:var(--rose)}
.dt-js .dt-step{display:none}
.dt-js .dt-step.is-current{display:block}
.dt-stage{margin-top:14px;border:1.5px solid var(--line);background:var(--paper);display:flex;justify-content:center;padding:16px}
.dt-stage img{width:auto;height:auto;max-width:100%;max-height:min(58vh,540px)}
.dt-say{margin-top:16px;display:block;font-size:17px;color:var(--ink)}
.dt-stepnum{display:inline-block;border:1.5px solid var(--ink);background:var(--yellow);padding:2px 10px;font-size:13px;font-weight:800;letter-spacing:.3px}
.dt-steptitle{display:block;margin-top:9px;font-family:var(--serif);font-size:27px;letter-spacing:-.2px;color:var(--ink)}
.dt-detail{display:block;margin-top:8px;font-size:19px;line-height:1.65;font-weight:600;max-width:62ch}
.dt-listen{margin-top:14px}
.dt-controls{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;margin-top:18px}
.dt-complete{margin-top:20px;border:2px dashed var(--line);border-radius:14px;background:var(--white);padding:20px 18px;text-align:center}
.dt-cheer{font-family:var(--serif);font-size:24px;color:var(--ink)}
.dt-hint{margin-top:18px;font-size:14px}
.dt-hint{color:var(--muted)}
.dt-back{margin-top:14px}
.dt-shelf{margin-bottom:26px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:20px 22px 22px}
.dt-shelf h2{font-size:clamp(24px,2.6vw,32px)}
.dt-shelf-head p{margin-top:8px;max-width:62ch}
.dt-shelf-grid{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.dt-card{display:flex;flex-direction:column;border:1.5px solid var(--line);background:var(--paper);text-decoration:none;transition:transform .15s}
.dt-card:hover{transform:translate(-2px,-2px)}
.dt-card-stage{display:flex;justify-content:center;background:var(--white);border-bottom:1.5px solid var(--line);padding:12px}
.dt-card-stage img{width:auto;height:auto;max-width:100%;max-height:210px}
.dt-card-copy{display:flex;flex-direction:column;gap:4px;padding:14px 16px 16px;font-size:15px;color:var(--muted)}
.dt-card-copy strong{font-family:var(--serif);font-weight:400;font-size:21px;color:var(--ink);letter-spacing:-.3px}
@media(max-width:680px){.dt{padding:16px 14px 20px}.dt-stage{padding:10px}.dt-stage img{max-height:54vh}.dt-controls{gap:10px}.dt-steptitle{font-size:24px}.dt-detail{font-size:18px}}
@media(prefers-reduced-motion:reduce){.dt-card{transition:none}}
/* Whole-school search results (/search/) */
.sr{margin-top:20px}
.sr-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:10px}
.sr-list a{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:baseline;border:1.5px solid var(--line);background:var(--white);padding:12px 14px;text-decoration:none;transition:transform .15s}
.sr-list a:hover{transform:translate(-2px,-2px)}
.sr-kind{grid-row:1/3;align-self:start;border:1.5px solid var(--ink);background:var(--yellow);padding:2px 8px;font-size:12px;font-weight:800;letter-spacing:.3px;white-space:nowrap;color:var(--ink)}
.sr-title{font-weight:800;font-size:17px;color:var(--ink)}
.sr-desc{grid-column:2;font-size:14px;line-height:1.55;color:var(--muted)}
@media(max-width:680px){.sr-list a{grid-template-columns:1fr}.sr-kind{grid-row:auto;justify-self:start}.sr-desc{grid-column:1}}
@media(prefers-reduced-motion:reduce){.sr-list a{transition:none}}

/* ============================ ALPHABET LEARNING CENTER ============================ */
/* Hub: card player + A-Z grid */
.al-center{margin-top:44px}
.al-viewer{margin-top:22px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:18px 20px 22px;max-width:760px}
.al-modes{display:flex;flex-wrap:wrap;gap:10px}
.al-mode{display:flex;flex-direction:column;gap:2px;align-items:flex-start;border:1.5px solid var(--ink);background:var(--paper);padding:9px 13px;font-size:12.5px;line-height:1.35;min-height:44px;text-align:left;transition:transform .15s,background .15s}
.al-mode strong{font-size:14px;color:var(--ink)}
.al-mode span{color:var(--muted)}
.al-mode.is-on{background:var(--yellow);transform:translate(-1px,-1px);box-shadow:2px 2px 0 rgba(52,59,48,.25)}
.al-card{margin:18px auto 0;border:1.5px solid var(--ink);background:var(--paper);box-shadow:4px 4px 0 rgba(52,59,48,.12);padding:14px;max-width:420px;text-align:center}
.al-card img{margin-inline:auto;max-height:52vh;width:auto}
.al-card figcaption{display:flex;flex-direction:column;gap:6px;margin-top:12px;align-items:center}
.al-card-kind{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);font-weight:700}
.al-card-word{font-family:var(--serif);font-size:30px;color:var(--ink);letter-spacing:-.5px}
.al-controls{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.al-controls .button{margin-top:0}
.al-count{font-size:14px;font-weight:700;color:var(--ink);min-width:150px;text-align:center}
.al-controls-row{margin-top:10px}
.al-grid{margin-top:26px}
.al-grid-title{font-size:clamp(24px,2.6vw,32px)}
.al-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:14px}
.al-grid .al-grid-title,.al-grid .fc-hint{grid-column:1/-1}
.al-tile{display:flex;flex-direction:column;border:1.5px solid var(--ink);background:var(--white);text-decoration:none;box-shadow:3px 3px 0 rgba(52,59,48,.14);transition:transform .15s}
.al-tile:hover{transform:translate(-2px,-2px)}
.al-tile-img{display:block;border-bottom:1.5px solid var(--line);background:var(--white);padding:8px}
.al-tile-img img{width:100%;height:auto}
.al-tile-word{display:flex;flex-direction:column;gap:1px;padding:9px 11px 11px}
.al-tile-word strong{font-family:var(--serif);font-size:19px;color:var(--ink)}
.al-tile-word span{font-size:12.5px;color:var(--muted)}
/* Letter page */
.al-letter-hero{margin-top:40px}
.al-meet-grid{margin-top:8px;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.al-face{margin:0;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12);display:flex;flex-direction:column}
.al-face img{width:100%;height:auto;border-bottom:1.5px solid var(--line);background:var(--paper)}
.al-face figcaption{display:flex;flex-direction:column;gap:6px;padding:13px 15px 16px}
.al-face .eyebrow{margin:0}
.al-face strong{font-family:var(--serif);font-size:23px;color:var(--ink)}
.al-face span:not(.eyebrow){font-size:14.5px;color:var(--muted);line-height:1.55}
.al-sound-grid{margin-top:10px;display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:20px;align-items:start}
.al-sound-say{font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);color:var(--ink);line-height:1.3;margin:0 0 12px}
/* Tracing */
.al-tracing .at-row{margin-top:14px;display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,420px));gap:18px;justify-content:center}
.at-block{border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12);padding:16px 18px 18px}
.at-block h4{margin:0;font-family:var(--serif);font-size:21px;color:var(--ink)}
.at-help{margin:7px 0 0;font-size:14.5px;color:var(--muted);line-height:1.55}
.at-stage{margin-top:12px;border:1.5px solid var(--line);background:var(--white);touch-action:none}
.at-svg{display:block;width:100%;height:auto}
.at-guides line{stroke:#e6dfcc;stroke-width:1.5;stroke-dasharray:4 5}
.at-guide{fill:none;stroke:#cfc8b6;stroke-width:14;stroke-linecap:round;stroke-linejoin:round;opacity:.6}
.at-current{stroke:#e3b8a4;opacity:.95}
.at-stroke-done{fill:none;stroke:#2f7d4f;stroke-width:14;stroke-linecap:round;stroke-linejoin:round}
.at-arrowline{stroke:#c9452c;stroke-width:2.5}
.at-arrow{fill:#c9452c}
.at-num{fill:#ffd23e;stroke:#343b30;stroke-width:1.5}
.at-num.at-cur{fill:#ffdf70}
.at-numtext{font-size:12.5px;font-weight:800;fill:#343b30}
.at-actions{margin-top:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.at-actions .button{margin-top:0}
.at-status{font-size:14px;font-weight:700;color:#71326d}
/* Activity steps reuse fc-steps */
.al-activity-steps{margin-top:14px}
/* Prev/next letter navigation */
.al-prevnext{margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.al-pn{display:flex;flex-direction:column;gap:3px;border:1.5px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 rgba(52,59,48,.14);padding:13px 16px;text-decoration:none;font-size:13.5px;color:var(--muted);transition:transform .15s}
.al-pn:hover{transform:translate(-2px,-2px)}
.al-pn strong{font-family:var(--serif);font-size:20px;color:var(--ink)}
.al-pn-next{text-align:right}
.al-backrow{margin-top:18px}
.al-backrow .button{margin-top:0}
/* Games */
.al-game{margin-top:40px}
.al-game .tc-game{margin-top:26px}
.tc-choice-pic{display:flex;flex-direction:column;align-items:center;gap:6px;padding:9px;min-width:120px}
.tc-choice-pic img{width:100%;max-width:150px;height:auto}
.tc-choice-pic span{font-size:13px;font-weight:700;color:var(--ink)}
.tc-choice-word{font-size:17px;font-weight:700;padding:14px 18px}
.gp-mystery{max-width:340px}
/* Matching game */
.amg-game{margin-top:22px;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.14);padding:18px 20px 22px;max-width:760px}
.amg-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.amg-count{font-size:14px;font-weight:800}
.amg-pairs{font-size:12.5px;font-weight:700;border:1.5px solid var(--ink);background:var(--yellow);padding:2px 10px}
.amg-board{margin-top:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}
.amg-card{border:1.5px solid var(--ink);background:var(--paper);padding:6px;box-shadow:3px 3px 0 rgba(52,59,48,.16);transition:transform .15s,box-shadow .15s;min-height:64px}
.amg-card img{width:100%;height:auto}
.amg-card.is-open{transform:translate(-2px,-2px);box-shadow:4px 4px 0 rgba(52,59,48,.28);background:var(--sage)}
.amg-card.is-matched{background:#e4f0e2;border-color:#2f7d4f;box-shadow:2px 2px 0 rgba(47,125,79,.35);transform:none}
.amg-card.is-no{animation:amg-shake .35s}
@keyframes amg-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media(prefers-reduced-motion:reduce){.amg-card.is-no{animation:none}.al-tile:hover,.al-pn:hover{transform:none}}
.amg-banner{margin:14px 0 0;font-size:16.5px;font-weight:700;color:#71326d;min-height:24px}
.amg-actions{margin-top:14px;display:flex;gap:12px;flex-wrap:wrap}
.amg-actions .button{margin-top:0}
/* Activities cupboard shelf */
.al-shelf-grid{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
/* A-B-C class intro */
.al-abc{margin-top:44px}
.al-abc-row{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.al-abc-card{display:flex;flex-direction:column;border:1.5px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 rgba(52,59,48,.12);text-decoration:none;transition:transform .15s}
.al-abc-card:hover{transform:translate(-2px,-2px)}
.al-abc-card img{width:100%;height:auto;border-bottom:1.5px solid var(--line)}
.al-abc-word{display:flex;flex-direction:column;gap:3px;padding:13px 15px 16px}
.al-abc-word strong{font-family:var(--serif);font-size:23px;color:var(--ink)}
.al-abc-word span{font-size:14px;color:var(--muted)}
.al-abc-say{font-style:italic}
.al-abc-actions{margin-top:18px}
.al-abc-actions .button{margin-top:0}
@media(max-width:680px){
 .al-card img{max-height:44vh}
 .al-sound-grid{grid-template-columns:1fr}
 .al-tracing .at-row{grid-template-columns:1fr}
 .al-prevnext{grid-template-columns:1fr}
 .al-pn-next{text-align:left}
 .al-mode{flex:1 1 40%}
 .amg-board{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}
}

/* ============ Shape Adventures (Class 25) · Colors & Creativity (Class 26) · Writing Adventures (Class 27) ============ */
.sa-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;padding-top:34px}.sa-hero-art img{width:100%;border:1.5px solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:#fff}
.sa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:26px}
.sa-card{position:relative;display:flex;flex-direction:column;background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);text-decoration:none;color:var(--ink);transition:transform .15s ease,box-shadow .15s ease}
.sa-card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.sa-card img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff;border-bottom:1.5px solid var(--ink)}
.sa-card-num{position:absolute;top:12px;left:12px;z-index:2;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700;font-size:15px}
.sa-card-done{position:absolute;top:12px;right:12px;z-index:2;background:#4a9e4f;color:#fff;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:5px 10px;border-radius:999px}
.sa-card-body{display:flex;flex-direction:column;gap:6px;padding:16px 18px 6px}
.sa-card-body strong{font-family:var(--serif);font-size:20px;letter-spacing:-.3px}
.sa-card-tag{font-size:13.5px;color:var(--muted);line-height:1.45}
.sa-card-skill{font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:#81543e;margin-top:2px}
.sa-card-play{margin:12px 18px 16px;align-self:flex-start;font-weight:700;font-size:14px;border-bottom:2.5px solid var(--ink);padding-bottom:2px}
.sa-card.is-done .sa-card-num{background:#4a9e4f}
.sa-card-slim img{aspect-ratio:2/1}
.sa-group-title{margin-top:44px;font-size:27px}.sa-group-blurb{margin-top:6px;max-width:720px}
.sa-board{margin-top:18px;background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:18px}
.sa-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px}
.sa-status{font-weight:700;color:var(--ink)}
.sa-controlbtns{display:flex;gap:10px}
.sa-progress-note{margin-top:10px;font-weight:600;color:var(--muted)}
.sa-svg,.cc-svg,.wa-svg{display:block;width:100%;height:auto;background:#fff;border:1.5px solid var(--line);touch-action:none}
.sa-slot{cursor:pointer}.sa-slot:hover .sa-slot-hole,.sa-slot:focus-visible .sa-slot-hole{filter:brightness(.96)}
.sa-slot.is-filled{cursor:default}
.sa-tray,.sa-items,.cc-tray{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;padding:16px 0 4px}
.sa-piece{--ps:76px;width:var(--ps);height:var(--ps);padding:6px;background:#fff;border:1.5px solid var(--ink);border-radius:14px;box-shadow:3px 3px 0 var(--ink);touch-action:none}
.sa-piece svg{width:100%;height:100%}
.sa-piece.is-selected{outline:3px solid #81543e;outline-offset:3px;transform:scale(1.06)}
.sa-piece.is-used{opacity:.25;pointer-events:none;box-shadow:none}
.sa-piece.is-lifted{opacity:.35}
.sa-ghost{position:fixed;z-index:60;pointer-events:none;transform:translate(-50%,-50%) scale(1.1)}
.sa-ask{font-weight:700;color:var(--ink);margin:4px 0 10px}
.sa-pat-round{border:1.5px dashed var(--line);border-radius:14px;padding:16px;margin-top:14px;background:#fffdf5}
.sa-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.sa-token,.sa-choice,.sa-gap{width:64px;height:64px;display:grid;place-items:center}
.sa-token svg,.sa-choice svg{width:56px;height:56px}
.sa-gap{border:2.5px dashed var(--muted);border-radius:12px;color:var(--muted);font-size:30px;font-weight:700;background:#fff}
.sa-gap.is-filled{border-style:solid;border-color:#4a9e4f}
.sa-choices{display:flex;flex-wrap:wrap;gap:14px}
.sa-choice{background:#fff;border:1.5px solid var(--ink);border-radius:14px;box-shadow:3px 3px 0 var(--ink)}
.sa-choice:disabled{opacity:.4;pointer-events:none}
.sa-bin{cursor:pointer}.sa-bin:hover{filter:brightness(1.03)}
.sa-round-note{font-weight:700;color:var(--ink);margin-top:8px}
.sa-parts{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-top:16px}
.sa-part{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--ink);border-radius:14px;padding:12px 8px;box-shadow:3px 3px 0 var(--ink)}
.sa-part svg{width:52px;height:52px}
.sa-part[aria-pressed="true"]{background:#eaf3ea;outline:2.5px solid #4a9e4f}
.sa-part-count{font-size:12px;color:var(--muted)}
.sa-done{margin-top:16px}
.sa-palette{display:flex;flex-wrap:wrap;gap:12px;padding:14px 0}
.sa-color{width:46px;height:46px;border-radius:50%;background:var(--pc);border:2.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
.sa-color.is-on,.sa-color[aria-pressed="true"]{outline:3px solid #81543e;outline-offset:3px}
.sa-spot{cursor:pointer}.sa-spot.is-selected circle{stroke:#81543e;stroke-width:7}
.sa-find{cursor:pointer}.sa-find:hover{filter:brightness(1.05)}
.sa-find.is-found{filter:none}.sa-find.is-found [data-find-label]{opacity:1}
.sa-find.is-found path,.sa-find.is-found circle,.sa-find.is-found rect,.sa-find.is-found ellipse{stroke:#4a9e4f}
.sa-find-round{margin-top:8px}
.sa-find-progress{font-weight:600;color:var(--muted)}
.sa-cheer{margin-top:16px;border:2px solid #4a9e4f;background:#eaf3ea;border-radius:16px;padding:22px;text-align:center}
.sa-cheer-title{font-family:var(--serif);font-size:26px;color:var(--ink)}
.sa-cheer-sub{margin-top:6px}
.sa-cheer.is-on{position:relative;overflow:hidden}
.sa-cheer.is-on::after{content:"";position:absolute;inset:-40% -10% auto;height:60%;background:radial-gradient(circle at 10% 40%,#f5c531 0 6px,transparent 7px),radial-gradient(circle at 30% 70%,#e04b3f 0 5px,transparent 6px),radial-gradient(circle at 55% 30%,#5aa7d6 0 6px,transparent 7px),radial-gradient(circle at 75% 60%,#8f4fc0 0 5px,transparent 6px),radial-gradient(circle at 92% 35%,#4a9e4f 0 6px,transparent 7px);animation:sa-confetti 1.6s ease-out forwards;pointer-events:none}
@keyframes sa-confetti{0%{transform:translateY(-30%) rotate(0);opacity:1}100%{transform:translateY(70%) rotate(160deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.sa-cheer.is-on::after{animation:none;opacity:0}}
.is-wiggle,.sa-wiggle{animation:sa-wiggle .5s ease}
@keyframes sa-wiggle{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}50%{transform:translateX(6px)}75%{transform:translateX(-4px)}}
.sa-prevnext{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
.sa-navcard{display:flex;flex-direction:column;gap:6px;background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:16px 18px;text-decoration:none;color:var(--ink)}
.sa-navcard strong{font-family:var(--serif);font-size:19px}
.is-launch .sa-svg{animation:sa-launch 1.2s ease .2s}
@keyframes sa-launch{0%,20%{transform:translateY(0)}45%{transform:translateY(-9px)}55%{transform:translateY(-6px)}80%,100%{transform:translateY(-14px)}}
@media (prefers-reduced-motion:reduce){.is-launch .sa-svg{animation:none}}
.is-open [data-sa-spot] circle{transition:r .5s ease}
.is-open [data-sa-spot] circle{r:34}
.is-complete .sa-svg{outline:3px solid #4a9e4f;outline-offset:4px}
/* ---- colors ---- */
.cc-board{margin-top:18px;background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:18px}
.cc-region{cursor:pointer;transition:filter .12s ease}
.cc-region:hover{filter:brightness(.95)}
.cc-tools{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.cc-palette{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cc-color{width:52px;height:52px;border-radius:50%;background:var(--pc);border:2.5px solid var(--ink);box-shadow:2.5px 2.5px 0 var(--ink);background-clip:padding-box}
.cc-color[aria-pressed="true"]{outline:3px solid #81543e;outline-offset:3px;transform:scale(1.07)}
.cc-patterns .cc-color{border-radius:12px}
.cc-toggle{border:1.5px solid var(--ink);background:#fff;padding:9px 16px;border-radius:999px;font-weight:700;box-shadow:2.5px 2.5px 0 var(--ink)}
.cc-toggle[aria-pressed="true"]{background:#3a3350;color:#fff}
.cc-toolbtns{display:flex;flex-wrap:wrap;gap:10px}
.cc-save-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:16px}
.cc-save-note{font-weight:600;color:var(--muted)}
.cc-gallery{margin-top:14px}
.cc-gallery-title{font-weight:700;color:var(--ink);margin-bottom:8px}
.cc-gallery-row{display:flex;flex-wrap:wrap;gap:14px}
.cc-gal-card{width:150px;border:1.5px solid var(--ink);background:#fff;padding:8px;display:flex;flex-direction:column;gap:8px}
.cc-gal-card img{width:100%;aspect-ratio:9/5.6;object-fit:contain;background:#fff}
.cc-gal-actions{display:flex;gap:6px}
.cc-gal-actions .button{font-size:12px;padding:6px 10px}
.cc-mix-ui{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.cc-mix-chosen{font-weight:700;color:var(--ink)}
.cc-mix-result{font-family:var(--serif);font-size:22px;color:var(--ink);min-height:32px}
.cc-recipes{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px}
.cc-recipe{display:flex;align-items:center;gap:8px;border:1.5px dashed var(--line);border-radius:12px;padding:10px 14px;background:#fffdf5;color:var(--ink);font-weight:700}
.cc-recipe.is-found{border-style:solid;border-color:#4a9e4f;background:#eaf3ea}
.cc-dot{width:30px;height:30px;border-radius:50%;background:var(--pc);border:2px solid var(--ink)}
.cc-dot-unknown{background:repeating-linear-gradient(45deg,#fff 0 5px,#d9d2e8 5px 10px)}
.cc-seq-ui{margin-top:14px;display:flex;flex-direction:column;gap:12px}
.cc-seq-ui strong{color:#81543e}
.cc-piece{width:70px;height:84px;padding:6px;background:#fff;border:1.5px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink);touch-action:none}
.cc-piece svg{width:100%;height:100%}
.cc-piece.is-selected{outline:3px solid #81543e;outline-offset:3px;transform:scale(1.05)}
.cc-piece.is-used{opacity:.25;pointer-events:none}
.cc-placed{cursor:pointer}
.cc-placed.is-selected{outline:3px dashed #81543e;outline-offset:4px}
.cc-placed.is-new{animation:cc-pop .4s ease}
@keyframes cc-pop{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1)}}
.cc-canvas-wrap{background:#fff;border:1.5px solid var(--line)}
.cc-canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}
.cc-modes,.cc-sizes{display:flex;gap:10px;align-items:center}
.cc-size{width:52px;height:52px;border-radius:12px;background:#fff;border:1.5px solid var(--ink);display:grid;place-items:center;box-shadow:2.5px 2.5px 0 var(--ink)}
.cc-size span{display:block;border-radius:50%;background:var(--ink)}
.cc-size[data-cc-size="1"] span{width:9px;height:9px}
.cc-size[data-cc-size="2"] span{width:17px;height:17px}
.cc-size[data-cc-size="3"] span{width:27px;height:27px}
.cc-size[data-wa-size="10"] span{width:9px;height:9px}
.cc-size[data-wa-size="18"] span{width:19px;height:19px}
.cc-size[aria-pressed="true"]{outline:3px solid #81543e;outline-offset:3px}
.cc-board.is-night .cc-region,.cc-board.is-night .cc-placed{filter:drop-shadow(0 0 7px rgba(255,244,200,.95))}
.cc-board.is-night svg{background:#2e2a52}
.cc-glowable svg{transition:background .5s ease}
/* ---- writing ---- */
.wa-board{margin-top:18px;background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:18px}
.wa-board.is-big{position:relative;z-index:30}
.wa-board.is-big .wa-svg{position:sticky;top:12px}
.wa-board.is-erasing .wa-svg{cursor:cell}
.wa-guide{transition:stroke .25s ease}
.wa-guide.is-done{stroke-dasharray:none!important}
.wa-start{pointer-events:none}
.wa-start.is-done{fill:#2e7d32}
.wa-goal{pointer-events:none}
.wa-dot{cursor:pointer}
.wa-dot.is-used circle{opacity:.45}
.wa-dot.is-wiggle{animation:sa-wiggle .5s ease}
.wa-tools{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.wa-stroke-row{display:flex;flex-wrap:wrap;gap:18px;margin-top:16px}
.wa-stroke{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px}
.wa-stroke svg{width:70px;height:58px}
.wa-stroke small{font-size:12px;color:var(--muted)}
.wa-shelf{margin-top:22px}
.wa-shelf h3{font-size:22px}
.wa-shelf-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.wa-shelf-links .lesson-pill-link{font-size:14px}
.is-oops .wa-svg{animation:sa-wiggle .45s ease}
.is-solved .wa-svg{outline:3px solid #4a9e4f;outline-offset:4px}
.sa-noscript{margin-top:12px;color:var(--muted)}
/* ---- my classroom: creations + adventure progress ---- */
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px;margin-top:14px}
.gal-card{border:1.5px solid var(--ink);background:#fff;padding:8px;display:flex;flex-direction:column;gap:8px}
.gal-card img{width:100%;aspect-ratio:9/5.6;object-fit:contain;background:#fff}
.gal-actions{display:flex;gap:6px}
.gal-actions .button{font-size:12px;padding:6px 10px}
.ap-row{margin-top:14px}
.ap-row-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.ap-count{font-size:13px;color:var(--muted);white-space:nowrap}
.ap-bar{height:14px;border:1.5px solid var(--ink);background:#fff;border-radius:999px;overflow:hidden;margin-top:6px}
.ap-bar span{display:block;height:100%;background:#4a9e4f;min-width:0}
.ap-who{margin-top:10px;font-weight:700;color:var(--ink)}
.ap-recent,.ap-line{margin-top:12px;font-size:14px}
/* ---- class page helpers ---- */
.tc-shape-row{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px}
.tc-shape-cell{display:flex;flex-direction:column;align-items:center;gap:8px}
.tc-shape-cell .shape-face{width:74px;height:74px}
.tc-shape-cell small{font-size:12px;color:var(--muted);text-transform:capitalize}
.cc-swatch-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:16px}
.cc-swatch{width:74px;height:74px;border-radius:14px;background:var(--pc);border:2px solid var(--ink);display:flex;align-items:flex-end;justify-content:center;padding-bottom:4px;box-shadow:3px 3px 0 var(--ink)}
.cc-swatch small{background:#fffdf5;border-radius:6px;padding:1px 7px;font-size:11px;font-weight:700}
.tc-choice-line strong{font-size:30px;font-family:var(--serif)}
.tc-choice-line small{display:block;font-size:12px;color:var(--muted)}
/* ---- responsive ---- */
@media (max-width:960px){.sa-hero{grid-template-columns:1fr;gap:24px}.sa-grid{grid-template-columns:repeat(2,1fr)}.sa-prevnext{grid-template-columns:1fr}}
@media (max-width:640px){.sa-grid{grid-template-columns:1fr;gap:20px}.sa-board,.cc-board,.wa-board{padding:12px}.sa-controls{flex-direction:column;align-items:flex-start}.sa-piece{--ps:64px}.sa-token,.sa-choice,.sa-gap{width:54px;height:54px}.cc-color{width:46px;height:46px}.cc-piece{width:62px;height:74px}.sa-prevnext{grid-template-columns:1fr}.cc-toolbtns .button{padding:10px 14px}}

/* ---- Worksheet Library (worksheets stay a separate resource type from flashcards) ---- */
.ws-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.ws-cat{background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:24px;display:flex;flex-direction:column;gap:12px;text-decoration:none}
.ws-cat:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.ws-cat-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ws-cat-head strong{font-family:var(--serif);font-size:22px;line-height:1.15}
.ws-cat-pill{display:inline-block;background:var(--tint,#f4efe3);color:var(--accent,#a9694e);border:1.5px solid currentColor;border-radius:999px;padding:3px 12px;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.ws-cat p{font-size:14px;margin:0}
.ws-count-note{font-size:12.5px;font-weight:700;color:var(--accent,#a9694e)}
.ws-cat-picks{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--muted)}
.ws-cat-picks span::before{content:"— "}
.ws-cat .fc-open{margin-top:auto}
.ws-hl{background:#fdf3d8;padding:0 4px}
.ws-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}
.ws-card{background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);text-decoration:none;display:flex;flex-direction:column;overflow:hidden}
.ws-card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.ws-card-art{display:block;aspect-ratio:4/3;overflow:hidden;background:#fff;border-bottom:1.5px solid var(--line)}
.ws-card-art img{width:100%;height:100%;object-fit:contain;display:block}
.ws-card-body{padding:16px 18px 6px;display:flex;flex-direction:column;gap:8px}
.ws-card-body strong{font-family:var(--serif);font-size:19px;line-height:1.2;color:var(--ink)}
.ws-card-meta{display:flex;gap:8px;flex-wrap:wrap}
.ws-card-meta span{background:var(--sage);border-radius:999px;padding:2px 10px;font-size:11px;font-weight:700;color:var(--ink)}
.ws-card-desc{font-size:13px;color:var(--muted);line-height:1.55}
.ws-card-open{margin-top:auto;padding:12px 18px;font-size:13px;font-weight:700;border-top:1.5px dashed var(--line)}
.ws-card:hover .ws-card-open{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--yellow)}
.ws-hero-art{max-width:none}
.ws-hero-art img{background:#fff;border:1.5px solid var(--line);border-radius:14px}
/* small collection-cover preview (CSP-safe — never size layout with inline style) */
.ws-cover-sm{max-width:300px;margin:0 auto 1.5rem}
.ws-cover-sm img{box-shadow:0 8px 22px rgba(63,52,32,.12)}
.ws-rail-sec{margin-top:34px;padding-top:22px;border-top:2px solid #e7dfcc}
.ws-rail-sec:first-child{margin-top:0;padding-top:0;border-top:0}
.ws-skills{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;padding:0;margin:16px 0 0;list-style:none}
.ws-skills li{background:var(--sage);border-radius:12px;padding:12px 16px;font-size:14px;color:var(--ink)}
.ws-tips{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:8px}
.ws-answers{background:#fff7ea;border:1.5px solid #e9d9a4;border-radius:14px;padding:16px 20px;margin-top:18px}
.ws-answers h3{font-size:16px;margin-bottom:6px}
.ws-answers p{font-size:14px;color:var(--muted);margin:0}
/* print: only the worksheet sheet, never the site chrome. The nuke-all
   approach is deliberate — hiding a list of selectors lets stray wrappers
   leak; hiding everything except the sheet cannot. */
@media (max-width:640px){.ws-grid{grid-template-columns:1fr}.ws-cats{grid-template-columns:1fr}}

/* ---- Phonics Adventures (Class 28) ---- */
.ph-board{background:var(--white)}
.ph-audio-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ph-progress{font-size:13px;color:var(--muted);min-height:20px}
.ph-svg{width:100%;height:auto;display:block}
.ph-card,.ph-tile,.ph-item,.ph-bin,.ph-counter{cursor:pointer}
.ph-card:hover rect,.ph-tile:hover rect,.ph-item:hover rect,.ph-counter:hover rect{stroke-width:5.5}
.ph-held rect{stroke:#8f4fc0!important;stroke-width:6!important}
.ph-held{filter:brightness(1.05)}
.ph-found rect,.ph-won rect{stroke:#4a9e4f!important}
.ph-found,.ph-won{opacity:.85}
.ph-gone{opacity:.25;pointer-events:none}
.ph-miss{animation:ph-shake .5s ease}
@keyframes ph-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@media (prefers-reduced-motion:reduce){.ph-miss{animation:none}}
body.calm-mode .ph-miss{animation:none}
.sa-cheer{background:#eef4e6;border:1.5px solid var(--ink);border-radius:16px;padding:22px;text-align:center;margin-top:16px}
.sa-cheer-title{font-family:var(--serif);font-size:26px;color:var(--ink)}
.sa-cheer-sub{font-size:14px;color:var(--muted);margin:6px 0 0}
.tool-btn[aria-pressed="true"]{background:#fdeeee;border-color:#e04b3f}
/* the hidden attribute has no effect on SVG elements — round switching relies on this rule */
.ph-svg [hidden]{display:none}

/* ---------- Story & Logic Adventures (Classes 29–30) ---------- */
.st-board .st-steps{display:block}
.st-step[hidden]{display:none}
.st-ctxrow{margin:0 0 14px;display:flex;justify-content:center}
.st-ctx{display:block;border-radius:14px;overflow:hidden;box-shadow:var(--shadow,0 2px 10px rgba(40,40,30,.08));max-width:640px;width:100%}
.st-ctx .st-card-img{position:static;display:block;width:100%;padding-top:0;height:auto;aspect-ratio:var(--ar);background-size:var(--bsx) var(--bsy);background-position:var(--bpx) var(--bpy)}
.st-ask{font-size:1.25rem;font-weight:700;margin:4px 0 16px;text-align:center;line-height:1.35}
/* spot-the-difference (find steps): two scenes, tap the differences */
.st-finds{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:900px;margin:0 auto}
.st-scene{margin:0;position:relative}
.st-scene-img{display:block;width:100%;aspect-ratio:var(--ar);background-image:var(--st-src);background-size:var(--bsx) var(--bsy);background-position:var(--bpx) var(--bpy);background-repeat:no-repeat;border-radius:14px;box-shadow:var(--shadow,0 2px 10px rgba(40,40,30,.08));position:relative;overflow:hidden}
.st-scene figcaption{text-align:center;font-weight:600;font-size:.92rem;color:#626456;margin-top:6px}
.st-hot{position:absolute;left:var(--hx);top:var(--hy);width:var(--hw);height:var(--hh);margin:0;padding:0;background:transparent;border:0;cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent}
.st-hot:focus-visible{outline:3px solid #f2a13c;outline-offset:2px}
.st-ring{position:absolute;inset:6%;border:4px dashed transparent;border-radius:50%;pointer-events:none;transition:border-color .2s ease}
.st-hot.st-found .st-ring{border-color:#4a9e4f;background:rgba(74,158,79,.12)}
.st-hot.st-found{cursor:default}
.st-findcount{text-align:center;font-weight:700;font-size:1.05rem;margin:10px 0 0}
@media (max-width:640px){.st-finds{grid-template-columns:1fr}}
/* multi-select + sorting bins (science steps) */
.st-bins{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:16px}
.st-bin{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;border:3px dashed #b9c9a5;border-radius:16px;background:#faf6ec;cursor:pointer;min-width:190px;min-height:120px;transition:border-color .15s ease,background .15s ease}
.st-bin:hover,.st-bin:focus-visible{border-color:#4a9e4f;outline:none;background:#f2f7ec}
.st-bin-img{display:block;width:100%;max-width:200px;aspect-ratio:var(--ar);background-image:var(--st-src);background-size:var(--bsx) var(--bsy);background-position:var(--bpx) var(--bpy);background-repeat:no-repeat}
.st-bin-label{font-weight:800;color:#3f6c33;font-size:1rem}
.st-bin .st-card{max-width:96px}
.st-bin .st-card .st-badge{top:-6px;right:-6px;left:auto}
.st-sorttray{min-height:70px;padding:10px;border-radius:14px;background:#faf6ec}
.st-tray [data-st-card].st-picked{border-color:#f2a13c;box-shadow:0 0 0 4px #fde4c3}
.st-tray{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:flex-start}
.st-trays{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.st-trays .st-tray{padding:12px;border-radius:14px;background:#faf6ec}
.st-card{position:relative;border:3px solid #e5ddc9;border-radius:16px;background:#fff;padding:0;cursor:pointer;overflow:hidden;max-width:230px;width:100%;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.st-card:hover,.st-card:focus-visible{transform:translateY(-3px);border-color:#f2a13c;box-shadow:0 6px 16px rgba(40,40,30,.14);outline:none}
.st-card-img{display:block;width:100%;aspect-ratio:var(--ar);background-image:var(--st-src);background-size:var(--bsx) var(--bsy);background-position:var(--bpx) var(--bpy);background-repeat:no-repeat}
.st-badge{position:absolute;top:8px;left:8px;min-width:34px;height:34px;border-radius:50%;background:#4a9e4f;color:#fff;font-weight:800;font-size:1.05rem;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.st-card.st-picked{border-color:#f2a13c;box-shadow:0 0 0 4px #fde4c3}
.st-card.st-locked{border-color:#4a9e4f;cursor:default}
.st-card.st-locked::after{content:"✓";position:absolute;right:8px;bottom:8px;width:28px;height:28px;border-radius:50%;background:#4a9e4f;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
.st-card.st-miss{animation:st-shake .5s ease;border-color:#d9534f}
@keyframes st-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.st-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-top:16px}
.st-hint{font-weight:600;color:#a9694e;min-height:1.4em}
/* the traceable acorn maze */
.lz-svg{display:block;width:100%;max-width:640px;margin:0 auto;touch-action:none;border-radius:18px}
.lz-trail{pointer-events:none}
@media (max-width:640px){
 .st-trays{grid-template-columns:1fr}
 .st-card{max-width:180px}
 .st-ask{font-size:1.05rem}
}

/* ---- Kiddo Purple Academy brand layer ---- */
h1,h2,h3{color:var(--kiddo-purple)}
h1 em,h2 em{color:#7b4b99}
.brand{color:var(--kiddo-purple)}
.brand span{color:#745b87}
/* header: white, thin bottom border, purple brand, clear hover */
.site-header{background:transparent;border:0;border-bottom:1.5px solid #e9e1f0;box-shadow:none;border-radius:0}
.site-header nav a{color:var(--kiddo-text)}
.site-header nav a:hover,.site-header nav a[aria-current]{text-decoration-color:var(--kiddo-purple);text-decoration-thickness:2.5px}
.nav-parents-btn{color:var(--kiddo-text)}
/* rounded primary CTA: deep purple, white text, peach offset */
.button{background:var(--kiddo-purple);border-color:var(--kiddo-purple);color:#ffffff;border-radius:12px;box-shadow:3px 3px 0 var(--kiddo-peach)}
.button:hover{background:#6a3d84;border-color:#6a3d84}
.button-ghost{background:#ffffff;color:var(--kiddo-purple);border-radius:12px;box-shadow:3px 3px 0 var(--kiddo-lavender);border-color:#d9cbe8}
.text-link{color:var(--kiddo-purple)}
/* brand artwork: two-column section, real proportions, never cropped */
.brand-duo{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.brand-duo>.brand-copy h2{margin-bottom:14px}
.brand-art{background:transparent}
.brand-art img{width:100%;height:auto;object-fit:contain;mix-blend-mode:multiply}
.brand-art img[data-eager]{fetchpriority:high}
.brand-points{list-style:none;margin:18px 0 0;padding:0}
.brand-points li{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px;color:var(--kiddo-text)}
.brand-points li::before{content:'';flex:0 0 12px;height:12px;margin-top:6px;border-radius:50%;background:var(--kiddo-peach)}
.brand-points li:nth-child(2)::before{background:var(--kiddo-cream-yellow)}
.badge-dot{display:inline-block;background:var(--kiddo-lavender);color:var(--kiddo-purple);border-radius:999px;padding:3px 12px;font-size:12px;font-weight:700}
@media(max-width:820px){.brand-duo{grid-template-columns:1fr;gap:22px}}
/* worksheets hub subject thumbnails */
.ws-cat-head img{width:54px;height:54px;object-fit:contain;flex:0 0 54px}
.ws-cat-head{align-items:center}
/* age 4 hub class thumbs */
.fc-stage>img.stage-thumb{width:64px;height:64px;object-fit:contain;margin-bottom:10px}
@media(prefers-reduced-motion:no-preference){.brand-art img{transition:opacity .2s}}

/* ---- whole-school search hero (/search/) ---- */
.search-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,240px);gap:26px;align-items:center}
.search-hero-form{display:flex;gap:12px;align-items:stretch}
.search-hero-box{flex:1;display:flex;align-items:center;gap:12px;background:#fff;border:2px solid var(--ink);border-radius:16px;padding:14px 18px;box-shadow:4px 4px 0 rgba(52,59,48,.14)}
.search-hero-box svg{flex-shrink:0}
.search-hero-box input{border:0;outline:0;background:transparent;font:inherit;font-size:1.05rem;width:100%;min-width:0}
.search-hero-form .button{border-radius:16px;box-shadow:4px 4px 0 rgba(52,59,48,.14)}
.sr-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.search-hero-art img{width:100%;height:auto;display:block}
.search-ideas{margin-top:20px}
.search-idea-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.search-idea{border:1.5px solid var(--ink);background:#fff;border-radius:999px;padding:9px 16px;font:inherit;font-size:.92rem;font-weight:600;color:var(--ink);cursor:pointer;min-height:44px}
.search-idea:hover,.search-idea:focus-visible{background:var(--lav,#eee6f2);box-shadow:3px 3px 0 rgba(52,59,48,.16)}
.sr-empty{margin-top:18px}
.sr-empty h2{margin:6px 0 8px}
.sr-empty[hidden]{display:none}
@media (max-width:680px){.search-hero-grid{grid-template-columns:1fr}.search-hero-art{max-width:190px;margin:0 auto}.search-hero-form{flex-direction:column}.search-hero-form .button{width:100%}}
.brand-art-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.brand-art-pair img{width:100%;height:auto}

/* ---- Flashcards hub: stage-organised grid (Newborn → Preschool) ---- */
.fc2-h2{margin-top:34px}
.fc-stagegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.fc-stage-link{max-width:1160px;margin:0 auto;padding:0 40px;color:#626456;font-size:.95rem}
.fc-stage-link a{font-weight:600}
@media (max-width:680px){.fc-stagegrid{grid-template-columns:1fr}.fc-stage-link{padding:0 20px}}

/* ---- Alphabet letter-set pages (uppercase / lowercase / pairs / objects /
       sounds / tracing): a wall of cards where the WHOLE card is one tap
       target that opens the card's own page — no buttons in the grid. The
       download, print and share buttons live on each card's own page. ---- */
.fcv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.fcv-card{display:flex;flex-direction:column;gap:10px;margin:0;background:#fff;border-radius:14px;padding:12px;box-shadow:0 4px 14px rgba(63,52,32,.08);text-decoration:none;transition:transform .15s,box-shadow .15s}
.fcv-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(63,52,32,.16)}
.fcv-card:focus-visible{outline:3px solid #81543e;outline-offset:3px}
.fcv-img{display:block}
.fcv-img img{width:100%;height:auto;display:block;border-radius:8px;background:#fff}
.fcv-cap{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.fcv-cap strong{font-size:1rem;color:var(--ink)}
.fcv-sub{font-family:var(--serif);font-size:.92rem;color:#8a8172;text-align:right}
@media (max-width:680px){.fcv-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fcv-card{padding:9px}.fcv-cap strong{font-size:.9rem}}

/* ---- Write & Color: transparent drawing layer over the worksheet image ---- */
.wc-section{margin-top:26px}
.wc-head{margin-bottom:16px}
.wc-head h2{margin-bottom:10px}
.wc-stage{position:relative;background:#fff;border:1px solid #ccc5b5;border-radius:14px;box-shadow:0 10px 30px rgba(63,52,32,.10);overflow:hidden}
.wc-stage .wc-img{display:block;width:100%;height:auto}
.wc-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.wc-fill{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.wc-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.wc-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 16px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:.9rem;font-weight:600;cursor:pointer}
.wc-btn:hover,.wc-btn:focus-visible{background:#fdf6ec;box-shadow:2px 2px 0 rgba(52,59,48,.18)}
.wc-btn[aria-pressed="true"]{background:var(--kiddo-purple);border-color:var(--kiddo-purple);color:#fff}
.wc-swatch{width:34px;height:34px;min-height:34px;padding:0;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1.5px #ccc5b5;cursor:pointer}
.wc-swatch[aria-pressed="true"]{box-shadow:0 0 0 3px var(--kiddo-purple);transform:scale(1.08)}.wc-size{padding:9px 12px}.wc-size .wc-dot{display:block;border-radius:50%;background:currentColor}.wc-size .wc-dot[data-size="1"]{width:4px;height:4px}.wc-size .wc-dot[data-size="1.9"]{width:8px;height:8px}.wc-size .wc-dot[data-size="3.2"]{width:13px;height:13px}
.wc-save{margin-left:auto;background:var(--kiddo-purple);border-color:var(--kiddo-purple);color:#fff}
.wc-save:hover,.wc-save:focus-visible{background:#46265a}
.wc-note{flex-basis:100%;margin:2px 0 0;font-size:.8rem;color:#626456}
@media (max-width:680px){.wc-save{margin-left:0;width:100%}.wc-btn{padding:9px 13px;font-size:.85rem}}

/* every flashcard card on a set page keeps its download button in the rail */

/* Flashcard set cards: the stacked layout is load-bearing. Re-asserted in the
   last theme layer so no earlier rule or image load state can turn a card
   sideways and clip its copy. */
.fc-stagegrid{width:100%}
.fc-stagegrid .fc-setcard{display:flex!important;flex-direction:column!important;width:100%;max-width:100%;min-width:0}
.fc-stagegrid .fc-setcard-visual{flex:0 0 auto;width:100%;height:225px;padding:16px;overflow:hidden}
.fc-stagegrid .fc-setcard-copy{width:100%;flex:1 1 auto;min-width:0;overflow-wrap:break-word}
@media(max-width:700px){.fc-stagegrid .fc-setcard-visual{height:190px;padding:12px}}

/* Print: worksheet and activity pages print the sheet itself, big and
   whole — no rail, no buttons, no page furniture. */
@media print{
 .fc2-rail,.fc2-pn,.fc-section,.fc2-learn,.wc-head,.fc-hint,.breadcrumbs,.page-heading,.lesson-section{display:none!important}
 .fc2-dual{display:block!important}
 .ws-hero-art img{max-height:94vh;width:auto;max-width:100%;margin:0 auto}
 .wc-section{padding:0!important}
}

/* Drawing-layer alignment contract (write-color): the stage must
   shrink-wrap the image's rendered content — letterboxing a portrait or
   square sheet inside a wider box puts the canvas out of register with the
   sheet, and saved work comes out horizontally squashed. With the stage
   hugging the image, canvas backing pixels map 1:1 onto the sheet on every
   screen size, desktop and mobile. */
.wc-stage{width:fit-content;max-width:100%;margin-inline:auto}
.wc-stage .wc-img{width:auto;max-width:100%;height:auto}

/* Image adventures (Classes 25-31): the drawing canvas must stay aligned
   1:1 with the artwork at every viewport. Instead of clamping the image
   height (which letterboxes the bitmap inside the canvas box and shifts
   strokes), the artwork is capped by WIDTH using its true aspect ratio,
   so the element box and the bitmap box are always the same rectangle. */
.fc2-main .fc2-hero.ia-sheet{max-width:min(100%,calc(70vh * var(--iar,1.4143)));margin-inline:auto}
.fc2-main .fc2-hero.ia-sheet img{max-height:none;object-fit:fill}

/* Image adventures: the play section heading is the page h1 (the duplicated hero was removed) — keep the former play-heading scale. */
.ia-h1{font-size:clamp(30px,3.4vw,43px);letter-spacing:-1.2px}

/* Small supporting flashcard-resource section on class pages (owner spec: short explanation + original collection cover + ONE collection link — never a card grid). */
.fc-res{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:40px;align-items:center}
.fc-res-art img{width:100%;max-width:340px;height:auto;display:block;margin:0 auto;border:1.5px solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:#fff}
@media(max-width:820px){.fc-res{grid-template-columns:1fr;gap:24px}.fc-res-art img{max-width:230px}}
/* Learning Path flashcard lessons (Type 1): image left, teaching right. */
.fcl{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:44px;align-items:start;padding-bottom:8px}
.fcl-art{margin:0;position:sticky;top:24px}
.fcl-art img{width:100%;max-width:400px;height:auto;display:block;margin:0 auto;border:1.5px solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:#fff}
.fcl-art figcaption{display:flex;flex-direction:column;gap:2px;margin-top:10px;text-align:center}
.fcl-art figcaption strong{font-size:1.05rem}
.fcl-art figcaption span{font-size:.8rem;color:var(--ink-60,#5b5348)}
.fcl-copy{display:flex;flex-direction:column;gap:18px}
.fcl-copy .fc2-do{margin:0}
.fcl-steps ol{margin:10px 0 0;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.fcl-vocab{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 0}
.fcl-chip{display:inline-block;padding:4px 12px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;font-size:.85rem;font-weight:600}
.fcl-say{border-left:4px solid var(--ink);padding-left:16px}
.fcl-say p{font-size:1.05rem;font-weight:500}
.fcl-safety{background:#fff6e8;border:1.5px dashed var(--ink);box-shadow:none}
.fcl-pair{font-size:.92rem;color:var(--ink-60,#5b5348);border-top:1.5px solid var(--ink-20,#e7dfd2);padding-top:14px}
.fc2-relrow .fcl-nav strong{display:block}
.fc2-relrow .fcl-nav{min-width:min(320px,100%)}
/* Lessons carry the drawing canvas (owner law): the wc-mount replaces the
   plain artwork column — same size caps as the plain artwork, the drawing
   toolbar lands under the card, and the column stays sticky on desktop. */
.wc-mount.fcl-left{position:sticky;top:24px;min-width:0}
.fcl-left .wc-stage{max-width:400px}
@media(max-width:820px){.fcl{grid-template-columns:1fr;gap:26px}.fcl-art{position:static}.fcl-art img{max-width:260px}.wc-mount.fcl-left{position:static}.fcl-left .wc-stage{max-width:260px}}

/* Learning Path class-listing image tiles (owner doctrine, 2026-10-12): the
   class page shows every flashcard / worksheet as a PICTURE — each picture
   opens its own individual page. Images + the word only; the descriptions
   live on the individual pages, never on the listing. */
.lp-tiles{margin-top:26px;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:18px}
.lp-tile{position:relative;display:block;background:var(--white);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);text-decoration:none;color:var(--ink);transition:transform .15s ease,box-shadow .15s ease}
.lp-tile:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.lp-tile img{width:100%;height:auto;background:#fff;border-bottom:1.5px solid var(--ink)}
.lp-tile strong{display:block;padding:10px 12px 12px;font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.25;text-align:center;letter-spacing:-.2px}
.lp-tile .sa-card-num{width:30px;height:30px;font-size:13px;top:10px;left:10px}
.lp-tile .sa-card-done{font-size:10px;top:10px;right:10px;padding:4px 9px}
.sa-card-imgonly .sa-card-body{padding:14px 16px 16px}
@media(max-width:640px){.lp-tiles{grid-template-columns:repeat(2,1fr);gap:12px}.lp-tile strong{font-size:15px;padding:8px 10px 10px}}
.po-field select{border:1.5px solid var(--line);background:var(--white);padding:12px 14px;font-size:16px;width:100%}
.contact-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;align-items:start;max-width:1000px}
.contact-side{background:var(--kiddo-lavender);border-radius:20px;padding:24px}
.contact-side h2{margin-top:0}
@media(max-width:680px){.contact-layout{grid-template-columns:1fr}}
.ws-hero-split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:center}
.ws-hero-split .page-heading{padding-bottom:0}
.ws-hero-split .ws-cover-sm{margin:0}
@media(max-width:680px){.ws-hero-split{grid-template-columns:1fr;gap:20px}.ws-hero-split .ws-cover-sm{margin:0 auto}}

/* Cookie notice */
.consent-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:1000;max-width:720px;margin-inline:auto;background:#fff;color:#34233E;border:2px solid #57306D;border-radius:18px;box-shadow:0 10px 30px #34233e33;padding:18px 20px}
.consent-title{font-size:18px;margin:0 0 6px;color:#57306D}
.consent-text{font-size:14px;line-height:1.55;margin:0 0 14px;color:#4a3a55}
.consent-more{color:#57306D;font-weight:600}
.consent-actions{display:flex;flex-wrap:wrap;gap:10px}
.consent-btn{min-height:44px;padding:10px 18px;border:2px solid #57306D;border-radius:24px;background:#57306D;color:#fff;font-size:14px;font-weight:700;cursor:pointer}
.consent-btn:hover{background:#431f58}
.consent-btn-quiet{background:#fff;color:#57306D}
.consent-btn-quiet:hover{background:#EEE6F2}
.consent-link{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
@media print{.consent-banner{display:none!important}}

/* ---------- worksheet generator (/worksheet-generator/) ---------- */
.is-hidden{display:none!important}
.wsgen-tabs{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.wsgen-tab{border:1.5px solid var(--ink);background:var(--white);padding:10px 22px;border-radius:999px;font-weight:800;font-size:15px;box-shadow:3px 3px 0 var(--ink)}
.wsgen-tab.is-active{background:var(--ink);color:var(--white)}
.wsgen-panel{display:grid;grid-template-columns:350px minmax(0,1fr);gap:26px;align-items:start}
.wsgen-options{background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);border-radius:16px;padding:22px 20px;position:sticky;top:16px}
.wsgen-card-title{font-size:23px;margin-bottom:6px}
.wsgen-hint{font-size:14px;margin:0 0 14px}
.wsgen-label{display:block;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.8px;margin:14px 0 6px}
.wsgen-select,.wsgen-text{width:100%;border:1.5px solid var(--ink);border-radius:10px;padding:10px 12px;background:var(--white);font-size:15px}
.wsgen-text{resize:vertical}
.wsgen-fieldset{border:0;padding:0;margin:16px 0 0}
.wsgen-legend{font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.8px;padding:0;margin-bottom:8px}
.wsgen-pills{display:flex;flex-wrap:wrap;gap:8px}
.wsgen-pill{position:relative}
.wsgen-pill input{position:absolute;opacity:0;pointer-events:none}
.wsgen-pill span{display:inline-block;border:1.5px solid var(--ink);border-radius:999px;padding:7px 14px;font-size:14px;font-weight:700;background:var(--white);cursor:pointer}
.wsgen-pill input:checked+span{background:var(--ink);color:var(--white)}
.wsgen-pill input:focus-visible+span{outline:3px solid #81543e;outline-offset:3px}
.wsgen-check{display:flex;gap:10px;align-items:center;margin:16px 0 0;font-weight:700;font-size:15px;cursor:pointer}
.wsgen-check input{width:19px;height:19px;accent-color:var(--ink)}
.wsgen-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.wsgen-out{min-width:0}
.wsgen-sheet{background:#fff;border:1.5px solid var(--ink);box-shadow:6px 6px 0 rgba(52,35,62,.16);border-radius:14px;padding:34px 30px;max-width:640px;margin:0 auto}
.wsgen-sheet-head{text-align:center;margin-bottom:20px}
.wsgen-sheet-title{font-size:26px}
.wsgen-sheet-sub{font-size:14px;margin-top:6px;color:var(--muted)}
.wsgen-grid{display:grid;width:100%;max-width:560px;margin:0 auto;border:2px solid var(--ink);background:#fff}
.wsgen-grid-8{grid-template-columns:repeat(8,1fr)}
.wsgen-grid-10{grid-template-columns:repeat(10,1fr)}
.wsgen-grid-12{grid-template-columns:repeat(12,1fr)}
.wsgen-cell{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border:1px solid var(--line);font-weight:700;color:var(--ink)}
.wsgen-grid-8 .wsgen-cell{font-size:21px}
.wsgen-grid-10 .wsgen-cell{font-size:17px}
.wsgen-grid-12 .wsgen-cell{font-size:14px}
.wsgen-hit{background:var(--yellow);border-color:var(--ink)}
.wsgen-wordlist{margin-top:18px;text-align:center}
.wsgen-list-head{font-weight:800;font-size:15px;color:var(--ink);margin-bottom:8px}
.wsgen-chips{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.wsgen-chip{border:1.5px solid var(--ink);border-radius:999px;padding:3px 12px;font-size:13px;font-weight:700;background:var(--sage)}
.wsgen-math{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 22px;max-width:560px;margin:6px auto 0}
.wsgen-problem{font-size:29px;font-weight:600;color:var(--ink);white-space:nowrap}
.wsgen-blank{display:inline-block;width:2.1em;border-bottom:2.5px solid var(--ink)}
.wsgen-answer{font-weight:800;color:var(--kiddo-purple)}
.wsgen-sheet-foot{text-align:center;font-size:12.5px;color:#8a8172;margin-top:22px}
.wsgen-status{min-height:1.5em;font-weight:700;color:#a15c3d;max-width:640px;margin:10px auto 0;text-align:center}
@media(max-width:920px){.wsgen-panel{grid-template-columns:1fr}.wsgen-options{position:static}}
@media(max-width:640px){.wsgen-math{grid-template-columns:repeat(2,1fr);gap:26px 14px}.wsgen-problem{font-size:24px}.wsgen-sheet{padding:24px 16px}}
/* the print root is appended to <body> at print time; everything else hides */
#wsgen-print{display:none}
@media print{
 @page{size:A4 portrait;margin:12mm}
 body>*{display:none!important}
 body>#wsgen-print{display:block!important}
 .wsgen-print-sheet{font-family:Arial,Helvetica,sans-serif;color:#111}
 .wsgen-print-sheet h1{text-align:center;font-size:26pt;margin:0 0 8mm;font-family:Georgia,serif;font-weight:700}
 .wsgen-print-sub{text-align:center;font-size:12pt;margin:0 0 8mm}
 .wsgen-print-table{border-collapse:collapse;margin:0 auto}
 .wsgen-print-table td{border:1.2pt solid #2b2b2b;width:11.5mm;height:11.5mm;text-align:center;vertical-align:middle;font-size:13pt;font-weight:600;padding:0}
 .wsgen-print-hit{background:#ffe9a8}
 .wsgen-print-words{text-align:center;font-size:12.5pt;font-weight:700;margin:8mm 0 0;line-height:1.9}
 .wsgen-print-math{border-collapse:collapse;margin:4mm auto 0;width:100%}
 .wsgen-print-math td{font-size:15pt;font-weight:600;padding:9mm 6mm;width:33%;white-space:nowrap}
 .wsgen-print-key{page-break-before:always;border-top:2pt dashed #666;padding-top:6mm;margin-top:10mm}
 .wsgen-print-foot{text-align:center;font-size:10pt;color:#777;margin:10mm 0 0}
}
/* generator card on the worksheet library wall */
.ws-cat-gen{border:2px solid var(--kiddo-purple)}
.ws-pill-gen{background:var(--kiddo-lavender);color:var(--kiddo-purple)}
.ws-cat-gen .fc-open{color:var(--kiddo-purple)}

/* ---- generator hub cards (four machines) ---- */
.wsgen-hub{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:18px}
.wsgen-hubcard{display:block;background:var(--white);border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);border-radius:16px;padding:22px 20px;text-decoration:none;color:inherit}
.wsgen-hubcard h3{font-size:21px;margin-bottom:8px}
.wsgen-hubcard p{font-size:14.5px;margin:0 0 12px}
.wsgen-hubcard:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.wsgen-hublink{font-weight:800;font-size:14px;color:var(--kiddo-purple)}
@media(max-width:640px){.wsgen-hub{grid-template-columns:1fr}}
.wsgen-actions-center{justify-content:center}
/* ---- solve on screen: word search ---- */
.wsgen-grid.wsgen-live .wsgen-cell{cursor:pointer;-webkit-user-select:none;user-select:none}
.wsgen-grid.wsgen-live .wsgen-cell:hover{background:#fff3cf}
.wsgen-pick{background:#fff3cf!important;border-color:var(--ink)!important}
.wsgen-found{background:var(--yellow)!important;border-color:var(--ink)!important;font-weight:800}
.wsgen-nope{animation:wsgen-shake .4s}
.wsgen-chip.is-done{text-decoration:line-through;opacity:.55;background:var(--yellow)}
@keyframes wsgen-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
/* ---- solve on screen: math bubbles ---- */
.wsgen-solve{display:flex;flex-direction:column;gap:8px}
.wsgen-bubbles{display:flex;gap:8px;flex-wrap:wrap}
.wsgen-bubble{border:1.5px solid var(--ink);background:var(--white);border-radius:999px;padding:3px 16px;font-weight:800;font-size:20px;cursor:pointer;box-shadow:2px 2px 0 var(--ink);color:var(--ink)}
.wsgen-bubble:hover{background:#fff3cf}
.wsgen-bubble.is-right{background:var(--sage);cursor:default}
.wsgen-bubble.is-wrong{background:#f3d3c4;animation:wsgen-shake .35s}
.wsgen-bubble:disabled{cursor:default}
.wsgen-problem.is-done .wsgen-bubbles{opacity:.75}
@media(max-width:640px){.wsgen-bubble{font-size:17px;padding:3px 12px}}
/* ---- matching pairs ---- */
.wsgen-match-cols{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:44px;max-width:560px;margin:8px auto 0}
.wsgen-match-col{display:flex;flex-direction:column;gap:12px}
.wsgen-match-item{border:1.5px solid var(--ink);border-radius:12px;background:var(--white);padding:10px 12px;font-weight:700;font-size:17px;text-align:center;box-shadow:2px 2px 0 rgba(52,35,62,.12);color:var(--ink)}
.wsgen-match-board .wsgen-match-item{cursor:pointer}
.wsgen-match-board .wsgen-match-item:hover{background:#fff3cf}
.wsgen-match-item.wsgen-pick{background:#fff3cf;border-color:var(--ink)}
.wsgen-match-item.is-matched{background:var(--sage);cursor:default;opacity:.9}
.wsgen-match-item.is-wrong{background:#f3d3c4;animation:wsgen-shake .35s}
.wsgen-match-lines{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}
@media(max-width:640px){.wsgen-match-cols{gap:26px}.wsgen-match-item{font-size:14.5px;padding:8px 8px}}
/* ---- tracing sheet + finger pad ---- */
.wsgen-trace-row{display:block;width:100%;max-width:560px;margin:0 auto}
.wsgen-tracepad{margin:26px auto 0;max-width:640px;background:var(--white);border:1.5px solid var(--ink);box-shadow:6px 6px 0 rgba(52,35,62,.16);border-radius:14px;padding:22px 20px;text-align:center}
.wsgen-tracepad-title{font-size:19px;margin-bottom:4px}
.wsgen-trace-chips{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin:10px 0 14px}
.wsgen-trace-chip{border:1.5px solid var(--ink);border-radius:999px;padding:4px 13px;font-size:15px;font-weight:800;background:var(--sage);cursor:pointer;color:var(--ink)}
.wsgen-trace-chip.is-cur{background:var(--ink);color:var(--white)}
.wsgen-trace-chip.is-done{background:var(--yellow)}
.wsgen-trace-canvas{border:1.5px solid var(--ink);border-radius:14px;background:#fff;touch-action:none;box-shadow:4px 4px 0 rgba(52,35,62,.12);max-width:100%;cursor:crosshair}
/* ---- print additions: tracing rows + matching columns ---- */
.wsgen-print-trace{margin:2mm auto 0}
.wsgen-print-trace svg{display:block;width:172mm;height:23.6mm;margin:0 auto .5mm}
.wsgen-print-cols{display:flex;gap:16mm;justify-content:center;margin-top:2mm}
.wsgen-print-col{display:flex;flex-direction:column;gap:7mm}
.wsgen-print-item{border:1.2pt solid #2b2b2b;border-radius:3mm;padding:4mm 5mm;font-size:14pt;font-weight:700;min-width:56mm;text-align:center;font-family:Arial,Helvetica,sans-serif}
.wsgen-print-keylist{margin:6mm 12mm 0}
.wsgen-print-keypair{font-size:14pt;font-weight:700;margin:0 0 4mm;font-family:Arial,Helvetica,sans-serif}