:root{--bg:#f8f9f6;--paper:#fff;--ink:#233e35;--muted:#89918b;--line:#e6eae4;--green:#315c49;--soft:#eff3ea;--arabic-size:34px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button,a{transition:background .2s,transform .2s}button:hover{filter:brightness(.97)}button:focus-visible,a:focus-visible{outline:3px solid #afc591;outline-offset:4px}button{border:0;background:none;color:inherit}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.sidebar{position:fixed;inset:0 auto 0 0;width:240px;background:var(--paper);border-right:1px solid var(--line);padding:42px 24px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:10px;font-family:Manrope,sans-serif;font-size:32px;font-weight:800;letter-spacing:3px}.brandmark{font-size:41px;line-height:1}.branddot{margin-left:-11px;color:#9caf84}.tagline{font-size:8px;letter-spacing:3px;margin:8px 0 55px 43px}.navlabel,.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700}.navlabel{color:#a3aaa3;margin:0 14px 16px}.nav{display:flex;align-items:center;gap:15px;width:100%;padding:15px 16px;margin:5px 0;border-radius:10px;color:#7b867e;text-align:left;font-weight:500}.nav>span{font-size:23px;width:22px}.nav.active{background:var(--soft);color:var(--green)}.nav small{margin-left:auto;font-size:10px;padding:3px 6px;border-radius:5px;background:var(--paper)}.sidequote{margin-top:55px;padding:20px 12px;color:#82907f}.sidequote>span{font-size:32px}.sidequote p{font-family:Georgia,serif;font-size:16px;line-height:1.7;font-style:italic}.sidequote small{font-size:10px}.sidebottom{margin-top:auto;display:grid;gap:12px;color:#8b948c}.sidebottom button{text-align:left;padding:5px 12px}.sidebottom span{margin-left:10px}.sidebottom small{font-size:9px;margin:20px 12px 0}.shell{margin-left:240px}header{height:85px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 46px;font-size:12px;background:var(--paper)}.muted{color:#9aa29b;margin-left:12px}.headerRight{display:flex;align-items:center;gap:25px}.online{font-size:11px;color:#87907e}.online i{display:inline-block;width:6px;height:6px;background:#98b784;border-radius:50%;margin-right:6px}.avatar{border:1px solid #dbe2d3;border-radius:50%;width:34px;height:34px;background:#f2f4ed;color:#627250}main{max-width:1390px;margin:auto;padding:38px 46px 20px}.greeting{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.greeting .eyebrow{color:#8b9b7f;font-size:9px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,sans-serif}h1{font-size:29px;letter-spacing:-1px;margin:10px 0}.sun{font-size:26px;color:#baa972;margin-left:8px}.greeting p:not(.eyebrow){color:var(--muted);font-size:12px;margin:0}.date{font-size:11px;color:#8b9489}.hero{position:relative;background:#244f40;border-radius:19px;overflow:hidden;min-height:330px;display:flex;color:#fff}.heroCopy{padding:36px 40px;z-index:1;flex:1}.pill{display:inline-block;border:1px solid #78978060;border-radius:20px;padding:8px 12px;font-size:8px;letter-spacing:1.8px;color:#d0ddc3}.hero h2{font-family:Georgia,serif;font-weight:400;font-size:41px;line-height:1.2;letter-spacing:-1px;margin:20px 0 15px}.hero p{color:#bbcec2;font-size:12px;line-height:1.8}.primary{background:var(--green);color:#fff;padding:12px 19px;border-radius:8px;font-weight:500;font-size:12px;display:inline-flex;align-items:center;gap:30px}.primary.light{background:#e5edce;color:#34503a;margin-top:9px}.art{width:43%;position:relative;overflow:hidden}.arch{position:absolute;width:230px;height:300px;bottom:-24px;left:50%;transform:translateX(-50%);border:1px solid #b0c19766;border-radius:140px 140px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(130deg,#62806440,#21483660);box-shadow:0 0 0 15px #86a0780c,0 0 0 16px #c1ceaa25,0 0 0 33px #c1ceaa07,0 0 0 34px #c1ceaa18}.artWord{font-size:39px;color:#dce4c6}.arabic{font-family:Amiri,serif}.artCaption{font-size:7px;letter-spacing:4px;color:#b5c49d;margin-top:20px}.archLine{height:40px;width:1px;background:#aebe9655;margin-top:20px}.star{position:absolute;color:#b5c298;font-size:35px}.s1{top:36px;right:55px}.s2{top:92px;left:8px;font-size:18px}.orbit{position:absolute;width:400px;height:400px;border:1px solid #aabd9015;border-radius:50%;top:-190px;right:-200px}.o2{width:470px;height:470px;right:-235px;top:-225px}.steps{position:absolute;bottom:0;left:5%;width:90%;height:15px;background:#6b86603b;border-radius:50% 50% 0 0}.featureRow{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;margin:22px 0 40px}.continue{border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:24px;display:flex;align-items:center;gap:18px;text-align:left}.featureIcon{width:48px;height:48px;display:grid;place-items:center;background:var(--soft);border-radius:12px;font-size:25px;color:#728561}.continue .eyebrow{font-size:8px;color:#93a180}.continue h3{font-size:16px;margin:7px 0}.continue p{font-size:10px;color:var(--muted);margin:0}.arrow{margin-left:auto;font-size:22px}.reflection{position:relative;overflow:hidden;background:#edf0e5;border:1px solid #e5e9dc;border-radius:12px;padding:23px 27px;color:#62714c}.reflection .eyebrow{font-size:8px}.reflection p{margin:10px 0 0;font-size:13px;line-height:1.6}.flower{position:absolute;font-size:110px;right:20px;top:10px;color:#bdc9a376}.sectionHeading{display:flex;align-items:center;justify-content:space-between}.sectionHeading .eyebrow{font-size:8px;color:#929d87;margin-bottom:8px}.sectionHeading h2{font-size:22px;margin:0}.count{color:#8c958a;font-size:10px}.toolbar{display:flex;justify-content:space-between;gap:20px;margin:24px 0 20px}.tabs{display:flex;gap:5px;border:1px solid var(--line);background:#eef1ea;padding:4px;border-radius:9px}.tabs button{padding:8px 17px;font-size:11px;color:#8b9585;border-radius:6px}.tabs button.selected{background:var(--paper);color:#48603e;box-shadow:0 2px 4px #00000007}.search{display:flex;align-items:center;gap:9px;width:320px;border:1px solid var(--line);border-radius:9px;background:var(--paper);padding:0 13px}.search span{font-size:24px;color:#9aa48f}.search input{background:none;border:0;outline:0;width:100%;font-size:10px;color:var(--ink);padding:12px 0}.search kbd{color:#a9aea3;border:1px solid var(--line);padding:0 4px;border-radius:4px}.surahGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.surahCard{padding:20px 17px;border:1px solid var(--line);background:var(--paper);border-radius:11px;text-align:left;display:flex;align-items:center;gap:14px;min-width:0;animation:appear .35s ease both}.surahCard:hover{border-color:#aebf9e;transform:translateY(-2px);box-shadow:0 5px 16px #254b3809}.number{width:32px;height:32px;flex-shrink:0;display:grid;place-items:center;background:var(--soft);border-radius:9px;transform:rotate(45deg);font-size:11px;color:#698057}.number span{transform:rotate(-45deg)}.surahName{min-width:0}.surahName strong{font-size:12px;display:block;margin-bottom:4px}.surahName small{font-size:9px;color:var(--muted)}.surahArabic{font-family:Amiri,serif;font-size:23px;margin-left:auto;color:#758463;white-space:nowrap}.surahArabic small{display:block;font:8px 'DM Sans',sans-serif;text-align:right;color:#a5ada1;margin-top:2px}footer{border-top:1px solid var(--line);margin-top:38px;padding:24px 0;display:flex;align-items:center;gap:18px;color:#97a08f}footer .small{font-size:16px;letter-spacing:2px}footer p,footer>a:last-child{font-size:9px;margin:0}footer>a:last-child{margin-left:auto}.back{padding:10px 0;color:#7a8a6d}.readerHead{text-align:center;padding:35px;background:var(--soft);border-radius:16px;margin:20px 0}.readerHead h1{font-size:32px}.readerHead p{color:#7c8c71}.readerActions{display:flex;justify-content:center;gap:12px}.secondary{border:1px solid var(--line);background:var(--paper);padding:12px 18px;border-radius:8px;font-size:12px}.verse{padding:28px 30px;background:var(--paper);border:1px solid var(--line);border-radius:12px;margin:14px 0;scroll-margin-top:20px}.verse.playing{border-color:#92b27b;background:var(--soft)}.verseTop{display:flex;align-items:center;gap:12px;color:#7e8e72}.verseTop span{margin-right:auto;font-size:12px}.verseTop button{padding:8px;font-size:18px}.verseText{font-family:Amiri,serif;font-size:var(--arabic-size);text-align:right;line-height:2.3;margin:12px 0 22px}.latinText{font-size:13px;color:#81946e;line-height:1.8}.translationText{font-size:14px;line-height:1.8;color:var(--ink)}.end{margin:30px 0}.player{position:fixed;bottom:18px;left:270px;right:30px;z-index:9;border:1px solid var(--line);background:var(--paper);border-radius:15px;box-shadow:0 4px 40px #0002;display:flex;align-items:center;gap:14px;padding:15px 20px}.trackIcon{background:var(--soft);padding:12px;border-radius:10px;font-size:22px}.track{min-width:150px}.track strong,.track small{display:block}.track small{color:var(--muted);font-size:10px;margin-top:4px}.player input{flex:1;min-width:40px;accent-color:var(--green)}.player>span{font-size:10px;color:var(--muted)}.playcircle{border-radius:50%;background:var(--green);color:#fff;width:38px;height:38px;flex-shrink:0}.player button{min-width:30px;min-height:32px}#repeat[aria-pressed=true]{background:var(--soft);border-radius:7px}.player~*{}body:has(.player:not([hidden])) main{padding-bottom:100px}dialog{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:20px;padding:28px;max-width:460px;width:calc(100% - 32px);box-shadow:0 20px 80px #0002}dialog::backdrop{background:#132e2666;backdrop-filter:blur(4px)}.dialogHead{display:flex;justify-content:space-between;align-items:center}.dialogHead h2{font-size:22px;margin-bottom:10px}.dialogHead button{font-size:20px;padding:10px}dialog p{color:var(--muted);line-height:1.8}dialog label{display:block;margin:22px 0}dialog select{width:100%;display:block;margin-top:10px;background:var(--soft);color:var(--ink);border:1px solid var(--line);padding:13px;border-radius:8px}dialog input[type=range]{display:block;width:100%;margin-top:18px;accent-color:var(--green)}dialog input[type=checkbox]{accent-color:var(--green);margin-right:10px}.fine{font-size:11px}#toast{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);padding:12px 22px;background:#254d40;color:white;border-radius:10px;z-index:20;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%;text-align:center}#toast.show{opacity:1}.empty{grid-column:1/-1;text-align:center;padding:50px;color:var(--muted)}body.dark{--bg:#14241e;--paper:#1b2e25;--ink:#e0e9db;--muted:#a2b29f;--line:#314639;--green:#537954;--soft:#2b4031}body.dark .reflection,body.dark .tabs{background:var(--soft);border-color:var(--line);color:#bacba9}body.dark .surahArabic{color:#b4c69d}body.dark .avatar{background:var(--soft)}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1550px){main{padding-top:50px}.hero{min-height:370px}.heroCopy{padding:43px 48px}.hero h2{font-size:47px}.arch{height:330px;width:260px}}@media(max-width:1150px){.sidebar{width:200px;padding:32px 18px}.shell{margin-left:200px}main{padding:30px 25px}header{padding:0 25px}.surahGrid{grid-template-columns:repeat(2,1fr)}.hero h2{font-size:35px}.heroCopy{padding:30px}.player{left:220px;gap:8px}.date{display:none}.flower{right:0}.track{min-width:120px}}@media(max-width:760px){.sidebar{position:sticky;top:0;width:100%;height:68px;flex-direction:row;padding:12px 20px;align-items:center;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:24px}.brandmark{font-size:30px}.sidebar nav{display:flex;margin-left:auto}.nav{width:auto;margin:0;padding:9px;font-size:0;gap:0}.nav span{font-size:22px}.nav small,.sidebar .tagline,.navlabel,.sidequote,.sidebottom{display:none}.shell{margin-left:0}header{height:50px;padding:0 20px}.online{display:none}.avatar{height:28px;width:28px}main{padding:25px 18px}.greeting{margin-bottom:23px}.greeting h1{font-size:25px}.greeting .eyebrow{font-size:8px}.hero{min-height:315px}.heroCopy{padding:27px 24px}.hero h2{font-size:34px}.hero p{font-size:11px}.art{position:absolute;right:12px;bottom:0;width:180px;max-width:calc(100% - 24px);height:100%;opacity:.3;pointer-events:none}.arch{width:160px;height:250px}.artWord{font-size:28px;white-space:nowrap;direction:rtl}.heroCopy{max-width:100%}.featureRow{grid-template-columns:1fr;gap:12px;margin-bottom:30px}.continue{padding:20px}.reflection{padding:20px 24px}.reflection p br{display:none}.flower{font-size:75px;right:15px;top:-7px}.sectionHeading h2{font-size:20px}.toolbar{flex-direction:column;gap:12px;margin-top:20px}.tabs{align-self:flex-start}.search{width:100%}.search input{font-size:12px}.surahGrid{grid-template-columns:1fr;gap:10px}.surahCard{padding:20px}.surahName strong{font-size:14px}.surahName small{font-size:11px}.surahArabic{font-size:27px}.surahArabic small{font-size:9px}footer{flex-wrap:wrap;gap:10px}footer>a:last-child{width:100%;margin-left:0}.player{left:10px;right:10px;bottom:10px;padding:12px;gap:6px;flex-wrap:wrap}.trackIcon{display:none}.track{flex:1;min-width:125px}.player input{order:2;flex-basis:65%}.player #elapsed,.player #duration{order:2}.player #repeat{display:none}.verse{padding:20px}.verseText{line-height:2.3}.readerHead{padding:25px 15px}.readerActions{gap:8px}.readerActions button{padding:12px;font-size:11px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
header{height:68px}.topWord{font:700 12px Manrope;letter-spacing:2px;color:#82987a}#language{border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);padding:8px 12px;font-size:12px}.prayerPanel{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin-top:22px;padding:24px}.prayerHeading{display:flex;align-items:center;justify-content:space-between;gap:16px}.prayerHeading h2{font-size:21px;margin:8px 0}.prayerHeading .eyebrow{color:#8b9b7f;font-size:8px}.prayerHeading p{font-size:11px;color:var(--muted);margin:0}.prayerButtons{display:flex;gap:8px}.prayerButtons button[aria-pressed=true]{background:var(--soft);border-color:#9bb181}.prayerTimes{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:22px 0}.prayerTime{border:1px solid var(--line);border-radius:10px;padding:16px;text-align:center}.prayerTime small{display:block;color:var(--muted);margin-bottom:8px}.prayerTime strong{font:600 23px Manrope}.prayerTime.next{background:var(--green);color:white;border-color:var(--green)}.prayerTime.next small{color:#d1e0c8}.prayerFoot{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted)}.prayerPanel .fine{color:var(--muted);font-size:10px;line-height:1.7;margin:12px 0 0}.qariPanel{margin-bottom:36px}.qariCards{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:20px}.qariCard{border:1px solid var(--line);background:var(--paper);padding:20px 10px;border-radius:13px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:9px}.qariCard.chosen{border-color:#98b280;background:var(--soft)}.qariAvatar{width:46px;height:46px;border-radius:50%;background:linear-gradient(130deg,#69826a,#253e35);color:#e7eddb;display:grid;place-items:center;font:500 16px Georgia}.qariCard strong{font-size:10px;line-height:1.6;flex:1}.qariCard small{font-size:9px;color:var(--muted)}.readerQari{display:flex;align-items:center;justify-content:center;gap:12px;margin:20px auto;color:var(--muted);font-size:12px}select{max-width:100%}.readerQari select,.doaFilters select,.doaFilters input{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:12px;font-size:12px}.doaFilters{display:flex;gap:15px;margin:25px 0 16px}.doaFilters input{flex:1;min-width:0}.doaFilters select{max-width:45%}.duaCard{background:var(--paper);border:1px solid var(--line);border-radius:12px;margin:12px 0}.duaCard>summary{list-style:none;display:flex;align-items:center;gap:15px;padding:22px;cursor:pointer}.duaCard small{display:block;color:var(--muted);font-size:10px;margin-top:6px}.duaCard strong{font-size:14px}.duaSymbol{font-size:28px;color:#8f9f78}.duaArrow{margin-left:auto;font-size:22px}.duaBody{padding:0 25px 22px;line-height:1.9}.duaSource{font-size:11px;color:var(--muted)}.duaSource p{white-space:pre-wrap}.duaSource summary{cursor:pointer}#locationForm input{display:block;width:100%;padding:12px;background:var(--soft);color:var(--ink);border:1px solid var(--line);border-radius:8px;margin-top:8px}#locationStatus{font-size:12px}#focusDialog{max-width:850px;width:calc(100% - 36px);height:calc(100dvh - 36px);max-height:100dvh;border:1px solid #546c54;background:#10271f;padding:0;color:#edf2e8;overflow:auto}#focusVideo{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}#focusDialog{isolation:isolate}.focusShade{position:fixed;inset:0;background:linear-gradient(#10271f22,#10271f44,#07150dda);pointer-events:none}.focusContent{position:relative;z-index:1;min-height:100%;padding:25px 35px;display:flex;flex-direction:column}.focusTop{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:2px}.focusTop button{font-size:24px;color:white;padding:8px}.focusCenter{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 0 25px;text-align:center}.focusCenter h2{font-size:30px;font-weight:500}.focusCenter .eyebrow{color:#baceab}.focusCenter #focusAyah{font-size:clamp(28px,5vw,45px);line-height:2.1;color:#f3f5e5;margin:0;max-width:100%}.focusCenter #focusMeaning{color:#baceb8;font-size:13px;max-width:590px;line-height:1.9;margin-top:18px}.focusCenter #focusPosition{color:#baceab;font-size:11px}.focusControls{display:flex;justify-content:center;align-items:center;gap:30px;margin:12px 0 30px}.focusControls button{color:#e0eacd;font-size:24px;padding:12px}.focusControls .focusPlay{background:#e0eacd;color:#213c2d;border-radius:50%;width:64px;height:64px}.focusOptions{display:grid;grid-template-columns:1fr 1fr;gap:12px 22px;background:#172e25b0;padding:18px;border-radius:14px;border:1px solid #c4d6b322}.focusOptions label{font-size:10px;letter-spacing:.3px;color:#ccd8bf;margin:0}.focusOptions select{background:#1b362b;color:#e5eedb;border-color:#53634c;margin:7px 0 0;padding:10px;font-size:11px}.focusOptions input[type=range]{margin:14px 0 3px;accent-color:#c1d7a2}.focusOptions input[type=file]{width:100%;margin-top:10px;font-size:10px}.focusFine{font-size:9px!important;color:#a7bca5!important;line-height:1.7;margin:15px 0 0}body.dark .sidequote,body.dark .nav{color:#afc0a9}body.dark .nav.active{color:#e1ebd8}body.dark .eyebrow{color:#aabd99}body:has(#focusDialog[open]){overflow:hidden}@media(max-width:1100px){.qariCards{grid-template-columns:repeat(3,1fr)}.prayerHeading{align-items:flex-start;flex-direction:column}.prayerTime{padding:14px 8px}.prayerTime strong{font-size:19px}}@media(max-width:760px){.prayerPanel{padding:20px 15px}.prayerTimes{gap:5px}.prayerTime{padding:12px 4px}.prayerTime strong{font-size:16px}.prayerTime small{font-size:9px}.prayerFoot{flex-direction:column}.prayerButtons .secondary{padding:10px;font-size:11px}.qariPanel .sectionHeading{gap:10px}.qariPanel h2{font-size:18px}.qariPanel .primary{font-size:10px;padding:12px}.qariCards{gap:8px}.qariCard{padding:15px 7px}.readerActions{flex-wrap:wrap}.doaFilters{flex-direction:column}.doaFilters select{max-width:100%}#focusDialog{width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0;margin:0}.focusContent{padding:16px 20px}.focusCenter{padding-top:30px}.focusOptions{gap:15px;padding:14px}.focusCenter h2{font-size:26px}.focusCenter #focusMeaning{font-size:12px}.focusControls{margin:0 0 20px}.headerRight{gap:10px}.sidebar nav{gap:2px}.nav{padding:9px 7px}}
.qariTrigger{display:flex;align-items:center;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px 16px;text-align:left;min-height:64px;min-width:240px;box-shadow:0 3px 12px #10271f08}.qariTrigger:hover{border-color:#94ad80;transform:translateY(-1px)}.qariMini{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#78906c,#294b3b);color:#f0f3e8;font:14px Georgia;flex-shrink:0}.qariTrigger small{display:block;font-size:9px;color:var(--muted);margin-bottom:5px}.qariTrigger strong{font-size:12px;font-weight:500;color:var(--ink)}.qariTrigger>span:last-child{margin-left:auto}.settingsQari .qariTrigger{width:100%}.settingsQari{margin:24px 0}.settingsQari p{margin-bottom:8px}.focusQariField{font-size:10px;color:#ccd8bf}.focusQariField .qariTrigger{margin-top:8px;min-width:0;width:100%;background:#1b362b;border-color:#53634c;padding:10px;gap:8px}.focusQariField .qariTrigger strong{color:#e5eedb;font-size:10px}.focusQariField .qariMini{width:28px;height:28px;font-size:10px}#qariDialog{max-width:670px;padding:28px}#qariDialog .eyebrow{font-size:8px;margin:0 0 8px}.qariPickerGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:25px 0}.qariChoice{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);border-radius:14px;padding:18px 14px;background:var(--paper);min-height:90px}.qariChoice:hover{border-color:#a8bd92;transform:translateY(-2px)}.qariChoice.selected{background:var(--soft);border:1px solid #94b077;box-shadow:0 0 0 2px #94b07718}.qariChoice strong{font-size:12px;display:block;line-height:1.6;font-weight:500}.qariChoice small{display:block;font-size:9px;color:var(--muted);margin-top:5px}.choiceCheck{margin-left:auto;color:#92ab79;font-size:18px}.qariConfirm{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding-top:20px}.qariConfirm>span{font-size:11px;color:var(--muted)}.duaNarrator{border-top:1px solid var(--line);margin-top:24px;padding-top:16px}.duaNarrator small{display:block;font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:5px}.duaNarrator strong{font-size:12px;font-weight:500;color:var(--ink)}#locationDialog{max-width:570px}.gpsCard{width:100%;display:flex;align-items:center;text-align:left;gap:15px;background:var(--soft);border:1px solid var(--line);padding:18px;border-radius:14px;margin:12px 0 20px}.gpsCard>span:first-child{font-size:32px;color:#91a779}.gpsCard strong{display:block;font-size:13px}.gpsCard small{display:block;font-size:10px;color:var(--muted);margin-top:7px}.gpsCard>span:last-child{margin-left:auto}.gpsAutoRow{font-size:12px;margin:16px 0!important}.regionHeading{display:flex;align-items:center;gap:12px;margin:25px 0 15px}.regionHeading h3{font-size:14px;margin:0}.regionHeading button{font-size:11px;color:var(--muted);padding:7px;border:1px solid var(--line);border-radius:7px}.regionCountry{margin-left:auto;background:var(--soft);padding:5px 8px;border-radius:5px;font-size:9px;color:var(--muted)}.regionList{max-height:300px;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;scrollbar-width:thin;scrollbar-color:#879c75 transparent}.regionChoice{display:flex;align-items:center;gap:8px;text-align:left;border:1px solid var(--line);padding:13px 10px;border-radius:9px;background:var(--paper);min-height:54px;font-size:11px}.regionChoice:hover{background:var(--soft);border-color:#92ab79}.regionChoice>span:last-child{margin-left:auto}.regionPin{font-size:19px;color:#92a57e}button:disabled{opacity:.6;cursor:wait}@media(max-width:760px){#qariDialog{width:100%;max-height:85dvh;margin:auto 0 0;border-radius:24px 24px 0 0;padding:24px 20px;overflow:auto}.qariPickerGrid{gap:9px;margin:20px 0}.qariChoice{flex-wrap:wrap;padding:15px 11px;gap:9px;position:relative}.qariChoice .qariAvatar{width:38px;height:38px}.qariChoice>span:nth-child(2){width:100%}.qariChoice strong{font-size:11px}.choiceCheck{position:absolute;top:17px;right:12px}.qariConfirm{position:sticky;bottom:-24px;background:var(--paper);padding:16px 0 24px}.qariConfirm>span{max-width:40%;line-height:1.5}.qariTrigger{min-width:0;max-width:100%;padding:11px 14px}.regionList{max-height:36dvh}.regionChoice{font-size:10px}#locationDialog{padding:22px;max-height:92dvh;overflow:auto}.focusQariField .qariTrigger{flex-wrap:wrap}.focusQariField .qariTrigger .qariMini{display:none}}
.continuousNote{font-size:10px!important;color:var(--muted)!important;margin:18px 0 0;line-height:1.6}.duaMeaningLabel{display:block;color:var(--muted);font-size:10px;margin-top:20px;text-transform:uppercase;letter-spacing:1px}
/* Theme surfaces: every feature follows the same light/dark palette. */
body{
  color-scheme:light;
  --bg:#f8f9f6;--paper:#ffffff;--ink:#233e35;--muted:#637467;--line:#dce4d8;--green:#315c49;--soft:#edf3e7;
  --hero-bg:linear-gradient(115deg,#e7efdd 0%,#d9e6cb 60%,#cbdcbd 100%);
  --hero-ink:#254a38;--hero-copy:#455e43;--hero-accent:#547344;--hero-line:#8da77b66;
  --hero-button:#315c49;--hero-button-ink:#ffffff;--hero-glow:#91ac7025;
  --focus-bg:#edf3e7;--focus-shade:linear-gradient(#eff5e8ef,#edf4e6e8,#e4eddcf5);
  --focus-panel:#fffffff0;--focus-ink:#233e35;--focus-muted:#52694e;
  --avatar-bg:linear-gradient(140deg,#e6eedb,#cbdcb8);--avatar-ink:#31503b;
  --selection-bg:#c8ddb8;--selection-ink:#1e3d2c;
}
body.dark{
  color-scheme:dark;
  --bg:#101e19;--paper:#192c23;--ink:#e4ecdf;--muted:#adbea5;--line:#344b3b;--green:#456d50;--soft:#293e2e;
  --hero-bg:linear-gradient(115deg,#18392c 0%,#204635 60%,#2c533a 100%);
  --hero-ink:#f0f4e7;--hero-copy:#c0d3b4;--hero-accent:#ccd8a9;--hero-line:#9bb78755;
  --hero-button:#dce9bd;--hero-button-ink:#233e2d;--hero-glow:#b4cf8e15;
  --focus-bg:#10271f;--focus-shade:linear-gradient(#10271f99,#10271fb8,#07150df5);
  --focus-panel:#172e25ed;--focus-ink:#edf2e8;--focus-muted:#bfd1b4;
  --avatar-bg:linear-gradient(140deg,#456448,#233e2d);--avatar-ink:#e5eedb;
  --selection-bg:#526f44;--selection-ink:#f1f5e9;
}
::selection{background:var(--selection-bg);color:var(--selection-ink)}
.hero{background:var(--hero-bg);color:var(--hero-ink);border:1px solid var(--hero-line)}
.hero h2{color:var(--hero-ink)}.hero p{color:var(--hero-copy)}
.hero .pill{display:inline-flex;align-items:center;gap:10px;color:var(--hero-copy);border-color:var(--hero-line);background:var(--hero-glow)}
.hero .primary.light{background:var(--hero-button);color:var(--hero-button-ink)}
.hero .arch{background:linear-gradient(130deg,var(--hero-glow),transparent);border-color:var(--hero-line);box-shadow:0 0 0 15px var(--hero-glow),0 0 0 16px var(--hero-line),0 0 0 33px var(--hero-glow),0 0 0 34px var(--hero-line)}
.hero .artWord,.hero .artCaption,.hero .star{color:var(--hero-accent)}
.hero .archLine,.hero .steps{background:var(--hero-line)}.hero .orbit{border-color:var(--hero-line)}
.qariAvatar,.qariMini{background:var(--avatar-bg);color:var(--avatar-ink)}
.reflection{background:var(--soft);color:var(--ink);border-color:var(--line)}
body.dark .reflection{background:var(--soft);color:var(--ink)}
.reflection .flower{color:var(--hero-line)}
.navlabel,.eyebrow,.sidebottom,.sidequote,.topWord,.online,.date,.count,.back,.featureRow .eyebrow,.sectionHeading .eyebrow,.greeting .eyebrow,.prayerHeading .eyebrow{color:var(--muted)}
body.dark .eyebrow,body.dark .nav,body.dark .sidequote{color:var(--muted)}
.nav.active,body.dark .nav.active{color:var(--ink)}
.avatar{color:var(--ink);background:var(--soft);border-color:var(--line)}
.surahArabic,body.dark .surahArabic,.latinText{color:var(--hero-accent)}
.readerHead p{color:var(--muted)}
#focusDialog{background:var(--focus-bg);color:var(--focus-ink);border-color:var(--line)}
.focusShade{background:var(--focus-shade)}
.focusTop button,.focusCenter h2,.focusCenter #focusAyah{color:var(--focus-ink)}
.focusCenter .eyebrow,.focusCenter #focusMeaning,.focusCenter #focusPosition,.focusOptions label,.focusQariField{color:var(--focus-muted)}
.focusOptions{background:var(--focus-panel);border-color:var(--line)}
.focusOptions select,.focusQariField .qariTrigger{background:var(--paper);color:var(--ink);border-color:var(--line)}
.focusQariField .qariTrigger strong{color:var(--ink)}
.focusControls button{color:var(--focus-ink)}
.focusControls .focusPlay{background:var(--hero-button);color:var(--hero-button-ink)}
.focusOptions input[type=range]{accent-color:var(--green)}
.focusFine{color:var(--focus-muted)!important}
@media(prefers-reduced-motion:no-preference){body,.sidebar,header,.hero,.player,.prayerPanel,.readerHead,.surahCard,.qariCard,.reflection,dialog{transition:background-color .2s,color .2s,border-color .2s}}
.player .autoplayToggle{border:1px solid var(--line);background:var(--paper);border-radius:18px;padding:7px 10px;white-space:nowrap;font-size:10px;line-height:1.3;color:var(--muted)}.player .autoplayToggle[aria-pressed=true]{background:var(--soft);border-color:var(--hero-line);color:var(--ink)}.focusAutoplay{display:flex!important;justify-content:center;align-items:center;gap:10px;color:var(--focus-muted);font-size:12px;margin:0 0 24px!important}.focusAutoplay input{accent-color:var(--green);width:17px;height:17px;margin:0!important}@media(max-width:760px){.player .autoplayToggle{font-size:9px;padding:6px 8px;min-width:0}.player .track{min-width:100px}.player{column-gap:4px}.focusAutoplay{font-size:11px}}
.previewLink{padding:8px 12px;border:1px solid var(--line);border-radius:9px;font-size:11px;background:var(--soft);white-space:nowrap}.appPreview .previewLink{display:none}.appPreview .sidebar{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;height:70px;padding:5px 9px 8px;border:0;border-top:1px solid var(--line);z-index:8;display:flex;flex-direction:row;background:var(--paper)}.appPreview .sidebar>.brand,.appPreview .sidebar>.tagline,.appPreview .navlabel,.appPreview .sidequote,.appPreview .sidebottom{display:none}.appPreview .sidebar nav{display:flex;justify-content:space-around;align-items:center;width:100%;margin:0;gap:5px}.appPreview .nav{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:9px;gap:3px;padding:6px 4px;flex:1;margin:0;min-height:53px;border-radius:13px}.appPreview .nav>span{font-size:21px;height:24px;line-height:24px}.appPreview .shell{margin-left:0}.appPreview .shell>header{position:sticky;top:0;z-index:5;height:54px;padding:0 18px}.appPreview main{padding-bottom:95px}.appPreview:has(.player:not([hidden])) main{padding-bottom:205px}.appPreview footer{display:none}.appPreview .player{bottom:80px}.appPreview .online,.appPreview .avatar{display:none}.appPreview .headerRight{gap:7px}.appPreview #language{font-size:10px;padding:7px}.appThemeToggle{width:31px;height:31px;border:1px solid var(--line);border-radius:50%;font-size:16px}.appPreview .greeting h1{font-size:23px}@media(max-width:430px){body:not(.appPreview) .previewLink{font-size:9px;padding:7px 8px}body:not(.appPreview) .headerRight{gap:5px}}

/* Quiet controls: no decorative directional icons, compact primary actions. */
.gpsCard>span:first-child{font-size:inherit;color:inherit}.gpsCard>span:last-child,.regionChoice>span:last-child,.qariTrigger>span:last-child{margin-left:0}
.regionChoice{justify-content:flex-start}.prayerReminder>span:last-child{margin-left:0}.mobileReadMore{justify-content:center!important}
.duaCard summary::marker{content:""}.duaCard summary::-webkit-details-marker{display:none}
#reminderDialog #saveReminder,#reminderDialog #calendarExport{display:flex;width:fit-content;max-width:100%;min-height:44px;justify-content:center;text-align:center;margin:12px auto 0;padding:11px 24px}

/* Hide the page scroll indicator on touch layouts, preserving scrolling. */
@media (max-width: 900px) {
 html, body, main { scrollbar-width: none; }
 html::-webkit-scrollbar, body::-webkit-scrollbar, main::-webkit-scrollbar { display: none; width: 0; height: 0; }
}
#heroMessage { text-wrap: balance; }

/* NURA v42 — Tafsir ringkas + Warna Tajwid */
.tafsirPanel{margin-top:14px;border-top:1px solid var(--line);padding-top:14px}
.tafsirLabel{font-size:10px;letter-spacing:1.6px;font-weight:700;color:#7e8e72;margin:0 0 8px;text-transform:uppercase}
.tafsirText{font-size:13.5px;line-height:1.9;margin:0}
.tafsirMore{background:none;border:0;color:#315c49;font-weight:700;font-size:12px;padding:8px 0 0;cursor:pointer}
.tafsirSource{font-size:11px;color:var(--muted);margin:10px 0 0}
.tafsirLoading{font-size:13px;color:var(--muted);margin:0}
.tajwidLegend{margin:14px 0 0;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:14px 16px}
.tajwidLegendTitle{font-size:11px;font-weight:700;letter-spacing:.4px;margin-bottom:10px}
.tajwidLegendTitle span{font-weight:400;color:var(--muted);margin-left:6px}
.tajwidLegendItems{display:flex;flex-wrap:wrap;gap:8px 16px}
.tajwidLegendItem{font-size:11.5px;display:inline-flex;align-items:center;gap:6px}
.tajwidLegendItem i{font-style:normal}
.verseText.tajwidOn{line-height:2.5}
.tj{font-weight:700}
.tj-n{color:#2f5fe3}.tj-p{color:#4050ff}.tj-m{color:#1a2fd0}.tj-o{color:#2144c1}
.tj-q{color:#c40008}
.tj-f{color:#7a00a8}.tj-c{color:#b0008a}
.tj-a{color:#0e7a5f}.tj-u{color:#127a00}.tj-w{color:#3f8a00}
.tj-i{color:#0090c8}
.tj-g{color:#c85a00}
.tj-h,.tj-s,.tj-l,.tj-d,.tj-b{color:#8a8a8a}
body.dark .tj-n{color:#8ab0ff}body.dark .tj-p{color:#8aa0ff}body.dark .tj-m{color:#a8b4ff}body.dark .tj-o{color:#8fa5ff}
body.dark .tj-q{color:#ff6b6b}
body.dark .tj-f{color:#d07ae0}body.dark .tj-c{color:#ff7ad9}
body.dark .tj-a{color:#3dd6a8}body.dark .tj-u{color:#5cc85a}body.dark .tj-w{color:#8ad94a}
body.dark .tj-i{color:#6fd8ff}
body.dark .tj-g{color:#ffa050}
body.dark .tj-h,body.dark .tj-s,body.dark .tj-l,body.dark .tj-d,body.dark .tj-b{color:#aaaaaa}
body.dark .tafsirMore{color:#aabd99}

/* NURA v43 — Pencarian ayat */
.ayahSearch{margin:16px 0 4px}
.ayahSearchBox{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:var(--paper);border-radius:10px;padding:6px 8px 6px 14px}
.ayahSearchBox>span{font-size:22px;color:#9aa48f}
.ayahSearchBox input{flex:1;min-width:0;background:none;border:0;outline:0;font-size:13px;color:var(--ink);padding:8px 0}
.ayahSearchBox button{padding:10px 16px}
.ayahSearchChips{display:flex;gap:8px;align-items:center;margin:10px 2px 0;font-size:11px;color:var(--muted)}
.ayahSearchChips button{border:1px solid var(--line);background:var(--paper);border-radius:20px;padding:5px 12px;font-size:11px;color:var(--ink);cursor:pointer}
.ayahSearchResults{margin-top:12px}
.ayahSearchStatus{font-size:12px;color:var(--muted);margin:6px 2px}
.ayahResult{display:block;width:100%;text-align:left;border:1px solid var(--line);background:var(--paper);border-radius:10px;padding:12px 14px;margin:8px 0;cursor:pointer}
.ayahResult:hover{border-color:#aebf9e}
.ayahResultRef{display:block;font-size:11px;font-weight:700;letter-spacing:.4px;color:#315c49;margin-bottom:5px}
.ayahResultText{display:block;font-size:13px;line-height:1.7;color:var(--ink)}
.ayahResultText mark{background:#e5edce;color:inherit;padding:0 2px;border-radius:3px}
.ayahSearchFoot{font-size:11px;color:var(--muted);margin:8px 2px 0}
body.dark .ayahResultRef{color:#aabd99}
body.dark .ayahResultText mark{background:#2b4031}

/* NURA v44 — Layout Rapat (sesuai preview pict 1: header 231px, padding 18px, gap 8px, kolom 880px) */
#reader{max-width:880px;margin-left:auto;margin-right:auto}
.readerHead{padding:18px 20px 16px}
.readerHead h1{font-size:26px}
.readerHead .readerQari{margin:10px 0}
.readerHead .readerActions{margin-top:10px}
.verse{padding:18px 20px;margin:8px 0}
.verseText{line-height:2;margin:8px 0 12px}
.latinText,.translationText{line-height:1.65}

/* NURA v45 — Legenda Tajwid pindah ke dialog Pengaturan baca (di bawah toggle) */
#settingsDialog .tajwidLegend{margin:10px 0 4px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
#settingsDialog .tajwidLegendTitle{font-size:12px;font-weight:700}
#settingsDialog .tajwidLegendTitle span{display:block;font-weight:400;font-size:11px;color:var(--muted);margin-top:2px}
#settingsDialog .tajwidLegendItems{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:8px}
#settingsDialog .tajwidLegendItem{font-size:11px}