.budget-overview-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.42fr);gap:24px;align-items:center;padding:30px 32px;border-radius:20px;background:radial-gradient(circle at 86% 16%,rgba(99,230,190,.24),transparent 31%),linear-gradient(120deg,#071a2c,#0d3856 58%,#087e78);color:#fff;box-shadow:0 18px 42px rgba(7,67,81,.22)}
.budget-overview-hero:after{content:"";position:absolute;right:-78px;bottom:-138px;width:300px;height:300px;border:45px solid rgba(255,255,255,.055);border-radius:50%}.budget-overview-hero>*{position:relative;z-index:1}.budget-overview-hero h1{font-size:32px;line-height:1.2;margin:0 0 8px}.budget-overview-hero p{margin:0;color:#cde7e9;line-height:1.65}.budget-overview-hero-total{padding:20px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(255,255,255,.08);backdrop-filter:blur(14px)}.budget-overview-hero-total span{display:block;color:#bde8e5;font-size:13px}.budget-overview-hero-total strong{display:block;margin:7px 0;font-size:31px}.budget-overview-hero-total small{color:#d4fbf3}
.budget-overview-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:15px}.budget-overview-kpis article{--tone:#465fff;position:relative;overflow:hidden;min-height:136px;padding:21px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 5px 18px rgba(15,35,70,.045);display:flex;flex-direction:column}.budget-overview-kpis article:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--tone)}.budget-overview-kpis article:after{content:"";position:absolute;right:-27px;top:-33px;width:98px;height:98px;border-radius:50%;background:color-mix(in srgb,var(--tone) 9%,white)}.budget-overview-kpis span,.budget-overview-kpis strong,.budget-overview-kpis small{position:relative;z-index:1}.budget-overview-kpis span{font-size:13px;color:#667085}.budget-overview-kpis strong{font-size:25px;line-height:1.08;margin:9px 0 7px;color:#172033;overflow-wrap:anywhere}.budget-overview-kpis small{font-size:12px;color:#98a2b3;line-height:1.45}.budget-overview-kpis .investment{--tone:#f79009}.budget-overview-kpis .carryover{--tone:#7a5af8}.budget-overview-kpis .remaining{--tone:#12b76a}
.budget-overview-insights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:15px}.budget-overview-insights article{padding:16px 18px;border:1px solid #dbe4ff;border-radius:15px;background:linear-gradient(180deg,#f8faff,#fff);display:flex;flex-direction:column}.budget-overview-insights span{font-size:12px;color:#667085}.budget-overview-insights strong{font-size:22px;margin:6px 0;color:#172033}.budget-overview-insights small{font-size:12px;color:#98a2b3;line-height:1.45}
.budget-overview-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.8fr);gap:15px;margin-top:15px}.budget-overview-grid .trend-panel{grid-row:span 2}.budget-overview-chart{height:285px;margin-top:16px}.budget-overview-chart.tall{height:465px}.budget-overview-table-panel{margin-top:15px}.budget-overview-table-panel .table-wrap{overflow:auto}.budget-overview-table-panel table{min-width:980px}.budget-dataset-chip{display:inline-grid;place-items:center;min-width:86px;padding:5px 10px;border-radius:999px;background:#eef2ff;color:#3448d8;font-weight:800}.budget-dataset-chip.investment{background:#fff7e8;color:#b54708}
@media(max-width:1180px){.budget-overview-hero{grid-template-columns:1fr}.budget-overview-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.budget-overview-grid{grid-template-columns:1fr}.budget-overview-grid .trend-panel{grid-row:auto}.budget-overview-chart.tall{height:360px}}
@media(max-width:640px){.budget-overview-hero{padding:24px 22px}.budget-overview-hero h1{font-size:27px}.budget-overview-kpis,.budget-overview-insights{grid-template-columns:1fr}.budget-overview-chart,.budget-overview-chart.tall{height:330px}}