
:root{--bg:#f3f6fa;--card:#fff;--text:#162238;--muted:#6d788b;--brand:#102d52;--accent:#df7b28;--ok:#18784d;--danger:#bd3d3d;--line:#e1e7ef}
*{box-sizing:border-box;min-width:0}html,body{width:100%;max-width:100%;overflow-x:hidden}body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text);padding-bottom:84px}
button,input,select{font:inherit}button{cursor:pointer}.topbar{width:100%;position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 16px;background:var(--brand);color:white;box-shadow:0 2px 10px #071b3322}
.topbar>div{overflow:hidden}.topbar h1{font-size:20px;line-height:1.15;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar p{margin:4px 0 0;font-size:12px;opacity:.78;text-transform:capitalize}.primary,.button{border:0;background:var(--accent);color:white;padding:10px 13px;border-radius:12px;font-weight:800;white-space:nowrap}
#quickAdd{font-size:14px}main{width:100%;max-width:900px;margin:0 auto;padding:14px}.page{display:none;width:100%}.page.active{display:block}
.welcome{padding:3px 2px 12px}.welcome span{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.welcome strong{display:block;font-size:18px;margin-top:3px}
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:13px}.quick-actions button{border:1px solid var(--line);background:white;border-radius:14px;padding:11px 5px;color:var(--text);box-shadow:0 2px 8px #102d5209}.quick-actions b{display:flex;width:32px;height:32px;border-radius:10px;background:#edf2f8;color:var(--brand);align-items:center;justify-content:center;margin:0 auto 6px;font-size:19px}.quick-actions span{font-size:11px;font-weight:700;display:block;line-height:1.1}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.card,.panel{background:var(--card);border:1px solid var(--line);border-radius:15px;box-shadow:0 2px 10px rgba(16,45,82,.035)}.card{padding:13px}.card span{font-size:12px;color:var(--muted);display:block;line-height:1.2}.card strong{display:block;font-size:19px;margin-top:6px;overflow-wrap:anywhere}
.grid2{display:grid;grid-template-columns:1fr;gap:0;margin-top:12px}.panel{padding:14px;margin-top:11px;overflow:hidden}.panel h2,.panel h3{margin:0 0 9px;font-size:17px}.panel-title h2{font-size:17px}
#summaryChart{display:none!important;width:0!important;height:0!important}#alerts .alert:last-child{margin-bottom:0}.page-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}.page-head h2{margin:0;font-size:20px}
.list{display:grid;gap:8px}.row{width:100%;background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:9px}.row>div:first-child{min-width:0}.row strong{overflow-wrap:anywhere}.row .meta{font-size:11px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}.row .amount{font-weight:800;font-size:13px;white-space:nowrap}.row button{border:1px solid var(--line);background:white;border-radius:8px;padding:6px;font-size:11px}.amount.income{color:var(--ok)}.amount.expense{color:var(--danger)}
.filters{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:10px}.filters select,.filters input,.field input,.field select{width:100%;max-width:100%;padding:11px;border:1px solid #ccd5e0;border-radius:10px;background:white}.hint{font-size:12px;color:var(--muted)}
.bottom-nav{position:fixed;z-index:20;left:0;right:0;bottom:0;width:100%;background:white;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -3px 14px #102d5210}.bottom-nav button{min-width:0;background:none;border:0;color:var(--muted);padding:9px 2px;border-radius:10px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottom-nav button.active{background:#eaf0f7;color:var(--brand);font-weight:800}
dialog{border:0;border-radius:17px;width:min(94vw,540px);max-width:94vw;max-height:88vh;padding:0;box-shadow:0 20px 60px #0005}dialog::backdrop{background:#07111d88}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}.modal-head h3{margin:0;font-size:18px}.modal-head button{font-size:26px;border:0;background:none}.modal-head+#modalFields{overflow:auto}
#modalFields{padding:14px 16px;display:grid;gap:10px;max-height:62vh}.field label{display:block;font-size:12px;font-weight:750;margin-bottom:5px}.modal-actions{padding:12px 16px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px}.modal-actions button{padding:9px 12px;border-radius:10px;border:1px solid var(--line)}
.actions{display:flex;gap:8px;flex-wrap:wrap}.alert{padding:10px;border-radius:10px;background:#fff6eb;border:1px solid #f1d7b7;margin-bottom:7px;font-size:12px}.progress{height:8px;background:#e7ebf0;border-radius:10px;overflow:hidden;margin-top:7px}.progress i{display:block;height:100%;background:var(--brand)}.mini-bar{display:grid;grid-template-columns:90px 1fr 75px;align-items:center;gap:7px;margin:8px 0;font-size:11px}.mini-bar .track{height:8px;background:#e7ebf0;border-radius:10px;overflow:hidden}.mini-bar i{display:block;height:100%;background:var(--brand)}
code{overflow-wrap:anywhere}
@media(min-width:700px){main{padding:20px}.cards{grid-template-columns:repeat(4,1fr)}.grid2{grid-template-columns:1.25fr .75fr;gap:12px}.quick-actions{max-width:560px}.filters{grid-template-columns:180px 1fr}}

.summary-bars{display:grid;gap:14px;padding:4px 0}.summary-item>div:first-child{display:flex;justify-content:space-between}.summary-item span{font-size:12px;color:var(--muted)}.summary-item strong{font-size:14px}.sum-track{height:10px;background:#e8edf3;border-radius:99px;overflow:hidden;margin-top:7px}.sum-track i{display:block;height:100%;width:0;background:var(--brand);border-radius:99px}.summary-item:nth-child(2) .sum-track i{background:var(--accent)}.more-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px}.more-grid button{background:white;border:1px solid var(--line);border-radius:15px;padding:14px;text-align:left}.more-grid b{display:flex;width:36px;height:36px;align-items:center;justify-content:center;background:#edf2f8;color:var(--brand);border-radius:10px;font-size:20px;margin-bottom:9px}.more-grid span{display:block;font-weight:800;font-size:14px}.more-grid small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.section-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:8px 2px 2px}

/* v4 mobile dashboard */
.topbar{padding:11px 16px;min-height:66px}
.topbar h1{font-size:19px}.topbar p{font-size:11px;margin-top:2px}
#quickAdd{width:42px;height:42px;padding:0;border-radius:13px;font-size:25px;line-height:1}
#dashboard{padding-top:0}
#dashboard .quick-actions{margin:0 0 10px}
.quick-3{grid-template-columns:repeat(3,1fr);gap:8px}
.quick-3 button{padding:9px 5px;border-radius:13px}
.quick-3 b{width:29px;height:29px;font-size:18px;margin-bottom:4px}
.quick-3 span{font-size:11px}
.cards{gap:8px}.card{padding:11px 12px;border-radius:13px}
.card span{font-size:11px}.card strong{font-size:17px;margin-top:4px}
.grid2{margin-top:8px;display:block}
.panel{padding:12px;border-radius:14px;margin-top:8px}
.panel h2,.panel-title h2{font-size:16px;margin-bottom:8px}
.month-summary{min-height:0!important}
.summary-line,.summary-result{display:flex;align-items:center;justify-content:space-between;padding:7px 0;font-size:12px}
.summary-line{border-bottom:1px solid var(--line)}
.summary-line strong{font-size:13px}
.summary-result{margin-top:3px;padding-top:9px;font-weight:800}
.summary-result strong{font-size:17px}.summary-result .negative,.negative{color:var(--danger)}.summary-result .positive,.positive{color:var(--ok)}
#alerts{min-height:0}
#dashboard>.panel:last-of-type{margin-bottom:8px}
.bottom-nav{padding-top:4px}
.bottom-nav button{padding:8px 2px;font-size:10px}
.version-mark{position:fixed;right:4px;bottom:72px;font-size:8px;color:#9ba5b4;z-index:2;opacity:.7}
@media(max-width:390px){main{padding:10px}.topbar{padding-left:12px;padding-right:12px}.card strong{font-size:16px}}

/* v5 final dashboard refinements */
.topbar{justify-content:flex-start}
.topbar>div{width:100%}
.month-summary{height:auto!important;min-height:0!important;padding-bottom:10px!important}
.month-summary .summary-result{margin-bottom:0}
.grid2{display:block!important}
#dashboard .grid2>.panel{height:auto!important;min-height:0!important}
#dashboard .panel{align-self:auto}

/* v6 visual refresh - based on approved mobile reference */
:root{--brand:#0d3564;--accent:#ef7d1a;--ok:#14945c;--danger:#e11d28;--blue:#0d6efd}
body{background:#f5f8fc}
.topbar{min-height:78px;padding:20px 20px;background:linear-gradient(135deg,#0b2e57,#0d3768);display:flex;align-items:center;justify-content:space-between}
.topbar h1{font-size:23px;letter-spacing:-.02em}
.bell-btn{border:0;background:transparent;color:#fff;font-size:30px;padding:4px 6px;line-height:1}
main{padding:16px 18px 106px}
.eyebrow{font-size:12px;letter-spacing:.12em;color:#6f7c8d;margin:4px 0 12px}
.quick-3{gap:9px;margin-bottom:12px!important}
.quick-3 button{min-height:94px;padding:14px 5px 11px;border-radius:16px;box-shadow:0 4px 14px rgba(17,47,83,.07)}
.quick-3 b{width:44px;height:44px;border-radius:13px;font-size:25px;margin-bottom:9px}
.quick-3 span{font-size:13px;font-weight:800}
.income-action b{background:#e7f6ee!important;color:#14945c!important}
.expense-action b{background:#fde9e9!important;color:#e11d28!important}
.transfer-action b{background:#e9f2ff!important;color:#0d6efd!important}
.cards{gap:9px}
.card{position:relative;min-height:83px;padding:14px 14px;border-radius:15px;box-shadow:0 4px 14px rgba(17,47,83,.06)}
.card span{font-size:12px;padding-right:40px}
.card strong{font-size:21px;margin-top:8px}
.metric-icon{position:absolute;right:13px;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:21px}
.metric-icon.wallet{background:#e9f2ff;color:#0d6efd}.metric-icon.up{background:#e9f7ef;color:#14945c}.metric-icon.down{background:#fde9e9;color:#e11d28}.metric-icon.due{background:#fff0df;color:#ef7d1a}
.panel{border-radius:16px;padding:15px 15px;box-shadow:0 4px 14px rgba(17,47,83,.06);margin-top:11px!important}
.panel h2,.panel-title h2{font-size:18px;margin-bottom:11px}
.month-summary{height:auto!important;min-height:0!important}
.summary-line,.summary-result{padding:10px 0;font-size:13px}
.summary-line span{display:flex;align-items:center;gap:9px}
.summary-line strong{font-size:14px}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.income-dot{background:#14945c}.expense-dot{background:#e11d28}
.summary-result strong{font-size:19px}
.empty-state{display:flex!important;align-items:center;gap:12px;color:#788596!important;font-size:13px!important;padding:7px 0!important}
.empty-state b{font-size:23px;font-weight:400;color:#8793a3}
.bottom-nav{height:84px;padding:7px 8px 8px;background:#fff;box-shadow:0 -3px 16px rgba(17,47,83,.08);display:grid;grid-template-columns:repeat(5,1fr);gap:2px}
.bottom-nav button{height:68px;border-radius:13px;padding:6px 2px 4px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px!important;color:#26364b}
.bottom-nav button b{font-size:24px;line-height:1;font-weight:500}
.bottom-nav button span{font-size:11px;font-weight:600}
.bottom-nav button.active{background:#eaf3ff;color:#0d6efd}
.bottom-nav button.active span{font-weight:800}
.version-mark{bottom:91px}
@media(max-width:390px){main{padding-left:12px;padding-right:12px}.topbar{padding-left:16px;padding-right:16px}.topbar h1{font-size:21px}.quick-3 button{min-height:88px}.card strong{font-size:19px}.bottom-nav button span{font-size:10px}}

/* v7: definitive dashboard height correction */
.topbar{justify-content:flex-start!important}
.month-summary{
  display:block!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:15px!important;
}
.month-summary::after{display:none!important}
.month-summary .panel-title{height:auto!important;min-height:0!important}
.month-summary .summary-line,
.month-summary .summary-result{
  height:auto!important;
  min-height:0!important;
}
#dashboard .month-summary{
  flex:none!important;
  align-self:start!important;
}
#dashboard .grid2{
  display:block!important;
  grid-template-rows:none!important;
  grid-auto-rows:auto!important;
  align-items:start!important;
}
#dashboard .grid2 > .panel{
  height:auto!important;
  min-height:0!important;
}

/* v8 - hard reset of monthly summary sizing */
#dashboard #monthSummary{
  display:block!important;
  box-sizing:border-box!important;
  position:relative!important;
  width:100%!important;
  height:fit-content!important;
  min-height:unset!important;
  max-height:260px!important;
  aspect-ratio:auto!important;
  flex:0 0 auto!important;
  align-self:flex-start!important;
  overflow:hidden!important;
}
#dashboard #monthSummary #summaryChart{
  display:none!important;
  position:absolute!important;
  width:0!important;
  height:0!important;
  min-height:0!important;
}
#dashboard #monthSummary .panel-title,
#dashboard #monthSummary .summary-line,
#dashboard #monthSummary .summary-result{
  position:static!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}
/* v9 - Contas e Saldos */
.account-summary{background:linear-gradient(135deg,#0b2e57,#0d477d);color:#fff;border-radius:18px;padding:20px;margin-bottom:14px;box-shadow:0 6px 18px rgba(17,47,83,.12)}
.account-summary span{display:block;font-size:13px;opacity:.82;margin-bottom:6px}.account-summary strong{font-size:28px}
.account-card{background:#fff;border:1px solid #dce5ef;border-radius:17px;padding:16px;margin-bottom:11px;box-shadow:0 4px 14px rgba(17,47,83,.06)}
.account-card-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.account-card h3{margin:0 0 4px;font-size:17px}.account-card .account-bank{color:#748092;font-size:12px}.account-card .account-balance{font-size:21px;font-weight:800;margin:15px 0 12px}.account-card .account-meta{font-size:12px;color:#748092;border-top:1px solid #e6ebf1;padding-top:10px}.account-actions{display:flex;gap:7px}.account-actions button{border:1px solid #d8e1eb;background:#fff;border-radius:9px;padding:7px 10px;font-weight:700;color:#29405b}.account-actions .danger{color:#c62828}
