/* Final palette and contrast repairs, after all component styles. */
html[data-theme="light"]{color-scheme:light;--cream:#faf7ef;--ink:#233c35;--green:#173f36;--muted:#536458;--line:#d0d7c8;--paper:#fffdf6}
html[data-theme="dark"],:is(html[data-theme="dark"] body,body.night-theme){color-scheme:dark;--cream:#102b2b;--ink:#edf0df;--green:#bddbc4;--muted:#c1cfbd;--line:#56735e;--paper:#193b33}
#themeToggle{width:44px;min-width:44px;height:44px;min-height:44px;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:var(--paper);padding:10px}
#themeToggle svg{width:20px;height:20px}#themeToggle:hover{border-color:#8a713d}#themeToggle:focus-visible{outline:3px solid #ae8b42;outline-offset:3px}
.appearance-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0}.appearance-options button{display:grid;gap:8px;border:1px solid var(--line);border-radius:16px;padding:20px 14px;text-align:left;background:var(--paper);color:var(--ink);min-height:130px}.appearance-options b{font-size:1rem}.appearance-options small{font-size:.875rem;line-height:1.6;color:var(--muted)}.appearance-options button[aria-pressed="true"]{border:2px solid #85682f;background:#e9eedf}.appearance-options button:focus-visible{outline:3px solid #ae8b42;outline-offset:3px}.appearance-current{font-size:.875rem;color:var(--muted);line-height:1.8}.appearance-schedule{border-top:1px solid var(--line);padding-top:20px;font-size:1rem}
body input,body textarea,body select{color:var(--ink)}body input::placeholder,body textarea::placeholder{color:var(--muted);opacity:1}.picture .tag{color:#233c35}.posture-art figcaption{color:#153e35}body.reading-focus.night-theme main{background:#102b2b}
:is(html[data-theme="dark"] body,body.night-theme) header,:is(html[data-theme="dark"] body,body.night-theme) footer,:is(html[data-theme="dark"] body,body.night-theme) .mobile-nav{background:#112e2e;color:var(--ink)}
:is(html[data-theme="dark"] body,body.night-theme) .start,:is(html[data-theme="dark"] body,body.night-theme) #toast{background:#2d5944;color:#fff7df}:is(html[data-theme="dark"] body,body.night-theme) .start:hover{background:#386b51}:is(html[data-theme="dark"] body,body.night-theme) .chip.active{background:#bddbc4;color:#102b2b}
:is(html[data-theme="dark"] body,body.night-theme) .translit,:is(html[data-theme="dark"] body,body.night-theme) .story-text,:is(html[data-theme="dark"] body,body.night-theme) .story-stepper button,:is(html[data-theme="dark"] body,body.night-theme) .under-hero,:is(html[data-theme="dark"] body,body.night-theme) .story-thumb small,:is(html[data-theme="dark"] body,body.night-theme) .atlas-intro p,:is(html[data-theme="dark"] body,body.night-theme) .atlas-legend,:is(html[data-theme="dark"] body,body.night-theme) .map-hint,:is(html[data-theme="dark"] body,body.night-theme) .person-row span,:is(html[data-theme="dark"] body,body.night-theme) .family-name-status,:is(html[data-theme="dark"] body,body.night-theme) .kin-cards article>small,:is(html[data-theme="dark"] body,body.night-theme) .atlas-relations small,:is(html[data-theme="dark"] body,body.night-theme) .atlas-index button small,:is(html[data-theme="dark"] body,body.night-theme) .mosque-status,:is(html[data-theme="dark"] body,body.night-theme) .mosque-privacy,:is(html[data-theme="dark"] body,body.night-theme) .mosque-source,:is(html[data-theme="dark"] body,body.night-theme) .mosque-picker p,:is(html[data-theme="dark"] body,body.night-theme) .mosque-results-head p,:is(html[data-theme="dark"] body,body.night-theme) .mosque-visit p,:is(html[data-theme="dark"] body,body.night-theme) .clock-home-link p,:is(html[data-theme="dark"] body,body.night-theme) .clock-week caption{color:var(--muted)}
:is(html[data-theme="dark"] body,body.night-theme) .reflection b,:is(html[data-theme="dark"] body,body.night-theme) .badge,:is(html[data-theme="dark"] body,body.night-theme) .chapter-number,:is(html[data-theme="dark"] body,body.night-theme) .welcome-number,:is(html[data-theme="dark"] body,body.night-theme) .atlas-index button>span,:is(html[data-theme="dark"] body,body.night-theme) .atlas-intro h2 em,:is(html[data-theme="dark"] body,body.night-theme) .story-stepper button.active,:is(html[data-theme="dark"] body,body.night-theme) .mobile-nav a[aria-current],:is(html[data-theme="dark"] body,body.night-theme) header nav a:hover,:is(html[data-theme="dark"] body,body.night-theme) .mosque-tag{color:#e6cc94}
:is(html[data-theme="dark"] body,body.night-theme) .story-stepper button span{background:#284b3c;color:#e5ebd5}:is(html[data-theme="dark"] body,body.night-theme) .story-stepper button.active span{background:#bddbc4;color:#143229}
:is(html[data-theme="dark"] body,body.night-theme) .surah-card:hover,:is(html[data-theme="dark"] body,body.night-theme) .path-choice:hover{background:#294d3d;color:var(--ink)}:is(html[data-theme="dark"] body,body.night-theme) .source.hadith:hover{background:#5a5037;color:#fff0cd}
:is(html[data-theme="dark"] body,body.night-theme) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),:is(html[data-theme="dark"] body,body.night-theme) textarea,:is(html[data-theme="dark"] body,body.night-theme) select{background:#15352e;color:#edf0df;border-color:#67856b}
:is(html[data-theme="dark"] body,body.night-theme) .atlas-toolbar select,:is(html[data-theme="dark"] body,body.night-theme) .atlas-directory input{background:#15352e;color:#edf0df}
:is(html[data-theme="dark"] body,body.night-theme) .quiz-options button.correct,:is(html[data-theme="dark"] body,body.night-theme) .match-item.matched{background:#345d43;color:#f0f4de;border-color:#90b080}:is(html[data-theme="dark"] body,body.night-theme) .quiz-options button.wrong{background:#633b35;color:#fff1df;border-color:#c98b74}:is(html[data-theme="dark"] body,body.night-theme) .match-item.selected{background:#5a5030;color:#fff0c8;border-color:#d6b978}
:is(html[data-theme="dark"] body,body.night-theme).kids .lesson:nth-child(n){background:#1b3d34;color:#edf0df}
:is(html[data-theme="dark"] body,body.night-theme) .notice,:is(html[data-theme="dark"] body,body.night-theme) .reader .notice{background:#204438;color:var(--muted)}:is(html[data-theme="dark"] body,body.night-theme) .profile-nav button{color:#d9e6c9}
:is(html[data-theme="dark"] body,body.night-theme) .mobile-menu-grid a{background:#193b33;color:#edf0df}:is(html[data-theme="dark"] body,body.night-theme) .mobile-menu-grid a[aria-current]{background:#34513c;color:#fff0c8}
/* These illustrated panels deliberately keep their paired dark backgrounds and light text. */
.atlas-detail .person-row,.atlas-detail .person-link{color:#f2e7ce}.atlas-detail .person-row span{color:#c5d1bd}.atlas-detail .source{background:#284b3c;color:#e9e1c6}.mosque-location .start{background:#dfc589;color:#193b30}.mosque-location .outline{color:#f5e6bf}.welcome-banner .eyebrow,.welcome-paths .eyebrow,.shahadah-panel .eyebrow,.journey-scene-banner .eyebrow{color:#e6cc94}.shahadah-panel .outline{color:#f5ead3}
@media(max-width:560px){.appearance-options{grid-template-columns:1fr}.appearance-options button{min-height:0;padding:16px}#themeToggle{width:40px;min-width:40px;height:40px;min-height:40px;padding:9px}}
@media(prefers-reduced-motion:no-preference){body,header,footer,.mobile-nav,dialog{transition:background-color .25s ease,color .25s ease}}
body.reduce,body.reduce header,body.reduce footer,body.reduce .mobile-nav,body.reduce dialog{transition:none}

:is(html[data-theme="dark"] body,body.night-theme) .cinematic-copy .gold-button,:is(html[data-theme="dark"] body,body.night-theme) .journey-banner .start{background:#dfc589;color:#193b30}:is(html[data-theme="dark"] body,body.night-theme) .mosque-location .start{background:#dfc589;color:#193b30}:is(html[data-theme="dark"] body,body.night-theme) .mosque-location .outline,:is(html[data-theme="dark"] body,body.night-theme) .shahadah-panel .outline{color:#f5ead3}

.eyebrow{color:#735d32}.translit{color:#596652}.posture-art figcaption span{color:#625333}.learning-badge{opacity:1}.learning-badge:not(.unlocked){border-style:dashed}body :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #ae8b42;outline-offset:3px}
/* Keep light illustration captions and dark genealogy panels paired in either mode. */
.posture-art figcaption p{color:#153e35}#familyDetails.atlas-detail{background:#123b35;color:#eceddd}
:is(html[data-theme="dark"] body,body.night-theme) .clock-explainer a{color:#d7e3c6}
/* Small labels need the same contrast as body copy. */
.discovery-strip span{color:#49614f}.story-thumb small{color:#735d32}.clock-home-link p{color:#53644c}.notice{color:#4c6052}.family-name-status{color:#725526}.kin-cards article>small{color:#625e4c}.map-hint{color:#52685c}
.clock-privacy,.clock-method-label,.clock-card-status{color:#526149}.clock-prayer-card small{color:#4e6247}.mosque-empty p,.mosque-google p{color:#4f6347}
#familyDetails.atlas-detail>p{color:#c5d1bd}.person-row span{color:#625e48}
.reflection b{color:#725526}
:is(html[data-theme="dark"] body,body.night-theme) .appearance-options button[aria-pressed="true"]{background:#2c4c39;color:#f5ebd3;border-color:#dbc28b}