@font-face{font-family:'Amiri Quran';src:url('/amiri-quran.ttf') format('truetype');font-display:swap}
@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&display=swap');
:root{color-scheme:light;--ink:#18334a;--blue:#0b4b83;--line:#d7e4ed;--gold:#b88a3d}*{box-sizing:border-box}body{margin:0;background:linear-gradient(160deg,#f6fafc,#e9f2f8);color:var(--ink);font-family:Amiri,Georgia,serif;direction:rtl;min-height:100vh}header{background:#123c61;color:white;padding:1.6rem max(1.25rem,calc((100vw - 1240px)/2));border-bottom:4px solid var(--gold)}header h1{font-size:clamp(2rem,4vw,3.2rem);margin:0;line-height:1.3}main{max-width:1240px;margin:auto;padding:1.6rem 1.25rem 4rem}.count{font-size:1.15rem;color:#31556f;margin:0 0 1.3rem}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:12px}.card{display:flex;align-items:center;justify-content:center;text-align:center;min-height:94px;padding:15px 18px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--ink);font-size:1.35rem;font-weight:700;line-height:1.5;text-decoration:none;box-shadow:0 5px 14px #1c53700e;transition:transform .15s,box-shadow .15s,border-color .15s}.card:hover,.card:focus-visible{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 9px 22px #1c537028;outline:none}.back{display:inline-block;color:var(--blue);font-size:1.15rem;margin-bottom:1.5rem}.detail{background:white;border:1px solid var(--line);border-radius:28px;min-height:260px;padding:clamp(1.4rem,5vw,4rem);box-shadow:0 12px 32px #1c537010}.detail h2{font-size:clamp(2rem,5vw,3.5rem);margin:0;color:#123c61;line-height:1.5}.detail .rule{width:75px;height:3px;background:var(--gold);margin:1.4rem 0}.empty{min-height:100px}@media(max-width:560px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.card{font-size:1.14rem;min-height:88px;padding:12px}.count{font-size:1rem}}
.countbox{display:inline-block;background:#eaf3fa;color:#123c61;border:1px solid #d0e1ee;border-radius:18px;padding:.7rem 1.3rem;margin:0 0 1.2rem;font-size:1.35rem;font-weight:700}.section-title{font-size:1.45rem;margin:1.4rem 0 .8rem}.occurrences{display:grid;gap:12px}.occurrence{border:1px solid var(--line);border-radius:15px;padding:1rem 1.2rem;background:#fafdff}.reference{color:var(--blue);font-weight:700;font-size:1.12rem;margin-bottom:.35rem;direction:rtl;text-align:right}.verse{font-family:'Amiri Quran',Amiri,serif;font-size:1.3rem;line-height:2.2;margin:.15rem 0;font-weight:400}.source-note{font-size:.95rem;color:#48667b;margin-top:2rem;line-height:1.6}@media(max-width:560px){.verse{font-size:1.15rem}}
.name-highlight{background:#cceafa;color:#123c61;border-radius:.35em;padding:.03em .08em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.secondary-highlight{background:#e9edf0;color:inherit;text-decoration:none;border-radius:.3em;padding:.02em .06em;box-decoration-break:clone;-webkit-box-decoration-break:clone}.secondary-highlight:hover,.secondary-highlight:focus-visible{background:#d9e0e5;outline:2px solid #8b9aa5;outline-offset:2px}
.highlight-legend{display:flex;gap:.65rem 1.1rem;flex-wrap:wrap;align-items:center;color:#536a7a;font-size:1rem;margin:-.35rem 0 1rem}.highlight-legend span{display:inline-flex;align-items:center;gap:.4rem}.highlight-legend span:before{content:"";width:.9rem;height:.9rem;border-radius:.25rem;background:#cceafa;border:1px solid #b8d9e9}.highlight-legend .legend-secondary:before{background:#e9edf0;border-color:#d8dfe4}
.explanation-placeholder{min-height:4.25rem;margin:.4rem 0 1.35rem;border:1px solid #dcebf4;border-radius:16px;background:#f3f9fd}
header{display:flex;align-items:center;justify-content:flex-start;min-height:112px}.site-brand{display:inline-flex;align-items:center;line-height:0;border-radius:8px}.site-brand:focus-visible{outline:2px solid #f5d57a;outline-offset:6px}.site-logo{display:block;width:clamp(180px,23vw,245px);height:auto}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:560px){header{min-height:90px;padding-top:1rem;padding-bottom:1rem}.site-logo{width:170px}}
.name-section{margin:1.4rem 0 3.2rem}.section-heading{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;border-bottom:1px solid #c6d8e6;margin:0 0 1rem;padding:0 0 .5rem}.section-heading h2{font-size:clamp(1.7rem,3vw,2.35rem);color:#123c61;line-height:1.4;margin:0}.section-description{font-size:1.12rem;color:#526c7e}.section-count{font-family:Arial,sans-serif;color:#4e6e84;border:1px solid #ccdae5;border-radius:99px;padding:.1rem .55rem;font-size:.85rem;margin-inline-start:auto}.category-break{margin:4.3rem 0 1.4rem;border-top:3px solid var(--gold);padding-top:1.4rem}.category-break h2{font-size:clamp(1.7rem,3vw,2.3rem);margin:0;color:#123c61}.category-break+.name-section{margin-top:0}@media(max-width:560px){.name-section{margin-bottom:2.4rem}.category-break{margin-top:3rem}}
.method-note{font-size:1rem;color:#526c7e;line-height:1.7;margin:-.6rem 0 2rem}.empty-result{font-size:1.15rem;line-height:1.8;color:#526c7e;background:#fafdff;border:1px solid var(--line);border-radius:15px;padding:1.1rem}.name-section{margin:1.4rem 0 3.2rem}.section-heading{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;border-bottom:1px solid #c6d8e6;margin:0 0 1rem;padding:0 0 .5rem}.section-heading h2{font-size:clamp(1.7rem,3vw,2.35rem);color:#123c61;line-height:1.4;margin:0}.section-description{font-size:1.12rem;color:#526c7e}.section-count{font-family:Arial,sans-serif;color:#4e6e84;border:1px solid #ccdae5;border-radius:99px;padding:.1rem .55rem;font-size:.85rem;margin-inline-start:auto}.category-break{margin:4.3rem 0 1.4rem;border-top:3px solid var(--gold);padding-top:1.4rem}.category-break h2{font-size:clamp(1.7rem,3vw,2.3rem);margin:0;color:#123c61}.category-break+.name-section{margin-top:0}@media(max-width:560px){.name-section{margin-bottom:2.4rem}.category-break{margin-top:3rem}}
.method-note{font-size:1rem;color:#526c7e;line-height:1.7;margin:-.6rem 0 2rem}.empty-result{font-size:1.15rem;line-height:1.8;color:#526c7e;background:#fafdff;border:1px solid var(--line);border-radius:15px;padding:1.1rem}.name-section{margin:1.4rem 0 3.2rem}.section-heading{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;border-bottom:1px solid #c6d8e6;margin:0 0 1rem;padding:0 0 .5rem}.section-heading h2{font-size:clamp(1.7rem,3vw,2.35rem);color:#123c61;line-height:1.4;margin:0}.section-description{font-size:1.12rem;color:#526c7e}.section-count{font-family:Arial,sans-serif;color:#4e6e84;border:1px solid #ccdae5;border-radius:99px;padding:.1rem .55rem;font-size:.85rem;margin-inline-start:auto}.category-break{margin:4.3rem 0 1.4rem;border-top:3px solid var(--gold);padding-top:1.4rem}.category-break h2{font-size:clamp(1.7rem,3vw,2.3rem);margin:0;color:#123c61}.category-break+.name-section{margin-top:0}@media(max-width:560px){.name-section{margin-bottom:2.4rem}.category-break{margin-top:3rem}}
.name-search{max-width:700px;margin:0 0 1.35rem}.name-search label{display:block;color:#123c61;font-size:1.2rem;font-weight:700;margin-bottom:.4rem}.name-search input{display:block;width:100%;border:1px solid #b8cddd;background:#fff;color:var(--ink);border-radius:16px;padding:.7rem 1rem;font:inherit;font-size:1.3rem;min-height:58px;outline:none}.name-search input:focus-visible{border-color:var(--blue);box-shadow:0 0 0 3px #0b4b8326}.search-status{min-height:1.5rem;margin:.3rem 0 0;color:#48667b;font-size:1rem}.search-empty{font-size:1.25rem;padding:1.4rem;border-radius:16px;background:white;border:1px solid var(--line)}[hidden]{display:none!important}

/* Homepage index and Quranic masthead */
.brand-stack{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}.brand-verse{font-family:'Amiri Quran',Amiri,serif;font-size:clamp(.92rem,1.5vw,1.14rem);line-height:1.8;color:#e9d9b3;margin:0;white-space:normal}.section-overview{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.4rem,2vw,1.5rem);max-width:810px;margin:.2rem auto 1.8rem;padding:.2rem 0 .35rem}.section-overview:before{content:"";position:absolute;top:clamp(40px,7vw,54px);right:12%;left:12%;height:3px;background:linear-gradient(90deg,#7f9fbd,#b88a3d,#7f9fbd);z-index:0}.overview-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:.45rem;text-decoration:none;color:#123c61}.overview-circle{width:clamp(82px,12vw,108px);height:clamp(82px,12vw,108px);display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 25%,#246795,#123c61 72%);color:#fff;font-size:clamp(1.12rem,2vw,1.43rem);font-weight:700;border:3px solid #e7f0f6;box-shadow:0 8px 20px #103b5e35,0 0 0 1px #9bb8ce;transition:transform .16s,box-shadow .16s}.overview-item:hover .overview-circle,.overview-item:focus-visible .overview-circle{transform:translateY(-3px);box-shadow:0 11px 24px #103b5e55,0 0 0 2px var(--gold)}.overview-item:focus-visible{outline:2px solid var(--gold);outline-offset:5px;border-radius:12px}.overview-count{font-size:1.14rem;font-weight:700;line-height:1.3}.name-section{scroll-margin-top:1rem}.grid{gap:clamp(11px,1.35vw,17px)}.card{font-family:Amiri,Georgia,serif;font-size:clamp(1.4rem,2vw,1.64rem);font-weight:700;line-height:1.55;min-height:106px;padding:17px 19px;border:1px solid #c8d9e6;border-bottom:3px solid #bd913f;border-radius:22px;background:linear-gradient(150deg,#fff 45%,#f4f9fc);box-shadow:0 8px 20px #173e5814,0 2px 4px #173e580a}.card:hover,.card:focus-visible{box-shadow:0 13px 27px #173e582b;border-color:#b88a3d}.section-heading{border-bottom:2px solid #bd913f;padding-bottom:.55rem}.section-heading h2{font-weight:700}@media(max-width:560px){.section-overview{margin-bottom:1.35rem}.section-overview:before{top:41px}.overview-count{font-size:.95rem}.card{font-size:1.22rem;min-height:94px;padding:12px 10px;border-radius:17px}.brand-verse{font-size:.85rem}}

/* Variable-width name plaques: keep each line compact and in reading order. */
.grid{--card-gap:14px;display:flex;flex-wrap:wrap;align-items:stretch;gap:var(--card-gap)}.grid .card{flex:0 0 calc((100% - 4*var(--card-gap))/5);min-height:96px;height:auto;font-family:'Amiri Quran',serif;font-size:1.4rem;font-weight:700;line-height:1.65;padding:10px 17px}.grid .card-wide{flex-basis:calc(2*(100% - 4*var(--card-gap))/5 + var(--card-gap))}.grid .card-long{flex-basis:calc(3*(100% - 4*var(--card-gap))/5 + 2*var(--card-gap))}@media(max-width:850px){.grid .card{flex-basis:calc((100% - 2*var(--card-gap))/3)}.grid .card-wide{flex-basis:calc(2*(100% - 2*var(--card-gap))/3 + var(--card-gap))}.grid .card-long{flex-basis:100%}}@media(max-width:560px){.grid{--card-gap:9px}.grid .card{flex-basis:calc((100% - var(--card-gap))/2);min-height:82px;font-size:1.15rem;line-height:1.65;padding:9px 10px}.grid .card-wide,.grid .card-long{flex-basis:100%}}
/* The seven section titles use the same locally hosted Arabic calligraphy as the names. */
.section-heading h2{font-family:'Amiri Quran',serif;font-size:clamp(2rem,3.5vw,2.75rem);font-weight:700;line-height:1.55;letter-spacing:0}
.section-heading .section-description{font-family:'Amiri Quran',serif;font-size:clamp(1.05rem,1.8vw,1.3rem);font-weight:400;color:#48677e;line-height:1.6}
@media(max-width:560px){.section-heading h2{font-size:2rem}.section-heading .section-description{font-size:1.02rem}}

/* TheSans uses the reader's licensed installation when present. */
@font-face{font-family:'TheSans Arabic Local';src:local('TheSans Arabic'),local('TheSansArabic'),local('TheSans Arabic Bold');font-weight:400 900;font-display:swap}
.section-heading h2{font-family:'TheSans Arabic Local',Cairo,'DejaVu Sans',sans-serif;font-size:clamp(1.7rem,2.7vw,2.25rem);font-weight:800;line-height:1.5}
.section-heading .section-description{font-family:'TheSans Arabic Local',Cairo,'DejaVu Sans',sans-serif;font-size:clamp(.95rem,1.35vw,1.1rem);font-weight:600}
.grid .card,.grid .card-wide,.grid .card-long{flex-grow:1;font-family:'Reem Kufi','Amiri Quran',serif;font-weight:700;line-height:1.65}
@media(max-width:560px){.section-heading h2{font-size:1.6rem}.grid .card,.grid .card-wide,.grid .card-long{font-size:1.05rem}}
/* User-supplied Arabic TheSans Bold for all section headings. */
@font-face{font-family:'Site TheSans';src:url('/TheSans-Bold.otf') format('opentype');font-style:normal;font-weight:700 900;font-display:swap}
.section-heading h2{font-family:'Site TheSans',Cairo,sans-serif;font-weight:700}
.section-heading .section-description{font-family:'Site TheSans',Cairo,sans-serif;font-weight:700}
/* Balanced rows retain source order and never stretch a plaque beyond two columns. */
.grid{display:block}.card-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px;align-items:stretch}
.grid .card,.grid .card-wide,.grid .card-long{grid-column:span var(--span,1);width:100%;min-width:0;min-height:96px;font-family:Calibri,'Site TheSans',sans-serif;font-size:1.38rem;font-weight:700;line-height:1.5;padding:12px 16px;flex:none}
@media(max-width:850px){.card-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:10px}}
@media(max-width:560px){.grid .card,.grid .card-wide,.grid .card-long{min-height:82px;font-size:1.15rem;padding:10px}}

/* User-supplied Cairo for the three overview labels and their totals. */
@font-face{font-family:'Site Cairo Bold';src:url('/Cairo-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
.brand-stack{align-items:center;width:max-content;max-width:100%}.brand-verse{text-align:center;width:100%;margin-inline:auto}.site-brand{align-self:center}
.overview-circle{width:clamp(112px,15vw,146px);height:clamp(112px,15vw,146px);padding:10px;text-align:center;font-family:'Site Cairo Bold',sans-serif;font-size:clamp(.9rem,1.5vw,1.2rem);font-weight:700;line-height:1.45}.overview-count{font-family:'Site Cairo Bold',sans-serif;font-size:1.1rem;font-weight:700}.section-overview:before{top:clamp(56px,7.5vw,73px)}
@media(max-width:560px){.overview-circle{width:clamp(90px,27vw,112px);height:clamp(90px,27vw,112px);font-size:.78rem;line-height:1.35;padding:7px}.overview-count{font-size:.81rem}.section-overview:before{top:clamp(45px,13.5vw,56px)}.brand-stack{max-width:100%}.brand-verse{font-size:.78rem}}
/* Width follows each Arabic name instead of fixed one/two-column spans. */
.card-row{display:flex;grid-template-columns:none;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;gap:14px}
.grid .card,.grid .card-wide,.grid .card-long{grid-column:auto;flex:0 0 auto;max-width:100%;min-width:0}
@media(max-width:850px){.card-row{gap:10px}}
/* Preserve one line for desktop name plaques, using the real rendered text width. */
main{max-width:1480px}
.grid .card,.grid .card-wide,.grid .card-long{white-space:nowrap}
@media(max-width:700px){.grid .card,.grid .card-wide,.grid .card-long{white-space:normal;overflow-wrap:anywhere}}
/* Homepage masthead: a deep celestial blue with restrained descending light. */
.home-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(375px,1fr) minmax(0,2.2fr) minmax(285px,1fr);align-items:center;gap:1.5rem;min-height:266px;overflow:hidden;background:radial-gradient(ellipse at 50% -32%,#3c789f 0%,#1b4d75 39%,#102f52 75%,#0b2544 100%);border-bottom:0}
.home-hero:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 10% 18%,#ffffffd9 0 1.5px,transparent 4px),radial-gradient(circle at 22% 56%,#ffffff91 0 1px,transparent 5px),radial-gradient(circle at 37% 14%,#ffffffc7 0 2px,transparent 7px),radial-gradient(circle at 52% 75%,#ffffff8c 0 1px,transparent 5px),radial-gradient(circle at 69% 26%,#ffffffbf 0 1.5px,transparent 6px),radial-gradient(circle at 83% 63%,#ffffffb0 0 1px,transparent 5px),radial-gradient(circle at 95% 18%,#ffffffba 0 1.5px,transparent 7px),linear-gradient(180deg,#ffffff13,transparent 42%);opacity:.95}
.home-hero:after{content:"";position:absolute;inset:-50px 0 0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent,#ffffff55,transparent) 15% 8%/1px 78px no-repeat,linear-gradient(180deg,transparent,#ffffff45,transparent) 31% 50%/1px 58px no-repeat,linear-gradient(180deg,transparent,#ffffff65,transparent) 61% 18%/1px 90px no-repeat,linear-gradient(180deg,transparent,#ffffff54,transparent) 77% 55%/1px 72px no-repeat,linear-gradient(180deg,transparent,#ffffff50,transparent) 91% 9%/1px 85px no-repeat;filter:drop-shadow(0 0 5px #e9f6ff);animation:hero-lightfall 18s linear infinite}
@keyframes hero-lightfall{0%{transform:translateY(-145px);opacity:0}14%{opacity:.48}70%{opacity:.65}100%{transform:translateY(250px);opacity:0}}
@keyframes hero-star-glow{0%,100%{opacity:.72;filter:brightness(.9) drop-shadow(0 0 2px #dff4ff66)}50%{opacity:1;filter:brightness(1.15) drop-shadow(0 0 6px #e8f7ffb3)}}
.home-hero .brand-stack{justify-self:start;z-index:1}.hero-title{z-index:1;max-width:780px;margin:0 auto;text-align:center;color:#f9fbff;font-family:'Site TheSans',Cairo,sans-serif;font-size:clamp(2rem,3.15vw,3.15rem);font-weight:700;line-height:1.55;text-shadow:0 2px 14px #8dd0ff6b,0 5px 26px #051c35}
@media(max-width:1180px){.home-hero{grid-template-columns:1fr;gap:1rem;padding-top:1.5rem;padding-bottom:2.2rem;min-height:256px}.home-hero .brand-stack{justify-self:start}.hero-title{max-width:780px;font-size:clamp(1.8rem,3.9vw,2.7rem)}.hero-balance{display:none}}
@media(max-width:560px){.home-hero{min-height:236px;gap:1.2rem}.hero-title{font-size:clamp(1.55rem,6.2vw,2.05rem);line-height:1.65}.home-hero .site-logo{width:262.5px;max-width:100%}}
/* Deeper night blue and a fuller field of white points and falling glints. */
.home-hero{background:radial-gradient(ellipse at 51% -28%,#255780 0%,#123d68 32%,#08284c 70%,#061b36 100%)}
.home-hero:before{background:
radial-gradient(circle,#ffffffd9 0 1px,transparent 2.5px) 17px 19px/113px 89px repeat,
radial-gradient(circle,#dff4ffad 0 1px,transparent 2.8px) 54px 36px/151px 137px repeat,
radial-gradient(circle,#ffffffa8 0 1.5px,transparent 4px) 91px 72px/229px 173px repeat,
radial-gradient(circle at 9% 35%,#fff 0 2px,#ffffff62 5px,transparent 18px),
radial-gradient(circle at 28% 12%,#fff 0 2px,#ffffff55 6px,transparent 23px),
radial-gradient(circle at 46% 67%,#fff 0 2px,#ffffff6c 6px,transparent 20px),
radial-gradient(circle at 64% 24%,#fff 0 2px,#ffffff70 6px,transparent 24px),
radial-gradient(circle at 82% 76%,#fff 0 2px,#ffffff60 6px,transparent 20px),
radial-gradient(circle at 94% 14%,#fff 0 2px,#ffffff70 6px,transparent 22px);opacity:.85;animation:hero-star-glow 8s ease-in-out infinite}
.home-hero:after{background:
linear-gradient(180deg,transparent,#e4f7ff9c,transparent) 8% 16%/1px 85px no-repeat,
linear-gradient(180deg,transparent,#ffffffa6,transparent) 18% 58%/1px 112px no-repeat,
linear-gradient(180deg,transparent,#e4f7ff9c,transparent) 34% 8%/1px 92px no-repeat,
linear-gradient(180deg,transparent,#ffffffa6,transparent) 48% 72%/1px 108px no-repeat,
linear-gradient(180deg,transparent,#e4f7ff9c,transparent) 59% 24%/1px 118px no-repeat,
linear-gradient(180deg,transparent,#ffffffa6,transparent) 73% 65%/1px 95px no-repeat,
linear-gradient(180deg,transparent,#e4f7ff9c,transparent) 86% 17%/1px 104px no-repeat,
linear-gradient(180deg,transparent,#ffffffa6,transparent) 97% 52%/1px 88px no-repeat;filter:drop-shadow(0 0 7px #d7efff)}
.hero-title{width:100%;max-width:none;white-space:nowrap;font-size:clamp(.72rem,1.25vw,1.4rem);line-height:1.6;font-weight:700}
@media(max-width:1180px){.hero-title{max-width:none;font-size:clamp(.72rem,1.65vw,1.25rem)}}
@media(max-width:560px){.hero-title{font-size:clamp(.72rem,2.5vw,.92rem)}}
/* Homepage plaques increased another 10% from the previous size. */
.card-row{gap:10px;margin-bottom:10px}
.grid .card,.grid .card-wide,.grid .card-long{min-height:68px;font-size:.987rem;line-height:1.5;padding:9px 11px;border-radius:15px;border-bottom-width:2px;box-shadow:0 5px 13px #173e5814,0 1px 3px #173e580a}
@media(max-width:850px){.card-row{gap:8px;margin-bottom:8px}}
@media(max-width:560px){.grid .card,.grid .card-wide,.grid .card-long{min-height:58px;font-size:.823rem;padding:8px;border-radius:13px}}
@media(prefers-reduced-motion:reduce){.home-hero:before,.home-hero:after{animation:none}}
/* Crisp stars with small cross-shaped rays and soft, staggered falling light. */
.home-hero:before{opacity:.32;animation:none}
.home-hero:after{display:none}
.hero-stars,.hero-streaks{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hero-star{position:absolute;left:var(--x);top:var(--y);width:calc(var(--size) * 1.5);height:calc(var(--size) * 1.5);border-radius:50%;background:#fff;box-shadow:0 0 3px 1px #fff,0 0 12px 3px #f7fdff,0 0 27px 7px #9cdeffb3;transform:translate(-50%,-50%) scale(.9);animation:star-sparkle var(--duration) ease-in-out var(--delay) infinite}
.hero-star:before,.hero-star:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.hero-star:before{width:2px;height:36px;background:linear-gradient(transparent,#fff8 31%,#fff 48%,#fff 52%,#fff8 69%,transparent)}
.hero-star:after{width:36px;height:2px;background:linear-gradient(90deg,transparent,#fff8 31%,#fff 48%,#fff 52%,#fff8 69%,transparent)}
.star-diagonals{position:absolute;inset:0;pointer-events:none}
.star-diagonals:before,.star-diagonals:after{content:"";position:absolute;left:50%;top:50%;width:1px;height:27px;background:linear-gradient(transparent,#ffffffab 39%,#fff 50%,#ffffffab 61%,transparent)}
.star-diagonals:before{transform:translate(-50%,-50%) rotate(45deg)}
.star-diagonals:after{transform:translate(-50%,-50%) rotate(-45deg)}
@keyframes star-sparkle{0%,100%{opacity:.92;transform:translate(-50%,-50%) scale(.88);filter:drop-shadow(0 0 3px #fff)}48%{opacity:1;transform:translate(-50%,-50%) scale(1.28);filter:drop-shadow(0 0 11px #fff) drop-shadow(0 0 19px #b6ebff)}}
.hero-streak{position:absolute;left:var(--x);top:-145px;width:2px;height:var(--length);border-radius:100%;background:linear-gradient(180deg,transparent,#c8efffa6 24%,#fff 60%,#c8efffc2 75%,transparent);box-shadow:0 0 8px 1px #dcf8ffc4;animation:light-descent 16s linear var(--delay) infinite}
@keyframes light-descent{0%{transform:translate(0,0) rotate(var(--tilt));opacity:0}12%{opacity:.55}40%{opacity:.85}78%{opacity:.7}100%{transform:translate(var(--drift),560px) rotate(var(--tilt));opacity:0}}
@media(prefers-reduced-motion:reduce){.hero-star,.hero-streak{animation:none}.hero-streak{display:none}.hero-star{opacity:1}}
/* Restore the original still, deep-blue backdrop behind the animated light. */
.home-hero{background:radial-gradient(ellipse at 51% -28%,#255780 0%,#123d68 32%,#08284c 70%,#061b36 100%)}
/* Smaller eight-point stars and slower, strictly vertical light trails. */
.hero-star{width:calc(var(--size) * .9);height:calc(var(--size) * .9);box-shadow:0 0 2px 1px #fff,0 0 7px 2px #f7fdff,0 0 15px 4px #9cdeffb3}
.hero-star:before{height:22px;width:1px}
.hero-star:after{width:22px;height:1px}
.star-diagonals:before,.star-diagonals:after{height:17px}
.hero-streak{animation-duration:28s}
@keyframes light-descent{0%{transform:translateY(0);opacity:0}12%{opacity:.55}40%{opacity:.85}78%{opacity:.7}100%{transform:translateY(560px);opacity:0}}
/* Blank logo placeholder beside the search field. */
.search-row{display:flex;align-items:center;gap:clamp(14px,3vw,34px);margin:0 0 1.35rem}.search-row .name-search{width:min(700px,calc(100% - 110px));margin:0;flex:0 1 700px}.search-row .groups-entry{display:block;flex:0 0 80px;width:80px;height:80px;margin-inline-start:auto;border:1px solid #b8cddd;border-radius:18px;background:#fff;box-shadow:0 5px 14px #1c537012;text-decoration:none;transition:border-color .15s,box-shadow .15s}.search-row .groups-entry:hover,.search-row .groups-entry:focus-visible{border-color:#bd913f;box-shadow:0 7px 20px #1c53702b;outline:2px solid #bd913f;outline-offset:3px}
@media(max-width:560px){.search-row{gap:12px}.search-row .name-search{width:auto;flex:1 1 0}.search-row .groups-entry{flex-basis:62px;width:62px;height:62px;border-radius:14px}.search-row .name-search label{font-size:1rem}.search-row .name-search input{min-height:54px;font-size:1rem}}
/* Ten-group index and exact linked names over the supplied visual. */
.group-page{background:#f4f8fb;min-height:100vh;color:#123c61}.group-header{min-height:92px;padding:16px clamp(20px,4vw,64px);background:#092b50;display:flex;align-items:center;justify-content:space-between;border-bottom:3px solid #bd913f}.group-home img{display:block;width:175px;height:auto}.group-back{color:#edf6ff;font-family:'Site TheSans',Cairo,sans-serif;font-weight:700;text-decoration:none;border:1px solid #9ebed6;border-radius:12px;padding:.45rem .85rem}.group-back:hover,.group-back:focus-visible{background:#24547d}.group-main{max-width:1340px;margin:0 auto;padding:clamp(20px,3vw,48px)}.group-main h1{margin:0;color:#103c63;font-family:'Site TheSans',Cairo,sans-serif;font-size:clamp(2rem,4vw,3rem);line-height:1.5}.map-title{font-family:'Site TheSans',Cairo,sans-serif;color:#164d75;font-size:clamp(1.5rem,2.6vw,2.15rem);margin:1.4rem 0 1rem}.group-index{display:flex;gap:9px;overflow-x:auto;white-space:nowrap;padding:12px 2px 18px;border-bottom:2px solid #d2e0ea;scrollbar-width:thin}.group-index a{flex:0 0 auto;padding:.56rem .85rem;border:1px solid #c7dbe7;border-radius:12px;background:#fff;color:#17476a;text-decoration:none;font-family:'Site TheSans',Cairo,sans-serif;font-size:1rem;font-weight:700}.group-index a:hover,.group-index a:focus-visible{background:#e5f2fb;border-color:#bd913f}.group-page section{scroll-margin-top:20px}
.mercy-map-scroll{overflow-x:auto;max-width:100%;border:1px solid #c6d8e7;border-radius:18px;background:radial-gradient(circle at 48% 42%,#e9f3fb,#d8e8f4 65%,#bad0e0);box-shadow:0 9px 25px #123c6112}.horizontal-tree{position:relative;width:1360px;height:1250px;direction:ltr;isolation:isolate}.tree-lines{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:visible}.tree-lines path{fill:none;stroke:#214665;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.tree-lines path.trunk{stroke-width:5}.tree-lines path.spine{stroke:#426989;stroke-width:2.5}.tree-name{position:absolute;z-index:1;left:var(--x);top:var(--y);display:flex;align-items:center;justify-content:center;width:max-content;max-width:none;min-height:51px;padding:9px 16px;border:1.5px solid #c7a465;border-radius:13px;background:linear-gradient(145deg,#183e5a,#092943);color:white;text-align:center;text-decoration:none;white-space:nowrap;direction:rtl;font-family:Amiri,serif;font-size:23px;font-weight:700;line-height:1.35;box-shadow:0 5px 12px #1239534d}.tree-name.long{font-size:20px}.tree-name.center{transform:translate(-50%,-50%);width:158px;height:158px;border:4px solid #d2ad6e;border-radius:50%;background:radial-gradient(circle at 38% 30%,#185077,#082c4b 72%);font-size:32px}.tree-name.bottom{transform:translateX(-50%)}.tree-name:hover,.tree-name:focus-visible{background:#236287;outline:2px solid #d8b872;outline-offset:2px}.tree-family{position:absolute;z-index:1;top:555px;padding:5px 9px;border-radius:8px;background:#d8e8f4e8;color:#285779;font-family:'Site TheSans',Cairo,sans-serif;font-size:18px;font-weight:700;white-space:nowrap}.family-left{left:475px}.family-right{left:814px}
.group-explanation{min-height:100px;margin:20px 0 0;border:1px solid #d4e6ee;border-radius:18px;background:#f3f9fd}.future-group{min-height:90px;border-top:1px solid #d3e2eb;margin-top:36px;padding-top:10px}.future-group h2{font-family:'Site TheSans',Cairo,sans-serif;font-size:1.5rem;color:#426982}
@media(max-width:650px){.group-header{min-height:76px}.group-home img{width:140px}.group-main{padding:18px}.group-index a{font-size:.9rem}.art-diagram{min-width:920px}.art-name{font-size:12px}.art-name.long{font-size:11px}.art-name.center{font-size:20px}.group-explanation{min-height:78px}}
/* User-provided groups mark, without the earlier white tile or frame. */
.search-row .groups-entry{display:block;flex:0 0 86px;width:86px;height:86px;border:0;border-radius:0;background:none;box-shadow:none;padding:0;overflow:visible}
.search-row .groups-entry img{display:block;width:100%;height:100%;object-fit:contain}
.search-row .groups-entry:hover,.search-row .groups-entry:focus-visible{border:0;box-shadow:none;outline:2px solid #bd913f;outline-offset:4px}
@media(max-width:560px){.search-row .groups-entry{flex-basis:66px;width:66px;height:66px}}
/* Keep the groups mark free of a square highlight after a mouse click. */
.search-row .groups-entry:hover,.search-row .groups-entry:focus,.search-row .groups-entry:focus-visible{outline:none;border:0;box-shadow:none}
.search-row .groups-entry:focus-visible img{filter:drop-shadow(0 0 4px #326b94)}
/* Restored illustrated mercy map: organic branches and horizontal clickable plaques. */
.mercy-map-scroll{background:#d9e7f4;border-color:#b5cbdc;box-shadow:0 14px 36px #123c6124}
.horizontal-tree{width:1760px;height:1180px;background:#dceaf6 url('/groups/mercy-background.png') center center/cover no-repeat}
.tree-lines path{stroke:#153e62;stroke-width:3.3;filter:drop-shadow(0 2px 1px #8299ad6b)}
.tree-lines path.trunk{stroke-width:5.2}
.tree-name{min-height:58px;padding:9px 18px;border:2px solid #d5ad6d;border-radius:15px;background:linear-gradient(145deg,#244c6c 0%,#0a2c4b 65%,#071f38 100%);font-size:25px;box-shadow:0 6px 10px #173b5870,inset 0 1px 0 #ffffff30;text-shadow:0 1px 2px #06192c}
.tree-name.long{font-size:22px}
.tree-name.center{width:178px;height:178px;font-size:39px;border-width:5px;box-shadow:0 10px 24px #092c4d72,inset 0 0 0 3px #ffffff20}
.tree-name.bottom{transform:translateX(-50%)}
.tree-family{top:548px;padding:7px 12px;border:1px solid #cda763;border-radius:12px;background:linear-gradient(145deg,#234763,#0b2c49);color:#fff;box-shadow:0 5px 10px #143a5666;font-family:Amiri,serif;font-size:23px}
.family-left{left:598px}.family-right{left:1025px}
/* The supplied mercy artwork is the map; only lettering inside its plaques is corrected. */
.group-index button{flex:0 0 auto;padding:.56rem .85rem;border:1px solid #c7dbe7;border-radius:12px;background:#fff;color:#17476a;cursor:pointer;font-family:'Site TheSans',Cairo,sans-serif;font-size:1rem;font-weight:700}
.group-index button:hover,.group-index button:focus-visible,.group-index button[aria-selected="true"]{background:#e5f2fb;border-color:#bd913f;outline:none}
.group-panel[hidden]{display:none!important}
.group-pending{min-height:240px;border:1px solid #c6d8e7;border-radius:18px;background:linear-gradient(145deg,#edf5fa,#dceaf4)}
.mercy-art-map{position:relative;width:1760px;height:1328px;background:#dceaf6 url('/groups/mercy-background.png') center/cover no-repeat;direction:ltr}
.mercy-art-map>img,.mercy-art-links{position:absolute;inset:0;width:100%;height:100%}
.mercy-art-links{z-index:1;overflow:visible}
.mercy-art-links a{cursor:pointer}
.mercy-art-links a:hover .plaque-mask,.mercy-art-links a:focus-visible .plaque-mask{fill:#27618a;stroke:#e4c988;stroke-width:3}
.plaque-mask{fill:#173c5c;stroke:none}
.plaque-text{font-family:Amiri,'Amiri Quran',serif;font-weight:700;fill:#fff;text-anchor:middle;dominant-baseline:middle;direction:rtl;paint-order:stroke;stroke:#113452;stroke-width:.45px}
.mercy-art-links a:focus-visible{outline:none}
/* Supplied mercy artwork with precise live name links, scaled to the page. */
.mercy-map{position:relative;width:100%;max-width:1320px;aspect-ratio:2048/1300;margin:0 auto;overflow:hidden;background:#f4f8fb;isolation:isolate}
.mercy-map>img{position:absolute;top:0;left:0;width:100%;height:auto;display:block;mix-blend-mode:multiply;user-select:none;pointer-events:none}
.mercy-map-links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;direction:ltr}
.mercy-node{cursor:pointer}
.mercy-node .mercy-hit{fill:transparent;stroke:transparent;stroke-width:1.5;transition:stroke .16s}
.mercy-node text{font-family:Calibri,'Site TheSans',sans-serif;font-weight:700;fill:#fff;text-anchor:middle;dominant-baseline:middle;direction:rtl;pointer-events:none;paint-order:stroke;stroke:#123858;stroke-width:.65px}
.mercy-node:hover .mercy-hit,.mercy-node:focus-visible .mercy-hit{stroke:#e7d9b780}.mercy-node:hover text,.mercy-node:focus-visible text{text-decoration:underline;text-decoration-color:#ffffffb0}
.mercy-node:focus-visible{outline:none}
.mercy-mobile-links{display:none}
@media(max-width:800px){.mercy-mobile-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}.mercy-mobile-links a{display:flex;align-items:center;justify-content:center;min-height:49px;padding:7px 10px;border:1px solid #b9d1e2;border-radius:12px;background:#123c61;color:#fff;text-align:center;text-decoration:none;font-family:Amiri,serif;font-size:1.05rem;line-height:1.35}.mercy-mobile-links a:hover,.mercy-mobile-links a:focus-visible{background:#256083;outline:2px solid #b88a3d}}
@media(max-width:440px){.mercy-mobile-links{grid-template-columns:1fr 1fr}.mercy-mobile-links a{font-size:.93rem}}

.group-explanation:has(h3){padding:14px 20px;min-height:120px}.group-explanation h3{margin:0;color:#123c61;font-family:'Site TheSans',Cairo,sans-serif;font-size:1.18rem;font-weight:700;line-height:1.6}
/* Site-wide dedication and author's signature. */
body{display:flex;flex-direction:column}
body>main{width:100%;flex:1 0 auto}
.site-footer{flex:0 0 auto;direction:rtl;overflow:hidden;background:radial-gradient(ellipse 42% 78% at 54% 24%,#1b527565,transparent 75%),linear-gradient(to bottom,#0d4165 0%,#0a304b 35%,#061d30 70%,#030e19 100%);border-top:1px solid #407189;color:#f4f9ff}
.footer-inner{direction:ltr;max-width:850px;min-height:258px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) 265px;grid-template-areas:"copy portrait";column-gap:35px;align-items:center;position:relative}
.footer-dedication{grid-area:copy;align-self:center;justify-self:end;width:max-content;max-width:100%;direction:rtl;text-align:right;font-family:'Site Cairo Bold',Cairo,sans-serif;font-size:.92rem;font-weight:700;line-height:1.7;margin:-92px 0 0;padding-bottom:6px;border-bottom:1px solid #f4f9ff;color:#eaf4ff}
.footer-signature{display:contents}
.footer-portrait{grid-area:portrait;align-self:end;width:265px;height:250px;overflow:hidden;position:relative}
.footer-portrait img{position:absolute;width:305px;height:auto;max-width:none;top:2px;left:50%;transform:translateX(-50%);display:block}
.footer-signature-text{grid-area:copy;align-self:center;justify-self:end;direction:rtl;display:flex;flex-direction:column;gap:2px;text-align:right;font-family:'Site Cairo Bold',Cairo,sans-serif;font-size:1rem;line-height:1.5;color:#ebcb88;margin-top:44px}
.footer-signature-text strong{font-size:.92rem;color:#f5f8ff}
.footer-eagle-link{display:block;align-self:flex-start;width:92px;margin-top:2px;line-height:0;border-radius:3px}
.footer-eagle-link img{display:block;width:100%;height:auto}
.footer-eagle-link:hover img{filter:brightness(1.15)}
.footer-eagle-link:focus-visible{outline:2px solid #eacb8c;outline-offset:4px}
.footer-mark{display:flex;align-items:center;gap:12px;direction:rtl;margin-top:3px}
.footer-praise{display:inline-block;white-space:nowrap;font-family:'Amiri Quran',Amiri,serif;font-size:1.08rem;font-style:italic;font-weight:400;line-height:1.5;color:#f3dfa8;text-shadow:0 1px 8px rgba(236,196,117,.27);transform:rotate(-4deg);transform-origin:right center}
.home-hero .site-logo{width:clamp(270px,34.5vw,367.5px);max-width:100%}
@media(max-width:560px){.footer-inner{min-height:180px;grid-template-columns:minmax(0,1fr) 136px;column-gap:10px;padding:0 14px}.footer-dedication{font-size:.72rem;margin-top:-73px}.footer-portrait{width:136px;height:176px}.footer-portrait img{width:195px;top:0}.footer-signature-text{font-size:.82rem;margin-top:36px}.footer-signature-text strong{font-size:.76rem}.footer-eagle-link{width:76px}}
@media(max-width:560px){.home-hero .site-logo{width:262.5px}.footer-mark{gap:5px}.footer-praise{font-size:.77rem;white-space:normal;max-width:105px;line-height:1.35}}
/* Clear editorial text, distinct from the Quranic name plaques. */
.name-search label,.count,.method-note{font-family:'Site Cairo Bold',Cairo,sans-serif;font-weight:700}
.brand-verse{font-size:clamp(1.196rem,1.95vw,1.482rem)}
.hero-copy{z-index:1;min-width:0;text-align:center}
.hero-copy .hero-title{width:100%;white-space:normal;font-size:clamp(1.45rem,2.3vw,2.4rem);line-height:1.4}
.hero-subtitle{margin:.45rem 0 0;color:#e9d9b3;font-family:'Site Cairo Bold',Cairo,sans-serif;font-size:clamp(.82rem,1.05vw,1rem);font-weight:700;line-height:1.6}
@media(max-width:560px){.brand-verse{font-size:1.014rem}.hero-copy .hero-title{font-size:clamp(1.3rem,5.3vw,1.9rem)}.hero-subtitle{font-size:.78rem}}
.count-number{display:inline-block;padding:.08em .48em;margin-inline-end:.12em;border:1px solid #d7ae55;border-radius:9px;background:linear-gradient(145deg,#fff2c6,#f5d98d);color:#173d5f;box-shadow:inset 0 1px 0 #fff9e8,0 2px 7px #b88a3d25;font-weight:700;line-height:1.4}
.group-index{border-bottom:0;padding-bottom:8px}
.group-intro{margin:0 0 1.2rem;padding:0 2px 14px;border-bottom:2px solid #d2e0ea;color:#4b6c83;font-family:'Site Cairo Bold',Cairo,sans-serif;font-size:clamp(.85rem,1.35vw,1rem);line-height:1.7}
.group-index{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;overflow:visible;white-space:normal}
.group-index button{width:100%;min-width:0;min-height:60px;white-space:normal;line-height:1.5;text-align:center}
@media(max-width:850px){.group-index{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.group-index{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.group-index button{min-height:58px;padding:.4rem .5rem;font-size:.82rem}}

.home-navigation-band{min-height:44px;background:linear-gradient(90deg,#081D35 0%,#17486D 50%,#081D35 100%);border-top:1px solid #D6B875;border-bottom:1px solid #D6B875;color:#F5F0E6;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.4rem 1.5rem;padding:0 1.25rem;font-family:'Site Cairo Bold',Cairo,sans-serif}
.home-navigation-band a{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:.35rem .5rem;color:#F5F0E6;text-decoration:none;line-height:1.5;font-size:1rem}
.home-navigation-band a::after{content:"";position:absolute;bottom:5px;left:50%;width:24px;height:2px;background:#D6B875;border-radius:2px;transform:translateX(-50%) scaleX(0);transition:transform .2s ease}
.home-navigation-band a:hover::after,.home-navigation-band a:focus-visible::after{transform:translateX(-50%) scaleX(1)}
.home-navigation-band a:focus-visible{outline:1px solid #D6B875;outline-offset:2px;border-radius:3px}
@media(prefers-reduced-motion:reduce){.home-navigation-band a::after{transition:none}}

.home-navigation-band a{gap:.5rem}
.navigation-icon{flex:0 0 auto;color:#D6B875}
.home-navigation-band a[aria-current="page"]::after{transform:translateX(-50%) scaleX(1)}
.information-content{min-height:180px}
@media(max-width:560px){.home-navigation-band{gap:0 .6rem;padding:0 .65rem}.home-navigation-band a{font-size:.85rem;gap:.35rem}.navigation-icon{width:17px;height:17px}}
.home-navigation-band{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;padding-inline:max(1.25rem,calc((100vw - 1240px)/2))}
.home-navigation-band a{justify-self:center;min-width:0}
.home-navigation-band a:first-child{justify-self:start}
.home-navigation-band a:last-child{justify-self:end}
.navigation-icon{width:24px;height:24px}
@media(max-width:560px){.home-navigation-band{padding-inline:.65rem;gap:.4rem}.home-navigation-band a{font-size:.78rem;padding:.35rem .1rem;text-align:center;line-height:1.5}.navigation-icon{width:20px;height:20px}}
/* A dedicated, locally served Ruqaa typeface for navigation. */
@font-face{font-family:'Site Aref Ruqaa';src:url('/ArefRuqaa-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
.home-navigation-band a{font-family:'Site Aref Ruqaa',serif;font-size:1.45rem;font-weight:700;line-height:1.6}
@media(max-width:560px){.home-navigation-band a{font-size:1.05rem;line-height:1.6}}

@font-face{font-family:'Site Tajawal';src:url('/Tajawal-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
.home-navigation-band a{font-family:'Site Tajawal',sans-serif;font-size:1.078125rem;font-weight:500;line-height:1.5}
@media(max-width:560px){.home-navigation-band a{font-size:.8625rem;line-height:1.5}}

/* Center the homepage identity above the encyclopedia title. */
.home-hero{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding-top:2rem;padding-bottom:2rem}
.home-hero .brand-stack{align-items:center;justify-self:center;text-align:center;max-width:100%}
.home-hero .brand-verse{text-align:center}
.home-hero .hero-copy{width:100%;max-width:900px;margin:0 auto}
.home-hero .hero-balance{display:none}
@media(max-width:560px){.home-hero{gap:.85rem;padding-top:1.5rem;padding-bottom:1.5rem}}
/* Let wrapped navigation labels determine the full band height. */
.home-navigation-band{flex:0 0 auto;height:auto;grid-auto-rows:minmax(44px,auto);align-items:stretch}
.home-navigation-band a{width:100%;max-width:100%;height:auto;min-height:44px;padding:.5rem .4rem;align-self:stretch;justify-self:stretch;white-space:normal}
.home-navigation-band a:first-child,.home-navigation-band a:last-child{justify-self:stretch}
.home-navigation-band a span{display:block;min-width:0;white-space:normal;overflow-wrap:break-word}
/* Dedication and signature have separate rows instead of overlapping offsets. */
.footer-inner{grid-template-areas:"dedication portrait" "signature portrait";grid-template-rows:auto auto;row-gap:12px;padding-top:20px}
.footer-dedication{grid-area:dedication;align-self:end;margin:0;min-width:0;width:fit-content;max-width:100%;overflow-wrap:break-word}
.footer-signature-text{grid-area:signature;align-self:start;margin:0;min-width:0;max-width:100%}
.footer-mark{flex-wrap:wrap;max-width:100%;row-gap:8px}
.footer-praise{white-space:normal;max-width:100%}
@media(max-width:560px){
 .home-navigation-band{gap:.4rem;padding-inline:.65rem}
 .home-navigation-band a{padding:.55rem .1rem;gap:.3rem}
 .footer-inner{grid-template-columns:minmax(0,1fr) 136px;row-gap:12px;column-gap:12px;padding:18px 14px 0}
 .footer-dedication{margin:0;padding-bottom:8px;line-height:1.8}
 .footer-signature-text{margin:0;padding-bottom:18px;line-height:1.7}
 .footer-mark{gap:8px}
 .footer-praise{max-width:100%;transform:none;line-height:1.7}
}

.home-navigation-band{grid-template-columns:repeat(4,minmax(0,1fr))}
.navigation-audio{position:relative;display:flex;min-width:0;align-items:stretch}
.recitation-toggle{appearance:none;border:0;background:none;color:#F5F0E6;display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-width:0;min-height:44px;padding:.5rem .4rem;font-family:'Site Tajawal',sans-serif;font-size:1.078125rem;font-weight:500;line-height:1.5;cursor:pointer;text-align:center}
.recitation-toggle span{min-width:0;overflow-wrap:break-word}
.recitation-toggle:hover .navigation-icon{color:#f1dca9}
.recitation-toggle:focus-visible{outline:1px solid #D6B875;outline-offset:-3px;border-radius:3px}
.recitation-toggle [hidden]{display:none}
.recitation-status{position:absolute;z-index:10;top:calc(100% + 8px);left:0;max-width:280px;width:max-content;padding:.5rem .8rem;border:1px solid #D6B875;border-radius:6px;background:#123C61;color:#F5F0E6;font-family:'Site Tajawal',sans-serif;font-size:.9rem;box-shadow:0 4px 12px #081d3533}
.recitation-status[hidden]{display:none}
@media(max-width:700px){.home-navigation-band{grid-template-columns:repeat(2,minmax(0,1fr))}.recitation-toggle{font-size:.8625rem;gap:.3rem;padding:.55rem .1rem}}

/* Transparent white site mark balances the portrait at the left of the footer. */
.footer-inner{max-width:1120px;grid-template-columns:240px minmax(0,1fr) 265px;grid-template-areas:"logo dedication portrait" "logo signature portrait";column-gap:28px;padding-bottom:0}
.footer-site-logo{grid-area:logo;align-self:center;justify-self:start;display:block;width:230px;max-width:100%;line-height:0}
.footer-site-logo img{display:block;width:100%;height:auto}
.footer-site-logo:focus-visible{outline:1px solid #D6B875;outline-offset:6px;border-radius:4px}
@media(max-width:700px){.footer-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"logo portrait" "dedication dedication" "signature signature";grid-template-rows:auto auto auto;column-gap:20px;row-gap:14px;padding:20px 18px}.footer-site-logo{width:136px;justify-self:start}.footer-portrait{width:136px;height:176px;justify-self:end}.footer-portrait img{width:195px;top:0}.footer-dedication,.footer-signature-text{justify-self:center;text-align:center}.footer-signature-text{align-items:center;padding-bottom:0}.footer-mark{justify-content:center}}

/* Five encyclopedia entries, with the audio action last in RTL order. */
.home-navigation-band{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:700px){.home-navigation-band{grid-template-columns:repeat(2,minmax(0,1fr))}.navigation-audio{grid-column:1 / -1}}

/* Reference arrangement: prayer on the right, linked names in cream plaques. */
.forgiveness-layout{margin:2rem 0 2.5rem;display:grid;gap:1rem}
.forgiveness-row{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px;align-items:center}
.forgiveness-prayer{margin:0;background:#f0f0ef;padding:.3rem .5rem;font-family:'Site Tajawal',sans-serif;font-size:1rem;text-align:right;line-height:1.8}
.forgiveness-prayer:empty{background:none}
.forgiveness-names{display:flex;gap:16px;align-items:stretch}
.forgiveness-name{display:flex;justify-content:center;align-items:center;flex:1 1 auto;text-align:center;border-radius:15px;background:#f9f0df;color:#242829;padding:.7rem 1rem;font-family:'Amiri Quran',serif;font-size:clamp(21px,2.1vw,31px);line-height:1.7;text-decoration:none;transition:box-shadow .15s,background .15s}
.forgiveness-name:hover{background:#f4e7ce;box-shadow:0 0 0 1px #d6b875}
.forgiveness-name:focus-visible{outline:2px solid #123c61;outline-offset:3px}
.forgiveness-row-1 .forgiveness-name:last-child,.forgiveness-row-2 .forgiveness-name:last-child,.forgiveness-row-3 .forgiveness-name:last-child{flex:3 1 60%;font-size:clamp(18px,1.7vw,26px)}
.forgiveness-row-4,.forgiveness-row-5{margin-top:2.5rem}
@media(max-width:900px){.forgiveness-row{grid-template-columns:1fr;gap:10px}.forgiveness-prayer{justify-self:start}.forgiveness-prayer:empty{display:none}.forgiveness-names{flex-wrap:wrap;gap:10px}.forgiveness-name{font-size:23px}.forgiveness-row-1 .forgiveness-name:last-child,.forgiveness-row-2 .forgiveness-name:last-child,.forgiveness-row-3 .forgiveness-name:last-child{font-size:21px}}

/* Balance the Arabic font's upper space and strengthen plaque contrast. */
.forgiveness-name{padding:0 1rem .65rem;line-height:1.5;background:#eddbb5;border:1px solid #dcc18d}
.forgiveness-name:hover{background:#e7cfa0;box-shadow:0 0 0 1px #c6a366}

/* Match the supplied Quranic prayers artwork without altering its text. */
.forgiveness-name{background:#faf1e3;border-color:#e6d6bb}
.forgiveness-name:hover{background:#f5e7d2}
.forgiveness-prayers-section{margin:2rem 0}
.forgiveness-divider{border:0;border-top:1px solid #d6b875;margin:2rem 0}
.forgiveness-prayers-section h3{text-align:center;color:#123c61;font-family:'Site Tajawal',sans-serif;font-size:1.5rem;margin:1.5rem 0}
.forgiveness-prayers-image{display:block;width:100%;height:auto;margin:0 auto}

.forgiveness-prayers-section h3{text-align:right}
.forgiveness-prayers-art{position:relative}
.prayer-name-link{position:absolute;display:block;border-radius:8px;cursor:pointer;transition:background .15s,box-shadow .15s}
.prayer-name-link:hover{background:rgba(214,184,117,.12);box-shadow:inset 0 0 0 1px rgba(18,60,97,.25)}
.prayer-name-link:focus-visible{outline:2px solid #123c61;outline-offset:2px}

.forgiveness-section-heading,.forgiveness-prayers-section h3.forgiveness-section-heading{display:block;text-align:right;background:#e7f1fa;color:#123c61;border-radius:10px;padding:.65rem 1rem;font-family:'Site Tajawal',sans-serif;font-size:1.25rem;line-height:1.8;margin:1.5rem 0}
.forgiveness-prayers-art{width:75%;margin-right:0;margin-left:auto}
@media(max-width:900px){.forgiveness-prayers-art{width:100%}}

.forgiveness-section-heading,.forgiveness-prayers-section h3.forgiveness-section-heading{background:#cce3f5;border:1px solid #9dc4df;color:#103956}
.forgiveness-explanation-text{padding:1.25rem 1.5rem;font-family:'Site Tajawal',sans-serif;font-size:1.1rem;line-height:2;color:#183b53}
.forgiveness-explanation-text p{margin:0 0 1rem}
.forgiveness-explanation-text ol{margin:.5rem 0 0;padding-inline-start:1.5rem}

.forgiveness-section-heading,.forgiveness-prayers-section h3.forgiveness-section-heading{border:0;box-shadow:none}
#group-panel-2>.group-explanation{background:#f0f1f2;border:0}
.forgiveness-section-heading,.forgiveness-prayers-section h3.forgiveness-section-heading{width:fit-content;max-width:100%;border-radius:0;padding:.8rem 1.6rem;clip-path:polygon(1% 12%,7% 8%,6% 3%,19% 6%,29% 2%,41% 5%,53% 1%,64% 5%,77% 2%,87% 7%,99% 5%,98% 17%,100% 22%,98% 35%,100% 44%,98% 55%,100% 64%,98% 74%,99% 86%,91% 90%,92% 96%,77% 93%,66% 98%,53% 94%,42% 99%,29% 94%,17% 97%,8% 92%,1% 95%,2% 81%,0 73%,2% 62%,0 51%,2% 39%,0 28%,2% 21%)}
/* One consistent type size across all 21 forgiveness name plaques. */
.forgiveness-name,
.forgiveness-row-1 .forgiveness-name:last-child,
.forgiveness-row-2 .forgiveness-name:last-child,
.forgiveness-row-3 .forgiveness-name:last-child{font-size:24px;line-height:1.5}
@media(max-width:900px){.forgiveness-name,.forgiveness-row-1 .forgiveness-name:last-child,.forgiveness-row-2 .forgiveness-name:last-child,.forgiveness-row-3 .forgiveness-name:last-child{font-size:23px}}

.group-index a{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:60px;white-space:normal;line-height:1.5;text-align:center;box-sizing:border-box}
.group-index a[aria-current="page"]{background:#e5f2fb;border-color:#bd913f}
@media(max-width:560px){.group-index a{min-height:58px;padding:.4rem .5rem;font-size:.82rem}}

/* Concise summaries from the author's books, within the existing explanation box. */
.explanation-placeholder.has-explanation{padding:1.15rem 1.4rem;color:#163b57;min-height:0;font-family:Tajawal,Calibri,Arial,sans-serif;line-height:1.95;overflow-wrap:anywhere}
.has-explanation h3{margin:0 0 .65rem;font-size:1.15rem;color:#123c61}
.has-explanation p{margin:.5rem 0;font-size:1rem}
.has-explanation p strong{font-weight:700}
.has-explanation .explanation-source{margin-top:.95rem;padding-top:.6rem;border-top:1px solid #dcebf4;font-size:.875rem;color:#526b7d;line-height:1.8}
@media(max-width:600px){.explanation-placeholder.has-explanation{padding:1rem;line-height:1.9}}

.has-explanation .explanation-example{margin:1rem 0;padding:.8rem 1rem;background:#e9f3fa;border-radius:10px}
.explanation-example figcaption{font-size:.875rem;font-weight:700;color:#325974;margin-bottom:.45rem}
.explanation-example blockquote{font-family:Amiri,serif;font-size:1.25rem;line-height:2;margin:0;overflow-wrap:anywhere}
.has-explanation .explanation-references-title{font-size:.9rem;margin:.8rem 0 .3rem;color:#526b7d}
.has-explanation .explanation-references{font-size:.875rem;line-height:1.9;margin:.25rem 0 0;padding-inline-start:1.4rem;color:#526b7d}

/* Four-part, source-grounded name explanations. */
.explanation-part{margin:0;padding:.7rem 0}.explanation-part+.explanation-part{border-top:1px solid rgba(18,60,97,.12)}
.explanation-part h4{margin:0 0 .5rem;color:#123c61;font-size:1.08rem;font-weight:700;line-height:1.7}
.explanation-part p{margin:.45rem 0}.explanation-speakers{margin:.35rem 0;padding-inline-start:1.4rem;line-height:1.9}
.explanation-speakers li{margin:.35rem 0}.explanation-speakers strong{font-weight:600}
@media(max-width:600px){.explanation-part h4{font-size:1rem}.explanation-speakers{padding-inline-start:1.1rem}}

/* A discreet route back to the atlas; original Names layouts stay independent. */
body>header{position:relative}
.atlas-brand-link{display:inline-flex;align-items:center;gap:12px;direction:rtl;max-width:100%;color:#fff;font-family:'Site TheSans',sans-serif;font-size:19px;font-weight:700;line-height:1.6;text-decoration:none;white-space:nowrap;border-radius:10px}
.atlas-brand-link .atlas-return-logo{display:block;flex:0 0 auto;width:60px;height:60px;object-fit:contain;background:transparent;border-radius:0;filter:brightness(0) invert(1)}
a.atlas-brand-link:hover{color:#f1dfb5}
a.atlas-brand-link:focus-visible{outline:2px solid #f1dfb5;outline-offset:6px}
body>header .atlas-top-return{position:absolute;top:20px;left:clamp(16px,2vw,28px);z-index:3;max-width:calc(100% - 32px);min-height:44px;gap:8px;font-size:17px;color:#fff}
body>header .atlas-top-return .atlas-return-logo{width:44px;height:44px}
body>header .atlas-top-return:hover{color:#fff}
body>header.group-header{padding-top:96px}
@media(max-width:1100px){body>header,body>header.home-hero{padding-top:96px}}
@media(max-width:560px){body>header,body>header.home-hero,body>header.group-header{padding-top:82px}.atlas-brand-link{gap:9px;font-size:16px}.atlas-brand-link .atlas-return-logo{width:48px;height:48px}body>header .atlas-top-return{top:16px;left:16px;font-size:15px;gap:7px}body>header .atlas-top-return .atlas-return-logo{width:38px;height:38px}}
/* Atlas identity sits beside the portrait, in the same footer grid. */
.site-footer .footer-inner{width:100%;max-width:1280px;min-height:270px;padding:24px 28px 0;grid-template-columns:180px minmax(0,1fr) 240px 220px;grid-template-areas:"logo dedication portrait atlas" "logo signature portrait atlas";grid-template-rows:auto auto;column-gap:24px;row-gap:12px;direction:ltr}
.site-footer .footer-inner>*{min-width:0}
.site-footer .footer-site-logo{width:180px;justify-self:center}
.site-footer .footer-portrait{width:240px;height:250px;max-width:100%;justify-self:center}
.site-footer .footer-portrait img{width:280px}
.site-footer .atlas-return{grid-area:atlas;align-self:center;justify-self:center;max-width:100%;margin:0;padding:0;text-align:center;direction:rtl}
.site-footer .atlas-brand-link{flex-direction:column;gap:10px;font-size:18px;text-align:center;white-space:normal}
.site-footer .atlas-brand-link span{display:block;max-width:100%;overflow-wrap:break-word}
.site-footer .atlas-brand-link .atlas-return-logo{width:72px;height:72px}
@media(max-width:1000px){
 .site-footer .footer-inner{max-width:680px;min-height:0;padding:28px 24px 0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"logo dedication" "logo signature" "portrait atlas";grid-template-rows:auto auto auto;column-gap:24px;row-gap:14px}
 .site-footer .footer-site-logo{width:160px;align-self:center;justify-self:center}
 .site-footer .footer-dedication{justify-self:center;align-self:end;text-align:center;margin:0;font-size:13px;line-height:1.9}
 .site-footer .footer-signature-text{justify-self:center;text-align:center;align-items:center;margin:0;padding:0;font-size:14px}
 .site-footer .footer-mark{justify-content:center}
 .site-footer .footer-portrait{width:200px;height:210px;margin-top:10px}
 .site-footer .footer-portrait img{width:245px;top:0}
 .site-footer .atlas-return{align-self:center;margin-top:10px}
}
@media(max-width:560px){
 .site-footer .footer-inner{padding:24px 16px 0;column-gap:16px;row-gap:12px}
 .site-footer .footer-site-logo{width:128px}
 .site-footer .footer-dedication{font-size:11px;line-height:1.9}
 .site-footer .footer-signature-text{font-size:12px;line-height:1.7}
 .site-footer .footer-signature-text strong{font-size:12px}
 .site-footer .footer-eagle-link{width:72px}
 .site-footer .footer-portrait{width:150px;height:184px;margin-top:8px}
 .site-footer .footer-portrait img{width:205px}
 .site-footer .atlas-brand-link{font-size:15px;line-height:1.8;gap:8px}
 .site-footer .atlas-brand-link .atlas-return-logo{width:62px;height:62px}
}

/* Names, sufficiency names and their appendices. */
.count-breakdown{display:block;margin-top:6px;color:#547184;font-family:'Site Tajawal',Tahoma,sans-serif;font-size:.82em;font-weight:500;line-height:1.7}
.names-family{margin-top:36px;padding-top:24px;border-top:2px solid #c8a66a}
.names-family-title{font-family:'Site TheSans',Tahoma,sans-serif;color:#123c61;font-size:clamp(24px,3vw,32px);line-height:1.7;margin:0 0 24px}
.names-family-title span{font-size:.7em;font-weight:400}
.names-family .name-section{margin-top:24px}
.names-family .section-heading h2{font-size:clamp(20px,2.5vw,26px)}
.names-appendices{border-color:#b5c9d7}
.entry-classification{color:#547184;font-family:'Site TheSans',Tahoma,sans-serif;font-size:16px;margin:0 0 12px}
.names-family[hidden]{display:none!important}

/* Center the visible navigation entries in equal-width tracks. */
.home-navigation-band{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-items:stretch;justify-content:center;gap:.5rem}
.home-navigation-band>a,.home-navigation-band>.navigation-audio{width:100%;min-width:0;grid-column:auto;justify-self:stretch}
.home-navigation-band>a,.home-navigation-band .recitation-toggle{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:.5rem .4rem;font-size:1.078125rem;line-height:1.5;gap:.5rem;white-space:nowrap}
.home-navigation-band>a>span,.home-navigation-band .recitation-toggle>span{white-space:nowrap;overflow-wrap:normal}
@media(max-width:900px){
 .home-navigation-band{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-auto-columns:auto;gap:0}
 .home-navigation-band>a,.home-navigation-band .recitation-toggle{min-height:44px;font-size:1rem}
}
@media(max-width:560px){
 .home-navigation-band>a,.home-navigation-band .recitation-toggle{font-size:.8625rem;gap:.35rem}
}