/* Financial overview: existing brand palette, typography and surface scale. */
body.ux-r311 #page-home { min-width:0; }
body.ux-r311 #homeReportPanel,body.ux-r311 #businessDashboard { width:100%; max-width:1120px; margin-inline:auto; }
body.ux-r311 #page-home > .quick-strip { display:none; }
.dc-overview { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; min-width:0; color:var(--ux-text); font-family:'DM Sans',sans-serif; }
.dc-overview > * { min-width:0; }
.dc-overview :is(h2,h3,p) { margin:0; }
.dc-overview button { font:inherit; cursor:pointer; touch-action:manipulation; transition:background-color .16s ease,color .16s ease; }
.dc-overview button:focus-visible { outline:2px solid var(--ux-accent); outline-offset:3px; }
.dc-overview button:active { opacity:.82; }
.dc-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.dc-heading h2 { font-size:clamp(22px,3vw,30px); font-weight:700; letter-spacing:-.6px; line-height:1.2; margin-top:5px; }
.dc-eyebrow { color:var(--ux-muted); font-size:12px; font-weight:600; letter-spacing:.04em; }
.dc-month { display:flex; flex:none; align-items:center; gap:2px; color:var(--ux-text); }
.dc-month span { font-size:13px; white-space:nowrap; min-width:66px; text-align:center; }
.dc-month button { color:var(--ux-accent); background:none; border:0; min-width:38px; min-height:44px; font-size:24px; border-radius:var(--r-sm); }
.dc-month button:hover { background:var(--ux-soft); }
.dc-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,.55fr); gap:24px; align-items:center; padding:clamp(22px,3.5vw,34px); border-radius:var(--r-lg); border:1px solid color-mix(in srgb,var(--ux-accent) 24%,transparent); background:linear-gradient(115deg,color-mix(in srgb,var(--ux-primary) 20%,var(--ux-panel)),var(--ux-panel) 65%,color-mix(in srgb,var(--blue) 7%,var(--ux-panel))); }
.dc-hero .dc-eyebrow { color:var(--ux-text); font-size:14px; }
.dc-hero-value { display:block; margin:10px 0 12px; font-size:clamp(32px,5vw,46px); letter-spacing:-1.3px; font-weight:700; line-height:1.14; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.dc-hero p { color:var(--ux-muted); font-size:13px; line-height:1.5; max-width:420px; }
.dc-hero-note { margin-top:18px; font-size:12px; line-height:1.7; color:var(--ux-text); }
.dc-hero-note > span:last-child { color:var(--ux-muted); }
.dc-hero-context { border-left:1px solid var(--ux-line); padding-left:24px; display:grid; gap:9px; font-size:13px; line-height:1.5; }
.dc-hero-context > span:last-child { color:var(--ux-muted); }
.dc-context-icon { display:grid; place-items:center; width:36px; height:36px; border-radius:var(--r-sm); background:var(--ux-soft); color:var(--ux-accent); font-size:24px; }
.dc-kpis { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.dc-income { --dc-tone:var(--green); color:var(--green); }
.dc-expense { --dc-tone:var(--red); color:var(--red); }
.dc-balance,.dc-other { --dc-tone:var(--ux-accent); color:var(--ux-accent); }
.dc-kpi { min-width:0; padding:18px; background:linear-gradient(140deg,color-mix(in srgb,var(--dc-tone) 6%,var(--ux-panel)),var(--ux-panel) 75%); border-radius:var(--r); border:1px solid color-mix(in srgb,var(--dc-tone) 15%,transparent); }
.dc-kpi > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13px; font-weight:600; }
.dc-kpi i { font-style:normal; font-size:18px; }
.dc-kpi > strong { display:block; font-size:clamp(19px,2.4vw,28px); line-height:1.25; letter-spacing:-.5px; margin:12px 0 9px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.dc-kpi-comparison { display:flex; flex-wrap:wrap; gap:4px; color:var(--ux-muted); font-size:11px; line-height:1.5; }
.dc-kpi-comparison .ol-sensitive-percent { color:var(--dc-tone); font-weight:600; }
.dc-overview .dc-negative-value { color:var(--red); }
.dc-kpi-comparison .ol-sensitive-percent.dc-comparison-unfavorable { color:var(--red); }
.dc-kpi-comparison .ol-sensitive-percent.dc-comparison-favorable { color:var(--green); }
.dc-period-note { color:var(--ux-muted); font-size:11px; line-height:1.5; margin-top:-10px!important; }
.dc-chart { min-width:0; position:relative; background:var(--ux-panel); border:1px solid var(--ux-line); border-radius:var(--r-lg); padding:22px; }
.dc-chart-head { display:flex; justify-content:space-between; align-items:start; gap:12px; }
.dc-chart h3,.dc-section-head h3,.dc-insight h3 { font-size:16px; line-height:1.4; font-weight:600; }
.dc-chart p,.dc-bottom-grid section > p { color:var(--ux-muted); font-size:12px; line-height:1.5; margin-top:4px; }
.dc-period { display:flex; flex:none; padding:3px; gap:2px; border-radius:var(--r-sm); background:var(--ux-bg); }
.dc-period button { border:0; border-radius:8px; padding:9px 12px; min-height:38px; color:var(--ux-muted); background:none; font-size:12px; }
.dc-period button[aria-pressed=true] { background:var(--ux-soft); color:var(--ux-accent); }
.dc-legend { display:flex; flex-wrap:wrap; gap:14px; margin-top:20px; font-size:12px; }
.dc-legend small { margin-left:auto; color:var(--ux-muted); font-size:11px; }
.dc-bars { display:grid; grid-template-columns:repeat(var(--dc-columns),minmax(0,1fr)); gap:10px; margin:10px 0 0 78px; height:172px; background:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),color-mix(in srgb,var(--ux-line) 55%,transparent) calc(25% - 1px),color-mix(in srgb,var(--ux-line) 55%,transparent) 25%); }
.dc-bar-group { min-width:0; display:flex; flex-direction:column; padding:0; align-items:center; border:0; background:none; gap:8px; color:var(--ux-muted); font-size:11px!important; }
.dc-bar-pair { display:flex; align-items:end; justify-content:center; gap:5px; height:144px; width:100%; border-radius:6px; }
.dc-bar-pair i { height:var(--dc-height); width:clamp(8px,2.3vw,24px); background:var(--dc-tone); opacity:.72; border-radius:4px 4px 0 0; transition:opacity .16s ease; }
.dc-bar-group[aria-pressed=true] { color:var(--ux-text); }
.dc-bar-group[aria-pressed=true] .dc-bar-pair i,.dc-bar-group:hover .dc-bar-pair i { opacity:1; }
.dc-chart-scale { position:absolute; top:112px; bottom:77px; display:flex; flex-direction:column; justify-content:space-between; color:var(--ux-muted); font-size:9px; width:72px; overflow-wrap:anywhere; }
.dc-chart-readout { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; padding-top:14px; min-height:32px; font-size:11px!important; }
.dc-chart-readout b { color:var(--ux-text); }
.dc-insight { display:flex; align-items:start; gap:14px; padding:20px 22px; border-radius:var(--r); background:color-mix(in srgb,var(--ux-soft) 45%,var(--ux-bg)); border-left:3px solid var(--ux-primary); }
.dc-oliver-mark { color:var(--ux-accent); font-size:25px; line-height:1; }
.dc-insight h3 { color:var(--ux-accent); }
.dc-insight > div { min-width:0; }
.dc-insight p { color:var(--ux-muted); font-size:13px; line-height:1.6; margin-top:6px; white-space:normal!important; overflow-wrap:anywhere!important; }
.dc-insight button,.dc-section-head button { min-height:44px; color:var(--ux-accent); padding:8px 0; border:0; background:none; font-size:12px; text-align:left; }
.dc-insight button { padding-bottom:0; }
.dc-bottom-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:28px; }
.dc-section-head { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:44px; }
.dc-section-head button { flex:none; }
.dc-category { padding-top:18px; }
.dc-category > div:first-child { display:flex; justify-content:space-between; gap:12px; font-size:13px; }
.dc-category b { font-weight:500; overflow-wrap:anywhere; }
.dc-category-track { height:5px; border-radius:4px; background:var(--ux-line); margin:8px 0 4px; }
.dc-category-track i { display:block; height:100%; border-radius:inherit; background:var(--ux-accent); opacity:.75; }
.dc-category small { font-size:11px; color:var(--ux-muted); }
.dc-recent ul { padding:0; list-style:none; margin:8px 0 0; }
.dc-recent li { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:10px; align-items:center; padding:15px 0; border-bottom:1px solid var(--ux-line); }
.dc-recent li b { display:block; font-size:13px; font-weight:500; overflow-wrap:anywhere; }
.dc-recent li small { display:block; font-size:11px; color:var(--ux-muted); margin-top:4px; }
.dc-recent li strong { font-size:13px; font-weight:500; font-variant-numeric:tabular-nums; }
.dc-movement-icon { display:grid; place-items:center; background:color-mix(in srgb,var(--dc-tone) 10%,transparent); width:32px; height:32px; border-radius:var(--r-sm); }
.dc-due { border-top:1px solid var(--ux-line); padding-top:8px; }
.dc-due-row { display:flex; gap:16px; justify-content:space-between; align-items:center; padding:10px 0; font-size:13px; }
.dc-due-row b { font-weight:500; overflow-wrap:anywhere; }
.dc-due-row small { display:block; color:var(--yellow); font-size:11px; margin-top:4px; }
.dc-due-row strong { white-space:nowrap; font-weight:500; }
.dc-destinations { display:flex; flex-wrap:wrap; gap:8px 24px; padding-top:4px; }
.dc-destinations button { color:var(--ux-accent); background:none; border:0; padding:10px 0; min-height:44px; font-size:13px; }
.dc-destinations button span { margin-left:10px; }
.dc-empty { padding:clamp(26px,6vw,60px) 24px; border-radius:var(--r-lg); background:linear-gradient(135deg,var(--ux-soft),var(--ux-panel) 70%); text-align:center; }
.dc-empty-symbol { display:grid; place-items:center; width:56px; height:56px; background:var(--ux-soft); color:var(--ux-accent); font-size:30px; border-radius:var(--r); margin:0 auto 20px; }
.dc-empty h3 { font-size:24px; letter-spacing:-.5px; }
.dc-empty p { max-width:390px; margin:12px auto 22px; font-size:14px; line-height:1.6; color:var(--ux-muted); }
.dc-empty small { display:block; margin-top:14px; font-size:12px; color:var(--ux-muted); }
.dc-section-empty { color:var(--ux-muted); font-size:13px; line-height:1.6; padding:18px 0; }
.dc-skeleton { height:210px; border-radius:var(--r-lg); background:linear-gradient(110deg,var(--ux-panel) 25%,var(--ux-line) 45%,var(--ux-panel) 65%); background-size:220% 100%; animation:dc-loading 1.8s ease-in-out infinite; }
.dc-loading p { color:var(--ux-muted); font-size:13px; margin-bottom:16px; }
@keyframes dc-loading { to { background-position:-220% 0; } }
body.values-hidden .dc-overview :is(.dc-bars,.dc-chart-scale,.dc-category-track) { visibility:hidden; }
body.values-hidden .dc-insight p { visibility:hidden; }
body.values-hidden .dc-overview .dc-chart-readout { visibility:hidden; }
@media(max-width:600px) {
  .dc-overview { gap:18px; }
  .dc-heading { align-items:flex-end; gap:8px; }
  .dc-heading h2 { max-width:220px; font-size:23px; }
  .dc-hero { grid-template-columns:minmax(0,1fr); gap:18px; padding:22px; }
  .dc-hero-context { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; border-left:0; padding:12px 0 0; border-top:1px solid var(--ux-line); font-size:12px; }
  .dc-context-icon { width:27px; height:27px; font-size:19px; }
  .dc-hero-context > span:last-child { flex:1 1 100%; }
  .dc-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .dc-kpi { padding:14px 10px; border-radius:var(--r-sm); }
  .dc-kpi > div:first-child { font-size:11px; gap:3px; min-height:30px; }
  .dc-kpi > strong { font-size:clamp(16px,4.5vw,22px); }
  .dc-kpi-comparison { font-size:10px; }
  .dc-kpi:last-child { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; align-items:center; }
  .dc-kpi:last-child > div:first-child { justify-content:flex-start; gap:8px; min-height:0; }
  .dc-kpi:last-child > strong { margin:0; }
  .dc-kpi:last-child .dc-kpi-comparison { grid-column:1/-1; }
  .dc-chart { padding:18px 14px; }
  .dc-chart-head { flex-wrap:wrap; }
  .dc-chart-head h3 { font-size:16px; }
  .dc-period button { padding-inline:10px; }
  .dc-chart-scale { display:none; }
  .dc-bars { margin-left:0; gap:7px; height:154px; }
  .dc-bar-pair { height:126px; gap:4px; }
  .dc-bar-group { font-size:10px!important; }
  .dc-chart-readout { gap:5px 12px; }
  .dc-bottom-grid { grid-template-columns:minmax(0,1fr); gap:22px; }
  .dc-insight { padding:18px 16px; gap:10px; }
}
@media(max-width:359px) {
  .dc-heading { align-items:start; flex-direction:column; gap:6px; }
  .dc-heading h2 { max-width:none; }
  .dc-month { align-self:flex-end; }
  .dc-recent li { grid-template-columns:26px minmax(0,1fr); }
  .dc-recent li > strong { grid-column:2; margin-top:-5px; }
}
@media(prefers-reduced-motion:reduce) { .dc-overview *, .dc-skeleton { animation:none!important; transition:none!important; } }

.dc-hero-value[data-tone="income"] { color:var(--income); }
.dc-hero-value[data-tone="warning"] { color:var(--warning, var(--yellow)); }
.dc-hero-value[data-tone="expense"] { color:var(--expense); }
