/* Sunni Islam — app styles. One file, no framework. */
:root{
  --si-primary:#0E6B57;--si-accent:#B48A3C;--si-bg:#F7F6F1;--si-ink:#16232A;
  --si-surface:#FFFFFF;
  --si-surface-2:color-mix(in srgb,var(--si-primary) 4%,var(--si-surface));
  --si-tint:color-mix(in srgb,var(--si-primary) 9%,var(--si-surface));
  --si-tint-2:color-mix(in srgb,var(--si-accent) 12%,var(--si-surface));
  --si-primary-d:color-mix(in srgb,var(--si-primary) 78%,#000);
  --si-primary-l:color-mix(in srgb,var(--si-primary) 70%,#fff);
  --si-muted:color-mix(in srgb,var(--si-ink) 62%,var(--si-bg));
  --si-line:color-mix(in srgb,var(--si-ink) 11%,var(--si-bg));
  --si-line-2:color-mix(in srgb,var(--si-ink) 6%,var(--si-bg));
  --si-ok:#1E7B4F;--si-good:#3F7F2E;--si-warn:#A86A12;--si-bad:#B3412E;
  --si-r:16px;--si-r-sm:10px;
  --si-shadow:0 1px 2px rgba(16,32,40,.05),0 6px 20px -8px rgba(16,32,40,.12);
  --si-shadow-lg:0 2px 4px rgba(16,32,40,.05),0 18px 40px -16px rgba(16,32,40,.22);
  --si-font:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",Arial,sans-serif;
  --si-ar:"Amiri","Noto Naskh Arabic","Geeza Pro","Traditional Arabic",serif;
  --si-quran:"Amiri Quran","Amiri","Noto Naskh Arabic",serif;
  --si-qsize:1.9rem;
  --si-head:68px;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --si-bg:#0D1417;--si-ink:#E6ECEA;--si-surface:#131D21;
  --si-shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -10px rgba(0,0,0,.6);
  --si-shadow-lg:0 2px 4px rgba(0,0,0,.4),0 20px 44px -16px rgba(0,0,0,.7);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--si-head) + 16px)}
body.si{margin:0;background:var(--si-bg);color:var(--si-ink);font:400 16px/1.65 var(--si-font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
.si img{max-width:100%;height:auto}
.si a{color:var(--si-primary);text-decoration:none}
.si a:hover{text-decoration:underline;text-underline-offset:3px}
.si h1,.si h2,.si h3,.si h4{line-height:1.25;margin:0 0 .5em;letter-spacing:-.015em;font-weight:700}
.si p{margin:0 0 1em}
.si button,.si input,.si select,.si textarea{font:inherit;color:inherit}
.si :focus-visible{outline:2px solid var(--si-accent);outline-offset:2px;border-radius:6px}
.si-ic{flex:none;display:inline-block;vertical-align:middle}
.si [hidden]{display:none!important}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.si-skip{position:absolute;inset-inline-start:8px;top:-60px;z-index:100;background:var(--si-ink);color:var(--si-bg)!important;padding:8px 14px;border-radius:8px}
.si-skip:focus{top:8px}
.si-wrap{width:100%;max-width:1280px;margin:0 auto;padding:0 24px}
.si-ar{font-family:var(--si-ar);font-weight:400;letter-spacing:0;line-height:1.9}
.si-quran{font-family:var(--si-quran)}
.si-muted{color:var(--si-muted)}
.si-small{font-size:.86rem}
.si-lead{font-size:1.08rem;color:var(--si-muted);margin:0}
.si-eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--si-accent);margin:0 0 .6em}
.si-dot{width:4px;height:4px;border-radius:50%;background:var(--si-line);display:inline-block}
.si-translit{font-style:italic;color:var(--si-muted);margin:.2em 0 .4em}

/* ---------- Header ---------- */
.si-header{position:relative;z-index:50;background:color-mix(in srgb,var(--si-surface) 88%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--si-line)}
.si-sticky .si-header{position:sticky;top:0}
.si-header__inner{display:flex;align-items:center;gap:20px;min-height:var(--si-head)}
.si-brand{display:flex;align-items:center;gap:11px;color:var(--si-ink)!important;text-decoration:none!important;flex:none}
.si-brand__mark svg{width:38px;height:38px;display:block}
.si-brand__star{fill:var(--si-primary)}
.si-brand__moon{fill:var(--si-accent)}
.si-brand__text{display:flex;flex-direction:column;line-height:1.15}
.si-brand__name{font-weight:800;font-size:1.14rem;letter-spacing:-.02em}
.si-brand__tag{font-size:.74rem;color:var(--si-muted)}
.si-nav{flex:1 1 auto;display:flex;justify-content:center}
.si-nav__list{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.si-nav__item{position:relative}
.si-nav__link{display:inline-flex;align-items:center;gap:4px;padding:9px 13px;border-radius:999px;border:0;background:none;color:var(--si-ink)!important;font-weight:600;font-size:.93rem;cursor:pointer;text-decoration:none!important;white-space:nowrap;transition:background .15s}
.si-nav__link:hover,.si-nav__item.is-open>.si-nav__link{background:var(--si-tint)}
.si-nav__item.is-active>.si-nav__link{color:var(--si-primary)!important;background:var(--si-tint)}
.si-nav__chev{transition:transform .2s}
.si-nav__item.is-open .si-nav__chev{transform:rotate(180deg)}
.si-panel{position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%,6px);min-width:520px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:var(--si-r);box-shadow:var(--si-shadow-lg);padding:10px;opacity:0;visibility:hidden;transition:.18s}
.si-nav__item.is-open .si-panel{opacity:1;visibility:visible;transform:translate(-50%,0)}
.si-panel__grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.si-panel__link{display:flex;gap:12px;align-items:flex-start;padding:11px 12px;border-radius:12px;color:var(--si-ink)!important;text-decoration:none!important}
.si-panel__link:hover,.si-panel__link.is-active{background:var(--si-tint)}
.si-panel__link strong{display:block;font-size:.93rem}
.si-panel__link small{display:block;color:var(--si-muted);font-size:.8rem;line-height:1.4}
.si-panel__ic{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary)}
.si-header__actions{display:flex;align-items:center;gap:6px;flex:none}
.si-iconbtn{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:40px;height:40px;padding:0 8px;border-radius:12px;border:1px solid transparent;background:none;color:var(--si-ink);cursor:pointer;transition:.15s}
.si-iconbtn:hover{background:var(--si-tint);color:var(--si-primary)}
.si-only-dark{display:none}
[data-theme="dark"] .si-only-dark{display:inline-block}
[data-theme="dark"] .si-only-light{display:none}
.si-lang{position:relative}
.si-lang__code{font-size:.75rem;font-weight:700}
.si-lang__menu{position:absolute;right:0;top:calc(100% + 8px);min-width:180px;list-style:none;margin:0;padding:6px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:14px;box-shadow:var(--si-shadow-lg);display:none}
.si-lang.is-open .si-lang__menu{display:block}
.si-lang__menu a{display:block;padding:8px 12px;border-radius:9px;color:var(--si-ink)!important}
.si-lang__menu a:hover,.si-lang__menu a[aria-current]{background:var(--si-tint);text-decoration:none}
.si-menubtn{display:none}
.si-menubtn__close{display:none}

