:root{--ink:#132d46;--muted:#576878;--line:#dce3e8;--bg:#f5f7f9;--accent:#94651a;--arabic:2rem;font-family:Tahoma,Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:16px}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:transparent;border:1px solid var(--line);border-radius:8px;min-height:44px;padding:8px 14px}button:hover{background:#e8eef3}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #b28638;outline-offset:4px}a{color:inherit}.top{height:100px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:flex;gap:14px;align-items:center;font-size:1.75rem;font-weight:700}.brand small{display:block;font-size:.75rem;font-weight:400;letter-spacing:.1em;margin-top:5px}.mark{background:var(--ink);color:#fff;width:47px;height:52px;border-radius:22px 22px 5px 5px;text-align:center;padding-top:7px;font-family:serif;font-size:2rem}.top-actions{display:flex;align-items:center;gap:22px;font-size:.875rem}#offline{color:var(--muted);max-width:230px}.layout{max-width:1360px;margin:auto;display:grid;grid-template-columns:250px minmax(0,1fr);gap:60px;padding:54px 5%}aside{padding-top:9px}.eyebrow{font-size:.875rem;color:var(--accent);margin:0 0 18px}nav{display:grid;gap:8px}nav button{border:0;display:flex;align-items:center;gap:14px;text-align:start;padding:16px;font-size:1rem}nav button[aria-current=true]{background:var(--ink);color:#fff}nav .symbol{font-size:1.5rem;width:30px;text-align:center}nav small{margin-inline-start:auto;font-size:.875rem;opacity:.7}.aside-note{margin:42px 16px;border-top:1px solid var(--line);padding-top:30px;color:var(--muted);line-height:1.9}.aside-note p{font-size:1rem}.aside-note small{font-size:.875rem}.little-mark{color:var(--accent);font-size:1.75rem}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.heading h1{font-size:2.7rem;letter-spacing:-.03em;margin:0 0 14px;font-weight:500}.heading p:last-child{color:var(--muted);line-height:1.8;margin:0}.section-symbol{color:var(--accent);font-size:5.5rem;font-family:serif;font-weight:normal}.reading-options{margin:30px 0 24px;padding:15px 0;display:flex;align-items:center;gap:26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.875rem}.reading-options label{display:flex;gap:8px;align-items:center;cursor:pointer;min-height:44px}input{width:18px;height:18px;accent-color:var(--ink)}.font-options{margin-inline-start:auto;display:flex;gap:6px}.font-options button{border:0}.progress-row{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;color:var(--muted)}.progress-row button{border:0;padding:4px 0;min-height:32px;font-size:.875rem}.progress-track{height:3px;background:#e2e7eb;margin:10px 0 26px}.progress-track>div{height:100%;background:var(--accent);transition:width .2s}.card{background:white;border:1px solid var(--line);border-radius:12px;margin-bottom:22px;padding:28px 32px;box-shadow:0 4px 18px #132d4603}.card.done{border-color:#789a96}.card-top{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:.875rem;color:var(--muted)}.card h2{font-size:.95rem;font-weight:400;margin:0}.number{font-variant-numeric:tabular-nums;color:var(--accent)}.arabic{font-family:"Geeza Pro","Noto Naskh Arabic","Traditional Arabic",serif;font-size:var(--arabic);line-height:2.1;text-align:right;direction:rtl;margin:24px 0 28px;color:#122a41}.translation,.transliteration{direction:ltr;text-align:left;font-size:1rem;line-height:1.8;color:#465b6e;margin:18px 0}.transliteration{color:#6c5936;font-style:italic}.card-bottom{border-top:1px solid #edf0f2;padding-top:20px;display:flex;gap:15px;align-items:center;justify-content:space-between}.source{font-size:.8125rem;color:var(--muted);text-decoration:none}.source:hover{text-decoration:underline}.counter-group{display:flex;gap:8px;align-items:center}.count{background:var(--ink);color:white;min-width:145px;border-color:var(--ink);display:flex;justify-content:space-between;gap:20px}.count:hover{background:#284763}.count:disabled{background:#e6efed;color:#355a53;border-color:#e6efed;cursor:default}.undo{border:0;font-size:1.2rem}.count b{font-weight:400;direction:ltr}.card.done .number{color:#355a53}footer{font-size:.8125rem;color:var(--muted);line-height:1.9;padding:10px 0 20px;text-align:center}[hidden]{display:none!important}@media(max-width:950px){.layout{gap:28px;grid-template-columns:200px minmax(0,1fr);padding:36px 4%}.card{padding:24px}.heading h1{font-size:2.2rem}.reading-options{gap:12px}.section-symbol{font-size:4rem}}@media(max-width:700px){.top{height:82px;padding:0 5%}.top-actions{gap:10px}#offline{font-size:.75rem;max-width:120px}.layout{display:block;padding:22px 5%}aside{padding:0}aside .eyebrow,.aside-note{display:none}#categories{display:grid;overflow:visible;padding:0;margin:0;gap:8px}nav button{white-space:nowrap;flex-shrink:0;border:1px solid var(--line);padding:10px 13px;font-size:.875rem}nav .symbol{font-size:1.2rem;width:auto}nav small{display:none}.heading h1{font-size:2.15rem}.heading .eyebrow{margin-bottom:10px}.section-symbol{font-size:3.5rem}.reading-options{flex-wrap:wrap;margin-top:20px;gap:4px 12px}.font-options{gap:0}.font-options button{padding:8px}.card{padding:22px 20px}.arabic{font-size:calc(var(--arabic)*.9);line-height:2}.card-bottom{flex-wrap:wrap}.counter-group{margin-inline-start:auto}.source{font-size:.75rem}.count{min-width:132px}.brand{font-size:1.4rem}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Mobile controls and accessible reading/sharing. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip-link{position:fixed;inset-block-start:10px;inset-inline-start:10px;transform:translateY(-160%);background:var(--ink);color:white;padding:15px;z-index:20}.skip-link:focus{transform:none}svg{width:24px;height:24px;vertical-align:middle}.section-symbol svg{width:72px;height:72px}.heading .eyebrow a{text-decoration:none}.heading .eyebrow a:hover{text-decoration:underline}.time-suggestion{margin-top:22px;display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:.875rem;color:var(--muted);line-height:1.7}.time-suggestion button{font-size:.875rem;text-align:start;flex-shrink:0}.helper{font-size:.875rem;color:var(--muted);line-height:1.8}.count{min-width:140px;min-height:56px;justify-content:center;font-size:1.3rem;font-variant-numeric:tabular-nums;touch-action:manipulation}.count[aria-disabled=true]{background:#e6efed;color:#355a53;border-color:#e6efed;cursor:default}.undo,.icon-button{min-width:48px;min-height:48px;touch-action:manipulation}.counter-group{margin-inline-start:auto}.progress-row button{min-height:44px;padding:8px}.references{border-top:1px solid var(--line);margin-top:18px;padding-top:6px;color:var(--muted);font-size:.875rem;line-height:1.9}.references summary{padding:12px 0;min-height:48px;cursor:pointer;font-weight:500}.references p{margin:4px 0 10px}.references a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px}.references ul{margin:0;padding-inline-start:20px}.top{height:auto;min-height:100px;gap:16px;padding-block:16px}.top-actions{flex-wrap:wrap;justify-content:flex-end}button:disabled{opacity:.65;cursor:default}#main:focus,#title:focus{outline:none}#title:focus-visible{outline:2px solid var(--accent);outline-offset:6px}dialog{border:1px solid var(--line);border-radius:16px;padding:24px;width:calc(100% - 32px);max-width:560px;max-height:90dvh;overflow:auto;color:var(--ink);background:white}dialog::backdrop{background:#071827b8}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.dialog-heading h2{font-size:1.35rem;margin:0}.dialog-heading button{min-height:48px}.share-actions{display:flex;flex-wrap:wrap;gap:10px}.share-actions>*{flex:1 1 42%;min-height:48px;text-align:center;font-size:1rem}.button{display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;padding:10px 14px;text-decoration:none}#sharePreview img{display:block;width:100%;height:auto;border-radius:8px}#shareStatus{font-size:.875rem;line-height:1.8}#manualCopy{width:100%;min-height:180px;font:inherit;margin-top:16px}.reading-options{flex-wrap:wrap}.card h2{line-height:1.7}footer{font-size:.875rem}#offline{font-size:.875rem}.font-options button{min-width:44px;min-height:44px}a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}@media(max-width:700px){.time-suggestion{display:block}.time-suggestion span{display:block}.time-suggestion button{margin-top:8px}.top{min-height:82px}.section-symbol svg{width:48px;height:48px}.count{min-width:126px}.card-bottom{gap:8px;flex-wrap:nowrap}.reading-options label{min-height:48px}.layout{padding-bottom:max(24px,env(safe-area-inset-bottom))}.heading h1{font-size:clamp(1.8rem,7vw,2.15rem)}.heading .eyebrow{line-height:1.8}.section-symbol{flex-shrink:0}.brand{flex-shrink:0}.top-actions{gap:8px;max-width:55%}#offline{max-width:none;font-size:.8125rem}}@media(forced-colors:active){.count,nav button[aria-current=true]{border:2px solid ButtonText}.progress-track{border:1px solid CanvasText}.progress-track>div{background:Highlight}svg{forced-color-adjust:auto}}

.library-button{width:100%;margin-top:16px;padding:16px;border:1px solid #b49460;border-radius:12px;color:#132d46;background:#fbf7ee;font:inherit;cursor:pointer;min-height:48px}.instruction{background:#f3f5f7;border-inline-start:3px solid #b49460;padding:12px 18px;margin:20px 0;border-radius:8px;line-height:1.9}.instruction p{margin:4px 0}.recitation+.recitation{border-top:1px solid #dce3e8;margin-top:24px;padding-top:12px}.variant-label{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:16px 0;font-size:.95rem}select,#librarySearch{font:inherit;padding:12px;border:1px solid #7b8b98;border-radius:8px;background:white;color:#132d46;max-width:100%;min-height:48px}#librarySearch{width:100%;box-sizing:border-box;margin-top:10px}#chapterList{display:grid;gap:8px;max-height:55vh;overflow:auto;padding:4px}#chapterList button{display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:start;min-height:56px;padding:14px;background:#f4f7f9;color:#132d46;border:1px solid #dce3e8;border-radius:9px;font:inherit;cursor:pointer}#chapterList small{font-variant-numeric:tabular-nums}.recitation.done .count{background:#dceadf;color:#21472d}.arabic{overflow-wrap:anywhere}.references a{display:inline-block;padding-block:8px}#creditsLink{color:#235978}#sharePreview a{display:block;padding:14px} @media(max-width:680px){.library-button{margin:10px 0}.card{padding:22px 18px}.variant-label select{width:100%}dialog{max-width:calc(100vw - 32px);box-sizing:border-box}.section-symbol{flex-shrink:0}}

select:focus-visible{outline:3px solid #986822;outline-offset:4px}

.chapter-sources{background:#fff;padding:20px;border:1px solid #dce3e8;border-radius:12px;margin-top:24px}.chapter-sources li{line-height:1.9;margin-bottom:12px}

@font-face{font-family:'Amiri Share';src:url('./fonts/Amiri-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:block}#sharePreview{background:#eceeea;padding:16px;border-radius:14px}#sharePreview img{box-shadow:0 8px 24px #163f3517;border-radius:3px;max-width:100%;height:auto}#sharePreview a{text-align:center;color:#36564b;font-weight:600;margin-bottom:20px}#sharePreview a:last-child{margin-bottom:0}

/* Mobile navigation and consistent Arabic typography. */
@font-face{font-family:'Noto Arabic';src:url('./fonts/NotoSansArabic.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{font-family:'Noto Arabic',Tahoma,Arial,sans-serif}.heading h1{font-weight:600;letter-spacing:0;line-height:1.65}.arabic{font-family:'Amiri Share',serif;line-height:2.05}.card h2{font-family:'Noto Arabic',sans-serif;font-weight:500}.brand{font-weight:600}.menu-button,.mobile-only{display:none}
#mobileMenu{margin:0;inset-block:0;inset-inline-start:auto;inset-inline-end:0;height:100dvh;max-height:100dvh;width:min(88vw,360px);max-width:100%;border-radius:0;padding:24px 20px;padding-bottom:max(24px,env(safe-area-inset-bottom));border:0}html[dir=rtl] #mobileMenu{inset-inline-start:0;inset-inline-end:auto}#mobileMenu .dialog-heading{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:24px}#mobileMenu nav{display:grid;overflow:visible;gap:8px;margin:0;padding:0}#mobileMenu nav button{width:100%;white-space:normal;font-size:1rem;min-height:60px;display:flex;gap:14px;padding:14px 16px;border:0}#mobileMenu nav small{display:block}#mobileMenu nav .symbol{width:30px}#mobileMenu .eyebrow{display:block}#mobileMenu .aside-note{display:block;margin:24px 10px 0}#mobileMenu .library-button{margin:20px 0 0}#closeMenu{min-width:48px;font-size:1.2rem}
.reward{margin-top:22px;border:1px solid #d6e3da;background:#f2f7f3;border-radius:12px;overflow:hidden;color:#254c3b;font-size:.95rem;line-height:1.9}.reward summary{padding:14px 18px;min-height:52px;cursor:pointer;font-weight:600}.reward summary span{font-size:.75rem;font-weight:400;margin-inline-start:12px}.reward-body{padding:0 18px 18px}.reward-body p{margin:10px 0}.reward-condition{color:#3c5348}.reward-source{font-size:.82rem}.reward-source a{display:inline-block;min-height:44px;padding-block:8px;text-underline-offset:4px}.reward small{font-size:.75rem;color:#53675a}
@media(max-width:700px){#desktopNavigation{display:none}.menu-button{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:10px}.mobile-only{display:block}#offline{display:none}.top{min-height:80px;padding:12px 5%;gap:10px}.top-actions{max-width:none;flex-wrap:nowrap;gap:6px}.brand{font-size:1.2rem;gap:9px}.brand small{font-size:.65rem}.mark{width:38px;height:44px;font-size:1.7rem}#language{font-size:.8rem;padding:8px;min-height:48px}.layout{padding:24px 5%}.heading h1{font-size:1.9rem;line-height:1.65}.heading .eyebrow{font-size:.75rem}.section-symbol{display:none}.arabic{font-size:var(--arabic);line-height:2.05;margin-block:22px}.reading-options{padding-block:12px;gap:4px 14px;font-size:.8rem}.reading-options label{flex:1 1 100%}.font-options{margin-inline-start:0}.card{border-radius:16px;padding:22px 18px}.card h2{font-size:.8rem}.time-suggestion{font-size:.8rem}.time-suggestion button{width:100%;text-align:center;background:#edf2ef;border-color:#d5ded8}.reward{font-size:.9rem}}

/* One reading block per surah, with a full-width thumb target. */
.entry-group{margin-bottom:30px}.entry-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:26px 4px 14px}.entry-heading h2{font-size:1rem;font-weight:500;line-height:1.8;margin:0}.entry-group>.reward{margin-bottom:18px}.card.reading-card{padding:0;overflow:hidden;border-radius:16px;margin-bottom:20px}.reading-header{padding:18px 22px 4px;display:flex;justify-content:space-between;align-items:center;gap:12px}.reading-header h3{font-size:1rem;line-height:1.8;font-weight:500;margin:0}.reading-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.reading-actions button{border:0}.reading-sources{margin:0 22px;padding:0;border-top:0;border-bottom:1px solid var(--line)}.reading-sources summary{font-size:.8rem;padding:8px 0;min-height:44px}.reading-body{padding:0 24px 12px}.reading-body .arabic{margin:22px 0}.reading-card>.count{display:flex;width:100%;min-width:0;min-height:76px;justify-content:center;align-items:center;border:0;border-top:1px solid #ffffff15;border-radius:0;margin:0;padding:18px 24px;font-size:1.5rem;touch-action:manipulation}.reading-card>.count:focus-visible{outline:3px solid #dcb66f;outline-offset:-6px}.entry-group .recitation+.recitation{padding-top:0;margin-top:20px}.entry-group>.instruction{margin-bottom:18px}.entry-group>.reading-sources{margin:0 4px 16px}@media(max-width:700px){.reading-header{padding:14px 16px 2px;gap:8px}.reading-header h3{font-size:.9rem}.reading-sources{margin-inline:18px}.reading-body{padding-inline:18px}.reading-card>.count{min-height:80px}.entry-heading h2{font-size:.9rem}.reading-actions .undo,.reading-actions .icon-button{min-width:44px;min-height:48px;padding:8px}}

/* Clearly labelled secondary controls and a calm completed state. */
.reading-header{flex-direction:column;align-items:stretch;gap:14px;padding-bottom:10px}.reading-header h3{font-size:1rem}.reading-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:340px}.reading-actions .share,.reading-actions .undo{display:flex;align-items:center;justify-content:center;gap:9px;min-height:50px;min-width:0;padding:10px 16px;border:1px solid #cbd7de;border-radius:12px;background:#f2f6f8;color:#234558;font-size:.9rem;font-weight:500;line-height:1.5}.reading-actions svg{width:20px;height:20px;flex-shrink:0}.reading-actions button:hover:not(:disabled){background:#e4edf1;border-color:#829ba8}.reading-actions button:disabled{opacity:1;background:#f7f8f9;color:#73818a;border-color:#e2e7eb}.card.reading-card{transition:background-color .18s ease,border-color .18s ease}.card.reading-card.done{background:#eef6ef;border-color:#91b19a}.reading-card.done .reading-sources{border-color:#cadccd}.reading-card.done .reading-header h3,.reading-card.done .arabic{color:#244735}.reading-card.done>.count{background:#d4e7d8;color:#244735;border-top-color:#b9d3c0}.reading-card>.count{gap:12px}.reading-card>.count svg{width:24px;height:24px}.reading-card.done .reading-actions .share,.reading-card.done .reading-actions .undo{background:#f8fbf8;border-color:#bfd3c4;color:#31543d}.reading-card.done .reading-actions button:hover:not(:disabled){background:#e0eee3;border-color:#91b19a}@media(max-width:700px){.reading-header{padding:18px 18px 8px;gap:14px}.reading-header h3{font-size:.95rem}.reading-actions{max-width:none}.reading-actions .share,.reading-actions .undo{min-height:52px;font-size:.85rem;padding:12px}.reading-sources summary{padding-block:10px}}

/* Reference layout: edge-to-edge action tiles beside the heading. */
.card.reading-card .reading-header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:0;padding:0;border-bottom:1px solid var(--line)}.reading-heading{min-width:0;padding:22px 24px 10px;min-height:132px}.reading-heading h3{font-size:1.05rem;font-weight:600;line-height:1.8}.reading-heading .reading-sources{margin:8px 0 0;border:0;padding:0}.reading-heading .reading-sources summary{min-height:44px;padding:8px 0;font-weight:500}.reading-heading .reading-sources a{overflow-wrap:anywhere}.card.reading-card .reading-actions{display:grid;grid-template-columns:repeat(2,96px);gap:0;max-width:none;width:auto;align-self:start;min-height:132px}.card.reading-card .reading-actions .share,.card.reading-card .reading-actions .undo{flex-direction:column;gap:10px;width:100%;min-height:132px;border:0;border-radius:0;padding:16px 8px;font-size:1rem;font-weight:700;color:#fff;opacity:1;box-shadow:none}.card.reading-card .reading-actions .share{background:#17253f}.card.reading-card .reading-actions .undo{background:#8e6b26}.card.reading-card .reading-actions .share:hover{background:#263d5c}.card.reading-card .reading-actions .undo:hover:not(:disabled){background:#765719}.card.reading-card .reading-actions .undo:disabled{background:#a18444;color:#fff}.card.reading-card .reading-actions svg{width:24px;height:24px}.reading-actions button:focus-visible{outline:3px solid #fff;outline-offset:-6px}.reading-body .arabic{text-align:center}.reading-body{padding-top:10px;padding-bottom:24px}.reading-card>.count{flex-direction:column;gap:8px;min-height:126px;padding:18px 16px;background:#17253f}.count-value{display:flex;align-items:center;justify-content:center;gap:12px;font-size:2.35rem;line-height:1.4}.count-value b{font-weight:700}.count-help{font-size:.8rem;font-weight:500;line-height:1.8;color:#d5dce5}.reading-card.done>.count .count-help{color:#365442}.reading-card.done .reading-header{border-bottom-color:#cadccd}@media(max-width:700px){.reading-heading{padding:16px 14px 8px;min-height:112px}.reading-heading h3{font-size:.86rem}.reading-heading .reading-sources summary{font-size:.72rem;line-height:1.8}.card.reading-card .reading-actions{grid-template-columns:repeat(2,clamp(62px,18vw,84px));min-height:112px}.card.reading-card .reading-actions .share,.card.reading-card .reading-actions .undo{min-height:112px;font-size:.88rem;gap:9px;padding:12px 6px}.card.reading-card .reading-actions svg{width:22px;height:22px}.reading-body{padding-top:8px;padding-bottom:20px}.reading-card>.count{min-height:116px}.count-value{font-size:2.1rem}.count-help{font-size:.72rem}}
