/* FinanceFlow V4 — adaptive theme and premium, purpose-built dialogs */
:root {
  color-scheme: dark;
  --app-bg:#0b1221;--sidebar-bg:#10192b;--card-bg:#192435;--surface:#1c293b;--surface-soft:#101b2b;
  --field-bg:#101b2b;--field-border:#40506a;--ink:#edf3ff;--sub-ink:#baccdf;--quiet:#94a6bd;
  --divider:#303f56;--axis:#94a6bd;--chartline:#33445a;--donut:#192435;
  --hover:#283449;--ghost:#253247;--overlay:rgba(0,5,16,.77);--shadow:rgba(0,5,18,.42);
  --chip:#24364c;--button-text:#e5effc;--field-focus:#19c99a;--positive:#19c99a;
}
:root[data-theme="light"]{
  color:var(--ink);background:var(--app-bg);color-scheme:light;
  --app-bg:#f4f7fd;--sidebar-bg:#ffffff;--card-bg:#ffffff;--surface:#ffffff;--surface-soft:#f6f9ff;
  --field-bg:#f7f9fe;--field-border:#cbd6e6;--ink:#18283e;--sub-ink:#344862;--quiet:#62758f;
  --divider:#dce4ef;--axis:#687c97;--chartline:#e1e8f1;--donut:#ffffff;
  --hover:#ecf4fb;--ghost:#f1f5fc;--overlay:rgba(24,37,63,.55);--shadow:rgba(40,60,92,.12);
  --chip:#e9f0f8;--button-text:#273954;--field-focus:#008b72;--positive:#03886b;
  --green:#06866d;--red:#d64264;--blue:#286edf;
}
html,body{background:var(--app-bg);color:var(--ink)}
body{transition:background .25s ease,color .25s ease}
.side{background:var(--sidebar-bg);border-color:var(--divider)}
.main{color:var(--ink)}.mobile{background:var(--sidebar-bg);border-bottom:1px solid var(--divider)}
.card{background:var(--card-bg);border:1px solid var(--divider);box-shadow:0 8px 24px var(--shadow)}
.item{background:var(--surface-soft);border-color:var(--divider)}
.nav{color:var(--sub-ink)}.nav:hover,.nav.active{background:var(--hover);color:var(--ink)}
.muted,.sub,.hint,.eyebrow,.cap,.lock{color:var(--quiet)}
.eyebrow{opacity:.95}.ctitle,.value{color:var(--ink)}.value.green{color:var(--green)}.value.red{color:var(--red)}
.field{background:var(--field-bg);border-color:var(--field-border);color:var(--ink)}
.field:hover{border-color:var(--quiet)}.field:focus{outline:0;border-color:var(--field-focus);box-shadow:0 0 0 3px color-mix(in srgb, var(--field-focus) 18%,transparent)}
label{color:var(--sub-ink)}.btn{background:var(--ghost);border-color:var(--divider);color:var(--button-text)}
.btn:hover:not(:disabled){filter:brightness(1.07);border-color:var(--quiet)}.btn.primary{background:#11ad87;border-color:#11ad87;color:white}
.btn.active{color:var(--positive);border-color:var(--positive)}.entry,.table th,.table td{border-color:var(--divider)}
.pill{background:var(--chip);color:var(--sub-ink)}.readout{color:var(--sub-ink)}.legend{color:var(--quiet)}.link{color:var(--blue)}
.progress{background:var(--chip)}.authscreen{background:radial-gradient(circle at 22% 10%, color-mix(in srgb,var(--positive) 13%,transparent),transparent 43%),var(--app-bg)}
:root[data-theme="light"] .authcard{box-shadow:0 30px 65px rgba(36,58,95,.12)}
:root[data-theme="light"] .alert{background:#fff1f3;color:#9e1e48;border-color:#ffbdcc}
:root[data-theme="light"] .toast{background:#e0f7eb;color:#125842;box-shadow:0 8px 30px #153c2725}
.modalwrap{background:var(--overlay);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);animation:fade-backdrop .18s ease}
.modal{background:var(--surface);border:1px solid var(--divider);border-radius:24px;padding:0;width:min(610px,100%);box-shadow:0 28px 90px var(--shadow);overflow:auto;max-height:min(92vh,880px);animation:slide-dialog .25s cubic-bezier(.2,.7,.25,1);position:relative}
.modal:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--modal-accent,#19c99a),transparent 92%)}
.modal[data-kind="goal"]{--modal-accent:#a48aff;--modal-accent-rgb:164,138,255}
.modal[data-kind="account"]{--modal-accent:#5aa2ff;--modal-accent-rgb:90,162,255}
.modal[data-kind="transaction"]{--modal-accent:#19c99a;--modal-accent-rgb:25,201,154}
.modal[data-kind="recurring"]{--modal-accent:#46b6e8;--modal-accent-rgb:70,182,232}
.modal[data-kind="bill"]{--modal-accent:#ff8b87;--modal-accent-rgb:255,139,135}
.modal[data-kind="investment"]{--modal-accent:#31bda2;--modal-accent-rgb:49,189,162}
.modal[data-kind="budget"]{--modal-accent:#f2b554;--modal-accent-rgb:242,181,84}
.modal[data-kind="contribute"]{--modal-accent:#a48aff;--modal-accent-rgb:164,138,255}
.modalheader{display:flex;align-items:flex-start;gap:14px;padding:25px 26px 20px;background:linear-gradient(110deg,rgba(var(--modal-accent-rgb,25,201,154),.12),transparent 75%);border-bottom:1px solid var(--divider)}
.modal-icon{flex:0 0 48px;height:48px;border-radius:15px;display:grid;place-items:center;background:rgba(var(--modal-accent-rgb,25,201,154),.16);color:var(--modal-accent,#19c99a);font-size:23px;box-shadow:inset 0 0 0 1px rgba(var(--modal-accent-rgb,25,201,154),.19)}
.modal-headcopy{flex:1;min-width:0}.modal-kicker{font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:2px;color:var(--modal-accent,#19c99a);margin:2px 0 7px}
.modal h2{margin:0;font-size:23px;letter-spacing:-.65px;line-height:1.18}.modal-desc{color:var(--quiet);font-size:12px;line-height:1.65;margin:9px 0 0}
.modal-close{width:37px;height:37px;flex:0 0 37px;display:grid;place-items:center;border-radius:11px;padding:0;font-size:19px}
.modal form{padding:23px 26px 25px}.modal .formgrid{gap:14px 16px}.modal .fg{margin:0}.modal .fg label{font-weight:650;margin-bottom:8px}
.modal .field{min-height:48px;border-radius:12px;padding:11px 13px;font-weight:560;transition:box-shadow .15s ease,border-color .15s ease;background:var(--field-bg)}
.modal .field:focus{border-color:var(--modal-accent,#19c99a);box-shadow:0 0 0 3px rgba(var(--modal-accent-rgb,25,201,154),.15)}
.modal .field::placeholder{color:var(--quiet);opacity:.7}
.modal .field.is-money{text-align:left;font-size:17px;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:.18px;padding-right:55px}
.modal .money-box{position:relative}.money-box .field{width:100%}.money-unit{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;padding:4px 6px;border-radius:7px;background:var(--chip);font-size:10px;letter-spacing:.4px;font-weight:800;color:var(--quiet)}
.modal .field-help{display:block;color:var(--quiet);font-size:10px;margin:6px 0 0;line-height:1.5}
.modal .money-fg{min-width:0}.modal .form-divider{grid-column:1/-1;height:1px;background:var(--divider);margin:2px 0 0}
.modal-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:23px;border-top:1px solid var(--divider);padding-top:17px}
.modal-footer .actions{margin-left:auto}.modal-footer .btn{min-width:94px;border-radius:11px;padding:12px 18px}
.modal-footer .btn.primary{background:var(--modal-accent,#11ad87);border-color:var(--modal-accent,#11ad87);color:#091625}
.modal-footer-note{font-size:11px;color:var(--quiet);display:flex;align-items:center;gap:6px}
.modal-summary{border-radius:14px;margin-top:17px;padding:15px 17px;background:rgba(var(--modal-accent-rgb,25,201,154),.075);border:1px solid rgba(var(--modal-accent-rgb,25,201,154),.25);display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.modal-summary-label{font-size:11px;color:var(--quiet)}.modal-summary-value{font-weight:800;font-size:18px;letter-spacing:-.3px;white-space:nowrap}
.modal-summary .progress{grid-column:1/-1;margin:2px 0 0}.modal-summary .progress>div{background:var(--modal-accent,#19c99a)}
.modal-summary-helper{grid-column:1/-1;font-size:11px;color:var(--quiet)}
.modal[data-kind="goal"] .fg:has([name="name"]){grid-column:1/-1}
.modal[data-kind="goal"] .fg:has([name="currency"]){grid-column:1/-1}
.modal[data-kind="transaction"] .fg:has([name="description"]),.modal[data-kind="recurring"] .fg:has([name="description"]){grid-column:1/-1}
.modal[data-kind="account"] .fg:has([name="name"]),.modal[data-kind="investment"] .fg:has([name="name"]),.modal[data-kind="bill"] .fg:has([name="name"]){grid-column:1/-1}
.modal[data-kind="budget"] .fg:has([name="limit"]){grid-column:1/-1}
.modal-backdrop-sentinel{display:none}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap}
.theme-toggle .theme-symbol{font-size:15px;line-height:1}.theme-settings{display:flex;align-items:center;justify-content:space-between;gap:13px;background:var(--surface-soft);border:1px solid var(--divider);padding:13px 14px;border-radius:12px;margin:12px 0}
.theme-settings .theme-toggle{min-width:122px}.settings-title{font-size:12px;font-weight:750;color:var(--ink)}
:root[data-theme="light"] .green{color:var(--green)}:root[data-theme="light"] .red{color:var(--red)}
:root[data-theme="light"] .btn.primary{color:#ffffff}:root[data-theme="light"] .nav:focus-visible{outline-color:var(--blue)}
@keyframes fade-backdrop{from{opacity:0}to{opacity:1}}@keyframes slide-dialog{from{opacity:0;transform:translateY(14px) scale(.982)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:800px){.modal{width:min(530px,100%)}.modalheader{padding:21px}.modal form{padding:19px 21px}.modal h2{font-size:20px}}
@media(max-width:520px){.modalwrap{align-items:flex-end;padding:0}.modal{width:100%;max-height:95dvh;border-radius:22px 22px 0 0}.modalheader{padding:19px 18px 17px}.modal form{padding:18px}.modal .formgrid{grid-template-columns:1fr}.modal .fg:has([name="currency"]){grid-column:auto}.modal-summary{grid-template-columns:1fr auto}.modal-footer{flex-wrap:wrap}.modal-footer-note{width:100%}.modal-footer .actions{width:100%;justify-content:flex-end}.modal-icon{flex-basis:42px;height:42px}}
@media(prefers-reduced-motion:reduce){body,.modal,.modalwrap{animation:none!important;transition:none!important}}

:root[data-theme="light"] .brand,:root[data-theme="light"] .top h1,:root[data-theme="light"] h2,:root[data-theme="light"] h3{color:var(--ink)}
/* Currency conversion bar and professional export action */
.fx-strip{display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap;padding:10px 15px;border:1px solid color-mix(in srgb,var(--positive) 35%,var(--divider));border-radius:12px;background:color-mix(in srgb,var(--positive) 7%,var(--card-bg));margin-bottom:11px;min-height:46px;font-size:12px;color:var(--sub-ink)}
.fx-strip b{color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:.2px}.fx-muted{color:var(--quiet)}.fx-dot{color:var(--positive);font-size:13px;margin-right:3px}.fx-warning{color:#e18e5e}.fx-warning .fx-dot{color:#d88842}.fx-refresh{flex:0 0 auto;font-size:11px;padding:8px 12px;border-radius:8px}
.fx-original{display:block;margin-top:2px;font-size:10px;line-height:1.5;color:var(--quiet)}
.export-panel{margin-top:17px;display:flex;gap:17px;padding:20px;background:linear-gradient(100deg,color-mix(in srgb,var(--positive) 9%,var(--card-bg)),var(--card-bg));border-color:color-mix(in srgb,var(--positive) 30%,var(--divider))}
.export-icon{display:grid;place-items:center;flex:0 0 50px;height:50px;border-radius:14px;background:color-mix(in srgb,var(--positive) 14%,var(--card-bg));color:var(--positive);font-size:28px;font-weight:800}
.export-content{flex:1;min-width:0}.export-content h3{margin:0 0 5px;color:var(--ink);font-size:16px}.export-content p{margin:2px 0 15px;max-width:800px}.export-content .actions{align-items:center}
@media(max-width:560px){.fx-strip{align-items:start;gap:8px}.fx-refresh{width:100%}.export-panel{padding:15px;gap:10px}.export-icon{flex:0 0 36px;height:36px;border-radius:10px;font-size:20px}}

/* Receipt attachment viewer */
.receipt-modal{max-width:570px;width:min(94vw,570px)}.receipt-body{padding:16px 23px;display:grid;gap:12px}.receipt-label{display:grid;gap:10px;font-weight:650;font-size:13px}.receipt-label input{width:100%}.receipt-paper{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:5px;overflow-wrap:anywhere}.receipt-paper small{color:var(--muted)}.receipt-preview img{max-width:100%;max-height:340px;object-fit:contain;border-radius:12px;display:block;margin:auto}.receipt-current{min-height:35px}.receipt-field{grid-column:1/-1}.receipt-field small{font-size:11px;color:var(--muted)}

/* V8 — editable records, detailed budgeting and scrollable dashboard */
.budget-dashboard-card{min-width:0;display:flex;flex-direction:column;max-height:390px}
.budget-card-header{align-items:flex-start;gap:7px;flex:0 0 auto}
.budget-card-header .ctitle{margin-bottom:5px}.budget-card-header .link{white-space:nowrap;margin-top:2px}
.budget-scroll{overflow-y:auto;overscroll-behavior:contain;max-height:285px;scrollbar-width:thin;scrollbar-color:var(--field-border) transparent;padding-right:7px;min-height:110px}
.budget-scroll:focus-visible{outline:2px solid var(--positive);outline-offset:2px;border-radius:9px}
.budget-scroll-hint{font-size:10px;margin:0 0 13px}
.budget-entry{padding:12px 0}.budget-entry .progress{margin:10px 0}
.budget-name{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0;overflow-wrap:anywhere}
.budget-amounts{line-height:1.55;margin:8px 0 0}.budget-amounts strong{color:var(--ink)}
.budget-note{padding:8px 10px;margin:8px 0 4px;background:var(--surface-soft);border-radius:7px;border-left:2px solid var(--blue);white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}
.budget-currency-pill{border:1px solid var(--divider);background:var(--chip);color:var(--quiet);font-size:9px;padding:3px 5px;border-radius:5px}
.budget-percentage{color:var(--quiet);font-size:11px;font-weight:750}
.budget-actions{align-items:center;flex-wrap:wrap}.budget-actions>span{display:flex;gap:7px}.budget-actions small{font-size:10px}
.budget-over .progress>div{background:var(--red)}.budget-over .budget-percentage{color:var(--red)}
.action-edit{color:var(--positive);font-weight:750}.action-edit:focus-visible,.link:focus-visible{outline:2px solid var(--positive);border-radius:3px}
.item-note{line-height:1.6;white-space:pre-wrap;margin:9px 0;overflow-wrap:anywhere}
.note-area{resize:vertical;min-height:86px;line-height:1.55}
.modal .budget-other-field[hidden]{display:none!important}
@media(max-width:800px){.budget-dashboard-card{max-height:440px}.budget-scroll{max-height:320px}}