@font-face{font-family:UthmanicHafs;src:url(/fonts/uthmanic_hafs_v20.woff2)format("woff2"),url(/fonts/uthmanic_hafs_v20.ttf)format("truetype");font-display:block}html,body{max-width:100%;margin:0;padding:0;overflow-x:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}*{box-sizing:border-box}body{color:#ede5d2;background:#14110d;font-family:Tajawal,system-ui,sans-serif}a{color:inherit}@keyframes installSlideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.install-prompt{animation:.28s ease-out installSlideUp}@keyframes tourPop{0%{opacity:0;transform:translateY(14px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes tourFade{0%{opacity:0}to{opacity:1}}@keyframes tourPulse{0%,to{box-shadow:0 0 #c9a85e8c}70%{box-shadow:0 0 0 10px #c9a85e00}}@keyframes tourEq{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}.tour-overlay{animation:.25s ease-out tourFade}.tour-card{animation:.3s cubic-bezier(.2,.8,.25,1) tourPop}.tour-hint{animation:1.6s ease-out infinite tourPulse}.tour-eq span{animation:.9s ease-in-out infinite tourEq}@media (prefers-reduced-motion:reduce){.install-prompt,.tour-overlay,.tour-card,.tour-hint,.tour-eq span{animation:none}}@keyframes mushafSharePulse{0%,to{box-shadow:0 0 #c9a85e80}60%{box-shadow:0 0 0 12px #c9a85e00}}.mushaf-share-pulse{animation:2.4s ease-out infinite mushafSharePulse}@media (max-width:420px){.mushaf-actions-bar{gap:6px!important;padding:4px!important}.mushaf-actions-bar button{padding-left:11px!important;padding-right:11px!important;font-size:12.5px!important}}@media (prefers-reduced-motion:reduce){.mushaf-share-pulse{animation:none}}:root{--gold:var(--app-accent,#c9a85e);--gold-deep:var(--app-accent-deep,#b08a3e);--radius:16px;--tap:52px;--ease:cubic-bezier(.2, .8, .25, 1)}:where(button,a,input,select,[tabindex]):focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:10px}@media (forced-colors:active),(prefers-contrast:more){[data-colored=true]{text-underline-offset:.3em;text-decoration:underline;text-decoration-thickness:2px}[data-note=true]{text-underline-offset:.35em;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}}@keyframes sheetFade{0%{opacity:0}to{opacity:1}}@keyframes sheetUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes sheetPop{0%{opacity:0;transform:translateY(14px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.sheet-backdrop{z-index:90;-webkit-backdrop-filter:blur(3px);background:#0000008c;animation:.22s ease-out sheetFade;display:flex;position:fixed;inset:0}.sheet-panel{background:var(--ui-bg,#14110d);color:var(--ui-ink,#ede5d2);border:1px solid var(--ui-border,#b08a3e59);box-shadow:0 -12px 40px #00000080}.sheet-mobile{width:100%;max-height:88vh;animation:sheetUp .32s var(--ease);padding-bottom:env(safe-area-inset-bottom,0px);border-radius:22px 22px 0 0;margin-top:auto}.sheet-desktop{border-radius:var(--radius);width:min(560px,92vw);max-height:86vh;animation:sheetPop .24s var(--ease);margin:auto}.sheet-grip{background:var(--ui-border,#ede5d266);border-radius:3px;width:44px;height:5px;margin:10px auto 4px}.dock{left:0;right:0;bottom:calc(var(--player-h,0px) + env(safe-area-inset-bottom,0px));z-index:60;background:#14110d;border-top:1px solid #b08a3e4d;position:fixed;box-shadow:0 -8px 28px #0006}.dock:before{content:"";opacity:.5;background:linear-gradient(90deg,#0000,#c9a85e,#0000);height:2px;display:block}.dock-btn{min-width:0;height:var(--tap);color:#ede5d2;cursor:pointer;transition:transform .12s var(--ease), background .15s;background:0 0;border:none;border-radius:12px;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;gap:3px;font-family:Tajawal,system-ui,sans-serif;font-size:12px;font-weight:600;display:flex}.dock-btn:active{transform:scale(.92)}.dock-btn[data-on=true]{color:#14110d;background:linear-gradient(#c9a85e,#b08a3e)}.dock-btn[disabled]{opacity:.32;cursor:default}@keyframes paletteUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.palette-bar{animation:paletteUp .24s var(--ease)}.chip{cursor:pointer;width:26px;height:26px;transition:transform .12s var(--ease);border:2px solid #0000;border-radius:50%;flex:none;position:relative}.chip:active{transform:scale(.9)}.chip[data-on=true]{box-shadow:0 0 0 2px var(--ui-bg,#14110d), 0 0 0 4px var(--gold);transform:scale(1.14)}.medallion{cursor:pointer;background:var(--ui-panel,#1f1a14);border:1.5px solid var(--gold-deep);min-width:74px;height:44px;color:var(--gold);letter-spacing:.5px;transition:transform .12s var(--ease);border-radius:22px;justify-content:center;align-items:center;padding:0 16px;font-family:Tajawal,system-ui,sans-serif;font-size:17px;font-weight:700;display:inline-flex}.medallion:active{transform:scale(.95)}.turn-btn{height:var(--tap);cursor:pointer;color:#14110d;background:linear-gradient(var(--gold), var(--gold-deep));transition:transform .12s var(--ease);border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:0 20px;font-family:Tajawal,system-ui,sans-serif;font-size:16px;font-weight:700;display:inline-flex;box-shadow:0 6px 16px #00000059}.turn-btn:active{transform:scale(.96)}.turn-btn[disabled]{opacity:.3;cursor:default;box-shadow:none}.turn-ghost{color:var(--ui-ink,#ede5d2);border:1px solid var(--ui-border,#ede5d247);box-shadow:none;background:0 0;padding:0 14px}@keyframes suraFlash{0%{background:0 0}15%{background:color-mix(in srgb, var(--gold) 26%, transparent)}55%{background:color-mix(in srgb, var(--gold) 26%, transparent)}to{background:0 0}}.sura-flash{border-radius:8px;animation:2.2s suraFlash}@media (prefers-reduced-motion:reduce){.sura-flash{background:color-mix(in srgb, var(--gold) 18%, transparent);animation:none}}.aya-flash{--aya-flash-bg:color-mix(in srgb, var(--gold,#c9a85e) 30%, transparent);border-radius:4px;background:var(--aya-flash-bg)!important;box-shadow:0 0 0 6px var(--aya-flash-bg)!important;transition:background .45s,box-shadow .45s!important}.aya-flash.aya-flash-out{--aya-flash-bg:transparent}@media (prefers-reduced-motion:reduce){.aya-flash{transition:none!important}}.nav-round{cursor:pointer;color:#14110d;width:58px;height:58px;transition:transform .12s var(--ease);border:none;border-radius:50%;justify-content:center;align-items:center;display:inline-flex;box-shadow:0 6px 16px #00000059}.nav-round:active{transform:scale(.94)}.nav-round[disabled]{opacity:.3;cursor:default;box-shadow:none}.sheet-section{padding:4px 18px 18px}.sheet-title{color:var(--ui-ink,#ede5d2);margin:18px 0 10px;font-family:Tajawal,system-ui,sans-serif;font-size:15px;font-weight:700}.sheet-hint{color:var(--ui-muted,#9c8e76);margin-top:4px;font-size:12.5px;line-height:1.7}@media (prefers-reduced-motion:reduce){.sheet-backdrop,.sheet-mobile,.sheet-desktop,.palette-bar{animation:none}.dock-btn,.turn-btn,.chip,.medallion{transition:none}}.icon-btn{cursor:pointer;width:46px;height:46px;color:var(--ui-ink,#ede5d2);background:color-mix(in srgb, var(--gold) 8%, transparent);border:1px solid var(--ui-border,#b08a3e66);transition:transform .12s var(--ease), background .15s;border-radius:14px;flex:none;justify-content:center;align-items:center;display:inline-flex}.icon-btn:active{transform:scale(.93)}.icon-btn:hover{background:color-mix(in srgb, var(--gold) 15%, transparent)}.surah-banner{justify-content:space-between;align-items:center;gap:6px;width:100%;padding:2px 6px;font-family:Tajawal,system-ui,sans-serif;display:flex}.surah-banner .sb-side{color:var(--ui-muted,#9c8e76);white-space:nowrap;flex:none;min-width:76px;font-size:12.5px;font-weight:600}.surah-banner .sb-side.end{text-align:left}.sb-namebtn{cursor:pointer;background:0 0;border:none;border-radius:14px;flex-direction:column;flex:auto;justify-content:center;align-items:center;gap:1px;min-width:0;padding:3px 8px;transition:background .15s;display:flex}.sb-namebtn:active{background:color-mix(in srgb, var(--gold) 8%, transparent)}.sb-nameline{justify-content:center;align-items:center;gap:12px;max-width:100%;display:flex}.sb-namebtn .sb-name{color:var(--gold);white-space:nowrap;letter-spacing:.3px;font-size:16px;font-weight:700}.sb-namebtn .sb-sub{color:var(--ui-muted,#9c8e76);white-space:nowrap;font-size:10.5px;font-weight:600}.sb-namebtn .sb-rule{background:linear-gradient(90deg, transparent, var(--gold-deep));flex:0 auto;width:clamp(16px,7vw,46px);height:1px}.sb-namebtn .sb-rule.flip{background:linear-gradient(270deg, transparent, var(--gold-deep))}.sb-cmp{cursor:pointer;white-space:nowrap;height:32px;color:var(--gold);background:color-mix(in srgb, var(--gold) 12%, transparent);border:1px solid var(--ui-border,#b08a3e66);transition:transform .12s var(--ease);border-radius:16px;flex:none;align-items:center;gap:5px;padding:0 12px;font-family:Tajawal,system-ui,sans-serif;font-size:12.5px;font-weight:700;display:inline-flex}.sb-cmp:active{transform:scale(.95)}.sb-cmp[data-on=true]{background:linear-gradient(var(--gold), var(--gold-deep));color:var(--ui-bg,#14110d);border-color:#0000}.hair-rule{background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--gold) 45%, transparent), transparent);height:1px}.reading-stage{background:radial-gradient(120% 80% at 50% 12%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 60%);border-radius:20px;position:relative}.pagenav{background:color-mix(in srgb, var(--ui-ink) 4%, transparent);border:1px solid var(--ui-border,#b08a3e47);border-radius:18px;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:8px;display:flex}.pagenav-btn{cursor:pointer;height:48px;color:var(--ui-ink,#ede5d2);background:color-mix(in srgb, var(--gold) 10%, transparent);border:none;border:1px solid var(--ui-border,#b08a3e59);transition:transform .12s var(--ease), background .15s;border-radius:13px;flex:none;justify-content:center;align-items:center;gap:6px;padding:0 18px;font-family:Tajawal,system-ui,sans-serif;font-size:15px;font-weight:700;display:inline-flex}.pagenav-btn:active{transform:scale(.95)}.pagenav-btn:hover:not([disabled]){background:color-mix(in srgb, var(--gold) 18%, transparent)}.pagenav-btn[disabled]{opacity:.3;cursor:default}.pagenav-center{cursor:pointer;background:0 0;border:none;border-radius:12px;flex-direction:column;flex:auto;justify-content:center;align-items:center;gap:1px;min-width:0;padding:4px;font-family:Tajawal,system-ui,sans-serif;transition:background .15s;display:flex}.pagenav-center:active{background:color-mix(in srgb, var(--gold) 8%, transparent)}.pagenav-center .pn-page{color:var(--gold);font-size:16px;font-weight:700}.pagenav-center .pn-total{color:var(--ui-muted,#9c8e76);font-size:11.5px}.dock-btn[data-accent=true]{color:var(--gold)}.dock-btn .dock-ico{border-radius:10px;justify-content:center;align-items:center;width:30px;height:30px;display:inline-flex}.dock-btn[data-accent=true] .dock-ico{background:linear-gradient(var(--gold), var(--gold-deep));color:var(--ui-bg,#14110d);box-shadow:0 4px 12px #00000059}@media (prefers-reduced-motion:reduce){.icon-btn,.pagenav-btn,.surah-banner,.pagenav-center{transition:none}}@keyframes sheetSideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.sheet-side{width:min(420px,88vw);height:100dvh;max-height:100dvh;animation:sheetSideIn .3s var(--ease);padding-bottom:env(safe-area-inset-bottom,0px);border-radius:22px 0 0 22px;flex-direction:column;display:flex;box-shadow:-12px 0 40px #00000080}@media (prefers-reduced-motion:reduce){.sheet-side{animation:none}}.sheet-cards{padding:8px 0 20px}.sheet-card{background:color-mix(in srgb, var(--ui-ink) 4%, transparent);border:1px solid var(--ui-border,#b08a3e4d);border-radius:16px;margin:0 16px 14px;padding:14px 14px 16px}.sheet-card-title{color:var(--ui-ink,#ede5d2);align-items:center;gap:8px;margin:0 0 12px;font-family:Tajawal,system-ui,sans-serif;font-size:15.5px;font-weight:700;display:flex}.sheet-card-title .sct-ico{width:28px;height:28px;color:var(--gold);background:color-mix(in srgb, var(--gold) 14%, transparent);border-radius:9px;flex:none;justify-content:center;align-items:center;display:inline-flex}.sheet-card-hint{color:var(--ui-muted,#9c8e76);margin:0 0 12px;font-size:12.5px;line-height:1.7}.compare-divider{background:linear-gradient(var(--gold,#c9a85e), transparent, var(--gold,#c9a85e));opacity:.5;border-radius:999px;flex:none;align-self:stretch}.context-wrap{transition:opacity .25s,max-height .35s cubic-bezier(.4,0,.2,1);overflow:hidden}[data-immersive] .dock,[data-immersive] .audio-bar{transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .25s}.pagenav-row{transition:opacity .25s,max-height .3s;overflow:hidden}[data-immersive=true] .context-wrap{opacity:0;pointer-events:none;max-height:0!important}[data-immersive=true] .dock,[data-immersive=true] .audio-bar{opacity:0;pointer-events:none;transform:translateY(100%)}[data-immersive=true] .pagenav-row{opacity:0;pointer-events:none;max-height:0}[data-immersive=false] .context-wrap{max-height:120px}[data-immersive=false] .pagenav-row{max-height:100px}@media (prefers-reduced-motion:reduce){.context-wrap,[data-immersive] .dock,[data-immersive] .audio-bar,.pagenav-row{transition:none}}.mushaf-range-preview{border-radius:4px;box-shadow:inset 0 0 0 999px color-mix(in srgb, var(--range-color,#c9a227) 26%, transparent), 0 0 0 1.5px var(--range-color,#c9a227)!important}
input.recite-seek{appearance:none;cursor:pointer;background:0 0;outline:none;width:100%;height:6px}input.recite-seek:disabled{cursor:default}input.recite-seek:focus-visible{outline:2px solid var(--gold,#c9a85e);outline-offset:3px}input.recite-seek::-webkit-slider-runnable-track{background:linear-gradient(to left, #c9a85e 0%, #c9a85e var(--pct,0%), #9c8e7647 var(--pct,0%), #9c8e7647 100%);border-radius:999px;height:6px}input.recite-seek::-moz-range-track{background:#9c8e7647;border-radius:999px;height:6px}input.recite-seek::-moz-range-progress{background:#c9a85e;border-radius:999px;height:6px}input.recite-seek::-webkit-slider-thumb{appearance:none;background:#f1e7cf;border:2px solid #c9a85e;border-radius:50%;width:15px;height:15px;margin-top:-4.5px;transition:transform .12s;box-shadow:0 1px 4px #0006}input.recite-seek::-webkit-slider-thumb:active{transform:scale(1.25)}input.recite-seek::-moz-range-thumb{background:#f1e7cf;border:2px solid #c9a85e;border-radius:50%;width:15px;height:15px;box-shadow:0 1px 4px #0006}input.recite-seek:disabled::-webkit-slider-thumb{opacity:.4}input.recite-seek-edge{height:5px;display:block}input.recite-seek-edge::-webkit-slider-runnable-track{border-radius:0;height:5px}input.recite-seek-edge::-moz-range-track{border-radius:0;height:5px}input.recite-seek-edge::-moz-range-progress{border-radius:0;height:5px}input.recite-seek-edge::-webkit-slider-thumb{width:11px;height:11px;margin-top:-3px}input.recite-seek-edge::-moz-range-thumb{width:11px;height:11px}.recite-picker-overlay{z-index:90;background:#0000008c;justify-content:center;align-items:flex-end;animation:.18s recite-fade;display:flex;position:fixed;inset:0}.recite-picker-sheet{width:100%;max-width:480px;max-height:78vh;padding:18px 18px calc(18px + env(safe-area-inset-bottom));background:#1f1a14;border:1px solid #b08a3e59;border-bottom:none;border-radius:20px 20px 0 0;flex-direction:column;gap:16px;animation:.22s cubic-bezier(.2,.8,.2,1) recite-slide-up;display:flex;box-shadow:0 -12px 40px #0009}.recite-picker-header{justify-content:space-between;align-items:center;display:flex}.recite-picker-title{color:#f1e7cf;font-size:16px;font-weight:700}.recite-picker-close{color:#ede5d2;cursor:pointer;background:#14110d;border:1px solid #b08a3e66;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:15px;transition:background .15s;display:inline-flex}.recite-picker-close:hover{background:#2a2318}.recite-picker-search{color:#ede5d2;box-sizing:border-box;background:#14110d;border:1px solid #b08a3e52;border-radius:14px;outline:none;flex-shrink:0;width:100%;height:48px;padding:0 16px;font-size:15px;transition:border-color .15s}.recite-picker-search:focus-visible{outline:2px solid var(--gold,#c9a85e);outline-offset:2px}.recite-picker-search::placeholder{color:#6f6653}.recite-picker-search:focus{border-color:#c9a85e99}.recite-picker-list{flex-direction:column;gap:4px;min-height:min(50vh,320px);margin:0 -4px;padding-inline-end:4px;display:flex;overflow-y:auto}.recite-picker-list::-webkit-scrollbar{width:6px}.recite-picker-list::-webkit-scrollbar-thumb{background:#9c8e764d;border-radius:999px}.recite-picker-item{text-align:right;color:#ddd3be;cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:12px;width:100%;padding:14px 16px;font-size:15px;font-weight:500;transition:background .12s;display:flex}.recite-picker-item:hover{background:#c9a85e1a}.recite-picker-item.is-selected{color:#f1e7cf;background:#c9a85e29;font-weight:700}.recite-picker-item .item-icon{text-align:center;color:#c9a85e;flex-shrink:0;width:18px;font-size:14px}.recite-picker-empty{text-align:center;color:#9c8e76;flex:1;justify-content:center;align-items:center;padding:28px 12px;font-size:14px;display:flex}@keyframes recite-fade{0%{opacity:0}to{opacity:1}}@keyframes recite-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}