*{box-sizing:border-box}body{margin:0;background:#eaf3ff;color:#18365c;font-family:Tahoma,Arial,sans-serif}.shell{max-width:620px;margin:auto;min-height:100dvh;background:radial-gradient(circle at 5% 25%,#ffe2f1 0,transparent 35%),#f5f9ff}header{display:flex;align-items:center;justify-content:space-between;padding:20px 18px;border-bottom:1px solid #d5e4f8}header b{font-size:20px}button{font:inherit;cursor:pointer;border:0;border-radius:18px;padding:15px 20px;min-height:52px;background:#fff;color:#224a78;box-shadow:0 3px 0 #ccdef5;font-weight:bold}button:focus-visible{outline:3px solid #bc2473;outline-offset:3px}button:disabled{cursor:default;opacity:.42}main{padding:24px 20px 10px;text-align:center}.eyebrow{font-size:13px;color:#4c6485;letter-spacing:1px}h1{font-size:34px;line-height:1.5;margin:12px 0}h2{font-size:25px}p{line-height:1.9}.hero{font-size:95px;padding:28px 0 12px;position:relative}.hero:after{content:'✦';font-size:28px;color:#e64d98;position:absolute;top:15px;left:22%}.primary{background:#2465ce;color:white;box-shadow:0 5px 0 #194a9d;display:block;width:100%;margin:20px 0}.secondary{background:#ffd2e8}.panel{background:white;border:1px solid #d8e4f6;border-radius:25px;padding:22px;margin:20px 0}.row{display:flex;gap:12px;justify-content:center;align-items:center}.row>*{flex:1}.stat{font-size:28px;font-weight:bold}.muted{color:#526581;font-size:14px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}.letter{font-size:32px;position:relative;background:#fff}.letter small{display:block;font-size:12px}.letter.done{background:#d9f3e7}.letter.current{background:#ffd2e8}.big{font-family:Arial,sans-serif;font-size:110px;line-height:1.8;color:#2465ce}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.card{background:#fff;border:1px solid #d8e4f6;border-radius:22px;padding:16px 4px;font-size:21px}.emoji{display:block;font-size:48px;margin-bottom:10px}.steps{display:flex;gap:5px;margin-bottom:20px}.steps span{height:6px;border-radius:8px;background:#dce7f7;flex:1}.steps span.active{background:#df438d}.pill{display:inline-block;background:#e1edff;padding:9px 16px;border-radius:30px;font-size:14px}.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.choices button{font-size:42px;padding:12px}.word{font-size:48px;line-height:2}.tracebox{background:white;border:2px dashed #96b8e9;border-radius:24px;overflow:hidden;direction:ltr}canvas{display:block;width:100%;touch-action:none}.meter{height:10px;background:#dce7f7;border-radius:10px;overflow:hidden;margin:15px 0}.meter i{display:block;background:#2465ce;height:100%;transition:width .2s}.celebrate{font-size:80px;animation:bounce 1s infinite alternate}.feedback{background:#ffedf6;border-radius:18px;padding:14px;min-height:50px}#notice{text-align:center;color:#94436a;margin:8px 20px;min-height:24px}footer{text-align:center;padding:24px;font-size:12px;color:#536a86}@keyframes bounce{to{transform:translateY(-12px) rotate(5deg)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:360px){main{padding:20px 12px}.cards{gap:5px}.emoji{font-size:38px}h1{font-size:29px}}
html{overflow-x:hidden;overflow-y:auto}body{overflow-x:hidden;min-width:0}.shell,main{min-width:0;max-width:100%}.shell{width:620px}button{touch-action:manipulation;max-width:100%}.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.row>*{min-width:0}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.card{overflow-wrap:anywhere}header b{min-width:0} @media(max-width:280px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}header{padding:12px 6px;gap:4px}header b{font-size:15px}header button{padding:12px}h1{font-size:25px}.emoji{font-size:32px}.card{font-size:17px}}
body,.shell,main{touch-action:pan-y}canvas{touch-action:pan-y}.primary{position:relative;z-index:1}button{user-select:none;-webkit-tap-highlight-color:transparent}
.movement-question h2{margin:8px 0}.movement-question p{margin:12px 0 4px}.movement-letter{font-family:Arial,Tahoma,sans-serif;font-size:112px;line-height:1.7;color:#2465ce;direction:rtl;padding:0 8px 8px}.movement-pictures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:4px 0 20px}.movement-pictures .card{font-size:17px;padding:12px 3px}.movement-pictures .emoji{font-size:36px;margin-bottom:8px}.movement-choices .marked-letter{display:block;font-family:Arial,Tahoma,sans-serif;font-size:48px;line-height:1.7;direction:rtl}.movement-choices small{display:block;font-size:14px}.movement-choices button{padding:8px 12px}
.form-example{background:white;border:1px solid #d8e4f6;border-radius:24px;padding:20px 14px;margin:20px 0}.form-example h3{font-size:19px;line-height:1.7}.context-letter{font:64px/1.6 Arial,sans-serif;color:#2465ce}.example-word{font:48px/2 Arial,sans-serif;direction:rtl}.example-word mark,.trace-example mark{color:#a51d67;background:#ffe0ef;border-radius:3px;font-weight:inherit}.word-photo{display:block;width:100%;height:210px;object-fit:contain;background:#f0f5ff;border-radius:18px}figure{margin:10px 0}figcaption{font-size:10px;line-height:1.6;color:#5b6a81;overflow-wrap:anywhere;margin:8px 0}figcaption a{color:#2259a4}.photo-missing{background:#ffedf6;padding:20px;border-radius:18px}.trace-example{font-size:26px}
select{display:block;width:100%;font:inherit;padding:14px 8px;border:1px solid #b9d0ed;border-radius:12px;color:#224a78;background:white;margin:12px 0 20px;min-height:52px}label{display:block;text-align:right;font-weight:bold;line-height:1.8}
.provided-recording audio{display:block;width:100%;max-width:100%;margin:16px 0}.provided-recording h2{font-size:22px}
header{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;gap:10px;padding:18px 16px 22px;align-items:start;background:linear-gradient(180deg,#e0edff,#f5f9ff)}header>button{padding:12px;min-width:0;margin-top:14px}.brand{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;min-width:0}.amani-avatar{display:block;width:104px;height:104px;object-fit:cover;border-radius:50%;border:5px solid white;box-shadow:0 5px 16px #225a9521}.brand b{font-size:23px;line-height:1.6;color:#184b91}.brand b span{display:block;font-size:18px;color:#a22568}.amani-footer{margin-top:22px;padding:28px 24px 32px;background:#e9efff;border-top:1px solid #d1dff4;border-radius:30px 30px 0 0;color:#294b77}.footer-heart{display:block;font-size:37px;line-height:1;color:#d43786}.amani-message{font-size:16px;line-height:2;margin:16px auto;max-width:410px}.made-with-love{font-size:12px;line-height:1.9;margin:18px 0 6px;color:#526583}.for-children{font-size:13px;font-weight:bold;margin:6px 0;color:#274f83}@media(max-width:360px){header{gap:6px;padding-inline:12px}.brand b{font-size:20px}.brand b span{font-size:17px}.amani-footer{padding-inline:20px}}@media(max-width:280px){header{grid-template-columns:44px minmax(0,1fr) 44px;padding-inline:6px}.brand b{font-size:18px}.amani-avatar{width:88px;height:88px}}
header{grid-template-columns:76px minmax(0,1fr) 76px;gap:0;padding:0;align-items:center}.amani-banner{grid-column:1/-1;display:block;width:100%;height:clamp(240px,65vw,360px);object-fit:cover;object-position:center 25%;border:0;border-radius:0;box-shadow:none}header>button{justify-self:center;margin:12px 0;padding:12px;width:52px}.brand{padding:16px 0;gap:0}.brand b span{display:inline;font-size:inherit;color:inherit}@media(max-width:360px){header{grid-template-columns:64px minmax(0,1fr) 64px;padding:0;gap:0}.brand b{font-size:20px}.brand b span{font-size:inherit}}@media(max-width:280px){header{grid-template-columns:56px minmax(0,1fr) 56px;padding:0}.brand b{font-size:18px}.amani-banner{height:220px}}
header{grid-template-columns:1fr 1fr;padding:0;gap:0}.header-art{position:relative;grid-column:1/-1;width:100%;overflow:hidden}.header-art .amani-banner{width:100%;height:auto;aspect-ratio:2/1;object-fit:cover;object-position:center;transform:scaleX(-1)}.header-art .brand{position:absolute;left:3%;right:auto;top:50%;transform:translateY(-50%);width:53%;padding:0;text-align:center}.header-art .brand b{font-size:clamp(22px,5.6vw,37px);line-height:1.55;color:#184b91;text-shadow:0 1px 3px #fff9}.header-art .brand b span{display:block;font-size:.8em;color:#a22568}header>#home{justify-self:start;margin:10px 14px}header>#sound{justify-self:end;margin:10px 14px}@media(max-width:360px){header{grid-template-columns:1fr 1fr;padding:0;gap:0}.header-art .brand b{font-size:22px}}@media(max-width:280px){header{grid-template-columns:1fr 1fr}.header-art .brand b{font-size:18px}.header-art .amani-banner{height:auto}}
.header-art .brand{top:43%;left:4%;width:52%}
.header-art .brand b{-webkit-text-stroke:1.4px #fffafd;paint-order:stroke fill;text-shadow:0 2px 3px #fff8}.header-art .brand b span{-webkit-text-stroke:1px #fffafd;paint-order:stroke fill}
header{position:relative;display:block}.header-art{padding-top:0;background:transparent}header>#home,header>#sound{position:absolute;top:6px;right:auto;margin:0;width:44px;min-height:44px;padding:8px;border-radius:13px;z-index:2;background:#fffffff0;box-shadow:0 2px 6px #244b7c2b}header>#home{left:8px}header>#sound{left:60px}
.mad-cards{display:grid;gap:14px;margin:22px 0}.mad-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border:1px solid #d8e4f6;background:#fff}.mad-sound{font:60px/1.7 Arial,Tahoma,sans-serif;color:#2465ce;direction:rtl}.mad-card small{font-size:18px;line-height:1.8;font-weight:normal}

/* Blue and pink child-friendly palette */
.shell{background:radial-gradient(circle at 4% 24%,#ffe4f2 0,transparent 38%),radial-gradient(circle at 95% 65%,#dcecff 0,transparent 38%),#f7faff}.primary:hover{background:#1e58b8}.letter.current{color:#92215d;border:2px solid #dc68a4}.letter.done{color:#18543e;border:2px solid #75ba9c}.letter:disabled{opacity:1;background:#edf1f8;color:#68758a;box-shadow:0 3px 0 #d6dfec}.pill{color:#234d86}.steps span.active{background:linear-gradient(90deg,#3078db,#db438f)}.meter i{background:linear-gradient(90deg,#2465ce,#d84091)}.amani-footer{background:linear-gradient(145deg,#e3efff,#ffebf5)}#notice[data-state="success"]{color:#18543e;background:#e4f6ec;border-radius:12px}#notice[data-state="error"]{color:#9a2449;background:#ffebf1;border-radius:12px}button:focus-visible{outline:3px solid #a51d67;outline-offset:3px}

.cartoon-image{display:block;width:100%;height:auto;max-height:240px;object-fit:contain;border-radius:16px;margin:0 auto 10px}.card .cartoon-image{min-height:72px;margin-bottom:8px}.word-photo.cartoon-image{height:230px;background:transparent}.big .cartoon-image{width:min(100%,256px);height:224px}.sources{margin-top:26px;padding-top:18px;border-top:1px solid #cfdaef;text-align:right;font-size:12px;line-height:1.9;overflow-wrap:anywhere}.sources summary{cursor:pointer;color:#294f83;font-weight:bold}.sources a{color:#2259a4}.panel>.cartoon-image{max-width:280px}

.letter.available:not(.done){background:#e1edff;color:#234d86;border:2px solid #a1bfe8}.letter.available:nth-child(even):not(.done){background:#ffe0ef;color:#92215d;border-color:#df9abe}.letter.done{background:#ffe39b;color:#654600;border:2px solid #c39428;box-shadow:0 3px 0 #d6b565}.letter.selected{border:4px solid #7942a0;box-shadow:0 0 0 3px #efe0fc,0 4px 0 #aa86be;background:#eee0fc;color:#4f2673}.letter.selected.done{background:#ffe39b;color:#654600}.letter small{font-size:11px;line-height:1.6}.letter.selected small{font-weight:bold}

.mad-sound .mad-letter,.mad-example .mad-letter{color:#a51d67;background:#ffe0ef;border-radius:0;padding:0;border-bottom:3px solid #b73378;font-weight:inherit}.mad-title{background:#ffe0ef;color:#92215d;border:1px solid #d995b7;font-size:16px}.mad-example{font-size:21px;direction:rtl}.mad-example .mad-letter{border-bottom-width:2px}

.mad-play{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;box-shadow:none;background:#f7faff}.mad-card>.mad-example{width:100%;background:#fff0f7;color:#344e76;box-shadow:0 3px 0 #edd3e2}.mad-card>.mad-example small{display:block;font-size:14px;margin-top:7px}

.lesson-back{display:block;width:100%;margin:0 0 20px;background:#ffe0ef;color:#92215d;box-shadow:0 3px 0 #df9abe}.primary:has(+.lesson-back){margin-bottom:12px}

.whatsapp-contact{display:flex;align-items:center;justify-content:center;min-height:52px;margin:24px auto 0;padding:14px 20px;width:100%;max-width:340px;border:1px solid #df9abe;border-radius:18px;background:#ffe0ef;color:#92215d;box-shadow:0 3px 0 #df9abe;font-size:16px;font-weight:bold;text-decoration:none;touch-action:manipulation}.whatsapp-contact:focus-visible{outline:3px solid #2465ce;outline-offset:4px}

.choices button.answer-correct{background:#e1edff;color:#194a9d;outline:3px solid #2465ce;outline-offset:-3px}.choices button.answer-wrong{background:#ffe0ef;color:#92215d;outline:3px solid #bc2473;outline-offset:-3px}.choices button.answer-correct::after,.choices button.answer-wrong::after{display:inline-block;font-size:24px;margin-inline-start:8px;vertical-align:middle}.choices button.answer-correct::after{content:"✓"}.choices button.answer-wrong::after{content:"×"}