/* BUDGETGRID — Proof of ledger (.portal-proof / .pf-). Calm, precise, monospace where it matters. Tokens only. */
.portal-proof { background: var(--bg); }
.portal-proof .pf { display: flex; flex-direction: column; min-height: 100vh; padding-bottom: 96px; }

/* ---- top bar */
.pf-top { display: flex; align-items: center; gap: 14px; padding: 10px var(--gutter); background: var(--card); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; min-width: 0; }
.pf-top-l { flex: none; }
.pf-top-t { display: flex; flex-direction: column; line-height: 1.15; padding-left: 14px; border-left: 1px solid var(--line); white-space: nowrap; flex: none; }
.pf-top-t b { font-family: var(--font-display); font-size: 17px; font-weight: 600; }
.pf-top-t small { font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.pf-top-r { margin-left: auto; display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1; justify-content: flex-end; }
.pf-clock { font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); white-space: nowrap; padding-right: 6px; }
@media (max-width: 1000px) { .pf-clock { display: none; } }

/* ---- hero */
.pf-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 32px; padding: 44px 0 20px; align-items: start; }
.pf-eyebrow { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal-ink); margin-bottom: 14px; }
.pf-hero h1 { font-size: clamp(32px, 4.4vw, 54px); max-width: 14ch; margin-bottom: 14px; }
.pf-lede { font-size: 16px; color: var(--ink-2); max-width: 58ch; line-height: 1.6; }
.pf-props { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
.pf-props li { display: flex; gap: 10px; font-size: 13px; color: var(--ink-3); line-height: 1.45; }
.pf-props .ic { color: var(--grid-ink); flex: none; margin-top: 2px; width: 18px; height: 18px; }
.pf-props b { display: block; color: var(--ink); font-size: 13.5px; }

.pf-live { padding: 20px 22px 18px; border-top: 4px solid var(--grid); }
.pf-live.is-bad { border-top-color: var(--brick); }
.pf-live-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.pf-ok, .pf-bad { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-display); font-size: 21px; font-weight: 600; color: var(--grid-ink); }
.pf-bad { color: var(--brick-ink); }
.pf-ok .ic, .pf-bad .ic { width: 22px; height: 22px; }
.pf-live-meta { font-size: 12px; color: var(--ink-3); }
.pf-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pf-fact { background: var(--bg-2); border-radius: var(--r-2); padding: 10px 12px; min-width: 0; }
.pf-fact small { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ink-3); }
.pf-fact b { display: block; font-family: var(--font-display); font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; margin-top: 2px; overflow-wrap: anywhere; line-height: 1.2; }
.pf-fact .s { display: block; font-size: 11px; color: var(--ink-4); margin-top: 2px; }
.pf-head { margin-top: 14px; }
.pf-head small, .pf-hcmp small, .pf-pre-f small { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ink-3); margin-bottom: 4px; }
.pf-head-row { display: flex; align-items: center; gap: 6px; }
.pf-hash { font-family: var(--font-mono); font-size: 12px; word-break: break-all; color: var(--ink); background: var(--bg-2); border-radius: var(--r-1); padding: 8px 10px; flex: 1; line-height: 1.55; display: block; }
.pf-hash mark { background: var(--brick-wash); color: var(--brick-ink); border-radius: 2px; }
.pf-recon { margin-top: 12px; font-size: 13px; display: flex; align-items: center; gap: 8px; color: var(--ink-2); }
.pf-recon .ic { color: var(--grid-ink); width: 18px; height: 18px; }
.pf-verify-row { display: flex; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.pf-stale { font-size: 12.5px; color: var(--amber-ink); font-weight: 600; }
.pf-progress { height: 4px; border-radius: var(--r-pill); background: var(--bg-3); margin-top: 10px; overflow: hidden; opacity: 0; transition: opacity var(--t-fast); }
.pf-progress i { display: block; height: 100%; width: 0; background: var(--grid); border-radius: inherit; transition: width var(--t-base) var(--ease-out); }
.pf-progress.is-running { opacity: 1; } .pf-progress.is-running i { width: 40%; animation: pfSlide .9s var(--ease-in-out) infinite; }
.pf-progress.is-done { opacity: 1; } .pf-progress.is-done i { width: 100%; animation: none; }
@keyframes pfSlide { 0% { transform: translateX(-100%); } 100% { transform: translateX(260%); } }

/* ---- tabs + body */
.pf-tabs { margin-top: 4px; }
.pf-body { padding: 20px 0 0; display: flex; flex-direction: column; gap: 18px; }
.pf-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.pf-dim { color: var(--ink-4); }
.pf-code { font-family: var(--font-mono); font-size: 12.5px; background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r-2); padding: 12px 14px; margin: 0 0 12px; white-space: pre-wrap; word-break: break-word; color: var(--ink); }
.pf-steps { margin: 0 0 12px; padding-left: 20px; font-size: 13.5px; color: var(--ink-2); } .pf-steps li { margin-bottom: 6px; }
.pf-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pf-checks li { padding: 10px 0; border-bottom: 1px solid var(--line); } .pf-checks li:last-child { border-bottom: none; }
.pf-checks-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
.pf-check-h { display: flex; align-items: center; gap: 8px; } .pf-check-h b { font-size: 14px; }
.pf-check-s { font-size: 13px; color: var(--ink-3); margin-top: 3px; }
.pf-check-e { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
.pf-linkbtn { border: none; background: none; padding: 0; font: inherit; font-size: inherit; color: var(--cobalt-ink); cursor: pointer; text-decoration: underline; }

/* chain visual */
.pf-chain { display: flex; overflow-x: auto; padding: 6px 2px 10px; scrollbar-width: thin; }
.pf-node { flex: none; width: 188px; background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r-2); padding: 10px 12px; position: relative; }
.pf-node + .pf-node { margin-left: 30px; }
.pf-node + .pf-node::before { content: '→'; position: absolute; left: -24px; top: 50%; transform: translateY(-50%); color: var(--grid-ink); font-weight: 700; font-size: 16px; }
.pf-node.is-head { border-color: var(--grid); box-shadow: var(--glow-grid); }
.pf-node-id { display: flex; justify-content: space-between; align-items: center; gap: 6px; font-size: 12px; margin-bottom: 4px; }
.pf-node-memo { font-size: 11.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 6px; }
.pf-node-h { display: flex; justify-content: space-between; gap: 6px; font-size: 11px; } .pf-node-h small { color: var(--ink-4); text-transform: uppercase; letter-spacing: .04em; font-weight: 700; } .pf-node-h code { font-family: var(--font-mono); color: var(--ink-2); }
.pf-node-tag { position: absolute; top: -9px; right: 10px; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; background: var(--grid); color: var(--on-fill); padding: 1px 7px; border-radius: var(--r-pill); }

