/* styles/counter-r2b.css — v1454. THE COUNTER, ROUND 2B (owner-approved prototype docs/counter-proto/, "Round 2b").
   Draws modules/tools/counter-r2b.js: the Undo / Clear blurs row, the blurs, the hinge check, the break (settle,
   choices, Rest, the pace line, Dhikr's count, the timer over the Tasbīḥ), Meaning, People of the Qurʾān (Snippets and Read the book),
   the blind passes and the scorecard's new lines. Every value is a styles/ds.css token (the design lock); the
   Counter's own sheet (.mz-brkscrim > .sheet.mz-sheet, zero.html) is kept as it is and only lifted to the owner's
   16px floor and 44px taps where these surfaces sit. SAFE TO DELETE: with counter-r2b.js. */

/* ── the blur: a filter on the page's own word box — the line, the size and the place never move ── */
body { --mz-blur-f: blur(.3em); }

/* ── Undo count · Clear blurs (N): a row over the keys on a phone, beside the figures on a tablet ── */
.ctr-hud.has-sc { grid-template-rows:auto auto; }
.ctr-hud.has-sc > .ctr-l, .ctr-hud.has-sc > .ctr-c, .ctr-hud.has-sc > .ctr-r { grid-row:2; }
.ctr-hud .mz-sc { grid-row:1; grid-column:1 / -1; justify-self:center; display:flex; flex-wrap:wrap; justify-content:center; gap:var(--sp-2); margin-bottom:var(--sp-3); }
.ctr-hud .mz-sc-b { min-height:var(--tap); display:inline-flex; align-items:center; gap:var(--sp-2); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); cursor:pointer; white-space:nowrap;
  background:var(--mat-chrome); -webkit-backdrop-filter:var(--mat-blur); backdrop-filter:var(--mat-blur); box-shadow:var(--sh-float); color:var(--c-ink2); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); }
.ctr-hud .mz-sc-b svg { flex:none; }
.ctr-hud .mz-sc.empty { min-height:var(--tap); }
/* a tablet in one-page view keeps its page size (v1294): the two sit IN the bar's one row, either side of the keys,
   and step aside while the keys are fanned out (−1 is there then). A spread reserves its band, so it keeps the row. */
@media (min-width:744px) {
  body:not(.dual) .ctr-hud.has-sc { grid-template-rows:auto; grid-template-columns:1fr auto auto auto 1fr; column-gap:var(--sp-4); }
  body:not(.dual) .ctr-hud.has-sc > .ctr-l { grid-row:1; grid-column:1; }
  body:not(.dual) .ctr-hud.has-sc > .ctr-c { grid-row:1; grid-column:3; }
  body:not(.dual) .ctr-hud.has-sc > .ctr-r { grid-row:1; grid-column:5; }
  body:not(.dual) .ctr-hud .mz-sc { display:contents; }
  body:not(.dual) .ctr-hud .mz-sc > [data-act="undo"] { grid-row:1; grid-column:2; align-self:center; }
  body:not(.dual) .ctr-hud .mz-sc > [data-act="clearblur"] { grid-row:1; grid-column:4; align-self:center; }
  body:not(.dual) .ctr-hud:has(.ctr-fan.open) .mz-sc-b { visibility:hidden; }
}
/* the bar's own captions, lifted to the 16px floor; the count (the Adjust tap) at the 44px floor */
.ctr-hud .ctr-r[data-act] { min-height:var(--tap); }
.ctr-hud .meta, .ctr-hud .rep-k, .ctr-hud .ctr-adj { font-size:var(--fs-call); }
.ctr-hud .acts.ctr-fan .kw > button, body.theme-dark .ctr-hud .acts.ctr-fan .kw > button, .ctr-hud .acts:not(.ctr-fan) button { font-size:var(--fs-call); }

/* ── the sheets: the Counter's own, at the 16px floor ── */
.mz-brkscrim.mz-r2b { cursor:auto; -webkit-user-select:text; user-select:text; }
.mz-brkscrim.mz-r2b .sheet.mz-sheet { min-height:0; }
.mz-brkscrim.mz-bkscrim .sheet.mz-sheet { min-height:min(84vh, 1100px); }
.mz-brkscrim .sh-hd .sub2, .mz-brkscrim .sh-body { font-size:var(--fs-call); }
.mz-brkscrim.mz-r2b .sh-body { display:flex; flex-direction:column; gap:var(--sp-4); padding-left:var(--sp-4); padding-right:var(--sp-4); overflow-wrap:anywhere; }
.mz-brkscrim.mz-r2b .sh-body > * { flex:none; }
.mz-r2b .sh-act .sh-btn { min-height:var(--tap); font-size:var(--fs-head); }
.mz-r2b .mz-bk-go.sh-btn.pri, .mz-r2b .sh-act .sh-btn.pri { min-height:56px; background:var(--c-mem); color:var(--c-on-ink); border-color:var(--c-mem); box-shadow:none; }
.mz-r2b .sh-btn { min-height:var(--tap); display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2); }
.mz-r2b .mz-mn-p, .mz-r2b .mz-hg-note, .mz-r2b .mz-mn-src, .mz-r2b .mz-mn-small { margin:0; font:var(--fw-reg) var(--fs-call)/1.5 var(--ds-font); color:var(--c-ink2); }
.mz-r2b .mz-mn-src, .mz-r2b .mz-mn-small { color:var(--c-mut); }
.mz-r2b .mz-ar { font-family:var(--ds-font-quran); line-height:1.8; }

/* ── the hinge check ── */
.mz-hg-ref { text-align:center; font:var(--fw-med) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); }
.mz-hg-ar { text-align:center; font:var(--fw-reg) var(--fs-large)/1.9 var(--ds-font-quran); color:var(--c-ink); }
.mz-hg-q { text-align:center; font:var(--fw-bold) var(--fs-head)/1.35 var(--ds-font); color:var(--c-ink); }
.mz-hg-show { align-self:center; min-height:var(--tap); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--c-fill); color:var(--c-ink2); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); cursor:pointer; }
.mz-hg-ans { text-align:center; font:var(--fw-reg) var(--fs-t2)/1.8 var(--ds-font-quran); color:var(--c-ink); }
.mz-hg-asst { text-align:center; font:var(--fw-med) var(--fs-call)/1.35 var(--ds-font); color:var(--c-mem); }

