:root { --bg:#fbfaf7; --fg:#1d1d1b; --muted:#6b6a64; --line:#e3e0d8; --accent:#1f5f8b; --mark:#ffe58a; --card:#fff;
        --nay:#a33a2b; --ok:#2e6b3a; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#16171a; --fg:#e8e6e1; --muted:#9a988f; --line:#2c2e33; --accent:#79b8e6; --mark:#6b5a12; --card:#1d1f23;
          --nay:#e4826f; --ok:#8fcf9b; }
}
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:15px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
header, main { max-width:1080px; margin:0 auto; padding:12px 16px; }
nav { font-size:14px; display:flex; gap:14px; flex-wrap:wrap; margin-bottom:4px; }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
h1 { font-size:20px; margin:4px 0; font-weight:650; } h2 { font-size:16px; margin:18px 0 6px; font-weight:620; }
.meta, .muted { color:var(--muted); font-size:13px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin:8px 0; }
.tag { display:inline-block; font-size:12px; border:1px solid var(--line); border-radius:999px; padding:0 8px; margin-right:4px; color:var(--muted); }
.wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; font-size:14px; background:var(--card); }
th, td { text-align:left; padding:5px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.03em; }
.nay, .failed { color:var(--nay); font-weight:600; } .aye, .carried, .adopted { color:var(--ok); }
.small { font-size:12px; } .warn { color:var(--nay); }
select, input, button { font:inherit; color:var(--fg); background:var(--card); border:1px solid var(--line); border-radius:6px; padding:5px 8px; }
/* People timeline (timeline.html, person.html): role-group colors, light and dark */
:root { --g-mayor:#8a4fb3; --g-council:#2f6fb0; --g-mpt:#163f6b; --g-staff:#2f8a5b; --g-board:#c27a1a; --gap:#b9b4a6;
        --serve:#c0392b; --rowhl:#fff3c4; --dim:.4; }
@media (prefers-color-scheme: dark) {
  :root { --g-mayor:#c49be3; --g-council:#6fa8e0; --g-mpt:#b9d6f5; --g-staff:#6cc497; --g-board:#e8ad5c; --gap:#5a5850;
          --serve:#ff7b6b; --rowhl:#3a3420; }
}
.chips { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.chip { display:inline-flex; align-items:center; gap:5px; font-size:13px; border:1px solid var(--line); border-radius:999px;
        padding:2px 10px 2px 6px; background:var(--card); cursor:pointer; user-select:none; }
.chip input { margin:0; }
.sw { display:inline-block; width:14px; height:10px; border-radius:2px; vertical-align:middle; }
.sw.mayor { background:var(--g-mayor); } .sw.council { background:var(--g-council); } .sw.mpt { background:var(--g-mpt); }
.sw.staff { background:var(--g-staff); } .sw.board { background:var(--g-board); }
.sw.gap { background:repeating-linear-gradient(135deg, var(--gap) 0 2px, transparent 2px 5px); border:1px solid var(--gap); }
.controls { display:grid; gap:8px; }
.controls .row { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; font-size:14px; }
.legend { display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12px; color:var(--muted); margin:6px 0; }
.tl { border:1px solid var(--line); border-radius:8px; background:var(--card); }
.tl-head { position:sticky; top:0; z-index:3; display:flex; background:var(--card); border-bottom:1px solid var(--line);
           border-radius:8px 8px 0 0; }
.tl-corner { flex:0 0 var(--namew); font-size:12px; color:var(--muted); padding:4px 8px; }
.tl-axiswrap { flex:1; min-width:0; overflow:hidden; }
.tl-body { display:flex; }
.tl-names { flex:0 0 var(--namew); width:var(--namew); border-right:1px solid var(--line); font-size:12.5px; }
.tl-names div { height:var(--rowh); line-height:var(--rowh); padding:0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tl-names .grp { font-weight:650; font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.tl-names .cur a { font-weight:650; }
.tl-names .cur a::after { content:" ●"; color:var(--ok); font-size:10px; }
.tl-names .hl { background:var(--rowhl); }
.tl-names .dim { opacity:var(--dim); }
.tl-scroll { flex:1; min-width:0; overflow-x:auto; overflow-y:hidden; cursor:grab; -webkit-overflow-scrolling:touch; }
.tl-scroll.drag { cursor:grabbing; }
.tl svg text { fill:var(--muted); font-size:11px; font-family:inherit; }
.tl .grid { stroke:var(--line); }
.tl .bar { cursor:pointer; }
.tl .bar:hover, .tl .bar:focus { stroke:var(--fg); stroke-width:1.5; outline:none; }
.tl .g-mayor { fill:var(--g-mayor); } .tl .g-council { fill:var(--g-council); } .tl .g-mpt { fill:var(--g-mpt); }
.tl .g-staff { fill:var(--g-staff); } .tl .g-board { fill:var(--g-board); }
.tl .approx { stroke-dasharray:3 2; stroke:var(--fg); stroke-opacity:.45; }
.tl .rowhl { fill:var(--rowhl); }
.tl .dim { opacity:var(--dim); }
.tl .serve { stroke:var(--serve); stroke-width:2; }
.tl .now { stroke:var(--muted); stroke-dasharray:2 3; }
.tip { position:fixed; z-index:10; max-width:320px; background:var(--card); color:var(--fg); border:1px solid var(--line);
       border-radius:8px; padding:8px 10px; font-size:13px; box-shadow:0 4px 18px rgba(0,0,0,.18); pointer-events:auto; display:none; }
.tip b { font-weight:650; } .tip .muted { font-size:12px; }
.mini { width:100%; height:auto; display:block; }
.mini text { fill:var(--muted); font-size:10px; }
.mini .g-mayor { fill:var(--g-mayor); } .mini .g-council { fill:var(--g-council); } .mini .g-mpt { fill:var(--g-mpt); }
.mini .g-staff { fill:var(--g-staff); } .mini .g-board { fill:var(--g-board); }
.mini .grid { stroke:var(--line); }
/* Financials (spending.html, funds.html, projects.html, project.html): one accent hue for single-series
   charts, three categorical slots (validated: blue, orange, aqua) for the project cost bar */
:root { --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --track:#e9e6de; --grid:#ece9e1; }
@media (prefers-color-scheme: dark) {
  :root { --s1:#3987e5; --s2:#d95926; --s3:#199e70; --track:#2c2e33; --grid:#2a2c31; }
}
.viz text { fill:var(--muted); font-size:11px; font-family:inherit; }
.viz .grid { stroke:var(--grid); } .viz .axis { stroke:var(--line); }
.viz .bar { fill:var(--s1); } .viz .bar:hover, .viz .bar:focus { opacity:.8; outline:none; }
.viz .line { fill:none; stroke:var(--s1); stroke-width:2; } .viz .dot { fill:var(--s1); stroke:var(--card); stroke-width:2; }
.viz .zero { stroke:var(--muted); stroke-dasharray:3 3; }
.viz .hit { fill:transparent; cursor:pointer; }
.num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:8px; margin:8px 0; }
.kpi { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:8px 10px; }
.kpi b { display:block; font-size:18px; font-weight:650; font-variant-numeric:tabular-nums; }
.kpi span { color:var(--muted); font-size:12px; }
.hbar { display:flex; align-items:center; gap:6px; }
.hbar i { display:inline-block; height:8px; border-radius:0 4px 4px 0; background:var(--s1); min-width:2px; }
.costbar { display:flex; height:14px; border-radius:4px; overflow:hidden; background:var(--track); gap:2px; }
.costbar span { display:block; height:100%; }
.k1 { background:var(--s1); } .k2 { background:var(--s2); } .k3 { background:var(--s3); }
.disclaimer { border-left:3px solid var(--s2); padding:6px 10px; background:var(--card); font-size:13px; color:var(--muted); margin:8px 0; }
.filters { display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:14px; }
.filters input[type=search] { min-width:200px; }
.pager { display:flex; gap:8px; align-items:center; margin:8px 0; font-size:14px; }
.lowcov { color:var(--nay); font-size:11px; }
@media (max-width: 600px) { .hide-sm { display:none; } }
/* Projects & Initiatives (projects.html, project.html): five validated categorical slots for the
   timeline lanes (blue, orange, aqua, yellow, magenta; lanes are labeled, an event table repeats them) */
:root { --l1:#2a78d6; --l2:#eb6834; --l3:#1baf7a; --l4:#eda100; --l5:#e87ba4; --laneb:#f4f2ec;
        --st-done:#2e6b3a; --st-active:#1f5f8b; --st-plan:#8a5a00; --st-stop:#a33a2b; }
@media (prefers-color-scheme: dark) {
  :root { --l1:#3987e5; --l2:#d95926; --l3:#199e70; --l4:#c98500; --l5:#d55181; --laneb:#202227;
          --st-done:#8fcf9b; --st-active:#79b8e6; --st-plan:#e2b35c; --st-stop:#e4826f; }
}
.badge { display:inline-block; font-size:12px; font-weight:600; border:1px solid currentColor; border-radius:999px; padding:0 8px; white-space:nowrap; }
.st-done { color:var(--st-done); } .st-active { color:var(--st-active); } .st-plan { color:var(--st-plan); }
.st-stop { color:var(--st-stop); } .st-unknown { color:var(--muted); }
.tl-zoom { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:4px 0; }
.tl-zoom button { padding:2px 9px; font-size:13px; cursor:pointer; }
.tl-wrap { touch-action:pan-y; }
.tlc { cursor:grab; user-select:none; }
.tlc .lbl { fill:var(--fg); font-size:11px; }
.tlc .lanebg { fill:var(--laneb); }
.tlc .band { fill:var(--muted); opacity:.35; }
.tlc .band.st-done { fill:var(--st-done); opacity:.45; } .tlc .band.st-active { fill:var(--st-active); opacity:.5; }
.tlc .band.st-plan { fill:var(--st-plan); opacity:.45; }
.tlc .now { stroke:var(--nay); stroke-dasharray:3 3; stroke-width:1.5; } .tlc .nowlbl { fill:var(--nay); font-size:10px; }
.tlc .dot { stroke:var(--card); stroke-width:2; } .tlc .dot.minor { opacity:.55; }
.tlc .xmark { stroke-width:2.5; fill:none; }
.tlc .mk { cursor:pointer; } .tlc .mk:focus { outline:none; } .tlc .mk:focus .dot, .tlc .mk:hover .dot { stroke:var(--fg); }
.tlc .hit { fill:transparent; }
.ln1 { fill:var(--l1); stroke:var(--l1); } .ln2 { fill:var(--l2); stroke:var(--l2); } .ln3 { fill:var(--l3); stroke:var(--l3); }
.ln4 { fill:var(--l4); stroke:var(--l4); } .ln5 { fill:var(--l5); stroke:var(--l5); }
.tlc .dot.ln1 { fill:var(--l1); } .tlc .dot.ln2 { fill:var(--l2); } .tlc .dot.ln3 { fill:var(--l3); }
.tlc .dot.ln4 { fill:var(--l4); } .tlc .dot.ln5 { fill:var(--l5); }
.tlc .xmark.ln1 { stroke:var(--l1); } .tlc .xmark.ln2 { stroke:var(--l2); } .tlc .xmark.ln3 { stroke:var(--l3); }
.tlc .xmark.ln4 { stroke:var(--l4); } .tlc .xmark.ln5 { stroke:var(--l5); }
.sw.ln1 { background:var(--l1); } .sw.ln2 { background:var(--l2); } .sw.ln3 { background:var(--l3); }
.sw.ln4 { background:var(--l4); } .sw.ln5 { background:var(--l5); }
.viz .mline { fill:none; stroke-width:2; } .viz .mline.k1 { stroke:var(--s1); } .viz .mline.k2 { stroke:var(--s2); }
.viz .mline.k3 { stroke:var(--s3); } .viz .mdot { stroke:var(--card); stroke-width:1.5; }
.viz .mdot.k1 { fill:var(--s1); } .viz .mdot.k2 { fill:var(--s2); } .viz .mdot.k3 { fill:var(--s3); }
.viz .dlabel { fill:var(--fg); font-size:11px; }
.sw.k1 { background:var(--s1); } .sw.k2 { background:var(--s2); } .sw.k3 { background:var(--s3); }
.evrow.hl td { background:var(--rowhl); }
.span { width:100%; height:10px; display:block; }
.span rect.bg { fill:var(--track); } .span rect.on { fill:var(--muted); opacity:.6; }
.cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:8px; }
.pcard { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:10px 12px; display:flex; flex-direction:column; gap:4px; }
.pcard h3 { font-size:15px; margin:0; font-weight:620; }
.pcard .row { display:flex; justify-content:space-between; gap:8px; font-size:13px; }
.toggle { display:inline-flex; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.toggle button { border:0; border-radius:0; cursor:pointer; } .toggle button[aria-pressed="true"] { background:var(--accent); color:var(--card); }
.panel-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:8px; }
.plist { list-style:none; margin:0; padding:0; } .plist li { padding:4px 0; border-bottom:1px solid var(--line); font-size:14px; }
.plist li:last-child { border-bottom:0; }
details > summary { cursor:pointer; }
th.sortable { cursor:pointer; } th.sortable:hover { color:var(--fg); }
/* Original contract vs change orders: neutral for the original scope, orange for increases, blue for
   credits, hatched for approved-not-yet-booked or unknown; a table repeats every value */
:root { --orig:#b9b4a6; --cur:#6b6a64; } @media (prefers-color-scheme: dark) { :root { --orig:#5a5850; --cur:#9a988f; } }
.wf .wf-orig { fill:var(--orig); } .wf .wf-cur { fill:var(--cur); } .wf .wf-up { fill:var(--s2); } .wf .wf-down { fill:var(--s1); }
.wf .wf-bar { stroke:var(--card); stroke-width:1; } .wf .wf-bgfill { fill:var(--card); }
.wf .hatchline { stroke-width:2.5; } .hatchline.wf-up { stroke:var(--s2); } .hatchline.wf-down { stroke:var(--s1); } .hatchline.wf-na { stroke:var(--muted); }
.wf .paidline { fill:none; stroke:var(--fg); stroke-width:2; } .wf .paiddot { fill:var(--fg); stroke:var(--card); stroke-width:1.5; }
.wf .refline { stroke:var(--fg); stroke-dasharray:5 4; opacity:.6; }
.sw.orig { background:var(--orig); } .sw.up { background:var(--s2); } .sw.down { background:var(--s1); }
.sw.hup { background:repeating-linear-gradient(135deg, var(--s2) 0 2px, transparent 2px 5px); border:1px solid var(--s2); }
.sw.paid { background:var(--fg); height:3px; }
.growbar { display:flex; height:8px; border-radius:3px; overflow:hidden; background:var(--track); gap:1px; min-width:60px; }
.growbar span { display:block; height:100%; } .growbar .o { background:var(--orig); } .growbar .u { background:var(--s2); } .growbar .d { background:var(--s1); }
.co-pos, .co-neg { font-weight:600; font-variant-numeric:tabular-nums; }
/* Cash-flow (Sankey) charts (cashflow.html, project.html; sankey.js): fund families on the eight
   validated categorical slots in fixed order (light and dark validated; three light slots sit below 3:1,
   so every node is labeled and a table repeats every flow); balancing bands are neutral and hatched */
:root { --fam1:#2a78d6; --fam2:#eb6834; --fam3:#1baf7a; --fam4:#eda100; --fam5:#e87ba4; --fam6:#008300; --fam7:#6250d6;
        --fam8:#e34948; --fam0:#a8a396; }
@media (prefers-color-scheme: dark) {
  :root { --fam1:#3987e5; --fam2:#d95926; --fam3:#199e70; --fam4:#c98500; --fam5:#d55181; --fam6:#008300; --fam7:#9085e9;
          --fam8:#e66767; --fam0:#6a685f; }
}
.fam-general { --c:var(--fam1); } .fam-capital { --c:var(--fam2); } .fam-water { --c:var(--fam3); } .fam-road_use { --c:var(--fam4); }
.fam-tif { --c:var(--fam5); } .fam-sewer { --c:var(--fam6); } .fam-debt { --c:var(--fam7); } .fam-special { --c:var(--fam8); }
.fam-unassigned, .fam-neutral, .fam-other { --c:var(--fam0); }
.sk-frame { overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:8px; background:var(--card); }
.sk { display:block; width:100%; min-width:760px; height:auto; }
.sk-link { fill:none; stroke:var(--c); stroke-opacity:.38; transition:stroke-opacity .12s; }
.sk-link.sk-res { stroke-dasharray:4 3; stroke-opacity:.3; }
.sk-link:focus { outline:none; stroke-opacity:.85; }
.sk-node { fill:var(--c); stroke:var(--card); stroke-width:1; }
.sk-nodeg.sk-res .sk-node { fill:var(--fam0); }
.sk-nodeg:focus { outline:none; } .sk-nodeg:focus .sk-node, .sk-nodeg:hover .sk-node { stroke:var(--fg); stroke-width:1.5; }
.sk-label { fill:var(--fg); font-size:11px; font-family:inherit; pointer-events:none; }
.sk-halo { paint-order:stroke; stroke:var(--card); stroke-width:3px; stroke-linejoin:round; }
.sk.sk-dim .sk-link { stroke-opacity:.08; } .sk.sk-dim .sk-link.sk-on { stroke-opacity:.7; }
.sk.sk-dim .sk-nodeg { opacity:.35; } .sk.sk-dim .sk-nodeg.sk-on { opacity:1; }
.skw { background:var(--c); } .sk-resw { background:repeating-linear-gradient(135deg, var(--fam0) 0 2px, transparent 2px 5px); border:1px solid var(--fam0); }
.sk-total { font-variant-numeric:tabular-nums; }
.vendor-only { border-left:3px solid var(--s1); padding:6px 10px; background:var(--card); font-size:14px; margin:8px 0; font-weight:550; }
.sk-hint { display:none; } @media (max-width: 760px) { .sk-hint { display:block; } }
