.analytics{margin:28px 0}.analytics>.section-heading{margin-bottom:20px}.analytics select{width:auto;background:#fff;border:1px solid #dce3ed;color:#213956;border-radius:12px}.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.chart-panel{border:1px solid #e0e7f0;border-radius:20px;background:#fff;padding:26px;box-shadow:0 8px 28px #18395807}.chart-panel h3{margin-top:0;font-size:20px}.spending-ring{width:260px;height:260px;border-radius:50%;margin:24px auto;background:#e9eef6;position:relative;display:grid;place-items:center}.spending-ring:before{content:'';position:absolute;inset:30px;border-radius:50%;background:#fff}.spending-ring>div{position:relative;text-align:center}.spending-ring span{display:block;color:#61758e;font-size:14px}.spending-ring strong{display:block;font-size:34px;letter-spacing:-.04em}.legend-row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #eef2f7;font-size:14px}.legend-name{display:flex;align-items:center;gap:8px}.legend-dot{width:10px;height:10px;border-radius:50%;display:inline-block}.chart-number{font-size:32px;color:#193d77}.time-bars{display:flex;align-items:flex-end;gap:8px;height:200px;padding-top:16px;margin-top:20px;border-bottom:1px solid #dce4f0}.time-bar{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%}.time-bar>span{width:100%;max-width:42px;min-height:3px;border-radius:8px 8px 0 0;background:linear-gradient(#3c80e8,#183d77)}.time-bar small{height:32px;font-size:12px;color:#5b6e88;white-space:nowrap;margin-top:6px}.item-breakdown{margin-top:20px}.spend-item{display:flex;justify-content:space-between;gap:18px;padding:15px 0;border-bottom:1px solid #e9eef5}.spend-item a{font-weight:700;text-decoration:none}.spend-item small{display:block;font-size:14px;color:#64748b;margin-top:4px}.spend-item>strong{white-space:nowrap;font-size:18px}@media(max-width:750px){.analytics-grid{grid-template-columns:1fr}.chart-panel{padding:22px}.spending-ring{width:240px;height:240px}.analytics>.section-heading{flex-wrap:wrap}.spend-item{gap:12px}.time-bars{gap:5px}.time-bar small{font-size:12px}}