/* Personal Finance 2.3 — five complete themes. Warm is the default.
   Warm tones are an approximate recreation of the 1.0 palette pending exact reference. */
:root[data-theme="warm"]{
  --bg: #F7F2EA;
  --panel: #FFFCF8;
  --panel2: #EFE5D9;
  --border: #D7C9BA;
  --text: #302820;
  --muted: #75685D;
  --mint: #765540;
  --mint-dark: #E8D9C8;
  --red: #B44948;
  --amber: #916516;
  --blue: #52789B;
  --positive: #27805C;
  --sidebar: #F2EADF;
  --bottom-bg: #F6EEE4F2;
  --nav-bg: #E6D4C1;
  --nav-text: #563923;
  --field-bg: #FFFCF8;
  --field-border: #CBB9A7;
  --button-ink: #FFF9F3;
  --button-hover: #65442F;
  --balance-from: #E4D0B7;
  --balance-to: #F2E4D4;
  --balance-border: #C9AE92;
  --balance-text: #30271F;
  --balance-muted: #665344;
  --tab-bg: #F1E7DC;
  --tab-active: #DFCCB7;
  --tab-text: #513824;
  --amount-from: #F1E5D7;
  --amount-to: #F9F0E4;
  --amount-border: #D2BCA6;
  --currency-bg: #E5D4C1;
  --currency-text: #5B402B;
  --backdrop: #38271F77;
  --label: #765A43;
  --selected-ring: #AA8561;
  --notice-bg: #FFF5E5;
  --notice-border: #D2B579;
  color-scheme:light;
}
:root[data-theme="emerald"]{
  --bg: #0C1916;
  --panel: #15271F;
  --panel2: #1F382E;
  --border: #325242;
  --text: #EBF7EF;
  --muted: #A2BAAE;
  --mint: #A8EBC2;
  --mint-dark: #244A36;
  --red: #FF998D;
  --amber: #F0C98C;
  --blue: #A3C8DB;
  --positive: #A8EBC2;
  --sidebar: #11231D;
  --bottom-bg: #11241EF2;
  --nav-bg: #234635;
  --nav-text: #BDF7D5;
  --field-bg: #10241D;
  --field-border: #406552;
  --button-ink: #123222;
  --button-hover: #C4F6D8;
  --balance-from: #204C39;
  --balance-to: #173729;
  --balance-border: #3E7455;
  --balance-text: #EDF9F2;
  --balance-muted: #BEDDCA;
  --tab-bg: #10231D;
  --tab-active: #285740;
  --tab-text: #C8FFE0;
  --amount-from: #193D2F;
  --amount-to: #132E29;
  --amount-border: #41715B;
  --currency-bg: #2A5941;
  --currency-text: #C6F2D7;
  --backdrop: #040B09C4;
  --label: #B0D8BF;
  --selected-ring: #80DCAA;
  --notice-bg: #3A3324;
  --notice-border: #69583D;
  color-scheme:dark;
}
:root[data-theme="ocean"]{
  --bg: #101B2A;
  --panel: #17283D;
  --panel2: #22374E;
  --border: #344B66;
  --text: #F1F7FF;
  --muted: #9BAFC8;
  --mint: #A8D7FF;
  --mint-dark: #284968;
  --red: #FFA5A2;
  --amber: #F0CC93;
  --blue: #B3DBFA;
  --positive: #9BE4C4;
  --sidebar: #122237;
  --bottom-bg: #12243AF2;
  --nav-bg: #27496A;
  --nav-text: #CAE7FF;
  --field-bg: #102035;
  --field-border: #3D5775;
  --button-ink: #10283F;
  --button-hover: #CCE8FF;
  --balance-from: #1F5279;
  --balance-to: #173451;
  --balance-border: #407BA7;
  --balance-text: #F0F9FF;
  --balance-muted: #C0DCEF;
  --tab-bg: #0F2235;
  --tab-active: #2B547B;
  --tab-text: #D8EFFF;
  --amount-from: #193F5A;
  --amount-to: #132D45;
  --amount-border: #497A9E;
  --currency-bg: #2A587A;
  --currency-text: #D6F0FF;
  --backdrop: #060F1BC4;
  --label: #B5D8EF;
  --selected-ring: #79BAED;
  --notice-bg: #3A3225;
  --notice-border: #74613F;
  color-scheme:dark;
}
:root[data-theme="lavender"]{
  --bg: #171525;
  --panel: #232039;
  --panel2: #322B4B;
  --border: #493F66;
  --text: #F5F1FF;
  --muted: #B5ABCA;
  --mint: #D5C1FF;
  --mint-dark: #493962;
  --red: #FFACB8;
  --amber: #F0CDAD;
  --blue: #B7C6FC;
  --positive: #B5E3CF;
  --sidebar: #1B1830;
  --bottom-bg: #1E1934F2;
  --nav-bg: #493961;
  --nav-text: #E6D9FF;
  --field-bg: #1C1930;
  --field-border: #5A4C78;
  --button-ink: #261C3A;
  --button-hover: #E7D9FF;
  --balance-from: #554378;
  --balance-to: #342948;
  --balance-border: #706295;
  --balance-text: #FFF9FF;
  --balance-muted: #DBCEEF;
  --tab-bg: #211B34;
  --tab-active: #584471;
  --tab-text: #EFE0FF;
  --amount-from: #44345D;
  --amount-to: #2B2340;
  --amount-border: #74628D;
  --currency-bg: #544170;
  --currency-text: #F0DFFF;
  --backdrop: #090715C4;
  --label: #DAC5F5;
  --selected-ring: #B798E8;
  --notice-bg: #413029;
  --notice-border: #7A5944;
  color-scheme:dark;
}
:root[data-theme="graphite"]{
  --bg: #17191B;
  --panel: #24272B;
  --panel2: #33383D;
  --border: #4B5359;
  --text: #F2F4F5;
  --muted: #B0BAC0;
  --mint: #D6DCE0;
  --mint-dark: #444E55;
  --red: #FFAAA1;
  --amber: #EBD2A1;
  --blue: #B6CBDF;
  --positive: #A9DFC0;
  --sidebar: #1D2023;
  --bottom-bg: #202428F2;
  --nav-bg: #414950;
  --nav-text: #F7F9FA;
  --field-bg: #1B2024;
  --field-border: #586269;
  --button-ink: #20252A;
  --button-hover: #EFF3F5;
  --balance-from: #424C52;
  --balance-to: #30383D;
  --balance-border: #68737A;
  --balance-text: #F8FAFB;
  --balance-muted: #D2D9DE;
  --tab-bg: #20262B;
  --tab-active: #4B565E;
  --tab-text: #FBFCFD;
  --amount-from: #343E45;
  --amount-to: #242D33;
  --amount-border: #627077;
  --currency-bg: #4A565C;
  --currency-text: #F4F6F8;
  --backdrop: #060709C4;
  --label: #D3DDE2;
  --selected-ring: #AEBBC3;
  --notice-bg: #423628;
  --notice-border: #716448;
  color-scheme:dark;
}