/* ---------- Buttons, chips ---------- */
.si-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:999px;border:1px solid transparent;font-weight:700;font-size:.95rem;cursor:pointer;text-decoration:none!important;white-space:nowrap;transition:transform .15s,background .15s,box-shadow .15s}
.si-btn--primary{background:var(--si-primary);color:#fff!important;box-shadow:0 6px 18px -8px var(--si-primary)}
.si-btn--primary:hover{background:var(--si-primary-d);transform:translateY(-1px)}
.si-btn--ghost{background:var(--si-surface);border-color:var(--si-line);color:var(--si-ink)!important}
.si-btn--ghost:hover{border-color:var(--si-primary);color:var(--si-primary)!important}
.si-btn--sm{padding:8px 14px;font-size:.85rem}
.si-btn--block{width:100%}
.si-btnrow{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.si-btnrow--center{justify-content:center}
.si-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;background:var(--si-surface);border:1px solid var(--si-line);font-size:.86rem;font-weight:600;color:var(--si-ink)!important}
.si-chip .si-ic{color:var(--si-accent)}
.si-chips{display:flex;flex-wrap:wrap;gap:6px}
.si-pill{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:.74rem;font-weight:700;background:var(--si-tint);color:var(--si-primary);white-space:nowrap}
.si-pill--ok{background:color-mix(in srgb,var(--si-ok) 14%,var(--si-surface));color:var(--si-ok)}
.si-pill--good{background:color-mix(in srgb,var(--si-good) 14%,var(--si-surface));color:var(--si-good)}
.si-pill--mix{background:var(--si-tint-2);color:var(--si-warn)}
.si-pill--weak{background:color-mix(in srgb,var(--si-bad) 12%,var(--si-surface));color:var(--si-bad)}
.si-link-sm{font-size:.84rem;font-weight:600;white-space:nowrap}

/* ---------- Hero (home) ---------- */
.si-hero{position:relative;overflow:hidden;padding:56px 0 64px;background:linear-gradient(180deg,var(--si-tint) 0%,var(--si-bg) 100%);border-bottom:1px solid var(--si-line-2)}
.si-hero__pattern,.si-guidehead__pattern{position:absolute;inset:0;opacity:.5;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%230E6B57' stroke-opacity='.09' stroke-width='1'%3E%3Cpath d='M48 8l11.3 16.7L79 20l-4.7 19.7L91 48l-16.7 11.3L79 79l-19.7-4.7L48 91 36.7 74.3 17 79l4.7-19.7L5 48l16.7-11.3L17 17l19.7 4.7z'/%3E%3Cpath d='M48 26l15.6 6.4L70 48l-6.4 15.6L48 70l-15.6-6.4L26 48l6.4-15.6z'/%3E%3C/g%3E%3C/svg%3E");-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 55%);mask-image:linear-gradient(90deg,transparent 0,#000 55%)}
.si-hero__grid{position:relative;display:flex;gap:48px;align-items:center}
.si-hero__copy{flex:1 1 560px;min-width:0}
.si-hero__title{font-size:clamp(2.1rem,4.4vw,3.4rem);font-weight:800;letter-spacing:-.035em;line-height:1.08;margin-bottom:.4em}
.si-hero__title em{font-style:normal;color:var(--si-primary)}
.si-hero__text{font-size:1.12rem;color:var(--si-muted)}
.si-datechips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}

/* next prayer card + arc */
.si-nextcard{flex:0 1 430px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:24px;padding:20px 22px 18px;box-shadow:var(--si-shadow-lg)}
.si-nextcard__top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.si-locbtn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;border:1px solid var(--si-line);background:var(--si-surface-2);font-weight:600;font-size:.86rem;cursor:pointer;max-width:100%;color:var(--si-ink)}
.si-locbtn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.si-locbtn .si-ic:first-child{color:var(--si-primary)}
.si-locbtn--lg{padding:10px 16px;font-size:.95rem;background:var(--si-surface)}
.si-arc{position:relative;width:100%;aspect-ratio:2.25/1;margin:10px 0 2px}
.si-arc svg{width:100%;height:100%;display:block;overflow:visible}
.si-arc__track{fill:none;stroke:var(--si-line);stroke-width:2;stroke-dasharray:3 5}
.si-arc__done{fill:none;stroke:url(#si-arcgrad);stroke-width:3;stroke-linecap:round}
.si-arc__hz{stroke:var(--si-line);stroke-width:1}
.si-arc__pt{fill:var(--si-surface);stroke:var(--si-primary);stroke-width:2}
.si-arc__pt.is-next{fill:var(--si-accent);stroke:var(--si-accent)}
.si-arc__lbl{font:600 10px var(--si-font);fill:var(--si-muted);text-anchor:middle;paint-order:stroke;stroke:var(--si-surface);stroke-width:4px;stroke-linejoin:round}
.si-arc__sun{fill:var(--si-accent);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--si-accent) 60%,transparent))}
.si-arc__moon{fill:var(--si-primary-l)}
.si-nextcard__now{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;border-top:1px solid var(--si-line-2);padding-top:12px}
.si-nextcard__label{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--si-muted);font-weight:700;width:100%}
.si-nextcard__name{font-size:1.7rem;font-weight:800;letter-spacing:-.02em}
.si-nextcard__time{font-size:1.1rem;font-weight:600;color:var(--si-muted)}
.si-nextcard__count{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:700;color:var(--si-primary);background:var(--si-tint);padding:4px 10px;border-radius:999px;font-size:.9rem}
.si-mini-times{display:flex;list-style:none;margin:12px 0 0;padding:0;gap:4px}
.si-mini-times li{flex:1 1 0;text-align:center;padding:8px 2px;border-radius:12px;background:var(--si-surface-2)}
.si-mini-times li.is-next{background:var(--si-primary);color:#fff}
.si-mini-times b{display:block;font-size:.72rem;font-weight:600;opacity:.8}
.si-mini-times span{font-size:.88rem;font-weight:700;font-variant-numeric:tabular-nums}

/* ---------- Sections (home) ---------- */
.si-section{margin-top:56px}
.si-sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.si-sechead h2{font-size:clamp(1.45rem,2.4vw,1.9rem);margin:0}
.si-sechead p{color:var(--si-muted);margin:0;flex:1 1 360px}
.si-pillars{display:flex;flex-wrap:wrap;gap:14px}
.si-pillar{flex:1 1 200px;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:26px 16px 20px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:140px 140px var(--si-r) var(--si-r);color:var(--si-ink)!important;text-decoration:none!important;transition:transform .2s,box-shadow .2s,border-color .2s}
a.si-pillar:hover{transform:translateY(-4px);box-shadow:var(--si-shadow-lg);border-color:color-mix(in srgb,var(--si-primary) 40%,var(--si-line))}
.si-pillar__arch{width:72px;height:84px;border-radius:40px 40px 10px 10px;display:grid;place-items:center;background:linear-gradient(160deg,var(--si-primary),var(--si-primary-d));color:#fff;margin-bottom:12px;box-shadow:inset 0 0 0 4px color-mix(in srgb,#fff 14%,transparent)}
.si-pillar__n{position:absolute;top:14px;right:22px;font-size:.75rem;font-weight:800;color:var(--si-accent)}
.si-pillar__ar{font-size:1.5rem;color:var(--si-primary);line-height:1.5}
.si-pillar__name{font-size:1.08rem}
.si-pillar__text{font-size:.86rem;color:var(--si-muted)}
.si-tools{display:flex;flex-wrap:wrap;gap:12px}
.si-tool{flex:1 1 280px;display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:var(--si-r);color:var(--si-ink)!important;text-decoration:none!important;transition:.18s}
.si-tool:hover{border-color:var(--si-primary);box-shadow:var(--si-shadow);transform:translateY(-2px)}
.si-tool__ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary);transition:.18s}
.si-tool:hover .si-tool__ic{background:var(--si-primary);color:#fff}
.si-tool__body{flex:1;min-width:0}
.si-tool__body strong{display:block}
.si-tool__body small{display:block;color:var(--si-muted);font-size:.84rem;line-height:1.45}
.si-tool__go{color:var(--si-muted);transition:transform .18s}
.si-tool:hover .si-tool__go{transform:translateX(3px);color:var(--si-primary)}
.si-daily{display:flex;flex-wrap:wrap;gap:16px}
.si-daily__card{flex:1 1 420px;margin:0;padding:26px 28px;border-radius:22px;border:1px solid var(--si-line);background:var(--si-surface);position:relative;overflow:hidden}
.si-daily__card--verse{background:linear-gradient(140deg,var(--si-primary),var(--si-primary-d));color:#fff;border:0}
.si-daily__card--verse figcaption,.si-daily__card--verse .si-daily__kicker{color:color-mix(in srgb,#fff 78%,transparent)}
.si-daily__kicker{display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--si-accent)}
.si-daily__ar{font-size:1.9rem;margin:14px 0 8px;text-align:right;line-height:2}
.si-daily blockquote{margin:0 0 10px;font-size:1.06rem}
.si-daily__big{font-size:1.2rem!important;font-weight:500;margin-top:14px!important}
.si-daily figcaption{font-size:.86rem;font-weight:600;color:var(--si-muted)}
.si-guidelist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--si-line);border-radius:var(--si-r);background:var(--si-surface);overflow:hidden}
.si-guidelist li{flex:1 1 380px;border-bottom:1px solid var(--si-line-2)}
.si-guidelist a{display:flex;align-items:center;gap:16px;padding:16px 20px;color:var(--si-ink)!important;text-decoration:none!important;height:100%}
.si-guidelist a:hover{background:var(--si-surface-2)}
.si-guidelist__n{font-weight:800;color:var(--si-accent);font-variant-numeric:tabular-nums}
.si-guidelist__t{flex:1}
.si-guidelist__t small{display:block;color:var(--si-muted);font-size:.84rem}
.si-sources{display:flex;flex-wrap:wrap;gap:14px}
.si-source{flex:1 1 260px;display:flex;gap:14px;padding:18px;border-radius:var(--si-r);background:var(--si-surface-2);border:1px solid var(--si-line-2)}
.si-source .si-ic{color:var(--si-primary);margin-top:2px}
.si-source h3{font-size:1rem;margin-bottom:.25em}
.si-source p{margin:0;font-size:.9rem;color:var(--si-muted)}

/* ---------- Page heads ---------- */
.si-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:.84rem;color:var(--si-muted);margin-bottom:14px}
.si-crumbs a{color:var(--si-muted)}
.si-crumbs__sep{opacity:.5}
.si-pagehead{padding:30px 0 26px;background:linear-gradient(180deg,var(--si-tint) 0%,var(--si-bg) 100%);border-bottom:1px solid var(--si-line-2);margin-bottom:26px}
.si-pagehead__row{display:flex;align-items:center;gap:18px}
.si-pagehead__icon{flex:none;width:62px;height:70px;border-radius:32px 32px 12px 12px;display:grid;place-items:center;background:linear-gradient(160deg,var(--si-primary),var(--si-primary-d));color:#fff}
.si-pagehead__num{font-weight:800;font-size:1.3rem}
.si-pagehead__text{flex:1;min-width:0}
.si-pagehead h1{font-size:clamp(1.6rem,3vw,2.3rem);margin-bottom:.2em;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
.si-pagehead__ar{font-size:.8em;color:var(--si-accent);font-weight:400}
.si-guidehead{position:relative;overflow:hidden;padding:34px 0 30px;background:linear-gradient(180deg,var(--si-tint) 0%,var(--si-bg) 100%);border-bottom:1px solid var(--si-line-2)}
.si-guidehead .si-wrap{position:relative}
.si-guidehead__row{display:flex;gap:32px;align-items:center}
.si-guidehead__text{flex:1;min-width:0}
.si-guidehead h1{font-size:clamp(1.9rem,3.6vw,2.8rem);letter-spacing:-.03em;font-weight:800}
.si-guidehead__seal{flex:none;position:relative;width:170px;height:170px;color:var(--si-accent);display:grid;place-items:center}
.si-guidehead__seal svg{position:absolute;inset:0;animation:si-spin 80s linear infinite}
.si-guidehead__seal .si-ar{font-size:2.3rem;color:var(--si-primary);position:relative}
@keyframes si-spin{to{transform:rotate(360deg)}}
.si-stats{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.si-stat{flex:1 1 150px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:14px;padding:12px 16px;display:flex;flex-direction:column-reverse}
.si-stat dt{font-size:.8rem;color:var(--si-muted)}
.si-stat dd{margin:0;font-size:1.45rem;font-weight:800;color:var(--si-primary);letter-spacing:-.02em}

/* ---------- Guide layout & blocks ---------- */
.si-guide{display:flex;gap:40px;padding-top:30px;align-items:flex-start}
.si-toc{flex:0 0 250px;position:sticky;top:calc(var(--si-head) + 18px)}
body:not(.si-sticky) .si-toc{top:18px}
.si-toc__inner{border-left:2px solid var(--si-line);padding-left:16px}
.si-toc__title{font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--si-muted)}
.si-toc ol{list-style:none;margin:0;padding:0}
.si-toc a{display:block;padding:6px 0;font-size:.9rem;color:var(--si-muted);position:relative;line-height:1.4}
.si-toc a.is-on{color:var(--si-primary);font-weight:700}
.si-toc a.is-on::before{content:"";position:absolute;left:-18px;top:6px;bottom:6px;width:2px;background:var(--si-primary)}
.si-guide__body{flex:1;min-width:0}
.si-gsec{padding-bottom:30px;margin-bottom:30px;border-bottom:1px solid var(--si-line-2)}
.si-gsec__h{display:flex;align-items:center;gap:12px;font-size:clamp(1.3rem,2.2vw,1.65rem)}
.si-gsec__ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary)}
.si-gsec__intro{color:var(--si-muted);font-size:1.04rem}
.si-bh{font-size:1.08rem;margin:1.4em 0 .7em}
.si-prose p:last-child{margin-bottom:0}
.si-prose{margin-bottom:1em}
.si-list{list-style:none;margin:0 0 1em;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px}
.si-list li{flex:1 1 340px;display:flex;gap:10px;align-items:flex-start}
.si-list__ic{color:var(--si-ok);margin-top:4px}
.si-list--bullet li::before{content:"";flex:none;width:7px;height:7px;margin-top:10px;border-radius:2px;transform:rotate(45deg);background:var(--si-accent)}
.si-list--number{counter-reset:n}
.si-list--number li::before{counter-increment:n;content:counter(n);flex:none;width:24px;height:24px;border-radius:50%;background:var(--si-tint);color:var(--si-primary);font-weight:800;font-size:.8rem;display:grid;place-items:center;margin-top:1px}
.si-steps{list-style:none;margin:0 0 1em;padding:0;position:relative}
.si-step{display:flex;gap:16px;position:relative;padding-bottom:18px}
.si-step:not(:last-child)::before{content:"";position:absolute;left:17px;top:38px;bottom:0;width:2px;background:linear-gradient(var(--si-line),var(--si-line-2))}
.si-step__n{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--si-primary);color:#fff;font-weight:800;font-size:.9rem;box-shadow:0 0 0 5px var(--si-tint)}
.si-step__body{flex:1;min-width:0;background:var(--si-surface);border:1px solid var(--si-line);border-radius:var(--si-r);padding:14px 18px}
.si-step__body h4{font-size:1rem;margin-bottom:.3em}
.si-step__body p{margin:0}
.si-step__ar{font-size:1.45rem;text-align:right;color:var(--si-primary);margin:.2em 0!important}
.si-tablewrap{overflow-x:auto;border:1px solid var(--si-line);border-radius:var(--si-r);background:var(--si-surface);margin-bottom:1em}
.si-table{width:100%;border-collapse:collapse;font-size:.93rem}
.si-table th,.si-table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--si-line-2);vertical-align:top}
.si-table thead th{background:var(--si-surface-2);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--si-muted);white-space:nowrap}
.si-table tbody th{font-weight:700}
.si-table tbody tr:last-child>*{border-bottom:0}
.si-table tbody tr:hover{background:var(--si-surface-2)}
.si-tablenote{font-size:.85rem;color:var(--si-muted)}
.si-callout{display:flex;gap:12px;padding:14px 18px;border-radius:var(--si-r);margin:0 0 1em;background:var(--si-tint);border:1px solid color-mix(in srgb,var(--si-primary) 18%,transparent)}
.si-callout .si-ic{color:var(--si-primary);margin-top:2px}
.si-callout p{margin:0}
.si-callout strong{display:block;margin-bottom:2px}
.si-callout--warn{background:color-mix(in srgb,var(--si-warn) 10%,var(--si-surface));border-color:color-mix(in srgb,var(--si-warn) 30%,transparent)}
.si-callout--warn .si-ic{color:var(--si-warn)}
.si-callout--note,.si-callout--tip{background:var(--si-tint-2);border-color:color-mix(in srgb,var(--si-accent) 30%,transparent)}
.si-callout--note .si-ic,.si-callout--tip .si-ic{color:var(--si-accent)}
.si-madhhab{border:1px solid var(--si-line);border-radius:var(--si-r);overflow:hidden;margin:0 0 1em;background:var(--si-surface)}
.si-madhhab__head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 16px;background:var(--si-surface-2);border-bottom:1px solid var(--si-line-2);font-size:.86rem;color:var(--si-muted)}
.si-madhhab__head strong{color:var(--si-ink);margin-left:4px}
.si-madhhab__grid{display:flex;flex-wrap:wrap}
.si-madhhab__cell{flex:1 1 220px;padding:14px 16px;border-right:1px solid var(--si-line-2);border-top:1px solid var(--si-line-2);margin-top:-1px}
.si-madhhab__name{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:999px;margin-bottom:6px}
.si-madhhab__cell--hanafi .si-madhhab__name{background:#E6F2EC;color:#0E6B57}
.si-madhhab__cell--shafii .si-madhhab__name{background:#E8EEF8;color:#2A5397}
.si-madhhab__cell--maliki .si-madhhab__name{background:#F6EEDF;color:#8A5F1C}
.si-madhhab__cell--hanbali .si-madhhab__name{background:#F3E8EE;color:#8A3462}
[data-theme="dark"] .si-madhhab__name{background:var(--si-tint)!important;color:var(--si-ink)!important}
.si-madhhab__cell p{margin:0;font-size:.93rem}
.si-cards{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:1em}
.si-card{flex:1 1 230px;padding:18px;border-radius:var(--si-r);background:var(--si-surface);border:1px solid var(--si-line);transition:.18s}
.si-card:hover{border-color:color-mix(in srgb,var(--si-primary) 35%,var(--si-line));box-shadow:var(--si-shadow)}
.si-card__ic{color:var(--si-primary);margin-bottom:8px}
.si-card h4{font-size:1rem;margin-bottom:.25em}
.si-card__ar{font-size:1.3rem;color:var(--si-accent);margin:0 0 .2em!important}
.si-card p{margin:0;font-size:.92rem;color:var(--si-muted)}
.si-verse{margin:0 0 1.2em;padding:22px 26px;border-radius:20px;background:var(--si-surface);border:1px solid var(--si-line);border-left:4px solid var(--si-accent)}
.si-verse__ar{font-family:var(--si-quran);font-size:1.75rem;text-align:right;margin:0 0 6px!important;color:var(--si-primary)}
.si-verse blockquote{margin:0 0 6px;font-size:1.04rem}
.si-verse figcaption{font-size:.84rem;color:var(--si-muted);font-weight:600}
.si-chart{margin:0 0 1em;padding:18px;border-radius:var(--si-r);background:var(--si-surface);border:1px solid var(--si-line)}
.si-chart__title{font-weight:700;margin-bottom:12px}
.si-chart__row{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.si-chart__label{flex:0 0 90px;font-weight:600;font-size:.9rem}
.si-chart__bar{flex:1;display:flex;height:26px;border-radius:8px;background:var(--si-surface-2);overflow:hidden}
.si-chart__seg{display:grid;place-items:center;color:#fff;font-size:.76rem;font-weight:800;transition:width .8s cubic-bezier(.2,.8,.2,1)}
.si-chart__sum{flex:0 0 32px;text-align:right;font-weight:800;font-variant-numeric:tabular-nums}
.si-chart__legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:10px;font-size:.84rem;color:var(--si-muted)}
.si-chart__legend i,.si-split__legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.si-tone-1{background:var(--si-primary)}
.si-tone-2{background:var(--si-accent)}
.si-tone-3{background:#5E8FA8}
.si-tone-4{background:#9C7BB0}
.si-timeline{list-style:none;margin:0 0 1em;padding:0}
.si-timeline li{display:flex;gap:18px;padding:14px 0;border-bottom:1px dashed var(--si-line)}
.si-timeline__label{flex:0 0 140px;font-weight:800;color:var(--si-accent);font-size:.9rem}
.si-timeline h4{margin-bottom:.2em;font-size:1rem}
.si-timeline p{margin:0;color:var(--si-muted)}
.si-cta{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--si-r);background:var(--si-tint);color:var(--si-ink)!important;text-decoration:none!important;margin-bottom:1em;border:1px solid transparent}
.si-cta:hover{border-color:var(--si-primary)}
.si-cta>.si-ic:first-child{color:var(--si-primary)}
.si-cta span{flex:1}
.si-cta small{display:block;color:var(--si-muted)}
.si-related{margin:10px 0 30px}
.si-related h2{font-size:1.3rem}
.si-disclaimer{display:flex;gap:12px;padding:16px 20px;border-radius:var(--si-r);background:var(--si-surface-2);border:1px dashed var(--si-line);margin:28px 0;font-size:.9rem;color:var(--si-muted)}
.si-disclaimer .si-ic{color:var(--si-accent);margin-top:2px}
.si-disclaimer strong{color:var(--si-ink)}
.si-disclaimer p{margin:2px 0 0}

/* FAQ */
.si-faq{margin:34px 0}
.si-faq h2{font-size:1.4rem}
.si-faq__item{border:1px solid var(--si-line);border-radius:14px;background:var(--si-surface);margin-bottom:8px;overflow:hidden}
.si-faq__item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;font-weight:700;cursor:pointer}
.si-faq__item summary::-webkit-details-marker{display:none}
.si-faq__item[open] summary{color:var(--si-primary)}
.si-faq__chev{transition:transform .2s;color:var(--si-muted)}
.si-faq__item[open] .si-faq__chev{transform:rotate(180deg)}
.si-faq__a{padding:0 18px 14px;color:var(--si-muted)}
.si-faq__a p:last-child{margin:0}
.si-notes{margin:34px 0}
.si-notes h2{font-size:1.4rem}
.si-notes__grid{display:flex;flex-wrap:wrap;gap:12px}
.si-note{flex:1 1 300px;display:flex;gap:12px;padding:16px 18px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:var(--si-r)}
.si-note .si-ic{color:var(--si-primary);margin-top:2px}
.si-note h3{font-size:1rem;margin-bottom:.2em}
.si-note p{margin:0;font-size:.92rem;color:var(--si-muted)}

/* ---------- Tools common ---------- */
.si-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:18px}
.si-toolbar__dates{display:flex;align-items:center;gap:10px;color:var(--si-muted);font-weight:600;font-size:.92rem;flex:1 1 auto}
.si-settingsbox{display:flex;flex-wrap:wrap;gap:14px;padding:18px;border-radius:var(--si-r);background:var(--si-surface);border:1px solid var(--si-line);margin-bottom:18px}
.si-settingsbox label{flex:1 1 260px;display:flex;flex-direction:column;gap:6px;font-size:.84rem;font-weight:700;color:var(--si-muted)}
.si-settingsbox p{flex:1 1 100%;margin:0}
.si select,.si input[type=text],.si input[type=number],.si input[type=search],.si input[type=date]{height:44px;padding:0 12px;border-radius:12px;border:1px solid var(--si-line);background:var(--si-surface);color:var(--si-ink);width:100%;min-width:0}
.si select:focus,.si input:focus{border-color:var(--si-primary);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--si-primary) 18%,transparent)}
.si-select{display:inline-flex;min-width:0}
.si-select--block{display:flex;margin-bottom:12px}
.si-panelcard{background:var(--si-surface);border:1px solid var(--si-line);border-radius:20px;padding:20px;margin-bottom:22px}
.si-panelcard__head{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px}
.si-panelcard__head h2{font-size:1.2rem;margin:0;flex:1 1 auto}
.si-panelcard__h{font-size:1.1rem;margin:4px 0 12px}
.si-seg{display:inline-flex;max-width:100%;padding:3px;border-radius:999px;background:var(--si-surface-2);border:1px solid var(--si-line)}
.si-seg button{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:7px 14px;border-radius:999px;font-weight:700;font-size:.85rem;cursor:pointer;color:var(--si-muted)}
.si-seg button.is-on{background:var(--si-surface);color:var(--si-primary);box-shadow:var(--si-shadow)}
@media (max-width:420px){.si-seg button{padding:7px 10px;font-size:.8rem}}
.si-monthnav{display:flex;align-items:center;gap:6px}
.si-monthnav strong{min-width:120px;text-align:center}
.si-filterbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px}
.si-search{display:flex;align-items:center;gap:8px;padding:0 14px;border-radius:999px;border:1px solid var(--si-line);background:var(--si-surface);height:46px}
.si-search:focus-within{border-color:var(--si-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--si-primary) 16%,transparent)}
.si-search .si-ic{color:var(--si-muted)}
.si .si-search input{border:0!important;box-shadow:none!important;background:none;height:44px;padding:0}
.si-search--grow{flex:1 1 320px}
.si-switch{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:600;cursor:pointer;user-select:none}
.si-switch input{appearance:none;-webkit-appearance:none;width:38px;height:22px;border-radius:999px;background:var(--si-line);position:relative;cursor:pointer;transition:.2s;margin:0;flex:none}
.si-switch input::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.si-switch input:checked{background:var(--si-primary)}
.si-switch input:checked::after{left:19px}
.si-loading{padding:40px;text-align:center;color:var(--si-muted)}
.si-loading::before{content:"";display:block;width:28px;height:28px;margin:0 auto 10px;border-radius:50%;border:3px solid var(--si-line);border-top-color:var(--si-primary);animation:si-spin 1s linear infinite}
.si-empty{text-align:center;padding:80px 24px}
.si-empty__art{width:110px;height:110px;margin:0 auto 18px;border-radius:55px 55px 18px 18px;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary)}
.si-sourceline{margin-top:20px}

