@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}:root{--bg:#0b0a08;--bg-2:#15120c;--line:#e6bd6a2e;--hair:#ffffff14;--gold:#e6bd6a;--gold-2:#f4dca0;--text:#f6f0e3;--muted:#b8ad99;--teal:#45d3ab;--blue:#7fb9e6;--pink:#e296d6;--grey:#8fa199;--ink:#1c1503;--gold-bg:#e6bd6a;--gold-bg-2:#f4dca0;--surface-1:#2e2619a8;--surface-2:#14110bb8;--glass:#0e0c08b8;--glass-solid:#0e0c08f5;--well:#00000042;--tint:#ffffff0b;--radius:24px;--gutter:clamp(16px, 4vw, 48px);--ease:cubic-bezier(.22, 1, .36, 1);--display:"Marcellus", Georgia, serif;--body:"Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;--arabic:"Amiri", "Traditional Arabic", "Scheherazade New", serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:96px}body{font-family:var(--body);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;margin:0;font-size:1.0625rem;font-weight:300;line-height:1.65;overflow-x:hidden}::selection{background:var(--gold-bg);color:var(--ink)}h1,h2,h3,h4{font-family:var(--display);text-wrap:balance;margin:0;font-weight:400;line-height:1.12}p{margin:0}b,strong{font-weight:600}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}button:disabled{opacity:.35;cursor:not-allowed}:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:8px}.skip{z-index:100;background:var(--gold-bg);color:var(--ink);border-radius:12px;padding:10px 18px;font-weight:500;text-decoration:none;transition:top .2s;position:fixed;top:-60px;left:16px}.skip:focus{top:12px}.aurora{z-index:-1;pointer-events:none;position:fixed;inset:0;overflow:hidden}.aurora i{filter:blur(90px);opacity:.5;border-radius:50%;width:60vmax;height:60vmax;animation:26s ease-in-out infinite alternate drift;position:absolute}.aurora i:first-child{background:radial-gradient(circle,#e6bd6a42,#0000 65%);top:-30vmax;right:-20vmax}.aurora i:nth-child(2){background:radial-gradient(circle,#e6bd6a33,#0000 65%);animation-duration:34s;animation-delay:-8s;top:30%;left:-34vmax}.aurora i:nth-child(3){background:radial-gradient(circle,#fff4dc1a,#0000 65%);animation-duration:40s;animation-delay:-16s;bottom:-36vmax;right:-10vmax}@keyframes drift{to{transform:translate(8vmax,6vmax)scale(1.15)}}.muted{color:var(--muted);font-size:.9rem}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--gold);align-items:center;gap:12px;font-size:.78rem;font-weight:500;display:inline-flex}.eyebrow b{font-family:var(--display);letter-spacing:.06em;color:var(--gold-2);font-size:1rem;font-weight:400}.eyebrow i{background:linear-gradient(90deg, var(--gold), transparent);width:36px;height:1px}.word{vertical-align:bottom;margin-bottom:-.14em;padding-bottom:.14em;display:inline-block;overflow:hidden}.word:not(:last-child){margin-inline-end:.26em}.word>span{display:inline-block}.card{isolation:isolate;border-radius:var(--radius);background:linear-gradient(180deg, var(--surface-1), var(--surface-2));border:1px solid var(--hair);-webkit-backdrop-filter:blur(14px);padding:28px;transition:border-color .3s;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff0f,0 30px 60px -40px #000000e6}.card:before{content:"";z-index:-1;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%), #e6bd6a24, transparent 60%);opacity:0;pointer-events:none;transition:opacity .4s;position:absolute;inset:0}.card:hover{border-color:#e6bd6a4d}.card:hover:before{opacity:1}.card>h3{margin-bottom:8px;font-size:1.5rem}.card>h3+p{color:var(--muted)}.badge{font-family:var(--body);background:var(--glass);-webkit-backdrop-filter:blur(8px);border:1px solid #ffffff24;border-radius:999px;align-items:center;padding:4px 12px;font-size:.78rem;font-weight:500;line-height:1.5;display:inline-flex}.badge-gold{color:var(--gold-2);border-color:#e6bd6a59}.btn{text-align:center;color:var(--ink);background:linear-gradient(135deg, var(--gold-bg-2), var(--gold-bg));transition:transform .25s var(--ease), box-shadow .25s;border-radius:999px;justify-content:center;align-items:center;padding:14px 28px;font-weight:500;line-height:1.3;text-decoration:none;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 12px 34px -12px #e6bd6ab3}.btn:after{content:"";width:40%;transition:left .6s var(--ease);background:linear-gradient(100deg,#0000,#ffffff8c,#0000);position:absolute;top:0;bottom:0;left:-60%;transform:skew(-20deg)}.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 40px -12px #e6bd6acc}.btn:hover:not(:disabled):after{left:120%}.btn-ghost{color:var(--text);background:var(--tint);border:1px solid var(--line);box-shadow:none;-webkit-backdrop-filter:blur(8px)}.btn-ghost:after{background:linear-gradient(100deg,#0000,#ffffff24,#0000)}.btn-ghost:hover:not(:disabled){box-shadow:none;background:#ffffff1a}.fineprint{color:var(--muted);max-width:860px;margin-top:24px;font-size:.92rem}.fineprint b{color:var(--gold-2)}.note{border-inline-start:2px solid var(--gold);color:var(--muted);margin-top:14px;padding-inline-start:14px;font-size:.9rem}.two-col{grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:20px;display:grid}.scrollbar{background:linear-gradient(90deg, var(--teal), var(--gold));transform-origin:0;z-index:60;height:3px;position:fixed;inset:0 0 auto}.nav{z-index:50;border:1px solid #0000;border-radius:999px;align-items:center;gap:16px;width:min(1180px,100% - 24px);margin:0 auto;padding:8px 8px 8px 20px;transition:background .35s,border-color .35s,box-shadow .35s;display:flex;position:fixed;top:14px;left:0;right:0}.nav.is-scrolled{background:var(--glass);border-color:var(--hair);-webkit-backdrop-filter:blur(18px)saturate(1.4);box-shadow:0 20px 50px -24px #000000e6}.nav-brand{font-family:var(--display);color:var(--text);white-space:nowrap;align-items:center;gap:10px;font-size:1.2rem;text-decoration:none;display:inline-flex}.nav-brand svg{width:26px;fill:var(--gold);transition:transform .5s var(--ease)}.nav-brand em{color:var(--gold);font-style:normal}.nav-links{gap:2px;margin:0 auto;display:flex}.nav-links a{color:var(--muted);white-space:nowrap;border-radius:999px;padding:8px 12px;font-size:.9rem;font-weight:400;text-decoration:none;transition:color .2s;position:relative}.nav-links a>span:last-child{position:relative}.nav-links a:hover,.nav-links a.is-active{color:var(--text)}.nav-pill{background:#e6bd6a24;border:1px solid #e6bd6a47;border-radius:999px;position:absolute;inset:0}.nav-cta{padding:10px 20px;font-size:.9rem}.nav-toggle{background:var(--tint);border:1px solid var(--line);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;margin-inline-start:auto;display:none}.nav-toggle span{background:var(--gold-bg-2);width:18px;height:2px;transition:transform .3s var(--ease), opacity .2s;border-radius:2px}.nav-toggle.is-open span:first-child{transform:translateY(7px)rotate(45deg)}.nav-toggle.is-open span:nth-child(2){opacity:0}.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px)rotate(-45deg)}.nav-menu{background:var(--glass-solid);border:1px solid var(--hair);-webkit-backdrop-filter:blur(18px);transform-origin:top;border-radius:24px;padding:8px;position:absolute;top:calc(100% + 10px);left:0;right:0;box-shadow:0 40px 60px -20px #000000e6}.nav-menu a{font-family:var(--display);color:var(--text);border-radius:16px;align-items:baseline;gap:14px;padding:13px 16px;font-size:1.25rem;text-decoration:none;display:flex}.nav-menu a small{font-family:var(--body);letter-spacing:.1em;color:var(--gold);font-size:.72rem}.nav-menu a.is-active{background:#e6bd6a1f}.hero{min-height:100svh;padding:128px var(--gutter) 96px;align-items:center;display:grid;position:relative;overflow:hidden}.hero-stars i{background:var(--gold-bg-2);border-radius:50%;position:absolute}.ornament{opacity:.13;pointer-events:none;width:min(1100px,170vw);margin:calc(min(1100px,170vw)/-2) 0 0 calc(min(1100px,170vw)/-2);position:absolute;top:50%;left:50%}.ornament svg{fill:none;width:100%;stroke:var(--gold);stroke-width:.3px;display:block}.hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:center;gap:clamp(32px,5vw,72px);width:100%;max-width:1180px;margin:0 auto;display:grid;position:relative}.hero-content{justify-items:start;gap:20px;display:grid}.hero-bismillah{font-family:var(--arabic);color:var(--gold-2);font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.6}.hero-chip{letter-spacing:.12em;text-transform:uppercase;color:var(--gold-2);border:1px solid var(--line);background:#e6bd6a14;border-radius:999px;align-items:center;gap:10px;padding:6px 16px 6px 12px;font-size:.8rem;font-weight:500;display:inline-flex}.hero-chip i,.arch-tag i{background:var(--teal);border-radius:50%;width:8px;height:8px;animation:2s infinite ping;box-shadow:0 0 #45d3abb3}@keyframes ping{70%,to{box-shadow:0 0 0 10px #45d3ab00}}.hero h1{letter-spacing:-.01em;font-size:clamp(2.9rem,7.4vw,6rem);line-height:1.02}.hero h1 .is-accent{background:linear-gradient(110deg, var(--gold-2), var(--gold) 30%, var(--teal) 55%, var(--gold) 80%, var(--gold-2));color:#0000;background-size:220% 100%;-webkit-background-clip:text;background-clip:text;animation:7s linear infinite shimmer}@keyframes shimmer{to{background-position:-220% 0}}.hero-lead{color:var(--muted);max-width:560px;font-size:clamp(1.05rem,1.6vw,1.22rem)}.hero-cta{flex-wrap:wrap;gap:12px;margin-top:6px;display:flex}.hero-jump{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px;font-size:.85rem;display:flex}.hero-jump span{letter-spacing:.14em;text-transform:uppercase;margin-inline-end:4px;font-size:.72rem}.hero-jump button{border:1px solid var(--hair);background:var(--tint);color:var(--text);border-radius:999px;padding:6px 14px;transition:border-color .2s,background .2s,transform .2s}.hero-jump button:hover{border-color:var(--gold);background:#e6bd6a1f;transform:translateY(-2px)}.hero-demo{justify-items:center;display:grid}.arch{aspect-ratio:10/13;background:linear-gradient(#0a0f2c 0%,#1b2440 48%,#15120c 100%);border-radius:999px 999px 36px 36px;flex-direction:column;justify-content:flex-end;align-items:center;width:min(100%,380px);padding:0 18px 20px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 140px -30px #e6bd6a66,0 50px 80px -40px #000000e6}.arch:before{content:"";z-index:2;border-radius:inherit;background:conic-gradient(from var(--angle), #e6bd6a2e 0 55%, var(--gold-2) 75%, #e6bd6a2e 95%);-webkit-mask-composite:xor;pointer-events:none;padding:2px;animation:7s linear infinite spin;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}@keyframes spin{to{--angle:360deg}}.arch-sky{opacity:.8;background-image:radial-gradient(1.5px 1.5px at 22% 30%,#fff,#0000),radial-gradient(1px 1px at 68% 22%,#fff,#0000),radial-gradient(1.5px 1.5px at 80% 44%,#fff,#0000),radial-gradient(1px 1px at 34% 52%,#fff,#0000),radial-gradient(1px 1px at 55% 14%,#fff,#0000),radial-gradient(1.5px 1.5px at 14% 60%,#fff,#0000);position:absolute;inset:0}.arch-moon{filter:drop-shadow(0 0 18px #f4e6bd99);border-radius:50%;width:44px;height:44px;animation:6s ease-in-out infinite float;position:absolute;top:25%;right:15%;box-shadow:inset -11px 5px #f4e6bd}@keyframes float{50%{transform:translateY(-8px)}}.arch-tag{z-index:1;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;background:var(--glass);border:1px solid var(--hair);-webkit-backdrop-filter:blur(8px);border-radius:999px;align-items:center;gap:8px;padding:5px 14px 5px 10px;font-size:.72rem;font-weight:500;display:inline-flex;position:absolute;top:13%;left:50%;transform:translate(-50%)}.arch .figure{width:100%;margin-bottom:-6px;position:relative}.arch .figure-qiblah,.arch .figure-halo{display:none}.figure-halo{opacity:.45}.arch-say{z-index:1;text-align:center;min-height:2.8em;color:var(--gold-2);place-items:center;font-weight:500;line-height:1.3;display:grid;position:relative}.arch-dots{z-index:1;gap:5px;margin-top:8px;display:flex;position:relative}.arch-dots i{width:6px;height:6px;transition:width .4s var(--ease), background .4s;background:#ffffff38;border-radius:999px}.arch-dots i.is-on{background:var(--gold-bg);width:20px}.scroll-cue{border:1.5px solid var(--line);border-radius:999px;width:26px;height:42px;margin-left:-13px;position:absolute;bottom:28px;left:50%}.scroll-cue span{background:var(--gold-bg);width:4px;height:8px;animation:cue 1.8s var(--ease) infinite;border-radius:4px;margin-left:-2px;position:absolute;top:8px;left:50%}@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}to{opacity:0;transform:translateY(16px)}}.stats{max-width:1180px;padding:0 var(--gutter);grid-template-columns:repeat(4,1fr);gap:14px;margin:0 auto;display:grid;position:relative}.stat{background:var(--tint);border:1px solid var(--hair);border-radius:22px;gap:2px;padding:22px 24px;display:grid}.stat b{font-family:var(--display);background:linear-gradient(135deg, var(--gold-2), var(--gold) 60%, var(--teal));color:#0000;font-variant-numeric:tabular-nums;-webkit-background-clip:text;background-clip:text;font-size:clamp(2.4rem,5vw,3.6rem);font-weight:400;line-height:1}.stat span{color:var(--muted);font-size:.92rem}.marquee{border-block:1px solid var(--hair);background:var(--tint);margin-top:56px;padding:18px 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 12% 88%,#0000);mask-image:linear-gradient(90deg,#0000,#000 12% 88%,#0000)}.marquee-track{width:max-content;animation:48s linear infinite marquee;display:flex}@keyframes marquee{to{transform:translate(-50%)}}.marquee-item{white-space:nowrap;color:var(--muted);letter-spacing:.06em;align-items:center;gap:14px;padding-right:28px;display:inline-flex}.marquee-item b{font-family:var(--arabic);color:var(--gold-2);font-size:1.7rem;font-weight:400;line-height:1.4}.marquee-item i{background:var(--gold-bg);opacity:.6;width:7px;height:7px;margin-inline-start:14px;transform:rotate(45deg)}.section{max-width:1180px;padding:88px var(--gutter) 24px;margin:0 auto}.section-head{justify-items:start;gap:14px;max-width:760px;margin-bottom:40px;display:grid}.section-head h2{font-size:clamp(2.1rem,5vw,3.4rem)}.section-head p{color:var(--muted)}.arabic{font-family:var(--arabic);background:var(--well);border:1px solid #ffffff0f;border-radius:18px;margin:18px 0 14px;padding:14px 20px;font-size:clamp(1.5rem,2.6vw,1.95rem);line-height:2}.arabic p{color:color-mix(in srgb, var(--text) 45%, transparent);transition:color .4s,text-shadow .4s}.arabic p.is-done{color:color-mix(in srgb, var(--text) 85%, transparent)}.arabic p.is-active{color:var(--gold-2);text-shadow:0 0 22px #e6bd6a80}.arabic-static p{color:var(--text)}.arabic-inline{font-family:var(--arabic);color:var(--gold-2);font-size:1.6rem;line-height:1.9}.translit{color:var(--teal);font-weight:500}.translit .badge{margin-inline-start:10px}.meaning{color:var(--muted);margin-top:10px;font-size:.95rem}.meaning strong{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-size:.72rem;display:block}.before-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;display:grid}.before-card{align-content:start;gap:8px;padding-top:26px;display:grid}.before-icon{fill:none;width:46px;stroke:var(--gold-2);stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round;border:1px solid var(--line);background:#e6bd6a1a;border-radius:14px;padding:10px;overflow:visible}.before-num{font-family:var(--display);color:var(--gold);opacity:.14;font-size:3.4rem;line-height:1;transition:opacity .3s;position:absolute;top:14px;right:22px}.before-card:hover .before-num{opacity:.4}.before-card h3{margin-top:8px;font-size:1.35rem}.before-card p{color:var(--muted);font-size:.95rem}.wudu{grid-template-columns:minmax(200px,280px) 1fr;gap:20px;display:grid}.wudu-list{align-content:start;gap:6px;margin:0;padding:0;list-style:none;display:grid}.wudu-list button{text-align:start;width:100%;color:var(--muted);border:1px solid #0000;border-radius:16px;align-items:center;gap:12px;padding:10px 14px;transition:background .2s,color .2s,transform .2s;display:flex}.wudu-list button:hover{background:var(--tint);transform:translate(4px)}.wudu-list button span{border:1px solid var(--line);border-radius:50%;flex:none;place-items:center;width:30px;height:30px;font-size:.85rem;font-weight:500;transition:all .3s;display:grid}.wudu-list button.is-done span{border-color:var(--teal);color:var(--teal);background:#45d3ab2e}.wudu-list button.is-active{color:var(--text);background:var(--surface-1);border-color:var(--line)}.wudu-list button.is-active span{background:var(--gold-bg);border-color:var(--gold);color:var(--ink);box-shadow:0 0 0 5px #e6bd6a29}.wudu-detail{flex-direction:column;justify-content:space-between;gap:24px;min-height:380px;display:flex}.wudu-detail>:not(.wudu-water){position:relative}.wudu-water{z-index:-1;pointer-events:none;background:linear-gradient(#6cc8f233,#6cc8f20d);position:absolute;bottom:0;left:0;right:0}.wudu-water svg{fill:#6cc8f233;width:200%;height:16px;animation:7s linear infinite wave;position:absolute;bottom:100%;left:0}.wudu-water svg+svg{fill:#6cc8f21f;animation-duration:11s;animation-direction:reverse}@keyframes wave{to{transform:translate(-50%)}}.wudu-detail h3{margin:8px 0 10px;font-size:2.1rem}.wudu-detail p{color:var(--text);opacity:.82;max-width:520px;margin-bottom:16px;font-size:1.1rem}.wudu-drops{gap:10px;height:64px;margin-bottom:18px;display:flex}.wudu-drops svg{fill:#6cc8f2;filter:drop-shadow(0 6px 14px #6cc8f280);width:34px}.wudu-drops .is-heart{fill:var(--gold)}.wudu-nav{gap:10px;display:flex}.notes{color:var(--muted);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:14px;margin:24px 0 0;padding:0;font-size:.92rem;list-style:none;display:grid}.notes li{border:1px dashed var(--line);border-radius:18px;padding:16px 18px}.ptabs{background:var(--well);border:1px solid var(--hair);-webkit-backdrop-filter:blur(14px);border-radius:24px;grid-template-columns:repeat(5,1fr);gap:4px;margin-bottom:20px;padding:6px;display:grid}.ptabs button{color:var(--muted);border-radius:18px;justify-items:center;gap:2px;padding:12px 6px;transition:color .25s;display:grid;position:relative}.ptabs button:hover{color:var(--text)}.ptabs button.is-active{color:var(--ink)}.tab-pill{background:linear-gradient(135deg, var(--gold-bg-2), var(--gold-bg));border-radius:18px;position:absolute;inset:0;box-shadow:0 10px 30px -10px #e6bd6ab3}.ptabs button>span:not(.tab-pill){position:relative}.ptab-name{font-family:var(--display);font-size:1.25rem;line-height:1.2}.ptab-time{font-size:.78rem;font-weight:400}.pinfo{padding:0}.pinfo-sky{color:#fff;text-shadow:0 2px 14px #00000080;justify-content:space-between;align-items:center;gap:16px;padding:26px 28px;display:flex;position:relative;overflow:hidden}.pinfo-sky>:not(.pinfo-orb){position:relative}.pinfo-sky h3{font-size:2.2rem}.pinfo-orb{background:radial-gradient(circle,#fff4d6f2 0 22%,#ffe29666 40%,#0000 70%);border-radius:50%;width:150px;height:150px;margin:-75px 0 0 -75px;position:absolute;top:50%;left:58%}.pinfo-orb.is-moon{filter:drop-shadow(0 0 16px #f4e6bdb3);background:0 0;width:56px;height:56px;margin:-28px 0 0 -28px;box-shadow:inset -14px 6px #f4e6bd}.pinfo-arabic{font-family:var(--arabic);font-size:2.9rem;line-height:1.2}.pinfo-body{padding:22px 28px 26px}.pinfo-stats{color:var(--muted);flex-wrap:wrap;gap:6px 28px;font-size:.92rem;display:flex}.pinfo-stats b{font-family:var(--display);color:var(--gold-2);margin-inline-end:4px;font-size:1.6rem;font-weight:400}.pinfo-label{color:var(--muted);margin:16px 0 10px;font-size:.9rem}.punits{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.unit-fard{--c:var(--gold)}.unit-sunnah{--c:var(--teal)}.unit-ghair{--c:var(--blue)}.unit-witr{--c:var(--pink)}.unit-nafl{--c:var(--grey)}.punit{text-align:start;background:var(--well);border:1px solid var(--hair);width:100%;height:100%;transition:border-color .25s, background .25s, box-shadow .25s, transform .25s var(--ease);border-radius:18px;align-items:center;gap:12px;padding:12px 14px;display:flex}.punit:hover{border-color:var(--c);transform:translateY(-3px)}.punit.is-active{border-color:var(--c);background:color-mix(in srgb, var(--c) 16%, transparent);box-shadow:0 0 0 1px var(--c), 0 14px 34px -16px var(--c)}.punit-num{border:1px solid var(--c);width:30px;height:30px;color:var(--c);border-radius:50%;flex:none;place-items:center;font-size:.85rem;font-weight:500;transition:all .25s;display:grid}.punit.is-active .punit-num{background:var(--c);color:#04261d}.punit-text{flex:1;line-height:1.3;display:grid}.punit-text b{font-weight:500}.punit-text small{color:var(--muted);font-size:.78rem}.unit-dots{gap:5px;display:flex}.unit-dots i{background:var(--c);border-radius:50%;width:12px;height:12px}.punit.is-optional .unit-dots i{border:2px dashed var(--c);background:0 0}.unit-head{margin:34px 0 16px}.unit-head h3{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:8px;font-size:1.9rem;display:flex}.unit-head p{color:var(--muted);max-width:860px}.rakats{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:0 0 20px;display:grid}.rakat{text-align:start;background:var(--well);border:1px solid var(--hair);border-radius:20px;flex-direction:column;align-items:stretch;gap:7px;padding:16px;transition:border-color .25s,box-shadow .25s;display:flex}.rakat:hover{border-color:var(--gold);box-shadow:0 18px 40px -24px #e6bd6ab3}.rakat-num{font-family:var(--display);color:var(--gold-2);justify-content:space-between;align-items:center;margin-bottom:4px;font-size:1.15rem;display:flex}.rakat-num small{font-family:var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--gold);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:.68rem;font-weight:500;transition:background .25s,color .25s}.rakat:hover .rakat-num small{background:var(--gold-bg);color:var(--ink)}.chip{border-inline-start:3px solid var(--c,var(--grey));background:color-mix(in srgb, var(--c,var(--grey)) 14%, transparent);border-radius:10px;padding:6px 12px;font-size:.86rem;font-weight:500}.chip-sana{--c:var(--blue)}.chip-fatiha{--c:var(--gold)}.chip-surah{--c:var(--teal)}.chip-move{--c:var(--grey);color:var(--muted);font-weight:400}.chip-sit{--c:#f0a36b}.chip-final{--c:#f07a6b}.chip-witr{--c:var(--pink)}.legend{color:var(--muted);flex-wrap:wrap;gap:10px 22px;margin-top:28px;font-size:.85rem;display:flex}.legend-item{align-items:center;gap:7px;display:inline-flex}.legend-item i{background:var(--c);border-radius:50%;width:11px;height:11px}.legend-item b{color:var(--text);font-weight:500}.player{border:1px solid var(--hair);background:linear-gradient(180deg, var(--surface-1), var(--surface-2));-webkit-backdrop-filter:blur(14px);border-radius:30px;scroll-margin-top:90px;overflow:hidden;box-shadow:inset 0 1px #ffffff0f,0 50px 100px -50px #000000f2}.player-main{grid-template-columns:minmax(0,5fr) minmax(0,6fr);display:grid}.stage{border-right:1px solid var(--hair);flex-direction:column;justify-content:flex-end;align-items:center;min-height:460px;padding:64px 20px 20px;display:flex;position:relative;overflow:hidden}.stage-sky{background:linear-gradient(180deg, color-mix(in srgb, var(--sky-1) 62%, #0b0a08) 0%, color-mix(in srgb, var(--sky-2) 40%, #0b0a08) 58%, #15120c 100%);position:absolute;inset:0}.stage-sky.is-night:after{content:"";opacity:.75;background-image:radial-gradient(1.5px 1.5px at 12% 30%,#fff,#0000),radial-gradient(1px 1px at 30% 62%,#fff,#0000),radial-gradient(1.5px 1.5px at 46% 22%,#fff,#0000),radial-gradient(1px 1px at 60% 70%,#fff,#0000),radial-gradient(1px 1px at 88% 52%,#fff,#0000),radial-gradient(1.5px 1.5px at 24% 86%,#fff,#0000);animation:4s ease-in-out infinite alternate twinkle;position:absolute;inset:0 0 40%}@keyframes twinkle{to{opacity:.3}}.stage-orb{background:radial-gradient(circle,#fff6dcf2 0 20%,#ffe09659 42%,#0000 70%);border-radius:50%;width:120px;height:120px;margin:-60px 0 0 -60px;position:absolute}.stage-orb.is-moon{filter:drop-shadow(0 0 14px #f4e6bdb3);background:0 0;width:40px;height:40px;margin:-20px 0 0 -20px;box-shadow:inset -10px 4px #f4e6bd}.stage-pulse{border:2px solid var(--gold-2);pointer-events:none;border-radius:50%;width:240px;height:240px;margin:-120px 0 0 -120px;position:absolute;top:50%;left:50%}.stage-top{z-index:2;justify-content:space-between;display:flex;position:absolute;top:16px;left:16px;right:16px}.figure{filter:drop-shadow(0 18px 18px #00000059);width:100%;max-width:400px;position:relative}.figure-qiblah{stroke:var(--gold-2)}.figure-qiblah text{font-family:var(--body);letter-spacing:.1em;fill:var(--gold-2);stroke:none;font-size:11px}.figure-turn path{stroke:var(--gold-2)}.stage-pose{letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);margin-top:6px;font-size:.8rem;font-weight:500;position:relative}.stage-play{z-index:3;width:82px;height:82px;color:var(--ink);background:linear-gradient(135deg, var(--gold-bg-2), var(--gold-bg));border-radius:50%;place-items:center;margin:auto;display:grid;position:absolute;inset:0;box-shadow:0 20px 40px -10px #0009}.stage-play:before,.stage-play:after{content:"";border:2px solid var(--gold);border-radius:50%;animation:2.4s ease-out infinite halo;position:absolute;inset:0}.stage-play:after{animation-delay:1.2s}@keyframes halo{to{opacity:0;transform:scale(1.9)}}.stage-play svg{width:34px;height:34px}.stage-done{z-index:4;text-align:center;-webkit-backdrop-filter:blur(8px);background:#0b0a08d6;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;display:flex;position:absolute;inset:0}.stage-done svg{fill:none;width:76px;stroke:var(--teal);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.stage-done strong{font-family:var(--display);font-size:1.5rem;font-weight:400}.stage-done-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.stage-done .btn{padding:11px 22px;font-size:.95rem}.caption{scrollbar-width:thin;scrollbar-color:var(--line) transparent;height:540px;padding:30px clamp(18px,3vw,36px);overflow-y:auto}.caption-head{align-items:center;gap:14px;margin-bottom:12px;display:flex}.caption-letter{width:44px;height:44px;font-family:var(--display);color:var(--ink);background:linear-gradient(135deg, var(--gold-bg-2), var(--gold-bg));border-radius:14px;flex:none;place-items:center;font-size:1.3rem;display:grid;box-shadow:0 10px 24px -10px #e6bd6acc}.caption-head h3{font-size:clamp(1.4rem,2.6vw,1.9rem)}.caption-instruction{font-size:1.02rem}.repeat{align-items:center;gap:8px;margin-bottom:12px;display:flex}.repeat span{border:1px solid var(--line);width:30px;height:30px;color:var(--muted);transition:all .3s var(--ease);border-radius:50%;place-items:center;font-size:.85rem;font-weight:500;display:grid}.repeat span.is-on{background:var(--teal);border-color:var(--teal);color:#04261d;transform:scale(1.1);box-shadow:0 0 0 5px #45d3ab29}.repeat em{color:var(--muted);margin-inline-start:4px;font-size:.85rem;font-style:normal}.timeline{border-top:1px solid var(--hair);gap:3px;padding:14px 16px 0;display:flex}.timeline-seg{background-color:#ffffff24;background-clip:content-box;border-radius:3px;flex-basis:0;height:18px;padding:6px 0;transition:background-color .2s;position:relative}.timeline-seg:hover{background-color:#ffffff57}.timeline-seg.is-rakat-start{margin-inline-start:7px}.timeline-seg span{background:linear-gradient(90deg, var(--teal), var(--gold));transform-origin:0;border-radius:3px;transition:transform .1s linear;position:absolute;inset:6px 0}.controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px 12px;display:flex}.controls-group{align-items:center;gap:8px;display:flex}.controls button{min-width:42px;height:42px;transition:background .2s, transform .2s var(--ease);border-radius:999px;place-items:center;display:grid;position:relative}.controls button:hover:not(:disabled){background:#ffffff1a}.controls button:active:not(:disabled){transform:scale(.92)}.controls .controls-play{width:50px;height:50px;color:var(--ink);background:var(--gold-bg)}.controls .controls-play:hover:not(:disabled){background:var(--gold-bg-2)}.controls-ring{fill:none;width:calc(100% + 10px);height:calc(100% + 10px);stroke:var(--teal);stroke-width:2px;stroke-linecap:round;position:absolute;inset:-5px;transform:rotate(-90deg)}.controls-ring circle{transition:stroke-dashoffset .15s linear}.controls-speed{background:var(--well);border-radius:999px;gap:2px;padding:4px}.controls-speed button{min-width:40px;height:34px;color:var(--muted);padding:0 10px;font-size:.85rem;font-weight:500}.controls-speed button.is-active{color:var(--ink);background:var(--gold-bg)}.rail{scrollbar-width:thin;scrollbar-color:var(--line) transparent;gap:8px;padding:4px 16px 18px;display:flex;position:relative;overflow-x:auto}.rail-chip{color:var(--muted);border:1px solid var(--hair);transition:all .25s var(--ease);border-radius:999px;flex:none;align-items:center;gap:8px;padding:6px 14px 6px 6px;font-size:.85rem;display:flex}.rail-chip b{background:var(--tint);border-radius:50%;place-items:center;width:24px;height:24px;font-size:.75rem;display:grid}.rail-chip:hover{color:var(--text);border-color:var(--line)}.rail-chip.is-active{color:var(--ink);background:var(--gold-bg);border-color:var(--gold)}.rail-chip.is-active b{background:#00000026}.video-embed{padding:0 16px 18px}.video-embed iframe{aspect-ratio:16/9;border:0;border-radius:16px;width:100%}.recitation h3{font-size:1.5rem}.dhikr{gap:16px;margin:18px 0 0;padding:0;list-style:none;display:grid}.dhikr li{background:var(--well);border-radius:18px;padding:14px 18px}.tasbih{text-align:center;justify-items:center;gap:12px;height:100%;display:grid}.tasbih-phases{flex-wrap:wrap;justify-content:center;gap:6px;font-size:.8rem;display:flex}.tasbih-phases span{border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:4px 10px;transition:all .3s}.tasbih-phases .is-active{color:var(--ink);background:var(--gold-bg);border-color:var(--gold)}.tasbih-phases .is-done{color:var(--teal);border-color:var(--teal)}.tasbih-btn{touch-action:manipulation;background:radial-gradient(circle at 50% 35%,#e6bd6a29,#0000 70%);border-radius:50%;width:180px;height:180px;position:relative}.tasbih-btn svg{fill:none;stroke-width:7px;position:absolute;inset:0;transform:rotate(-90deg)}.tasbih-track{stroke:#ffffff14}.tasbih-ring{stroke:var(--gold);stroke-linecap:round;filter:drop-shadow(0 0 6px #e6bd6ab3)}.tasbih-count{font-family:var(--display);font-size:1.6rem;display:grid;position:relative}.tasbih-count b{font-family:var(--body);font-variant-numeric:tabular-nums;font-size:3.2rem;font-weight:400;line-height:1;display:block}.tasbih-count small{font-family:var(--body);color:var(--muted);font-size:.85rem}.tasbih .note{border:0;margin:0;padding:0}.faq{gap:10px;max-width:860px;display:grid}.faq-item{padding:0}.faq-item.is-open{border-color:#e6bd6a80}.faq-item button{text-align:start;width:100%;font-family:var(--display);justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;font-size:1.22rem;display:flex}.faq-item button span{width:34px;height:34px;font-family:var(--body);color:var(--gold);border:1px solid var(--line);border-radius:50%;flex:none;place-items:center;font-size:1.4rem;line-height:1;display:grid}.faq-item p{color:var(--muted);padding:0 24px 22px}.checklist{max-width:860px}.checklist-bar{background:var(--tint);border-radius:999px;height:8px;margin-bottom:10px;overflow:hidden}.checklist-bar span{background:linear-gradient(90deg, var(--teal), var(--gold));border-radius:999px;height:100%;display:block;box-shadow:0 0 14px #e6bd6a99}.checklist ol{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:8px;margin:18px 0 0;padding:0;list-style:none;display:grid}.checklist label{background:var(--well);cursor:pointer;transition:border-color .2s, color .2s, transform .2s var(--ease);border:1px solid #0000;border-radius:16px;align-items:center;gap:12px;padding:12px 14px;display:flex}.checklist label:hover{border-color:var(--line);transform:translate(4px)}.checklist label.is-on{color:var(--muted);-webkit-text-decoration:line-through #a3b6ac80;text-decoration:line-through #a3b6ac80}.checklist input{opacity:0;position:absolute}.checklist input:focus-visible+.check{outline:2px solid var(--gold);outline-offset:3px}.check{border:1.5px solid var(--gold);border-radius:8px;flex:none;place-items:center;width:24px;height:24px;transition:background .2s;display:grid}.is-on .check{background:var(--gold-bg)}.check svg{fill:none;width:16px;stroke:var(--ink);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.checklist-num{font-family:var(--display);color:var(--gold);min-width:1.2em}.footer{max-width:1180px;padding:48px var(--gutter) 40px;border-top:1px solid var(--hair);margin:96px auto 0}.footer-grid{grid-template-columns:minmax(0,2fr) repeat(2,minmax(0,1fr));gap:40px;display:grid}.footer-brand p{max-width:380px;color:var(--muted);margin-top:14px;font-size:.95rem}.footer-col{align-content:start;justify-items:start;gap:8px;display:grid}.footer-col h4{font-family:var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;font-size:.75rem;font-weight:500}.footer-col a,.footer-col button{color:var(--muted);padding:0;text-decoration:none;transition:color .2s,transform .2s}.footer-col a:hover,.footer-col button:hover{color:var(--text);transform:translate(4px)}.footer-note{border:1px dashed var(--line);color:var(--muted);border-radius:18px;margin-top:40px;padding:18px 22px;font-size:.86rem}.footer-bottom{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:24px;font-size:.85rem;display:flex}.totop{right:max(18px, env(safe-area-inset-right));bottom:max(18px, env(safe-area-inset-bottom));z-index:40;background:var(--glass-solid);-webkit-backdrop-filter:blur(12px);border-radius:50%;width:52px;height:52px;position:fixed;box-shadow:0 16px 30px -12px #000000e6}.totop svg{fill:none;stroke-linecap:round;stroke-linejoin:round;display:block}.totop-track{stroke:var(--hair);stroke-width:2px}.totop-ring{stroke:var(--gold);stroke-width:2.5px;transform-origin:50%;transform:rotate(-90deg)}.totop-arrow{stroke:var(--gold-2);stroke-width:2.5px}@media (width<=1200px){.nav{padding:6px 6px 6px 18px}.nav-links,.nav-cta{display:none}.nav-toggle{display:flex}}@media (width<=860px){html{scroll-padding-top:84px}body{font-size:1rem}.hero{padding:104px 20px 84px}.hero-grid{grid-template-columns:1fr;gap:40px}.hero-content{text-align:center;justify-items:center;gap:16px}.hero-cta{flex-direction:column;width:100%}.hero-jump{justify-content:center}.hero-jump span{width:100%;margin:0}.arch{width:min(100%,300px)}.scroll-cue{display:none}.stats{grid-template-columns:repeat(2,1fr);gap:10px;padding:0 16px}.stat{padding:16px 18px}.marquee{margin-top:40px;padding:12px 0}.section{padding:64px 16px 8px}.section-head{margin-bottom:26px}.card{padding:20px}.arabic{padding:12px 14px;font-size:1.5rem}.ptabs{border-radius:20px;gap:2px;padding:4px}.ptabs button,.tab-pill{border-radius:16px}.ptabs button{padding:10px 2px}.ptab-name{font-size:.92rem}.ptab-time{font-size:.66rem}.pinfo{padding:0}.pinfo-sky{padding:18px}.pinfo-sky h3{font-size:1.6rem}.pinfo-arabic{font-size:2.1rem}.pinfo-orb{width:110px;height:110px;margin:-55px 0 0 -55px}.pinfo-body{padding:16px 16px 18px}.unit-head h3{font-size:1.45rem}.rakats{scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -16px 16px;padding:6px 16px;display:flex;overflow-x:auto}.rakats .rakat{scroll-snap-align:center;flex:0 0 72%}.player{border-radius:24px;flex-direction:column;display:flex}.player-main{display:contents}.stage{border-right:0;order:1;min-height:0;padding:56px 16px 12px}.figure{max-width:250px}.stage-play{width:70px;height:70px}.stage-done strong{font-size:1.25rem}.timeline{order:2;gap:2px;padding:12px 12px 0}.timeline-seg.is-rakat-start{margin-inline-start:4px}.controls{flex-wrap:nowrap;order:3;gap:4px;padding:8px 12px}.controls-group{gap:4px}.controls button{min-width:44px;height:44px}.controls-speed button{min-width:36px;height:34px;padding:0 6px}.rail{scrollbar-width:none;order:4;padding:2px 12px 14px}.caption{border-top:1px solid var(--hair);order:5;height:auto;padding:20px 16px 24px}.caption-letter{border-radius:12px;width:38px;height:38px;font-size:1.1rem}.video-embed{order:6}.wudu{grid-template-columns:1fr;gap:12px}.wudu-list{scrollbar-width:none;gap:8px;margin:0 -16px;padding:0 16px 4px;display:flex;overflow-x:auto}.wudu-list li{flex:none}.wudu-list button{white-space:nowrap;border-color:var(--line);padding:8px 14px 8px 8px}.wudu-list button:hover{transform:none}.wudu-detail{min-height:320px}.wudu-detail h3{font-size:1.6rem}.wudu-nav .btn{flex:1}.faq-item button{padding:16px 18px;font-size:1.08rem}.faq-item p{padding:0 18px 18px}.legend{gap:8px 16px;font-size:.8rem}.tasbih-btn{width:200px;height:200px}.footer{margin-top:64px;padding:36px 16px 96px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.totop{width:44px;height:44px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}.next-pill{color:var(--text);background:var(--tint);border:1px solid var(--hair);-webkit-backdrop-filter:blur(10px);transition:border-color .25s, transform .25s var(--ease);border-radius:999px;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:10px 18px 10px 14px;text-decoration:none;display:inline-flex}.next-pill:hover{border-color:var(--gold);transform:translateY(-2px)}.next-pill i{background:var(--gold-bg);border-radius:50%;width:8px;height:8px;animation:2s infinite ping-gold;box-shadow:0 0 #e6bd6ab3}@keyframes ping-gold{70%,to{box-shadow:0 0 0 10px #e6bd6a00}}.next-pill em{color:var(--gold-2);font-variant-numeric:tabular-nums;font-style:normal;font-weight:500}.next-pill small{color:var(--muted);font-size:.8rem}.loc{gap:14px;display:grid}.loc-main{flex-wrap:wrap;align-items:center;gap:14px 16px;display:flex}.loc-pin{fill:none;width:44px;stroke:var(--gold-2);stroke-width:1.5px;border:1px solid var(--line);background:#e6bd6a1a;border-radius:14px;flex:none;padding:9px}.loc-main>div:first-of-type{flex:220px;line-height:1.35;display:grid}.loc-main strong{font-family:var(--display);font-size:1.35rem;font-weight:400}.loc-main span{color:var(--muted);font-size:.92rem}.loc-actions{flex-wrap:wrap;gap:8px;display:flex}.loc-actions .btn,.panel-actions .btn{padding:11px 20px;font-size:.92rem}.loc-hint{color:var(--gold-2);border:1px dashed var(--line);background:#e6bd6a14;border-radius:14px;padding:10px 14px;font-size:.88rem}.loc-hint.is-error{color:#ffb4a8;background:#f07a6b14;border-color:#f07a6b80}.loc-picker{overflow:hidden}.loc-picker input,.field select{width:100%;font:inherit;color:var(--text);background:var(--well);border:1px solid var(--line);border-radius:14px;padding:12px 16px}.loc-cities{scrollbar-width:thin;scrollbar-color:var(--line) transparent;flex-wrap:wrap;gap:6px;max-height:210px;margin-top:10px;display:flex;overflow-y:auto}.loc-cities button{border:1px solid var(--hair);background:var(--tint);border-radius:999px;padding:7px 14px;font-size:.9rem;transition:border-color .2s,background .2s}.loc-cities button:hover{border-color:var(--gold);background:#e6bd6a1f}.loc-cities small{color:var(--muted)}.nextp{background:radial-gradient(600px 260px at 100% 0%, #e6bd6a29, transparent 70%), linear-gradient(180deg, var(--surface-1), var(--surface-2));grid-template-columns:1fr auto;align-items:center;gap:24px;margin-top:16px;padding-bottom:34px;display:grid}.nextp-text{justify-items:start;gap:8px;display:grid}.nextp h3{font-size:clamp(2.2rem,5vw,3.4rem)}.nextp h3 small{font-family:var(--body);color:var(--muted);font-size:1.05rem;font-weight:300}.nextp p{color:var(--muted);min-height:1.6em}.nextp .btn{padding:10px 20px;font-size:.92rem}.nextp-clock{gap:10px;display:flex}.nextp-clock div{background:var(--well);border:1px solid var(--hair);border-radius:20px;justify-items:center;min-width:86px;padding:14px 10px 10px;display:grid}.nextp-clock b{color:var(--gold-2);font-variant-numeric:tabular-nums;font-size:clamp(2rem,4.4vw,3rem);font-weight:300;line-height:1}.nextp-clock span{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-size:.7rem}.nextp-bar{background:var(--tint);height:5px;position:absolute;bottom:0;left:0;right:0}.nextp-bar span{background:linear-gradient(90deg, var(--teal), var(--gold));transform-origin:0;height:100%;transition:transform 1s linear;display:block}.tgrid{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.tcard{flex-direction:column;gap:8px;padding:18px 16px;display:flex}.tcard header{justify-content:space-between;align-items:center;gap:6px;min-height:28px;display:flex}.tcard h3{font-size:1.25rem}.tcard-time{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:1.7rem;font-weight:300;line-height:1.1}.tcard.is-past h3,.tcard.is-past .tcard-time{color:var(--muted)}.tcard.is-now{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold), 0 24px 50px -24px #e6bd6ab3}.tcard.is-now .tcard-time{color:var(--gold-2)}.tcard.is-next{border-color:#45d3ab99}.tcard.is-sunrise{background:linear-gradient(180deg, #e8a87c29, var(--surface-2))}.tcard .muted{font-size:.8rem;line-height:1.4}.tcard-actions{align-items:center;gap:6px;margin-top:auto;padding-top:6px;display:flex}.icon-btn{width:38px;height:38px;color:var(--muted);border:1px solid var(--hair);transition:all .25s var(--ease);border-radius:50%;place-items:center;display:grid}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:18px}.icon-btn:hover{color:var(--text);border-color:var(--line);transform:translateY(-2px)}.icon-btn.is-on{color:var(--ink);background:var(--gold-bg);border-color:var(--gold);box-shadow:0 0 0 5px #e6bd6a29}.icon-btn.is-done{color:#04261d;background:var(--teal);border-color:var(--teal)}.tcard-learn{color:var(--gold);text-underline-offset:4px;margin-inline-start:auto;padding:6px 4px;font-size:.82rem;font-weight:500;text-decoration:underline}.tracker{color:var(--muted);flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px;font-size:.95rem;display:flex}.tracker b{color:var(--text)}.tracker-dots{gap:6px;display:flex}.tracker-dots i{background:#ffffff1a;border-radius:999px;width:26px;height:8px;transition:background .4s}.tracker-dots i.is-on{background:var(--teal);box-shadow:0 0 10px #45d3ab99}.panels{margin-top:20px}.panel{align-content:start;gap:14px;display:grid}.panel>h3{margin:0}.field{gap:6px;display:grid}.field>span{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-size:.75rem;font-weight:500}.seg{background:var(--well);border:1px solid var(--hair);border-radius:18px;flex-wrap:wrap;gap:2px;width:fit-content;max-width:100%;padding:4px;display:inline-flex}.seg button{color:var(--muted);border-radius:14px;padding:8px 14px;font-size:.88rem;font-weight:500;transition:all .2s}.seg button:hover{color:var(--text)}.seg button.is-active{color:var(--ink);background:var(--gold-bg)}.panel-actions{flex-wrap:wrap;gap:8px;display:flex}.panel .note{margin:0}.toast{left:0;right:0;bottom:max(20px, env(safe-area-inset-bottom));z-index:70;background:var(--glass-solid);border:1px solid var(--gold);-webkit-backdrop-filter:blur(16px);border-radius:24px;align-items:center;gap:14px;width:min(560px,100% - 24px);margin:0 auto;padding:14px 16px;display:flex;position:fixed;box-shadow:0 0 0 6px #e6bd6a1f,0 30px 60px -20px #000000e6}.toast-bell{width:46px;height:46px;color:var(--ink);background:linear-gradient(135deg, var(--gold-bg-2), var(--gold-bg));border-radius:50%;flex:none;place-items:center;display:grid}.toast-bell svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:22px}.toast>div{flex:1;line-height:1.3;display:grid}.toast strong{font-family:var(--display);font-size:1.15rem;font-weight:400}.toast span{color:var(--muted);font-size:.9rem}.toast .btn{white-space:nowrap;padding:9px 16px;font-size:.88rem}.toast-close{width:36px;height:36px;color:var(--muted);border:1px solid var(--hair);border-radius:50%;flex:none;font-size:1.4rem;line-height:1}.qibla{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,64px);display:grid}.compass{background:radial-gradient(circle at 50% 35%,#e6bd6a24,#0000 60%),radial-gradient(circle,#221c12f0,#0b0a08f2);border-radius:50%;justify-self:center;width:min(100%,420px);transition:box-shadow .5s;box-shadow:inset 0 0 60px #0009,0 40px 80px -40px #000000e6,0 0 100px -30px #e6bd6a59}.compass.is-aligned{box-shadow:inset 0 0 60px #0009, 0 0 0 4px var(--teal), 0 0 120px -10px #45d3abe6}.compass svg{display:block}.compass-rim{fill:none;stroke:var(--line);stroke-width:1.5px}.compass-dial{transform-box:view-box;transform-origin:150px 150px;transition:transform .35s ease-out}.compass-tick{stroke:#ffffff38;stroke-width:1px}.compass-tick.is-major{stroke:#ffffff8c;stroke-width:1.6px}.compass-letter{font-family:var(--display);fill:var(--muted);text-anchor:middle;font-size:20px}.compass-letter.is-north{fill:#f07a6b}.compass-needle{fill:var(--gold);opacity:.9;filter:drop-shadow(0 0 8px #e6bd6ab3)}.compass-kaaba{fill:#0b0b0b;stroke:var(--gold-2);stroke-width:1.5px}.compass-kaaba-band{stroke:var(--gold);stroke-width:3px}.compass-hub{fill:var(--gold-2);stroke:var(--bg);stroke-width:3px}.compass-pointer{fill:var(--teal)}.qibla-info{justify-items:start;gap:14px;display:grid}.qibla-bearing{align-items:center;gap:18px;display:flex}.qibla-bearing b{font-family:var(--display);background:linear-gradient(135deg, var(--gold-2), var(--gold) 60%, var(--teal));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(3.4rem,9vw,5.6rem);font-weight:400;line-height:1}.qibla-bearing span{color:var(--muted);line-height:1.5}.qibla-status{background:var(--tint);border:1px solid var(--hair);border-radius:16px;padding:12px 18px;font-size:1.1rem;font-weight:500}.qibla-status.is-aligned{color:#04261d;background:var(--teal);border-color:var(--teal)}.qibla-info .note{margin:0}@media (width<=1100px){.tgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=860px){.next-pill{border-radius:20px;justify-content:center}.loc-actions{width:100%}.loc-actions .btn{flex:1;padding:11px 12px}.nextp{grid-template-columns:1fr;gap:18px}.nextp-clock div{flex:1;min-width:0}.tgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tcard{padding:16px 14px}.tcard-time{font-size:1.5rem}.seg button{padding:8px 11px}.panel-actions .btn{flex:100%}.qibla{grid-template-columns:1fr}.compass{width:min(100%,320px)}.toast{bottom:max(12px, env(safe-area-inset-bottom));flex-wrap:wrap}}.nav-toggle{margin-inline-start:0;display:flex}.prefs{margin-inline-start:auto;position:relative}.nav-links+.prefs{margin-inline-start:0}.nav-icon{background:var(--tint);border:1px solid var(--line);border-radius:999px;align-items:center;gap:8px;height:44px;padding:0 14px 0 12px;font-size:.88rem;font-weight:500;transition:border-color .2s;display:inline-flex}.nav-icon:hover{border-color:var(--gold)}.nav-icon svg{fill:none;width:20px;stroke:var(--gold-2);stroke-width:1.5px}.prefs-menu{top:calc(100% + 12px);z-index:5;background:var(--glass-solid);border:1px solid var(--hair);-webkit-backdrop-filter:blur(18px);border-radius:22px;gap:14px;width:max-content;max-width:calc(100vw - 32px);padding:18px;display:grid;position:absolute;inset-inline-end:0;box-shadow:0 40px 60px -20px #000000b3}.nav-menu{background:var(--bg);grid-template-columns:repeat(3,1fr);display:grid}.footer-links{grid-template-columns:repeat(2,auto);justify-items:start;gap:8px 28px;display:grid}.listen{color:var(--gold-2);background:color-mix(in srgb, var(--gold) 12%, transparent);border:1px solid var(--line);transition:transform .2s var(--ease), border-color .2s;border-radius:999px;align-items:center;gap:8px;margin:0 0 14px;padding:8px 16px 8px 10px;font-size:.9rem;font-weight:500;display:inline-flex}.listen:hover{border-color:var(--gold);transform:translateY(-2px)}.listen svg{width:26px;height:26px;fill:var(--ink);background:var(--gold-bg);border-radius:50%;padding:5px}.listen.is-playing{border-color:var(--teal);color:var(--teal)}.listen-bars{align-items:flex-end;gap:3px;height:14px;display:inline-flex}.listen-bars i{background:var(--teal);transform-origin:bottom;border-radius:2px;width:3px;height:100%;animation:.9s ease-in-out infinite bars}.listen-bars i:nth-child(2){animation-delay:.2s}.listen-bars i:nth-child(3){animation-delay:.4s}@keyframes bars{50%{transform:scaleY(.3)}}.reveal{text-align:start;width:100%;color:var(--muted);border:1px dashed var(--line);background:var(--tint);border-radius:14px;margin:8px 0;padding:12px 16px;font-size:.92rem;transition:border-color .2s;display:block}.reveal:hover{border-color:var(--gold);color:var(--text)}.practice{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;padding:0 16px 16px;font-size:.85rem;display:flex}.practice span{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-inline-end:4px;font-size:.72rem;font-weight:500}.practice button{border:1px solid var(--hair);border-radius:999px;padding:6px 14px;transition:all .2s}.practice button.is-active{color:var(--ink);background:var(--gold-bg);border-color:var(--gold-bg)}.panels{grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:20px;display:grid}.loc-status{min-height:1.5em;margin-top:8px;font-size:.82rem}.qada-grid{gap:6px;display:grid}.qada-row{background:var(--well);border-radius:14px;grid-template-columns:1fr 40px 48px 40px;align-items:center;gap:6px;padding:6px 6px 6px 14px;display:grid}.qada-row b{text-align:center;color:var(--gold-2);font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:400}.qada-row button{border:1px solid var(--line);border-radius:50%;width:40px;height:40px;font-size:1.3rem;line-height:1;transition:all .2s}.qada-row button:hover:not(:disabled){background:var(--gold-bg);color:var(--ink)}.timetable-bar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px;display:flex}.timetable-nav{align-items:center;gap:6px;display:flex}.timetable-today{color:var(--gold);text-underline-offset:4px;padding:6px 12px;font-size:.85rem;text-decoration:underline}.timetable-print{margin-inline-start:auto;padding:10px 18px;font-size:.9rem}.timetable>h3{margin-bottom:2px;font-size:1.7rem}.timetable-scroll{border:1px solid var(--hair);scrollbar-width:thin;scrollbar-color:var(--line) transparent;border-radius:16px;margin-top:16px;overflow-x:auto}.timetable table{border-collapse:collapse;font-variant-numeric:tabular-nums;white-space:nowrap;width:100%}.timetable th,.timetable td{text-align:start;border-bottom:1px solid var(--hair);padding:9px 14px}.timetable thead th{letter-spacing:.12em;text-transform:uppercase;color:var(--gold);background:var(--well);font-size:.72rem;font-weight:500;position:sticky;top:0}.timetable tbody th{color:var(--muted);font-weight:500}.timetable tbody tr:last-child>*{border-bottom:0}.timetable tbody tr:hover{background:var(--tint)}.timetable tr.is-ramadan{background:color-mix(in srgb, var(--gold) 9%, transparent)}.timetable tr.is-today{background:color-mix(in srgb, var(--teal) 18%, transparent);box-shadow:inset 3px 0 0 var(--teal)}.timetable tr.is-today th{color:var(--text)}.mosques-head{flex-wrap:wrap;align-items:center;gap:12px 18px;margin-bottom:16px;display:flex}.mosque-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.mosque{align-items:center;gap:14px;padding:16px 18px;display:flex}.mosque>div{flex:1;min-width:0;line-height:1.35;display:grid}.mosque strong{font-family:var(--display);font-size:1.15rem;font-weight:400}.mosque span{color:var(--muted);font-size:.85rem}.mosque>b{color:var(--gold-2);white-space:nowrap;font-weight:500}.mosque .btn{padding:8px 16px;font-size:.85rem}.library{margin-top:36px}.library>h3{margin-bottom:6px;font-size:1.8rem}.library-tabs{scrollbar-width:none;gap:6px;margin:16px 0;padding-bottom:4px;display:flex;overflow-x:auto}.library-tabs button{color:var(--muted);border:1px solid var(--hair);border-radius:999px;flex:none;padding:8px 16px;font-size:.92rem;transition:all .2s}.library-tabs button:hover{color:var(--text);border-color:var(--line)}.library-tabs button.is-active{color:var(--ink);background:var(--gold-bg);border-color:var(--gold-bg)}.quiz{max-width:860px;min-height:380px;padding-top:34px}.quiz-bar{background:var(--tint);height:5px;position:absolute;inset:0 0 auto}.quiz-bar span{background:linear-gradient(90deg, var(--teal), var(--gold));height:100%;display:block}.quiz h3{margin:10px 0 20px;font-size:clamp(1.3rem,2.6vw,1.7rem);line-height:1.3}.quiz-options{gap:8px;display:grid}.quiz-options button{text-align:start;background:var(--well);border:1px solid var(--hair);transition:border-color .2s, transform .2s var(--ease), background .2s;border-radius:16px;padding:14px 18px}.quiz-options button:disabled{opacity:1;cursor:default}.quiz-options button:hover:not(:disabled){border-color:var(--gold);transform:translate(4px)}.quiz-options .is-right{border-color:var(--teal);background:color-mix(in srgb, var(--teal) 20%, transparent)}.quiz-options .is-wrong{background:#f07a6b29;border-color:#f07a6b}.quiz-next{color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;display:flex}.quiz-next .btn,.quiz-done .btn{padding:11px 22px;font-size:.95rem}.quiz-done{text-align:center;justify-items:center;gap:12px;padding:40px 0 20px;display:grid}.quiz-done b{font-family:var(--display);color:var(--gold-2);font-size:4.5rem;font-weight:400;line-height:1}.quiz-done p{color:var(--muted);max-width:420px}[data-theme=light]{--bg:#f8f5ef;--text:#1b1711;--muted:#62594b;--gold:#8a5a00;--gold-2:#6b4500;--teal:#0a7c5c;--blue:#2b6ea6;--pink:#a3418f;--grey:#5d6f66;--line:#8a5a004d;--hair:#0a322824;--surface-1:#fffffff0;--surface-2:#fffdf7cc;--glass:#fffcf4d6;--glass-solid:#fffcf4fa;--well:#0a32280f;--tint:#0a32280d;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=light] .card{box-shadow:inset 0 1px #fffc,0 24px 50px -36px #12372c73}[data-theme=light] .aurora i{opacity:.32}[data-theme=light] .player{box-shadow:0 40px 80px -50px #12372c80}[data-theme=light] :is(.stage,.arch,.compass,.pinfo-sky){--text:#f6f0e3;--muted:#b8ad99;--gold:#e6bd6a;--gold-2:#f4dca0;--teal:#45d3ab;--line:#e6bd6a2e;--hair:#ffffff14;--glass:#0e0c08b8;--tint:#ffffff0b;color:var(--text)}html[lang=ur]{--body:"Outfit", "Noto Nastaliq Urdu", "Noto Naskh Arabic", sans-serif;--display:"Marcellus", "Noto Nastaliq Urdu", serif}html[lang=hi]{--body:"Outfit", "Noto Sans Devanagari", sans-serif;--display:"Marcellus", "Noto Sans Devanagari", serif}html:is([lang=ur],[lang=hi]) *{letter-spacing:0!important;text-transform:none!important}html[lang=ur] body{line-height:2.25}html[lang=ur] :is(h1,h2,h3,h4){line-height:1.9}html[lang=ur] .hero h1{font-size:clamp(2.2rem,5.4vw,4.2rem);line-height:1.8}html[lang=hi] .hero h1{font-size:clamp(2.4rem,6vw,4.6rem);line-height:1.3}html:is([lang=ur],[lang=hi]) .word{overflow:visible}html[lang=ur] :is(.btn,.seg button,.badge,.rail-chip,.ptabs button){line-height:2}html[dir=rtl] :is(.nextp-bar span,.scrollbar){transform-origin:100%}html[dir=rtl] :is(.timeline,.controls-group){direction:ltr}html[dir=rtl] .timetable-nav svg{transform:scaleX(-1)}html[dir=rtl] .btn:after{display:none}@media (width>=1201px){.nav-menu{width:520px;inset-inline-start:auto}}@media (width<=1200px){.prefs{margin-inline-start:auto}}@media (width<=860px){.nav-icon span{display:none}.nav-icon{justify-content:center;width:44px;padding:0}.nav-menu{grid-template-columns:repeat(2,1fr)}.nav-menu a{padding:11px 12px;font-size:1.05rem}.practice{order:4;padding:0 12px 14px}.timetable th,.timetable td{padding:8px 10px;font-size:.9rem}.timetable-print{flex:100%;margin-inline-start:0}.mosque{flex-wrap:wrap}.mosque>div{flex:100%}.mosque .btn{margin-inline-start:auto}}@media print{.nav,.scrollbar,.aurora,.hero,.stats,.marquee,.footer,.totop,.toast,.skip,.timetable-bar,main>.section:not(#timetable),#timetable .section-head{display:none!important}html,body{font-size:11pt;color:#000!important;background:#fff!important}.section{max-width:none;padding:0}.card.timetable{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;padding:0;overflow:visible;opacity:1!important;transform:none!important}.timetable *,.timetable thead th{color:#000!important;box-shadow:none!important;background:0 0!important}.timetable-scroll{border:0;overflow:visible}.timetable th,.timetable td{border-bottom:.5pt solid #999;padding:3pt 8pt}}[data-theme=light] :is(.nav-toggle span,.hero-stars i){background:var(--gold)}:root{--bg-2:#15120c;--line:#e6bd6a3d;--teal:#4fd0a4}body{background-image:repeating-linear-gradient(45deg,#e6bd6a06 0 2px,#0000 2px 9px),repeating-linear-gradient(-45deg,#e6bd6a06 0 2px,#0000 2px 9px)}[data-theme=light]{--surface-1:#fffffff5;--surface-2:#ffffffd1;--glass:#ffffffdb;--glass-solid:#fffffffa;--well:#1b17110e;--tint:#1b17110b;--hair:#1b171124}[data-theme=light] :is(.stage,.arch,.compass,.pinfo-sky,.marquee,.intro){--glass:#0e0c08bd}.tawaf{width:100%;display:block;overflow:visible}.tawaf-ring{transform-box:view-box;transform-origin:160px 160px;fill:#f6f0e3;animation:linear infinite tawaf}.tawaf-ring:nth-child(odd){fill:#d8ceb8}@keyframes tawaf{to{transform:rotate(-360deg)}}.ornament{opacity:.34}.ornament .tawaf{fill:none;stroke:none}[data-theme=light] .ornament .tawaf-ring{fill:#2a241a}.nav-brand svg{fill:none;width:30px}.nav-brand:hover svg{transform:scale(1.1)}.marquee{--text:#f6f0e3;--muted:#cbbf9f;--gold:#e6bd6a;--gold-2:#f4dca0;box-shadow:inset 0 6px 0 -4px var(--gold), inset 0 -6px 0 -4px var(--gold), inset 0 11px 0 -9px #f4dca080, inset 0 -11px 0 -9px #f4dca080;background:#0d0c0a;border-block:0;padding:22px 0;position:relative}.marquee-item b{text-shadow:0 0 18px #e6bd6a80}.card:after{content:"";background:linear-gradient(90deg, transparent, var(--gold) 30%, var(--gold-2) 50%, var(--gold) 70%, transparent);opacity:.55;pointer-events:none;height:2px;position:absolute;inset:0 0 auto}.arch .figure-qiblah{display:block}.arch .figure-qiblah text{display:none}.hero-pills{flex-wrap:wrap;gap:8px;display:flex}.qibla-pill svg{width:18px;fill:var(--gold);transition:transform 1s var(--ease)}html.is-intro{overflow:hidden}.intro{--text:#f6f0e3;--muted:#b8ad99;--gold:#e6bd6a;--gold-2:#f4dca0;z-index:200;color:var(--text);cursor:pointer;place-items:center;display:grid;position:fixed;inset:0}.intro-door{background:repeating-linear-gradient(45deg,#e6bd6a09 0 2px,#0000 2px 9px),repeating-linear-gradient(-45deg,#e6bd6a09 0 2px,#0000 2px 9px),#0b0a08;width:50.5%;position:absolute;top:0;bottom:0}.intro-door.is-left{border-right:2px solid var(--gold);left:0}.intro-door.is-right{border-left:2px solid var(--gold);right:0}.intro-door:after{content:"";background:linear-gradient(#0000 0 3px,#c9a04ee6 3px 5px,#c9a04e29 5px 29px,#c9a04ee6 29px 31px,#0000 31px);height:34px;position:absolute;top:16%;left:0;right:0}.intro-body{text-align:center;justify-items:center;gap:6px;padding:24px;display:grid;position:relative}.intro-compass{aspect-ratio:1;width:min(72vw,340px);margin-bottom:18px;position:relative}.intro-compass>svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.intro-compass .tawaf{opacity:.75;transform:scale(.82)}.intro-compass .tawaf-ring{animation-duration:14s!important}.intro-compass .tawaf-ring:nth-child(2n){animation-duration:20s!important}.intro-rim{fill:none;stroke:var(--gold);stroke-width:1.5px;transform-origin:50%;transform:rotate(-90deg)}.intro-tick{stroke:#f4dca08c;stroke-width:1.2px}.intro-north{font-family:var(--display);fill:#f07a6b;text-anchor:middle;font-size:15px}.intro-needle{transform-box:view-box;transform-origin:160px 160px;fill:var(--gold-2);stroke:var(--gold-2);stroke-width:2.5px;stroke-linecap:round;filter:drop-shadow(0 0 10px #e6bd6ae6);animation:1.9s cubic-bezier(.34,1.3,.5,1) .7s both needle}@keyframes needle{0%{opacity:0;transform:rotate(0)}18%{opacity:1}to{transform:rotate(var(--bearing));opacity:1}}.intro-kaaba{transform-box:view-box;transform-origin:160px 160px;filter:drop-shadow(0 14px 22px #000c);animation:.9s cubic-bezier(.22,1,.36,1) .1s both kaaba-in}@keyframes kaaba-in{0%{opacity:0;transform:scale(.2)}}.intro-place{letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-size:.82rem;font-weight:500}.intro-bearing{font-family:var(--display);color:var(--muted);font-size:1.5rem}.intro-bearing b{background:linear-gradient(135deg, var(--gold-2), var(--gold));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(3rem,12vw,4.6rem);font-weight:400;line-height:1}.intro-skip{color:var(--muted);margin-top:18px;font-size:.78rem}@media (width<=860px){.hero-pills{justify-content:center}.ornament{opacity:.26}}.backdrop{z-index:-2;opacity:.2;filter:saturate(.85);pointer-events:none;background:url(/images/kaaba-night-1920.webp) 50% 40%/cover no-repeat;animation:60s ease-in-out infinite alternate backdrop-drift;position:fixed;inset:-4%}.backdrop:after{content:"";background:radial-gradient(ellipse at 50% 40%, transparent 0, var(--bg) 78%);position:absolute;inset:0}@keyframes backdrop-drift{0%{transform:scale(1)translate(0,0)}to{transform:scale(1.08)translate(-1.5%,-1%)}}[data-theme=light] .backdrop{opacity:.1;filter:saturate(.5)brightness(1.3)}.hero,[data-theme=light] .hero,[data-theme=light] .nav:not(.is-scrolled){--text:#f6f0e3;--muted:#d3c8b2;--gold:#e6bd6a;--gold-2:#f4dca0;--teal:#4fd0a4;--line:#e6bd6a4d;--hair:#ffffff24;--tint:#ffffff12;--glass:#0e0c0899;color:var(--text)}.hero{background:#0b0a08;align-items:center}.hero-photo{position:absolute;inset:-6% 0 -10%;overflow:hidden}.hero-photo picture{height:100%;display:block}.hero-photo img{object-fit:cover;object-position:50% 46%;transform-origin:62%;width:136%;max-width:none;height:100%;animation:38s ease-in-out infinite alternate ken-burns;display:block}@keyframes ken-burns{0%{transform:scale(1)translate(0,0)}to{transform:scale(1.12)translate(-2%,-1.5%)}}.hero-shade{background:linear-gradient(180deg, #0b0a08b8 0, transparent 22%, transparent 62%, var(--page-bg,#0b0a08) 100%), linear-gradient(90deg, #0b0a08f0 0%, #0b0a08d1 30%, #0b0a084d 56%, #0b0a0814 74%, #0b0a0866 100%);position:absolute;inset:0}[data-theme=light] .hero-shade{--page-bg:#f8f5ef}.hero-light{mix-blend-mode:screen;pointer-events:none;background:linear-gradient(105deg,#0000 30%,#ffe2a029 48%,#0000 62%) 0 0/260% 100%;animation:14s ease-in-out infinite light-sweep;position:absolute;inset:0}@keyframes light-sweep{0%{background-position:130% 0}60%,to{background-position:-60% 0}}.hero-stars i{background:var(--gold-2);animation:16s linear infinite mote}.hero-stars i:nth-child(odd){animation-duration:23s}@keyframes mote{to{transform:translate(18px,-140px)}}.hero-grid{grid-template-columns:minmax(0,640px);justify-content:start}.hero h1{text-shadow:0 4px 40px #0009}.hero-lead{color:var(--text);opacity:.86}.hero .next-pill,.hero .btn-ghost,.hero-jump button,.hero-chip{-webkit-backdrop-filter:blur(10px);background:#0b0a0880}.showcase{max-width:1180px;padding:24px var(--gutter) 0;grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,64px);margin:0 auto;display:grid}.showcase .stats{grid-template-columns:repeat(2,1fr);max-width:none;margin:0;padding:0}.showcase .arch{width:100%}.intro-door{background:#0b0a08;overflow:hidden}.intro-door:before{content:"";background:radial-gradient(at 50% 42%,#0b0a08b8 0,#0b0a08e6 60%,#0b0a08 100%),url(/images/kaaba-night-1920.webp) 50% 40%/cover no-repeat;width:100vw;animation:9s ease-out both backdrop-drift;position:absolute;top:0;bottom:0}.intro-door.is-left:before{left:0}.intro-door.is-right:before{right:0}.footer-credits{color:var(--muted);margin-top:20px;font-size:.82rem}.footer-credits a{color:var(--gold)}.footer-bottom{margin-top:12px}@media (width<=860px){.hero{align-items:end;min-height:100svh;padding-top:300px}.hero-photo img{object-position:48% 30%;transform-origin:50% 40%;width:100%}.hero-shade{background:linear-gradient(180deg, #0b0a0899 0, #0b0a080d 16%, #0b0a0840 30%, #0b0a08e6 52%, var(--page-bg,#0b0a08) 100%)}.hero-grid{grid-template-columns:1fr}.showcase{grid-template-columns:1fr;padding-top:8px}.showcase .arch{width:min(100%,300px)}.backdrop{background-image:url(/images/kaaba-night-960.webp)}.intro-door:before{background:radial-gradient(at 50% 42%,#0b0a08b8 0,#0b0a08e6 60%,#0b0a08 100%),url(/images/kaaba-night-960.webp) 50% 40%/cover no-repeat}}.backdrop{opacity:.34}.backdrop:after{background:radial-gradient(ellipse at 50% 40%, transparent 0, color-mix(in srgb, var(--bg) 60%, transparent) 62%, var(--bg) 100%)}[data-theme=light] .backdrop{opacity:.16}.hero-shade{background:linear-gradient(180deg, #0b0a08b8 0, transparent 22%, transparent 86%, var(--page-bg,#0b0a08) 100%), linear-gradient(90deg, #0b0a08f0 0%, #0b0a08d1 30%, #0b0a084d 56%, #0b0a0814 74%, #0b0a0866 100%)}@media (width<=860px){.hero{padding-top:46svh}.hero-photo{height:62svh;inset:0 0 auto}.hero-photo img{object-position:48% 55%}.hero-shade{background:linear-gradient(180deg, #0b0a08a8 0, #0b0a080d 12svh, #0b0a0833 34svh, #0b0a08 60svh, #0b0a08 calc(100% - 60px), var(--page-bg,#0b0a08) 100%)}.hero-light{height:62svh;bottom:auto}}html{background:var(--bg)}body{background-color:#0000}.nav-brand svg{width:32px;box-shadow:0 0 0 1px var(--gold);background:#f6f0e3;border-radius:9px;padding:3px}.hero{will-change:clip-path}.section-head{max-width:none;position:relative}.section-head>*{max-width:760px;position:relative}.section-head:before{content:attr(data-index);inset-inline-end:0;font-family:var(--display);color:#0000;-webkit-text-stroke:1px var(--line);opacity:.7;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:clamp(6rem,17vw,13rem);line-height:1;position:absolute;bottom:-.16em}.tcard.is-now:after,.nextp:after{border-radius:inherit;background:conic-gradient(from var(--angle), transparent 0 60%, var(--gold-2) 80%, transparent 96%);-webkit-mask-composite:xor;opacity:1;height:auto;padding:2px;animation:5s linear infinite spin;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.nextp-clock b{display:block;overflow:hidden}.nextp-clock b i{font-style:normal;display:block}.dayarc{background:linear-gradient(180deg, #4a7ebe4d 0, #e6a05a29 66%, #0b0a0880 70%, var(--surface-2) 100%);height:220px;margin-top:16px;padding:0;transition:background 1s;overflow:hidden}.dayarc.is-night{background:linear-gradient(180deg, #0a0f2cbf 0, #1b244080 66%, #0b0a0880 70%, var(--surface-2) 100%)}.dayarc:after{display:none}.dayarc svg{fill:none;width:100%;height:100%;position:absolute;inset:0}.dayarc svg path{vector-effect:non-scaling-stroke}.dayarc-horizon{stroke:var(--line);stroke-width:1px}.dayarc-track{stroke:var(--muted);stroke-width:1.5px;stroke-dasharray:3 6;opacity:.6}.dayarc-done{stroke:var(--gold-2);stroke-width:2.5px;stroke-linecap:round;filter:drop-shadow(0 0 6px #e6bd6ae6)}.dayarc-mark{width:0;height:0;position:absolute}.dayarc-mark i{background:var(--bg);border:2px solid var(--muted);border-radius:50%;width:10px;height:10px;position:absolute;top:-5px;left:-5px}.dayarc-mark.is-past i{background:var(--gold-bg);border-color:var(--gold-bg)}.dayarc-mark b{white-space:nowrap;color:var(--text);text-shadow:0 1px 6px var(--bg);font-size:.74rem;font-weight:500;position:absolute;bottom:12px;left:0;transform:translate(-50%)}.dayarc-mark.is-below b{top:10px;bottom:auto}.dayarc-sun{background:radial-gradient(circle,#fff7df 0 35%,#f4dca0 70%);border-radius:50%;width:26px;height:26px;margin:-13px 0 0 -13px;animation:3s ease-in-out infinite sun-pulse;position:absolute;box-shadow:0 0 0 6px #f4dca038,0 0 40px 10px #f4dca08c}.dayarc.is-night .dayarc-sun{filter:drop-shadow(0 0 10px #f4e6bdcc);background:0 0;animation:none;box-shadow:inset -7px 3px #f4e6bd}@keyframes sun-pulse{50%{box-shadow:0 0 0 10px #f4dca01f,0 0 54px 16px #f4dca099}}::view-transition-old(root){mix-blend-mode:normal;animation:none}::view-transition-new(root){mix-blend-mode:normal;animation:none}::view-transition-new(root){animation:.75s cubic-bezier(.22,1,.36,1) theme-reveal}@keyframes theme-reveal{0%{clip-path:circle(0 at var(--vt-x,90%) var(--vt-y,5%))}to{clip-path:circle(150vmax at var(--vt-x,90%) var(--vt-y,5%))}}.btn:active:not(:disabled){transform:translateY(0)scale(.97)}.tabbar{display:none}@media (width<=860px){.tabbar{left:10px;right:10px;bottom:max(10px, env(safe-area-inset-bottom));z-index:45;background:var(--glass-solid);border:1px solid var(--hair);-webkit-backdrop-filter:blur(20px)saturate(1.4);border-radius:26px;grid-template-columns:repeat(5,1fr);padding:6px;display:grid;position:fixed;box-shadow:0 20px 44px -14px #000000bf}html.is-intro .tabbar{display:none}.tabbar a{color:var(--muted);border-radius:20px;justify-items:center;gap:2px;padding:8px 2px 6px;font-size:.68rem;font-weight:500;text-decoration:none;transition:color .25s;display:grid;position:relative}.tabbar a>:not(.tabbar-pill){position:relative}.tabbar svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:22px;transition:transform .3s var(--ease)}.tabbar a.is-active{color:var(--ink)}.tabbar a.is-active svg{transform:translateY(-1px)scale(1.08)}.tabbar-pill{background:linear-gradient(135deg, var(--gold-bg-2), var(--gold-bg));border-radius:20px;position:absolute;inset:0;box-shadow:0 8px 22px -8px #e6bd6acc}.totop{display:none}.toast{bottom:calc(max(10px, env(safe-area-inset-bottom)) + 76px)}.footer{padding-bottom:120px}.dayarc{height:180px}.dayarc-mark b{font-size:.66rem}.section-head:before{opacity:.5}}@media print{.tabbar,.backdrop{display:none!important}}