/* ── the settle and Rest: a dim screen, one line ── */
.mz-settle { position:fixed; inset:0; z-index:80; display:flex; flex-direction:column; box-sizing:border-box;
  padding:calc(env(safe-area-inset-top, 0px) + var(--sp-5)) var(--sp-5) calc(env(safe-area-inset-bottom, 0px) + var(--sp-5));
  background:color-mix(in srgb, black 94%, var(--c-ink)); color:color-mix(in srgb, white 84%, transparent); font-family:var(--ds-font); }
.mz-st-in { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-3); text-align:center; }
.mz-st-line { margin:0; font:var(--fw-med) var(--fs-t1)/1.3 var(--ds-font); color:color-mix(in srgb, white 86%, transparent); }
.mz-st-sub { margin:0; max-width:32ch; font:var(--fw-reg) var(--fs-call)/1.5 var(--ds-font); color:color-mix(in srgb, white 70%, transparent); }
.mz-st-foot { display:flex; flex-direction:column; align-items:center; gap:var(--sp-3); min-height:var(--tap); }
.mz-st-skip, .mz-st-time { min-height:var(--tap); padding:0 var(--sp-5); border:0; border-radius:var(--r-cap); cursor:pointer;
  background:color-mix(in srgb, white 10%, transparent); color:color-mix(in srgb, white 76%, transparent); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); }
.mz-st-time.on { font-variant-numeric:tabular-nums; color:color-mix(in srgb, white 90%, transparent); }
.mz-st-back { width:min(100%, 420px); min-height:56px; border:0; border-radius:var(--r-cap); cursor:pointer;
  background:color-mix(in srgb, white 16%, transparent); color:color-mix(in srgb, white 92%, transparent); font:var(--fw-bold) var(--fs-head)/1 var(--ds-font); }

/* ── the choices: the time left, four cards, the pace line ── */
.mz-ch-sec { display:flex; flex-direction:column; gap:var(--sp-3); }
.mz-brk-left { align-self:flex-start; display:inline-flex; align-items:center; gap:var(--sp-2); min-height:var(--tap); padding:0 var(--sp-4) 0 var(--sp-2); border-radius:var(--r-cap);
  background:var(--c-card); box-shadow:var(--sh-float); font:var(--fw-reg) var(--fs-call)/1 var(--ds-font); color:var(--c-ink2); }
.mz-brk-left b { font:var(--fw-heavy) var(--fs-head)/1 var(--ds-font); color:var(--c-ink); font-variant-numeric:tabular-nums; }
.mz-brk-ic { width:32px; height:32px; border-radius:var(--r-cap); display:grid; place-items:center; background:var(--c-mem-soft); color:var(--c-mem); }
.mz-ch { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--sp-3); }
.mz-chb { position:relative; min-height:136px; display:grid; align-content:start; justify-items:start; gap:var(--sp-2); padding:var(--sp-4); border:0; border-radius:var(--r-ctl); cursor:pointer; text-align:left;
  background:var(--c-card); color:var(--c-ink); box-shadow:var(--sh-float); }
.mz-chb b { font:var(--fw-heavy) var(--fs-head)/1.2 var(--ds-font); }
.mz-chm { font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); }
.mz-chi { width:44px; height:44px; border-radius:var(--r-ctl); display:grid; place-items:center; background:var(--c-mem-soft); color:var(--c-mem); }
.mz-chb.on { box-shadow:0 0 0 2px var(--c-mem), var(--sh-float); }
.mz-chlast { position:absolute; top:var(--sp-3); right:var(--sp-3); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); color:var(--c-mem); }
.mz-chb-pq .mz-chi { background:color-mix(in srgb, var(--data-gilt) 14%, var(--c-card)); color:var(--data-gilt); }
body.theme-dark .mz-chb-pq .mz-chi { background:color-mix(in srgb, var(--al-acc-txt) 14%, var(--c-card)); color:var(--al-acc-txt); }
@media (max-width:389px) { .mz-chlast { position:static; } }
@media (min-width:744px) { .mz-ch { grid-template-columns:repeat(4, minmax(0, 1fr)); } .mz-chb { min-height:170px; } }
.mz-pace { display:flex; gap:var(--sp-3); align-items:flex-start; padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-mem-soft); color:var(--c-ink); }
.mz-pace-ic { flex:none; width:36px; height:36px; border-radius:var(--r-cap); display:grid; place-items:center; background:var(--c-card); color:var(--c-mem); }
.mz-pace div { display:grid; gap:var(--sp-1); min-width:0; }
.mz-pace b { font:var(--fw-bold) var(--fs-head)/1.3 var(--ds-font); }
.mz-pace span:not(.mz-pace-ic) { font:var(--fw-reg) var(--fs-call)/1.4 var(--ds-font); color:var(--c-ink2); }

/* ── Dhikr: the break's time over the site's Tasbīḥ ── */
.mz-tsbov { position:fixed; z-index:70; left:50%; transform:translateX(-50%); bottom:calc(env(safe-area-inset-bottom, 0px) + var(--sp-4) + 56px);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:var(--sp-2); width:max-content; max-width:calc(100vw - 32px); }
.mz-tsbov .mz-brk-left { align-self:center; background:var(--mat-chrome); -webkit-backdrop-filter:var(--mat-blur); backdrop-filter:var(--mat-blur); }
.mz-tsb-back { min-height:var(--tap); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); cursor:pointer; background:var(--c-ink); color:var(--c-page); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); box-shadow:var(--sh-float); }

