:root{--base-100:#f6f6f6;--base-200:#ededed;--base-300:#d7d7d7;--base-400:#b0b0b0;--base-50-2:#fff;--base-500:#959595;--base-50:#fff;--base-700:gray;--base-800:#333;--base-900-2:#0b0b0b;--base-900:#0b0b0b;--base-overlay-100:#f6f6f6;--mine:#6174fa;--primary-green:#22ab6a;--schemes-primary:#6750a4;--tab-bar-bg:#ffffffe6}:root[data-mode=night]{--base-100:#0c0c0c;--base-200:#333;--base-300:#3a3a3c;--base-400:gray;--base-50-2:#1c1c1c;--base-500:#c7c7cc;--base-50:#1c1c1c;--base-700:#d7d7d7;--base-800:#f2f2f7;--base-900-2:#fff;--base-900:#fff;--base-overlay-100:#333;--primary-green:#21905b;--tab-bar-bg:#1f1f1fe6}:root[data-theme=light],.light{--schemes-primary:#493971}:root[data-theme=dark],.dark{--schemes-primary:#fff9ff}:root[data-mode=monochrome-lt]{--schemes-primary:#000}:root[data-mode=monochrome-dt]{--schemes-primary:#fff}:root[data-mode=pink-lt]{--schemes-primary:#8a4b68}:root[data-mode=pink-dt]{--schemes-primary:#feb0d1}:root[data-mode=rose-lt]{--schemes-primary:#8f4a56}:root[data-mode=rose-dt]{--schemes-primary:#ffb2bd}:root[data-mode=red-lt]{--schemes-primary:#914b43}:root[data-mode=red-dt]{--schemes-primary:#ffa79b}:root[data-mode=orange-lt]{--schemes-primary:#8d4f28}:root[data-mode=orange-dt]{--schemes-primary:#ffb68c}:root[data-mode=yellow-lt]{--schemes-primary:#795a0c}:root[data-mode=yellow-dt]{--schemes-primary:#e9c16c}:root[data-mode=chartreuse-lt]{--schemes-primary:#5c641e}:root[data-mode=chartreuse-dt]{--schemes-primary:#c3cd7c}:root[data-mode=green-lt]{--schemes-primary:#376a3e}:root[data-mode=green-dt]{--schemes-primary:#9cd49f}:root[data-mode=teal-lt]{--schemes-primary:#006b60}:root[data-mode=teal-dt]{--schemes-primary:#82d5c7}:root[data-mode=cyan-lt]{--schemes-primary:#01687d}:root[data-mode=cyan-dt]{--schemes-primary:#86d1ea}:root[data-mode=blue-lt]{--schemes-primary:#485e92}:root[data-mode=blue-dt]{--schemes-primary:#b0c6ff}:root[data-mode=indigo-lt]{--schemes-primary:#5b5992}:root[data-mode=indigo-dt]{--schemes-primary:#c5c0ff}:root[data-mode=purple-lt]{--schemes-primary:#6b548d}:root[data-mode=purple-dt]{--schemes-primary:#d6bbfb}
:root{--web-ground:#f0f1f5;--web-surface:#fff;--web-surface-sunken:#f6f6f8;--web-line:#eaebf2;--web-ink:#0b0b0b;--web-muted:#8c8e9e;--web-muted-soft:#9698a6;--web-radius-card:20px;--web-radius-hero:24px;--web-radius-pill:100px;--sidebar-width:246px;--sidebar-width-compact:76px;--web-gutter:32px;--web-gutter-tight:18px;--header-height:82px}:root[data-mode=night]{--web-ground:#101118;--web-surface:#1a1b24;--web-surface-sunken:#20212c;--web-line:#2e303e;--web-ink:#f4f4f8;--web-muted:#9698a6;--web-muted-soft:#828494}.web-shell{background:var(--web-ground);align-items:stretch;min-height:100dvh;display:flex}.web-main{flex-direction:column;flex:1 1 0;min-width:0;display:flex}.web-content{padding:28px var(--web-gutter) 48px;flex-direction:column;flex:1;gap:22px;display:flex}.web-grid{grid-template-columns:repeat(auto-fit, minmax(min(var(--min,300px), 100%), 1fr));gap:20px;display:grid}@media (max-width:1100px){:root{--web-gutter:22px}}@media (max-width:767px){:root{--web-gutter:16px}.web-content{padding:18px var(--web-gutter) var(--content-bottom);gap:18px}.web-grid{gap:14px}}.web-rail{flex:0 0 var(--sidebar-width);width:var(--sidebar-width);align-self:flex-start;height:100dvh;position:sticky;top:0;overflow-y:auto}.web-rail-label,.web-rail-footer{display:block}.web-only-phone{display:none}@media (max-width:1099px) and (min-width:768px){.web-rail{flex-basis:var(--sidebar-width-compact);width:var(--sidebar-width-compact);padding-left:12px;padding-right:12px}.web-rail-label,.web-rail-footer,.web-rail-wordmark{display:none}.web-rail-item{justify-content:center;padding-left:0;padding-right:0}.web-rail-head{justify-content:center}}@media (max-width:767px){.web-rail{z-index:61;flex-basis:var(--sidebar-width);height:100dvh;width:var(--sidebar-width);transition:transform .24s cubic-bezier(.22,.9,.28,1);position:fixed;inset:0 auto 0 0;transform:translate(-100%)}.web-rail[data-open=true]{transform:none}.web-scrim{display:block}.web-only-phone{display:grid}.web-hide-phone{display:none!important}}.web-scrim{z-index:60;background:#14184673;border:none;padding:0;animation:.2s feedIn;display:none;position:fixed;inset:0}.web-tabbar{display:none}@media (max-width:767px){.web-tabbar{display:flex}}.juz-grid{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}@media (min-width:480px){.juz-grid{grid-template-columns:repeat(6,1fr)}}@media (min-width:900px){.juz-grid{grid-template-columns:repeat(10,1fr)}}@media (min-width:1280px){.juz-grid{grid-template-columns:repeat(15,1fr)}}.page-grid-604{grid-template-columns:repeat(auto-fill,minmax(24px,1fr));gap:3px;display:grid}.card-rows{flex-wrap:wrap;align-items:stretch;gap:20px;display:flex}.card-rows>*{flex:1 1 var(--card-min,300px);min-width:0}@media (max-width:767px){.card-rows{gap:14px}}.quad{container-type:inline-size}.quad-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}@container (min-width:340px){.quad-tiles .quad-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@container (min-width:600px){.quad-figures .quad-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@font-face{font-family:KFGQPC Uthmanic;src:url(/fonts/kfgqpc-hafs-uthmanic.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+6??,U+750-77F,U+FB50-FDFF,U+FE70-FEFF}@font-face{font-family:SurahNames;src:url(/fonts/sura_names.woff2)format("woff2");font-weight:400;font-style:normal;font-display:block}:root{--font-ui:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, "Helvetica Neue", Arial, sans-serif;--font-ui-text:"SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, sans-serif;--font-arabic:"Geeza Pro", "Traditional Arabic", "Lateef", serif;--font-quran:"KFGQPC Uthmanic", "Geeza Pro", "Traditional Arabic", serif;--font-surah-names:"SurahNames"}
@keyframes feedIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}@keyframes sheetUp{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:none}}@keyframes storiesIn{0%{opacity:0;transform:translate(-24px)}to{opacity:1;transform:none}}@keyframes menuIn{0%{opacity:0;transform:translateY(14px)scale(.24)}55%{opacity:1;transform:translateY(0)scale(1.03)}75%{transform:scale(.99)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes sheetIn{0%{opacity:.85;transform:translateY(-118px)scaleY(.055)scaleX(.94)}30%{opacity:1}to{opacity:1;transform:translateY(0)scaleY(1)scaleX(1)}}@keyframes sheetContentIn{0%,38%{opacity:0}to{opacity:1}}@keyframes menuOut{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(14px)scale(.24)}}@keyframes menuItemIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes slideIn{0%{opacity:.55;filter:brightness(.82);transform:perspective(1100px)translate(78%)rotateY(-72deg)scale(.9)}to{opacity:1;filter:brightness();transform:perspective(1100px)translate(0)rotateY(0)scale(1)}}@keyframes btnPulse{0%,to{transform:scale(1);box-shadow:0 6px 16px #f0b81f59}50%{transform:scale(1.045);box-shadow:0 8px 22px #f0b81f8c}}@keyframes btnGlow{0%,to{box-shadow:0 0 #fce02c8c}70%{box-shadow:0 0 0 14px #fce02c00}}@keyframes btnPulseW{0%,to{transform:scale(1)}50%{transform:scale(1.045)}}@keyframes btnShine{0%,60%,to{transform:translate(-120%)skew(-20deg)}20%,40%{transform:translate(220%)skew(-20deg)}}@keyframes btnWiggle{0%,86%,to{transform:rotate(0)}88%{transform:rotate(-2.5deg)}90%{transform:rotate(2.5deg)}92%{transform:rotate(-2deg)}94%{transform:rotate(1.5deg)}96%{transform:rotate(0)}}@keyframes livePulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, currentColor 55%, transparent)}70%{box-shadow:0 0 0 7px #0000}to{box-shadow:0 0 #0000}}@keyframes splashPop{0%{opacity:0;transform:scale(.62)}55%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes splashBreathe{0%,to{transform:scale(1)}50%{transform:scale(1.035)}}@keyframes glintRun{to{stroke-dashoffset:-720px}}@keyframes splashHalo{0%,to{opacity:.35;transform:scale(.94)}50%{opacity:.7;transform:scale(1.08)}}@keyframes splashOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.12)}}@keyframes splashWord{0%{opacity:0;letter-spacing:.5em}to{opacity:1;letter-spacing:.28em}}@keyframes cardSheen{0%,55%,to{transform:translate(-140%)skew(-18deg)}18%,34%{transform:translate(320%)skew(-18deg)}}@keyframes cardBorderGlow{0%,to{box-shadow:inset 0 0 0 1px #ffffff47,0 0 #fce02c00}50%{box-shadow:inset 0 0 0 1.5px #fce02cbf,0 0 22px 2px #fce02c47}}@keyframes cardBreath{0%,to{transform:scale(1)}50%{transform:scale(1.018)}}@keyframes barShimmer{0%{transform:translate(-100%)}to{transform:translate(320%)}}@keyframes sparkFloat{0%{opacity:0;transform:translateY(6px)scale(.6)}30%{opacity:1}to{opacity:0;transform:translateY(-26px)scale(1.1)}}@keyframes arrowNudge{0%,to{transform:translate(0)}50%{transform:translate(5px)}}@keyframes dustRise{0%{opacity:0;transform:translateY(10px)scale(.5)}25%{opacity:.9}to{opacity:0;transform:translate(var(--dx,6px), -40px) scale(1)}}@keyframes pageFlip{0%,72%,to{opacity:0;transform:rotateY(0)}76%{opacity:.55}88%{opacity:.25;transform:rotateY(-150deg)}96%{opacity:0}}@keyframes haloPulse{0%{opacity:.55;transform:translate(-50%,-50%)scale(.75)}70%{opacity:0;transform:translate(-50%,-50%)scale(1.5)}to{opacity:0;transform:translate(-50%,-50%)scale(1.5)}}@keyframes floatY{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes shadowY{0%,to{opacity:.32;transform:translate(-50%)scaleX(1)}50%{opacity:.18;transform:translate(-50%)scaleX(.8)}}@keyframes streakPop{0%{opacity:0;transform:scale(.4)}45%{opacity:1;transform:scale(1.14)}70%{transform:scale(.95)}85%{transform:scale(1.03)}to{transform:scale(1)}}@keyframes streakHeart{0%,72%,to{transform:scale(1)}78%{transform:scale(1.09)}84%{transform:scale(1)}90%{transform:scale(1.06)}96%{transform:scale(1)}}@keyframes streakSwing{0%,to{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}@keyframes auroraShift{0%,to{transform:translate(-18%,-12%)rotate(0)}50%{transform:translate(14%,10%)rotate(30deg)}}@keyframes borderRun{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes edgeShine{0%,60%,to{transform:translate(-130%)skew(-16deg)}18%,38%{transform:translate(240%)skew(-16deg)}}@keyframes cornerGlint{0%,80%,to{opacity:.2;transform:scale(.6)rotate(0)}88%{opacity:1;transform:scale(1.15)rotate(30deg)}94%{opacity:.5}}@keyframes coinRise{0%{opacity:0;transform:translateY(8px)scale(.6)rotate(0)}30%{opacity:1}to{opacity:0;transform:translateY(-34px)scale(1)rotate(22deg)}}@keyframes amountGlow{0%,to{text-shadow:0 0 #fce02c00}50%{text-shadow:0 0 22px #fce02cd9}}@keyframes goldSweep{0%{background-position:-160% 0}to{background-position:260% 0}}@keyframes cardGoldGlow{0%,to{box-shadow:inset 0 0 0 1px #ffffff47,0 0 #fce02c00}50%{box-shadow:inset 0 0 0 1.5px #fce02cb3,0 0 28px 3px #fce02c4d}}@keyframes goldBorderGlow{0%,to{box-shadow:0 14px 40px #fce02c59,0 0 #fce02c00}50%{box-shadow:0 14px 40px #fce02c73,0 0 26px 4px #fce02c80}}@keyframes streakGlowRing{0%{opacity:.7;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}@keyframes boltStrike{0%,58%,to{opacity:1;filter:none;transform:scale(1)}60%{opacity:.25;filter:none}62%{opacity:1;filter:drop-shadow(0 0 16px #fff)brightness(2.4);transform:scale(1.2)}64%{opacity:.3;transform:scale(1)}66%{opacity:1;filter:drop-shadow(0 0 12px #fff)brightness(2.1);transform:scale(1.14)}68%{opacity:.45}70%{opacity:1;filter:drop-shadow(0 0 9px #ffffffe6)brightness(1.7);transform:scale(1.08)}73%{opacity:.7}76%{opacity:1;filter:drop-shadow(0 0 5px #fff6cdb3);transform:scale(1)}82%{filter:none}}@keyframes boltGlowBurst{0%,58%,to{opacity:0;transform:translate(-50%,-50%)scale(.4)}61%{opacity:1;transform:translate(-50%,-50%)scale(1.1)}64%{opacity:.1}67%{opacity:.85;transform:translate(-50%,-50%)scale(1.3)}71%{opacity:.2}75%{opacity:.5;transform:translate(-50%,-50%)scale(1.5)}86%{opacity:0;transform:translate(-50%,-50%)scale(1.8)}}@keyframes boltFlash{0%,88%,to{filter:none}92%{filter:drop-shadow(0 0 8px #fffffff2)}}@keyframes starTwinkle{0%,to{opacity:.15;transform:scale(.6)rotate(0)}50%{opacity:1;transform:scale(1)rotate(28deg)}}@keyframes nurGlow{0%,to{opacity:.5;transform:translate(-50%)scale(.9)}50%{opacity:.95;transform:translate(-50%)scale(1.08)}}@keyframes nurRays{0%,to{opacity:.35}50%{opacity:.8}}@keyframes nurBurst{0%,to{opacity:.72;transform:translate(-50%,-50%)scale(.96)}50%{opacity:1;transform:translate(-50%,-50%)scale(1.06)}}@keyframes nurSpin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes swipeNudge{0%,58%,to{transform:translate(0)}70%{transform:translate(9px)}82%{transform:translate(4px)}}@keyframes hintFade{0%,55%,to{opacity:.45}72%{opacity:1}}@keyframes swipeNudgeBack{0%,58%,to{transform:translate(0)}70%{transform:translate(-8px)}82%{transform:translate(-3px)}}@keyframes storiesExpand{0%{opacity:0;transform-origin:0;transform:translate(-46px)scaleX(.55)}60%{opacity:1}to{opacity:1;transform-origin:0;transform:none}}@keyframes storiesShrink{0%{opacity:0;transform:translate(34px)scale(.82)}to{opacity:1;transform:none}}@keyframes countdownGlow{0%,to{box-shadow:inset 0 0 0 1px #ffffff52,0 0 #fff0}50%{box-shadow:inset 0 0 0 1px #ffffff8c,0 0 14px 2px #ffebb473}}@keyframes bladeIn{0%{opacity:0;transform:translate(-26px,14px)rotate(-10deg)}60%{opacity:1}to{opacity:1;transform:none}}@keyframes markSheen{0%,55%{opacity:0;transform:translate(-120%)skew(-18deg)}70%{opacity:.55}to{opacity:0;transform:translate(220%)skew(-18deg)}}@keyframes freshFade{0%{background-color:var(--live-fresh,#fce02c47)}to{background-color:#0000}}.live-dot{background:currentColor;border-radius:50%;flex:none;width:8px;height:8px;animation:2.2s ease-out infinite livePulse}.live-row-fresh{animation:.45s cubic-bezier(.2,.8,.2,1) feedIn,6s ease-out freshFade}@media (prefers-reduced-motion:reduce){.live-dot,.live-row-fresh{animation:none}}@keyframes wSheet{0%{opacity:0;transform:translateY(24px)scale(.98)}to{opacity:1;transform:none}}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.web-dialog{animation:none!important}}@keyframes avatarIn{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}.avatar-in{animation:.35s cubic-bezier(.25,.9,.25,1.2) avatarIn}@media (prefers-reduced-motion:reduce){.avatar-in{animation:none}}
*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-text-size-adjust:100%}html[data-mode=night]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-ui);color:var(--web-ink);background:var(--web-ground);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}:root{--shell-max-width:440px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--tab-bar-height:64px;--content-bottom:calc(var(--safe-bottom) + var(--tab-bar-height) + 20px)}.pb-safe{padding-bottom:var(--content-bottom)}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:focus-visible{outline:2px solid var(--mine);outline-offset:2px}