/* MoneyRec's emerald identity, with a shared categorical palette on every chart. */
.overview-home { --overview-radius:24px; }
.overview-intro { display:flex;align-items:center;justify-content:space-between;gap:32px;padding:32px 36px;margin-bottom:26px;border:1px solid var(--line);border-radius:var(--overview-radius);background:linear-gradient(115deg,var(--soft),var(--surface)); }
.overview-intro h2 { font-size:clamp(25px,2.4vw,36px);line-height:1.25;letter-spacing:-1px;max-width:620px;margin-bottom:12px; }
.overview-intro p { color:var(--muted);margin-bottom:22px; }
.overview-links { display:flex;flex-wrap:wrap;align-items:center;gap:22px; }
.overview-links a { display:inline-flex;align-items:center;gap:22px;font-weight:650;min-height:44px; }
.overview-links a.primary { padding:11px 20px;border-radius:12px; }
.overview-links a.primary:hover { background:#0a895e; }
.overview-month { flex-shrink:0;display:flex;align-items:center;gap:14px;font-weight:650; }
.overview-month small { display:block;color:var(--muted);font-weight:400;margin-top:3px; }
.month-symbol { display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:var(--surface);color:var(--accent);font-size:32px; }
.overview-stats .stat { position:relative;border-radius:20px;padding:28px;overflow:hidden;box-shadow:none; }
.overview-stats .stat:before { content:'';position:absolute;inset:26px auto auto 0;width:4px;height:36px;border-radius:0 4px 4px 0;background:#4f8fea; }
.overview-stats .stat:nth-child(3):before { background:#9670d8; }
.overview-stats .stat.hero { background:linear-gradient(125deg,#087c56,#0e9f6e); }
.overview-stats .stat.hero:before { background:#8bf0c3; }
.overview-stats .stat-label { letter-spacing:.6px; }
.overview-charts { display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px; }
.overview-charts>.panel,.overview-lists .panel { border-radius:var(--overview-radius);box-shadow:none; }
.overview-charts>.panel { padding:28px; }
.overview-lists { display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px; }
.overview-lists>* { min-width:0; }
.overview-lists>.panel { align-self:start; }
.spending-distribution { display:flex;align-items:center;gap:28px;padding:14px 0; }
.spending-donut { width:200px;height:200px;flex-shrink:0;border-radius:50%;background:conic-gradient(var(--chart-stops));display:grid;place-items:center; }
.spending-donut>div { width:146px;height:146px;border-radius:50%;background:var(--surface);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:12px;text-align:center; }
.spending-donut small { font-size:11px;letter-spacing:1px;color:var(--muted); }
.spending-donut strong { font-size:22px;letter-spacing:-.6px;max-width:100%;overflow-wrap:anywhere;font-variant-numeric:tabular-nums; }
.spending-donut span { font-size:11px;color:var(--muted); }
.spending-donut { position:relative;background:none; }
.spending-ring { position:absolute;inset:0;width:100%;height:100%;overflow:visible; }
.spending-ring circle { cursor:help;transition:filter .12s; }
.spending-ring circle.is-active { filter:brightness(.85); }
.spending-ring circle:focus { outline:none; }
.spending-donut:focus-within { outline:2px solid var(--accent);outline-offset:4px; }
.donut-summary { position:relative;z-index:1;pointer-events:none; }
.donut-summary small { letter-spacing:0;max-width:100%;overflow-wrap:anywhere;line-height:1.35; }
.chart-legend li[data-chart-slice] { cursor:help; }
.chart-legend li.is-active { background:var(--soft);border-radius:8px;box-shadow:0 0 0 5px var(--soft); }
.chart-legend { list-style:none;padding:0;margin:0;flex:1;min-width:0;max-height:310px;overflow-y:auto; }
.chart-legend li { display:flex;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line); }
.chart-legend li:last-child { border:0; }
.legend-dot { flex-shrink:0;width:10px;height:10px;border-radius:50%;background:var(--chart-color); }
.legend-detail { flex:1;min-width:0; }
.legend-detail strong { display:block;font-size:14px;font-weight:600;overflow-wrap:anywhere; }
.legend-track { height:4px;border-radius:4px;background:var(--line);margin-top:7px;overflow:hidden; }
.legend-track span { display:block;height:100%;border-radius:4px; }
.legend-value { text-align:end;font-variant-numeric:tabular-nums; }
.legend-value strong { display:block;font-size:14px; }
.legend-value small { display:block;font-size:12px;color:var(--muted); }
.budget-orbit { width:190px;height:190px;margin:18px auto;border-radius:50%;background:conic-gradient(var(--budget-color) var(--budget-share),var(--line) 0);display:grid;place-items:center; }
.budget-orbit>div { width:166px;height:166px;border-radius:50%;background:var(--surface);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:14px;text-align:center; }
.budget-orbit small { font-size:10px;color:var(--muted); }
.budget-orbit strong { font-size:24px;max-width:100%;overflow-wrap:anywhere; }
.budget-orbit span { font-size:13px;color:var(--muted); }
.budget-caption,.overview-text-link { display:block;text-align:center; }
.overview-text-link { font-size:14px;font-weight:650; }
.overview-budget-empty { display:flex;min-height:265px;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--muted); }
.overview-budget-empty>span { color:var(--accent);font-size:72px;line-height:1;margin-bottom:16px; }
.overview-budget-empty p { max-width:270px; }
.grid-two .spending-distribution { flex-wrap:wrap;justify-content:center; }
.grid-two .chart-legend { flex-basis:200px; }
.bars { height:230px;padding-bottom:8px; }
.bar-column .bar { opacity:1;width:65%;border-radius:8px 8px 3px 3px; }
@media(max-width:1250px) { .overview-intro { padding:28px; }.overview-month { display:none; }.overview-charts { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); }.spending-distribution { flex-wrap:wrap;justify-content:center; }.chart-legend { flex-basis:210px; }.overview-stats { gap:14px; }.overview-stats .stat { padding:24px; } }
@media(max-width:1000px) { .overview-charts,.overview-lists { grid-template-columns:minmax(0,1fr);gap:0; }.spending-distribution { flex-wrap:nowrap; }.overview-charts>.panel { padding:24px; } }
@media(max-width:600px) { .overview-intro { padding:24px;border-radius:20px; }.overview-intro h2 { font-size:27px; }.overview-links { gap:18px; }.overview-stats { grid-template-columns:minmax(0,1fr); }.overview-charts>.panel { padding:22px; }.spending-distribution { flex-direction:column;gap:18px; }.chart-legend { width:100%;flex-basis:auto;max-height:360px; }.spending-donut { width:210px;height:210px; }.spending-donut>div { width:154px;height:154px; }.bar-column small { font-size:10px;overflow-wrap:anywhere;text-align:center; }.bars { gap:6px; }.legend-value strong { font-size:13px; } }
@media(prefers-reduced-motion:no-preference) { .overview-links a,.overview-stats .stat { transition:box-shadow .2s ease,background .2s ease; }.overview-stats .stat:hover { box-shadow:var(--shadow); } }