.ap-main{padding:32px 0 64px;background:var(--bg)}
.ap-wrap{max-width:760px;margin:0 auto;padding:0 16px;color:var(--cream)}
.ap-crumbs{font:500 13px var(--sans);color:var(--cream-dim);margin:0 0 20px}
.ap-crumbs a{color:var(--gold-text)}
.ap-h1{font:500 clamp(28px,5vw,40px)/1.15 var(--serif);margin:0 0 24px}
.ap-h1 small{display:block;font:500 15px var(--sans);color:var(--cream-dim);margin-top:8px}
.ap-verse{background:var(--bg-card);border:1px solid var(--line);border-radius:16px;padding:28px 24px;margin-bottom:20px}
.ap-ar{font:400 clamp(26px,5vw,36px)/2.1 "Amiri",serif;margin:0 0 20px;text-align:right}
.ap-en{font:400 19px/1.6 var(--serif);margin:0 0 12px}
.ap-src{font:400 13px var(--sans);color:var(--cream-dim);margin:0 0 16px}
.ap-audio{width:100%}
.ap-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:0 0 28px}
.ap-facts div{background:var(--bg-elevated);border-radius:12px;padding:12px 14px}
.ap-facts dt{font:500 12px var(--sans);color:var(--cream-dim);text-transform:uppercase;letter-spacing:.06em}
.ap-facts dd{margin:4px 0 0;font:500 16px var(--sans)}
.ap-facts a,.ap-rel a,.ap-pager a,.ap-ctx-ref{color:var(--emerald)}
.ap-sec{margin:0 0 32px}
.ap-sec h2{font:500 24px var(--serif);margin:0 0 12px}
.ap-note{font:400 14px var(--sans);color:var(--cream-dim);margin:0 0 12px}
.ap-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.ap-wbw{width:100%;border-collapse:collapse;font:400 15px var(--sans)}
.ap-wbw th{text-align:left;font:500 12px var(--sans);color:var(--cream-dim);padding:10px 12px;background:var(--bg-elevated)}
.ap-wbw td{padding:10px 12px;border-top:1px solid var(--line)}
.ap-wbw .w-ar{font:400 22px/1.6 "Amiri",serif;text-align:right;white-space:nowrap}
.ap-wbw .w-tl{color:var(--cream-dim);font-style:italic}
.ap-ctx{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ap-ctx li{background:var(--bg-card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:grid;gap:6px}
.ap-ctx-ref{font:500 13px var(--sans)}
.ap-ctx-ar{font:400 22px/1.9 "Amiri",serif;text-align:right}
.ap-ctx-en{font:400 15px/1.5 var(--serif)}
.ap-rel{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ap-rel li{font:500 16px var(--sans)}
.ap-rel span{display:block;font:400 14px var(--sans);color:var(--cream-dim)}
.ap-pager{display:flex;justify-content:space-between;margin:0 0 32px;font:500 15px var(--sans)}
.ap-cta{background:var(--bg-deep);border-radius:16px;padding:24px;text-align:center}
.ap-cta h2{font:500 22px var(--serif);margin:0 0 6px}
.ap-cta p{margin:0 0 16px;color:var(--cream-dim);font:400 15px var(--sans)}
.ap-btn{display:inline-block;background:var(--emerald);color:#fff;padding:12px 24px;border-radius:999px;font:500 15px var(--sans);text-decoration:none}
/* Dark: these pages (verse + Names of Allah detail) theme the whole page, shell included,
   by redefining the site tokens. The rest of the site stays light until a site-wide dark pass. */
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]){color-scheme:dark;--bg:#121b15;--bg-elevated:#223028;--bg-card:#1b261f;--bg-deep:#18221c;--cream:#f2ede2;--cream-dim:#c9c3b5;--cream-muted:#bdb8aa;--line:rgba(255,255,255,.14);--line-strong:rgba(255,255,255,.22);--emerald:#8fd0aa;--emerald-hover:#a6dcbb;--gold-text:#ebd3a0}
:root:not([data-theme="light"]) .nav{background:rgba(18,27,21,.86)}
:root:not([data-theme="light"]) .nav-cta{background:#f2ede2;color:#121b15!important}
:root:not([data-theme="light"]) .ap-btn{color:#0f1a13}
}
