/* CityCounts — where the money goes (money*.html, member money section, vote money row). Ink on paper;
   For/Against keep their two colours; spending is solid, projects are hatched, money set aside is an outline. */

.mhead { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; padding: 28px 0 18px; flex-wrap: wrap; }
.mhead h1 { margin-top: 6px; }
.mhead .take { font-size: 16px; color: var(--ink-2); margin-top: 10px; max-width: 46em; }
.mhead .take b { color: var(--ink); font-weight: 600; }
.mback { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--ink-2); margin-top: 24px; }
.mback svg { width: 14px; height: 14px; }
.mback:hover { color: var(--ink); }
.mfoot { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--ink-3); margin-top: 12px; line-height: 1.5; }
.mfoot .grow { flex: 1; }
.key { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-2); white-space: nowrap; }
.key i { display: inline-block; width: 14px; height: 10px; border-radius: 2px; }
/* a long legend line in the footer wraps instead of pushing the page sideways at 390 px */
.mfoot .key { white-space: normal; min-width: 0; }
.mfoot .key i { flex: none; }
.key i.op { background: var(--ink-3); }
.key i.pr { background: repeating-linear-gradient(135deg, #8a8c93 0 1.6px, #e9e6df 1.6px 4.6px); }
.key i.rs { background: transparent; box-shadow: inset 0 0 0 1.5px var(--ink-2); }
.key i.tick { width: 2px; height: 12px; background: var(--ink); border-radius: 1px; }

/* ---------- landscape: treemap + heading panel ---------- */
.mboard { display: grid; grid-template-columns: minmax(0, 1fr) 470px; gap: 0; overflow: hidden; }
.tm-wrap { padding: 16px; display: flex; flex-direction: column; }
.tm { position: relative; flex: 1; min-height: 480px; }
.tm-tile { position: absolute; overflow: hidden; border-radius: 6px; background: #eeebe4; transition: box-shadow .12s; }
.tm-tile i { position: absolute; left: 0; top: 0; }
.tm-op { background: #dcd8cf; }
.tm-pr { background: repeating-linear-gradient(135deg, #cfcac0 0 1.4px, #ece9e2 1.4px 6px); }
.tm-tile:hover { box-shadow: inset 0 0 0 2px var(--ink); }
.tm-l { position: absolute; left: 10px; top: 9px; right: 8px; display: grid; gap: 1px; pointer-events: none; }
.tm-l.sm, .tm-l.md { left: 7px; top: 5px; }
.tm-l.md .tm-n { font-size: 12px; }
.tm-l.md .tm-v { font-size: 14px; }
.tm-n { font-size: 13px; font-weight: 600; line-height: 1.2; letter-spacing: -0.005em; }
.tm-v { font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; font-variant-numeric: tabular-nums; font-size: 12px; }
.tm-s { font-size: 12px; color: var(--ink-2); }
.tm-goal { position: absolute; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line-2); }
.tm-goal span { position: absolute; left: 10px; top: 5px; font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; right: 8px; }
.tm-tiny { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 10px 2px 0; font-size: 13px; color: var(--ink-2); }
.tm-tiny a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }

.hd { border-left: 1px solid var(--line); background: #fbfaf7; padding: 18px 20px 14px; display: flex; flex-direction: column; }
.hd-top { display: grid; grid-template-columns: minmax(0, 1fr) 66px 104px 92px; gap: 10px; font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.hd-top span:nth-child(3), .hd-top span:nth-child(4) { text-align: left; }
.hd-row { display: grid; grid-template-columns: minmax(0, 1fr) 66px 104px 92px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.hd-row:last-child { border-bottom: 0; }
.hd-row:hover .hd-n { text-decoration: underline; text-underline-offset: 3px; }
.hd-n { font-weight: 600; line-height: 1.25; }
.hd-ch { font-size: 13px; white-space: nowrap; }
.hd-rs { display: grid; gap: 2px; font-size: 12px; }
.rs-bar { position: relative; height: 9px; }
.rs-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 2px; box-shadow: inset 0 0 0 1.5px var(--ink-2); min-width: 2px; }
.rs-bar b { position: absolute; top: -2px; bottom: -2px; width: 2px; margin-left: -1px; background: var(--ink); border-radius: 1px; }
.hd-foot { margin-top: auto; padding-top: 10px; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.spark { display: block; overflow: visible; }

.nochips { margin-top: 18px; padding: 12px 16px; border-radius: var(--r); background: var(--wash); font-size: 13px; color: var(--ink-2); line-height: 1.7; }
.nochips b { color: var(--ink); font-weight: 600; margin-right: 4px; }
.nochips a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.nochips a:hover { text-decoration-color: var(--ink); }

/* ---------- follow the money: one issue ---------- */
.fig { display: flex; gap: 28px; align-items: baseline; flex-wrap: wrap; margin-top: 12px; }
.fig .big { font-size: 22px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; }
.fig .of { color: var(--ink-2); font-size: 15px; }
.fig .of b { color: var(--ink); font-weight: 600; }
.iboard { display: grid; grid-template-columns: minmax(0, 1fr) 340px; overflow: hidden; }
.sk-wrap { padding: 22px 22px 16px; }
.sk-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.sk-h h2 { font-size: 16px; }
.sk { position: relative; }
.sk svg { display: block; overflow: visible; }
.sk-rib { fill: rgba(23, 24, 28, 0.10); transition: fill .12s; }
.sk-rib.pr { fill: rgba(23, 24, 28, 0.06); }
.sk-rib:hover { fill: rgba(23, 24, 28, 0.24); }
.sk-node { fill: var(--ink-3); }
.sk-node.pr { fill: url(#hatch); }
.sk-lab text { font: 500 13px var(--sans); fill: var(--ink); }
.sk-lab text .v, .sk-lab text.v { fill: var(--ink-3); font-weight: 500; font-variant-numeric: tabular-nums; }
.sk-lab text .p, .sk-lab text.v .p { fill: var(--ink-3); font-size: 12px; text-decoration: underline; }
.sk-lab:hover text { text-decoration: underline; }
.sk-g { font: 600 14px var(--sans); fill: var(--ink); }
.sk-pct { font: 600 15px var(--sans); fill: var(--ink-2); pointer-events: none; }
.sk-gv { font: 500 13px var(--sans); fill: var(--ink-2); font-variant-numeric: tabular-nums; }
.aside { border-left: 1px solid var(--line); background: #fbfaf7; padding: 22px 22px 16px; display: grid; gap: 14px; align-content: start; }
.aside h3 { font-size: 15px; }
.aside p { font-size: 13px; color: var(--ink-2); }
.res-row { display: grid; gap: 4px; font-size: 13px; }
.res-row .top { display: flex; justify-content: space-between; gap: 8px; }
.res-row .top b { font-weight: 600; }
.res-row .rs-bar { height: 12px; }

.tl { margin-top: 8px; }
.tl svg { display: block; overflow: visible; }
.tl-c { fill: var(--ink-3); stroke: var(--card); stroke-width: 2; cursor: pointer; }
.tl-c.split { fill: var(--ink); }
.tl-c:hover { fill: var(--ink); stroke: var(--ink); }
.tl-y { font: 500 12px var(--sans); fill: var(--ink-3); }
.mvotes { padding: 8px 22px 6px; }
.mv-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) 100px 84px 372px; gap: 16px; align-items: start; padding: 12px 0; border-top: 1px solid var(--line); }
.mv-when { font-size: 13px; color: var(--ink-3); display: grid; gap: 2px; }
.mv-kind { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-2); }
.mv-what { display: grid; gap: 4px; min-width: 0; }
.mv-t { font-size: 14px; font-weight: 600; line-height: 1.35; }
.mv-t:hover { text-decoration: underline; text-underline-offset: 3px; }
.mv-q { font: 400 13px/1.45 var(--serif); color: var(--ink-2); max-width: 44em; }
.mv-q b { font-weight: 500; color: var(--ink); }
.mv-off { font-size: 13px; color: var(--ink); padding-left: 10px; box-shadow: inset 2px 0 0 var(--ink-3); }
.mv-why { font-size: 13px; color: var(--ink-2); }
.mv-links { display: flex; gap: 14px; font-size: 13px; }
.mv-links a { color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; display: inline-flex; align-items: center; gap: 3px; }
.mv-links a:hover { color: var(--ink); text-decoration-color: var(--ink); }
.mv-links svg { width: 10px; height: 10px; }
.mv-amt { font-size: 16px; font-weight: 600; text-align: right; letter-spacing: -0.01em; }
.mv-res { font-size: 13px; color: var(--ink-2); }
.msides { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
.ms { display: flex; align-items: center; gap: 8px; border-radius: 10px; padding: 5px 8px; min-height: 34px; }
.ms.for { background: var(--for-tint); color: var(--for-ink); }
.ms.against { background: var(--against-tint); color: var(--against-ink); }
.ms-h { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; }
.ms-h svg { width: 12px; height: 12px; }
.ms-f { display: flex; flex-wrap: wrap; gap: 2px; }
.ms-f .face { box-shadow: none; }
.min { margin-top: 12px; padding: 14px 16px; border-radius: var(--r); box-shadow: inset 0 0 0 1px var(--line-2); display: grid; gap: 8px; }
.min h3 { font-size: 14px; }
.min-row { display: flex; gap: 12px; font-size: 13px; align-items: baseline; flex-wrap: wrap; }
.min-row .num { font-weight: 600; }

/* ---------- MONEY_3: page links, line lists, moved money, compact card ---------- */
.fig a.big:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.pg { font-size: 12px; color: var(--ink-3); white-space: nowrap; text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; font-weight: 400; }
.pg:hover { color: var(--ink); text-decoration-color: var(--ink); }
.ll { display: grid; }
.ll-row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) 92px 52px; gap: 14px; align-items: center; padding: 7px 0; border-top: 1px solid var(--line); font-size: 13px; }
.ll > .ll-row:first-child { border-top: 0; }
.ll-n { font-weight: 600; line-height: 1.3; min-width: 0; }
.ll-s { display: block; font-size: 12px; font-weight: 400; color: var(--ink-3); margin-top: 1px; }
.ll-bar { height: 10px; }
.ll-bar i { display: block; height: 100%; border-radius: 0 3px 3px 0; background: var(--ink-3); min-width: 2px; }
.ll-row.pr .ll-bar i { background: repeating-linear-gradient(135deg, #8a8c93 0 1.6px, #e9e6df 1.6px 4.6px); box-shadow: inset 0 0 0 1px #b9b6ae; }
.ll-v { text-align: right; font-weight: 600; display: grid; line-height: 1.2; }
.ll-pc { font-size: 12px; font-weight: 400; color: var(--ink-3); }
.ll-row .pg { text-align: right; }
.ll-more > summary, .moved > summary { cursor: pointer; list-style: none; font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 9px 0; border-top: 1px solid var(--line); }
.ll-more > summary::-webkit-details-marker, .moved > summary::-webkit-details-marker { display: none; }
.ll-more > summary::before, .moved > summary::before { content: '+'; display: inline-block; width: 16px; color: var(--ink-3); font-weight: 600; }
.ll-more[open] > summary::before, .moved[open] > summary::before { content: '–'; }
.ll-more > summary:hover, .moved > summary:hover { color: var(--ink); }
.moved { margin-top: 14px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line-2); padding: 0 14px 4px; }
.moved > summary { border-top: 0; display: flex; align-items: baseline; gap: 12px; color: var(--ink); }
.moved > summary .mvd-l { flex: 1; font-weight: 600; }
.moved > summary b { font-size: 15px; font-weight: 600; }
.moved > p { margin: 0 0 6px; line-height: 1.5; }
.ll-row.mv { grid-template-columns: minmax(0, 1fr) 0 92px 52px; }
.ll-card { padding: 8px 22px 10px; }
.how { margin-top: 12px; font-size: 13px; line-height: 1.6; color: var(--ink-3); max-width: 78em; scroll-margin-top: 80px; }
.how b { color: var(--ink-2); font-weight: 600; }
.how a:not(.pg):not(.src) { color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; }
.how .pg { font-size: 13px; }

.ccard { display: grid; grid-template-columns: 330px minmax(0, 1fr); overflow: hidden; }
.cc-l { padding: 22px 24px 18px; border-right: 1px solid var(--line); background: #fbfaf7; display: grid; gap: 12px; align-content: start; }
.cc-r { padding: 22px 24px 16px; min-width: 0; }
.cc-k { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); display: flex; align-items: center; gap: 8px; }
.cc-take { font-size: 16px; line-height: 1.35; letter-spacing: -0.01em; margin: 10px 0 2px; max-width: 34em; }
.cc-take b { font-weight: 600; }
.cc-lead { font-size: 13px; color: var(--ink-3); margin: 0 0 8px; }
.card > .mvotes:first-child > .mv-row:first-child { border-top: 0; }
.cc-keys { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.res-row .top .num { white-space: nowrap; }
.cc-res .res-row .top { flex-wrap: wrap; gap: 0 8px; }
.cc-res { display: grid; gap: 10px; margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.trend { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; height: 150px; align-items: end; }
.tr-c { display: grid; grid-template-rows: auto 1fr auto; height: 100%; gap: 4px; justify-items: center; }
.tr-v { font-size: 12px; font-weight: 600; white-space: nowrap; align-self: end; }
.tr-b { width: 100%; max-width: 40px; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; }
.tr-b i { display: block; width: 100%; }
.tr-b i.op { background: var(--ink-3); border-radius: 0 0 2px 2px; }
.tr-b i.op:only-child, .tr-b i.pr[style*="height:0.0%"] + i.op { border-radius: 3px 3px 2px 2px; }
.tr-b i.pr { background: repeating-linear-gradient(135deg, #8a8c93 0 1.6px, #e9e6df 1.6px 4.6px); border-radius: 3px 3px 0 0; }
.tr-y { font-size: 12px; color: var(--ink-3); }

/* ---------- who gets City money: bubble grid ---------- */
.bgrid { padding: 8px 22px 12px; }
.bg-row { display: grid; grid-template-columns: minmax(0, 1fr) 520px 84px; gap: 14px; align-items: center; min-height: 38px; border-top: 1px solid var(--line); }
.bg-row.bg-head { border-top: 0; align-items: end; padding-bottom: 6px; font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.bg-cells { position: relative; display: grid; grid-template-columns: repeat(8, 1fr); align-items: center; height: 100%; }
.bg-head .bg-cells { align-items: end; }
.bg-y { display: grid; justify-items: center; gap: 3px; text-transform: none; letter-spacing: 0; }
.bg-tb { display: block; width: 26px; background: var(--ink-3); border-radius: 3px 3px 0 0; min-height: 1px; }
.bg-tv { font-size: 12px; font-weight: 500; color: var(--ink-2); }
.bg-yl { font-size: 12px; font-weight: 600; color: var(--ink-2); }
.bg-c { display: grid; grid-template-rows: 38px 15px; place-items: center; position: relative; z-index: 1; padding-bottom: 3px; }
.bg-c .bg-none { grid-row: 1; }
.bg-a { font-size: 12px; font-weight: 500; color: var(--ink-2); line-height: 1; white-space: nowrap; }
.bg-a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
.bg-dot { display: block; border-radius: 50%; background: var(--ink); box-shadow: 0 0 0 2px var(--card); cursor: default; }
.bg-dot.ocr { background: var(--ink-3); }
.bg-dot:hover { background: var(--ink-2); }
.bg-none { display: block; width: 4px; height: 1px; background: var(--line-2); }
.bg-line { position: absolute; left: 6%; right: 6%; top: 19px; height: 0; border-top: 1.5px dashed var(--ink-3); }
.bg-n { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding: 6px 0; min-width: 0; }
.bg-nm { font-size: 14px; font-weight: 600; }
.bg-is { font-size: 12px; color: var(--ink-3); }
.bg-is:hover { color: var(--ink); text-decoration: underline; }
.bg-link { display: inline-flex; gap: 6px; align-items: center; font-size: 12px; color: var(--ink-2); cursor: default; }
.bg-t { text-align: right; font-weight: 600; font-size: 14px; }
.bg-sub { padding: 16px 0 6px; border-top: 1px solid var(--line); font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.bg-sub small { display: block; text-transform: none; letter-spacing: 0; font-weight: 400; font-size: 13px; margin-top: 2px; }
.callout { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; align-items: baseline; margin: 16px 0 0; padding: 14px 16px; border-radius: var(--r); box-shadow: inset 0 0 0 1px var(--line-2); font-size: 13px; }
.callout b { font-weight: 600; }
.callout ol { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 4px 6px; color: var(--ink-2); }
.callout li::after { content: '→'; margin-left: 6px; color: var(--ink-3); }
.callout li:last-child::after { content: ''; }

/* ---------- who gets City money: bucket widget (length = dollars), filter chips ---------- */
.bkw { padding: 14px 22px 6px; }
.bkw-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px 24px; flex-wrap: wrap; margin-bottom: 8px; }
.bkw-top h2 { font-size: 20px; display: flex; align-items: center; gap: 10px; }
.bkw-top p { font-size: 13px; color: var(--ink-2); margin-top: 4px; max-width: 52em; }
.seg.sm button { padding: 6px 12px; font-size: 13px; }
.bk-head, .bk { display: grid; grid-template-columns: 300px 78px minmax(0, 1fr) 80px; gap: 14px; align-items: center; }
.bk-head { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); padding: 0 8px 6px; border-bottom: 1px solid var(--line); }
.bk-head span:nth-child(2) { text-align: right; }
.bk { width: 100%; text-align: left; padding: 1px 8px; min-height: 26px; border-radius: 8px; font: inherit; color: var(--ink); cursor: pointer; }
.bk:hover { background: var(--wash); }
.bk:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.bk[aria-pressed="true"] { background: var(--wash-2); }
.bk-n { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; line-height: 1.25; min-width: 0; }
.bk-ck { flex: none; width: 15px; height: 15px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px var(--line-2); display: grid; place-items: center; font-style: normal; }
.bk-ck svg { width: 10px; height: 10px; opacity: 0; color: var(--card); }
.bk[aria-pressed="true"] .bk-ck { background: var(--ink); box-shadow: none; }
.bk[aria-pressed="true"] .bk-ck svg { opacity: 1; }
.bk-c { text-align: right; font-size: 13px; color: var(--ink-2); }
.bk-c .muted { font-size: 12px; }
.bk-bar { position: relative; display: flex; align-items: center; gap: 8px; height: 20px; min-width: 0; }
.bk-bar i { display: block; height: 14px; border-radius: 0 4px 4px 0; background: var(--ink-3); flex: none; max-width: calc(100% - 64px); }
.bk-bar b { font-size: 13px; font-weight: 600; letter-spacing: -0.01em; white-space: nowrap; }
.bk-bar b[data-in] { position: absolute; left: 8px; color: var(--card); }
.bk[aria-pressed="true"] .bk-bar i { background: var(--ink); }
.bk.under .bk-bar i { background: repeating-linear-gradient(135deg, #8a8c93 0 1.6px, #e9e6df 1.6px 4.6px); }
.bk.under[aria-pressed="true"] .bk-bar i { background: repeating-linear-gradient(135deg, var(--ink) 0 1.8px, #e9e6df 1.8px 4.6px); }
.bk-sp { display: block; overflow: visible; }
.bk-sp rect:not([fill]) { fill: var(--ink-3); }
.bk-sp rect.o { fill: var(--ink-3); opacity: .45; }
.bk[aria-pressed="true"] .bk-sp rect:not([fill]):not(.o) { fill: var(--ink); }
.bk-sp line { stroke: var(--line-2); }
.bk-div { padding: 8px 8px 2px; margin-top: 4px; border-top: 1px solid var(--line); font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.fchips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 16px 0 10px; font-size: 13px; min-height: 34px; }
.fchips .grow { flex: 1; }
.fchip { display: inline-flex; align-items: center; gap: 8px; padding: 5px 8px 5px 12px; border-radius: 999px; background: var(--ink); color: var(--card); font: 500 13px var(--sans); cursor: pointer; }
.fchip span { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: rgba(255,255,255,.18); font-size: 14px; line-height: 1; }
.fchip:hover span { background: rgba(255,255,255,.34); }
.fclear { font: 500 13px var(--sans); color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.fclear:hover { color: var(--ink); }
.bg-more { display: flex; align-items: center; gap: 14px; padding: 4px 22px 18px; flex-wrap: wrap; }
.bg-row.under .bg-dot { background: repeating-linear-gradient(135deg, #55575e 0 1.6px, #e9e6df 1.6px 4px); box-shadow: 0 0 0 2px var(--card), inset 0 0 0 1px var(--ink-2); }
.bg-row.under .bg-nm { font-weight: 600; }

/* ---------- member profile: money votes ---------- */
.mm { padding: 6px 24px 14px; }
.mm-top { display: grid; grid-template-columns: auto auto minmax(0, 1fr); gap: 28px; align-items: center; padding: 16px 0 14px; }
.mm-big { display: grid; gap: 4px; justify-items: start; }
.mm-big b { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; line-height: 1; }
.mm-note { line-height: 1.5; }
.mm-row { display: grid; grid-template-columns: 210px minmax(0, 1.6fr) minmax(0, 1fr); gap: 16px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
.mm-head { font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 6px 0; }
.mm-head span { display: inline-flex; align-items: center; gap: 5px; }
.mm-head svg { width: 12px; height: 12px; }
.mm-n { font-size: 14px; font-weight: 600; }
.mm-n:hover { text-decoration: underline; text-underline-offset: 3px; }
.mm-c { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; min-height: 22px; }
.mm-dot { display: block; border-radius: 50%; flex: none; }
.mm-dot.for { background: var(--for); }
.mm-dot.against { background: var(--against); }
.mm-dot.split { box-shadow: 0 0 0 1.5px var(--card), 0 0 0 3px var(--ink); margin: 0 2px; }
.mm-s { font-size: 13px; color: var(--ink-2); margin-left: 6px; font-weight: 600; }

/* ---------- vote card: money row ---------- */
.vm { display: grid; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.vm-top { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.vm-top .k { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.vm-top .grow { flex: 1; }
.vm-amt { font-size: 20px; font-weight: 600; letter-spacing: -0.02em; line-height: 1; }
.vm-kind { font-size: 13px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--wash); }
.vm-issue { font-size: 13px; font-weight: 600; display: inline-flex; gap: 4px; align-items: center; }
.vm-issue svg { width: 12px; height: 12px; }
.vm-issue:hover { text-decoration: underline; text-underline-offset: 3px; }
.vm-bars { display: grid; gap: 6px; }
.vm-bar { display: grid; grid-template-columns: 58px minmax(0, 1fr) 250px; gap: 10px; align-items: center; font-size: 13px; }
.vm-p { font-weight: 600; text-align: right; }
.vm-l { color: var(--ink-2); }
.vm-track { display: block; height: 12px; border-radius: 3px; background: var(--wash-2); overflow: hidden; }
.vm-track i { display: block; height: 100%; background: var(--ink); border-radius: 3px; }
.vm-cap { font-size: 13px; color: var(--ink-2); }
.vm-flow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.vm-node .num { white-space: nowrap; }
.vm-node { display: inline-flex; gap: 6px; align-items: baseline; font-size: 13px; font-weight: 600; padding: 5px 10px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line-2); }
a.vm-node:hover { box-shadow: inset 0 0 0 1px var(--ink); }
.vm-arrow svg { width: 16px; height: 16px; color: var(--ink-3); display: block; }

@media (max-width: 1100px) {
  .mboard, .iboard, .ccard { grid-template-columns: minmax(0, 1fr); }
  .hd, .aside { border-left: 0; border-top: 1px solid var(--line); }
  .cc-l { border-right: 0; border-bottom: 1px solid var(--line); }
  .mv-row { grid-template-columns: 100px minmax(0, 1fr) 96px; }
  .mv-res { display: none; }
  .mv-row .msides { grid-column: 2 / -1; }
}
@media (max-width: 860px) {
  .mhead { padding: 18px 0 12px; }
  .mhead .take { font-size: 15px; }
  .tm-wrap { padding: 10px; }
  .tm { height: 440px; }
  .hd { padding: 14px 14px 10px; }
  .hd-top, .hd-row { grid-template-columns: minmax(0, 1fr) 66px 84px; }
  .hd-top span:nth-child(3), .hd-row .hd-ch { display: none; }
  .fig .big { font-size: 22px; }
  .sk-wrap, .aside { padding: 16px 14px 12px; }
  .mvotes { padding: 4px 14px; }
  .mv-row { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
  .mv-when { grid-column: 1 / -1; grid-auto-flow: column; justify-content: start; gap: 10px; }
  .mv-what { grid-column: 1 / -1; grid-row: 2; }
  .mv-amt { grid-column: 1 / -1; grid-row: 3; text-align: left; }
  .ll-card { padding: 4px 14px 8px; }
  .cc-l, .cc-r { padding: 16px 14px 12px; }
  .ll-row { grid-template-columns: minmax(0, 1fr) 76px 44px; gap: 4px 10px; }
  .ll-row .ll-bar { grid-column: 1 / -1; grid-row: 2; height: 6px; }
  .ll-row.mv { grid-template-columns: minmax(0, 1fr) 76px 44px; }
  .ll-row.mv > span:nth-child(2) { display: none; }
  .moved { padding: 0 10px 4px; }
  .mv-row .msides { grid-column: 1 / -1; }
  .bgrid { padding: 4px 12px 10px; }
  .bg-row { grid-template-columns: minmax(0, 1fr) auto; gap: 0 10px; }
  .bg-row .bg-cells { grid-column: 1 / -1; grid-row: 2; }
  .bg-head .bg-n, .bg-head .bg-t { display: none; }
  .bg-head .bg-cells { grid-row: 1; }
  .bg-tb { width: 18px; }
  .bg-tv { font-size: 12px; }
  .bg-yl { font-size: 12px; }
  .bg-c { grid-template-rows: 32px 13px; }
  .bg-a { font-size: 12px; letter-spacing: -0.02em; }
  .bg-line { top: 16px; }
  .mm { padding: 4px 14px 10px; }
  .mm-top { grid-template-columns: auto auto; gap: 12px 24px; }
  .mm-note { grid-column: 1 / -1; }
  .mm-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 12px; }
  .mm-row .mm-n { grid-column: 1 / -1; }
  .mm-head span:first-child { display: none; }
  .vm-amt { font-size: 22px; }
  .vm-bar { grid-template-columns: 52px minmax(0, 1fr); }
  .vm-l { grid-column: 2; margin-top: -4px; font-size: 13px; }
  .bkw { padding: 16px 12px 10px; }
  .bkw-top h2 { font-size: 16px; }
  .bk-head { display: none; }
  .bk { grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 7px 6px; }
  .bk-n { grid-column: 1; grid-row: 1; font-size: 13px; }
  .bk-c { grid-column: 2; grid-row: 1; font-size: 12px; }
  .bk-c::after { content: ' recipients'; }
  .bk-c:has(.muted)::after { content: ''; }
  .bk-bar { grid-column: 1; grid-row: 2; height: 16px; }
  .bk-bar i { height: 10px; }
  .bk-bar b { font-size: 13px; }
  .bk-bar b[data-in] { position: static; color: var(--ink); }
  .bk-sp { grid-column: 2; grid-row: 2; justify-self: end; width: 64px; height: 16px; }
  .fchips { margin-top: 12px; }
  .bg-more { padding: 4px 12px 14px; }
}

/* ---------- MONEY_4: channels, taxes not collected, checked decisions ---------- */
.m4-intro { font-size: 16px; color: var(--ink-2); margin-top: 10px; max-width: 46em; }
.m4-held { margin: 14px 0 4px; padding: 12px 16px; border-radius: var(--r-sm); background: var(--wash); font-size: 13px; color: var(--ink-2); }
.m4-held b { color: var(--ink); }
.m4-held ul { margin: 6px 0 0 18px; }
.m4-gaps { list-style: none; display: grid; gap: 8px; margin: 0; padding: 0; }
.m4-ch { padding: 18px 20px; margin-top: 14px; }
.m4-ch-h h3 { font-size: 20px; font-weight: 600; letter-spacing: -0.01em; }
.m4-words { font-size: 13px; color: var(--ink-2); margin-top: 2px; }
.m4-fig { margin-top: 12px; }
.m4-fig.none { color: var(--ink-2); font-size: 13px; }
.m4-fig-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.m4-big { font-size: 22px; font-weight: 600; letter-spacing: -0.025em; }
.m4-basis { font-size: 14px; color: var(--ink-2); }
.m4-yrs { font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.m4-bars { display: flex; align-items: flex-end; gap: 6px; height: 118px; margin-top: 10px; max-width: 560px; }
.m4-bar { flex: 1; display: grid; grid-template-rows: auto 1fr auto; height: 100%; text-align: center; min-width: 0; }
.m4-bv { font-size: 12px; color: var(--ink-2); white-space: nowrap; }
.m4-bt { position: relative; }
.m4-bt i { position: absolute; left: 12%; right: 12%; bottom: 0; background: var(--ink-3); border-radius: 3px 3px 0 0; min-height: 2px; }
.m4-by { font-size: 12px; color: var(--ink-3); }
.m4-rows, .m4-plan, .m4-off { margin-top: 12px; }
.m4-off-h { font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 8px 0 2px; border-top: 1px solid var(--line); }
.m4-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) 130px 220px; gap: 4px 14px; padding: 9px 0; border-top: 1px solid var(--line); font-size: 13px; align-items: baseline; }
.m4-row:first-child { border-top: 0; }
.m4-row.off { color: var(--ink-2); }
.m4-y { color: var(--ink-3); font-size: 13px; }
.m4-w { display: grid; gap: 3px; min-width: 0; overflow-wrap: anywhere; }
.m4-a { text-align: right; display: grid; gap: 2px; justify-items: end; }
.m4-amt { font-weight: 600; }
.m4-s { display: grid; gap: 3px; font-size: 13px; min-width: 0; }
.m4-src { white-space: normal; }
.m4-lab { font-size: 13px; color: var(--ink-2); }
.m4-both { font-size: 12px; color: var(--for-ink); }
.m4-tie { font-size: 12px; color: var(--ink-2); }
.m4-ov { color: var(--ink-2); border-left: 2px solid var(--line-2); padding-left: 6px; }
.m4-dec { font-size: 12px; }
.m4-dec.ok { color: var(--ink-2); }
.m4-dec .m4-q { font-size: 13px; color: var(--ink-2); }
.m4-q { font-family: var(--serif); font-size: 14px; color: var(--ink); quotes: '“' '”'; }
.m4-flows { padding: 4px 20px; }
.m4-flow { padding: 14px 0; border-top: 1px solid var(--line); display: grid; gap: 5px; }
.m4-flow:first-child { border-top: 0; }
.m4-f-top { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; color: var(--ink-3); }
.m4-kind { font-weight: 600; color: var(--ink-2); }
.m4-f-t { font-size: 15px; font-weight: 600; }
.m4-f-b { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; font-size: 13px; }
.m4-fa { display: inline-flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.m4-f-q { font-size: 13px; color: var(--ink-2); }
.m4-mem summary { font-size: 13px; color: var(--ink-2); cursor: pointer; }
.m4-mrow { font-size: 13px; display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 4px 0; }
.m4-empty { padding: 18px 20px; }
.m4-kinds { margin-top: 12px; }
.m4-kinds summary { cursor: pointer; font-size: 15px; padding: 6px 0; }
.m4-years { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.m4-yr { padding: 5px 11px; border-radius: 999px; background: var(--wash); font-size: 13px; font-variant-numeric: tabular-nums; }
.m4-yr.on { background: var(--ink); color: #fff; }
.m4-pte { padding: 18px 20px; }
.m4-pte .m4-row, .m4 #pte .m4-row { grid-template-columns: minmax(0, 1fr) 120px 170px; }
.m4-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.m4-two .card { padding: 16px 18px; }
.m4-two h3 { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.m4-two .m4-row { grid-template-columns: minmax(0, 1fr) 150px; }
.m4 .card > .m4-row { padding-left: 18px; padding-right: 18px; }
.m4-vm { display: grid; gap: 6px; }
@media (max-width: 760px) {
  .m4-row { grid-template-columns: 52px minmax(0, 1fr) auto; }
  .m4-row .m4-s { grid-column: 2 / -1; }
  .m4-pte .m4-row, .m4 #pte .m4-row { grid-template-columns: minmax(0, 1fr) auto; }
  .m4-two { grid-template-columns: 1fr; }
  .m4-two .m4-row { grid-template-columns: minmax(0, 1fr); }
  .m4-big { font-size: 20px; }
  .m4-ch { padding: 14px 14px; }
}
.m4-w .gapw, .m4-w > .gap, .m4-dec .gapw, .m4-dec .gap { justify-self: start; width: fit-content; max-width: 100%; }
.m4-a .gapw, .m4-a .gap { white-space: normal; max-width: 100%; }
.m4-a .gap span { white-space: normal; }
/* a gap marker in a row's words wraps inside its column: a nowrap marker widened the column's track, and the row's words
   ran under its amount at 390 px */
.m4-w .gap, .m4-w .gap span, .m4-dec .gap, .m4-dec .gap span { white-space: normal; }