html[data-theme="light"]{--bg:#F6F6F4!important;--surface:#FFFFFF!important;--teal:#0B8694!important;--dark:#0B8694!important;--mint:#0B8694!important}
html[data-theme="light"] body,html[data-theme="light"] .app-shell{background:#F6F6F4!important}
html[data-theme="light"] :is(.card,.tile,.visual-tile,.settings-card,#nav){background:#FFFFFF!important}

html[data-theme]:not([data-theme="light"])[data-palette="0"]{--night-bg:#121416!important;--night-shell:#121416!important;--night-card:#1E2225!important;--night-raised:#2B3135!important;--night-soft:#2B3135!important;--night-line:#3C454B!important;--night-ink:#F2F5F6!important;--night-muted:#B2BEC5!important;--night-accent:#55C4CE!important;--night-accent-ink:#121416!important;--night-selected:#2B3135!important;--night-bar:#1E2225!important;--night-ring:#3C454B!important;--night-hero:#2B3135!important;}

html[data-theme]:not([data-theme="light"])[data-palette="1"]{--night-bg:#0C1422!important;--night-shell:#0C1422!important;--night-card:#152338!important;--night-raised:#20334D!important;--night-soft:#20334D!important;--night-line:#324963!important;--night-ink:#F1F5FC!important;--night-muted:#B4C4D9!important;--night-accent:#5EC9D8!important;--night-accent-ink:#0C1422!important;--night-selected:#20334D!important;--night-bar:#152338!important;--night-ring:#324963!important;--night-hero:#20334D!important;}
html[data-theme]:not([data-theme="light"])[data-palette="2"]{--night-bg:#101C2A!important;--night-shell:#101C2A!important;--night-card:#1B2D40!important;--night-raised:#283F55!important;--night-soft:#283F55!important;--night-line:#3B556C!important;--night-ink:#F2F7FC!important;--night-muted:#B6CBDB!important;--night-accent:#64CFDC!important;--night-accent-ink:#101C2A!important;--night-selected:#283F55!important;--night-bar:#1B2D40!important;--night-ring:#3B556C!important;--night-hero:#283F55!important;}






.palette-picker{margin:14px 0 30px;border:1px solid var(--line);border-radius:18px;padding:16px;background:var(--surface)}
.palette-picker summary{cursor:pointer;font-weight:700;min-height:32px}.palette-picker summary span{font-size:13px;font-weight:400;margin-inline-start:12px}.palette-picker>p{font-size:14px;margin-block:12px}
.palette-list{display:grid;gap:14px;margin:16px 0}.palette-option{border:1px solid var(--line);border-radius:14px;overflow:hidden;min-width:0}
.palette-choice{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:16px;background:var(--sample-bg)!important;color:var(--sample-ink)!important;text-align:right;border:2px solid transparent;border-radius:12px}
.palette-choice[aria-pressed="true"]{border-color:var(--sample-accent)}.palette-check{color:var(--sample-accent);font-weight:bold}.palette-sample{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.palette-sample i{grid-column:1/-1;background:var(--sample-accent);height:8px;width:45%;border-radius:5px}.palette-sample b{height:30px;border-radius:8px;background:var(--sample-card)}
.palette-codes{padding:12px 16px;display:grid;gap:6px;font-size:12px}.palette-codes>div{display:flex;justify-content:space-between;gap:10px}.palette-codes code{font-family:monospace;user-select:all;font-size:12px;color:inherit}.palette-picker>.secondary{width:100%;min-height:44px}

html[data-theme]:not([data-theme="light"])[data-palette="3"]{--night-bg:#090c0e!important;--night-shell:#0e1214!important;--night-card:#181f22!important;--night-raised:#222b2f!important;--night-soft:#1b3032!important;--night-line:#303c41!important;--night-ink:#edf5f6!important;--night-muted:#a5b6bd!important;--night-accent:#76d2cc!important;--night-accent-ink:#091f20!important;--night-selected:#203a38!important;--night-bar:#111719f5!important;--night-ring:#38484a!important;--night-hero:#182b2b!important;}



/* Selected prayer: keep a dark surface with legible text in every palette. */
html[data-theme]:not([data-theme="light"]) body #prayer-list .prayer-row.active{background:var(--night-selected)!important;border-color:var(--night-accent)!important;box-shadow:none!important;color:var(--night-ink)!important}
html[data-theme]:not([data-theme="light"]) body #prayer-list .prayer-row.active :is(strong,.time){color:var(--night-ink)!important}
html[data-theme]:not([data-theme="light"]) body #prayer-list .prayer-row.active :is(.prayer-symbol,.bell-button){color:var(--night-accent)!important}
html[data-theme]:not([data-theme="light"]) body #prayer-list .prayer-row.active .bell-button{background:transparent!important;border-color:var(--night-line)!important}