/* ── Dhikr: a simple count inside the break (the time left, the chips, one big card to tap, the full Tasbīḥ) ── */
.mz-bkscrim .sh-body:has(> .mz-dk) { flex:1 1 auto; }
.mz-dk { display:flex; flex-direction:column; gap:var(--sp-3); touch-action:manipulation; }
.mz-brkscrim.mz-r2b .sh-body > .mz-dk { flex:1 1 auto; }
.mz-dk-chips { display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.mz-dk-chip { min-height:var(--tap); max-width:100%; padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); cursor:pointer; touch-action:manipulation;
  background:var(--c-fill); color:var(--c-ink2); font:var(--fw-med) var(--fs-call)/1.2 var(--ds-font); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mz-dk-chip.on { background:var(--c-mem); color:var(--c-on-ink); }
.mz-dk-pad { flex:1 1 auto; min-height:260px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-2); padding:var(--sp-5) var(--sp-4);
  border:0; border-radius:var(--r-grp); cursor:pointer; background:var(--c-card); color:var(--c-ink); box-shadow:var(--sh-float); text-align:center;
  touch-action:manipulation; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; }
.mz-dk-pad:focus-visible { outline:2px solid var(--c-mem); outline-offset:2px; }
.mz-dk-ar { font-size:var(--fs-t1); color:var(--c-ink); }
.mz-dk-tr { max-width:36ch; font:var(--fw-reg) var(--fs-call)/1.4 var(--ds-font); color:var(--c-ink2); }
.mz-dk-n { margin-top:var(--sp-2); font:var(--fw-light) var(--fs-hero)/1 var(--ds-font); letter-spacing:-.04em; font-variant-numeric:tabular-nums; color:var(--c-ink);
  transition:scale var(--dur-2) var(--ease-back); }
.mz-dk-n.bump { scale:1.05; transition:none; }
.mz-dk-all { font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); font-variant-numeric:tabular-nums; }
.mz-dk-full { align-self:center; min-height:var(--tap); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); cursor:pointer; background:none; color:var(--c-mem);
  font:var(--fw-med) var(--fs-call)/1 var(--ds-font); text-decoration:underline; text-underline-offset:3px; touch-action:manipulation; }
@media (max-height:760px) { .mz-dk-pad { min-height:220px; } .mz-dk-n { font-size:calc(var(--fs-hero) * .7); } }

/* ── Meaning ── */
.mz-mn-note { font:var(--fw-reg) var(--fs-call)/1.45 var(--ds-font); color:var(--c-ink2); padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-fill); }
.mz-mn-v { display:flex; align-items:center; gap:var(--sp-2); }
.mz-mn-vt { flex:1; min-width:0; text-align:center; display:grid; }
.mz-mn-vt b { font:var(--fw-bold) var(--fs-head)/1.2 var(--ds-font); }
.mz-mn-vt span { font:var(--fw-reg) var(--fs-call)/1.35 var(--ds-font); color:var(--c-mut); }
.mz-mn-v .sh-bk:disabled { opacity:.3; cursor:default; }
.mz-r2b .mz-seg { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); gap:2px; padding:3px; border-radius:var(--r-cap); background:var(--c-fill); }
.mz-r2b .mz-seg button { min-height:var(--tap); display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-1); border:0; border-radius:var(--r-cap); background:none; color:var(--c-mut); font:var(--fw-med) var(--fs-call)/1.15 var(--ds-font); cursor:pointer; padding:0 var(--sp-2); }
.mz-r2b .mz-seg button.on { background:var(--c-card); color:var(--c-ink); box-shadow:var(--sh-float); }
.mz-r2b .mz-seg button:disabled { opacity:.45; cursor:default; }
.mz-steps button i { font-style:normal; width:24px; height:24px; border-radius:var(--r-cap); display:inline-grid; place-items:center; background:color-mix(in srgb, var(--c-ink) 8%, transparent); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); flex:none; }
.mz-steps button.on i { background:var(--c-mem); color:var(--c-card); }
@media (max-width:480px) { .mz-steps button i { display:none; } }
.mz-mn-body { display:flex; flex-direction:column; gap:var(--sp-4); }
.mz-mt-ar { display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.mz-mt-a { min-height:60px; min-width:60px; display:grid; justify-items:center; align-content:center; gap:2px; padding:var(--sp-1) var(--sp-4); border:0; border-radius:var(--r-ctl); cursor:pointer;
  background:var(--c-card); color:var(--c-ink); box-shadow:var(--sh-float); font-size:var(--fs-t2); }
.mz-mt-a.on { box-shadow:0 0 0 2px var(--c-mem); }
.mz-mt-a.ok { background:var(--c-mem-soft); box-shadow:none; cursor:default; }
.mz-mt-g { font:var(--fw-med) var(--fs-call)/1.2 var(--ds-font); color:var(--c-mem); direction:ltr; }
.mz-mt-en { display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.mz-mt-e { min-height:var(--tap); padding:var(--sp-1) var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--c-fill); color:var(--c-ink); font:var(--fw-med) var(--fs-call)/1.2 var(--ds-font); cursor:pointer; text-align:center; }
.mz-mt-e.on { box-shadow:0 0 0 2px var(--c-mem); background:var(--c-card); }
.mz-mt-en.nope { outline:2px solid color-mix(in srgb, var(--c-danger) 55%, transparent); outline-offset:4px; border-radius:var(--r-ctl); }
.mz-mt-done { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--sp-3); padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-mem-soft); }
.mz-mt-done b { font:var(--fw-bold) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mem); }
.mz-wb { display:grid; grid-template-columns:repeat(auto-fill, minmax(112px, 1fr)); gap:var(--sp-2); }
.mz-wbc { display:grid; justify-items:center; align-content:start; gap:var(--sp-1); padding:var(--sp-3) var(--sp-2); border-radius:var(--r-ctl); background:var(--c-card); box-shadow:var(--sh-float); text-align:center; font-size:var(--fs-t2); }
.mz-wbm { font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-ink2); }
.mz-mn-tr { padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-fill); }
.mz-mn-tr b { font:var(--fw-bold) var(--fs-call)/1.2 var(--ds-font); color:var(--c-mut); }
.mz-mn-tr p { margin:var(--sp-1) 0 0; font:var(--fw-reg) var(--fs-body)/1.5 var(--ds-font); }
.mz-tf { font:var(--fw-reg) var(--fs-body)/1.65 var(--ds-font); color:var(--c-ink); max-width:68ch; }
.mz-tf .mz-ar { font-size:var(--fs-t3); }
.mz-tf-ar { font:var(--fw-reg) var(--fs-t2)/1.9 var(--ds-font-quran); text-align:right; max-width:none; }
.mz-save { align-self:stretch; min-height:56px; display:flex; align-items:center; justify-content:center; gap:var(--sp-2); border:1.5px dashed var(--c-hair); border-radius:var(--r-ctl);
  background:none; color:var(--c-ink2); font:var(--fw-bold) var(--fs-head)/1.2 var(--ds-font); cursor:pointer; }
