.learn-container{max-width:var(--container-width);padding-inline:var(--s-4);padding-block:var(--s-6);margin-inline:auto}.learn-header{text-align:center;margin-bottom:var(--s-8)}.learn-header h1{font-size:var(--fs-2xl);color:var(--ink);margin-bottom:var(--s-2);font-weight:700}.learn-header p{font-size:var(--fs-base);color:var(--ink-muted);max-width:480px;margin-inline:auto}.learn-hero{text-align:center;padding:var(--s-10) var(--s-4) var(--s-8);margin:calc(-1 * var(--s-6)) calc(-1 * var(--s-4)) var(--s-8);background:linear-gradient(#0d948812 0%,#0000 100%);border-bottom:1px solid #0d94881a;position:relative;overflow:hidden}.learn-hero:before{content:"";pointer-events:none;background-image:radial-gradient(circle at 20% 30%,#0d94880d 0%,#0000 50%),radial-gradient(circle at 80% 70%,#0d948808 0%,#0000 50%);position:absolute;inset:0}.learn-hero__badge{background:var(--primary);color:#fff;border-radius:var(--radius-pill,999px);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--s-4);padding:6px 18px;font-size:.8rem;font-weight:600;display:inline-block}.learn-hero__title{color:var(--ink);margin:0 0 var(--s-3);font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700;line-height:1.2}.learn-hero__subtitle{color:var(--ink-muted);max-width:520px;margin-inline:auto;font-size:clamp(1rem,2vw,1.15rem);line-height:1.5}.learn-hero__stats{justify-content:center;gap:var(--s-6);margin-top:var(--s-5);flex-wrap:wrap;display:flex}.learn-hero__stat{text-align:center}.learn-hero__stat-value{font-size:var(--fs-xl);color:var(--primary);font-weight:700}.learn-hero__stat-label{font-size:var(--fs-sm);color:var(--ink-muted)}.learn-hero--mini{padding:var(--s-6) var(--s-4) var(--s-5);margin-bottom:var(--s-6)}.learn-hero--mini .learn-hero__title{font-size:clamp(1.4rem,3vw,1.8rem)}[data-theme=dark] .learn-hero{background:linear-gradient(#0d94881f 0%,#0000 100%);border-bottom-color:#0d948826}.stages-grid{gap:var(--s-5);flex-direction:column;max-width:640px;margin-inline:auto;display:flex}.stage-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg,var(--radius-md));padding:var(--s-5) var(--s-5);align-items:center;gap:var(--s-4);color:inherit;cursor:pointer;box-shadow:var(--shadow-sm,0 1px 3px #0000000f);text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;position:relative;overflow:hidden}.stage-card:before{content:"";background:linear-gradient(90deg, var(--primary), #0d948866);opacity:0;height:3px;transition:opacity .2s;position:absolute;top:0;left:0;right:0}.stage-card:hover:not(.stage-card--locked){box-shadow:0 8px 24px #0d94881a, var(--shadow-md);border-color:var(--primary);transform:translateY(-3px)}.stage-card:hover:not(.stage-card--locked):before{opacity:1}.stage-card--active{border-color:var(--primary);background:linear-gradient(135deg, #0d94880a 0%, var(--surface) 100%)}.stage-card--active:before{opacity:1}.stage-card--locked{opacity:.5;cursor:not-allowed}.stage-card--completed{border-color:var(--success);background:linear-gradient(135deg, #10b98108 0%, var(--surface) 100%)}.stage-card--completed:before{background:linear-gradient(90deg, var(--success), #10b98166);opacity:1}.stage-card__icon{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--primary-tint), #0d948814);width:64px;height:64px;color:var(--primary);flex-shrink:0;justify-content:center;align-items:center;font-size:1.5rem;display:flex}.stage-card--locked .stage-card__icon{background:var(--surface-sunken);color:var(--ink-subtle)}.stage-card--completed .stage-card__icon{color:var(--success);background:linear-gradient(135deg,#10b9811f,#10b9810d)}.stage-card__content{flex:1;min-width:0}.stage-card__title{font-size:var(--fs-lg);margin-bottom:4px;font-weight:600}.stage-card__subtitle{font-size:var(--fs-sm);color:var(--ink-muted);line-height:1.4}.stage-card__badge{font-size:var(--fs-xs);border-radius:var(--radius-pill);white-space:nowrap;padding:4px 12px;font-weight:600}.stage-card__badge--active{background:var(--primary-tint);color:var(--primary)}.stage-card__badge--locked{background:var(--surface-sunken);color:var(--ink-subtle)}.stage-card__badge--completed{background:var(--success-bg);color:var(--success-text)}.progress-ring{transform:rotate(-90deg)}.progress-ring__bg{fill:none;stroke:var(--border);opacity:.3}.progress-ring__fill{fill:none;stroke:var(--primary);stroke-linecap:round;transition:stroke-dashoffset .4s}.progress-ring__text{fill:var(--ink);text-anchor:middle;dominant-baseline:central;font-size:12px;font-weight:600}.family-grid{gap:var(--s-4);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.family-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg,var(--radius-md));padding:var(--s-5);cursor:pointer;color:inherit;gap:var(--s-3);box-shadow:var(--shadow-sm,0 1px 3px #0000000f);flex-direction:column;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;position:relative;overflow:hidden}.family-card:after{content:"";top:0;bottom:0;background:linear-gradient(180deg, var(--primary), #0d94884d);opacity:0;width:3px;transition:opacity .2s;position:absolute;inset-inline-start:0}.family-card:hover:not(.family-card--locked){box-shadow:0 8px 24px #0d94881a, var(--shadow-md);border-color:var(--primary);transform:translateY(-3px)}.family-card:hover:not(.family-card--locked):after{opacity:1}.family-card--locked{opacity:.5;cursor:not-allowed;filter:grayscale(.6)}.family-card--completed{border-color:var(--success);background:linear-gradient(135deg, #10b98108 0%, var(--surface) 100%)}.family-card--completed:after{background:linear-gradient(180deg, var(--success), #10b9814d);opacity:1}.family-card__header{align-items:center;gap:var(--s-3);display:flex}.family-card__icon{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--primary-tint), #0d94880f);flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;display:flex}.family-card__icon svg{width:30px;height:30px;stroke:var(--primary);fill:none;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.family-card__name{font-size:var(--fs-lg);font-weight:600}.family-card__letters{gap:var(--s-2);font-family:var(--ff-arabic);direction:rtl;flex-wrap:wrap;font-size:1.5rem;line-height:1;display:flex}.family-card__letter-char{border-radius:var(--radius-sm);background:var(--surface-sunken);width:40px;height:40px;font-family:var(--ff-arabic);justify-content:center;align-items:center;transition:background .15s;display:flex}.family-card:hover .family-card__letter-char{background:#0d94880f}.family-card__progress{align-items:center;gap:var(--s-2);font-size:var(--fs-sm);color:var(--ink-muted);display:flex}.family-card__progress-bar{background:var(--border);border-radius:3px;flex:1;height:6px;overflow:hidden}.family-card__progress-fill{background:linear-gradient(90deg, var(--primary), #0d9488b3);border-radius:3px;height:100%;transition:width .4s}.letter-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg,var(--radius-md));padding:var(--s-4) var(--s-3);text-align:center;cursor:pointer;color:inherit;align-items:center;gap:var(--s-2);min-width:110px;box-shadow:var(--shadow-sm,0 1px 3px #0000000f);flex-direction:column;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;position:relative}.letter-card:hover{box-shadow:0 6px 20px #0d94881f, var(--shadow-md);border-color:var(--primary);transform:translateY(-3px)}.letter-card__character{font-family:var(--ff-arabic);color:var(--ink);font-size:3rem;line-height:1.2;transition:transform .2s}.letter-card:hover .letter-card__character{transform:scale(1.08)}.letter-card__name{font-size:var(--fs-sm);color:var(--ink-muted)}.letter-card__badge{top:var(--s-2);border-radius:50%;width:14px;height:14px;position:absolute;inset-inline-end:var(--s-2)}.letter-card__badge--new{background:0 0}.letter-card__badge--learning{background:var(--warning);box-shadow:0 0 0 3px #eab30833}.letter-card__badge--mastered{background:var(--success);box-shadow:0 0 0 3px #10b98133}.letter-card__status-label{top:20px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-muted);white-space:nowrap;font-size:.55rem;position:absolute;inset-inline-end:var(--s-2)}.lesson-container{max-width:640px;padding-inline:var(--s-4);padding-block:var(--s-5);margin-inline:auto}.lesson-nav{margin-bottom:var(--s-5);justify-content:space-between;align-items:center;display:flex}.lesson-bottom-nav{padding:var(--s-3) var(--s-4);background:var(--surface);border-top:1px solid var(--border);z-index:10;margin-top:var(--s-5);justify-content:space-between;align-items:center;display:flex;position:sticky;bottom:0;left:0;right:0}.lesson-nav__dots{gap:var(--s-2);display:flex}.lesson-nav__dot{background:var(--border);border-radius:50%;width:10px;height:10px;transition:background .2s}.lesson-nav__dot--active{background:var(--primary)}.lesson-nav__dot--completed{background:var(--success)}.lesson-btn{align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-4);border-radius:var(--radius-sm);font-weight:500;font-size:var(--fs-base);cursor:pointer;color:var(--ink-muted);background:0 0;border:1px solid #0000;text-decoration:none;transition:all .15s;display:inline-flex}.lesson-btn:hover{background:var(--surface-sunken);color:var(--ink)}.lesson-btn--primary{background:var(--primary);color:var(--on-primary)}.lesson-btn--primary:hover{background:var(--accent-hover);color:var(--on-primary)}.meet-letter{align-items:center;gap:var(--s-5);text-align:center;padding-block:var(--s-6);flex-direction:column;display:flex}.meet-letter__char{font-family:var(--ff-arabic);color:var(--ink);font-size:7.5rem;line-height:1}.meet-letter__name{font-family:var(--ff-arabic);font-size:var(--fs-xl);font-weight:600}.meet-letter__audio-btn{justify-content:center;align-items:center;gap:var(--s-2);padding:var(--s-3) var(--s-5);background:var(--primary-tint);color:var(--primary);border:1px solid var(--primary);border-radius:var(--radius-pill);font-size:var(--fs-base);cursor:pointer;transition:all .15s;display:inline-flex}.meet-letter__audio-btn:hover{background:var(--primary);color:var(--on-primary)}.meet-letter__audio-btn--muted{opacity:.5;cursor:not-allowed;border-color:var(--border);color:var(--ink-muted);background:var(--surface-sunken)}.meet-letter__audio-btn--playing{pointer-events:none;animation:.8s ease-in-out infinite audio-pulse}@keyframes audio-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}.meet-letter__callout{align-items:center;gap:var(--s-2);padding:var(--s-3) var(--s-4);background:var(--primary-tint,rgba(var(--accent-rgb,99, 102, 241), .08));border-radius:var(--radius-md,8px);font-size:var(--fs-sm);color:var(--ink-muted);cursor:pointer;max-width:400px;line-height:1.5;display:flex}.meet-letter__callout-dismiss{font-size:var(--fs-base);color:var(--primary);cursor:pointer;padding:var(--s-1);background:0 0;border:none;flex-shrink:0}.meet-letter__sound-desc{font-size:var(--fs-base);color:var(--ink-muted)}.meet-letter__dot-info{font-size:var(--fs-sm);color:var(--ink-subtle);align-items:center;gap:var(--s-2);display:flex}.meet-letter__mnemonic{font-size:var(--fs-sm);color:var(--ink-subtle);background:var(--surface-sunken);max-width:400px;padding:var(--s-3) var(--s-4);border-radius:var(--radius-sm);line-height:1.6}.meet-letter__example{margin-top:var(--s-4)}.meet-letter__example-play{align-items:center;gap:var(--s-3);background:var(--surface-sunken);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--s-3) var(--s-4);cursor:pointer;width:100%;max-width:400px;margin-inline:auto;transition:border-color .15s;display:flex}.meet-letter__example-play:hover{border-color:var(--accent)}.meet-letter__example-word{font-family:var(--ff-arabic);direction:rtl;flex:1;font-size:1.5rem}.meet-letter__example-highlight{color:var(--accent);text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);text-underline-offset:4px;font-weight:700}.meet-letter__example-translation{font-size:var(--fs-sm);color:var(--ink-muted)}.meet-letter__example-icon{color:var(--ink-muted);flex-shrink:0}.four-forms{padding-block:var(--s-4)}.four-forms__grid{gap:var(--s-3);direction:rtl;grid-template-columns:repeat(2,1fr);display:grid}.four-forms__cell{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--s-4);text-align:center;cursor:pointer;align-items:center;gap:var(--s-2);flex-direction:column;transition:all .2s;display:flex}.four-forms__cell:hover,.four-forms__cell--active{border-color:var(--primary);background:var(--primary-tint-2)}.four-forms__char{font-family:var(--ff-arabic);color:var(--ink);font-size:3rem;line-height:1.2}.four-forms__label{font-size:var(--fs-xs);color:var(--ink-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}.four-forms__label-ar{font-family:var(--ff-arabic);font-size:var(--fs-sm);color:var(--ink-subtle)}.four-forms__example{margin-top:var(--s-4);background:var(--surface-sunken);border-radius:var(--radius-sm);padding:var(--s-3) var(--s-4);text-align:center}.four-forms__example-word{font-family:var(--ff-arabic);direction:rtl;font-size:1.75rem;line-height:2}.four-forms__example-note{font-size:var(--fs-sm);color:var(--ink-muted);margin-top:var(--s-1)}.four-forms__highlight{color:var(--accent);text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);text-underline-offset:4px;font-weight:700}.four-forms__rtl-hint{justify-content:center;align-items:center;gap:var(--s-2);margin-top:var(--s-3);font-size:var(--fs-xs);color:var(--ink-muted);background:var(--surface-sunken);border-radius:var(--radius-sm);padding:var(--s-2) var(--s-3);display:flex}.four-forms__rtl-dismiss{color:var(--ink-muted);cursor:pointer;font-size:var(--fs-xs);border-radius:var(--radius-xs);background:0 0;border:none;padding:2px 6px}.four-forms__rtl-dismiss:hover{background:var(--surface-raised)}.compare-row{justify-content:center;gap:var(--s-4);padding-block:var(--s-5);direction:rtl;flex-wrap:wrap;display:flex}.compare-item{align-items:center;gap:var(--s-2);padding:var(--s-4);border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;flex-direction:column;min-width:80px;transition:all .2s;display:flex}.compare-item--current{border-color:var(--primary);background:var(--primary-tint-2)}.compare-item--playing{border-color:var(--accent);box-shadow:0 0 0 3px var(--primary-alpha)}.compare-item__char{font-family:var(--ff-arabic);font-size:2.5rem;line-height:1}.compare-item__dots{font-size:var(--fs-xs);color:var(--ink-subtle);text-align:center}.quick-check{padding-block:var(--s-4)}.quick-check__prompt{text-align:center;margin-bottom:var(--s-5);font-size:var(--fs-lg);font-weight:500}.quick-check__options{gap:var(--s-3);grid-template-columns:repeat(2,1fr);max-width:400px;margin-inline:auto;display:grid}.quick-check__option{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-md);padding:var(--s-4);text-align:center;cursor:pointer;font-family:var(--ff-arabic);font-size:2rem;transition:all .15s}.quick-check__option:hover{border-color:var(--primary);background:var(--primary-tint-2)}.quick-check__option--correct{border-color:var(--success);background:var(--success-bg);animation:.3s flash-correct}.quick-check__option--incorrect{border-color:var(--danger);animation:.3s shake}.quick-check__option--text{font-family:inherit;font-size:var(--fs-base)}.quick-check__word-spot{padding:var(--s-4);direction:rtl;flex-wrap:wrap;justify-content:center;gap:2px;display:flex}.quick-check__word-char{font-family:var(--ff-arabic);padding:var(--s-1) var(--s-2);cursor:pointer;border-radius:var(--radius-sm);border:2px solid #0000;font-size:2.5rem;line-height:1.5;transition:all .15s}.quick-check__word-char:hover{background:var(--primary-tint-2);border-color:var(--primary)}.quick-check__word-char--correct{color:var(--primary);background:var(--primary-tint);border-color:var(--primary)}.quick-check__word-char--incorrect{animation:.3s shake}.drill-container{max-width:540px;padding:var(--s-4);margin-inline:auto}.drill-progress{align-items:center;gap:var(--s-3);margin-bottom:var(--s-5);display:flex}.drill-progress__bar{background:var(--border);border-radius:3px;flex:1;height:6px;overflow:hidden}.drill-progress__fill{background:var(--primary);border-radius:3px;height:100%;transition:width .3s}.drill-progress__label{font-size:var(--fs-sm);color:var(--ink-muted);white-space:nowrap}.drill-question__display{text-align:center;margin-bottom:var(--s-5)}.drill-question__letter{font-family:var(--ff-arabic);color:var(--ink);font-size:5rem;line-height:1.2}.drill-options{gap:var(--s-3);grid-template-columns:repeat(2,1fr);display:grid}.drill-option{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-md);padding:var(--s-4);text-align:center;cursor:pointer;font-size:var(--fs-lg);transition:all .15s}.drill-option:hover:not(.drill-option--answered){border-color:var(--primary);background:var(--primary-tint-2)}.drill-option--correct{border-color:var(--success);background:var(--success-bg);color:var(--success-text)}.drill-option--incorrect{border-color:var(--danger);background:var(--danger-bg);color:var(--danger-text);animation:.3s shake}.drill-option__arabic{font-family:var(--ff-arabic);font-size:2rem}.session-summary{text-align:center;padding-block:var(--s-6)}.session-summary__score{font-size:var(--fs-3xl);color:var(--primary);margin-bottom:var(--s-2);font-weight:700}.session-summary__label{font-size:var(--fs-base);color:var(--ink-muted);margin-bottom:var(--s-5)}.session-summary__stats{gap:var(--s-3);margin-bottom:var(--s-5);grid-template-columns:repeat(3,1fr);display:grid}.session-summary__stat{background:var(--surface-sunken);border-radius:var(--radius-sm);padding:var(--s-3)}.session-summary__stat-value{font-size:var(--fs-xl);color:var(--ink);font-weight:700}.session-summary__stat-label{font-size:var(--fs-xs);color:var(--ink-muted)}.session-summary__letters{margin-bottom:var(--s-4);text-align:start}.session-summary__letters h3{font-size:var(--fs-sm);margin-bottom:var(--s-2);color:var(--ink-muted);font-weight:600}.session-summary__letter-list{gap:var(--s-2);flex-wrap:wrap;display:flex}.session-summary__letter-chip{padding:2px var(--s-3);border-radius:var(--radius-pill);font-family:var(--ff-arabic);font-size:var(--fs-lg)}.session-summary__letter-chip--promoted{background:var(--success-bg);color:var(--success-text);border:1px solid var(--success-border)}.session-summary__letter-chip--demoted{background:var(--danger-bg);color:var(--danger-text);border:1px solid var(--danger-border)}.family-intro{background:var(--primary-tint-2);border:1px solid var(--primary-tint);border-radius:var(--radius-md);padding:var(--s-5);margin-bottom:var(--s-5)}.family-intro__collapsed{align-items:center;gap:var(--s-3);cursor:pointer;display:flex}.family-intro__title{font-size:var(--fs-lg);margin-bottom:var(--s-2);font-weight:600}.family-intro__desc{font-size:var(--fs-base);color:var(--ink-muted);line-height:1.6}.locked-placeholder{padding:var(--s-10) var(--s-4);text-align:center;justify-content:center;align-items:center;gap:var(--s-4);flex-direction:column;display:flex}.locked-placeholder__icon{opacity:.4;font-size:3rem}.locked-placeholder__title{font-size:var(--fs-xl);color:var(--ink);font-weight:600}.locked-placeholder__desc{font-size:var(--fs-base);color:var(--ink-muted);max-width:400px}.drill-empty{text-align:center;padding:var(--s-8) var(--s-4)}.drill-empty__icon{margin-bottom:var(--s-3);font-size:3rem}.drill-empty__title{font-size:var(--fs-lg);margin-bottom:var(--s-2);font-weight:600}.drill-empty__desc{font-size:var(--fs-base);color:var(--ink-muted)}@keyframes card-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.stage-card{animation:.4s ease-out backwards card-enter}.stage-card:first-child{animation-delay:0s}.stage-card:nth-child(2){animation-delay:.1s}.stage-card:nth-child(3){animation-delay:.2s}.family-card{animation:.4s ease-out backwards card-enter}.family-card:first-child{animation-delay:0s}.family-card:nth-child(2){animation-delay:60ms}.family-card:nth-child(3){animation-delay:.12s}.family-card:nth-child(4){animation-delay:.18s}.family-card:nth-child(5){animation-delay:.24s}.family-card:nth-child(n+6){animation-delay:.3s}.letter-card{animation:.35s ease-out backwards card-enter}.letter-card:first-child{animation-delay:0s}.letter-card:nth-child(2){animation-delay:50ms}.letter-card:nth-child(3){animation-delay:.1s}.letter-card:nth-child(4){animation-delay:.15s}.letter-card:nth-child(n+5){animation-delay:.2s}@keyframes hero-enter{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.learn-hero{animation:.5s ease-out hero-enter}@keyframes progress-fill{0%{width:0}}.family-card__progress-fill{animation:.6s ease-out progress-fill}@keyframes celebration-bounce{0%{opacity:0;transform:scale(.8)}60%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.lesson-completion,.session-summary{animation:.5s ease-out celebration-bounce}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}@keyframes flash-correct{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes dot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}.dot-pulse{animation:1.5s ease-in-out dot-pulse}@media (prefers-reduced-motion:reduce){.stage-card,.family-card,.letter-card,.four-forms__cell,.drill-option,.quick-check__option,.family-card__progress-fill,.drill-progress__fill,.learn-hero,.lesson-completion,.session-summary,.letter-card__character{transition:none!important;animation:none!important}.quick-check__option--incorrect,.drill-option--incorrect,.quick-check__word-char--incorrect,.dot-pulse{animation:none!important}}@media (max-width:640px){.family-grid{grid-template-columns:1fr}.four-forms__grid{gap:var(--s-2)}.four-forms__char{font-size:2.25rem}.meet-letter__char{font-size:5rem}.drill-options,.session-summary__stats{grid-template-columns:1fr}.compare-row{gap:var(--s-2)}.compare-item{padding:var(--s-3);min-width:64px}.compare-item__char{font-size:1.75rem}}.word-story-grid{gap:var(--s-3);flex-direction:column;max-width:640px;margin-inline:auto;display:flex}.word-story-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--s-4);align-items:center;gap:var(--s-4);color:inherit;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex}.word-story-card:hover{box-shadow:var(--shadow-md);border-color:var(--primary);transform:translateY(-2px)}.word-story-card--active{border-color:var(--primary);background:var(--primary-tint-2)}.word-story-card--complete{border-color:var(--success)}.word-story-card--loading{min-height:80px}.word-story-card__skeleton{background:var(--surface-sunken);border-radius:var(--radius-sm);width:100%;height:60px;animation:1.5s infinite pulse}.word-story-card__icon{border-radius:var(--radius-md);background:var(--primary-tint);width:48px;height:48px;color:var(--primary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.word-story-card--complete .word-story-card__icon{background:var(--success-bg);color:var(--success-text)}.word-story-card__content{flex:1;min-width:0}.word-story-card__title{font-family:var(--ff-arabic);font-size:var(--fs-lg);direction:rtl;font-weight:600}.word-story-card__title-en{font-size:var(--fs-sm);color:var(--ink-muted)}.word-story-card__meta{font-size:var(--fs-xs);color:var(--ink-subtle);margin-top:2px}.word-story-card__progress{flex-shrink:0}.word-story-card__exercises{font-size:var(--fs-sm);color:var(--primary);font-weight:600}.word-exercises-grid{gap:var(--s-3);flex-direction:column;max-width:640px;margin-inline:auto;display:flex}.word-exercise-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--s-4);align-items:center;gap:var(--s-3);color:inherit;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex}.word-exercise-card:hover:not(.word-exercise-card--locked){box-shadow:var(--shadow-md);border-color:var(--primary);transform:translateY(-2px)}.word-exercise-card--locked{opacity:.5;cursor:not-allowed}.word-exercise-card--complete{border-color:var(--success)}.word-exercise-card__number{background:var(--primary-tint);width:36px;height:36px;color:var(--primary);font-weight:700;font-size:var(--fs-base);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.word-exercise-card--complete .word-exercise-card__number{background:var(--success-bg);color:var(--success-text)}.word-exercise-card--locked .word-exercise-card__number{background:var(--surface-sunken);color:var(--ink-subtle)}.word-exercise-card__icon{color:var(--primary);flex-shrink:0}.word-exercise-card--locked .word-exercise-card__icon{color:var(--ink-subtle)}.word-exercise-card__content{flex:1;min-width:0}.word-exercise-card__title{font-size:var(--fs-base);font-weight:600}.word-exercise-card__desc{font-size:var(--fs-sm);color:var(--ink-muted)}.word-exercise-card__badge{font-size:var(--fs-xs);border-radius:var(--radius-pill);white-space:nowrap;padding:2px 8px;font-weight:600}.word-exercise-card__badge--complete{background:var(--success-bg);color:var(--success-text)}.word-exercise-card__badge--locked{background:var(--surface-sunken);color:var(--ink-subtle)}.word-ready-banner{align-items:center;gap:var(--s-4);padding:var(--s-4) var(--s-5);background:var(--primary-tint-2);border:1px solid var(--primary);border-radius:var(--radius-md);margin-top:var(--s-5);max-width:640px;margin-inline:auto;display:flex}.word-ready-banner__emoji{flex-shrink:0;font-size:2rem}.word-ready-banner__text{flex:1}.word-ready-banner__text strong{font-size:var(--fs-base);color:var(--primary);display:block}.word-ready-banner__text p{font-size:var(--fs-sm);color:var(--ink-muted);margin:0}.timer-bar{background:var(--border);height:6px;margin-bottom:var(--s-5);border-radius:3px;overflow:hidden}.timer-bar__fill{border-radius:3px;height:100%;transition:width 50ms linear,background-color .2s}.flash-card{max-width:540px;margin-inline:auto}.flash-card__word{font-family:var(--ff-arabic);text-align:center;color:var(--ink);padding-block:var(--s-5);direction:rtl;font-size:5rem;line-height:1.3}.flash-card__options{gap:var(--s-3);grid-template-columns:repeat(2,1fr);display:grid}.flash-card__option{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-md);padding:var(--s-3) var(--s-4);text-align:center;cursor:pointer;font-size:var(--fs-base);transition:all .15s}.flash-card__option:hover:not(:disabled){border-color:var(--primary);background:var(--primary-tint-2)}.flash-card__option--correct{border-color:var(--success);background:var(--success-bg);color:var(--success-text)}.flash-card__option--incorrect{border-color:var(--danger);background:var(--danger-bg);color:var(--danger-text);animation:.3s shake}.study-card{text-align:center;background:var(--primary-tint-2);border:1px solid var(--primary);border-radius:var(--radius-md);max-width:400px;padding:var(--s-6) var(--s-5);cursor:pointer;margin-inline:auto;transition:box-shadow .2s}.study-card:hover{box-shadow:var(--shadow-md)}.study-card__word{font-family:var(--ff-arabic);color:var(--ink);margin-bottom:var(--s-3);direction:rtl;font-size:4rem;line-height:1.3}.study-card__translation{font-size:var(--fs-xl);color:var(--primary);margin-bottom:var(--s-2);font-weight:600}.study-card__transliteration{font-size:var(--fs-base);color:var(--ink-muted);margin-bottom:var(--s-2);font-style:italic}.study-card__meta{font-size:var(--fs-sm);color:var(--ink-subtle);margin-bottom:var(--s-4)}.study-card__hint{font-size:var(--fs-xs);color:var(--ink-subtle);opacity:.7}.phrase-instruction{text-align:center;font-size:var(--fs-sm);color:var(--ink-muted);margin-bottom:var(--s-4)}.phrase-display{text-align:center;max-width:640px;margin-inline:auto}.phrase-display__words{justify-content:center;gap:var(--s-2);padding:var(--s-4);direction:rtl;flex-wrap:wrap;display:flex}.phrase-display__word{font-family:var(--ff-arabic);padding:var(--s-2) var(--s-3);border:2px solid var(--border);border-radius:var(--radius-md);background:var(--surface);cursor:pointer;flex-direction:column;align-items:center;gap:2px;font-size:2rem;line-height:1.8;transition:all .2s;display:flex}.phrase-display__word:hover:not(:disabled){border-color:var(--primary);background:var(--primary-tint-2)}.phrase-display__word--tapped{border-color:var(--success);background:var(--success-bg)}.phrase-display__word--next{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-alpha)}.phrase-display__word--shake{animation:.3s shake}.phrase-display__word--all-complete{border-color:var(--success);background:var(--success-bg)}.phrase-display__word-ar{display:block}.phrase-display__word-gloss{font-family:inherit;font-size:var(--fs-xs);color:var(--ink-muted);font-style:italic;display:block}.phrase-display__full-translation{margin-top:var(--s-4);font-size:var(--fs-base);color:var(--ink-muted);text-align:center;font-style:italic}.reading-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);max-width:640px;padding:var(--s-5);margin-inline:auto}.reading-card__sentence{padding-bottom:var(--s-4);direction:rtl;flex-wrap:wrap;justify-content:center;gap:4px;display:flex}.reading-card__word{font-family:var(--ff-arabic);padding:var(--s-1) var(--s-2);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:1px solid #0000;font-size:1.75rem;line-height:2;transition:all .15s;position:relative}.reading-card__word:hover{background:var(--primary-tint-2);border-color:var(--primary)}.reading-card__word--glossed{background:var(--primary-tint);border-color:var(--primary)}.reading-card__gloss-popup{background:var(--ink);color:var(--on-primary);padding:var(--s-1) var(--s-2);border-radius:var(--radius-sm);font-family:inherit;font-size:var(--fs-xs);white-space:nowrap;z-index:10;pointer-events:none;animation:.15s fadeIn;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.reading-card__translation{text-align:center;font-size:var(--fs-base);color:var(--ink-muted);padding-block:var(--s-2);min-height:1.5em;font-style:italic}.reading-card__hint{font-size:var(--fs-sm);color:var(--ink-subtle);margin-bottom:var(--s-3)}.comprehension-question{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}.comprehension-question__text{font-size:var(--fs-base);margin-bottom:var(--s-1);font-weight:500}.comprehension-question__text-ar{font-family:var(--ff-arabic);font-size:var(--fs-base);color:var(--ink-muted);margin-bottom:var(--s-3)}.comprehension-question__options{gap:var(--s-2);grid-template-columns:repeat(2,1fr);display:grid}.comprehension-question__option{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-md);padding:var(--s-2) var(--s-3);text-align:center;cursor:pointer;font-size:var(--fs-sm);transition:all .15s}.comprehension-question__option:hover:not(:disabled),.comprehension-question__option--selected{border-color:var(--primary);background:var(--primary-tint-2)}.comprehension-question__option--correct{border-color:var(--success);background:var(--success-bg);color:var(--success-text)}.comprehension-question__option--incorrect{border-color:var(--danger);background:var(--danger-bg);color:var(--danger-text);animation:.3s shake}.comprehension-question__explanation{margin-top:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--surface-sunken);border-radius:var(--radius-sm);font-size:var(--fs-sm);color:var(--ink-muted)}.word-completion{text-align:center;padding-block:var(--s-8);max-width:480px;margin-inline:auto;animation:.5s ease-out celebration-bounce}.word-completion__emoji{margin-bottom:var(--s-3);font-size:5rem}.word-completion__title{color:var(--primary);margin-bottom:var(--s-2);font-size:clamp(1.5rem,3vw,2rem);font-weight:700}.word-completion__subtitle{font-size:var(--fs-base);color:var(--ink-muted);margin-bottom:var(--s-3)}.word-completion__story-name{padding:var(--s-4) var(--s-5);background:linear-gradient(135deg, #0d94880f 0%, var(--surface) 100%);border-radius:var(--radius-md);margin-bottom:var(--s-5);box-shadow:var(--shadow-sm,0 1px 3px #0000000f);border:1px solid #0d94881a;flex-direction:column;gap:4px;display:flex}.word-completion__story-name span:first-child{font-family:var(--ff-arabic);font-size:var(--fs-xl);font-weight:600}.word-completion__story-name span:last-child{font-size:var(--fs-sm);color:var(--ink-muted)}.word-completion__message{font-size:var(--fs-base);color:var(--ink-muted);margin-bottom:var(--s-5);line-height:1.6}.word-completion__actions{align-items:center;gap:var(--s-3);flex-direction:column;display:flex}.word-completion__cta{transition:box-shadow .2s,transform .2s;box-shadow:0 4px 12px #0d948833;font-size:var(--fs-lg)!important;padding:var(--s-3) var(--s-6)!important}.word-completion__cta:hover{transform:translateY(-1px);box-shadow:0 6px 20px #0d94884d}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%)translateY(4px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes pulse{0%,to{opacity:.4}50%{opacity:.7}}.learn-center{text-align:center}.learn-section-heading{text-align:center;margin-bottom:var(--s-4)}.learn-section-heading h2{font-size:var(--fs-lg);margin-bottom:var(--s-1);font-weight:600}.learn-section-heading p{font-size:var(--fs-sm);color:var(--ink-muted)}.learn-empty-state{text-align:center;padding:var(--s-8) var(--s-4)}.learn-empty-state h1{font-size:var(--fs-xl)}.learn-loading-state{text-align:center;padding:var(--s-8)}.learn-loading-state p{color:var(--ink-muted)}.learn-breadcrumb{margin-bottom:var(--s-3)}.learn-breadcrumb__list{flex-wrap:wrap;align-items:center;gap:4px;margin:0;padding:0;font-size:.85rem;list-style:none;display:flex}.learn-breadcrumb__item{align-items:center;gap:4px;display:flex}.learn-breadcrumb__separator{color:var(--ink-muted,#999);flex-shrink:0}.learn-breadcrumb__link{color:var(--primary);text-decoration:none;transition:opacity .15s}.learn-breadcrumb__link:hover{opacity:.75;text-decoration:underline}.learn-breadcrumb__current{color:var(--ink-muted,#666);font-weight:500}.learn-back-link{margin-bottom:var(--s-4)}.letter-grid{gap:var(--s-3);margin-bottom:var(--s-5);grid-template-columns:repeat(auto-fill,minmax(120px,1fr));display:grid}.lesson-completion{text-align:center;padding:var(--s-8) var(--s-4);border-radius:var(--radius-lg,var(--radius-md));margin-top:var(--s-4);background:linear-gradient(#0d94880a 0%,#0000 100%)}.lesson-completion__emoji{margin-bottom:var(--s-4);font-size:4rem}.lesson-completion__title{color:var(--primary);margin-bottom:var(--s-3);font-size:clamp(1.3rem,3vw,1.75rem);font-weight:700}.lesson-completion__desc{color:var(--ink-muted);margin-bottom:var(--s-5);line-height:1.5}.lesson-completion__actions{gap:var(--s-3);flex-wrap:wrap;justify-content:center;display:flex}.lesson-btn--inline{display:inline-flex}.lesson-nav--spaced{margin-bottom:var(--s-4)}.lesson-spacer{width:80px}.lesson-btn--compact{padding:var(--s-1)}.drill-progress--spaced{margin-bottom:var(--s-5)}.summary-actions{justify-content:center;gap:var(--s-3);display:flex}.summary-actions--spaced{margin-top:var(--s-4)}.next-action{text-align:center;margin-top:var(--s-5)}.next-action--sm{text-align:center;margin-top:var(--s-4)}.family-card__subtitle{font-size:var(--fs-sm);color:var(--ink-muted)}.family-intro__header{justify-content:space-between;align-items:flex-start;display:flex}.family-intro__mnemonic{margin-top:var(--s-2);font-family:var(--ff-arabic)}.family-intro__icon--sm{width:36px;height:36px}.family-intro__icon--sm svg{width:20px;height:20px}.family-intro__name{flex:1;font-weight:600}.drill-question__prompt{font-size:var(--fs-base);color:var(--ink-muted);margin-bottom:var(--s-3)}.drill-question__audio-btn{margin:var(--s-3) auto}.quick-check__exercise-label{text-align:center;margin-bottom:var(--s-3);font-size:var(--fs-sm);color:var(--ink-subtle)}.quick-check__form-display{font-family:var(--ff-arabic);margin-bottom:var(--s-3);font-size:3rem}.compare-item__audio-icon{color:var(--ink-subtle)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg,var(--radius-md));padding:var(--s-5);gap:var(--s-3);flex-direction:column;display:flex}.skeleton-line{border-radius:var(--radius-sm);background:linear-gradient(90deg, var(--surface-sunken) 25%, #0d94880d 50%, var(--surface-sunken) 75%);background-size:200% 100%;animation:1.5s ease-in-out infinite shimmer}.skeleton-line--icon{border-radius:var(--radius-md);width:56px;height:56px}.skeleton-line--title{width:60%;height:18px}.skeleton-line--subtitle{width:80%;height:14px}.skeleton-line--badge{border-radius:var(--radius-pill,999px);width:120px;height:28px;margin-inline:auto}.skeleton-line--heading{width:50%;height:32px;margin-inline:auto}.skeleton-line--text{width:70%;height:16px;margin-inline:auto}.skeleton-grid{gap:var(--s-4);margin-top:var(--s-6);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.skeleton-hero{text-align:center;padding:var(--s-10) var(--s-4) var(--s-8);gap:var(--s-4);flex-direction:column;align-items:center;display:flex}.lesson-btn--disabled{opacity:.3}@media (max-width:480px){.flash-card__word{font-size:3.5rem}.flash-card__options{grid-template-columns:1fr}.phrase-display__word{font-size:1.5rem}.reading-card__word{font-size:1.375rem}.comprehension-question__options{grid-template-columns:1fr}.word-ready-banner{text-align:center;flex-direction:column}}.level-grid{gap:var(--s-4);margin-top:var(--s-6);display:grid}.level-card{align-items:center;gap:var(--s-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg,12px);padding:var(--s-4) var(--s-5);text-align:start;cursor:pointer;width:100%;transition:border-color .2s,box-shadow .2s,transform .15s;display:flex}.level-card:hover{border-color:var(--primary);transform:translateY(-1px);box-shadow:0 2px 12px #0d94881f}.level-card__number{width:44px;height:44px;color:var(--primary);background:#0d94881a;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1.25rem;font-weight:700;display:flex}.level-card__content{flex:1;min-width:0}.level-card__title{font-size:var(--fs-base);color:var(--ink);font-weight:600}.level-card__desc{font-size:var(--fs-sm);color:var(--ink-muted);margin-top:2px}.level-card__meta{font-size:var(--fs-xs);color:var(--ink-faint,var(--ink-muted));margin-top:4px}.level-card__action{font-size:var(--fs-sm);color:var(--primary);white-space:nowrap;flex-shrink:0;font-weight:600}.welcome-card{border-radius:var(--radius-lg,12px);padding:var(--s-5) var(--s-6);margin-bottom:var(--s-6);background:linear-gradient(135deg,#0d948814 0%,#0d948808 100%);border:1px solid #0d948826;position:relative}.welcome-card__title{font-size:var(--fs-lg);color:var(--ink);margin-bottom:var(--s-3);font-weight:700}.welcome-card__body{font-size:var(--fs-sm);color:var(--ink-muted);margin-bottom:var(--s-4);line-height:1.7}.welcome-card__dismiss{background:var(--primary);color:#fff;border-radius:var(--radius-md,8px);font-size:var(--fs-sm);cursor:pointer;border:none;align-items:center;gap:6px;padding:8px 20px;font-weight:600;transition:opacity .2s;display:inline-flex}.welcome-card__dismiss:hover{opacity:.9}.stage-card__number{width:28px;height:28px;color:var(--primary);z-index:1;background:#0d94881a;border-radius:50%;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex;position:absolute;top:8px;left:8px}.stage-card{position:relative}@media (max-width:480px){.level-card{padding:var(--s-3) var(--s-4)}.level-card__number{width:36px;height:36px;font-size:1rem}.welcome-card{padding:var(--s-4)}}