@font-face{font-family:AAArabic;src:url('dah-mutala-fonts/Amiri-Regular.ttf') format('truetype');font-display:swap}
.dah-alphabet{--aa-ink:#173f38;--aa-green:#286252;--aa-mint:#e5f2df;--aa-peach:#ffe5d5;--aa-gold:#f9cf65;--aa-paper:#fffcf4;color:var(--aa-ink);font:17px/1.65 'Trebuchet MS',Arial,sans-serif;text-align:left;max-width:1120px;margin:20px auto 40px;direction:ltr}
.dah-alphabet *{box-sizing:border-box}
.dah-alphabet h2,.dah-alphabet h3,.dah-alphabet h4,.dah-alphabet p{font-family:inherit;color:inherit;letter-spacing:normal;text-transform:none;line-height:1.4;margin:0 0 16px}
.dah-alphabet h2{font-size:clamp(30px,4vw,48px);font-weight:800}.dah-alphabet h3{font-size:25px;font-weight:800}.dah-alphabet h4{font-size:20px;font-weight:700}
.dah-alphabet button,.dah-alphabet a.aa-button{font:700 15px/1.35 'Trebuchet MS',Arial,sans-serif;text-transform:none;letter-spacing:normal;min-height:48px;border:2px solid #c8d8ca;border-radius:15px;padding:11px 17px;color:var(--aa-ink);background:#fff;cursor:pointer;box-shadow:none;white-space:normal;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background .15s,transform .15s}
.dah-alphabet button:hover,.dah-alphabet a.aa-button:hover{background:#edf5e8;transform:translateY(-1px)}
.dah-alphabet button:hover,.dah-alphabet button:focus,.dah-alphabet button:active{color:#173f38!important}.dah-alphabet button.aa-primary:hover,.dah-alphabet button.aa-primary:focus,.dah-alphabet button.aa-primary:active,.dah-alphabet .aa-tabs button[aria-pressed=true]{color:#fff!important}
.dah-alphabet button:focus-visible,.dah-alphabet a:focus-visible,.dah-alphabet summary:focus-visible,.dah-alphabet input:focus-visible{outline:3px solid #a24b17;outline-offset:4px}
.dah-alphabet button[disabled]{opacity:.55;cursor:default;transform:none}.dah-alphabet button.aa-primary,.dah-alphabet a.aa-primary{background:var(--aa-green);color:white;border-color:var(--aa-green)}
.dah-alphabet .aa-ar{font-family:AAArabic,'Traditional Arabic',serif;font-size:39px;font-weight:400;line-height:1.9;direction:rtl;unicode-bidi:isolate}
.aa-topline{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px;flex-wrap:wrap}.aa-brand{font-size:13px;font-weight:800;letter-spacing:2px}.aa-tag{background:#f5e7b7;padding:7px 14px;border-radius:30px;font-size:13px;font-weight:800}.aa-tag span{color:#785000}
.dah-alphabet .aa-hero-art{min-height:270px}.dah-alphabet .aa-hero-art .aa-picture{transform:translateY(40px)}.dah-alphabet .aa-hero-art .aa-floating{font-size:48px;top:-12px;right:15px}
.aa-hero{background:var(--aa-mint);border:1px solid #ccdfc5;border-radius:28px;padding:34px;display:grid;grid-template-columns:1.7fr 1fr;gap:24px;align-items:center;overflow:hidden}.aa-eyebrow{font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px}.aa-hero p{max-width:540px;font-size:18px}.aa-hero-art{display:flex;align-items:center;justify-content:center;position:relative;min-height:220px}.aa-hero-art .aa-picture{width:200px;height:200px;transform:rotate(-5deg)}.aa-hero-art .aa-floating{position:absolute;top:0;right:0;background:#fff8e5;padding:5px 20px;border-radius:25px;transform:rotate(8deg);font-size:64px;box-shadow:0 6px 0 #cbdcbe}.aa-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.aa-small{font-size:13px;line-height:1.6!important}.aa-muted{color:#51685f}.aa-picture{display:block;width:150px;height:150px;flex-shrink:0;background-image:var(--aa-atlas);background-size:700% 400%;background-repeat:no-repeat;background-position:var(--aa-x) var(--aa-y);margin:auto}
.aa-panel{border:1px solid #dce3d7;background:var(--aa-paper);border-radius:24px;padding:26px;margin-top:24px}.aa-section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:28px 0 15px}.aa-section-head h3{margin:0}.aa-missions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.dah-alphabet .aa-mission{display:block;text-decoration:none;color:var(--aa-ink);padding:19px;border:1px solid #d8e2d2;border-radius:18px;background:#fffdf7;min-height:150px}.aa-mission:hover{background:var(--aa-mint)}.aa-mission-num{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;background:#f8db8c;border-radius:50%;font-size:13px;font-weight:bold;margin-bottom:12px}.aa-mission strong{display:block;font-size:17px}.aa-mission .aa-ar{display:block;font-size:33px;line-height:1.6}.aa-mission p{font-size:13px;margin:6px 0 0}
.aa-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0 17px}.dah-alphabet .aa-tabs button[aria-pressed=true]{background:#173f38;color:#fff;border-color:#173f38}.aa-letter-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}.dah-alphabet button.aa-letter-tile{position:relative;display:flex;flex-direction:column;gap:0;padding:9px 4px;background:#fffdf7;min-height:105px}.dah-alphabet button.aa-letter-tile[aria-pressed=true]{background:#e4f1dd;border-color:#286252;box-shadow:0 3px 0 #286252}.aa-letter-tile .aa-ar{font-size:43px;line-height:1.4}.aa-letter-tile small{font-size:12px}.aa-star{position:absolute;top:3px;right:6px;font-size:16px;color:#855600}
.aa-workspace{display:grid;grid-template-columns:.85fr 1.15fr;gap:24px;margin-top:24px;align-items:start}.aa-letter-card{padding:24px;text-align:center;background:#fff4d7;border:1px solid #e8d6a9;border-radius:24px;position:relative}.aa-letter-card .aa-big{font-size:112px;line-height:1.65;display:block}.aa-letter-card .aa-picture{width:175px;height:175px;margin:8px auto}.aa-letter-card h3{margin:0}.aa-word{font-size:46px!important;display:block}.aa-letter-card .aa-actions{justify-content:center}.aa-letter-detail{background:#fff;border:1px solid #dce3d7;border-radius:24px;padding:25px}.aa-vowels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.dah-alphabet .aa-vowel{display:flex;flex-direction:column;padding:12px 6px;gap:1px}.aa-vowel:nth-child(1){background:#fff0d8;border-color:#d1ab65}.aa-vowel:nth-child(2){background:#e5f1f8;border-color:#82afc7}.aa-vowel:nth-child(3){background:#f2e9f8;border-color:#b89dcc}.aa-vowel .aa-ar{font-size:51px;line-height:1.65}.aa-vowel small{font-size:12px}.aa-note{padding:14px 17px;border-radius:14px;background:#eef4e9;font-size:14px;margin:18px 0}.aa-extra{border-top:1px dashed #b8c9b6;margin-top:20px;padding-top:18px}.aa-extra .aa-actions{justify-content:space-between}.aa-sound-status{font-size:14px;min-height:25px;margin:12px 0!important}.aa-next-prev{display:flex;justify-content:space-between;gap:10px;margin-top:20px}.aa-trace-wrap{position:relative;background:#fff;border:2px dashed #a5c1ac;border-radius:18px;overflow:hidden;max-width:420px;margin:15px auto}.aa-trace-wrap canvas{display:block;width:100%;height:auto;touch-action:none}.aa-practice{background:#eaf4e4}.aa-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:18px 0}.dah-alphabet .aa-choice{display:flex;flex-direction:column;min-height:94px;background:#fff;padding:15px}.aa-choice .aa-picture{width:110px;height:110px}.dah-alphabet .aa-choice.aa-correct{border-color:#286252;background:#dff0d6}.dah-alphabet .aa-choice.aa-incorrect{border-color:#af5a27;background:#fff0df}.aa-feedback{min-height:28px;font-weight:700}.aa-progress{width:100%;height:12px;accent-color:#286252;display:block;margin:9px 0 5px}.aa-parent{margin-top:24px;border-top:1px solid #dce3d7;padding-top:20px;font-size:14px}.dah-alphabet summary{cursor:pointer;min-height:44px;font-weight:700;padding:10px 0}.aa-parent li{margin-bottom:8px}.aa-footer{margin-top:24px;font-size:13px;color:#51685f}.aa-award{text-align:center;padding:30px;background:#fff2c9;border-radius:20px}.aa-award-symbol{font-size:56px}.aa-slow{display:inline-flex;align-items:center;gap:8px;font-size:14px}.aa-slow input{width:19px;height:19px;accent-color:#286252}.aa-hidden{display:none!important}
body.aa-course #learn-press-content-item .content-item-wrap{max-width:1180px}body.aa-course #learn-press-content-item .content-item-summary{padding:25px clamp(12px,3vw,40px)}
@media(max-width:767px){body.aa-course #popup-content,body.aa-course #popup-header,body.aa-course #popup-footer{left:0!important;right:0!important;width:100%!important;margin-left:0!important}body.aa-course #popup-sidebar{position:absolute!important;left:0!important;top:70px!important;bottom:50px!important;height:auto!important;transform:translateX(-100%)!important;max-width:calc(100vw - 65px);background:#fff!important;z-index:100}body.aa-course.aa-sidebar-open #popup-course #popup-sidebar{transform:translateX(0)!important}body.aa-course #sidebar-toggle{left:auto!important;right:50px!important}body.aa-course #learn-press-content-item .content-item-summary{padding:18px 12px!important}body.aa-course #popup-content .content-item-wrap{padding:0!important}}
@media(max-width:760px){.dah-alphabet{font-size:16px}.aa-hero{padding:24px;grid-template-columns:1fr}.aa-hero-art{display:none}.aa-missions{grid-template-columns:repeat(2,minmax(0,1fr))}.aa-workspace{grid-template-columns:1fr}.aa-letter-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.aa-panel,.aa-letter-detail{padding:19px}.aa-choices{gap:8px}.aa-choice .aa-picture{width:75px;height:75px}.dah-alphabet button{padding:10px 12px}.aa-letter-card .aa-big{font-size:95px}.aa-letter-card .aa-picture{width:150px;height:150px}.aa-letter-card{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:12px}.aa-letter-card .aa-card-bottom{grid-column:1/-1}.aa-word{font-size:39px!important}}
@media(max-width:420px){.aa-missions{gap:9px}.dah-alphabet .aa-mission{padding:14px}.aa-vowel .aa-ar{font-size:44px}.aa-choices{grid-template-columns:1fr}.dah-alphabet .aa-choice{flex-direction:row;min-height:70px}.aa-choice .aa-picture{margin:0;width:65px;height:65px}.aa-topline{align-items:flex-start}.aa-brand{font-size:11px}.aa-tag{font-size:12px}.aa-panel{padding:16px}}
@media(prefers-reduced-motion:reduce){.dah-alphabet *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.dah-alphabet button,.aa-tabs,.aa-trace-wrap,.aa-parent,.aa-next-prev,.aa-slow{display:none!important}.aa-panel,.aa-letter-card,.aa-letter-detail{break-inside:avoid}.aa-workspace{display:block}.aa-letter-grid{grid-template-columns:repeat(7,1fr)}}