.mz-save.on { border-style:solid; border-color:var(--c-mem); color:var(--c-mem); background:var(--c-mem-soft); }
.mz-lnk { align-self:flex-start; min-height:var(--tap); padding:0 var(--sp-1); border:0; background:none; color:var(--c-mem); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.mz-next { align-self:flex-start; }

/* ── the scorecard's new lines (and the 16px floor over its old captions) ── */
.mz-brkscrim .mz-sc-cap, .mz-brkscrim .mz-sc-fine, .mz-brkscrim .mz-sc-gap, .mz-brkscrim .mz-sc-row, .mz-brkscrim .mz-sc-row .k .ar { font-size:var(--fs-call); letter-spacing:0; text-transform:none; }
.mz-sc-line { font:var(--fw-reg) var(--fs-call)/1.45 var(--ds-font); color:var(--c-ink2); margin-top:var(--sp-2); }
.mz-sc-line b { font-weight:var(--fw-heavy); color:var(--c-ink); }
.mz-sc-saved { display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-top:var(--sp-2); }
.mz-sc-sv { min-height:var(--tap); display:inline-flex; align-items:center; gap:var(--sp-2); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--c-mem-soft); color:var(--c-mem); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); cursor:pointer; }

/* ── the blind passes: the bar (Cancel · Slipped · Held / Clean) ── */
.ctr-hud.mz-mcbar, body.theme-dark .ctr-hud.mz-mcbar { grid-template-columns:1fr; row-gap:var(--sp-3); justify-items:center; padding-top:var(--sp-4); background:var(--c-page); box-shadow:0 -1px 0 var(--c-hair); }
.mz-mc-t { display:grid; gap:var(--sp-1); text-align:center; max-width:560px; }
.mz-mc-t b { font:var(--fw-bold) var(--fs-head)/1.25 var(--ds-font); color:var(--c-ink); }
.mz-mc-t span { font:var(--fw-reg) var(--fs-call)/1.4 var(--ds-font); color:var(--c-ink2); }
.mz-mc-t em { font-style:normal; font-weight:var(--fw-bold); color:var(--c-mem); }
.ctr-hud.mz-mcbar .acts.mz-mc-acts { display:flex; gap:var(--sp-2); flex-wrap:wrap; justify-content:center; }
.ctr-hud.mz-mcbar .acts.mz-mc-acts button { min-height:var(--tap); font-size:var(--fs-call); }
.ctr-hud.mz-mcbar .acts .mz-mc-go { min-width:120px; min-height:56px; }

/* ── the Memorize window: the two new rows and hints at the 16px floor ── */
html body #ayah-pop .hw .cont .ctx b, html body #ayah-pop .hw .cont .ctx span, html body #ayah-pop .hw .hint.mz-blurhint, html body #ayah-pop .hw .hint.mz-flowhint { font-size:var(--fs-call); }
html #ayah-pop .hw .cont .cx { min-width:var(--tap); min-height:var(--tap); }
html #ayah-pop .hw .hint.mz-blurhint { display:flex; gap:var(--sp-2); align-items:flex-start; margin:var(--sp-2) 0; line-height:1.45; }
html #ayah-pop .hw .hint.mz-blurhint svg { flex:none; margin-top:2px; }
html #ayah-pop .hw .hint.mz-flowhint { margin:var(--sp-2) 0; line-height:1.45; }
html #ayah-pop .hw .cont.mz-mc-row .cic { background:var(--c-learn-soft); color:var(--c-learn); }
.mz-lo .tx, .mz-lo .go { font-size:var(--fs-call); }

/* ── People of the Qurʾān ── */
.pq { --pq-gold:var(--data-gilt); --pq-soft:color-mix(in srgb, var(--data-gilt) 10%, var(--c-card)); --pq-h:var(--c-mem); --pq-a:var(--c-learn); --pq-y:var(--c-lis);
  display:flex; flex-direction:column; gap:var(--sp-4); font-family:var(--ds-font); }
