@font-face{font-family:Scheherazade New;src:url(/assets/ScheherazadeNew-Regular-DSGKASnT.woff2)format("woff2");font-display:swap}:root{--cream:#fffbeb;--ink:#1f2937;--muted:#6b7280;--card:#fff;--line:#e5e7eb;--green:#22c55e;--green-dark:#15803d;--green-soft:#dcfce7;--red:#ef4444;--red-soft:#fee2e2;--blue:#3b82f6;--blue-dark:#1d4ed8;--amber:#f59e0b;--amber-dark:#b45309;--grey:#d1d5db;--grey-dark:#9ca3af;--arabic:"Scheherazade New", "Geeza Pro", "Noto Naskh Arabic", serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--ink);background:var(--cream);-webkit-tap-highlight-color:transparent;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--cream);overscroll-behavior:none;min-height:100dvh;margin:0}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button:disabled{cursor:default}[lang=ar]{font-family:var(--arabic)}.screen{min-height:100dvh;padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));flex-direction:column;display:flex}.stats{align-items:center;gap:10px;font-size:clamp(1.1rem,4.5vmin,1.5rem);font-weight:700;display:flex}.stat{background:var(--card);box-shadow:0 3px 0 var(--line);white-space:nowrap;border-radius:999px;padding:6px 14px}.hold-button{background:var(--card);width:52px;height:52px;box-shadow:0 3px 0 var(--line);border:none;border-radius:50%;margin-inline-start:auto;font-size:1.5rem;position:relative;overflow:hidden}.hold-button:after{content:"";transform-origin:bottom;background:#22c55e66;position:absolute;inset:0;transform:scaleY(0)}.hold-button.holding:after{transition:transform 2s linear;transform:scaleY(1)}.path{flex-direction:column;align-items:center;gap:26px;margin:32px 0;padding:0;list-style:none;display:flex}.path li:nth-child(4n+2){transform:translate(-60%)}.path li:nth-child(4n){transform:translate(60%)}.lesson-node{aspect-ratio:1;background:var(--blue);color:#fff;width:clamp(88px,24vmin,124px);box-shadow:0 8px 0 var(--blue-dark);border:none;border-radius:50%;font-size:clamp(1.8rem,7vmin,2.6rem);line-height:1.3;position:relative}.lesson-node.done{background:var(--amber);box-shadow:0 8px 0 var(--amber-dark)}.lesson-node.current{animation:1.6s ease-in-out infinite pulse}.lesson-node:disabled{background:var(--grey);box-shadow:0 8px 0 var(--grey-dark)}.lesson-node:active:not(:disabled){box-shadow:0 2px 0 var(--blue-dark);transform:translateY(6px)}.done-mark{background:var(--green);border-radius:50%;place-items:center;width:34px;height:34px;font-family:system-ui,sans-serif;font-size:1.2rem;display:grid;position:absolute;top:-6px;right:-6px}.lesson-bar{align-items:center;gap:12px;display:flex}.close-button{color:var(--muted);background:0 0;border:none;padding:6px 10px;font-size:1.7rem}.progress{background:var(--line);border-radius:999px;flex:1;height:18px;overflow:hidden}.progress>div{background:var(--green);border-radius:inherit;height:100%;transition:width .4s}.lesson-body{flex:1;display:flex}.exercise{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:clamp(14px,4vmin,30px);display:flex}.card{background:var(--card);min-width:1.5em;box-shadow:0 10px 0 var(--line);border:none;border-radius:32px;padding:0 .3em;font-size:clamp(6rem,32vmin,13rem);line-height:1.45;animation:.35s pop-in}.card-caption{margin:0;font-size:clamp(3rem,13vmin,5.5rem);line-height:1.4}.choices,.blend{flex-wrap:wrap;justify-content:center;gap:clamp(12px,3vmin,20px);display:flex}.tile{border:4px solid var(--line);background:var(--card);min-width:1.7em;box-shadow:0 6px 0 var(--line);border-radius:24px;padding:0 .35em;font-size:clamp(3rem,12vmin,5.5rem);line-height:1.45;position:relative}.tile:active:not(:disabled){box-shadow:0 2px 0 var(--line);transform:translateY(4px)}.tile.right{border-color:var(--green);background:var(--green-soft);box-shadow:0 6px 0 var(--green);animation:.35s pop}.tile.wrong{border-color:var(--red);background:var(--red-soft);box-shadow:0 6px 0 var(--red);opacity:.55;animation:.4s shake}.tile.shake{border-color:var(--red);animation:.4s shake}.tile.heard{border-color:var(--green)}.tile.next{border-color:var(--blue);animation:1.6s ease-in-out infinite pulse}.tile.used{visibility:hidden}.answer{border:4px dashed var(--grey);background:var(--card);border-radius:24px;min-width:3.5em;margin:0;padding:0 .4em;font-size:clamp(3.5rem,14vmin,6.5rem);line-height:1.45}.answer.right{border-style:solid;border-color:var(--green);background:var(--green-soft);animation:.35s pop}.picture{min-height:1em;font-size:clamp(4rem,17vmin,7.5rem);line-height:1}.whole-word{visibility:hidden;background:0 0;border:none;font-size:clamp(4rem,16vmin,7.5rem);line-height:1.45}.whole-word.shown{visibility:visible;animation:.4s pop-in}.speaker-button{background:var(--blue);width:1.9em;height:1.9em;box-shadow:0 6px 0 var(--blue-dark);border:none;border-radius:50%;font-size:clamp(2.2rem,9vmin,3.5rem)}.speaker-button:active{box-shadow:0 2px 0 var(--blue-dark);transform:translateY(4px)}.next-button{background:var(--green);color:#fff;width:2.3em;height:2.3em;box-shadow:0 8px 0 var(--green-dark);border:none;border-radius:50%;font-size:clamp(2rem,8vmin,2.8rem);animation:.3s pop-in}.next-button:active{box-shadow:0 2px 0 var(--green-dark);transform:translateY(6px)}.hand{pointer-events:none;font-family:system-ui,sans-serif;font-size:clamp(2.4rem,9vmin,3.4rem);line-height:1;animation:1.2s ease-in-out infinite tap;position:absolute;bottom:-.7em;left:50%}.complete{justify-content:center;align-items:center;gap:18px;position:relative;overflow:hidden}.stars span{font-size:clamp(3rem,14vmin,5rem);animation:1s ease-in-out infinite bounce;display:inline-block}.stars span:nth-child(2){animation-delay:.15s}.stars span:nth-child(3){animation-delay:.3s}.reward{margin:0;font-size:clamp(2rem,9vmin,3.4rem);font-weight:800}.level-up{animation:.5s .4s both pop}.confetti{pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetti span{border-radius:2px;width:10px;height:16px;animation:linear forwards fall;position:absolute;top:-5vh}.grown-ups,.setup{gap:14px;width:100%;max-width:640px;margin:0 auto;line-height:1.5}.grown-ups h1,.setup h1{margin:4px 0 0;font-size:1.6rem}.panel{background:var(--card);box-shadow:0 3px 0 var(--line);border-radius:16px;padding:16px}.panel h2{margin:12px 0 4px;font-size:1.05rem}.panel h2:first-child{margin-top:0}.panel p{margin:4px 0}.glyphs{word-spacing:.3em;font-size:2.4rem}.primary-button{background:var(--green);color:#fff;box-shadow:0 4px 0 var(--green-dark);border:none;border-radius:14px;align-self:flex-start;padding:14px 20px;font-size:1.1rem;font-weight:700}.link-button{color:var(--blue-dark);background:0 0;border:none;align-self:flex-start;padding:8px 0;text-decoration:underline}a{color:var(--blue-dark)}@keyframes pulse{0%,to{scale:1}50%{scale:1.07}}@keyframes pop{50%{scale:1.12}}@keyframes pop-in{0%{opacity:0;scale:.6}}@keyframes shake{20%,60%{translate:-8px}40%,80%{translate:8px}}@keyframes tap{0%,to{translate:-50%}50%{translate:-50% -.3em}}@keyframes bounce{50%{translate:0 -.25em}}@keyframes fall{to{transform:translateY(110vh) rotate(var(--turn))}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}