/* prayer times */
.si-today{display:flex;flex-wrap:wrap;gap:20px;align-items:stretch;margin-bottom:22px}
.si-today__arc{flex:1 1 380px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:20px;padding:18px 22px;display:flex;flex-direction:column}
.si-arc--lg{margin:0 0 8px}
.si-today__next{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;border-top:1px solid var(--si-line-2);padding-top:10px;margin-top:auto}
.si-times{flex:1 1 520px;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.si-times li{flex:1 1 150px;display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:18px;background:var(--si-surface);border:1px solid var(--si-line);position:relative;transition:.2s}
.si-times li .si-ic{color:var(--si-accent)}
.si-times b{font-size:.86rem;color:var(--si-muted);font-weight:700}
.si-times strong{font-size:1.6rem;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.si-times small{font-size:.78rem;color:var(--si-muted)}
.si-times li.is-next{background:linear-gradient(150deg,var(--si-primary),var(--si-primary-d));color:#fff;border-color:transparent;box-shadow:var(--si-shadow-lg)}
.si-times li.is-next b,.si-times li.is-next small,.si-times li.is-next .si-ic{color:color-mix(in srgb,#fff 80%,transparent)}
.si-times li.is-past{opacity:.6}
.si-times li.is-aux strong{font-size:1.3rem}
.si-mt th,.si-mt td{text-align:center!important;font-variant-numeric:tabular-nums;white-space:nowrap}
.si-mt th:first-child,.si-mt td:first-child{text-align:left!important}
.si-mt tr.is-today{background:var(--si-tint)!important;font-weight:700}
.si-mt tr.is-friday td:first-child,.si-mt tr.is-friday th:first-child{color:var(--si-primary)}
.si-mt small{display:block;color:var(--si-muted);font-weight:400;font-size:.75rem}
.si-linechart svg{width:100%;height:auto;display:block}
.si-lc__grid{stroke:var(--si-line-2);stroke-width:1}
.si-lc__axis{font:600 10px var(--si-font);fill:var(--si-muted)}
.si-lc__line{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.si-lc__area{opacity:.12}
.si-lc__legend{display:flex;flex-wrap:wrap;gap:14px;font-size:.84rem;color:var(--si-muted);margin:6px 0 0}
.si-lc__legend i{display:inline-block;width:14px;height:3px;border-radius:2px;margin-right:6px;vertical-align:3px}

/* dialog */
.si-dialog{border:0;padding:0;border-radius:22px;width:min(520px,calc(100% - 24px));background:var(--si-surface);color:var(--si-ink);box-shadow:var(--si-shadow-lg)}
.si-dialog::backdrop{background:rgba(10,20,24,.45);backdrop-filter:blur(3px)}
.si-dialog__box{padding:20px}
.si-dialog__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.si-dialog__head h2{margin:0;font-size:1.2rem}
.si-or{display:flex;align-items:center;gap:10px;margin:14px 0;color:var(--si-muted);font-size:.84rem}
.si-or::before,.si-or::after{content:"";flex:1;height:1px;background:var(--si-line)}
.si-cityres{list-style:none;margin:8px 0;padding:0;max-height:300px;overflow:auto}
.si-cityres button{display:flex;width:100%;text-align:left;gap:10px;align-items:center;padding:10px 12px;border:0;background:none;border-radius:12px;cursor:pointer}
.si-cityres button:hover,.si-cityres button:focus{background:var(--si-tint)}
.si-cityres small{color:var(--si-muted)}

/* qibla */
.si-qibla{display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-bottom:24px}
.si-qibla__dialwrap{flex:1 1 380px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:24px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:24px}
.si-qibla__dial{width:min(340px,100%);aspect-ratio:1}
.si-qibla__dial svg{width:100%;height:100%;overflow:visible}
.si-qibla__rose{transform-origin:150px 150px;transition:transform .25s ease-out}
.si-qibla__ring{fill:var(--si-surface-2);stroke:var(--si-line);stroke-width:2}
.si-qibla__ring2{fill:none;stroke:var(--si-line-2);stroke-width:1;stroke-dasharray:2 6}
.si-qibla__ticks line{stroke:var(--si-muted);stroke-width:1}
.si-qibla__ticks line.is-major{stroke:var(--si-ink);stroke-width:2}
.si-qibla__card{font:800 16px var(--si-font);fill:var(--si-muted);text-anchor:middle}
.si-qibla__card--n{fill:var(--si-bad)}
.si-qibla__needle{stroke:var(--si-primary);stroke-width:4;stroke-linecap:round}
.si-qibla__kaaba{fill:#1b1b1b;stroke:var(--si-accent);stroke-width:2}
.si-qibla__kiswa{fill:var(--si-accent)}
.si-qibla__hub{fill:var(--si-primary)}
.si-qibla__marker{fill:var(--si-accent)}
.si-qibla__status{color:var(--si-muted);font-size:.92rem;margin:0}
.si-qibla__status.is-aligned{color:var(--si-ok);font-weight:700}
.si-qibla__facts{flex:1 1 320px;display:flex;flex-wrap:wrap;gap:10px;margin:0}
.si-qibla__facts div{flex:1 1 220px;padding:16px 18px;background:var(--si-surface);border:1px solid var(--si-line);border-radius:16px}
.si-qibla__facts dt{font-size:.82rem;color:var(--si-muted);font-weight:700}
.si-qibla__facts dd{margin:4px 0 0;font-size:1.35rem;font-weight:800;font-variant-numeric:tabular-nums}

/* quran index */
.si-qstats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.si-qstat{flex:1 1 140px;padding:14px 18px;border-radius:16px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-qstat strong{display:block;font-size:1.5rem;font-weight:800;color:var(--si-primary)}
.si-qstat span{font-size:.84rem;color:var(--si-muted)}
.si-qstat--bar{flex:2 1 300px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.si-split{height:12px;border-radius:999px;background:var(--si-accent);overflow:hidden}
.si-split__a{display:block;height:100%;background:var(--si-primary)}
.si-split__legend{display:flex;gap:16px;font-size:.84rem;color:var(--si-muted)}
.si-surahgrid,.si-juzgrid{display:flex;flex-wrap:wrap;gap:10px}
.si-surah,.si-juz{flex:1 1 360px;display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:16px;background:var(--si-surface);border:1px solid var(--si-line);color:var(--si-ink)!important;text-decoration:none!important;transition:.16s}
.si-surah:hover,.si-juz:hover{border-color:var(--si-primary);box-shadow:var(--si-shadow);transform:translateY(-1px)}
.si-surah__body{flex:1;min-width:0}
.si-surah__body strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-surah__meta{flex:none}
.si-surah__body small,.si-juz small{display:block;color:var(--si-muted);font-size:.82rem}
.si-surah__meta{text-align:right}
.si-surah__meta .si-ar{display:block;font-size:1.3rem;color:var(--si-primary);line-height:1.4}
.si-surah__meta small{color:var(--si-muted);font-size:.74rem;white-space:nowrap}
.si-starnum{position:relative;flex:none;width:42px;height:42px;display:grid;place-items:center}
.si-starnum svg{position:absolute;inset:0;fill:var(--si-tint);stroke:color-mix(in srgb,var(--si-primary) 45%,transparent);stroke-width:1.2;transition:.2s}
.si-starnum b{position:relative;font-size:.8rem;font-weight:800;color:var(--si-primary)}
.si-surah:hover .si-starnum svg,.si-juz:hover .si-starnum svg{fill:var(--si-primary);transform:rotate(22.5deg)}
.si-surah:hover .si-starnum b,.si-juz:hover .si-starnum b{color:#fff}
.si-starnum--sm{width:36px;height:36px}

/* surah reader */
.si-surahhead{padding:30px 0 26px;background:linear-gradient(180deg,var(--si-tint),var(--si-bg));border-bottom:1px solid var(--si-line-2)}
.si-surahhead__row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.si-surahhead h1{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:800;letter-spacing:-.03em;margin-bottom:.1em}
.si-surahhead__ar{font-family:var(--si-quran);font-size:clamp(2rem,4vw,3rem);color:var(--si-primary)}
.si-reader{padding-top:18px}
.si-readerbar{position:sticky;top:calc(var(--si-head) + 8px);z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px;border-radius:18px;background:color-mix(in srgb,var(--si-surface) 92%,transparent);backdrop-filter:blur(10px);border:1px solid var(--si-line);box-shadow:var(--si-shadow);margin-bottom:18px}
body:not(.si-sticky) .si-readerbar{top:8px}
.si-readerbar .si-select{flex:1 1 220px}
.si-readerbar__toggles{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-left:auto}
.si-fontsize{display:inline-flex;border:1px solid var(--si-line);border-radius:10px;overflow:hidden}
.si-fontsize button{border:0;background:var(--si-surface);padding:6px 10px;font-weight:800;cursor:pointer}
.si-fontsize button+button{border-left:1px solid var(--si-line)}
.si-basmala{text-align:center;font-family:var(--si-quran);font-size:calc(var(--si-qsize) * 1.05);color:var(--si-primary);margin:8px 0 20px}
.si-ayahs{list-style:none;margin:0;padding:0}
.si-ayah{display:flex;gap:18px;padding:22px 4px;border-bottom:1px solid var(--si-line-2);scroll-margin-top:calc(var(--si-head) + 90px);transition:background .3s}
.si-ayah.is-playing{background:color-mix(in srgb,var(--si-accent) 9%,transparent);border-radius:14px}
.si-ayah.is-marked .si-ayah__actions [data-si-mark]{color:var(--si-accent)}
.si-ayah:target{background:var(--si-tint);border-radius:14px}
.si-ayah__side{flex:none;display:flex;flex-direction:column;align-items:center;gap:6px}
.si-ayah__actions{display:flex;flex-direction:column;gap:2px;opacity:.55;transition:opacity .2s}
.si-ayah:hover .si-ayah__actions,.si-ayah.is-playing .si-ayah__actions{opacity:1}
.si-ayah__actions .si-iconbtn{min-width:34px;height:34px}
.si-ayah__body{flex:1;min-width:0}
.si-ayah__ar{font-size:var(--si-qsize);line-height:2.25;text-align:right;margin:0 0 10px!important;color:var(--si-ink);word-spacing:.05em}
.si-ayah__tl{font-style:italic;color:var(--si-muted);margin:0 0 6px!important}
.si-ayah__tr{margin:0!important;font-size:1.02rem}
.si-sajda{color:var(--si-accent)}
.si-pager{display:flex;justify-content:space-between;align-items:stretch;gap:10px;margin:26px 0}
.si-pager a{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;border:1px solid var(--si-line);background:var(--si-surface);color:var(--si-ink)!important;text-decoration:none!important;flex:1 1 0;min-width:0}
.si-pager a:hover{border-color:var(--si-primary)}
.si-pager a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.si-pager small{display:block;color:var(--si-muted);font-size:.75rem}
.si-pager .si-pager__next{justify-content:flex-end;text-align:right}
.si-pager .si-pager__mid{flex:0 0 auto}
.si-pager>span{flex:1 1 0}
.si-drawer{position:fixed;inset:0;z-index:80;background:rgba(10,20,24,.4);display:flex;justify-content:flex-end}
.si-drawer[hidden]{display:none}
.si-drawer__box{width:min(560px,100%);height:100%;background:var(--si-surface);padding:20px;overflow:auto;box-shadow:var(--si-shadow-lg);animation:si-slide .25s ease-out}
@keyframes si-slide{from{transform:translateX(40px);opacity:0}}
.si-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.si-drawer__head h2{font-size:1.2rem;margin:0}
.si-drawer__body{font-size:.98rem}
.si-player{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:70;display:flex;align-items:center;gap:12px;width:min(520px,calc(100% - 24px));padding:10px 12px;border-radius:18px;background:var(--si-ink);color:var(--si-bg);box-shadow:var(--si-shadow-lg)}
.si-player .si-iconbtn{color:var(--si-bg)}
.si-player__info{flex:1;min-width:0}
.si-player__info strong{display:block;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-player__bar{height:4px;border-radius:4px;background:color-mix(in srgb,var(--si-bg) 25%,transparent);margin-top:6px;overflow:hidden}
.si-player__bar span{display:block;height:100%;width:0;background:var(--si-accent)}
.si-player .si-player__play{display:none}
.si-player.is-paused .si-player__play{display:inline-block}
.si-player.is-paused .si-player__pause{display:none}

/* hadith */
.si-books{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:20px}
.si-bookcard{flex:1 1 280px;position:relative;display:flex;flex-direction:column;gap:4px;padding:20px 20px 18px 30px;border-radius:18px;background:var(--si-surface);border:1px solid var(--si-line);color:var(--si-ink)!important;text-decoration:none!important;overflow:hidden;transition:.18s}
.si-bookcard:hover{transform:translateY(-3px);box-shadow:var(--si-shadow-lg);border-color:color-mix(in srgb,var(--si-primary) 35%,var(--si-line))}
.si-bookcard__spine{position:absolute;left:0;top:0;bottom:0;width:10px;background:repeating-linear-gradient(180deg,var(--si-primary) 0 18px,var(--si-primary-d) 18px 20px,var(--si-accent) 20px 22px,var(--si-primary-d) 22px 24px)}
.si-bookcard__ar{font-size:1.5rem;color:var(--si-primary);line-height:1.5}
.si-bookcard strong{font-size:1.08rem}
.si-bookcard small{color:var(--si-muted)}
.si-bookcard__meta{display:flex;gap:6px;margin-top:8px}
.si-jump{display:flex;align-items:flex-end;gap:8px}
.si-jump label{display:flex;align-items:center;gap:8px;font-size:.86rem;font-weight:700;color:var(--si-muted)}
.si-jump input{width:110px!important}
.si-chapters{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.si-chapter{flex:1 1 380px}
.si-chapter a{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:14px;background:var(--si-surface);border:1px solid var(--si-line);color:var(--si-ink)!important;text-decoration:none!important;height:100%}
.si-chapter a:hover{border-color:var(--si-primary)}
.si-chapter__n{flex:none;min-width:34px;height:34px;padding:0 6px;border-radius:10px;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary);font-weight:800;font-size:.84rem}
.si-chapter__t{flex:1;font-weight:600}
.si-chapter__r{font-size:.78rem;color:var(--si-muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.si-hadiths{display:flex;flex-direction:column;gap:14px}
.si-hadith{padding:20px 22px;border-radius:18px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-hadith__head{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:10px}
.si-hadith__no{font-weight:800;color:var(--si-primary);margin-right:6px}
.si-hadith__copy{margin-left:auto}
.si-hadith__ar{font-size:1.4rem;text-align:right;margin:0 0 12px!important;padding-bottom:12px;border-bottom:1px dashed var(--si-line)}
.si-hadith__en{margin:0!important;white-space:pre-line}
.si-hadith__ref{margin-top:10px;font-size:.8rem;color:var(--si-muted)}
.si-hide-ar .si-hadith__ar{display:none}

/* tasbih */
.si-tasbih{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;margin-bottom:20px}
.si-tasbih__left{flex:1 1 340px;display:flex;flex-direction:column;gap:14px}
.si-dhikrs{display:flex;flex-wrap:wrap;gap:8px}
.si-dhikr{flex:1 1 240px;text-align:left;display:flex;flex-direction:column;padding:12px 16px;border-radius:16px;border:1px solid var(--si-line);background:var(--si-surface);cursor:pointer;transition:.15s}
.si-dhikr .si-ar{font-size:1.35rem;line-height:1.6;color:var(--si-primary);text-align:right;direction:rtl}
.si-dhikr small{color:var(--si-muted)}
.si-dhikr.is-on{border-color:var(--si-primary);background:var(--si-tint);box-shadow:inset 0 0 0 1px var(--si-primary)}
.si-tasbih__opts{display:flex;flex-wrap:wrap;gap:14px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-tasbih__opts label:first-child{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.88rem}
.si-tasbih__opts input[type=number]{width:100px}
.si-tasbih__main{flex:1 1 420px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:26px 20px;border-radius:26px;background:radial-gradient(circle at 50% 30%,var(--si-tint),var(--si-surface) 70%);border:1px solid var(--si-line)}
.si-tasbih__ar{font-size:2.3rem;color:var(--si-primary);margin:0!important;line-height:1.6}
.si-tasbih__tl{font-weight:700;margin:0 0 14px!important}
.si-counter{position:relative;width:min(260px,72vw);aspect-ratio:1;border-radius:50%;border:0;background:var(--si-surface);box-shadow:var(--si-shadow-lg),inset 0 -8px 24px -12px color-mix(in srgb,var(--si-primary) 40%,transparent);cursor:pointer;display:grid;place-items:center;transition:transform .08s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.si-counter:active{transform:scale(.97)}
.si-counter svg{position:absolute;inset:0;transform:rotate(-90deg)}
.si-counter__track{fill:none;stroke:var(--si-line-2);stroke-width:10}
.si-counter__prog{fill:none;stroke:var(--si-primary);stroke-width:10;stroke-linecap:round;stroke-dasharray:603.2;stroke-dashoffset:603.2;transition:stroke-dashoffset .25s}
.si-counter__num{font-size:4rem;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums;line-height:1;position:relative;margin-top:-10px}
.si-counter__of{position:absolute;bottom:30%;font-weight:700;color:var(--si-muted)}
.si-counter.is-done{animation:si-pulse .6s}
@keyframes si-pulse{50%{box-shadow:0 0 0 18px color-mix(in srgb,var(--si-accent) 25%,transparent)}}
.si-tasbih__mean{color:var(--si-muted);margin:14px 0 0!important}
.si-tasbih__stats{display:flex;gap:10px;margin:18px 0 10px;width:100%}
.si-tasbih__stats div{flex:1;padding:10px;border-radius:14px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-tasbih__stats dt{font-size:.75rem;color:var(--si-muted);font-weight:700}
.si-tasbih__stats dd{margin:0;font-size:1.25rem;font-weight:800;font-variant-numeric:tabular-nums}
.si-week{display:flex;align-items:flex-end;gap:6px;height:70px;width:100%;margin:6px 0 10px}
.si-week span{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;justify-content:flex-end;font-size:.7rem;color:var(--si-muted)}
.si-week i{display:block;width:100%;border-radius:6px 6px 2px 2px;background:var(--si-primary-l);min-height:3px;transition:height .4s}
.si-week span.is-today i{background:var(--si-primary)}

/* hijri */
.si-hijrigrid{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}
.si-hijrigrid>.si-panelcard{flex:1 1 min(440px,100%);min-width:0;margin:0}
.si-cal__title{flex:1}
.si-cal__title strong{display:block;font-size:1.3rem}
.si-cal__title small{color:var(--si-muted)}
.si-cal__grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-bottom:10px}
.si-cal__dow{text-align:center;font-size:.74rem;font-weight:800;color:var(--si-muted);padding:4px 0;text-transform:uppercase}
.si-cal__day{aspect-ratio:1/.9;border-radius:12px;background:var(--si-surface-2);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;font-variant-numeric:tabular-nums}
.si-cal__day b{font-size:1.1rem}
.si-cal__day small{font-size:.68rem;color:var(--si-muted);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:clip}
.si-cal__day.is-today{background:var(--si-primary);color:#fff}
.si-cal__day.is-today small{color:color-mix(in srgb,#fff 80%,transparent)}
.si-cal__day.is-event::after{content:"";position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--si-accent)}
.si-cal__day.is-white{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--si-accent) 50%,transparent)}
.si-cal__day.is-blank{background:none}
.si-convert{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.si-convert__box{flex:1 1 240px;padding:14px;border-radius:14px;background:var(--si-surface-2);border:1px solid var(--si-line-2)}
.si-convert__box h3{font-size:.9rem;margin-bottom:8px}
.si-convert__row{display:flex;flex-wrap:wrap;gap:6px}
.si-convert__row input{flex:0 0 64px}
.si-convert__row input[data-si-h-y]{flex:0 0 88px}
.si-convert__row select{flex:1 1 150px}
.si-convert output{display:block;margin-top:10px;font-weight:700;color:var(--si-primary)}
.si-events{list-style:none;margin:0;padding:0}
.si-events li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--si-line-2)}
.si-events__d{flex:none;width:54px;text-align:center;padding:6px 0;border-radius:12px;background:var(--si-tint);color:var(--si-primary);line-height:1.1}
.si-events__d b{display:block;font-size:1.15rem}
.si-events__d small{font-size:.66rem;font-weight:700;text-transform:uppercase}
.si-events__t{flex:1;min-width:0}
.si-events__t strong{display:block;font-size:.95rem}
.si-events__t small{color:var(--si-muted)}
.si-events__in{font-size:.78rem;font-weight:700;color:var(--si-accent);white-space:nowrap}
.si-events li.is-past{opacity:.55}

/* ramadan */
.si-ramtop{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:18px}
.si-countdown{flex:1 1 380px;padding:22px 24px;border-radius:22px;background:linear-gradient(140deg,var(--si-primary),var(--si-primary-d));color:#fff;position:relative;overflow:hidden}
.si-countdown::after{content:"";position:absolute;right:-30px;top:-30px;width:170px;height:170px;border-radius:50%;box-shadow:-34px 22px 0 0 color-mix(in srgb,var(--si-accent) 55%,transparent);opacity:.6}
.si-countdown small{display:block;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.8;font-size:.76rem}
.si-countdown strong{display:block;font-size:2rem;font-weight:800;letter-spacing:-.02em;margin:4px 0;font-variant-numeric:tabular-nums}
.si-countdown span{opacity:.85}
.si-ramfacts{flex:1 1 380px;display:flex;flex-wrap:wrap;gap:10px;margin:0}
.si-ramfacts div{flex:1 1 40%;padding:14px 16px;border-radius:16px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-ramfacts dt{font-size:.8rem;color:var(--si-muted);font-weight:700}
.si-ramfacts dd{margin:2px 0 0;font-size:1.25rem;font-weight:800}
.si-rt tr.is-odd-last td:first-child::after{content:"✦";color:var(--si-accent);margin-left:6px}
.si-rt tr.is-last10{background:color-mix(in srgb,var(--si-accent) 6%,transparent)}
.si-rt tr.is-today{background:var(--si-tint)!important;font-weight:700}
.si-rt .si-rt__s{color:var(--si-primary);font-weight:800}
.si-rt .si-rt__i{color:var(--si-accent);font-weight:800}

/* zakat */
.si-zakat{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;margin-bottom:20px}
.si-zakat__form{flex:1 1 560px;display:flex;flex-direction:column;gap:12px}
.si-zgroup{margin:0;padding:16px 18px 18px;border:1px solid var(--si-line);border-radius:18px;background:var(--si-surface)}
.si-zgroup legend{display:flex;align-items:center;gap:10px;width:100%;padding:0;font-weight:800;font-size:1rem;float:left;margin-bottom:12px}
.si-zgroup legend+*{clear:both}
.si-zgroup__ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary)}
.si-zgroup__sum{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--si-primary);font-size:.92rem}
.si-zfields{display:flex;flex-wrap:wrap;gap:12px}
.si-zfields label{flex:1 1 230px;display:flex;flex-direction:column;gap:6px;font-size:.84rem;font-weight:600;color:var(--si-muted)}
.si-zgroup p{margin:10px 0 0}
.si-zresult{flex:1 1 340px;position:sticky;top:calc(var(--si-head) + 18px);display:flex;flex-direction:column;gap:12px}
.si-zresult__card{padding:20px;border-radius:22px;background:var(--si-surface);border:1px solid var(--si-line);box-shadow:var(--si-shadow)}
.si-donut{width:180px;margin:0 auto 12px}
.si-donut svg{width:100%;height:auto;display:block}
.si-donut text{font:800 15px var(--si-font);fill:var(--si-ink);text-anchor:middle}
.si-donut .si-donut__sub{font:600 9px var(--si-font);fill:var(--si-muted)}
.si-zresult__rows{margin:0}
.si-zresult__rows div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--si-line-2);font-size:.92rem}
.si-zresult__rows dt{color:var(--si-muted)}
.si-zresult__rows dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums}
.si-zresult__due{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:12px;padding:14px 16px;border-radius:16px;background:linear-gradient(140deg,var(--si-primary),var(--si-primary-d));color:#fff}
.si-zresult__due strong{font-size:1.6rem;font-weight:800;font-variant-numeric:tabular-nums}
.si-zresult__msg{font-size:.88rem;margin:10px 0 6px!important;color:var(--si-muted)}
.si-nisabbar{position:relative;height:10px;border-radius:999px;background:var(--si-surface-2);border:1px solid var(--si-line-2);overflow:visible}
.si-nisabbar span{display:block;height:100%;border-radius:999px;background:var(--si-primary);width:0;transition:width .5s}
.si-nisabbar i{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--si-accent);left:50%}
.si-zmini{padding:16px 18px;border-radius:18px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-zmini h3{font-size:1rem}
.si-zmini__row{display:flex;gap:10px}
.si-zmini__row label{flex:1;display:flex;flex-direction:column;gap:4px;font-size:.8rem;font-weight:600;color:var(--si-muted)}
.si-zmini p{margin:10px 0 0}

/* duas & names */
.si-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:16px;scrollbar-width:thin}
.si-tab{display:inline-flex;align-items:center;gap:6px;flex:none;padding:9px 16px;border-radius:999px;border:1px solid var(--si-line);background:var(--si-surface);font-weight:700;font-size:.88rem;cursor:pointer;color:var(--si-ink)}
.si-tab.is-on{background:var(--si-primary);border-color:var(--si-primary);color:#fff}
.si-duacat{margin-bottom:26px}
.si-duacat h2{font-size:1.3rem}
.si-duas{display:flex;flex-wrap:wrap;gap:12px}
.si-dua{flex:1 1 440px;padding:18px 20px;border-radius:18px;background:var(--si-surface);border:1px solid var(--si-line)}
.si-dua header{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.si-dua h3{font-size:1rem;margin:0;flex:1}
.si-dua__ar{font-size:1.55rem;text-align:right;color:var(--si-primary);margin:0 0 6px!important;line-height:2}
.si-dua__tr{margin:0!important}
.si-dua footer{margin-top:8px;font-size:.8rem;color:var(--si-muted);font-weight:600}
.si-names{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.si-name{flex:1 1 200px;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:22px 14px 16px;border-radius:120px 120px 16px 16px;background:var(--si-surface);border:1px solid var(--si-line);transition:.2s}
.si-name:hover{transform:translateY(-3px);box-shadow:var(--si-shadow-lg);border-color:color-mix(in srgb,var(--si-accent) 50%,var(--si-line))}
.si-name__n{position:absolute;top:10px;left:50%;transform:translateX(-50%);font-size:.7rem;font-weight:800;color:var(--si-accent)}
.si-name__ar{font-size:2rem;color:var(--si-primary);line-height:1.7;margin-top:6px}
.si-name__tl{font-size:.98rem}
.si-name__mean{font-size:.84rem;color:var(--si-muted)}
.si-is-hidden{display:none!important}

/* ---------- Ads ---------- */
.si-ad{max-width:1280px;margin:20px auto;padding:0 24px;text-align:center;overflow:hidden}
.si-ad:empty{display:none}

/* ---------- Footer ---------- */
.si-footer{margin-top:64px;background:var(--si-surface);border-top:1px solid var(--si-line);padding:40px 0 20px}
.si-footer__top{display:flex;flex-wrap:wrap;gap:40px;padding-bottom:28px;border-bottom:1px solid var(--si-line-2)}
.si-footer__brand{flex:1 1 300px}
.si-footer__name{font-weight:800;font-size:1.15rem}
.si-footer__brand p{color:var(--si-muted);font-size:.9rem;margin-top:8px}
.si-footer__cols{flex:3 1 600px;display:flex;flex-wrap:wrap;gap:24px}
.si-footer__col{flex:1 1 150px}
.si-footer__col h2{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--si-muted);margin-bottom:10px}
.si-footer__col ul{list-style:none;margin:0;padding:0}
.si-footer__col li{margin-bottom:6px}
.si-footer__col a{color:var(--si-ink);font-size:.92rem}
.si-footer__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:18px;font-size:.86rem;color:var(--si-muted)}
.si-install{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--si-line);background:var(--si-surface-2);padding:7px 14px;border-radius:999px;cursor:pointer;font-weight:700;font-size:.84rem}
.si-tabbar{display:none}
.si-toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);z-index:90;background:var(--si-ink);color:var(--si-bg);padding:10px 18px;border-radius:999px;font-weight:600;font-size:.9rem;box-shadow:var(--si-shadow-lg);animation:si-fade .2s}
@keyframes si-fade{from{opacity:0;transform:translate(-50%,8px)}}
.si-reveal{opacity:0;transform:translateY(14px);transition:opacity .6s,transform .6s}
.si-reveal.is-in{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .si-nav{position:fixed;inset:var(--si-head) 0 0 0;background:var(--si-surface);display:block;overflow:auto;padding:12px 18px 100px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .2s,transform .2s,visibility .2s;z-index:60}
  .si-nav.is-open{opacity:1;visibility:visible;transform:none}
  .si-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--si-surface)}
  .si-nav__list{flex-direction:column;align-items:stretch;gap:2px}
  .si-nav__link{width:100%;justify-content:space-between;padding:14px 12px;border-radius:12px;font-size:1rem}
  .si-panel{position:static;transform:none!important;min-width:0;opacity:1;visibility:visible;box-shadow:none;border:0;padding:0 0 6px;display:none}
  .si-nav__item.is-open .si-panel{display:block}
  .si-panel__grid{grid-template-columns:1fr}
  .si-menubtn{display:inline-flex}
  .si-menu-open .si-menubtn__open{display:none}
  .si-menu-open .si-menubtn__close{display:inline-block}
  .si-menu-open{overflow:hidden}
  .si-toc{display:none}
  .si-header__inner{justify-content:space-between}
}
@media (max-width:760px){
  :root{--si-head:60px;--si-qsize:1.6rem}
  .si-wrap{padding:0 16px}
  body.si{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .si-brand__tag{display:none}
  .si-hero{padding:30px 0 36px}
  .si-hero__grid{flex-direction:column;align-items:stretch;gap:24px}
  .si-nextcard{flex:none}
  .si-hero__copy{flex:none}
  .si-section{margin-top:40px}
  .si-pillars{gap:10px}
  .si-pillar{flex:1 1 150px;padding:16px 10px 14px;border-radius:80px 80px 14px 14px}
  .si-pillar__arch{width:52px;height:60px;border-radius:28px 28px 8px 8px;margin-bottom:8px}
  .si-pillar__n{top:10px;right:14px}
  .si-guidehead__row{flex-direction:column-reverse;align-items:flex-start;gap:6px}
  .si-guidehead__seal{width:110px;height:110px}
  .si-guidehead__seal .si-ar{font-size:1.6rem}
  .si-guide{padding-top:20px}
  .si-pagehead__icon{width:50px;height:58px}
  .si-timeline li{flex-direction:column;gap:4px}
  .si-timeline__label{flex:none}
  .si-ayah{gap:10px}
  .si-ayah__actions{flex-direction:row;opacity:1}
  .si-ayah{flex-direction:column}
  .si-ayah__side{flex-direction:row;justify-content:space-between;width:100%}
  .si-readerbar__toggles{margin-left:0}
  .si-zresult{position:static}
  .si-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;background:color-mix(in srgb,var(--si-surface) 94%,transparent);backdrop-filter:blur(14px);border-top:1px solid var(--si-line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .si-tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0;font-size:.68rem;font-weight:700;color:var(--si-muted)!important;text-decoration:none!important}
  .si-tabbar a.is-active{color:var(--si-primary)!important}
  .si-tabbar a.is-active .si-ic{background:var(--si-tint);border-radius:999px;padding:2px 12px;width:48px}
  .si-player{bottom:calc(76px + env(safe-area-inset-bottom))}
  .si-toast{bottom:calc(84px + env(safe-area-inset-bottom))}
  .si-chart__label{flex-basis:64px;font-size:.82rem}
  .si-surah__meta small{display:none}
  .si-pager a span small{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{
  .si-header,.si-footer,.si-tabbar,.si-toolbar,.si-ad,.si-faq,.si-notes,.si-disclaimer,.si-seg,.si-monthnav button,.si-today,.si-readerbar,.si-player,.si-settingsbox,.si-ramtop{display:none!important}
  body.si{background:#fff;color:#000}
  .si-panelcard{border:0;padding:0}
}

/* dark-mode contrast for filled elements */
[data-theme="dark"] .si-btn--primary,[data-theme="dark"] .si-mini-times li.is-next,[data-theme="dark"] .si-tab.is-on,[data-theme="dark"] .si-cal__day.is-today,[data-theme="dark"] .si-step__n{background:var(--si-primary-d);color:#fff}
[data-theme="dark"] .si-pillar__arch,[data-theme="dark"] .si-pagehead__icon,[data-theme="dark"] .si-daily__card--verse,[data-theme="dark"] .si-times li.is-next,[data-theme="dark"] .si-countdown,[data-theme="dark"] .si-zresult__due{background:linear-gradient(150deg,var(--si-primary-d),#0b2f27)}
[data-theme="dark"] .si-tool:hover .si-tool__ic{background:var(--si-primary-d)}
[data-theme="dark"] .si-qibla__kaaba{fill:#000}
.si-daily .si-daily__card--verse figcaption{color:color-mix(in srgb,#fff 80%,transparent)}
.si-readprog{position:fixed;left:0;right:0;top:0;height:3px;z-index:90;pointer-events:none}
.si-readprog span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--si-primary),var(--si-accent));transition:width .1s}
.si-player [data-si-player-repeat].is-on{color:var(--si-accent);background:color-mix(in srgb,var(--si-bg) 15%,transparent)}
.si-twocol{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:22px}
.si-twocol>.si-panelcard{margin:0}
.si-tracker{flex:2 1 520px}
.si-alerts{flex:1 1 300px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.si-alerts .si-panelcard__head{margin:0;width:100%}
.si-alerts p{margin:0}
.si-tracker__today{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.si-pchip{flex:1 1 90px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 12px;border-radius:14px;border:1px dashed var(--si-line);background:var(--si-surface-2);font-weight:700;font-size:.9rem;cursor:pointer;color:var(--si-muted);transition:.15s}
.si-pchip:hover{border-color:var(--si-primary);color:var(--si-primary)}
.si-pchip.is-done{border-style:solid;border-color:var(--si-primary);background:var(--si-primary);color:#fff}
.si-tracker__stats{display:flex;gap:10px;margin:0 0 14px}
.si-tracker__stats div{flex:1;padding:10px 14px;border-radius:12px;background:var(--si-surface-2)}
.si-tracker__stats dt{font-size:.78rem;color:var(--si-muted);font-weight:700}
.si-tracker__stats dd{margin:0;font-size:1.3rem;font-weight:800;color:var(--si-primary)}
.si-heat{display:grid;grid-template-columns:repeat(35,1fr);gap:3px;margin-bottom:16px}
.si-heat__c{display:block;aspect-ratio:1;border-radius:3px;background:var(--si-line-2)}
.si-heat__c.is-today{outline:2px solid var(--si-accent);outline-offset:1px}
.si-heat--1{background:color-mix(in srgb,var(--si-primary) 20%,var(--si-surface))}
.si-heat--2{background:color-mix(in srgb,var(--si-primary) 38%,var(--si-surface))}
.si-heat--3{background:color-mix(in srgb,var(--si-primary) 56%,var(--si-surface))}
.si-heat--4{background:color-mix(in srgb,var(--si-primary) 76%,var(--si-surface))}
.si-heat--5{background:var(--si-primary)}
.si-heat__legend{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:4px;font-size:.75rem;color:var(--si-muted);margin-top:4px}
.si-heat__legend .si-heat__c{width:12px}
@media (max-width:760px){.si-heat{grid-template-columns:repeat(18,1fr)}}
.si-mosques{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:22px;align-items:stretch}
.si-mosques__map{flex:3 1 520px;min-height:520px;border-radius:20px;overflow:hidden;border:1px solid var(--si-line);background:var(--si-surface-2);z-index:1}
.si-mosques__list{flex:2 1 340px;list-style:none;margin:0;padding:0;max-height:520px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.si-mosques__list li{display:flex;align-items:center;gap:6px}
.si-mq{flex:1;min-width:0;display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;border-radius:14px;border:1px solid var(--si-line);background:var(--si-surface);cursor:pointer;color:var(--si-ink)}
.si-mq:hover{border-color:var(--si-primary)}
.si-mq__n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--si-tint);color:var(--si-primary);font-weight:800;font-size:.8rem}
.si-mq__t{flex:1;min-width:0}
.si-mq__t strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-mq__t small{display:block;color:var(--si-muted);font-size:.8rem}
.si-mq__d{text-align:right;flex:none}
.si-mq__d b{display:block;color:var(--si-primary)}
.si-mq__d small{color:var(--si-muted)}
.si-mpin span{display:block;width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--si-primary);border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.si-mpin.is-me span{background:var(--si-accent)}
.leaflet-popup-content{font:14px/1.5 var(--si-font)}
.si-qa{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;margin-bottom:22px}
.si-qa__player{flex:1 1 420px;position:sticky;top:calc(var(--si-head) + 18px);display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px 24px;border-radius:26px;background:radial-gradient(circle at 50% 25%,var(--si-tint),var(--si-surface) 70%);border:1px solid var(--si-line)}
.si-qa__disc{position:relative;width:min(240px,64vw);aspect-ratio:1}
.si-qa__disc svg{width:100%;height:100%;transform:rotate(-90deg)}
.si-qa__ring{fill:var(--si-surface);stroke:var(--si-line-2);stroke-width:8}
.si-qa__prog{fill:none;stroke:var(--si-primary);stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset .4s}
.si-qa__star{fill:none;stroke:color-mix(in srgb,var(--si-accent) 60%,transparent);stroke-width:1.5;transform-origin:100px 100px}
.is-playing .si-qa__star{animation:si-spin 30s linear infinite}
.si-qa__num{position:absolute;inset:0;display:grid;place-items:center;font-size:2.6rem;font-weight:800;color:var(--si-primary)}
.si-qa__ar{font-size:2rem;color:var(--si-primary);margin:10px 0 0!important;line-height:1.6}
.si-qa__title{font-size:1.4rem;margin:2px 0 2px}
.si-qa__meta{color:var(--si-muted);font-size:.9rem;margin:0 0 14px!important}
.si-qa__seek{display:flex;align-items:center;gap:10px;width:100%;font-size:.8rem;font-variant-numeric:tabular-nums;color:var(--si-muted)}
.si-qa__seek input{flex:1;accent-color:var(--si-primary)}
.si-qa__controls{display:flex;align-items:center;gap:12px;margin:14px 0}
.si-qa__play{width:68px;height:68px;border-radius:50%;border:0;background:var(--si-primary);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 24px -10px var(--si-primary)}
.si-qa__play:hover{background:var(--si-primary-d)}
.si-qa__i-pause{display:none}
.is-playing .si-qa__i-pause{display:block}
.is-playing .si-qa__i-play{display:none}
[data-si-qa-repeat].is-on{color:var(--si-accent);background:var(--si-tint-2)}
.si-qa__opts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;align-items:center;width:100%}
.si-qa__opts .si-select{flex:1 1 200px}
.si-qa__list{flex:1 1 380px;display:flex;flex-direction:column;gap:10px}
.si-qa__list ol{list-style:none;margin:0;padding:0;max-height:640px;overflow:auto;border:1px solid var(--si-line);border-radius:18px;background:var(--si-surface)}
.si-qa__item button{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 14px;border:0;border-bottom:1px solid var(--si-line-2);background:none;cursor:pointer;color:var(--si-ink)}
.si-qa__item button:hover{background:var(--si-surface-2)}
.si-qa__item button.is-on{background:var(--si-tint)}
.si-qa__n{flex:none;width:32px;font-weight:800;color:var(--si-accent);font-variant-numeric:tabular-nums}
.si-qa__t{flex:1;min-width:0}
.si-qa__t strong{display:block}
.si-qa__t small{color:var(--si-muted);font-size:.8rem}
.si-qa__item .si-ar{font-size:1.2rem;color:var(--si-primary)}
@media (max-width:760px){.si-qa__player{position:static}.si-mosques__map{min-height:380px}.si-mosques__list{max-height:none}}
.si-seg--block{display:flex}
.si-seg--block button{flex:1;justify-content:center}
.si-heirs{display:flex;flex-wrap:wrap;gap:8px}
.si-heir{flex:1 1 250px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 8px 8px 14px;border-radius:12px;background:var(--si-surface-2);border:1px solid var(--si-line-2)}
.si-heir__l{font-weight:600;font-size:.9rem}
.si-stepper{display:inline-flex;align-items:center;border:1px solid var(--si-line);border-radius:10px;overflow:hidden;background:var(--si-surface);flex:none}
.si-stepper button{width:34px;height:36px;border:0;background:none;font-size:1.1rem;font-weight:700;cursor:pointer;color:var(--si-primary)}
.si-stepper button:hover{background:var(--si-tint)}
.si .si-stepper input{width:44px;height:36px;border:0;border-radius:0;text-align:center;padding:0;font-weight:800;-moz-appearance:textfield}
.si-stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.si-zgroup.has-val{border-color:color-mix(in srgb,var(--si-primary) 45%,var(--si-line))}
.si-inhres{display:flex;flex-direction:column;gap:12px}
.si-inhres .si-panelcard__h{margin:0}
.si-inhbar{display:flex;height:22px;border-radius:999px;overflow:hidden;background:var(--si-surface-2)}
.si-inhbar span{display:block;height:100%;transition:width .5s}
.si-inhbar__rest{background:repeating-linear-gradient(45deg,var(--si-line) 0 6px,transparent 6px 12px)}
.si-dotc{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px}
.si-inhtable td,.si-inhtable th{font-variant-numeric:tabular-nums}
.si-inhtable small{color:var(--si-muted);font-weight:400}
.si-inh__why{display:block;font-size:.76rem;margin-top:2px}
.si-inhres .si-tablewrap{margin:0}
.si-inhnotes{margin:0;padding:12px 14px 12px 30px;border-radius:12px;background:var(--si-tint-2);font-size:.88rem}
.si-inhblocked{margin:0;padding-left:18px;font-size:.88rem;color:var(--si-muted)}
.si-letters{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.si-letters button{min-width:36px;height:34px;border-radius:9px;border:1px solid var(--si-line);background:var(--si-surface);font-weight:700;cursor:pointer;color:var(--si-ink)}
.si-letters button.is-on{background:var(--si-primary);border-color:var(--si-primary);color:#fff}
.si-babygrid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.si-baby{position:relative;flex:1 1 210px;display:flex;flex-direction:column;gap:2px;padding:14px 44px 14px 16px;border-radius:16px;background:var(--si-surface);border:1px solid var(--si-line);border-left:4px solid var(--si-primary);color:var(--si-ink)!important;text-decoration:none!important;transition:.15s}
.si-baby--f{border-left-color:var(--si-accent)}
.si-baby:hover{box-shadow:var(--si-shadow);transform:translateY(-2px)}
.si-baby strong{font-size:1.05rem}
.si-baby .si-ar{font-size:1.25rem;color:var(--si-primary);line-height:1.5}
.si-baby small{color:var(--si-muted);font-size:.82rem}
.si-baby__fav{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;border:0;background:var(--si-surface-2);color:var(--si-muted);cursor:pointer;display:grid;place-items:center}
.si-baby__fav.is-on,[data-si-fav].is-on{color:#C2553B}
.si-baby__fav.is-on svg{fill:#C2553B}
.si-babyhero{display:flex;align-items:center;gap:32px;flex-wrap:wrap;padding:28px 32px;border-radius:26px;background:linear-gradient(140deg,var(--si-tint),var(--si-surface));border:1px solid var(--si-line);margin-bottom:18px}
.si-babyhero__ar{flex:none;font-size:clamp(3rem,7vw,5rem);color:var(--si-primary);line-height:1.4}
.si-babyhero--f .si-babyhero__ar{color:var(--si-accent)}
.si-babyhero__body{flex:1 1 300px}
.si-babyhero h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin:0}
.si-babyhero__mean{font-size:1.2rem;color:var(--si-muted);margin:4px 0 10px!important}
.si-babyfacts{margin-bottom:20px}
.si-babyfacts .si-ar{font-size:1.6rem;font-weight:400}
.si-zakat--even>.si-zakat__form{flex:1 1 520px}
.si-zakat--even>.si-zresult{flex:1 1 520px}
.si-inhtable th[scope=row]{min-width:200px}
.si-zakat--even .si-heir{flex-basis:280px}
.si-inhres>.si-btn{align-self:flex-start}
.si-baby__link{color:inherit!important;text-decoration:none!important}
.si-baby__link::after{content:"";position:absolute;inset:0;border-radius:16px}
.si-baby__fav{z-index:2}
.si-babydetail{padding:20px 24px;border-radius:18px;background:var(--si-surface);border:1px solid var(--si-line);margin-bottom:18px}
.si-babydetail h2{font-size:1.25rem}
.si-qsearch{display:flex;gap:10px;margin-bottom:8px}
.si-qresults{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.si-qresults a{display:flex;gap:14px;padding:12px 14px;border-radius:12px;border:1px solid var(--si-line-2);color:var(--si-ink)!important;text-decoration:none!important}
.si-qresults a:hover{border-color:var(--si-primary)}
.si-qresults b{flex:none;min-width:150px;color:var(--si-primary)}
.si-qresults mark{background:var(--si-tint-2);color:inherit;padding:0 2px;border-radius:3px}
.si-khatm__top{display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-bottom:16px}
.si-khatm__ring{flex:none;width:150px}
.si-khatm__form{flex:1 1 360px}
.si-kh__pct{font:800 22px var(--si-font);fill:var(--si-ink)}
.si-kh__sub{font:600 10px var(--si-font);fill:var(--si-muted)}
.si-khtable tr.is-today{background:var(--si-tint)!important;font-weight:700}
.si-khtable tr.is-done td,.si-khtable tr.is-done th{color:var(--si-muted)}
.si-khtable tr.is-late th{color:var(--si-bad)}
@media (max-width:760px){.si-qresults a{flex-direction:column;gap:4px}.si-qsearch{flex-direction:column}}
.si-baby__latin{font-size:.5em;font-weight:500;vertical-align:middle;white-space:nowrap}
/* Arabic-script UI: no letter-spacing (breaks joining). Nastaliq (Urdu) needs taller lines. */
html[dir=rtl] .si *{letter-spacing:0!important}
html[lang=ur] body.si{line-height:2.1}
html[lang=ur] .si h1,html[lang=ur] .si h2,html[lang=ur] .si h3,html[lang=ur] .si h4{line-height:1.75}
html[lang=ur] .si-hero__title{line-height:1.55}
html[lang=ur] .si small,html[lang=ur] .si-small,html[lang=ur] .si-brand__text,html[lang=ur] .si-events__d{line-height:1.9}
html[lang=ur] .si-tabbar a{line-height:1.5;gap:0}
html[lang=ur] .si button,html[lang=ur] .si-btn,html[lang=ur] .si input,html[lang=ur] .si select{line-height:1.7}
@media (max-width:360px){.si-header__inner{gap:8px}.si-header__actions{gap:2px}.si-brand{gap:6px}.si-brand__mark{width:32px;height:32px}.si-header .si-iconbtn{width:36px;height:36px}.si-lang>button,.si-lang summary{padding-inline:8px}}
.si-nextcard__top .si-locbtn{min-width:0;max-width:100%}.si-nextcard__top .si-locbtn [data-si-loc-name]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.si-nextcard__top .si-link-sm{flex-shrink:0;white-space:nowrap}.si-nextcard{min-width:0}
.si-empty{padding-bottom:32px}.si-404links{padding-top:0}.si-404links .si-tool{flex-basis:260px}
@media (max-width:640px){.si-empty{padding-top:40px}.si-404links .si-tools{gap:10px}.si-404links .si-tool{flex-basis:140px;padding:12px;gap:10px}.si-404links .si-tool__ic{width:38px;height:38px;border-radius:12px}.si-404links .si-tool__go{display:none}}