body.theme-dark .pq { --pq-gold:var(--al-acc-txt); --pq-soft:color-mix(in srgb, var(--al-acc-txt) 10%, var(--c-card)); }
.pq-ar { font-family:var(--ds-font-quran); direction:rtl; unicode-bidi:isolate; line-height:1.9; }
.pq-eyebrow, .pq-ig-kind { font:var(--fw-bold) var(--fs-call)/1.2 var(--ds-font); color:var(--pq-gold); }
.pq-h { margin:var(--sp-1) 0 0; font:var(--fw-heavy) var(--fs-head)/1.25 var(--ds-font); color:var(--c-ink); }
.pq-hl { min-height:var(--tap); padding:0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.pq-num { flex:none; width:36px; height:36px; border-radius:var(--r-cap); display:grid; place-items:center; background:var(--pq-soft); color:var(--pq-gold);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 35%, transparent); font:var(--fw-heavy) var(--fs-call)/1 var(--ds-font); font-variant-numeric:tabular-nums; }
.pq-num.big { width:52px; height:52px; font-size:var(--fs-t2); }
.pq-acts { display:flex; flex-wrap:wrap; gap:var(--sp-2); justify-content:space-between; }
.pq-acts .pq-go { background:var(--c-mem-soft); color:var(--c-mem); border-color:transparent; }
.pq-q { margin:0; display:grid; gap:var(--sp-2); padding:var(--sp-4); border-radius:var(--r-ctl); background:var(--c-card); box-shadow:var(--sh-float); border-inline-start:4px solid var(--pq-gold); }
.pq-q-hadith { border-inline-start-color:var(--pq-h); } .pq-q-athar { border-inline-start-color:var(--pq-a); } .pq-q-ayah { border-inline-start-color:var(--pq-y); }
.pq-qt { font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); color:var(--c-mut); }
.pq-q blockquote { margin:0; }
.pq-q .pq-ar { display:block; font-size:var(--fs-t2); text-align:right; color:var(--c-ink); }
.pq-q.big .pq-ar { font-size:var(--fs-t1); line-height:1.95; text-align:center; }
.pq-en { margin:0; font:var(--fw-reg) var(--fs-body)/1.5 var(--ds-font); color:var(--c-ink); }
.pq-q.big .pq-en { font-size:var(--fs-t3); text-align:center; }
.pq-meta { font:var(--fw-reg) var(--fs-call)/1.35 var(--ds-font); color:var(--c-mut); }
.pq-q.inl { margin-top:var(--sp-3); padding:var(--sp-3) var(--sp-4); box-shadow:0 0 0 .5px var(--c-hair); }
.pq-q.inl .pq-ar { font-size:var(--fs-t3); }
.pq-q.inl .pq-en { font-size:var(--fs-call); }
.pq-qbody { display:grid; gap:var(--sp-2); }
.pq-q.clamp .pq-qbody { max-height:15em; overflow:hidden; -webkit-mask-image:linear-gradient(180deg, black 70%, transparent); mask-image:linear-gradient(180deg, black 70%, transparent); }
.pq-q.clamp.open .pq-qbody { max-height:none; -webkit-mask-image:none; mask-image:none; }
.pq-more { justify-self:start; min-height:var(--tap); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--c-fill); color:var(--c-mem); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); cursor:pointer; }
.pq-take { display:grid; gap:var(--sp-1); padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--pq-soft); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 30%, transparent); }
.pq-take b { display:flex; align-items:center; gap:var(--sp-1); font:var(--fw-heavy) var(--fs-call)/1.2 var(--ds-font); color:var(--pq-gold); }
.pq-take p { margin:0; font:var(--fw-med) var(--fs-body)/1.45 var(--ds-font); color:var(--c-ink); }
.pq-hold { padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:color-mix(in srgb, var(--c-danger) 10%, var(--c-card)); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--c-danger) 35%, transparent);
  font:var(--fw-med) var(--fs-call)/1.45 var(--ds-font); color:var(--c-ink); }
.pq-tile-hold { font:var(--fw-med) var(--fs-call)/1.3 var(--ds-font); color:var(--c-danger); }
.pq-cover { position:relative; display:grid; gap:var(--sp-2); justify-items:center; text-align:center; padding:var(--sp-5) var(--sp-4); border-radius:var(--r-grp);
  background:radial-gradient(120% 90% at 50% 0%, var(--pq-soft), var(--c-card) 70%); box-shadow:var(--sh-float), inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 30%, transparent); }
.pq-t-ar .pq-ar { font-size:var(--fs-t1); color:var(--c-ink); }
.pq-t-ar.sm .pq-ar { font-size:var(--fs-t2); }
.pq-t-en { margin:0; font:var(--fw-heavy) var(--fs-t2)/1.25 var(--ds-font); color:var(--c-ink); }
.pq-t-en.sm { font-size:var(--fs-head); }
.pq-by { font:var(--fw-bold) var(--fs-call)/1.3 var(--ds-font); color:var(--pq-gold); }
.pq-by-ar .pq-ar { font-size:var(--fs-t3); color:var(--c-ink2); }
.pq-about { margin:var(--sp-1) 0 0; max-width:46ch; font:var(--fw-reg) var(--fs-call)/1.5 var(--ds-font); color:var(--c-ink2); }
.pq-inf { width:100%; display:grid; gap:var(--sp-3); margin-top:var(--sp-3); }
.pq-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(92px, 1fr)); gap:var(--sp-2); }
.pq-tile { display:grid; gap:2px; padding:var(--sp-3) var(--sp-2); border-radius:var(--r-ctl); background:var(--c-card); box-shadow:0 0 0 .5px var(--c-hair); }
.pq-fig { font:var(--fw-heavy) var(--fs-t1)/1.05 var(--ds-font); color:var(--c-ink); font-variant-numeric:tabular-nums; }
.pq-cap { font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); }
.pq-bar { display:flex; gap:2px; height:14px; border-radius:var(--r-icon); overflow:hidden; }
.pq-seg { min-width:6px; }
.pq-seg-hadith { background:var(--pq-h); } .pq-seg-athar { background:var(--pq-a); } .pq-seg-ayat { background:var(--pq-y); }
.pq-legend { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:var(--sp-1) var(--sp-4); font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-ink2); }
.pq-legend li { display:inline-flex; align-items:center; gap:var(--sp-1); }
.pq-legend b { color:var(--c-ink); font-variant-numeric:tabular-nums; } .pq-legend span { color:var(--c-mut); }
.pq-sw { width:12px; height:12px; border-radius:var(--r-icon); display:inline-block; }
.pq-themes { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:var(--sp-3); }
.pq-theme { display:grid; gap:var(--sp-2); align-content:start; padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-card); box-shadow:var(--sh-float); }
.pq-theme b { font:var(--fw-heavy) var(--fs-head)/1.25 var(--ds-font); }
.pq-theme p { margin:0; font:var(--fw-reg) var(--fs-call)/1.45 var(--ds-font); color:var(--c-ink2); }
.pq-chips { display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-top:2px; }
.pq-chip { min-height:var(--tap); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--pq-soft); color:var(--pq-gold); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); cursor:pointer;
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 30%, transparent); }
.pq-chip-ig { background:var(--c-mem-soft); color:var(--c-mem); box-shadow:none; }
.pq-rows { display:flex; flex-direction:column; gap:var(--sp-2); }
.pq-row { display:flex; align-items:center; gap:var(--sp-3); min-height:64px; padding:var(--sp-3) var(--sp-4); border:0; border-radius:var(--r-ctl); background:var(--c-card); color:var(--c-ink);
  box-shadow:0 0 0 .5px var(--c-hair); text-align:left; cursor:pointer; }