/* ---- invariants */
.pf-inv-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; } .pf-inv-head h3 { margin-bottom: 4px; } .pf-inv-head p { margin: 0; max-width: 72ch; }
.pf-sum { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; border-left: 4px solid var(--ink-4); }
.pf-sum.is-ok { border-left-color: var(--grid); } .pf-sum.is-bad { border-left-color: var(--brick); }
.pf-sum-k b { display: block; font-family: var(--font-display); font-size: 24px; font-weight: 600; line-height: 1.1; } .pf-sum-k small { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ink-3); }
.pf-sum-chain { margin-left: auto; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; } .pf-sum-chain small { font-size: 11.5px; color: var(--ink-3); font-family: var(--font-mono); }
.pf-inv td { vertical-align: top; } .pf-inv-name { font-weight: 600; min-width: 220px; } .pf-inv-ev { font-size: 12.5px; color: var(--ink-2); line-height: 1.5; max-width: 720px; }
.pf-inv tr.is-wait td { color: var(--ink-4); } .pf-inv tr.is-wait .pf-inv-name { color: var(--ink-3); }
.pf-inv tr.is-fail td { background: var(--brick-wash); }
.pf-inv tr.is-cur td { background: var(--amber-wash); }

/* ---- explorer */
.pf-ex-bar { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; padding: 14px 16px; }
.pf-ex-bar .search { min-width: 240px; }
.pf-sel { display: flex; flex-direction: column; gap: 4px; min-width: 150px; } .pf-sel span { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ink-3); } .pf-sel-line { min-width: 260px; flex: 1; }
.pf-ex-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--ink-3); margin-bottom: 10px; }
.pf-pager { display: inline-flex; align-items: center; gap: 8px; }
.pf-ex td { vertical-align: top; }
.pf-ex-id code { display: block; font-family: var(--font-mono); font-weight: 700; color: var(--ink); } .pf-ex-id small { display: block; font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.pf-ex-line small { display: block; font-size: 11px; color: var(--ink-4); margin-top: 2px; }
.pf-linebtn { display: flex; flex-direction: column; align-items: flex-start; border: none; background: none; padding: 2px 0; font: inherit; text-align: left; cursor: pointer; color: var(--ink); line-height: 1.3; max-width: 200px; }
.pf-linebtn b { font-family: var(--font-mono); font-size: 12px; color: var(--cobalt-ink); } .pf-linebtn span { font-size: 12.5px; } .pf-linebtn:hover span { text-decoration: underline; }
.pf-ex-memo { min-width: 200px; max-width: 320px; font-size: 13px; } .pf-ex-memo small { display: block; color: var(--ink-3); font-size: 11px; margin-top: 2px; }
.pf-jl { border-collapse: collapse; font-size: 12px; min-width: 280px; } .pf-jl td { padding: 2px 8px 2px 0; border: none !important; vertical-align: top; white-space: nowrap; } .pf-jl td:first-child { color: var(--ink-2); white-space: normal; min-width: 150px; } .pf-jl .num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; } .pf-jl td:nth-child(2) { color: var(--ink); } .pf-jl td:nth-child(3) { color: var(--teal-ink); }
.pf-ex-eff .chip { margin: 0 4px 4px 0; }
.pf-ex-hash code { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-2); }
.pf-ex-acts { display: flex; align-items: center; gap: 4px; margin-top: 4px; } .pf-ex-acts .icon-btn { width: 30px; height: 30px; }
.pf-ex-ver { margin-top: 6px; }
.pf-linepos { margin-bottom: 14px; border-left: 4px solid var(--cobalt); }
.pf-kvs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 14px 0 8px; }
.pf-kv { background: var(--bg-2); border-radius: var(--r-2); padding: 8px 10px; min-width: 0; } .pf-kv small { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ink-3); } .pf-kv b { display: block; font-size: 15px; margin-top: 2px; overflow-wrap: anywhere; } .pf-kv .money { font-size: 15px; }
.pf-kv.is-ok b, .pf-kv.is-ok .money { color: var(--grid-ink); } .pf-kv.is-neg b, .pf-kv.is-neg .money { color: var(--brick-ink); }

