:root{--arabic-size:32px}main{padding:0;min-height:auto}.progress{position:fixed;top:0;left:0;width:100%;height:3px;background:#e5e7eb;z-index:200}[data-theme=dark] .progress{background:#262626}.progress-bar{height:100%;background:#956d0e;width:0%;transition:width .1s}[data-theme=dark] .progress-bar{background:#c5a55a}.nav{position:sticky;top:var(--header-h);background:rgba(254,253,251,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);margin-top:10px;padding:1rem 0;z-index:150}[data-theme=dark] .nav{background:rgba(18,18,18,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.nav-inner{display:flex;gap:1rem;align-items:center;justify-content:center;max-width:600px;margin:0 auto}.select{min-width:200px;max-width:300px;padding:.5rem 1rem;font-size:clamp(.875rem,.825rem + .25vw,1rem);border:1px solid #e5e7eb;border-radius:.375rem;background:#fff;color:#111827;font-weight:400}[data-theme=dark] .select{border-color:#262626;background:#171717;color:#e0e0e0}.select:focus{outline:0;border-color:#956d0e}[data-theme=dark] .select:focus{border-color:#c5a55a}.jump{width:120px;padding:.5rem 1rem;font-size:clamp(.875rem,.825rem + .25vw,1rem);border:1px solid #e5e7eb;border-radius:.375rem;background:#fff;color:#111827}[data-theme=dark] .jump{border-color:#262626;background:#171717;color:#e0e0e0}.jump:focus{outline:0;border-color:#956d0e}[data-theme=dark] .jump:focus{border-color:#c5a55a}.sr-header{padding:3rem 0 2rem}.sr-top{display:flex;flex-direction:column;align-items:center;margin-bottom:1.5rem;gap:1.5rem}.sr-title-wrap{text-align:center}.sr-title{font-family:'Playfair Display',serif;font-size:clamp(1.875rem,1.65rem + 1.125vw,2.25rem);color:#956d0e;margin-bottom:.5rem}[data-theme=dark] .sr-title{color:#c5a55a}.sr-meta{font-size:clamp(.875rem,.825rem + .25vw,1rem);color:#6b7280}[data-theme=dark] .sr-meta{color:#a3a3a3}.sr-meta[lang=ar]{font-size:calc(clamp(.875rem,.825rem + .25vw,1rem) * 2)}.sr-controls{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.sr-btn{min-width:48px;min-height:48px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:clamp(.875rem,.825rem + .25vw,1rem);font-weight:700;border:none;border-radius:2px;background:#262626;color:#fff;transition:.3s cubic-bezier(.16,1,.3,1);box-shadow:0 1px 3px rgba(0,0,0,.1)}[data-theme=dark] .sr-btn{background:#262626;color:#ccc}.sr-btn:hover{background:#956d0e;color:#fff;box-shadow:0 4px 12px rgba(175,134,47,.3)}[data-theme=dark] .sr-btn:hover{background:#c5a55a;color:#0a0a0a}.sr-btn.active{background:#956d0e;color:#fff;box-shadow:0 4px 12px rgba(175,134,47,.3)}[data-theme=dark] .sr-btn.active{background:#c5a55a;color:#0a0a0a}.sr-btn svg{width:20px;height:20px;fill:currentColor}@media (max-width:767px){.sr-controls{width:100%}}.verses{padding:2rem 0 0}.bismillah{border-top:1px solid #e5e7eb;text-align:center;font-family:Arabic,serif;font-size:var(--arabic-size,2rem);line-height:1.75;color:#111827;padding:2rem 0}[data-theme=dark] .bismillah{border-top-color:#262626;color:#e0e0e0}.verse{position:relative;padding:0 0 2rem;border-top:1px solid #e5e7eb;transition:border-color .2s cubic-bezier(0,0,.2,1)}[data-theme=dark] .verse{border-top-color:#262626}.verse.active{border-top-color:#956d0e}[data-theme=dark] .verse.active{border-top-color:#c5a55a}.verse.active .v-num{background:#956d0e;color:#fff}[data-theme=dark] .verse.active .v-num{background:#262626;color:#ccc}.v-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.v-num{display:inline-flex;align-items:center;justify-content:center;min-width:40px;padding:0 4px;height:40px;background:#262626;color:#fff;font-size:.875rem;font-weight:700;flex-shrink:0;transition:.2s cubic-bezier(0,0,.2,1)}.verse.bookmarked .v-num{background:#956d0e;color:#fff}.verse.last-read-marked .v-num{height:48px;clip-path:polygon(0 0,100% 0,100% 80%,50% 100%,0 80%);padding-bottom:8px;background:#956d0e;color:#fff}[data-theme=dark] .v-num{background:#262626;color:#ccc}[data-theme=dark] .verse.bookmarked .v-num,[data-theme=dark] .verse.last-read-marked .v-num{background:#c5a55a;color:#111}.v-arabic{font-family:Arabic,serif;font-size:var(--arabic-size,2rem);line-height:1.75;text-align:right;direction:rtl;color:#212121;margin-bottom:1rem}[data-theme=dark] .v-arabic{color:#ebebeb}.v-latin{color:#956d0e;font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.5;margin-bottom:.5rem}[data-theme=dark] .v-latin{color:#c5a55a}.v-trans{font-size:clamp(1rem,.95rem + .25vw,1.125rem);color:#404040;line-height:1.5;margin-bottom:1.5rem}[data-theme=dark] .v-trans{color:#a3a3a3}.v-actions{position:relative}.v-menu-btn{width:40px;height:40px;padding:0;color:#6b7280;transition:.2s cubic-bezier(0,0,.2,1);background:0 0;border:none;border-radius:.375rem;cursor:pointer;display:flex;align-items:center;justify-content:center}[data-theme=dark] .v-menu-btn{color:#a3a3a3}.v-menu-btn:hover{color:#956d0e;background:#fafafa}[data-theme=dark] .v-menu-btn:hover{background:#1a1a1a;color:#d4b455}.v-menu-btn svg{width:24px;height:24px;fill:currentColor}.v-dropdown{display:none;position:absolute;right:0;top:100%;margin-top:4px;background:#fefdfb;border:1px solid #e5e7eb;border-radius:.375rem;box-shadow:0 4px 12px rgba(0,0,0,.15);min-width:180px;z-index:100}[data-theme=dark] .v-dropdown{background:#1a1a1a;border-color:#262626;box-shadow:0 4px 12px rgba(0,0,0,.5)}.v-dropdown.active{display:block}.v-dropdown-item{display:flex;align-items:center;gap:.5rem;padding:1rem;font-size:.875rem;color:#111827;background:0 0;border:none;width:100%;text-align:left;cursor:pointer;transition:background .2s cubic-bezier(0,0,.2,1)}[data-theme=dark] .v-dropdown-item{color:#e0e0e0}.v-dropdown-item:first-child{border-radius:.375rem .375rem 0 0}.v-dropdown-item:last-child{border-radius:0 0 .375rem .375rem}.v-dropdown-item:hover{background:#fafafa}[data-theme=dark] .v-dropdown-item:hover{background:#1a1a1a}.v-dropdown-item svg{width:18px;height:18px;fill:#6b7280}[data-theme=dark] .v-dropdown-item svg{fill:#a3a3a3}.arabic-only .v-latin,.arabic-only .v-trans,.reading-mode .footer,.reading-mode .header,.reading-mode .nav,.reading-mode .sr-header{display:none}.reading-mode{background:#fefdfb}[data-theme=dark].reading-mode{background:#1a1a1a}.reading-exit{display:none;position:fixed;top:1rem;right:1rem;z-index:100;width:48px;height:48px;background:#262626;color:#fff;align-items:center;justify-content:center;transition:.2s cubic-bezier(0,0,.2,1)}[data-theme=dark] .reading-exit{background:#262626;color:#ccc}.reading-mode .reading-exit{display:flex;opacity:.3}.reading-exit:hover{background:#956d0e;color:#fff;opacity:1}[data-theme=dark] .reading-exit:hover{background:#c5a55a;color:#fff;opacity:1}.loading{text-align:center;padding:3rem;color:#6b7280}[data-theme=dark] .loading{color:#a3a3a3}.sr-nav{display:flex;gap:1.5rem;justify-content:space-between;padding:2rem 0;border-top:1px solid #e5e7eb}[data-theme=dark] .sr-nav{border-top-color:#262626}.sr-nav-btn{flex:1;padding:.5rem 1rem;font-size:clamp(.875rem,.825rem + .25vw,1rem);font-weight:400;border:1px solid #e5e7eb;border-radius:.375rem;background:#fff;color:#111827;transition:.2s cubic-bezier(0,0,.2,1);text-align:center}[data-theme=dark] .sr-nav-btn{border-color:#262626;background:#171717;color:#e0e0e0}.sr-nav-btn:hover:not(:disabled){background:#956d0e;color:#fff;border-color:#956d0e}[data-theme=dark] .sr-nav-btn:hover:not(:disabled){background:#c5a55a;color:#fff;border-color:#c5a55a}.sr-nav-btn:disabled{opacity:.5;cursor:not-allowed}@media (max-width:767px){.sr-nav{flex-direction:column}}.audio-player{position:fixed;bottom:0;left:0;right:0;background:#fefdfb;border-top:1px solid #e5e7eb;z-index:180;box-shadow:0 -2px 12px rgba(0,0,0,.1)}[data-theme=dark] .audio-player{background:#1a1a1a;border-top-color:#262626}.audio-player[hidden]{display:none}.audio-progress{height:4px;background:#e5e7eb;cursor:pointer;position:relative}[data-theme=dark] .audio-progress{background:#262626}.audio-progress-bar{height:100%;background:#956d0e;width:0%}[data-theme=dark] .audio-progress-bar{background:#c5a55a}.audio-content{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:1rem}.audio-info{min-width:0}.audio-title{font-weight:700;font-size:clamp(.875rem,.825rem + .25vw,1rem);color:#111827;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-theme=dark] .audio-title{color:#e0e0e0}.audio-subtitle{font-size:.75rem;color:#6b7280}[data-theme=dark] .audio-subtitle{color:#a3a3a3}.audio-controls{display:flex;gap:.5rem;align-items:center}.audio-right{display:flex;align-items:center;gap:1rem;justify-content:flex-end}.audio-btn{width:40px;height:40px;padding:0;display:flex;align-items:center;justify-content:center;background:0 0;border:none;color:#111827;cursor:pointer;border-radius:50%;transition:.2s cubic-bezier(0,0,.2,1)}[data-theme=dark] .audio-btn{color:#e0e0e0}.audio-btn:hover{background:#fafafa;color:#956d0e}[data-theme=dark] .audio-btn:hover{background:#1a1a1a;color:#d4b455}.audio-btn svg{width:20px;height:20px;fill:currentColor}.audio-btn-play{width:44px;height:44px;background:0 0;border:none;color:#111827}.audio-btn-play:hover{background:0 0;color:#956d0e}.audio-btn-play.playing{color:#956d0e}.audio-btn-play.playing:hover{opacity:.8}.audio-btn-play svg{width:44px;height:44px}[data-theme=dark] .audio-btn-play{color:#e0e0e0}[data-theme=dark] .audio-btn-play:hover{background:0 0;color:#d4b455}[data-theme=dark] .audio-btn-play.playing{color:#c5a55a}.audio-btn-speed{width:auto;padding:0 .5rem;font-size:.75rem;font-weight:700}.audio-btn[aria-pressed=true]{color:#956d0e}[data-theme=dark] .audio-btn[aria-pressed=true]{color:#c5a55a}.audio-time{font-size:.75rem;color:#6b7280;min-width:40px;text-align:right}[data-theme=dark] .audio-time{color:#a3a3a3}@media (max-width:767px){.audio-content{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;padding:.75rem}.audio-info{text-align:left;min-width:0}.audio-title{font-size:.75rem}.audio-subtitle{font-size:.65rem}.audio-controls{justify-content:center;gap:.25rem}.audio-right{justify-content:flex-end;gap:.5rem}.audio-btn[data-audio-repeat],.audio-time{display:none}.audio-btn{width:36px;height:36px}.audio-btn-play{width:44px;height:44px}.audio-btn svg{width:18px;height:18px}.audio-btn-play svg{width:40px;height:40px}}.sr-intro-h3{font-size:.9375rem;font-weight:700;color:#374151;margin:1rem 0 .375rem}[data-theme=dark] .sr-intro-h3{color:#d4d4d4}.sr-related-links{display:flex;flex-wrap:wrap;gap:.5rem}.sr-related-link{border:1px solid #e5e7eb}.sr-related-link:hover{border-color:#af862f}[data-theme=dark] .sr-related-link{border-color:#2e2e2e}[data-theme=dark] .sr-related-link:hover{border-color:#deb841;background:#c5a55a;color:#0a0a0a;box-shadow:0 4px 12px rgba(222,184,65,.4)}.v-content{content-visibility:auto;contain-intrinsic-size:auto 250px}.sr-intro{padding:.75rem 0}.sr-intro-details{border:none}.sr-intro-title{font-size:.875rem;font-weight:600;color:#6b7280;cursor:pointer;list-style:none;display:flex;align-items:center;gap:.375rem;user-select:none}.sr-intro-title::-webkit-details-marker{display:none}.sr-intro-title::before{content:"▸";font-size:.7rem;transition:transform .2s}.sr-intro-details[open] .sr-intro-title::before{transform:rotate(90deg)}[data-theme=dark] .sr-intro-title{color:#909090}.sr-intro-text{font-size:.9375rem;color:#6b7280;line-height:1.7;margin:.5rem 0 0}[data-theme=dark] .sr-intro-text{color:#909090}.sr-intro-h2{font-size:.9375rem;font-weight:700;color:#374151;margin:1rem 0 .375rem}[data-theme=dark] .sr-intro-h2{color:#d4d4d4}.sr-intro-list{margin:0;padding-left:1.25rem;color:#6b7280;font-size:.9375rem;line-height:1.7}[data-theme=dark] .sr-intro-list{color:#909090}.sr-intro-list li{margin-bottom:.25rem}.sr-intro-kandungan{display:flex;flex-direction:column;gap:.5rem;margin-top:.25rem}.sr-intro-k{display:flex;flex-direction:column;gap:.125rem;font-size:.9375rem;line-height:1.7;color:#6b7280}@media (min-width:768px){.sr-intro-k{flex-direction:row;gap:.5rem}}[data-theme=dark] .sr-intro-k{color:#909090}.sr-intro-ayat{flex-shrink:0;font-weight:600;color:#374151;min-width:7rem}[data-theme=dark] .sr-intro-ayat{color:#d4d4d4}.sr-intro-ref{font-size:.8125rem;color:#9ca3af;font-style:italic;margin-top:1rem}[data-theme=dark] .sr-intro-ref{color:#707070}.sr-related{padding:1.5rem 0;border-top:1px solid #e5e7eb}[data-theme=dark] .sr-related{border-top-color:#2e2e2e}.sr-related-title{font-size:.9375rem;font-weight:700;margin-bottom:.75rem;color:#374151}[data-theme=dark] .sr-related-title{color:#d4d4d4}.sr-related-links{display:flex;flex-wrap:wrap;gap:1px}.sr-related-link{display:inline-flex;align-items:center;padding:.5rem 1rem;background:#111827;font-size:.75rem;font-weight:600;color:#fff;border-radius:2px;transition:.3s cubic-bezier(.16,1,.3,1);text-transform:uppercase;letter-spacing:.5px;box-shadow:0 1px 3px rgba(0,0,0,.1)}.sr-related-link:hover{background:#956d0e;color:#fff;box-shadow:0 4px 12px rgba(138,106,37,.3);transform:translateY(-2px)}[data-theme=dark] .sr-related-link{background:#262626;color:#ccc}.sr-faq{padding:1.5rem 0;border-top:1px solid #e5e5e5}[data-theme=dark] .sr-faq{border-top-color:#2e2e2e}.sr-faq-title{font-size:.9375rem;font-weight:700;margin-bottom:.75rem;color:#212121}[data-theme=dark] .sr-faq-title{color:#d4d4d4}.sr-faq-item{border-bottom:1px solid #e5e5e5;padding:.75rem 0}[data-theme=dark] .sr-faq-item{border-bottom-color:#2e2e2e}.sr-faq-q{font-size:.9375rem;font-weight:600;color:#212121;cursor:pointer;list-style:none;display:flex;align-items:center;gap:.375rem}.sr-faq-q::-webkit-details-marker{display:none}.sr-faq-q::before{content:"▸";font-size:.7rem;transition:transform .2s;flex-shrink:0}.sr-faq-item[open] .sr-faq-q::before{transform:rotate(90deg)}[data-theme=dark] .sr-faq-q{color:#d4d4d4}.sr-faq-a{font-size:.9375rem;color:#737373;line-height:1.7;margin:.5rem 0 0;padding-left:.75rem}[data-theme=dark] .sr-faq-a{color:#a3a3a3}.sr-donate{text-align:center;padding:1.5rem 0}.sr-donate-border{border-top:1px solid #e5e7eb;padding-top:1.5rem}[data-theme=dark] .sr-donate-border{border-top-color:#2e2e2e}.sr-donate-text{font-size:1rem;color:#6b7280;line-height:1.7;margin-bottom:.75rem}[data-theme=dark] .sr-donate-text{color:#a3a3a3}.sr-donate-highlight{color:#956d0e;font-weight:600}[data-theme=dark] .sr-donate-highlight{color:#c5a55a}.sr-donate-btn{display:inline-block;padding:.5rem 1.25rem;background:#956d0e;color:#fff;border-radius:8px;font-size:.9375rem;font-weight:600;transition:background 150ms}.sr-donate-btn:hover{background:#7a5a0b}[data-theme=dark] .sr-donate-btn{background:#c5a55a;color:#0a0a0a}[data-theme=dark] .sr-donate-btn:hover{background:#b8963e}