.pq-row > svg { flex:none; color:var(--c-mut); }
.pq-row-t { flex:1; min-width:0; display:grid; gap:2px; }
.pq-row-t b { font:var(--fw-bold) var(--fs-head)/1.25 var(--ds-font); }
.pq-row-t span { font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); }
.pq-row-t .pq-row-ar { font:var(--fw-reg) var(--fs-t3)/1.8 var(--ds-font-quran); color:var(--c-ink2); text-align:left; }
.pq-row-gal { background:var(--pq-soft); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 30%, transparent); }
.pq-gal { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:var(--sp-3); }
.pq-tile-ig { display:grid; gap:var(--sp-1); align-content:start; min-height:120px; padding:var(--sp-3) var(--sp-4); border:0; border-radius:var(--r-ctl); background:var(--c-card); color:var(--c-ink);
  box-shadow:var(--sh-float); text-align:left; cursor:pointer; border-top:4px solid var(--pq-gold); }
.pq-tile-ig b { font:var(--fw-heavy) var(--fs-head)/1.25 var(--ds-font); }
.pq-tile-lead { font:var(--fw-reg) var(--fs-call)/1.4 var(--ds-font); color:var(--c-ink2); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pq-tile-top { display:flex; align-items:center; gap:var(--sp-2); }
.pq-seen { margin-left:auto; display:inline-flex; align-items:center; gap:var(--sp-1); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); color:var(--c-mem); }
.pq-tile-ig.seen { border-top-color:color-mix(in srgb, var(--pq-gold) 45%, transparent); }
.pq-tile-n, .pq-count { font:var(--fw-med) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); }
.pq-gsec { display:flex; flex-direction:column; gap:var(--sp-2); }
.pq-about-src { padding:var(--sp-1) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-fill); font:var(--fw-reg) var(--fs-call)/1.45 var(--ds-font); color:var(--c-ink2); }
.pq-about-src summary { min-height:var(--tap); display:flex; align-items:center; gap:var(--sp-2); cursor:pointer; font:var(--fw-bold) var(--fs-call)/1.2 var(--ds-font); color:var(--c-ink); }
.pq-ch-h { display:flex; gap:var(--sp-3); align-items:center; }
.pq-ch-h > div { min-width:0; display:grid; gap:2px; }
.pq-sum { margin:0; font:var(--fw-reg) var(--fs-body)/1.55 var(--ds-font); color:var(--c-ink); white-space:pre-line; }
.pq-kp { margin:0; padding:0; list-style:none; display:grid; gap:var(--sp-2); }
.pq-kp li, .pq-dots li { position:relative; padding-left:22px; font:var(--fw-reg) var(--fs-call)/1.5 var(--ds-font); color:var(--c-ink); }
.pq-kp li::before, .pq-dots li::before { content:''; position:absolute; left:4px; top:.6em; width:8px; height:8px; border-radius:var(--r-cap); background:var(--pq-gold); }
.pq-qs { display:flex; flex-direction:column; gap:var(--sp-3); }
.pq-ig { display:flex; flex-direction:column; gap:var(--sp-4); padding:var(--sp-4); border-radius:var(--r-grp); background:var(--c-card); box-shadow:var(--sh-float); }
.pq-ig-h { display:grid; grid-template-columns:auto 1fr; column-gap:var(--sp-3); row-gap:var(--sp-2); align-items:center; }
.pq-ig-h .pq-lead { grid-column:1 / -1; }
.pq-ig-ht { display:grid; gap:2px; min-width:0; }
.pq-ig-h h3 { margin:0; font:var(--fw-heavy) var(--fs-t3)/1.25 var(--ds-font); color:var(--c-ink); }
.pq-lead { margin:0; font:var(--fw-reg) var(--fs-body)/1.45 var(--ds-font); color:var(--c-ink2); }
.pq-src { display:grid; gap:var(--sp-2); font:var(--fw-reg) var(--fs-call)/1.35 var(--ds-font); color:var(--c-mut); border-top:1px solid var(--c-hair); padding-top:var(--sp-3); }
.pq-ig b { font:var(--fw-bold) var(--fs-head)/1.3 var(--ds-font); color:var(--c-ink); }
.pq-ig li p, .pq-ig .pq-side p, .pq-ig .pq-qual p { margin:var(--sp-1) 0 0; font:var(--fw-reg) var(--fs-call)/1.45 var(--ds-font); color:var(--c-ink2); }
.pq-dots, .pq-list, .pq-steps, .pq-tl { margin:0; padding:0; list-style:none; display:grid; gap:var(--sp-3); }
.pq-list li { display:flex; gap:var(--sp-3); align-items:flex-start; padding:var(--sp-3); border-radius:var(--r-ctl); background:var(--c-fill); }
.pq-list li > div, .pq-steps li > div, .pq-tl li > div { min-width:0; flex:1; }
.pq-steps { gap:0; }
.pq-steps li { position:relative; display:flex; gap:var(--sp-3); padding-bottom:18px; }
.pq-steps li:last-child { padding-bottom:0; }
.pq-steps li:not(:last-child)::after { content:''; position:absolute; left:17px; top:38px; bottom:2px; width:2px; background:color-mix(in srgb, var(--pq-gold) 40%, transparent); }
.pq-steps .pq-num { background:var(--pq-gold); color:var(--c-card); box-shadow:none; }
.pq-tl { gap:0; border-left:2px solid color-mix(in srgb, var(--pq-gold) 40%, transparent); margin-left:var(--sp-2); }
.pq-tl li { position:relative; display:flex; padding:0 0 18px 20px; }
.pq-tl li:last-child { padding-bottom:0; }
.pq-tl-dot { position:absolute; left:-8px; top:3px; width:14px; height:14px; border-radius:var(--r-cap); background:var(--c-card); box-shadow:inset 0 0 0 3px var(--pq-gold); }
.pq-tl-t { display:block; font:var(--fw-heavy) var(--fs-call)/1.3 var(--ds-font); color:var(--pq-gold); }
.pq-stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap:var(--sp-3); }
.pq-stat { display:grid; gap:var(--sp-1); align-content:start; padding:var(--sp-4); border-radius:var(--r-ctl); background:var(--pq-soft); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 25%, transparent); }
.pq-stat .pq-fig { font-size:var(--fs-large); color:var(--pq-gold); }
.pq-stat .pq-fig.long { font-size:var(--fs-t2); line-height:1.25; }
.pq-quals { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:var(--sp-3); }
.pq-qual { display:flex; gap:var(--sp-3); align-items:flex-start; padding:var(--sp-3); border-radius:var(--r-ctl); background:var(--c-fill); }
.pq-qual-i { flex:none; width:32px; height:32px; border-radius:var(--r-cap); display:grid; place-items:center; background:var(--pq-soft); color:var(--pq-gold); }
.pq-qual > div { min-width:0; }
.pq-vs { display:grid; grid-template-columns:1fr auto 1fr; gap:var(--sp-3); align-items:stretch; }
.pq-side { padding:var(--sp-3); border-radius:var(--r-ctl); background:var(--c-fill); min-width:0; }
.pq-side-a { box-shadow:inset 4px 0 0 var(--pq-gold); } .pq-side-b { box-shadow:inset 4px 0 0 var(--c-mut); }
.pq-vs-mid { align-self:center; font:var(--fw-heavy) var(--fs-call)/1 var(--ds-font); color:var(--c-mut); }
@media (max-width:560px) { .pq-vs { grid-template-columns:1fr; } .pq-vs-mid { justify-self:center; } }
.pq-dds { margin:0; padding:0; list-style:none; display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap:var(--sp-3); }
.pq-dd { display:flex; gap:var(--sp-3); align-items:flex-start; padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); min-width:0; }
.pq-dd > div { min-width:0; flex:1; }
.pq-dd.do { background:var(--c-mem-soft); } .pq-dd.dont { background:var(--c-wor-soft); }
.pq-dd-i { flex:none; width:30px; height:30px; border-radius:var(--r-cap); display:grid; place-items:center; background:var(--c-card); }
.pq-dd.do .pq-dd-i { color:var(--c-mem); } .pq-dd.dont .pq-dd-i { color:var(--c-wor); }
.pq-k-hero-quote .pq-q.big { background:radial-gradient(120% 100% at 50% 0%, var(--pq-soft), var(--c-card) 75%); border-inline-start:0; box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 30%, transparent); }
.pq-k-hero-quote .pq-qt { text-align:center; }
.pq-acc { flex:none; width:48px; height:48px; padding:var(--sp-2); box-sizing:border-box; border-radius:var(--r-ctl); color:var(--pq-gold); background:var(--pq-soft); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 28%, transparent); }
.pq-acc.sm { width:36px; height:36px; padding:var(--sp-1); }
.pq-acc.xs { width:22px; height:22px; padding:0; background:none; box-shadow:none; }
.pq-img { margin:0; border-radius:var(--r-ctl); overflow:hidden; background:var(--pq-soft); aspect-ratio:16 / 9; }
.pq-img img { display:block; width:100%; height:100%; object-fit:cover; }
.pq-nav { display:flex; align-items:center; gap:var(--sp-3); }
.pq-nb { flex:none; width:var(--tap); height:var(--tap); border:0; border-radius:var(--r-cap); display:grid; place-items:center; background:var(--c-fill); color:var(--c-ink); cursor:pointer; }
.pq-nb:disabled { opacity:.35; cursor:default; }
.pq-pos { flex:1; min-width:0; display:grid; text-align:center; }
.pq-pos b { font:var(--fw-heavy) var(--fs-head)/1.2 var(--ds-font); font-variant-numeric:tabular-nums; }
.pq-pos span { font:var(--fw-reg) var(--fs-call)/1.3 var(--ds-font); color:var(--c-mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pq-swipe { touch-action:pan-y; }
.pq-chlink { min-height:var(--tap); display:flex; align-items:center; gap:var(--sp-2); padding:0 var(--sp-3); border:0; border-radius:var(--r-ctl); background:var(--c-fill); color:var(--c-mem); font:var(--fw-bold) var(--fs-call)/1.25 var(--ds-font); text-align:left; cursor:pointer; }
.pq-chlink span { flex:1; min-width:0; }
.pq-loc { font:var(--fw-reg) var(--fs-call)/1.35 var(--ds-font); color:var(--c-mut); }
.pq-filter { display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.pq-fchip { min-height:var(--tap); display:inline-flex; align-items:center; gap:var(--sp-1); padding:0 var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--c-fill); color:var(--c-ink2); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); cursor:pointer; }
.pq-fchip.on { background:var(--c-mem); color:var(--c-card); }
.pq-fchip.on .pq-acc.xs { color:var(--c-card); }
.pq-sels { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap:var(--sp-3); }
.pq-sel { display:flex; align-items:center; gap:var(--sp-3); font:var(--fw-bold) var(--fs-call)/1 var(--ds-font); color:var(--c-ink2); }
.pq-sel select { flex:1; min-width:0; min-height:var(--tap); padding:0 var(--sp-3); border:0; border-radius:var(--r-ctl); background:var(--c-fill); color:var(--c-ink); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); }
@media (max-width:560px) { .pq-filter { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin:0 calc(var(--sp-1) * -1); padding:0 var(--sp-1) 2px; } .pq-fchip { flex:none; } }