/* verify-entry modal */
.pf-vmod h4 { margin: 14px 0 6px; }
.pf-vmod-status { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pf-pre { display: flex; flex-direction: column; gap: 6px; background: var(--bg-2); border-radius: var(--r-2); padding: 10px 12px; }
.pf-pre-f { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 8px; align-items: baseline; } .pf-pre-f small { margin: 0; } .pf-pre-f code { font-family: var(--font-mono); font-size: 12px; word-break: break-all; color: var(--ink); }
.pf-hcmp { display: flex; flex-direction: column; gap: 10px; }

/* ---- balances */
.pf-tb-top { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; border-left: 4px solid var(--grid); } .pf-tb-top.is-bad { border-left-color: var(--brick); } .pf-tb-top h3 { margin-bottom: 4px; } .pf-tb-top p { margin: 0; max-width: 64ch; }
.pf-tb-tot { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; } .pf-tb-tot small { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ink-3); } .pf-tb-tot b .money { font-size: 20px; }
.pf-subtotal td { background: var(--bg-2); }
.pf-ident { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; } .pf-ident:last-of-type { border-bottom: none; }
.pf-ident-k { font-weight: 600; } .pf-ident-m { font-size: 12.5px; color: var(--ink-2); } .pf-ident.is-ok .pf-ident-m b { color: var(--grid-ink); } .pf-ident.is-bad .pf-ident-m b { color: var(--brick-ink); }

