@font-face{font-family:Amiri;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/amiri-400-arabic.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+1EE00-1EEF1}@font-face{font-family:Amiri;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/amiri-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Amiri;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/amiri-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Amiri;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/amiri-700-arabic.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+1EE00-1EEF1}@font-face{font-family:Amiri;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/amiri-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Amiri;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/amiri-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Noto Sans Arabic;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/noto-sans-arabic-arabic.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+1EE00-1EEF1}@font-face{font-family:Noto Sans Arabic;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/noto-sans-arabic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Noto Sans Arabic;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/noto-sans-arabic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Readex Pro;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/readex-pro-arabic.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+1EE00-1EEF1}@font-face{font-family:Readex Pro;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/readex-pro-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Readex Pro;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/readex-pro-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Plus Jakarta Sans;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/plus-jakarta-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Plus Jakarta Sans;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/plus-jakarta-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{color-scheme:light;--fs-2xs: 11px;--fs-xs: 12px;--fs-sm: 13px;--fs-md: 14px;--fs-base: 15px;--fs-lg: 17px;--fs-xl: 20px;--fs-2xl: 24px;--fs-3xl: 30px;--fs-4xl: 38px;--lh-tight: 1.3;--lh-snug: 1.55;--lh-normal: 1.8;--lh-loose: 2.05;--lh-quran: 2.3;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-7: 28px;--sp-8: 32px;--sp-10: 40px;--sp-12: 56px;--sp-16: 72px;--r-xs: 8px;--r-sm: 10px;--r-md: 14px;--r-lg: 18px;--r-xl: 24px;--r-2xl: 30px;--r-full: 999px;--h-sm: 36px;--h-md: 44px;--h-lg: 52px;--page-max: 1140px;--read-max: 680px;--gutter: var(--sp-4);--topnav-h: 68px;--tabbar-h: 62px;--ease: cubic-bezier(.32, .72, 0, 1);--dur-fast: .15s;--dur: .24s;--dur-slow: .4s;--bg: 44 30% 97%;--surface: 0 0% 100%;--surface-2: 42 26% 95%;--surface-3: 42 22% 91%;--border: 42 20% 88%;--border-strong: 42 16% 79%;--fg: 165 22% 9%;--fg-muted: 165 8% 38%;--fg-subtle: 165 6% 52%;--primary: 158 58% 21%;--primary-hover: 158 50% 27%;--primary-fg: 0 0% 100%;--accent: 42 92% 50%;--accent-ink: 38 80% 27%;--secondary: 0 58% 38%;--secondary-ink: 0 62% 34%;--success: 158 64% 30%;--success-ink: 158 68% 24%;--danger: 0 68% 46%;--danger-ink: 0 70% 40%;--ring: var(--primary);--e-1: 0 1px 2px hsl(158 40% 12% / .05), 0 1px 3px hsl(158 40% 12% / .04);--e-2: 0 2px 4px hsl(158 40% 12% / .04), 0 6px 16px -4px hsl(158 40% 12% / .08);--e-3: 0 8px 20px -6px hsl(158 40% 12% / .12), 0 18px 44px -12px hsl(158 40% 12% / .14);--e-4: 0 24px 60px -12px hsl(158 40% 12% / .28);--grad-primary: linear-gradient(135deg, hsl(158 58% 21%), hsl(158 48% 30%));--grad-gold: linear-gradient(135deg, hsl(42 92% 52%), hsl(46 88% 62%));--grad-secondary: linear-gradient(135deg, hsl(0 58% 38%), hsl(0 52% 47%));--font-display: "Amiri", serif;--font-body: "Readex Pro", "Noto Sans Arabic", sans-serif;--font-ui: "Readex Pro", "Noto Sans Arabic", sans-serif;--font-latin: "Plus Jakarta Sans", sans-serif;--font-reading: "Noto Sans Arabic", "Readex Pro", sans-serif;--background: var(--bg);--foreground: var(--fg);--card: var(--surface);--muted: var(--surface-2);--muted-foreground: var(--fg-muted);--destructive: var(--danger);--gold: var(--accent);--input: var(--border);--color-bg: hsl(var(--bg));--color-fg: hsl(var(--fg));--color-card: hsl(var(--surface));--color-surface-2: hsl(var(--surface-2));--color-primary: hsl(var(--primary));--color-primary-light: hsl(var(--primary-hover));--color-secondary: hsl(var(--secondary));--color-gold: hsl(var(--accent));--color-accent-ink: hsl(var(--accent-ink));--color-success: hsl(var(--success));--color-danger: hsl(var(--danger));--color-muted: hsl(var(--surface-2));--color-muted-fg: hsl(var(--fg-muted));--color-subtle-fg: hsl(var(--fg-subtle));--color-border: hsl(var(--border));--color-border-strong: hsl(var(--border-strong));--gradient-primary: var(--grad-primary);--gradient-gold: var(--grad-gold);--gradient-secondary: var(--grad-secondary);--shadow-card: var(--e-2);--shadow-elevated: var(--e-3);--shadow-modal: var(--e-4);--radius: var(--r-md)}.dark{color-scheme:dark;--bg: 168 14% 7%;--surface: 168 12% 10.5%;--surface-2: 168 10% 14.5%;--surface-3: 168 9% 19%;--border: 168 8% 20%;--border-strong: 168 8% 30%;--fg: 150 12% 96%;--fg-muted: 150 6% 67%;--fg-subtle: 150 5% 52%;--primary: 152 46% 48%;--primary-hover: 152 50% 56%;--primary-fg: 168 30% 6%;--accent: 44 88% 58%;--accent-ink: 44 84% 66%;--secondary: 0 62% 55%;--secondary-ink: 0 66% 64%;--success: 152 50% 46%;--success-ink: 152 55% 58%;--danger: 0 70% 60%;--danger-ink: 0 72% 66%;--e-1: 0 1px 2px hsl(0 0% 0% / .4);--e-2: 0 2px 6px hsl(0 0% 0% / .4), 0 8px 20px -6px hsl(0 0% 0% / .5);--e-3: 0 10px 28px -8px hsl(0 0% 0% / .6);--e-4: 0 28px 64px -12px hsl(0 0% 0% / .75);--grad-primary: linear-gradient(135deg, hsl(152 42% 28%), hsl(152 40% 38%))}*,*:before,*:after{box-sizing:border-box}html{direction:rtl;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--topnav-h) + var(--sp-4))}body{margin:0;min-height:100vh;background:hsl(var(--bg));color:hsl(var(--fg));font-family:var(--font-body);font-size:var(--fs-base);line-height:var(--lh-snug);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-size-adjust:100%}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);line-height:var(--lh-tight);margin:0;font-weight:700}p{margin:0}a{color:hsl(var(--primary));text-decoration:none}a:hover{color:hsl(var(--primary-hover))}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer}img,svg,video{max-width:100%}::selection{background:hsl(var(--accent) / .3);color:hsl(var(--fg))}:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid hsl(var(--ring));outline-offset:2px;border-radius:var(--r-xs)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:hsl(var(--fg) / .18);border-radius:var(--r-full);border:2px solid hsl(var(--bg))}::-webkit-scrollbar-thumb:hover{background:hsl(var(--fg) / .3)}.shell{min-height:100vh;display:flex;flex-direction:column}.page{width:100%;max-width:var(--page-max);margin-inline:auto;padding-inline:var(--gutter)}.page--narrow{max-width:var(--read-max)}.page--wide{max-width:1320px}.page--flush{padding-inline:0}.stack{display:flex;flex-direction:column;gap:var(--sp-4)}.stack--xs{gap:var(--sp-1)}.stack--sm{gap:var(--sp-2)}.stack--md{gap:var(--sp-3)}.stack--lg{gap:var(--sp-6)}.stack--xl{gap:var(--sp-8)}.row{display:flex;align-items:center;gap:var(--sp-3)}.row--between{justify-content:space-between}.row--wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.shrink-0{flex-shrink:0}.pad-block{padding-block:var(--sp-5) var(--sp-12)}.pad-block--sm{padding-block:var(--sp-4) var(--sp-8)}.grid-cards{display:grid;gap:var(--sp-3);grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));align-items:stretch}.grid-cards--sm{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}.grid-cards--lg{grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr))}.grid-cards>*{min-width:0}.scroller{display:flex;gap:var(--sp-2);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}.scroller::-webkit-scrollbar{display:none}.scroller>*{flex-shrink:0}.divider{height:1px;background:hsl(var(--border));border:0;margin:0}.t-display{font-family:var(--font-display);font-weight:700}.t-quran{font-family:var(--font-display);line-height:var(--lh-quran);font-size:var(--fs-xl)}.t-reading{font-family:var(--font-reading);line-height:var(--lh-loose)}.t-4xl{font-size:var(--fs-4xl);line-height:var(--lh-tight)}.t-3xl{font-size:var(--fs-3xl);line-height:var(--lh-tight)}.t-2xl{font-size:var(--fs-2xl);line-height:1.35}.t-xl{font-size:var(--fs-xl);line-height:1.4}.t-lg{font-size:var(--fs-lg);line-height:1.5}.t-base{font-size:var(--fs-base)}.t-md{font-size:var(--fs-md)}.t-sm{font-size:var(--fs-sm)}.t-xs{font-size:var(--fs-xs)}.t-2xs{font-size:var(--fs-2xs)}.t-bold{font-weight:700}.t-semi{font-weight:600}.t-muted{color:hsl(var(--fg-muted))}.t-subtle{color:hsl(var(--fg-subtle))}.t-primary{color:hsl(var(--primary))}.t-gold{color:hsl(var(--accent-ink))}.t-success{color:hsl(var(--success-ink))}.t-danger{color:hsl(var(--danger-ink))}.t-center{text-align:center}.t-prose{line-height:var(--lh-normal)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clamp-2{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.eyebrow{font-size:var(--fs-xs);font-weight:700;letter-spacing:.04em;color:hsl(var(--fg-subtle));display:flex;align-items:center;gap:var(--sp-2)}.eyebrow:after{content:"";flex:1;height:1px;background:hsl(var(--border))}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.card{background:hsl(var(--surface));border:1px solid hsl(var(--border));border-radius:var(--r-lg);padding:var(--sp-4);box-shadow:var(--e-1)}.card--flush{padding:0;overflow:hidden}.card--sm{padding:var(--sp-3);border-radius:var(--r-md)}.card--lg{padding:var(--sp-6);border-radius:var(--r-xl)}.card--quiet{background:hsl(var(--surface-2));box-shadow:none}.card--outline{background:transparent;box-shadow:none}:where(.card-link){display:block}.card-link{color:inherit;text-align:start;width:100%;font-family:inherit;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease)}.card-link:hover{color:inherit;border-color:hsl(var(--primary) / .35);box-shadow:var(--e-3);transform:translateY(-2px)}.card-link:active{transform:translateY(0);box-shadow:var(--e-1)}.panel{border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);background:hsl(var(--primary) / .05);border:1px solid hsl(var(--primary) / .12)}.panel--gold{background:hsl(var(--accent) / .1);border-color:hsl(var(--accent) / .28)}.panel--danger{background:hsl(var(--danger) / .07);border-color:hsl(var(--danger) / .25)}.panel--success{background:hsl(var(--success) / .09);border-color:hsl(var(--success) / .28)}.panel--secondary{background:hsl(var(--secondary) / .07);border-color:hsl(var(--secondary) / .22)}.tile{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;border-radius:var(--r-md);background:hsl(var(--primary) / .08);color:hsl(var(--primary))}.tile--sm{width:36px;height:36px;border-radius:var(--r-sm)}.tile--lg{width:52px;height:52px;border-radius:var(--r-lg)}.tile--gold{background:hsl(var(--accent) / .16);color:hsl(var(--accent-ink))}.tile--secondary{background:hsl(var(--secondary) / .1);color:hsl(var(--secondary))}.tile--danger{background:hsl(var(--danger) / .1);color:hsl(var(--danger))}.tile--solid{background:var(--grad-primary);color:#fff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);height:var(--h-md);padding-inline:var(--sp-5);border:1px solid transparent;border-radius:var(--r-md);font-family:var(--font-body);font-size:var(--fs-sm);font-weight:700;line-height:1;white-space:nowrap;text-decoration:none;transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}.btn:active{transform:scale(.98)}.btn:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed;transform:none}.btn--primary{background:hsl(var(--primary));color:hsl(var(--primary-fg));box-shadow:var(--e-1)}.btn--primary:hover:not(:disabled){background:hsl(var(--primary-hover));color:hsl(var(--primary-fg));box-shadow:var(--e-2)}.btn--gold{background:var(--grad-gold);color:#442c04;box-shadow:var(--e-1)}.btn--gold:hover:not(:disabled){box-shadow:var(--e-2);color:#442c04;filter:brightness(1.04)}.btn--outline{background:transparent;border-color:hsl(var(--primary) / .5);color:hsl(var(--primary))}.btn--outline:hover:not(:disabled){background:hsl(var(--primary) / .08);border-color:hsl(var(--primary));color:hsl(var(--primary))}.btn--soft{background:hsl(var(--primary) / .08);color:hsl(var(--primary))}.btn--soft:hover:not(:disabled){background:hsl(var(--primary) / .14);color:hsl(var(--primary))}.btn--neutral{background:hsl(var(--surface));border-color:hsl(var(--border));color:hsl(var(--fg))}.btn--neutral:hover:not(:disabled){background:hsl(var(--surface-2));border-color:hsl(var(--border-strong));color:hsl(var(--fg))}.btn--ghost{background:transparent;color:hsl(var(--fg-muted))}.btn--ghost:hover:not(:disabled){background:hsl(var(--fg) / .06);color:hsl(var(--fg))}.btn--danger{background:transparent;border-color:hsl(var(--danger) / .5);color:hsl(var(--danger-ink))}.btn--danger:hover:not(:disabled){background:hsl(var(--danger) / .08);border-color:hsl(var(--danger));color:hsl(var(--danger-ink))}.btn--danger-solid{background:hsl(var(--danger));color:#fff}.btn--danger-solid:hover:not(:disabled){filter:brightness(1.08);color:#fff}.btn--success{background:hsl(var(--success));color:#fff}.btn--success:hover:not(:disabled){filter:brightness(1.08);color:#fff}.btn--sm{height:var(--h-sm);padding-inline:var(--sp-3);font-size:var(--fs-xs);border-radius:var(--r-sm)}.btn--lg{height:var(--h-lg);padding-inline:var(--sp-6);font-size:var(--fs-base);border-radius:var(--r-lg)}.btn--block{width:100%}.btn--icon{width:var(--h-md);padding-inline:0}.btn--icon.btn--sm{width:var(--h-sm)}.btn--icon.btn--lg{width:var(--h-lg)}.btn--round{border-radius:var(--r-full)}.input{width:100%;height:var(--h-md);padding-inline:var(--sp-4);border:1px solid hsl(var(--border));border-radius:var(--r-md);background:hsl(var(--surface));color:hsl(var(--fg));font-size:var(--fs-md);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.input::placeholder{color:hsl(var(--fg-subtle))}.input:hover{border-color:hsl(var(--border-strong))}.input:focus{outline:none;border-color:hsl(var(--primary) / .6);box-shadow:0 0 0 3px hsl(var(--primary) / .14)}.label{font-size:var(--fs-xs);font-weight:700;color:hsl(var(--fg-muted))}input[type=range]{appearance:none;-webkit-appearance:none;min-width:0;outline-offset:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:hsl(var(--primary));border:2px solid hsl(var(--surface));box-shadow:var(--e-1);cursor:pointer}input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:hsl(var(--primary));border:2px solid hsl(var(--surface));cursor:pointer}input[type=range]:disabled::-webkit-slider-thumb{background:hsl(var(--fg-subtle))}input[type=range]:disabled::-moz-range-thumb{background:hsl(var(--fg-subtle))}.search{position:relative;display:block}.search .input{padding-inline-start:42px;padding-inline-end:40px}.search-icon{position:absolute;inset-inline-start:var(--sp-4);top:50%;transform:translateY(-50%);color:hsl(var(--fg-subtle));pointer-events:none;display:flex}.search-clear{position:absolute;inset-inline-end:var(--sp-2);top:50%;transform:translateY(-50%);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:0;border-radius:var(--r-full);background:hsl(var(--fg) / .07);color:hsl(var(--fg-muted));transition:background-color var(--dur-fast) var(--ease)}.search-clear:hover{background:hsl(var(--fg) / .14);color:hsl(var(--fg))}.select-wrap{position:relative;display:block}.select-wrap .input{appearance:none;cursor:pointer;padding-inline-end:38px;font-weight:600}.select-chevron{position:absolute;inset-inline-end:var(--sp-3);top:50%;transform:translateY(-50%);pointer-events:none;color:hsl(var(--fg-subtle));display:flex}.switch{position:relative;width:50px;height:30px;flex-shrink:0;padding:3px;border:0;border-radius:var(--r-full);background:hsl(var(--fg) / .15);transition:background-color var(--dur) var(--ease)}.switch[aria-checked=true]{background:hsl(var(--primary))}.switch-thumb{display:block;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:var(--e-1);transition:transform var(--dur) var(--ease)}.switch[aria-checked=true] .switch-thumb{transform:translate(-20px)}.chip{display:inline-flex;align-items:center;gap:var(--sp-1);height:var(--h-sm);padding-inline:var(--sp-4);border:1px solid hsl(var(--border));border-radius:var(--r-full);background:hsl(var(--surface));color:hsl(var(--fg-muted));font-size:var(--fs-xs);font-weight:700;white-space:nowrap;transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}.chip:hover{border-color:hsl(var(--primary) / .4);color:hsl(var(--primary))}.chip.is-active{background:hsl(var(--primary));border-color:hsl(var(--primary));color:hsl(var(--primary-fg))}.chip.is-active:hover{color:hsl(var(--primary-fg))}.chip--gold.is-active{background:var(--grad-gold);border-color:transparent;color:#442c04}.chip--gold.is-active:hover{color:#442c04}.chip-count{font-size:var(--fs-2xs);font-weight:700;opacity:.65}.chip--sm{height:30px;padding-inline:var(--sp-3);font-size:var(--fs-2xs)}.tag{display:inline-flex;align-items:center;gap:var(--sp-1);padding:3px var(--sp-2);border-radius:var(--r-full);background:hsl(var(--surface-2));color:hsl(var(--fg-muted));font-size:var(--fs-2xs);font-weight:700;white-space:nowrap}.tag--primary{background:hsl(var(--primary) / .09);color:hsl(var(--primary))}.tag--gold{background:hsl(var(--accent) / .16);color:hsl(var(--accent-ink))}.tag--success{background:hsl(var(--success) / .12);color:hsl(var(--success-ink))}.tag--danger{background:hsl(var(--danger) / .1);color:hsl(var(--danger-ink))}.meter{flex:1 1 auto;min-width:0;width:100%;height:6px;border-radius:var(--r-full);background:hsl(var(--fg) / .11);overflow:hidden}.meter-fill{height:100%;border-radius:var(--r-full);background:var(--grad-primary);transition:width var(--dur-slow) var(--ease)}.meter-fill--success{background:linear-gradient(135deg,hsl(var(--success)),#30a66f)}.meter-fill--gold{background:var(--grad-gold)}.ring{--ring-pct: 0;position:relative;width:44px;height:44px;flex-shrink:0;border-radius:50%;background:conic-gradient(hsl(var(--primary)) calc(var(--ring-pct) * 1%),hsl(var(--fg) / .09) 0);display:grid;place-items:center}.ring--success{background:conic-gradient(hsl(var(--success)) calc(var(--ring-pct) * 1%),hsl(var(--fg) / .09) 0)}.ring-inner{width:34px;height:34px;border-radius:50%;background:hsl(var(--surface));display:grid;place-items:center;font-size:var(--fs-2xs);font-weight:700;color:hsl(var(--fg-muted))}@keyframes shimmer{to{transform:translate(-100%)}}.skeleton{position:relative;overflow:hidden;border-radius:var(--r-sm);background:hsl(var(--fg) / .07)}.skeleton:after{content:"";position:absolute;inset:0;transform:translate(100%);background:linear-gradient(90deg,transparent,hsl(var(--fg) / .06),transparent);animation:shimmer 1.4s infinite}.skeleton--text{height:12px;border-radius:var(--r-full)}.skeleton--title{height:18px;border-radius:var(--r-full)}.skeleton--circle{border-radius:50%}.empty{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);padding:var(--sp-12) var(--sp-5);text-align:center;color:hsl(var(--fg-muted))}.empty-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:var(--r-xl);background:hsl(var(--primary) / .07);color:hsl(var(--primary) / .7)}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;animation:spin .7s linear infinite;flex-shrink:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes scaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,12px) scale(.96)}to{opacity:1;transform:translate(-50%) scale(1)}}@keyframes twinklePulse{0%,to{opacity:.15}50%{opacity:.45}}.animate-fade-in{animation:fadeIn var(--dur-slow) var(--ease) forwards}.animate-scale-in{animation:scaleIn var(--dur) var(--ease) forwards}.animate-slide-up{animation:slideUp .5s var(--ease) forwards}.animate-float{animation:float 6s ease-in-out infinite}.islamic-pattern{background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0L60 30L30 60L0 30L30 0z' fill='none' stroke='%23166534' stroke-opacity='0.07' stroke-width='1'/%3E%3C/svg%3E")}.dark .islamic-pattern{background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0L60 30L30 60L0 30L30 0z' fill='none' stroke='%234ade80' stroke-opacity='0.06' stroke-width='1'/%3E%3C/svg%3E")}.text-gradient-gold{background:linear-gradient(135deg,hsl(var(--accent)),#c18215);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.topnav{display:none}.topnav-inner{max-width:var(--page-max);margin-inline:auto;height:var(--topnav-h);padding-inline:var(--gutter);display:flex;align-items:center;gap:var(--sp-4)}.brand{display:flex;align-items:center;gap:var(--sp-2);color:hsl(var(--primary));font-family:var(--font-display);font-weight:700;font-size:var(--fs-xl);flex-shrink:0}.brand:hover{color:hsl(var(--primary))}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--r-sm);background:var(--grad-primary);color:#fff}.nav-links{display:flex;align-items:center;gap:2px;margin-inline-start:auto}.nav-link{position:relative;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);font-size:var(--fs-sm);font-weight:700;color:hsl(var(--fg-muted));white-space:nowrap;transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease)}.nav-link:hover{color:hsl(var(--fg));background:hsl(var(--fg) / .05)}.nav-link.is-active{color:hsl(var(--primary));background:hsl(var(--primary) / .1)}.nav-divider{width:1px;height:22px;margin-inline:var(--sp-2);background:hsl(var(--border));flex-shrink:0}.nav-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r-sm);color:hsl(var(--fg-muted));transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease)}.nav-icon:hover{color:hsl(var(--fg));background:hsl(var(--fg) / .05)}.nav-icon.is-active{color:hsl(var(--primary));background:hsl(var(--primary) / .1)}.pagehead{position:sticky;top:0;z-index:30;background:hsl(var(--bg) / .85);backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);border-bottom:1px solid transparent;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);padding-block:var(--sp-3)}.pagehead.is-stuck{border-bottom-color:hsl(var(--border));box-shadow:var(--e-1)}.pagehead-inner{display:flex;align-items:center;gap:var(--sp-3);min-height:40px}.pagehead-title{font-family:var(--font-display);font-weight:700;font-size:var(--fs-lg)}.pagehead-sub{font-size:var(--fs-xs);color:hsl(var(--fg-muted));margin-top:1px}.tabbar{position:fixed;inset-inline:0;bottom:0;z-index:40;display:flex;gap:2px;padding:var(--sp-2) var(--sp-2) 0;padding-bottom:max(var(--sp-2),env(safe-area-inset-bottom));background:hsl(var(--surface) / .88);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);border-top:1px solid hsl(var(--border))}.tabbar-item{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:var(--sp-1) 2px var(--sp-2);border-radius:var(--r-sm);color:hsl(var(--fg-subtle));font-size:var(--fs-2xs);font-weight:700;white-space:nowrap;transition:color var(--dur-fast) var(--ease)}.tabbar-item:hover{color:hsl(var(--fg-muted))}.tabbar-item.is-active{color:hsl(var(--primary))}.tabbar-icon{display:grid;place-items:center;width:46px;height:26px;border-radius:var(--r-full);transition:background-color var(--dur) var(--ease)}.tabbar-item.is-active .tabbar-icon{background:hsl(var(--primary) / .14)}.has-tabbar{padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + var(--sp-4))}.ayah-jump{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}.ayah-jump-input{width:92px;height:34px;padding-inline:var(--sp-3);font-size:var(--fs-xs);text-align:center}.ayah-jump-input::-webkit-outer-spin-button,.ayah-jump-input::-webkit-inner-spin-button{appearance:none;margin:0}.ayah-jump-input{-moz-appearance:textfield}.playbar{position:fixed;z-index:45;left:50%;transform:translate(-50%);bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + var(--sp-3));display:flex;align-items:center;gap:var(--sp-2);width:min(calc(100vw - var(--sp-8)),420px);padding:var(--sp-2) var(--sp-3);border:1px solid hsl(var(--border));border-radius:var(--r-full);background:hsl(var(--surface) / .92);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);box-shadow:var(--e-3);animation:slideUp var(--dur) var(--ease)}@media(min-width:1024px){.playbar{bottom:var(--sp-6)}}.toast{position:fixed;bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + var(--sp-4));left:50%;z-index:60;display:flex;align-items:center;gap:var(--sp-2);max-width:min(90vw,420px);padding:var(--sp-3) var(--sp-5);border-radius:var(--r-full);background:#182522;color:#fafafa;font-size:var(--fs-sm);font-weight:600;box-shadow:var(--e-4);animation:toastIn var(--dur) var(--ease)}.dark .toast{background:#2e3836}.modal-backdrop{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:var(--sp-5);background:#0b131199;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fadeIn var(--dur) var(--ease)}.modal{width:100%;max-width:380px;padding:var(--sp-6);border-radius:var(--r-xl);background:hsl(var(--surface));box-shadow:var(--e-4);text-align:center;animation:scaleIn var(--dur) var(--ease)}.option{display:flex;align-items:center;gap:var(--sp-3);width:100%;padding:var(--sp-3) var(--sp-4);border:1px solid hsl(var(--border));border-radius:var(--r-md);background:hsl(var(--surface));color:hsl(var(--fg));font-family:var(--font-body);font-size:var(--fs-md);font-weight:600;line-height:var(--lh-snug);text-align:start;transition:border-color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}.option:not(:disabled):hover{border-color:hsl(var(--primary) / .45);background:hsl(var(--primary) / .03)}.option:not(:disabled):active{transform:scale(.99)}.option-key{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;border-radius:var(--r-xs);background:hsl(var(--fg) / .06);color:hsl(var(--fg-muted));font-size:var(--fs-xs);font-weight:700;transition:background-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}.option.is-selected{border-color:hsl(var(--primary));background:hsl(var(--primary) / .07);box-shadow:0 0 0 1px hsl(var(--primary))}.option.is-selected .option-key{background:hsl(var(--primary));color:hsl(var(--primary-fg))}.option.is-correct{border-color:hsl(var(--success));background:hsl(var(--success) / .1);color:hsl(var(--success-ink));box-shadow:0 0 0 1px hsl(var(--success))}.option.is-correct .option-key{background:hsl(var(--success));color:#fff}.option.is-incorrect{border-color:hsl(var(--danger));background:hsl(var(--danger) / .08);color:hsl(var(--danger-ink));box-shadow:0 0 0 1px hsl(var(--danger))}.option.is-incorrect .option-key{background:hsl(var(--danger));color:#fff}.option.is-muted{opacity:.5}.option:disabled{cursor:default}.excerpt{border-radius:var(--r-md);padding:var(--sp-4);background:hsl(var(--primary) / .04);border:1px solid hsl(var(--primary) / .1);text-align:center}.excerpt-text{font-family:var(--font-display);font-size:var(--fs-xl);line-height:var(--lh-quran)}.excerpt-mark{border-radius:var(--r-xs);padding:2px 5px;background:hsl(var(--accent) / .3);box-decoration-break:clone;-webkit-box-decoration-break:clone}.ayah-badge{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;margin-inline:var(--sp-2);padding-inline:4px;border:1.5px solid hsl(var(--accent) / .8);border-radius:50%;color:hsl(var(--accent-ink));font-family:var(--font-body);font-size:var(--fs-xs);font-weight:700;vertical-align:middle}.mushaf-page{background:#f9f7f0;border:1px solid hsl(44 38% 84%);border-radius:var(--r-xl);padding:var(--sp-5) var(--sp-4);box-shadow:var(--e-2);position:relative}.mushaf-page:before{content:"";position:absolute;inset:7px;border:1px solid hsl(44 55% 58% / .5);border-radius:calc(var(--r-xl) - 6px);pointer-events:none}.dark .mushaf-page{background:#1c2220;border-color:#343d3b}.dark .mushaf-page:before{border-color:#ac8e3947}.mushaf-bismillah{font-family:var(--font-display);font-size:var(--fs-2xl);text-align:center;padding-bottom:var(--sp-3);margin-bottom:var(--sp-2);border-bottom:1px solid hsl(44 40% 55% / .25)}.mushaf-row{position:relative;border-radius:var(--r-md);padding:var(--sp-3) var(--sp-2) var(--sp-2);cursor:pointer;transition:background-color var(--dur-fast) var(--ease)}.mushaf-row:hover{background:hsl(var(--accent) / .1)}.mushaf-row.is-playing{background:hsl(var(--accent) / .18)}.mushaf-row+.mushaf-row{border-top:1px solid hsl(44 40% 55% / .18)}@keyframes ayahTarget{0%,60%{background:hsl(var(--primary) / .16);box-shadow:inset 0 0 0 2px hsl(var(--primary) / .45)}to{background:transparent;box-shadow:inset 0 0 0 2px transparent}}.mushaf-row.is-target,.ayah-card.is-target{animation:ayahTarget 2.4s var(--ease) forwards}.mushaf-figure{position:relative;display:flex;align-items:center;justify-content:center;transition:filter .25s}.mushaf-skeleton{position:absolute;top:50%;inset-inline:14%;height:26px;transform:translateY(-50%);pointer-events:none}.mushaf-img{display:block;margin-inline:auto;width:auto;height:auto;max-width:100%;transition:opacity .25s}.dark .mushaf-img{filter:invert(.92) sepia(.06)}.mushaf-foot{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);margin-top:var(--sp-1)}.mushaf-num{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;color:hsl(var(--accent-ink));transition:background-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}.mushaf-row.is-playing .mushaf-num{background:hsl(var(--accent));color:#442c04}.home-hero{position:relative;isolation:isolate;overflow:hidden;background-color:hsl(var(--bg))}.home-hero:before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(130% 82% at 72% -20%,hsl(var(--primary) / .11),transparent 62%),radial-gradient(80% 60% at 4% 118%,hsl(var(--accent) / .07),transparent 64%),linear-gradient(180deg,hsl(var(--surface)),hsl(var(--bg)) 74%)}.home-hero:after{content:"";position:absolute;inset:0;z-index:-1;background-image:url("data:image/svg+xml,%3Csvg width='72' height='72' viewBox='0 0 72 72' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%230F3B28' stroke-width='1'%3E%3Cpath d='M36 2 70 36 36 70 2 36z'/%3E%3Cpath d='M36 16 56 36 36 56 16 36z'/%3E%3C/g%3E%3C/svg%3E");background-size:72px 72px;opacity:.07;-webkit-mask-image:radial-gradient(70% 66% at 50% 30%,#000 8%,transparent 72%);mask-image:radial-gradient(70% 66% at 50% 30%,#000 8%,transparent 72%)}.dark .home-hero:after{background-image:url("data:image/svg+xml,%3Csvg width='72' height='72' viewBox='0 0 72 72' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%234ADE80' stroke-width='1'%3E%3Cpath d='M36 2 70 36 36 70 2 36z'/%3E%3Cpath d='M36 16 56 36 36 56 16 36z'/%3E%3C/g%3E%3C/svg%3E");opacity:.055}.home-hero-edge{height:1px;background:linear-gradient(90deg,transparent,hsl(var(--border-strong)),transparent)}.cta-sheen{position:relative;overflow:hidden}.cta-sheen:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);transform:translate(-100%);transition:transform .7s var(--ease)}.cta-sheen:hover:after{transform:translate(100%)}@media(min-width:640px){:root{--gutter: var(--sp-6)}}@media(min-width:1024px){:root{--gutter: var(--sp-8)}.topnav{display:block;position:sticky;top:0;z-index:50;background:hsl(var(--bg) / .82);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);border-bottom:1px solid hsl(var(--border))}.tabbar{display:none}.has-tabbar{padding-bottom:var(--sp-12)}.toast{bottom:var(--sp-8)}.pagehead{top:var(--topnav-h)}.pagehead--redundant{display:none}html{scroll-padding-top:calc(var(--topnav-h) + 64px)}}@media(min-width:1024px)and (max-width:1200px){.nav-link{padding-inline:var(--sp-2);font-size:var(--fs-xs)}}@media(min-width:1800px){:root{--fs-base: 16px;--fs-md: 15px;--fs-sm: 14px;--page-max: 1280px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}