/* ── Read the book: the Arabic of the print, calm, three sizes ── */
.pq-note { margin:0; font:var(--fw-reg) var(--fs-call)/1.5 var(--ds-font); color:var(--c-ink2); }
.pq-note a { color:var(--c-mem); display:inline-block; min-height:var(--tap); line-height:var(--tap); }
.pq-rhead { position:sticky; top:calc(var(--sp-2) * -1); z-index:2; align-self:stretch; padding:var(--sp-2) var(--sp-3); border-radius:var(--r-ctl);
  background:var(--c-card); box-shadow:var(--sh-float);
  font:var(--fw-bold) var(--fs-call)/1.3 var(--ds-font); color:var(--c-ink); text-align:center; font-variant-numeric:tabular-nums; }
.pq-rtools { display:flex; flex-wrap:wrap; gap:var(--sp-3); align-items:center; justify-content:space-between; }
.pq-rtools .pq-fs { flex:1 1 240px; }
.pq-fnsw { min-height:var(--tap); display:inline-flex; align-items:center; gap:var(--sp-3); padding:0 var(--sp-2) 0 var(--sp-4); border:0; border-radius:var(--r-cap); background:var(--c-fill); color:var(--c-ink); font:var(--fw-med) var(--fs-call)/1 var(--ds-font); cursor:pointer; }
.pq-knob { position:relative; width:44px; height:28px; border-radius:var(--r-cap); background:color-mix(in srgb, var(--c-ink) 18%, transparent); transition:background var(--dur-2) var(--ease-out); }
.pq-knob::after { content:''; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:var(--r-cap); background:var(--c-knob); box-shadow:var(--sh-knob); transition:left var(--dur-2) var(--ease-thumb); }
.pq-fnsw[aria-checked="true"] .pq-knob { background:var(--c-mem); }
.pq-fnsw[aria-checked="true"] .pq-knob::after { left:19px; }
.pq-rtitle { margin:0; text-align:center; font:var(--fw-bold) var(--fs-t1)/1.6 var(--ds-font-quran); color:var(--c-ink); }
.pq-rsum { display:grid; gap:var(--sp-2); padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--pq-soft); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pq-gold) 25%, transparent); }
.pq-rsum b { font:var(--fw-heavy) var(--fs-call)/1.2 var(--ds-font); color:var(--pq-gold); }
.pq-rsum p { margin:0; font:var(--fw-reg) var(--fs-call)/1.55 var(--ds-font); color:var(--c-ink); }
.pq-text { display:flex; flex-direction:column; gap:var(--sp-3); font-family:var(--ds-font-quran); color:var(--c-ink); text-align:justify; }
.pq-text.fs1 { font-size:var(--fs-t2); line-height:2; }
.pq-text.fs2 { font-size:var(--fs-t1); line-height:2.05; }
.pq-text.fs3 { font-size:var(--fs-large); line-height:2.1; }
.pq-bp { margin:0; overflow-wrap:break-word; }
.pq-bp.cont { margin-top:calc(var(--sp-3) * -1); }
.pq-bp.hl { border-inline-start:4px solid var(--c-mem); padding-inline-start:var(--sp-3); }
.pq-pg { align-self:center; font:var(--fw-med) var(--fs-call)/1 var(--ds-font); color:var(--c-mut); padding:var(--sp-1) var(--sp-3); border-radius:var(--r-cap); background:var(--c-fill); }
.pq-fn { display:none; padding:var(--sp-3) var(--sp-4); border-radius:var(--r-ctl); background:var(--c-fill); font-family:var(--ds-font-ar); font-size:var(--fs-t3); line-height:1.8; color:var(--c-ink2); }
.pq-text.fn-on .pq-fn { display:block; }
.pq-fn b { display:block; margin-bottom:var(--sp-1); font:var(--fw-bold) var(--fs-call)/1.35 var(--ds-font); color:var(--c-mut); text-align:left; }
.pq-fn p { margin:0; }
.pq-fix { align-self:stretch; padding:0 var(--sp-3); border-radius:var(--r-ctl); background:color-mix(in srgb, var(--c-lis) 10%, var(--c-card)); font:var(--fw-reg) var(--fs-call)/1.5 var(--ds-font); color:var(--c-ink2); text-align:left; }
.pq-fix summary { min-height:var(--tap); display:flex; align-items:center; gap:var(--sp-2); cursor:pointer; font:var(--fw-bold) var(--fs-call)/1.2 var(--ds-font); color:var(--c-ink); }
.pq-fix p { margin:0 0 var(--sp-2); }
.pq-far { font:var(--fw-reg) var(--fs-t3)/1.8 var(--ds-font-quran); color:var(--c-ink); text-align:right; }
.pq-fsrc { color:var(--c-mut); overflow-wrap:anywhere; }