/* ---- tamper */
.pf-tp-form { display: flex; flex-direction: column; gap: 14px; }
.pf-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pf-mode { display: flex; flex-direction: column; gap: 3px; text-align: left; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: var(--r-2); background: var(--card); font: inherit; cursor: pointer; color: var(--ink); transition: border-color var(--t-fast), background var(--t-fast); }
.pf-mode:hover { border-color: var(--ink-4); } .pf-mode.is-on { border-color: var(--brick); background: var(--brick-wash); }
.pf-mode b { font-size: 13.5px; } .pf-mode small { font-size: 11.5px; color: var(--ink-3); line-height: 1.4; }
.pf-tp-entry { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); } .pf-tp-entry-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; } .pf-tp-entry-h code { font-family: var(--font-mono); font-weight: 700; }
.pf-tp-why p { margin: 0; color: var(--ink-2); max-width: 80ch; }
.pf-tp-res { border-left: 4px solid var(--ink-4); } .pf-tp-res.is-caught { border-left-color: var(--brick); } .pf-tp-res h4 { margin: 0 0 8px; }
.pf-diff tr.is-ch td { background: var(--amber-wash); } .pf-diff td.pf-ch { color: var(--brick-ink); font-weight: 700; }
.pf-tp-real { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }

/* ---- certificate */
.pf-cert-bar { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; } .pf-cert-bar h3 { margin-bottom: 4px; } .pf-cert-bar p { margin: 0; max-width: 64ch; }
.pf-cert-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.pf-cert-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; } .pf-cert-h small { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--teal-ink); } .pf-cert-h h2 { margin: 2px 0 4px; }
.pf-cert-seal { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: var(--r-pill); border: 2px solid var(--grid); color: var(--grid-ink); font-weight: 800; letter-spacing: .08em; font-size: 13px; } .pf-cert-seal .ic { width: 20px; height: 20px; } .pf-cert-seal.is-bad { border-color: var(--brick); color: var(--brick-ink); }
.pf-cert-t td:first-child { width: 190px; white-space: nowrap; } .pf-cert-t td { font-size: 13px; } .pf-cert-t .pf-hash { display: inline-block; }
.pf-cert-foot { margin: 14px 0 0; font-size: 13px; color: var(--ink-3); }

/* ---- footer */
.pf-foot { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-3); }
.pf-foot .ic { color: var(--teal-ink); }

/* ---- responsive */
@media (max-width: 1100px) { .pf-kvs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 960px) { .pf-hero { grid-template-columns: 1fr; gap: 22px; padding-top: 28px; } .pf-grid2, .pf-checks-2 { grid-template-columns: 1fr; } .pf-modes { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .pf-hide-m { display: none; } .pf-clock { display: none; } .pf-top { gap: 10px; } .pf-props { grid-template-columns: 1fr; } .pf-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pf-live { padding: 16px; } .pf-kvs { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pf-ident { grid-template-columns: 1fr; gap: 6px; } .pf-sum-chain { margin-left: 0; align-items: flex-start; } .pf-ex-bar .search, .pf-sel, .pf-sel-line { min-width: 100%; } .pf-pre-f { grid-template-columns: 1fr; gap: 2px; } .pf-cert-t td:first-child { width: 120px; white-space: normal; } .pf-tb-tot { gap: 12px; } .pf-hero h1 { max-width: none; } }
@media print { .pf-top, .pf-tabs, .pf-verify-row, .pf-progress, .pf-cert-bar, .pf-foot { display: none !important; } .pf-body > .callout { display: none; } }