/* Scoped to Overview so the same chart keeps its existing expense-screen layout. */
body:has(#view-overview:not([hidden])){background:#edf5f8}
#view-overview{color:#0c3046;--overview-muted:#6d899b}
#view-overview .headline{align-items:start;gap:14px;margin-bottom:20px;position:relative;padding-right:165px}
#view-overview .headline h1{font-size:clamp(28px,4.5vw,38px);letter-spacing:-1px;line-height:1.2}
#view-overview .headline p{font-size:15px;line-height:1.5;color:var(--overview-muted)}
#view-overview .overview-period{position:absolute;right:0;top:0;display:flex;align-items:center;gap:8px;margin:0;background:#fff;border:1px solid #d6e5ed;border-radius:30px;padding:0 12px;box-shadow:0 4px 12px #133b5010;max-width:160px}
#view-overview .overview-period svg{width:19px;height:19px;flex-shrink:0}
#view-overview .overview-period select{width:auto;min-width:0;border:0;background:transparent;padding:12px 0;font-size:13px!important;color:#163d53;box-shadow:none}
#view-overview .panel,#view-overview .metric{border:1px solid #deebf1;border-radius:20px;box-shadow:0 5px 16px #10384c04}
#view-overview .overview-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;flex-shrink:0;background:#eaf5f7;color:#0c3953}
#view-overview .overview-icon svg{width:25px;height:25px}
#view-overview .due-alerts{padding:18px;margin:0 0 16px;background:#ffffffed;display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 14px}
#view-overview .reminder-icon{grid-row:1/3;color:#087bff;background:#e5f1ff}
#view-overview .due-alerts h3{margin:0;align-self:center;font-size:19px;letter-spacing:-.4px}
#view-overview .due-alerts>p{margin:0;line-height:1.5;font-size:14px;color:var(--overview-muted)}
#view-overview #due-alert-list{grid-column:1/-1;background:#eff9f8;border-radius:14px;margin:12px 0;padding:12px 15px;font-size:14px}
#view-overview #due-alert-list>p{margin:0;color:#294e60;line-height:1.5}
#view-overview .due-alert{margin:4px 0}
#view-overview .overview-email{grid-column:1/-1;border-top:1px solid #e2edf1;padding-top:12px}
#view-overview .overview-email label{display:flex;align-items:center;gap:12px;margin:0;font-size:13px;font-weight:600;line-height:1.5}
#view-overview #email-reminders{width:28px;height:28px;flex:0 0 28px;accent-color:#087bff;margin:0}
#view-overview #email-reminder-status{font-size:12px;line-height:1.5;margin:3px 0 0 40px;color:var(--overview-muted)}
#view-overview .overview-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0}
#view-overview .metric{min-height:112px;padding:19px 16px 17px 76px;background:#fff}
#view-overview .metric-icon{position:absolute;left:16px;top:18px}
#view-overview .metric-icon.wallet{background:#0878d8;color:#fff}
#view-overview .metric-icon.income{background:#e2f7f1;color:#08a68b}
#view-overview .metric-icon.expense{background:#ffedf0;color:#ff5069}
#view-overview .metric-icon.debt{background:#eee8ff;color:#7750ff}
#view-overview .metric.balance{background:linear-gradient(115deg,#05324c,#074b70);border-color:#124660}
#view-overview .metric p{font-size:14px;color:#45677e;margin:0 0 8px}
#view-overview .metric strong{font-size:clamp(19px,3.6vw,27px);font-variant-numeric:tabular-nums;letter-spacing:-.5px;overflow-wrap:anywhere}
#view-overview .metric small{font-size:12px;margin-top:8px;line-height:1.5}
#view-overview .metric.balance p,#view-overview .metric.balance small{color:#bcd6e5}
#view-overview .finance-insights{display:flex;flex-direction:column;gap:16px;margin:16px 0;padding:0;border:0;border-radius:0;background:transparent}
#view-overview .insight-heading{display:none}
#view-overview .insight-ai{order:0;position:relative;display:grid;grid-template-columns:1fr;gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(110deg,#f1fcfa,#f4fafc);border:1px solid #d7eaf0;overflow:hidden}
#view-overview .insight-ai>div:first-child{padding-right:112px;position:relative;z-index:1}
#view-overview .insight-kicker{color:#009e86;font-size:10px;letter-spacing:1.8px;font-weight:800}
#view-overview .insight-ai h3{font-size:22px;letter-spacing:-.6px;line-height:1.25;margin:10px 0 8px}
#view-overview .insight-ai p{font-size:14px;line-height:1.5;color:var(--overview-muted);margin:0}
#view-overview #insight-ai-button{position:relative;z-index:1;width:100%;min-height:46px;background:linear-gradient(100deg,#009e87,#00a184);border-radius:13px;font-size:16px;box-shadow:0 6px 15px #009d8120}
#view-overview .overview-ai-art{position:absolute;right:22px;top:35px;width:100px;height:115px;display:flex;align-items:flex-end;justify-content:center;gap:9px;padding:20px 8px;background:linear-gradient(135deg,#e7f7f7,#ceefee);border-radius:55% 45% 60% 40%;transform:rotate(8deg)}
#view-overview .overview-ai-art i{display:block;width:15px;background:linear-gradient(#08bd9d,#00a18b);border-radius:6px;transform:rotate(-8deg);height:25px}
#view-overview .overview-ai-art i:nth-last-child(2){height:45px}#view-overview .overview-ai-art i:last-child{height:66px}
#view-overview .overview-ai-art span{position:absolute;left:0;top:-10px;color:#ffd481;font-size:41px}
#view-overview .insight-health{order:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:22px;border-radius:20px;background:linear-gradient(110deg,#073c56,#09796f)}
#view-overview .insight-health.negative{background:linear-gradient(110deg,#043954,#245067 35%,#8b4641)}
#view-overview .insight-health:before{content:'▥  Resumo do período';grid-column:1/-1;font-size:19px;font-weight:700;margin-bottom:5px}
#view-overview .insight-health>div:last-of-type{grid-column:auto}
#view-overview .insight-health>div+div{border-left:1px solid #ffffff26;padding-left:16px}
#view-overview .insight-health span{font-size:12px;line-height:1.4;margin-bottom:7px;color:#c8dce6}
#view-overview .insight-health strong{font-size:clamp(16px,3.2vw,24px);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
#view-overview .insight-health p{font-size:14px;line-height:1.5;padding-top:14px}
#view-overview .overview-category-panel{order:2;padding:20px;background:#fff;border:1px solid #deebf1;border-radius:20px}
#view-overview .insight-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;margin:0 0 10px;align-items:start}
#view-overview .overview-category-title{grid-row:1/3;margin:0;font-size:20px;line-height:1.3;letter-spacing:-.5px}
#view-overview .insight-tabs{gap:2px;padding:3px;border-radius:12px;justify-self:end}
#view-overview .insight-tabs button{font-size:12px;padding:9px 11px;white-space:nowrap}
#view-overview .insight-tabs button[aria-pressed=true]{color:#009780;background:#effbf8;outline:1px solid #a7dcda}
#view-overview .insight-actions select{grid-column:2;width:100%;font-size:12px!important;padding:6px 8px!important;color:#2385d7}
#view-overview #insight-animate{display:none}
#view-overview .insight-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px;align-items:center}
#view-overview .insight-card{padding:0;border:0;box-shadow:none;background:transparent;border-radius:0}
#view-overview #insight-chart-title,#view-overview .insight-ranking-head{display:none}
#view-overview .insight-donut-wrap{padding:8px 0}
#view-overview .insight-donut{width:100%;max-width:245px;outline:0;box-shadow:none}
#view-overview .insight-donut strong{font-size:clamp(15px,3vw,23px);overflow-wrap:anywhere}
#view-overview .insight-donut small{font-size:11px}
#view-overview #insight-caption{font-size:12px;line-height:1.4;margin:8px 0}
#view-overview .insight-category{padding:8px 0}
#view-overview .insight-category>span:first-child{font-size:12px;gap:6px}
#view-overview .insight-category b{overflow-wrap:anywhere}
#view-overview .insight-category strong{white-space:nowrap}
#view-overview .insight-category small{font-size:10px;margin-top:3px}
#view-overview .insight-track{height:7px;margin-top:6px}
#view-overview #insight-detail{order:3;padding:18px;background:#fff;border-radius:18px}
#view-overview #insight-detail .insight-ranking-head{display:flex}
#view-overview #insight-ai-status,#view-overview #insight-ai-result{order:1}
#view-overview #insight-ai-status:empty{display:none}
#view-overview .insight-footnote{order:4;margin:0;font-size:10px}
#view-overview .overview-recent{padding:18px;margin-top:16px;background:#fff}
#view-overview .overview-recent .panel-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}
#view-overview .overview-recent .panel-head>div{flex:1;min-width:0}
#view-overview .overview-recent h3{margin:0;font-size:18px;letter-spacing:-.4px}
#view-overview .overview-recent .panel-head p{font-size:12px;margin-top:4px;color:var(--overview-muted)}
#view-overview .recent-icon{color:#0780ff;background:#e6f1ff}
#view-overview #new-link{background:#edf9f7;border:1px solid #c0e6e3;border-radius:13px;color:#009d83;padding:10px 13px;font-size:13px;white-space:nowrap}
#view-overview .transaction{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-color:#e3edf1}
#view-overview .transaction>div:first-child{min-width:0}
#view-overview .transaction strong{font-size:13px}
#view-overview .transaction .meta{font-size:11px;line-height:1.5;color:var(--overview-muted)}
#view-overview .transaction-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px;margin:0;flex-shrink:0;max-width:43%}
#view-overview .transaction-actions>.expense{color:#ff625e}
#view-overview .transaction-actions>.income{color:#00a78e}
#view-overview .transaction-actions button{font-size:10px;padding:4px 6px}
.overview-category-title,.overview-ai-art{display:none}
#view-overview .overview-category-title{display:block}#view-overview .overview-ai-art{display:flex}
@media(max-width:480px){
 #view-overview .headline{padding-right:135px}#view-overview .overview-period{max-width:132px;padding:0 9px;gap:5px}#view-overview .overview-period select{font-size:11px!important}#view-overview .headline p{font-size:12px}
 #view-overview .overview-metrics{gap:10px}#view-overview .metric{padding:15px 10px 14px 52px;min-height:105px}#view-overview .metric-icon{left:10px;top:15px;width:32px;height:34px;border-radius:10px}#view-overview .metric-icon svg{width:20px;height:20px}#view-overview .metric p{font-size:11px}#view-overview .metric strong{font-size:18px}#view-overview .metric small{font-size:10px}
 #view-overview .insight-ai{padding:16px}#view-overview .insight-ai>div:first-child{padding-right:70px}#view-overview .insight-ai h3{font-size:19px}#view-overview .insight-ai p{font-size:12px}#view-overview .insight-kicker{font-size:8px}#view-overview .overview-ai-art{right:9px;width:72px;gap:5px;top:38px}#view-overview .overview-ai-art i{width:12px}
 #view-overview .insight-health{padding:17px 14px;gap:12px 8px}#view-overview .insight-health>div+div{padding-left:8px}#view-overview .insight-health span{font-size:10px}#view-overview .insight-health strong{font-size:16px}#view-overview .insight-health p{font-size:12px}
 #view-overview .overview-category-panel{padding:14px 12px}#view-overview .overview-category-title{font-size:16px}#view-overview .insight-actions{gap:6px}#view-overview .insight-tabs button{font-size:10px;padding:7px}#view-overview .insight-category>span:first-child{font-size:10px}#view-overview .insight-donut small{font-size:9px}#view-overview #insight-caption{font-size:10px}
 #view-overview .overview-recent{padding:14px}#view-overview .overview-recent h3{font-size:16px}#view-overview .overview-recent .panel-head{gap:8px}#view-overview .overview-recent .overview-icon{width:34px;height:36px}#view-overview #new-link{font-size:11px;padding:9px}#view-overview .transaction strong{font-size:12px}
}
#view-overview .metric.balance{grid-column:auto}
#view-overview .due-alerts,#view-overview .overview-recent{min-height:0}
#view-overview .headline{padding-right:0}
#view-overview .headline>div{width:100%}
#view-overview .headline h1{padding-right:165px}
#view-overview .headline p{display:block}
@media(max-width:480px){#view-overview .headline h1{padding-right:135px}#view-overview .metric strong{font-size:17px}#view-overview .metric.monthly-debt small{font-size:9px}}
#view-overview .transaction>div:not(.transaction-actions){flex:1;min-width:0}
#view-overview .transaction-icon{width:36px;height:38px;border-radius:12px}
#view-overview .transaction-icon svg{width:22px;height:22px}
#view-overview .overview-payment-state{padding:6px 10px;border-radius:20px;background:#e8f8f4;color:#029c85;font-size:11px;white-space:nowrap}
#view-overview .overview-payment-state.pending{background:#fff5da;color:#9b730d}
@media(max-width:480px){#view-overview .transaction{gap:8px}#view-overview .transaction-icon{width:30px;height:34px}#view-overview .overview-payment-state{font-size:10px;padding:5px 8px}}