/* Appearance preferences are shared by every route; the original night palette stays the default. */
:root{--appearance-accent:#d4ba7d;--appearance-on-accent:#142c25;--appearance-tint:#1a3b31;--appearance-border:#577363;--page-background:radial-gradient(ellipse at 50% 43%,rgba(47,88,66,.24),transparent 58%),radial-gradient(ellipse at 90% 0,rgba(77,103,69,.09),transparent 40%),var(--bg)}
html[data-background] body{background:var(--page-background);background-attachment:fixed}
:root[data-background=olive]{--bg:#15231b;--page-background:radial-gradient(ellipse at 10% 5%,#55704733,transparent 58%),radial-gradient(ellipse at 90% 80%,#75885512,transparent 55%),var(--bg)}
:root[data-background=sand]{--bg:#25221c;--page-background:radial-gradient(ellipse at 100% 0,#8d774537,transparent 60%),radial-gradient(ellipse at 0 100%,#8c67401c,transparent 60%),var(--bg)}
:root[data-background=blue]{--bg:#111f2c;--page-background:radial-gradient(ellipse at 10% 0,#426c8738,transparent 60%),radial-gradient(ellipse at 95% 90%,#3c6a711a,transparent 55%),var(--bg)}
:root[data-background=geometry]{--bg:#0c2320;--page-background:repeating-linear-gradient(45deg,transparent 0 63px,#d4ba7d06 63px 64px),repeating-linear-gradient(-45deg,transparent 0 63px,#d4ba7d06 63px 64px),radial-gradient(ellipse at top,#36554225,transparent 65%),var(--bg)}
:root[data-theme=light]{color-scheme:light;--bg:#f5f4ed;--surface:#fffefa;--gold:#765719;--gold-bright:#204c3d;--text:#243c34;--muted:#53685e;--line:#3459432e;--appearance-accent:#315c48;--appearance-on-accent:#fffdf7;--appearance-tint:#e9efe4;--appearance-border:#a2b2a1;--light-field:#fbfcf7;--light-warning:#875017;--page-background:radial-gradient(ellipse at 90% 0,#b5ccaa26,transparent 60%),radial-gradient(ellipse at 0 80%,#d5c6971a,transparent 55%),var(--bg)}
:root[data-theme=light][data-background=olive]{--bg:#edf2e8;--page-background:radial-gradient(ellipse at 10% 0,#b3c79d3b,transparent 60%),radial-gradient(ellipse at 95% 90%,#d3d5b52b,transparent 60%),var(--bg)}
:root[data-theme=light][data-background=sand]{--bg:#f7f0e4;--page-background:radial-gradient(ellipse at 90% 0,#e3c69840,transparent 65%),radial-gradient(ellipse at 5% 90%,#e2d2b52a,transparent 65%),var(--bg)}
:root[data-theme=light][data-background=blue]{--bg:#edf3f6;--page-background:radial-gradient(ellipse at 5% 0,#aecddd38,transparent 60%),radial-gradient(ellipse at 100% 100%,#b2d4cd21,transparent 65%),var(--bg)}
:root[data-theme=light][data-background=geometry]{--bg:#f0f3ed;--page-background:repeating-linear-gradient(45deg,transparent 0 63px,#34594307 63px 64px),repeating-linear-gradient(-45deg,transparent 0 63px,#34594307 63px 64px),var(--bg)}

/* The header control and native modal keep the same spacing in either mode. */
.header{flex-wrap:wrap;padding-block:12px}.appearance-heading>div{min-width:0}.appearance-actions{flex-wrap:wrap}.appearance-mode>span{flex-wrap:wrap}
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.appearance-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 15px;border:1px solid var(--line);border-radius:999px;color:var(--gold-bright);background:var(--surface);font-size:.875rem}.appearance-trigger:hover{border-color:var(--gold)}
.appearance-trigger svg,.appearance-mode svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.appearance-dialog{width:min(calc(100% - 28px),570px);max-height:calc(100svh - 36px);overflow-y:auto;overscroll-behavior:contain;padding:26px;border:1px solid var(--appearance-border);border-radius:24px;background:var(--surface);color:var(--text);font:inherit;box-shadow:0 24px 80px #0005}.appearance-dialog::backdrop{background:#04151299;backdrop-filter:blur(5px)}
.appearance-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.appearance-dialog .appearance-eyebrow{font-size:.875rem;color:var(--muted);margin:0 0 2px}.appearance-dialog h2{font-family:ArabicDisplay,serif;font-weight:400;font-size:1.95rem;line-height:1.6;color:var(--gold-bright);margin:0}.appearance-close{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--text);font:1.5rem/1 Arial,sans-serif}
.appearance-dialog .appearance-description{font-size:.9375rem;line-height:1.9;margin:12px 0 22px;color:var(--muted)}.appearance-fieldset{border:0;padding:0;margin:0 0 22px;min-width:0}.appearance-fieldset legend{font-size:1rem;padding:0;margin-bottom:10px;color:var(--text)}.appearance-modes{display:grid;grid-template-columns:1fr 1fr;gap:12px}.appearance-mode,.appearance-background{position:relative;cursor:pointer;min-width:0}.appearance-mode input,.appearance-background input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.appearance-mode>span{display:flex;gap:10px;align-items:center;min-height:58px;border:1px solid var(--appearance-border);border-radius:13px;padding:12px 14px;color:var(--muted)}.appearance-mode .appearance-check{margin-inline-start:auto}.appearance-check{opacity:0;font-family:Arial,sans-serif;font-size:1rem}.appearance-mode input:checked+span{background:var(--appearance-tint);color:var(--gold-bright);border-color:var(--appearance-accent);box-shadow:inset 0 0 0 1px var(--appearance-accent)}.appearance-mode input:checked+span .appearance-check,.appearance-background input:checked+span .appearance-check{opacity:1}.appearance-mode input:focus-visible+span,.appearance-background input:focus-visible+span{outline:2px solid var(--gold-bright);outline-offset:4px}
.appearance-backgrounds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.appearance-choice{display:block;padding:5px;border:1px solid var(--line);border-radius:14px}.appearance-background input:checked+.appearance-choice{border-color:var(--appearance-accent);box-shadow:inset 0 0 0 1px var(--appearance-accent)}.appearance-background input:checked+.appearance-choice .appearance-background-name{color:var(--gold-bright)}.appearance-swatch{position:relative;display:block;min-height:65px;border-radius:9px;border:1px solid #ffffff12;background:radial-gradient(ellipse at top right,#355e444d,transparent),#091e1c}.appearance-swatch .appearance-check{position:absolute;inset-inline-end:7px;top:7px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;color:var(--appearance-on-accent);background:var(--appearance-accent)}.appearance-background-name{display:block;text-align:center;padding:6px 2px 3px;font-size:.875rem;line-height:1.8;color:var(--muted)}
.appearance-swatch[data-background-choice=olive]{background:radial-gradient(ellipse at top left,#5d79436b,transparent),#15231b}.appearance-swatch[data-background-choice=sand]{background:radial-gradient(ellipse at top right,#9b7c438c,transparent),#25221c}.appearance-swatch[data-background-choice=blue]{background:radial-gradient(ellipse at top left,#4c78978c,transparent),#111f2c}.appearance-swatch[data-background-choice=geometry]{background:repeating-linear-gradient(45deg,transparent 0 16px,#d4ba7d17 16px 17px),repeating-linear-gradient(-45deg,transparent 0 16px,#d4ba7d17 16px 17px),#0c2320}
:root[data-theme=light] .appearance-swatch{border-color:#34594312;background:linear-gradient(140deg,#fdfbf2,#e6eddf)}:root[data-theme=light] .appearance-swatch[data-background-choice=olive]{background:linear-gradient(140deg,#cbd8ba,#edf2e8)}:root[data-theme=light] .appearance-swatch[data-background-choice=sand]{background:linear-gradient(140deg,#e7cda4,#f7f0e4)}:root[data-theme=light] .appearance-swatch[data-background-choice=blue]{background:linear-gradient(140deg,#bdd5e2,#edf3f6)}:root[data-theme=light] .appearance-swatch[data-background-choice=geometry]{background:repeating-linear-gradient(45deg,transparent 0 16px,#34594314 16px 17px),repeating-linear-gradient(-45deg,transparent 0 16px,#34594314 16px 17px),#f0f3ed}
.appearance-dialog .appearance-status{font-size:.875rem;color:var(--muted);line-height:1.9;margin:0 0 16px}.appearance-actions{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:18px}.appearance-done{background:var(--appearance-accent);color:var(--appearance-on-accent);border:1px solid var(--appearance-accent);border-radius:11px;min-height:48px;padding:10px 30px;flex:1}.appearance-reset{background:transparent;color:var(--muted);border:0;text-decoration:underline;text-underline-offset:4px;min-height:48px;font-size:.875rem;padding:10px 5px}.appearance-dialog :focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
@media(max-width:600px){.header{gap:10px}.header-actions{gap:7px}.appearance-trigger{padding:8px 12px;gap:6px}.appearance-dialog{padding:21px 18px;border-radius:20px}.appearance-backgrounds{grid-template-columns:1fr 1fr;gap:10px}.appearance-background:last-child{grid-column:1/-1}.appearance-background:last-child .appearance-swatch{min-height:45px}.appearance-dialog h2{font-size:1.7rem}}
@media(max-width:420px){.header-actions .sound-toggle{width:44px;min-width:44px;padding:10px;justify-content:center}.header-actions .sound-toggle span{display:none}.appearance-trigger{padding-inline:11px}.appearance-actions{gap:10px}.appearance-done{padding-inline:20px}}
@media(max-height:650px){.appearance-dialog{max-height:calc(100svh - 20px);padding:18px}.appearance-fieldset{margin-bottom:16px}.appearance-dialog .appearance-description{margin-block:8px 16px}.appearance-swatch{min-height:45px}}

/* Light surfaces and text replace the fixed night colors used by existing sections. */
:root[data-theme=light] :is(.category-card,.reader-card,.dua-card,.surah-card,.verse-result,.account-stat,.cal-stats>div,.cal-reading,.custom-choice){background:var(--surface);border-color:var(--line)}
:root[data-theme=light] :is(.site-nav,.custom-panel,.verse-search-form,.account-card,.cal-panel,.cal-hasanat,.khatma-entry,.plan-today,.adhkar-listening){background:linear-gradient(140deg,var(--surface),#edf2e7);border-color:var(--line);box-shadow:0 10px 30px #2b453009}
:root[data-theme=light] :is(.mushaf,.quran-player,.cal-dialog){background:var(--surface);border-color:var(--line);box-shadow:0 8px 32px #2b453010}
:root[data-theme=light] :is(.counter,.daily-count){background:radial-gradient(circle at 45% 20%,#fffdf3,#e7eddd);border-color:var(--appearance-border);box-shadow:0 0 0 7px #6a865810,0 12px 32px #2b45300e}
:root[data-theme=light] :is(.counter:hover,.counter-wrap.complete .counter){box-shadow:0 0 0 7px #6a865815,0 12px 32px #2b45300e;border-color:var(--gold)}
:root[data-theme=light] .daily-count.is-complete{background:#e2eddc}
:root[data-theme=light] :is(.count,.account-intro h1,.account-card h2,.cal-intro h1,.cal-guest h2,.cal-month-head h2,.cal-detail-head h2,.cal-hasanat h2,.cal-hasanat-total>strong,.cal-hasanat-periods strong,.cal-reading-head>strong,.cal-stats strong,.account-stat strong,.adhkar-listen-heading h2,.cal-explainer h2){color:var(--gold-bright)}
:root[data-theme=light] :is(.sound-toggle,.count-caption,.reset-button,.voice-transcript,.reading-note,.account-main label,.cal-section-title h2,.cal-icon-button,.cal-today,.cal-dhikr h3,.cal-reading h3,.cal-dialog legend,.cal-field,.cal-goal-checks label,.cal-manual-types label,.cal-tasbih,.adhkar-listen-selects label,.cal-hasanat-total>span,.cal-hasanat-periods span){color:var(--text)}
:root[data-theme=light] :is(.footer,.session-footer svg,kbd,.account-intro>p:last-child,.account-card p,.account-tabs button,.account-optional,.account-main small,.account-profile bdi,.account-stat,.cal-section-title>span,.cal-stats span,.cal-stats small,.cal-overline,.cal-weekdays,.cal-legend,.cal-month-note,.cal-goal-line,.cal-dhikr small,.cal-reading p,.cal-reading-record,.cal-empty,.cal-explainer p,.cal-dialog p,.cal-dialog small,.cal-hasanat-heading .cal-overline,.cal-hasanat h2 span,.cal-hasanat-total p,.cal-hasanat-periods small,.cal-hasanat-actions p,.cal-hasanat-method,.adhkar-listen-heading .section-kicker,.adhkar-listen-tag,.adhkar-listen-progress,.adhkar-listen-status p,.adhkar-listen-footer p){color:var(--muted)}
:root[data-theme=light] .account-footnote{color:var(--muted)!important}
:root[data-theme=light] :is(.account-main .quiet-link,.cal-intro .secondary-action,.cal-reading-link,.cal-inline-action,.cal-add,.cal-target-tag,.cal-hasanat-rate,.cal-hasanat-method summary,.cal-hasanat-method a,.adhkar-listen-status button,.adhkar-listen-icon){color:var(--gold)}
:root[data-theme=light] .cal-hasanat-method blockquote{color:var(--text)}
:root[data-theme=light] :is(.account-main input,.custom-panel textarea,.plan-fields input,.plan-dialog-field input,.cal-field input:not([type=checkbox]),.cal-field select,.adhkar-listen-selects select,.quran-search input,.quran-ayah-select select,.reciter-label select,.tafsir-picker select,.verse-search-input input,.bookmark-filter input,.bookmark-dialog input){color-scheme:light;background:var(--light-field);color:var(--text);border-color:var(--appearance-border)}
:root[data-theme=light] input::placeholder,:root[data-theme=light] textarea::placeholder{color:#68796c;opacity:1}
:root[data-theme=light] :is(.duration-options span,.playback-modes span,#playerMode){border-color:var(--appearance-border)}
:root[data-theme=light] :is(.primary-action,.adhkar-listen-controls .primary-action,.voice-toggle[aria-pressed=true],.reset-button.restart){background:var(--appearance-accent);border-color:var(--appearance-accent);color:var(--appearance-on-accent)}
:root[data-theme=light] :is(.primary-action:hover,.adhkar-listen-controls .primary-action:hover,.voice-toggle[aria-pressed=true]:hover,.reset-button.restart:hover){background:#244a39;color:var(--appearance-on-accent)}
:root[data-theme=light] .site-nav a[aria-current]{background:#315c48;border-color:#315c48;color:#fffdf7;box-shadow:0 3px 12px #315c4815}
:root[data-theme=light] .site-nav .calendar-nav:not([aria-current]){background:#e2eadb;color:var(--gold-bright)}
:root[data-theme=light] :is(.adhkar-listen-controls .secondary-action,.sound-toggle,kbd,.cal-day-state){background:var(--appearance-tint);color:var(--text);border-color:var(--line)}
:root[data-theme=light] :is(.account-tabs button[aria-pressed=true],.cal-filters button[aria-pressed=true],.cal-day-state[data-state=complete],.cal-hasanat-actions button,.cal-dialog .cal-manual-estimate){background:var(--appearance-tint);color:var(--gold-bright);border-color:var(--appearance-border)}
:root[data-theme=light] :is(.account-notice,.cal-notice){background:#e9eee2;color:var(--gold-bright);border-color:var(--line)}
:root[data-theme=light] :is(.sound-error,.voice-status[data-state=error],.audio-notice,.storage-notice,.account-sync[data-state=error],.account-sync[data-state=pending],.account-notice[data-error=true],.cal-notice[data-error=true],.cal-dialog .cal-form-notice,.adhkar-listening[data-state=error] [data-listen=status]){color:var(--light-warning)}
:root[data-theme=light] #planDialogError{color:#a53c35}
:root[data-theme=light] .plan-schedule .is-done small{color:#2c6945}
:root[data-theme=light] .cal-filters{background:#e8eee4;border-color:var(--line)}
:root[data-theme=light] .cal-filters button{color:var(--muted)}
:root[data-theme=light] .cal-day{background:#f6f8f1;color:var(--text);border-color:var(--line)}
:root[data-theme=light] .cal-day[data-state=partial]{background:#e1edd9;color:#2a4935;border-color:#88a77d}
:root[data-theme=light] .cal-day[data-state=complete]{background:#315c48;color:#fffdf7;border-color:#315c48}
:root[data-theme=light] .cal-day[aria-current=date]:before{background:var(--gold)}
:root[data-theme=light] .cal-day[data-state=complete][aria-current=date]:before{background:#fffdf7}
:root[data-theme=light] .cal-day .cal-indicator{background:#789575}
:root[data-theme=light] :is(.cal-day[data-state=partial] .cal-indicator,.cal-legend .is-partial){background:#668b57;border-color:#668b57}
:root[data-theme=light] .cal-day[data-state=complete] .cal-indicator{background:#e5eddf}
:root[data-theme=light] .cal-legend .is-complete{background:#315c48}
:root[data-theme=light] .cal-legend .is-empty{border-color:#70886e}
:root[data-theme=light] .cal-dhikr[data-done=true] .cal-status-mark{color:#315c48;background:#e1edd9;border-color:#88a77d}
:root[data-theme=light] :is(progress,.cal-progress){background:#dfe7d8}
:root[data-theme=light] progress::-webkit-progress-bar{background:#dfe7d8}
:root[data-theme=light] progress::-webkit-progress-value{background:#54744b}
:root[data-theme=light] progress::-moz-progress-bar{background:#54744b}
:root[data-theme=light] :is(.adhkar-listen-progress input,.audio-progress input){accent-color:#315c48}
:root[data-theme=light] .adhkar-listening :focus-visible{outline-color:var(--gold-bright)}
:root[data-theme=light] .dial-track{stroke:#456c3f26}:root[data-theme=light] .tick{stroke:#456c3f44}:root[data-theme=light] .tick.active{stroke:var(--gold-bright)}
:root[data-theme=light] .quiet-reading .reader-card{background:transparent}

/* rem-based minimums allow the settings to reflow when text is enlarged. */
.appearance-dialog{max-width:calc(100% - 28px)}
.appearance-modes{grid-template-columns:repeat(auto-fit,minmax(min(100%,8.5rem),1fr))}
.appearance-backgrounds{grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr))}
.appearance-mode>span{gap:8px;padding-inline:10px}
.appearance-reset{flex:1 1 10rem;overflow-wrap:anywhere}
.appearance-done{flex:1 1 5rem}
.page-shell>*,.header>.brand{min-width:0}
.site-nav a,.category-card h2{overflow-wrap:anywhere}