.mushaf-shell{display:flex;flex-direction:column;min-block-size:100dvh;inline-size:min(100%,46rem);margin-inline:auto;background:var(--surface)}.mushaf-back{display:inline-block;padding:var(--sp-3) var(--sp-4) 0;color:var(--interactive-text);font-size:var(--fs-caption)}.mushaf-topbar{position:sticky;inset-block-start:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:color-mix(in srgb,var(--surface) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-block-end:1px solid var(--hairline)}.mushaf-topbar .reader-eyebrow{color:var(--text-faint);font-size:var(--fs-caption)}.mushaf-topbar h1{color:var(--interactive-text);font-family:var(--font-display);font-size:var(--fs-title)}.mushaf-topbar>p{color:var(--text-muted);font-size:var(--fs-caption);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;white-space:nowrap}.mushaf-frame{flex:1 0 auto;padding:var(--sp-4) var(--sp-3) var(--sp-6);text-align:center;touch-action:pan-y}.mushaf-page-img{display:block;inline-size:100%;block-size:auto;margin-inline:auto;border:1px solid var(--hairline);border-radius:var(--r-sm);background:#fff;-webkit-user-select:none;user-select:none}.mushaf-nav{position:sticky;inset-block-end:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:color-mix(in srgb,var(--surface) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-block-start:1px solid var(--hairline)}.mushaf-nav__count{color:var(--text-muted);font-size:var(--fs-caption);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;text-align:center}.mushaf-nav__count strong{display:block;color:var(--interactive-text);font-size:var(--fs-body)}@media (max-width:520px){.mushaf-frame{padding-inline:var(--sp-2)}.mushaf-topbar h1{font-size:var(--fs-body)}}