@font-face{font-family:KFGQPC Uthmanic Hafs;src:url(/assets/kfgqpc-uthmanic-hafs-DKm-HWT8.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap;unicode-range:U+0610-061A,U+0620-0669,U+066E-06D3,U+06D5-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}@font-face{font-family:Noto Nastaliq Urdu;src:url(/assets/noto-nastaliq-urdu-BeZXtT7F.ttf) format("truetype");font-style:normal;font-weight:400 700;font-display:swap}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.arabic{font-family:KFGQPC Uthmanic Hafs,Geeza Pro,Noto Naskh Arabic,serif}.urdu{font-family:Noto Nastaliq Urdu,Urdu Typesetting,serif;line-height:2.8}.latin{font-family:Georgia,Times New Roman,serif}.reading{margin:0;text-align:center;font-size:clamp(35px,3.3vw,53px);line-height:1.95;white-space:pre-wrap;overflow-wrap:anywhere}.reading span{box-decoration-break:clone;-webkit-box-decoration-break:clone;transition:opacity .15s ease}.reading.is-playing span{opacity:.5}.reading.is-playing .active{opacity:1}.reading .matched{background:#edf1e5;color:#476432}.reading .out-of-order{background:#fff0dc;color:#ad5200}.reading .active{background:#e0e9c9;color:#354b24}.spinner{width:17px;height:17px;border:1px solid #c9cbc2;border-top-color:#556b3f;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#15221f;background:#fcfcfa;font-synthesis:none;--green: #214f3c;--muted: #777d7c;--line: #e4e7e1}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea,select{font:inherit;color:inherit}button,select{cursor:pointer}button:disabled{cursor:default;opacity:.4}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #759782;outline-offset:4px}button{border:0;background:transparent}svg{width:24px;height:24px;flex-shrink:0}.primary-button{display:inline-flex;justify-content:center;align-items:center;gap:12px;padding:14px 22px;border-radius:9px;background:#2a5c41;color:#fff;font-size:15px}.primary-button:hover:not(:disabled){background:#1d4934}textarea{display:block;width:100%;min-height:150px;resize:none;overflow:hidden;overflow-wrap:anywhere;padding:20px;border:1px solid #dce4da;border-radius:12px;background:#fafbf7;font:32px/1.9 KFGQPC Uthmanic Hafs,serif}textarea::placeholder{color:#acb3a7}.error{margin:20px 0 0;color:#a2463c;font-size:14px;line-height:1.6}html.feasibility-scroll{scroll-behavior:smooth}.feasibility-page{position:relative;isolation:isolate;min-height:100svh;background:#f8f7f2;color:#294638}.feasibility-page:before{content:"";position:fixed;inset:35% 0 0;background:url(/assets/kaaba-Cy8kcHP4.jpg) center 58% / cover no-repeat;opacity:.09;-webkit-mask-image:linear-gradient(transparent,#000);mask-image:linear-gradient(transparent,#000);z-index:-1;pointer-events:none}.story-header{display:flex;align-items:center;justify-content:flex-end;gap:24px;padding:30px clamp(24px,5vw,80px)}.story-header>a,.story-footer a{display:inline-flex;align-items:center;gap:10px;font-size:13px}.story-header svg,.story-footer svg{width:17px;height:17px}.story-audio-toggle{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;margin-top:24px;color:#294638}.story-audio-toggle svg{width:36px;height:36px}.story-main{width:min(1080px,100%);margin:auto;padding:0 28px;text-align:center}.story-hero{min-height:calc(100svh - 87px);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:70px 0 48px}.story-kicker{margin:0 0 24px;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#647666}.story-hero h1{font:400 clamp(48px,8vw,104px)/1.08 Georgia,serif;letter-spacing:-.055em;color:#294638;margin:0 0 34px}.story-copy{color:#657367;font-size:clamp(15px,1.6vw,18px);line-height:1.85;margin:20px auto 0;max-width:610px;text-wrap:pretty}.story-next,.story-previous{position:fixed;z-index:10;left:50%;transform:translate(-50%);display:grid;place-items:center;width:48px;height:48px;color:#294638}.story-next{bottom:max(20px,env(safe-area-inset-bottom))}.story-previous{top:max(20px,env(safe-area-inset-top))}.story-next svg,.story-previous svg{width:28px;height:28px;transition:transform .2s ease}.story-next:hover svg{transform:translateY(4px)}.story-previous:hover svg{transform:translateY(-4px)}.story-section{min-height:90svh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:110px 0;scroll-margin-top:20px}.story-section h2{font:400 clamp(32px,5vw,58px)/1.16 Georgia,serif;letter-spacing:-.045em;margin:0;text-wrap:balance}.story-arabic{font-size:clamp(38px,6.8vw,74px);line-height:1.9;font-weight:400;margin:55px 0 28px;max-width:100%;overflow-wrap:anywhere}.story-arabic-small{font-size:clamp(32px,4.8vw,52px);margin:26px 0 12px}.story-reading{max-width:100%;overflow-wrap:anywhere;margin:26px 0 18px}.story-reading.arabic{font-size:clamp(32px,4.8vw,52px);line-height:1.9}.story-reading.urdu{font-size:clamp(26px,4vw,40px)}.story-reading.latin{font-size:clamp(22px,3vw,34px);line-height:1.7}.story-reading-slot{display:grid;align-items:center;width:100%;height:180px;flex-shrink:0;margin:26px 0 18px}.story-reading-slot .story-reading{width:100%;margin:0}.story-readings{margin-top:8px}.story-samples{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px}.story-samples button{padding:10px 0;color:#788275;font-size:13px;text-underline-offset:7px}.story-samples button[aria-pressed=true]{color:#294638;text-decoration:underline;text-decoration-thickness:1px}.story-samples button:hover,.story-caption a:hover,.story-footer a:hover{color:#1d4934;text-decoration:underline}.story-sound{display:grid;place-items:center;width:min(660px,100%);margin-top:45px}.story-sound-lines{grid-area:1 / 1;width:100%;height:120px;overflow:visible;fill:none;stroke:#8c9f7f;stroke-width:1;opacity:.5}.story-sound-lines path:last-child{opacity:.5}.story-sound-lines.is-playing{opacity:.85}.story-play{grid-area:1 / 1;position:relative;display:grid;place-items:center;width:78px;height:78px;border-radius:50%;background:#294e3b;color:#fff;transition:transform .2s}.story-play:hover:not(:disabled){transform:scale(1.06)}.story-play:disabled{opacity:1;background:#dce1d5;color:#879280}.story-play svg{width:27px;height:27px}.story-caption{color:#687466;font-size:13px;line-height:1.8;max-width:540px;margin:12px auto 0;text-wrap:pretty}.story-caption a{text-decoration:underline;text-underline-offset:3px}.story-caption bdi{font-size:24px;color:#294638}.story-recording-example{margin:38px 0 28px}.story-example-words{margin:0 0 36px;font-size:clamp(32px,4.8vw,52px)}.story-example-words .example-skipped-word{position:relative;display:inline-block}.example-skipped-word:after{content:"";position:absolute;left:0;right:0;bottom:.15em;height:2px;border-radius:1px;background:#bd4c43;opacity:0;pointer-events:none}.example-skipped-word.is-skipped:after{animation:example-skipped-fade .45s ease both}@keyframes example-skipped-fade{0%{opacity:0}to{opacity:1}}.story-example-control{position:relative;width:78px;height:78px;margin:auto}.story-example-control .demo-record-button{transition:transform .15s ease}.story-example-control .is-clicked{transform:scale(.92)}.story-example-cursor{position:absolute;top:42px;left:45px;width:25px;height:32px;fill:#294638;stroke:#f8f7f2;stroke-width:1.5;pointer-events:none;opacity:0}.story-example-control.is-running .story-example-cursor{animation:example-cursor 1.5s ease both}.story-example-click{position:absolute;inset:-7px;border:1px solid #6f8766;border-radius:50%;opacity:0;pointer-events:none}.story-example-control.is-running .story-example-click{animation:example-click .5s ease-out 1.1s both}@keyframes example-cursor{0%{opacity:0;transform:translate(95px,45px)}15%{opacity:1}70%,84%{opacity:1;transform:translate(0)}90%{opacity:1;transform:scale(.88)}to{opacity:0;transform:scale(1)}}@keyframes example-click{0%{opacity:.8;transform:scale(.85)}to{opacity:0;transform:scale(1.25)}}.story-score{margin-top:40px}.story-score strong{font:400 clamp(92px,15vw,150px)/1 Georgia,serif;letter-spacing:-.07em}.story-score strong span{font-size:.42em;letter-spacing:-.04em;margin-left:7px}.story-score p{color:#687466;font-size:14px;margin:16px 0 0}.story-matched{color:#567344}.story-pipeline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(740px,100%);margin:52px 0 0}.pipeline-flow{position:relative;min-width:0;padding-inline:40px}.pipeline-flow+.pipeline-flow:before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:1px;background:#a0ad9566}.pipeline-flow h3{font:italic 22px/1.4 Georgia,serif;color:#647666;margin:0 0 36px}.pipeline-flow ol{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(100px,auto);gap:36px;list-style:none;padding:0;margin:0}.pipeline-flow li{position:relative;min-width:0}.pipeline-symbol{display:block;margin-bottom:10px;color:#6f8766}.pipeline-symbol svg{width:29px;height:29px}.pipeline-flow strong{font-size:15px;font-weight:500}.pipeline-flow p{font-size:12px;line-height:1.7;color:#687466;margin:8px auto 0;max-width:170px;text-wrap:pretty}.pipeline-connector{position:absolute;bottom:-30px;left:50%;transform:translate(-50%) rotate(90deg);color:#a0ad95}.pipeline-connector svg{width:20px;height:20px}.story-explanation{width:100%}.story-explanation h2{max-width:880px;font-size:clamp(30px,4.4vw,48px)}.story-explanation .explanation-intro{max-width:720px;font-size:18px;line-height:1.75;margin:24px auto 12px}.story-explanation>.story-caption{max-width:720px;line-height:1.8}.story-explanation .story-pipeline{width:min(900px,100%);margin-top:36px}.story-explanation .pipeline-flow p{font-size:14px;max-width:280px}.explanation-comparison{width:min(900px,100%);display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:48px;margin:28px 0;text-align:start}.explanation-reading{padding-block:12px}.explanation-label{display:block;font-size:12px;letter-spacing:.03em;color:#687466}.explanation-reading>p{font-size:14px;line-height:1.8;margin:12px 0 24px}.explanation-reading>.arabic{font-size:32px;line-height:1.9;margin:8px 0 20px}.explanation-reading .explanation-result{display:flex;align-items:center;gap:18px;padding-top:20px;border-top:1px solid #a0ad9566}.explanation-result strong{font:48px/1 Georgia,serif}.explanation-result span{max-width:180px}.explanation-reading .explanation-sounds{font-family:monospace;font-size:20px;letter-spacing:.06em}.explanation-sounds mark{background:#f3e6cd;color:#754813;border-radius:3px;padding:2px 5px}.explanation-table{width:100%;border-collapse:collapse;font-size:13px}.explanation-table caption{text-align:start;color:#687466;font-size:12px;padding:0 0 14px}.explanation-table th{font-weight:500;color:#687466}.explanation-table th,.explanation-table td{text-align:start;padding:12px 10px;border-bottom:1px solid #a0ad9566}.explanation-table .arabic{font-size:25px}.explanation-table code{font-size:19px}.explanation-difference{background:#f3e6cd80;color:#754813}.explanation-notes{display:grid;grid-template-columns:1fr 1fr;gap:48px;width:min(900px,100%);border-top:1px solid #a0ad9566;padding-top:24px;text-align:start}.explanation-notes h3{font:22px/1.4 Georgia,serif;margin:0 0 12px}.explanation-notes p{color:#687466;font-size:14px;line-height:1.8;margin:0 0 12px}.source-preparation{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;width:min(900px,100%);margin:36px 0;padding:0;text-align:start}.source-preparation>li{min-width:0}.source-preparation svg{color:#6f8766;width:30px;height:30px}.source-preparation h3{font:22px/1.4 Georgia,serif;margin:16px 0 12px}.source-preparation p{font-size:14px;line-height:1.8;color:#687466}.source-preparation .arabic{font-size:25px;color:#294638}.source-preparation .source-direction{color:#294638;border-top:1px solid #a0ad9566;padding-top:16px}.technical-sources a{text-decoration:underline;text-underline-offset:3px}.method-cost-scroll{width:min(1000px,100%);overflow-x:auto;margin:24px 0}.method-cost-scroll:focus-visible{outline:2px solid #759782;outline-offset:4px}.method-cost-table{min-width:620px;table-layout:fixed;line-height:1.65}.method-cost-table .metric-column{width:23%}.method-cost-table th,.method-cost-table td{vertical-align:top;padding:12px 16px}.method-cost-table thead th{font-weight:600;color:#294638;background:#edf0e7}.method-cost-table tbody th{font-weight:500;color:#294638}.method-cost-table td+td{border-left:1px solid #a0ad9540}.method-cost-notes{width:min(1000px,100%);margin-top:12px;color:#687466;font-size:13px;line-height:1.8;text-align:start}.method-cost-notes summary{cursor:pointer;padding-block:10px}.story-live-demo{width:min(620px,100%);margin:48px auto 0}.story-demo-explanation{font-size:14px;color:#687466;line-height:1.7;margin:0 0 32px}.method-selector{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:26px;padding:5px;border:1px solid #a0ad9566;border-radius:12px}.method-selector button{padding:12px 18px;border-radius:8px;color:#687466;font-size:13px}.method-selector button[aria-pressed=true]{background:#294e3b;color:#fff}.method-selector button:focus-visible{outline:2px solid #6f8766;outline-offset:3px}.demo-sentence-options{max-height:340px;overflow-y:auto}.phoneme-feedback{margin:24px 0;text-align:start}.phoneme-feedback details{border-bottom:1px solid #a0ad9566;padding:10px 0}.phoneme-feedback summary{display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer}.phoneme-feedback summary .arabic{font-size:26px}.phoneme-feedback table{width:100%;margin-block:12px;border-collapse:collapse;font-size:13px}.phoneme-feedback th,.phoneme-feedback td{padding:8px;text-align:start;border-bottom:1px solid #a0ad9533}.story-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;padding:50px clamp(24px,5vw,80px);color:#687466}.story-footer>span{font:italic 17px/1.6 Georgia,serif}.story-motion .story-reveal{opacity:0;transform:translateY(30px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.story-motion .is-visible .story-reveal,.story-motion .story-section:focus-within .story-reveal{opacity:1;transform:translateY(0)}.story-motion .story-reveal:nth-child(2){transition-delay:.1s}.story-motion .story-reveal:nth-child(n+3){transition-delay:.2s}.story-motion #sentence .story-arabic span{display:inline-block;opacity:0;transform:translateY(15px);transition:opacity .8s ease,transform .8s ease;transition-delay:var(--word-delay)}.story-motion #sentence.is-visible .story-arabic span,.story-motion #sentence:focus-within .story-arabic span{opacity:1;transform:none}.pipeline-animated .pipeline-flow h3,.pipeline-animated .pipeline-flow li{opacity:0}.pipeline-animated.is-visible .pipeline-flow h3,.pipeline-animated.is-visible .pipeline-flow li{animation:pipeline-fade-in .3s ease both;animation-delay:var(--fade-delay)}@keyframes pipeline-fade-in{0%{opacity:0}to{opacity:1}}.demo-readings{margin-bottom:28px}.demo-sentence-options{min-width:0;padding:0;margin:0 0 12px;border:0}.demo-sentence-option{display:block;width:100%;padding:18px 16px;color:#74806f;cursor:pointer;transition:color .2s ease,background .2s ease}.demo-sentence-option:hover:not(:disabled){color:#294638;background-color:#e5ebdd40}.demo-sentence-option .demo-sentence{display:block;margin:0;text-align:center}.demo-sentence-option .story-reading.arabic{font-size:clamp(26px,4vw,36px)}.demo-sentence-options:disabled .demo-sentence-option{cursor:default;opacity:.5}.demo-create-new{display:flex;align-items:center;justify-content:center;gap:12px;width:fit-content;padding:14px 18px;margin:12px auto 28px;border-radius:6px;background:transparent;font-size:14px;color:#3f6248}.demo-create-new svg{width:22px;height:22px}.demo-create-new:hover:not(:disabled){color:#294638;text-decoration:underline;text-underline-offset:4px}.feasibility-demo .demo-sentence-editor{margin:24px 0;padding:14px 0;border:0;border-bottom:1px solid #a0ad9580;border-radius:0;background:transparent;font-size:clamp(26px,4vw,36px);line-height:1.9;min-height:140px;resize:vertical;overflow:auto}.demo-sentence-editor::placeholder{color:#879280}.feasibility-demo .primary-button{border-radius:4px;min-height:49px;padding:12px 22px;font-size:14px}.feasibility-demo .primary-button svg,.feasibility-demo .secondary-button svg{width:19px;height:19px}.feasibility-demo .secondary-button{display:inline-flex;align-items:center;gap:9px;padding:14px;font-size:13px}.demo-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}.demo-status{display:flex;align-items:center;justify-content:center;gap:10px;margin:18px 0 0;font-size:12px;line-height:1.8;color:#687466}.demo-sentence{margin:30px 0;line-height:1.9;overflow-wrap:anywhere}.demo-reset{font-size:12px;color:#687466;padding:14px;margin-top:12px;text-decoration:underline;text-underline-offset:4px}.demo-play-record{display:flex;align-items:center;justify-content:center;gap:22px}.demo-record-button,.demo-play-button{display:inline-grid;place-items:center;width:78px;height:78px;border-radius:50%;background:#294e3b;color:#fff}.demo-record-button svg,.demo-play-button svg{width:30px;height:30px}.demo-play-button{background:#e8eee2;color:#294e3b}.demo-countdown{font-size:30px;font-variant-numeric:tabular-nums}.demo-record-button.is-recording svg{animation:demo-microphone-flash 1.2s ease-in-out infinite}@keyframes demo-microphone-flash{50%{opacity:.25}}.demo-score{display:flex;flex-direction:column;align-items:center;gap:12px;font-size:14px}.demo-score strong{font:400 80px/1 Georgia,serif;letter-spacing:-4px}.demo-score small{color:#ad5200}@media(max-width:760px){.story-header{position:absolute;inset:0 0 auto;z-index:1;padding:24px;gap:12px}.story-header>a{font-size:12px;gap:6px}.story-main{padding-inline:24px}.story-hero,.story-section{height:100svh;height:100dvh;min-height:0;padding-block:72px;justify-content:safe center;overflow-y:auto;scroll-margin-top:0}.story-hero>*,.story-section>*{flex-shrink:0}.story-section.story-explanation{height:auto;min-height:100svh;overflow:visible}.story-explanation .explanation-intro{font-size:16px}.story-explanation .pipeline-flow p{font-size:12px;line-height:1.7}.story-explanation .pipeline-flow ol{grid-auto-rows:minmax(124px,auto)}.explanation-comparison,.explanation-notes{grid-template-columns:1fr;gap:20px}.source-preparation{grid-template-columns:1fr;gap:24px;margin-block:28px}.explanation-comparison{margin-top:16px}.explanation-reading>.arabic{font-size:30px}.explanation-table th,.explanation-table td{padding-inline:8px}.story-hero h1{font-size:clamp(44px,10vw,66px)}.story-arabic{margin-top:36px}.story-listen .story-sound{margin-top:24px}.story-listen .story-sound-lines{height:88px}.story-reading-slot{height:176px;margin:12px 0 8px}.story-samples{gap:4px 18px}.story-pipeline{margin-top:24px}.pipeline-flow{padding-inline:10px}.pipeline-flow h3{font-size:17px;min-height:48px;margin-bottom:14px;text-wrap:balance}.pipeline-flow ol{grid-auto-rows:minmax(84px,auto);gap:18px}.pipeline-flow strong{font-size:12px}.pipeline-flow p{font-size:10px;line-height:1.5;margin-top:4px}.pipeline-symbol{margin-bottom:5px}.pipeline-symbol svg{width:22px;height:22px}.pipeline-connector{bottom:-18px}.pipeline-connector svg{width:14px;height:14px}.story-live-demo{margin-top:24px}.story-demo-explanation{margin-bottom:18px}.demo-readings{margin-bottom:16px}.demo-sentence-option{padding:12px 8px}.demo-create-new{margin-bottom:0}.story-footer{flex-direction:column;text-align:center;padding-block:36px}}@media(max-width:760px)and (max-height:700px){.story-hero,.story-section{padding-block:56px}.story-next{bottom:max(4px,env(safe-area-inset-bottom))}.story-previous{top:max(4px,env(safe-area-inset-top))}.story-kicker{margin-bottom:12px}.story-section h2{font-size:28px}.story-copy{font-size:14px;line-height:1.65;margin-top:12px}.story-listen .story-sound{margin-top:16px}.story-listen .story-sound-lines{height:78px}.story-reading-slot{height:144px}.story-reading.urdu{font-size:24px}.story-reading.latin{font-size:20px}.story-reading.arabic,.story-arabic-small,.story-example-words{font-size:30px}.story-recording-example{margin:20px 0 12px}.story-example-words{margin-bottom:20px}.story-score{margin-top:20px}.story-score strong{font-size:76px}.story-arabic-small{margin:16px 0 8px}.story-pipeline{margin-top:12px}.pipeline-flow{padding-inline:6px}.pipeline-flow h3{font-size:15px;min-height:38px;margin-bottom:8px}.pipeline-flow ol{grid-auto-rows:minmax(68px,auto);gap:10px}.pipeline-symbol{margin-bottom:3px}.pipeline-symbol svg{width:20px;height:20px}.pipeline-connector{bottom:-13px}.story-live-demo{margin-top:16px}.story-demo-explanation{font-size:13px;margin-bottom:12px}.demo-sentence-option{padding-block:8px}.demo-sentence-option .story-reading.arabic{font-size:24px}.demo-create-new{padding-block:12px}}@media(prefers-reduced-motion:reduce){html.feasibility-scroll{scroll-behavior:auto}.story-motion .story-reveal,.story-motion #sentence .story-arabic span{opacity:1;transform:none}.demo-record-button.is-recording svg{animation:none}}