html,body{background:var(--bg);color:var(--text)}
.sidebar{background:var(--sidebar);border-color:var(--border)}
.nav-button.active,.bottomnav button.active{background:var(--nav-bg);color:var(--nav-text)}
.nav-button:hover{background:var(--panel2);color:var(--text)}
.bottomnav{background:var(--bottom-bg);border-color:var(--border)}
.bottomnav button{color:var(--muted)}
.brand-mark{background:var(--mint);color:var(--button-ink)}
.btn{background:var(--mint);color:var(--button-ink)}
.btn:hover{background:var(--button-hover)}
.btn.secondary{background:var(--panel2);color:var(--text);border-color:var(--border)}
.btn.secondary:hover{background:var(--nav-bg)}
.btn.danger{background:var(--panel2);border-color:var(--border);color:var(--red)}
.btn.ghost{background:transparent;color:var(--muted)}
.btn.ghost:hover{background:var(--panel2);color:var(--text)}
.pill{background:var(--panel2);border-color:var(--border);color:var(--muted)}
.pill.active{background:var(--mint-dark);border-color:var(--selected-ring);color:var(--text)}
.balance-card.main{background:linear-gradient(120deg,var(--balance-from),var(--balance-to));border-color:var(--balance-border);color:var(--balance-text)}
.balance-card.main .kicker,.balance-card.main .small{color:var(--balance-muted)}
.balance-card,.panel,.summary-card,.setup-card,dialog{background-color:var(--panel);color:var(--text);border-color:var(--border)}
.iconbox{background:var(--panel2);color:var(--text)}
.row-tools button:hover{background:var(--panel2);color:var(--text)}
.muted-chip{background:var(--panel2);color:var(--muted)}
.field input,.field select,.field textarea{background:var(--field-bg);border-color:var(--field-border);color:var(--text)}
.auth-toggle,.transaction-tabs{background:var(--tab-bg);border-color:var(--border)}
.auth-toggle button{color:var(--muted)}
.auth-toggle .selected{background:var(--tab-active);color:var(--tab-text)}
.transaction-tab{color:var(--muted)}
.transaction-tab.selected{background:var(--tab-active);color:var(--tab-text)}
.transaction-tab:hover:not(.selected){background:var(--panel2);color:var(--text)}
.transaction-amount{background:linear-gradient(160deg,var(--amount-from),var(--amount-to));border-color:var(--amount-border)}
.transaction-amount .field-label{color:var(--label)}
.transaction-amount input::placeholder{color:var(--muted)}
.transaction-amount #tx-from-amount:not([hidden]) + #tx-to-amount:not([hidden]){border-color:var(--amount-border)}
.currency-badge{background:var(--currency-bg);color:var(--currency-text)}
.transaction-advanced{border-color:var(--border)}
.transaction-advanced[open] summary{border-color:var(--border)}
.warning{background:var(--notice-bg);border-color:var(--notice-border);color:var(--amber)}
.flash{background:var(--notice-bg);border-color:var(--notice-border);color:var(--red)}
dialog::backdrop{background:var(--backdrop)}
.modal-close{background:var(--panel2);color:var(--text)}
#toast{background:var(--nav-bg);border-color:var(--border);color:var(--text)}
#toast.error{background:var(--notice-bg);border-color:var(--notice-border);color:var(--red)}
.positive{color:var(--positive)}
.negative{color:var(--red)}
.transfer{color:var(--blue)}
.theme-settings{margin-bottom:17px}
.theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:18px}
.theme-choice{background:var(--panel2);border:2px solid var(--border);border-radius:16px;padding:12px;text-align:left;display:flex;flex-direction:column;gap:7px;color:var(--text);min-height:114px;transition:border-color .12s,transform .12s}
.theme-choice:not(:disabled):hover{border-color:var(--selected-ring);transform:translateY(-1px)}
.theme-choice.selected{border-color:var(--selected-ring);box-shadow:0 0 0 1px var(--selected-ring)}
.theme-choice:disabled{opacity:.7;cursor:not-allowed}
.theme-swatches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;height:30px;width:100%;border-radius:9px;overflow:hidden;border:1px solid var(--border)}
.theme-swatch{display:block}
.theme-choice-name{font-size:14px;font-weight:750;display:flex;justify-content:space-between;align-items:center}
.theme-choice-name [aria-hidden]{color:var(--mint);font-weight:900}
.theme-choice-description{font-size:12px;color:var(--muted)}
@media(max-width:760px){.theme-grid{gap:10px}.theme-choice{min-height:106px;padding:11px}}