@layer tokens{:root{color-scheme:light dark;--bg:light-dark(#f1eadd,#13160f);--panel:light-dark(#fbf8f1,#1b1e15);--panel-2:light-dark(#f6efe3,#20241a);--ink:light-dark(#14170f,#f5f2e9);--muted:light-dark(#51493d,#b3ac9e);--green:light-dark(#24533b,#79bb90);--green-soft:light-dark(#e6eee4,#1a2418);--green-line:light-dark(#9bac9f,#425746);--earth:light-dark(#64431e,#d2a56a);--earth-soft:light-dark(#efe4d1,#241d12);--earth-line:light-dark(#b6a586,#5d503a);--rule-strong:light-dark(#908673,#6b6e61);--rule:light-dark(#b0a693,#505346);--rule-faint:light-dark(#cac0ad,#3e4134);--shadow:light-dark(#46371917,#00000059);--ink-faint:color-mix(in oklab, var(--ink) 12%, transparent);--focus:color-mix(in oklab, var(--green) 70%, var(--ink));--step--2:clamp(.65rem, .63rem + .1vw, .72rem);--step--1:clamp(.8rem, .77rem + .14vw, .9rem);--step-0:clamp(1rem, .96rem + .21vw, 1.125rem);--step-1:clamp(1.2rem, 1.14rem + .28vw, 1.35rem);--step-2:clamp(1.44rem, 1.35rem + .42vw, 1.66rem);--step-3:clamp(1.73rem, 1.59rem + .65vw, 2.07rem);--step-4:clamp(2.07rem, 1.86rem + 1vw, 2.6rem);--step-5:clamp(2.49rem, 2.15rem + 1.6vw, 3.3rem);--leading-tight:1.25;--leading-body:1.65;--measure:66ch;--measure-wide:78ch;--font-latin:Georgia, "Iowan Old Style", "Times New Roman", serif;--font-arabic:"Amiri", "Scheherazade New", "Noto Naskh Arabic", serif;--font-quran:"Amiri Quran", "Amiri", "Scheherazade New", serif;--font-ui:system-ui, -apple-system, sans-serif;--ar-scale:1.6;--ar-min:20px;--ar-floor:calc(var(--ar-min) * var(--fs));--ar-leading:1.9;--ar-inline-scale:1.18;--ar-x-adjust:.5;--sp-1:calc(.25rem * var(--fs));--sp-2:calc(.5rem * var(--fs));--sp-3:calc(.75rem * var(--fs));--sp-4:calc(1rem * var(--fs));--sp-5:calc(1.5rem * var(--fs));--sp-6:calc(2rem * var(--fs));--sp-7:calc(3rem * var(--fs));--sp-8:calc(4rem * var(--fs));--sp-section:calc(clamp(3rem, 2rem + 4vw, 5.5rem) * var(--fs));--gutter:clamp(1.25rem, .9rem + 1.6vw, 2.25rem);--bar-min:calc(3.25rem * var(--fs));--radius-1:4px;--radius-2:10px;--radius-3:16px;--hairline:1px;--rule-w:2px;--fs:1}}@layer base{@font-face{font-family:Amiri Quran;src:url(/fonts/AmiriQuran.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Amiri;src:url(/fonts/Amiri-400.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Amiri;src:url(/fonts/Amiri-700.woff2)format("woff2");font-weight:700;font-display:swap}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);font-family:var(--font-latin);font-size:calc(var(--step-0) * var(--fs));line-height:var(--leading-body);-webkit-font-smoothing:antialiased;text-wrap:pretty;margin:0}section{content-visibility:auto;contain-intrinsic-size:auto 500px}h1,h2,h3{line-height:var(--leading-tight);text-wrap:balance;margin:0}p{margin:0}a{color:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:var(--radius-1)}[lang=ar]{font-family:var(--font-arabic);font-size-adjust:var(--ar-x-adjust);line-height:var(--ar-leading)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}}@layer layout{.page{--pad:var(--gutter)}.wrap{max-width:60rem;padding-inline:var(--gutter);margin-inline:auto}.wrap-wide{max-width:72rem;padding-inline:var(--gutter);margin-inline:auto}.stack>*+*{margin-block-start:var(--flow,var(--sp-5))}section+section{margin-block-start:var(--sp-section)}.lane{container:lane/inline-size}.pair{gap:var(--sp-3);direction:ltr;display:grid}@container lane (width>=34rem){.pair{gap:var(--sp-6);grid-template-columns:1fr 1fr;align-items:start}.pair>.ar{grid-area:1/2}.pair>.en{grid-area:1/1}}.pair>.ar{font-family:var(--font-arabic);font-size:max(calc(var(--step-0) * var(--ar-scale) * var(--fs)), var(--ar-floor));line-height:1.9}.ar{text-align:right;max-inline-size:var(--measure);direction:rtl;margin-inline-start:auto}.en{text-align:left;max-inline-size:var(--measure);direction:ltr}}@layer components{.reader-bar{z-index:10;background:color-mix(in oklab, var(--bg) 88%, transparent);backdrop-filter:blur(10px);border-block-end:var(--hairline) solid var(--rule);position:sticky;inset-block-start:0}.reader-bar .inner{max-width:72rem;padding-inline:var(--gutter);align-items:center;gap:var(--sp-4);min-block-size:var(--bar-min);direction:rtl;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);margin-inline:auto;display:grid}.bar-surah{align-items:baseline;gap:var(--sp-2);display:flex}.bar-surah svg{scale:-1 1}.bar-surah .b-ar{font-size:max(calc(var(--step--1) * var(--fs)), var(--ar-floor));color:var(--ink)}.bar-surah .b-en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.1em;text-transform:uppercase;color:var(--muted);direction:ltr;unicode-bidi:isolate}@media (width<=30rem){.bar-surah .b-en,.bar-pos{display:none}.reader-bar .inner{justify-content:space-between;display:flex}}.bar-pos{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.12em;text-transform:uppercase;color:var(--muted);white-space:nowrap;direction:ltr;unicode-bidi:isolate}.bar-tools{align-items:center;gap:var(--sp-1);justify-content:flex-end;display:flex}.reader-bar .progress{background:var(--green);transform-origin:100%;block-size:2px;animation:linear both reader-progress scroll(root);scale:0 1}@keyframes reader-progress{to{scale:1}}@media (prefers-reduced-motion:reduce){.reader-bar .progress{display:none}}.ctl{align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-1);font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.08em;text-transform:uppercase;color:var(--muted);cursor:pointer;border:0;background:0 0;border-block-end:1.5px solid #0000;text-decoration:none;transition:color .15s,border-color .15s;display:inline-flex}.ctl svg{flex:none;block-size:1.4em;inline-size:1.4em}.ctl:hover{color:var(--ink);border-block-end-color:var(--rule)}.ctl:focus-visible{color:var(--ink);box-shadow:0 2px 0 var(--focus);outline:none}.ctl[aria-pressed=true]{color:var(--ink);border-block-end-color:var(--ink)}.ctl-icon{padding:var(--sp-2)}.fs-btn{padding:var(--sp-2);gap:var(--sp-2)}.fs-btn svg{inline-size:calc(1.25rem * var(--fs));block-size:calc(1.25rem * var(--fs))}.fs-step{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.08em;text-align:start;min-inline-size:1.5em;color:var(--ink)}.ctl-icon svg{inline-size:calc(1.25rem * var(--fs));block-size:calc(1.25rem * var(--fs))}.theme-btn .i{line-height:0;display:none}.theme-btn[data-mode=system] .i-system,.theme-btn[data-mode=light] .i-light,.theme-btn[data-mode=dark] .i-dark{display:inline-flex}.vl-trigger{anchor-name:--vl}.vlist{position-anchor:--vl;inset:auto;top:calc(anchor(bottom) + var(--sp-2));left:anchor(left);inline-size:min(24rem, calc(100vw - 2 * var(--gutter)));overscroll-behavior:contain;max-block-size:min(60vh,28rem);padding:var(--sp-4);background:var(--panel);border:var(--hairline) solid var(--rule);border-radius:var(--radius-2);box-shadow:0 10px 30px var(--shadow);position-try-fallbacks:flip-inline;margin:0;position:fixed;overflow:auto}@media (width<=30rem){.vlist{left:var(--gutter);right:var(--gutter);inline-size:auto}}.vl-cap{align-items:baseline;gap:var(--sp-2);border-block-end:var(--hairline) solid var(--rule-faint);direction:rtl;padding-block-end:var(--sp-3);display:flex}.vl-cap .ar{font-family:var(--font-arabic);font-size:max(calc(var(--step--1) * var(--ar-scale) * var(--fs)), var(--ar-floor));color:var(--ink)}.vl-cap .en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.vlist ol{margin:0;padding:0;list-style:none}.vlist a{gap:var(--sp-3);padding:var(--sp-3) var(--sp-2);border-block-end:var(--hairline) solid var(--rule-faint);border-radius:var(--radius-1);direction:rtl;grid-template-columns:auto minmax(0,1fr);align-items:baseline;text-decoration:none;display:grid}.vlist li:last-child a{border-block-end:0}.vlist a:hover,.vlist a:focus-visible{background:var(--panel-2);outline:none}.vlist .n-ar{font-family:var(--font-arabic);font-size:max(calc(var(--step-0) * var(--fs)), var(--ar-floor));color:var(--muted)}.vlist .t{text-align:left;font-size:calc(var(--step--1) * var(--fs));color:var(--muted);white-space:nowrap;text-overflow:ellipsis;direction:ltr;overflow:hidden}.vl-cap-2{border-block-start:var(--hairline) solid var(--rule);border-block-end:0;margin-block-start:var(--sp-5);padding-block-start:var(--sp-4)}.vlist .vl-cap-2:first-child{border-block-start:0;margin-block-start:0;padding-block-start:0}.vl-surahs .t{align-items:baseline;gap:var(--sp-3);direction:rtl;display:flex}.vl-surahs .s-ar{font-family:var(--font-arabic);font-size:max(calc(var(--step--1) * var(--ar-scale) * var(--fs)), var(--ar-floor));color:var(--ink)}.vl-surahs .s-en{font-size:calc(var(--step--1) * var(--fs));color:var(--muted);direction:ltr}.vl-surahs a[aria-current=page] .s-en,.vlist a[aria-current=true] .n-ar,.vlist a[aria-current=true] .t{color:var(--ink)}.masthead{text-align:center;padding-block:var(--sp-8) var(--sp-6)}.masthead .title{font-family:var(--font-quran);font-size:calc(var(--step-5) * var(--fs));color:var(--ink);direction:rtl;line-height:1.5}.masthead .translit{font-size:calc(var(--step-1) * var(--fs));color:var(--ink);font-variant:small-caps;letter-spacing:.02em;margin-block-start:var(--sp-2)}.masthead .rule{inline-size:3rem;block-size:var(--hairline);background:var(--rule);margin:var(--sp-6) auto 0;border:0}.stamp{color:var(--muted);flex-direction:column;align-items:center;gap:2px;margin-block-start:var(--sp-5);display:flex}.stamp .lbl-ar{font-size:max(calc(var(--step--1) * var(--fs)), var(--ar-floor))}.stamp .lbl-en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.14em;text-transform:uppercase}.sec-head{align-items:center;gap:var(--sp-1);flex-direction:column;padding-block-end:var(--sp-5);display:flex}.sec-head .h-ar{font-size:max(calc(var(--step-2) * var(--fs)), var(--ar-floor));color:var(--ink)}.sec-head .h-en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:700}.progress{gap:var(--sp-4);justify-items:center;display:grid}.progress .marks{grid-template-columns:repeat(auto-fit,minmax(6px,1fr));gap:3px;inline-size:min(100%,34rem);display:grid}.progress .mark{background:var(--rule);border-radius:1px;block-size:14px}.progress .mark[data-done]{background:var(--green)}.progress .count{flex-direction:column;align-items:center;gap:1px;display:flex}.progress .count-ar{font-size:max(calc(var(--step-1) * var(--fs)), var(--ar-floor));color:var(--ink)}.progress .count-en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.surah-grid{gap:var(--sp-5);grid-template-columns:repeat(auto-fit,minmax(15rem,17rem));justify-content:center;margin:0;padding:0;list-style:none;display:grid}.surah-card{gap:var(--sp-2);padding:var(--sp-6) var(--sp-5);background:var(--panel);border:var(--hairline) solid var(--rule);border-radius:var(--radius-3);justify-items:center;text-decoration:none;transition:border-color .18s,box-shadow .18s,transform .18s;display:grid}.surah-card:hover,.surah-card:focus-visible{border-color:var(--green-line);box-shadow:0 6px 22px var(--shadow);transform:translateY(-2px)}.surah-card .num{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.surah-card .num-ar{font-size:max(calc(var(--step--1) * var(--fs)), var(--ar-floor));color:var(--muted)}.surah-card .name-ar{font-family:var(--font-quran);font-size:calc(var(--step-4) * var(--fs));color:var(--ink);direction:rtl;line-height:1.6}.surah-card .name-tr{font-size:calc(var(--step-0) * var(--fs));color:var(--ink)}.surah-card .name-en{font-size:calc(var(--step--1) * var(--fs));color:var(--muted);font-style:italic}.surah-card .meta{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-block-start:var(--hairline) solid var(--rule-faint);text-align:center;inline-size:100%;margin-block-start:var(--sp-2);padding-block-start:var(--sp-3)}.method{gap:var(--sp-5);margin:0;padding:0;list-style:none;display:grid}.method>li{background:var(--panel);border:var(--hairline) solid var(--rule);border-radius:var(--radius-2);padding:var(--sp-5) var(--sp-6)}.method>li:has(.mine){border-inline-start:3px solid var(--muted)}.method .ar{font-size:max(calc(var(--step-0) * var(--ar-scale) * var(--fs)), var(--ar-floor));color:var(--ink)}.method .en{font-size:calc(var(--step-0) * var(--fs));color:var(--muted)}.site-footer{border-block-start:var(--rule-w) solid var(--rule-strong);padding-block:var(--sp-4) var(--sp-6);background:0 0;margin-block-start:var(--sp-7)}.site-footer:has(.colophon[open]){padding-block-end:var(--sp-7)}.colophon{text-align:center}.colophon>summary{align-items:baseline;gap:var(--sp-2);cursor:pointer;padding-inline:var(--sp-2);padding-block:var(--sp-1);border-block-end:var(--hairline) solid transparent;direction:rtl;list-style:none;transition:border-color .18s;display:inline-flex}.colophon>summary::-webkit-details-marker{display:none}.colophon>summary:after{content:"";border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);block-size:.42em;inline-size:.42em;transition:rotate .18s;translate:0 -.2em;rotate:45deg}.colophon[open]>summary:after{translate:0 .05em;rotate:-135deg}.colophon>summary:hover{border-block-end-color:var(--rule)}.colophon>summary:focus-visible{box-shadow:0 2px 0 var(--focus);outline:none}.colophon .c-ar{font-size:max(calc(var(--step--1) * var(--fs)), var(--ar-floor));color:var(--ink)}.colophon .c-en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.18em;text-transform:uppercase;color:var(--muted);direction:ltr;unicode-bidi:isolate}.colophon .prov{text-align:initial;padding-block-start:var(--sp-6)}.prov{gap:0;margin:0;display:grid}.prov-row{gap:var(--sp-3);padding-block:var(--sp-5);border-block-start:var(--hairline) solid var(--rule-faint);display:grid}.prov-row:first-child{border-block-start:none;padding-block-start:0}.prov-row .pair>.ar,.prov-row .pair>.en{max-inline-size:none}.prov dt{align-items:baseline;gap:var(--sp-2);direction:rtl;display:flex}.prov .lbl-ar{font-size:max(calc(var(--step--1) * var(--fs)), var(--ar-floor));color:var(--ink)}.prov .lbl-en{font-family:var(--font-ui);font-size:calc(var(--step--2) * var(--fs));letter-spacing:.14em;text-transform:uppercase;color:var(--muted);direction:ltr;unicode-bidi:isolate}.prov dd{margin:0}.prov .ar{font-size:max(calc(var(--step--1) * var(--ar-scale) * var(--fs)), var(--ar-floor));color:var(--ink)}.prov .en{font-size:calc(var(--step--1) * var(--fs));color:var(--muted)}}@layer utilities;