/* One heading system across the four public sections. */
body{--page-accent:#ffc400;--page-title-size:clamp(2.1rem,4.1vw,3.5rem)}
body[data-page="explore"]{--page-accent:#ffc400}
body[data-page="time"]{--page-accent:#7ba5fa}
body[data-page="about"]{--page-accent:#52d7ac}
body[data-page="profile"]{--page-accent:#b6a0f4}
.page-heading{display:block;margin:0 0 28px;min-width:0}
.page-heading .page-title{font-family:var(--title-font);font-size:var(--page-title-size);font-weight:900;line-height:1.15;letter-spacing:-.035em;color:var(--ink);margin:0 0 18px;overflow-wrap:break-word}
.page-heading .page-title .page-underline{color:inherit;background:linear-gradient(transparent 69%,var(--page-accent) 69%,var(--page-accent) 94%,transparent 94%);box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 .025em}
.page-heading .page-subtitle,.about-hero>p.page-subtitle,.intro>p.page-subtitle{font-family:var(--body-font);font-size:clamp(1rem,1.45vw,1.15rem);font-weight:400;line-height:1.55;color:#414141;max-width:78ch;margin:0}
.about-hero.page-heading{border-top-color:var(--page-accent)}
.history-heading.page-heading{display:block;margin:0 0 28px}
.profile-page>.page-heading{margin-bottom:28px}
/* Identical, centered budget selector within each chart's surface. */
.explorer>.budget-selector-row,.history-shell>.budget-selector-row{display:flex;justify-content:center;align-items:center;width:100%;margin:0 0 20px;padding:0 0 18px;border-bottom:1px solid #d9d4c9}
.budget-selector-row .budgettabs{display:flex;justify-content:center;gap:10px;margin:0}
.budget-selector-row .budgettabs button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:48px;padding:10px 24px;font-size:1.125rem;font-weight:700;border:1.5px solid var(--ink);border-radius:9px}
.budget-selector-row .budgettabs button.active{border:2px solid var(--ink);background:var(--section-accent);color:var(--ink)}
.budget-selector-row .budgettabs button:not(.active){background:#fff;color:#333}
/* Chart type and administration belong to the same row beneath the subtitle. */
.explorer .canvasheading{align-items:center;gap:20px;margin:0 0 18px}
.explorer .canvas-subtitle{font-size:14px;line-height:1.5;color:#555;margin:8px 0 0;max-width:65ch}
.explorer>.overview-chart-tools{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px 24px;padding:0;margin:0 0 20px}
.overview-chart-tools .overview-representation{display:flex;align-items:center;flex-wrap:wrap;gap:12px;min-width:0}
.overview-chart-tools .filterline{margin:0 0 0 auto;padding:0;min-width:0}
.overview-chart-tools .scopechips{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:6px}
.overview-chart-tools .scopechips button{min-height:40px;padding:8px 11px;font-size:13px;white-space:nowrap}
.overview-chart-tools .unitlabel{display:flex;align-items:center;gap:8px;font-size:13px;white-space:nowrap;margin:0}
.overview-chart-tools .unitlabel select{padding:8px;max-width:180px;min-height:40px}
@media(max-width:1100px){.explorer>.overview-chart-tools{align-items:flex-start}.overview-chart-tools .overview-representation{flex:1 1 350px}.overview-chart-tools .filterline{flex:1 1 350px}.overview-chart-tools .scopechips{justify-content:flex-end}}
@media(max-width:760px){
  .page-heading,.history-heading.page-heading,.profile-page>.page-heading{margin-bottom:22px}
  .page-heading .page-title{margin-bottom:14px}
  .budget-selector-row .budgettabs{width:100%;gap:8px}
  .budget-selector-row .budgettabs button{flex:1;min-width:0;min-height:44px;padding:9px 12px;font-size:1rem}
  .explorer>.budget-selector-row,.history-shell>.budget-selector-row{margin-bottom:18px;padding-bottom:16px}
  .explorer>.overview-chart-tools{display:flex;flex-direction:column;align-items:stretch;gap:12px}
  .overview-chart-tools .overview-representation,.overview-chart-tools .filterline{flex:auto;width:100%;margin:0}
  .overview-chart-tools .overview-representation>.seg{width:100%}
  .overview-chart-tools .unitlabel{width:auto}
  .overview-chart-tools .scopechips{justify-content:flex-start;gap:6px}
  .overview-chart-tools .scopechips button{flex:1 1 auto;font-size:12px;padding:8px}
  .explorer .canvasheading{align-items:flex-start;flex-wrap:wrap}
}
/* The overview totals are the single budget selector. */
.stats .stat{display:flex;flex-direction:column;min-width:0;transition:background-color .18s,box-shadow .18s,transform .18s}
.stats .stat[data-budget-card="expense"]{--card-accent:#79a7ff;--card-wash:#dbe7ff}
.stats .stat[data-budget-card="receipt"]{--card-accent:#b19af5;--card-wash:#e8dfff}
.stats .stat[aria-pressed="true"]{background:var(--card-wash);box-shadow:4px 4px 0 #111;border-color:#111;border-top-color:var(--card-accent)}
.stats .stat-action{display:block;align-self:flex-start;margin-top:14px;padding:6px 10px;border-radius:6px;font-size:13px;line-height:1.4;font-weight:750;background:#f2f0eb;color:#111}
.stats .stat[aria-pressed="true"] .stat-action{background:#111;color:white}
.stats .stat:hover{box-shadow:4px 5px 0 #111;transform:translateY(-2px)}
.stats .stat[data-budget-card]:hover{background:var(--card-wash)}
.stats .stat:focus-visible{outline:3px solid #184ea2;outline-offset:5px}
@media(max-width:600px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stats .stat2{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;gap:4px 12px}.stats .stat2 .statnumber{grid-column:2;grid-row:1 / 3;margin:0;align-self:center}.stats .stat2 .stat-action{grid-column:1/-1;margin-top:4px}.stats .stat-action{font-size:12px;padding:5px 7px}.stats .statlabel{font-size:13px}}