/* ── toasts ride above the Counter bar (and the blind-pass bar), whose height the bar publishes as --hud-h ── */
body.ctr-counting .ds-toast, body.mz-mc-on .ds-toast { bottom:calc(var(--hud-h, 140px) + var(--sp-3)); }

/* ── Meaning's Word by word and Tafsīr: the Hold window's own views (hold-und.js) inside the break sheet ── */
.mz-und-host { display:block; }
.mz-und-host .unav, .mz-und-host .wnav, .mz-und-host [data-wsearch], .mz-und-host [data-wmark] { display:none !important; }   /* the Counter's ‹ › drives the verse; !important beats the Hold window's :is(#ayah-pop, …) id-weight rules, which show them there */
.mz-und-host .uayah { margin-top:0; }

/* ── v1472: the Menu key in the fan (owner) ── four keys: Menu · −1 · ⋯/pause · End. The capsule grows to four, and the whole
   fan slides half a step so the centre key (the dots, then pause) stays where it was at rest: "the middle never moves". */
.ctr-hud .acts.ctr-fan:has(.k-menu) { transition:transform var(--al-d3) var(--al-eo); }
.ctr-hud .acts.ctr-fan:has(.k-menu).open { transform:translateX(calc((var(--fk) + var(--fg) * 2) / -2)); }
.ctr-hud .acts.ctr-fan:has(.k-menu).open::before { width:calc(var(--fk) * 4 + var(--fg) * 8); }
.ctr-hud .acts.ctr-fan .k-menu > button svg { width:20px; height:20px; }
@media (prefers-reduced-motion:reduce) { .ctr-hud .acts.ctr-fan:has(.k-menu) { transition:none; } }