:root{color-scheme:light;--ink:#193d35;--muted:#53665f;--paper:#f6f5ef;--surface:#fffefa;--line:#d9ded5;--accent:#255b4b;--tint:#e8eee7;--warning:#72501d;--warning-bg:#f7efd9;font-family:Segoe UI,system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.55}
html{font-size:18px;scroll-padding-bottom:320px}button,input,select,summary{scroll-margin-bottom:320px}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button,select{cursor:pointer}button{min-height:44px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);padding:.5rem .9rem}button:hover{background:var(--tint)}button[aria-pressed=true]{background:var(--tint);border-color:var(--accent)}button:disabled{cursor:default;color:#6b736e;background:#e9ece7}a{color:inherit;text-underline-offset:4px}a:hover{text-decoration-thickness:2px}:focus-visible{outline:3px solid #9b6825;outline-offset:4px}input,select{max-width:100%;min-height:48px;border:1px solid #8b9a90;border-radius:8px;background:var(--surface);color:var(--ink);padding:.6rem .75rem}h1,h2,p{margin-top:0}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(2.25rem,5vw,3.75rem);line-height:1.15;margin-bottom:.5rem}h2{font-size:1.1rem;font-weight:600}small,.quiet{color:var(--muted)}[hidden]{display:none!important}.skip{position:fixed;top:-100px;z-index:20;background:white;padding:1rem}.skip:focus{top:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 2rem;border-bottom:1px solid var(--line);background:var(--surface)}.brand{display:flex;gap:.8rem;align-items:center;text-decoration:none;font-family:Georgia,serif;font-size:1.35rem}.brand small{display:block;font: .65rem Segoe UI,sans-serif;letter-spacing:.15em;margin-top:.3rem}.mark{font-size:2.2rem}.layout{display:grid;grid-template-columns:280px minmax(0,1fr);max-width:1440px;margin:auto;padding-bottom:190px}.library{padding:2rem 1.5rem;border-right:1px solid var(--line)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:1.5rem 0 1rem}.section-head h2{margin:0}.section-head>span{font-size:.75rem;color:var(--muted)}label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.4rem}#search{width:100%}.library .quiet{font-size:.8rem;margin:.75rem 0}.surah-list{display:grid;gap:.3rem;max-height:62vh;overflow-y:auto;padding:.25rem}.surah-option{display:flex;text-align:left;align-items:center;gap:.8rem;width:100%;border-color:transparent;background:transparent}.surah-option[aria-current=true]{background:var(--tint);border-color:#a5b7aa}.surah-option strong,.surah-option small{display:block}.surah-option small{font-size:.72rem}.number{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.8rem;min-width:1.5rem}#searchStatus{font-size:.8rem;margin:.5rem 0}main{min-width:0;padding:2.5rem clamp(1.25rem,4vw,4rem)}.heading{margin-bottom:2rem}.heading>p:last-child{color:var(--muted)}.eyebrow{font-size:.68rem;letter-spacing:.16em;font-weight:600;margin-bottom:.75rem}.feature{display:grid;grid-template-columns:1fr 170px;gap:1rem;padding:2rem;background:var(--ink);color:#fffdf4;border-radius:14px;margin-bottom:2rem;overflow:hidden}.feature h2{font-family:Georgia,serif;font-size:1.9rem;font-weight:400;margin-bottom:.7rem}.feature p:not(.eyebrow){color:#e1e9df}.feature a{font-size:.85rem}.feature-art{border:1px solid #8da697;border-radius:100px 100px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem}.feature-art>span:first-child{font-family:Georgia,serif;font-size:2.6rem;color:#d6c79b}.art-line{width:40px;border-top:1px solid #d6c79b}.settings{margin-bottom:1.25rem}.settings select{width:100%}.settings .quiet{font-size:.85rem;margin:.7rem 0}.notice{padding:1rem 1.25rem;border-left:3px solid #a67f37;background:var(--warning-bg);color:var(--warning);font-size:.9rem;margin-bottom:2rem}.verse{display:grid;grid-template-columns:1fr auto;gap:1rem;padding:1.25rem 0;border-bottom:1px solid var(--line)}.verse.active{border-left:3px solid var(--accent);padding-left:1rem;background:var(--tint)}.verse h3{font-size:1rem;margin:0 0 .3rem;font-weight:600}.verse p{margin:0;font-size:.85rem;color:var(--muted)}.verse .verse-text{font:1.15rem/1.8 Georgia,serif;color:var(--ink);margin:.5rem 0}.verse-actions{display:flex;align-items:center;gap:.5rem}.verse-actions button{font-size:.8rem;padding:.4rem .65rem}.source-note{margin-top:2rem;font-size:.85rem}.source-note summary{cursor:pointer;min-height:44px;font-weight:600}.source-note p{color:var(--muted)}footer{margin-top:3rem;font-family:Georgia,serif;color:var(--muted);font-size:1rem}footer small{font-family:Segoe UI,sans-serif;font-size:.75rem}.player{position:fixed;bottom:0;width:100%;z-index:5;display:grid;grid-template-columns:minmax(160px,1fr) minmax(220px,1.6fr) 100px;gap:.3rem 2rem;background:var(--surface);border-top:1px solid var(--line);padding:1rem max(1.25rem,calc((100vw - 1280px)/2)) max(.75rem,env(safe-area-inset-bottom));box-shadow:0 -5px 30px #193d3509}.track{align-self:center;min-width:0}.track strong,.track span,.track small{display:block}.track span{font-size:.8rem}.track small{font-size:.7rem}.transport{display:flex;align-items:center;justify-content:center;gap:1rem}.transport button{min-width:44px}.primary{background:var(--ink);color:white;min-width:120px!important;border-color:var(--ink)}.primary:hover{background:var(--accent)}.timeline{display:flex;gap:.6rem;align-items:center;font-size:.7rem;font-variant-numeric:tabular-nums;margin-top:.3rem}.timeline input{flex:1;width:100%;min-width:40px;min-height:28px;padding:0;accent-color:var(--accent)}.speed{align-self:center;font-size:.7rem}.speed select{width:100%;min-height:44px}.player>p{grid-column:1/-1;font-size:.8rem;margin:0;color:var(--warning);min-height:1.3em}.toast{position:fixed;right:1rem;top:5rem;background:var(--ink);color:white;border-radius:8px;z-index:15;padding:1rem;max-width:calc(100vw - 2rem)}.saved-item{display:block;width:100%;text-align:left;margin:1rem 0}.empty{padding:2rem 0;color:var(--muted)}
@media(max-width:900px){.layout{grid-template-columns:220px minmax(0,1fr)}.library{padding:1.5rem 1rem}.feature{grid-template-columns:1fr}.feature-art{display:none}.player{gap:.25rem 1rem}.verse{grid-template-columns:1fr}.verse-actions{justify-content:flex-start}}
@media(max-width:600px){.topbar{padding:1rem;gap:.5rem}.brand{font-size:1.05rem}.brand small{font-size:.56rem}.mark{display:none}#savedToggle{font-size:.8rem;padding:.5rem}.layout{display:block;padding-bottom:250px}.library{padding:1rem;border-right:0;border-bottom:1px solid var(--line)}.library .section-head{margin:0 0 .5rem}.surah-list{max-height:145px}.surah-option{min-height:54px}.library .quiet{margin:.4rem 0}main{padding:1.5rem 1rem}.heading{margin-bottom:1.25rem}.feature{padding:1.5rem;margin-bottom:1.5rem}.feature h2{font-size:1.6rem}.player{grid-template-columns:1fr 85px;padding:.75rem 1rem max(.5rem,env(safe-area-inset-bottom));gap:.4rem .75rem}.track{grid-column:1}.controls{grid-column:1/-1;grid-row:2}.speed{grid-row:1;grid-column:2;margin:0}.speed select{min-height:44px;padding:.3rem}.track span{font-size:.75rem}.transport{gap:1.5rem}.transport button{min-height:46px}.player>p{font-size:.72rem}.source-note{margin-top:1.5rem}}
@media(prefers-reduced-motion:no-preference){button{transition:background-color .15s ease,border-color .15s ease}}
.main-nav{padding:2rem 1rem;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:.75rem}.main-nav button{display:flex;align-items:center;gap:1rem;min-height:64px;text-align:left;font-size:1.1rem;border-color:transparent;background:transparent}.main-nav button[aria-current=page]{background:var(--tint);border-color:#adbdaf;font-weight:600}.main-nav button>span{font-size:1.6rem;line-height:1}.main-nav small{margin-left:auto}.surah-list{max-height:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:1.25rem}.surah-option{min-height:72px;border-color:var(--line);background:var(--surface)}button{min-height:48px}#heroPlay{display:block;min-height:56px;padding:.75rem 1.5rem;font-size:1.05rem;margin:1.5rem 0 1rem}.settings{max-width:640px}.settings select{margin-bottom:.75rem}.settings h2{margin-top:2rem}.settings p{font-size:.9rem}.player{grid-template-columns:minmax(150px,1fr) minmax(220px,1.5fr) auto}#expandPlayer{align-self:center}.topbar>.quiet{font-size:.75rem}dialog{width:min(640px,calc(100vw - 2rem));padding:1.5rem;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);max-height:90dvh;overflow-y:auto}dialog::backdrop{background:#102b24b3}#closePlayer{display:block;margin-left:auto}dialog .player{position:static;display:flex;flex-direction:column;gap:2rem;border:0;padding:2rem .5rem;box-shadow:none}dialog .track{text-align:center}dialog .track strong{font:2.3rem Georgia,serif;margin-bottom:1rem}dialog .track span{font-size:1rem}dialog .track small{margin-top:.5rem}dialog .controls{width:100%}dialog .transport button{min-height:64px;font-size:1.2rem}dialog .timeline{margin-top:1.5rem}dialog .player>p{font-size:1rem;text-align:center}
@media(max-width:900px){.layout{grid-template-columns:190px minmax(0,1fr)}.main-nav button{font-size:.95rem}.surah-list{grid-template-columns:1fr}}
@media(max-width:600px){.layout{display:block;padding-bottom:300px}.main-nav{position:fixed;bottom:0;z-index:7;left:0;width:100%;flex-direction:row;gap:.15rem;padding:.35rem .5rem max(.35rem,env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--line)}.main-nav button{flex:1;flex-direction:column;justify-content:center;gap:.15rem;min-width:0;min-height:60px;font-size:.7rem;padding:.3rem .1rem;border-radius:6px}.main-nav button>span{font-size:1.3rem}.main-nav small{display:none}.player{bottom:72px;grid-template-columns:1fr auto;padding:.7rem 1rem .35rem}.controls{grid-column:1/-1}.track{grid-column:1}#expandPlayer{grid-column:2;grid-row:1;font-size:.75rem;padding:.4rem .6rem}.surah-list{max-height:none}.track small{display:none}.topbar{min-height:80px}.player .transport button{min-height:48px}.player>p:empty{display:none}.player .timeline input{min-height:30px}.feature{margin-bottom:1.5rem}dialog .player{position:static}.main-nav button:focus-visible{outline-offset:0}}
dialog .player .transport button{min-height:64px}.track span{font-size:14px}
@media(max-width:600px){.main-nav button{font-size:13px}.main-nav{height:calc(76px + env(safe-area-inset-bottom));padding-bottom:max(6px,env(safe-area-inset-bottom))}.player{bottom:calc(76px + env(safe-area-inset-bottom))}.track span{font-size:14px}.topbar>.quiet{font-size:12px}.brand small{font-size:10px}}

/* Listening surfaces share one player and one source of playback state. */
.listening-surfaces{margin:0 0 2rem;padding:1.5rem;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.surface-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}.surface-heading h2{font:1.5rem Georgia,serif;margin:0}.surface-heading .eyebrow{color:var(--muted)}
.lock-card{display:flex;align-items:center;gap:1.2rem;padding:1.25rem;background:#e8eee7;border-radius:12px}.lock-card img{flex-shrink:0;border-radius:8px;width:96px;height:96px}.lock-card>div{min-width:0}.lock-card h3{font:1.5rem Georgia,serif;margin:0 0 .35rem;overflow-wrap:anywhere}.lock-card p{margin:0 0 .25rem}.lock-card .eyebrow{font-size:.6rem}.surface-caption{font-size:.72rem;color:var(--muted)}
#lockSupport,.surface-help{font-size:.85rem;margin-top:1rem}.surface-help summary{cursor:pointer;display:list-item;min-height:44px}.surface-help p{color:var(--muted)}
.lock-verse{font:clamp(1.4rem,3.6vw,2rem)/1.55 Georgia,serif;margin:1.25rem 0 .75rem;white-space:pre-line;overflow-wrap:anywhere}.verse-source{font-size:.75rem;color:var(--muted);margin-bottom:0}
dialog.car-player{width:min(900px,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);background:#102b26;color:#fffdf4;border-color:#55796c;padding:clamp(1rem,3vw,2rem);color-scheme:dark}
.car-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem}.car-header .eyebrow{color:#c3d3c8;margin-bottom:.25rem}.car-header h2{margin:0}.car-player button{background:#24463b;color:#fffdf4;border-color:#6b8878;min-height:64px}.car-player button:hover{background:#365d4e}.car-player button:disabled{opacity:.5}.car-player button:focus-visible{outline-color:#e4d4ad}.car-now{display:flex;align-items:center;gap:2rem;margin-bottom:1.5rem}.car-now img{width:150px;height:150px;border-radius:12px}.car-now>div{min-width:0}.car-now h3{font:clamp(1.8rem,5vw,3rem)/1.15 Georgia,serif;margin:0 0 .7rem;overflow-wrap:anywhere}.car-now .eyebrow{color:#e4d4ad}.car-now p{margin-bottom:.5rem}#carProgress{font-size:.85rem;color:#c3d3c8;font-variant-numeric:tabular-nums}.car-transport{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:1rem}.car-transport button{min-height:80px;font-size:1.2rem}.car-player .car-primary{background:#e4d4ad;color:#102b26;border-color:#e4d4ad;font-weight:600}.car-player .car-primary:hover{background:#f4e6c5}.car-secondary{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}#carStatus{margin:1rem 0;color:#ffe0a5}#carStatus:empty{display:none}#carNote{font-size:.75rem;color:#c3d3c8;margin:1.25rem 0 0}
@media(max-width:600px){.listening-surfaces{padding:1rem}.surface-heading button{width:100%}.lock-card{padding:.8rem;gap:.8rem}.lock-card img{width:72px;height:72px}.lock-card h3{font-size:1.25rem}.lock-card p:not(.eyebrow){font-size:.8rem}.car-header{align-items:flex-start}.car-header .eyebrow{font-size:.55rem}.car-header button{font-size:.8rem;padding:.5rem}.car-now{gap:1rem}.car-now img{width:80px;height:80px}.car-now h3{font-size:1.7rem}.car-now p{font-size:.85rem}.car-transport{gap:.5rem;grid-template-columns:1fr 1.2fr 1fr}.car-transport button{font-size:1rem;padding:.4rem}.car-secondary{gap:.5rem}.car-secondary button{font-size:.85rem;padding:.5rem}}
@media(max-height:500px) and (min-width:601px){dialog.car-player[open]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:.7rem 1.2rem;padding:1rem}.car-header{grid-column:1/-1;margin:0}.car-header button{min-height:48px}.car-now{grid-row:2/4;align-self:center;margin:0}.car-now img,.car-now .eyebrow{display:none}.car-now h3{font-size:1.8rem}.car-transport{grid-column:2;gap:.5rem}.car-transport button{min-height:64px;font-size:1rem;padding:.4rem}.car-secondary{grid-column:2;margin:0;gap:.5rem}.car-secondary button{font-size:.85rem;padding:.4rem}#carNote,#carStatus{grid-column:1/-1;margin:0}#carRetry{grid-column:2}}
/* Integrated listening edition: larger labels and uncluttered navigation. */
.player-feedback{grid-column:1/-1;display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;color:var(--warning);font-size:.85rem}.player-feedback p{flex:1;min-width:0;margin:0}.player-feedback:has(p:empty):has(button[hidden]){display:none}#retry{flex-shrink:0}.verse:focus{outline:3px solid #9b6825;outline-offset:4px}.verse{scroll-margin-block:1rem 340px}dialog .player-feedback{justify-content:center;width:100%}
:root{font-size:17px}.notice.available{background:var(--tint);color:var(--ink);border-color:var(--accent)}
.check-row{display:flex;align-items:center;gap:.75rem;min-height:56px;font-size:1rem;cursor:pointer}.check-row input{width:24px;height:24px;min-height:24px;accent-color:var(--accent)}
.main-nav{align-self:start;position:sticky;top:0}.main-nav button{min-height:64px}.verse .verse-text{white-space:pre-line}.surah-option small,.track span{font-size:.85rem}.timeline{font-size:.8rem}.timeline input{min-height:44px}
:root[data-text-size=large]{font-size:20px}
@media(max-width:600px){.main-nav{position:fixed;top:auto}.main-nav button{font-size:.76rem;min-height:64px}.player{bottom:calc(77px + env(safe-area-inset-bottom))}.layout{padding-bottom:340px}.brand{font-size:1.08rem}.topbar>.quiet{font-size:.7rem}.feature{padding:1.35rem}.player .transport button{min-height:56px}.player .timeline input{min-height:36px}.track span{font-size:.8rem}.main-nav button>span{font-size:1.35rem}#heroPlay{width:100%}dialog .player{bottom:auto}:root[data-text-size=large] .main-nav button{font-size:.67rem}}

.offline-panel{margin:1.5rem 0;padding:1.25rem;border:1px solid var(--line,#cbd4cb);border-radius:14px;background:var(--paper,#fffdf6)}.offline-panel h2{font-size:1.35rem}.offline-panel progress{width:100%;height:16px;accent-color:#183d36}.offline-actions{display:flex;flex-wrap:wrap;gap:.6rem}.offline-panel details{margin-top:1rem}.offline-panel summary{cursor:pointer;min-height:44px}#downloadList>div{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid #d6ded5;padding:.8rem 0}#downloadList p{margin:0}@media(max-width:600px){#downloadList>div{align-items:flex-start;flex-direction:column}}