/* Color theme and light/dark mode are independent root attributes. */
html[data-color-theme="neutral"]{--bg:#f6f6f6;--paper:#fff;--ink:#262626;--muted:#6b6b6b;--line:#e4e4e4;--green:#525252;--green-dark:#333;--mint:#ededed;--primary-ink:#fff;--shadow:0 5px 24px rgba(0,0,0,.045)}
html[data-color-theme="neutral"][data-theme="dark"]{--bg:#151515;--paper:#232323;--ink:#ededed;--muted:#b0b0b0;--line:#414141;--green:#d2d2d2;--green-dark:#ededed;--mint:#363636;--primary-ink:#171717;--shadow:0 5px 24px rgba(0,0,0,.15)}
html[data-color-theme="blue"]{--bg:#f4f6fa;--paper:#fff;--ink:#263447;--muted:#5d6e82;--line:#e3e9f1;--green:#3569a6;--green-dark:#244f82;--mint:#e8f0fa;--primary-ink:#fff;--shadow:0 5px 24px rgba(36,65,101,.045)}
html[data-color-theme="purple"]{--bg:#f7f5fa;--paper:#fff;--ink:#383044;--muted:#796987;--line:#eae4ef;--green:#79549a;--green-dark:#5b3b78;--mint:#f0e9f7;--primary-ink:#fff;--shadow:0 5px 24px rgba(78,49,101,.045)}
html[data-color-theme="orange"]{--bg:#faf6f2;--paper:#fff;--ink:#453429;--muted:#806b5b;--line:#eee5dd;--green:#a85522;--green-dark:#834018;--mint:#f9ecdf;--primary-ink:#fff;--shadow:0 5px 24px rgba(109,64,31,.045)}
html[data-color-theme="blue"][data-theme="dark"]{--bg:#121820;--paper:#1c2734;--ink:#e1eaf5;--muted:#a6b6cb;--line:#36485f;--green:#8ebcf0;--green-dark:#bad7f8;--mint:#283e59;--primary-ink:#10253d;--shadow:0 5px 24px rgba(0,0,0,.15)}
html[data-color-theme="purple"][data-theme="dark"]{--bg:#19151f;--paper:#282130;--ink:#eee4f6;--muted:#beaecb;--line:#4b3b5a;--green:#c5a3e3;--green-dark:#ddc4f2;--mint:#423052;--primary-ink:#2c173e;--shadow:0 5px 24px rgba(0,0,0,.15)}
html[data-color-theme="orange"][data-theme="dark"]{--bg:#1e1712;--paper:#30251d;--ink:#f4e7dd;--muted:#c7b2a2;--line:#574333;--green:#efb17d;--green-dark:#f4cfac;--mint:#513822;--primary-ink:#351e0c;--shadow:0 5px 24px rgba(0,0,0,.15)}
html[data-color-theme]:not([data-color-theme="green"]) .topbar{background:var(--paper)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.brand-mark,.empty-icon,.secondary,.soft-tag,.summary-main,.recorder-name,.recurring-settings,.ocr-details){background:var(--mint);color:var(--green-dark);border-color:var(--line)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.primary,.topbar nav .nav-add){background:var(--green);color:var(--primary-ink)}
html[data-color-theme]:not([data-color-theme="green"]) .primary:hover{background:var(--green-dark)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.settings-tabs a:hover,.settings-tabs a[aria-current="page"]){background:var(--mint);color:var(--green-dark)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.eyebrow,.back-link,.month-arrow,.current-user,.settings-tabs a,.topbar nav a,.link-button,.summary-label,.summary-foot,.budget-remaining,.budget-title span,.tx-main span,.tx-actions a,footer){color:var(--muted)}
html[data-color-theme]:not([data-color-theme="green"]) .topbar nav .nav-add{color:var(--primary-ink)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.form-stack label,.field-label,.budget-edit-row label,.recurring-field,.recurring-toggle,.category-color-control label){color:var(--ink)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.input,.form-stack input,.form-stack select,.form-stack textarea,.category-color-control select,.year-select select){background:var(--bg);border-color:var(--line);color:var(--ink)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.input:focus,.form-stack input:focus,.form-stack select:focus,.category-color-control select:focus){outline-color:var(--mint);border-color:var(--green)}
html[data-color-theme]:not([data-color-theme="green"]) :is(.budget-row,.transaction-row,.plan-budget-row,.plan-item,.stats-row,.simple-stats>div,.fixed-plan-setting){border-color:var(--line)}
html[data-color-theme]:not([data-color-theme="green"]) .progress{background:var(--line)}
html[data-color-theme]:not([data-color-theme="green"]) .progress span:not(.over){background:var(--green)}
/* Keep category colors and income/expense indicators independent of the UI theme. */
html[data-color-theme]:not([data-color-theme="green"]) .tx-main .category-badge{background:var(--category-bg);color:var(--category-ink)}
html[data-color-theme]:not([data-color-theme="green"]) .tx-main .scope-badge{color:var(--ink)}
.color-theme-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.color-theme-option{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:90px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:12px;cursor:pointer}.color-theme-option[aria-pressed="true"]{border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green);background:var(--mint)}.color-theme-option:focus-visible{outline:2px solid var(--green);outline-offset:3px}.color-theme-swatch{width:29px;height:29px;border-radius:50%;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--line)}.theme-swatch-green{background:#2e795d}.theme-swatch-blue{background:#3569a6}.theme-swatch-purple{background:#79549a}.theme-swatch-orange{background:#a85522}.theme-settings [data-color-theme-status]:empty{display:none}@media(max-width:400px){.color-theme-options{grid-template-columns:repeat(2,minmax(0,1fr))}}

.theme-swatch-neutral{background:linear-gradient(135deg,#fff 50%,#888 50%)}@media(min-width:401px) and (max-width:540px){.color-theme-options{grid-template-columns:repeat(3,minmax(0,1fr))}}