/* Layout: bottom line, two KPI pairs, two year panels (sources column | uses column on one shared scale), then the table view. */
:root {
  --bg: #f6f7f9; --surface: #ffffff; --fg: #1b2230; --muted: #5d6779; --line: #dde1e8;
  --accent: #1f4fa3; --accent-soft: #e6edf9; --up: #1c7a4a; --down: #b3261e; --up-soft: #e3f3ea; --down-soft: #fbe6e4;
  --s-tax: #1c5cab; --s-odom: #9ec5f4; --s-dfin: #5598e7; --s-daid: #6250d6; --s-grants: #b4440e; --s-efin: #f2a07a; --s-ofin: #8a8f98;
  --u-mou: #0f6b4c; --u-mvs: #6fd0a6; --u-res: #13895e; --u-dsszzi: #b5e8d0; --u-sbu: #2aa775; --u-osec: #d8f3e6; --u-civ: #8a8f98; --u-lend: #c9ccd2;
  --guide: #1b2230;
  --font-body: "Golos Text", "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg: #11151c; --surface: #181e27; --fg: #e5e9f0; --muted: #98a2b3; --line: #2a3240;
  --accent: #8fb3ff; --accent-soft: #1d2a44; --up: #6fd39d; --down: #ff8a80; --up-soft: #15301f; --down-soft: #3a1a18;
  --s-tax: #3d7fd0; --s-odom: #9cc6f5; --s-dfin: #6aa4ea; --s-daid: #9085e9; --s-grants: #c4581f; --s-efin: #f2a07a; --s-ofin: #7b808a;
  --u-mou: #1d7a57; --u-mvs: #8fdcb9; --u-res: #2a9d70; --u-dsszzi: #c8efdc; --u-sbu: #36b583; --u-osec: #e0f6ea; --u-civ: #7b808a; --u-lend: #4a4e55;
  --guide: #e5e9f0; color-scheme: dark; } }
:root[data-theme="dark"] {
  --bg: #11151c; --surface: #181e27; --fg: #e5e9f0; --muted: #98a2b3; --line: #2a3240;
  --accent: #8fb3ff; --accent-soft: #1d2a44; --up: #6fd39d; --down: #ff8a80; --up-soft: #15301f; --down-soft: #3a1a18;
  --s-tax: #3d7fd0; --s-odom: #9cc6f5; --s-dfin: #6aa4ea; --s-daid: #9085e9; --s-grants: #c4581f; --s-efin: #f2a07a; --s-ofin: #7b808a;
  --u-mou: #1d7a57; --u-mvs: #8fdcb9; --u-res: #2a9d70; --u-dsszzi: #c8efdc; --u-sbu: #36b583; --u-osec: #e0f6ea; --u-civ: #7b808a; --u-lend: #4a4e55;
  --guide: #e5e9f0; color-scheme: dark; }
body { background: var(--bg); color: var(--fg); font-family: var(--font-body); font-size: 15px; line-height: 1.5;
  padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-block: 28px 48px; }
.wrap { max-width: 1180px; margin: 0 auto; display: grid; gap: 22px; }
h1, h2 { margin: 0; text-wrap: balance; }
h1 { font-size: clamp(1.45rem, 3vw, 1.95rem); font-weight: 700; letter-spacing: -0.01em; line-height: 1.2; }
h2 { font-size: 1.05rem; font-weight: 600; }
p { margin: 0; }
a { color: var(--accent); }
.eyebrow { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); font-weight: 600; }
.lead { color: var(--muted); max-width: 72ch; }
header { display: grid; gap: 8px; }
.verdict { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--up); border-radius: 10px; padding: 14px 18px; display: grid; gap: 4px; max-width: 92ch; }
.verdict b { font-weight: 600; font-size: 1.05rem; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; display: grid; gap: 4px; align-content: start; }
.kpi span { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; }
.kpi b { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 1.5rem; font-weight: 500; }
.kpi b.pos { color: var(--up); } .kpi b.neg { color: var(--down); }
.kpi small { color: var(--muted); font-size: 13px; }
.panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); gap: 16px; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 14px 10px 6px; display: grid; gap: 4px; min-width: 0; }
.panel h2 { padding-left: 8px; }
.panel svg { width: 100%; height: auto; display: block; }
svg text { font-family: var(--font-body); fill: var(--fg); }
svg .lbl { font-size: 15px; }
svg .val { font-size: 14px; font-family: var(--font-mono); fill: var(--muted); }
svg .colhead { font-size: 13px; font-weight: 600; fill: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
svg .guide { stroke: var(--guide); stroke-width: 1.5; stroke-dasharray: 5 4; fill: none; }
svg .gap { stroke: var(--down); stroke-width: 2; fill: none; }
svg .gap.pos { stroke: var(--up); }
svg .gaptext { fill: var(--down); font-size: 14px; font-weight: 600; }
svg .gaptext.pos { fill: var(--up); }
svg .leader { stroke: var(--muted); stroke-width: 1; fill: none; opacity: .6; }
svg .seg { stroke: var(--surface); stroke-width: 2; cursor: default; }
svg .seg:hover, svg .seg:focus { opacity: .82; outline: none; }
svg .base { stroke: var(--muted); stroke-width: 1; }
.tip { position: fixed; pointer-events: none; background: var(--fg); color: var(--bg); padding: 6px 10px; border-radius: 6px; font-size: 13px; line-height: 1.35; max-width: 300px; z-index: 5; }
.tip b { font-family: var(--font-mono); font-weight: 500; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--muted); align-items: center; }
.legend span { display: inline-flex; gap: 6px; align-items: center; }
.legend i { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.legend .l-tax { background: var(--s-tax); } .legend .l-odom { background: var(--s-odom); } .legend .l-dfin { background: var(--s-dfin); }
.legend .l-daid { background: var(--s-daid); } .legend .l-grants { background: var(--s-grants); } .legend .l-efin { background: var(--s-efin); }
.legend .l-sec { background: var(--u-mou); } .legend .l-civ { background: var(--u-civ); }
.tbl-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; min-width: 560px; }
th, td { padding: 8px 12px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; }
th { font-size: 12px; color: var(--muted); font-weight: 600; }
td:first-child, th:first-child { text-align: left; white-space: normal; }
td.num { font-family: var(--font-mono); font-size: 13px; }
tr.grp td { font-weight: 600; background: var(--accent-soft); }
tr.sum td { font-weight: 700; border-top: 2px solid var(--line); }
details.tbl > summary { cursor: pointer; font-weight: 600; font-size: 1.05rem; }
details.tbl[open] > summary { margin-bottom: 10px; }
footer { color: var(--muted); font-size: 13px; display: flex; align-items: center; gap: 4px; }