Project Type
Personal
Timeline
2026
Team
Solo, design and build
Tools
React + TypeScript
Claude Code
What I did
- Designed and built the whole prototype solo in real code, five workspace views on one agent loop, with a mocked backend so the behavior itself is the design.
- Made the loop watchable. The plan, each tool call, its evidence, and its confidence stream in as work products, not as a spinner.
- Designed the approval gate the product is named for. The agent suspends at the consequential call, and autonomy is a policy a person grants, never a default.
- Built Graphite and Teal, the token-driven design system, so light and dark are one attribute apart.
Problem
Credit moves at the speed of trust, not analysis
Banks are fast when a file is simple, and slow when it needs judgment
FDIC Small Business Lending Survey, 2024. Wolters Kluwer Banking Compliance AI Trend Report, 2026.
The gap between one day and ten is the analysis. Someone has to pull the figures out of a deal document, spread them, test each covenant, rate the risk, and write the memo that defends the call. Most of that work is mechanical. None of the accountability is, because at the end a person signs, and the signature is what a regulator, a committee, or a court will ask about. That is why the obvious fix, letting a model write the memo, stalls in exactly this industry: the institutions most interested in AI are also the ones that rank explainability as their top regulatory worry. An answer nobody can inspect is not an answer anyone can sign.
Insight
The signature is the product
On a clean deal, the agent's own recommendation is approve. The loop still stops. Every run, whatever the numbers say, parks at the same gate and waits for a person. That is the name: a countersignature is the second signature that makes a document binding, and the agent's memo is only ever the first. So the design goal was never to automate the decision. It was to make the agent's work so inspectable that a human can put their name under it without redoing it. Even the one exception proves the rule: a person can grant a policy that lets a spotless first-pass approval sign itself after a visible countdown, autonomy countersigned in advance, never a default.
breaches === 0 ? 'approve' : riskScore >= 75 ? 'decline' : 'escalate'
The entire decision rule, verbatim from the repo. One line, and no branch ends the run. A breach blocks approval, and risk decides which kind of no: at 75 or higher the agent recommends against the deal, below that it is flawed but maybe fixable, so the judgment goes to a person.
Why this is hard
A right answer is not enough
A provenance problem
In regulated finance, a mostly-right answer with no working is a liability. Every extracted figure has to point back to the page it came from, and every step has to leave a trail an auditor can replay.
An uncertainty problem
Extraction is never uniformly confident, and the edge cases are where the risk lives. Confidence has to ride on every figure, and a critical flag has to change the agent's behavior, not just its color.
A gate problem
If approval is a dialog bolted on at the end, people click through it. The pause has to be structural. The loop itself stops, and the product cannot proceed until a person acts.
Solution
An agent loop you can watch, ending in a signature
Countersign runs one visible loop over a deal document: plan, act, observe, decide, and then stop. Every tool call shows its arguments going in and its data coming out. Results render as work products rather than raw output, so reading the run feels like reviewing an analyst's file, not tailing a log. The gate is not a confirmation dialog. The loop suspends itself at the consequential call, and nothing proceeds until a person acts.
| Stage | Why the stage exists |
|---|---|
| 1. Plan | The agent proposes its steps and waits. Nothing runs until a person approves the plan, and the approved composition goes on the audit trail. |
| 2. Act | Each tool call runs in the open, arguments in, data out, with a live timer. Nothing happens off screen. |
| 3. Observe | Results come back as artifacts, metric cards with per-figure confidence, a risk gauge, a covenant pass and fail table. |
| 4. Decide | Flags derive from the evidence. A covenant breach cannot be auto-approved, so the recommendation flips to escalate, or to decline when risk runs high. |
| 5. Countersign | The loop parks at the gate. The decision belongs to a human: countersign, amend the terms, send it back, or reject, and every verb lands in the audit trail. |
Process
Behavior cannot be mocked, so I built it
An agent's feel lives in its pacing: how reasoning streams, when a flag interrupts, what it is like to be asked for a decision mid-flow. None of that survives a static mockup, so I designed this by building it, solo, in Claude Code. The backend is deliberately mocked and deterministic. Every number is fictional, the extraction is simulated and labeled as such in the UI, and the same run replays identically, which turned every design question into something I could test by watching rather than argue by intuition.
Final Design
The gate the product is named for
The agent runs its plan in the open, extracting financials with a citation back to the page they came from, then scoring risk and testing covenants. A covenant breach cannot be auto-approved, so its own decision is to escalate. It assembles the memo, states its recommendation, and parks. The human's call is more than a binary: countersign, amend the terms first, send it back, or reject, and the reviewer's note goes on the record, optional to approve but required to reject or send it back.
The tradeoff
✕The version that shipped first
The June build's gate, captured from the repo's own history, had two buttons and no memory. Approve or reject, and either way the reviewer left nothing behind: the human was the least documented actor in a product whose whole argument is documentation.
✓Why it changed
A refusal cannot be blind: without a reason, the gate will not let go. And amending the terms previews the outcome through the same decision rule before anything is signed, so a waiver is a calculated act, not a hopeful one.
The note it drafts, and never signs
A note field that fills itself would quietly turn the gate into a rubber stamp, so this one starts empty and stays empty until asked. Draft from flags composes an evidence summary out of the package itself: the breaches on record, any open items, the structure on the table. It arrives as editable text, never pre-filled. What the record keeps is the note and its provenance, written by the reviewer, drafted and then edited, or drafted and accepted as written, and that distinction rides into the outcome banner, the audit log, and the export. An accepted machine summary is never mistaken for a person's own reasoning.
The third verb: send it back
Rejecting kills a deal, but most flawed memos are fixable, so the gate's third verb re-enters the loop instead of ending it. The reviewer's note becomes a tracked flag, the agent searches for the smallest structure change that clears every covenant, and it parks again on the revised figures as revision two, with the reviewer thread pinned above the numbers. When no cure exists within policy, it says so, and the decline stands.
The tradeoff
✕The version that shipped first
Reject was the only way to say no, and reject is terminal. A memo with a fixable flaw met the same fate as a genuinely bad deal: kill it, run again from zero, and lose the reviewer's reasoning along the way.
✓Why it changed
The objection became an input. The note rides into the revision as a tracked flag, the work carries forward instead of restarting, and the revised structure must pass the same one-line decide rule as the original analysis, so a cure can never be a special case.
What would change this decision?
The agent's call on the filed figures is fixed. The stress panel lets an analyst drag EBITDA, debt, rate, or liquidity and watch covenants, risk, and the recommendation recompute through the same decision rule the agent uses, so the what-if can never contradict the agent. The track under each slider is shaded with the decision at that value, every covenant test shows its distance to the threshold, and a scenario worth keeping attaches to the audit trail.
The tradeoff
✕The version that shipped first
The first stress panel recomputed live, but its tracks were blank. You dragged blind, hunting for the flip point, and whatever you found evaporated when you left the screen. Sensitivity analysis with no memory.
✓Why it changed
Painting the decision onto the control turns hunting into reading: the flip point is visible before you touch a slider. And an attached scenario gives the sensitivity test the same standing as every other event on the record.
Nothing runs until you approve the plan
The countersign gate has a twin at the other end of the run. Picking a deal proposes a plan instead of starting one: required steps locked, optional steps yours to exclude, and a cancellable countdown for the unattended case.
The tradeoff
✕The version that shipped first
The June build started the run the moment you picked a deal. The plan bar announced steps as they ran, but you could not touch it. The agent's first act was a fait accompli, and the human's first appearance came only at the end.
✓Why it changed
Now the plan is a proposal. Optional steps can be excluded, required steps are locked, and the unattended countdown logs itself as auto-started, so the trail never claims a human decision that did not happen.
Autonomy is a policy, not a promise
A header dial decides what the agent may resolve without a click: gate all, the default, or auto-clean, which covers only a spotless first pass. Recommendation approve, zero flags, every confidence at ninety percent or higher. The countdown is visible, any engagement holds it, and breaches always hard-gate.
The tradeoff
✕The version that shipped first
Every run gated identically, so a spotless first pass cost the same ceremony as a covenant breach. That is how gates die: when the hundredth clean click feels like ritual, people stop reading before they sign.
✓Why it changed
Autonomy became something a person grants, scoped to the runs where the gate had nothing to say. The signature reads auto, under policy, distinct from human ink, and one touch of any control takes the pen back.
The always-on half
Approval is a moment, but credit risk is a subscription. A monitoring agent sweeps the book, re-tests every covenant against drifting figures, and raises escalations when a deal breaches or headroom runs thin. Each one waits for a person to acknowledge it. The sweep runs on a stated cadence, so the header names the pass you are reading and when the next one lands, every figure carries its move since the last sweep, and each deal's four covenant tests sit beside it as a strip of pass and breach segments.
Every step, on the record
Every event in the run, tool arguments, results, flags, the approved plan, the reviewer's notes and whether each was written or drafted, and attached what-if scenarios, lands in a timestamped audit trail that exports as JSON. In this domain the trail is not a debug view. It is the compliance artifact a fund would archive.
A working prototype, not a mockup
The loop, the gate, the stress panel, and the monitor all run in the browser with no backend and no API keys. Press run and watch it work.
Design System
Graphite and Teal, one attribute from light to dark
Graphite and Teal is Countersign's own token system: one deep teal accent, graphite-navy ink on cool neutral surfaces, hairline borders, and depth carried by a surface ladder and a top-edge highlight rather than drop shadows. Teal is scarce and means live, active, or yours. Green, amber, and red carry pass, warn, and breach, and the two vocabularies never mix. The whole system ships with the product: DESIGN.md as a machine-readable spec with a do-not-resurrect list of everything tried and rejected, and a documented board deployed beside the app at /designsystem. The panels below are that page, one concern at a time.
The palette in both engines: the signature teal, the surface ladder, ink, and the functional trio, every value a token.
Inter is the voice, Geist Mono is the record: every number, eyebrow, and audit token is mono with tabular figures, a ledger rather than a sentence. Six steps, a weight ceiling of 600, no half-pixels.
Specimens assembled from real product data, including both signature blocks: the human hand and the auto policy. A dashed hairline marks a sandbox, and one glow token in the whole system is reserved for the gate alone.
The same gate, flipped by one data attribute with zero component changes. Elements announce themselves once, then go still. The only thing allowed to keep moving is a genuinely live state, like the seam of a gate still waiting for you.
Reflection
Designing an agent is designing when it stops
Most agent design effort goes into making the thing act. What earned trust here was the opposite work: where it pauses, what it refuses to decide, and how completely it shows its work while getting there. The gate, the flags, and the audit trail are the product. The analysis is just what they are wrapped around. And the only way to design any of that was to build it, because an agent's judgment calls live in its timing, and timing does not exist on an artboard.