A design plan for the web interface over ontology/deadline_engine.py. The engine is deterministic and the interface must look it. Every number on screen is arithmetic with a receipt — not a prediction.
The stdout clock already works. It is ordered by urgency, it aligns in columns, it states its own caveat in the header, and it declines to guess. Those four properties are the product's credibility. The interface inherits them literally rather than replacing them with cards and donut charts.
Target: the answer in under four seconds, the reason in one click, the proof in two.
No matter picker, no landing page. The app opens on a single sentence answering will we be ready, with the worst deadline named inside it.
The left rail is the stdout list, preserved: open deadlines sorted by days remaining, severity encoded in rail width and notches. The partner scans down, not across.
Centre panel expands: T-minus, the linked motion's element ledger, named gaps, pending counsel approvals. This is the stdout indented block, given room.
Any dotted-underlined figure opens the provenance drawer on the right: the computation, its inputs, the authority, the source document at the page.
Switch the centre panel to the blocking ladder. The AND/OR gate shows whether closing one gap actually unblocks the motion, or whether four more sit behind it.
Each gap carries a responsible role from the record. Assign, set a chase date, export the clock as a PDF memo for the risk committee.
Three fixed zones under a persistent verdict bar. Left rail (320px) — the clock, always visible, never collapses; it is the product's spine and losing it loses the plot. Centre — the selected deadline, switchable between ledger and ladder view. Right drawer (430px) — provenance, summoned on demand, overlays nothing; the partner must be able to read a receipt while still seeing the number it explains. A modal would break that and is prohibited.
Urgency (a property of the clock) and approval (a property of the record) are different questions. They get different hues and appear in different components, so a green pip never means "safe" and an oxblood rail never means "unapproved".
#eeece5 / #0f131d#1f4a3d / #6fb298#4a5470 / #98a2b8#9f1d16 / #ff8a80#c2661a / #e9a35c#7a6a3c / #c3b174| Role | Face | Used for | Setting |
|---|---|---|---|
| Identity | Iowan Old Style → Palatino → Georgia | Matter names, deadline titles, the verdict sentence | 600 wt · -0.01em · balance |
| Interface | system-ui grotesque | Labels, buttons, body copy, drawer prose | 15px / 1.55 |
| Data | ui-monospace → SF Mono → Menlo | Dates, T-minus, tallies, computations, citations, hashes | tabular-nums, always |
No webfont is loaded. The artifact CSP blocks font CDNs and a silent fallback on a legal instrument is worse than an honest system stack. All three roles resolve on every target machine.
Colour is never load-bearing alone. Each level carries a hue, a rail width, and a notch count — legible in greyscale, on a projector, and to a colour-blind partner.
Filled / dashed / struck survives desaturation. The three states come straight from motion_viability.support() — the UI invents no fourth.
The stdout SUMMARY footer, promoted to the top. A scanned surface must answer before it explains. The caveat from the engine's own header rides along permanently — it is not a footnote to bury.
No confetti, no green tick. The all-clear is the highest-stakes screen in the product — a partner is about to rely on it — so it carries more receipts than the failure state, not fewer: what was approved, when it was sworn, and the seal hash of the record it was computed from.
Shimmer blocks shaped like numbers are a lie in this product. Em-dashes hold the slot. A partner must never glance at a loading screen and read a number that isn't there yet.
Mirrors lp_ns.load, which raises rather than silently returning a thin graph. The UI must not be more optimistic than the engine.
A trailing ? on the T-minus, a badge, and a plain-language reason. Inferred dates are visually distinct from ordered dates everywhere they appear — including in exports.
| Component | Job | States |
|---|---|---|
| Verdict bar | One sentence: will we be ready | not-ready · at-risk · all-clear · uncomputable · loading |
| Clock rail | Ordered open deadlines | populated · loading · empty-no-deadlines · empty-new-matter · error · filtered-to-none |
| Deadline row | One deadline at a glance | 4 risk levels · overdue · date-unconfirmed · extension-pending · no-linked-motion · done (hidden by default) · loading · selected |
| Element ledger | Per-element support tally | approved · candidate · gap · impeached · contested-weight · empty (motion has no elements yet) |
| Gate badge | AND / OR test structure | AND-satisfied · AND-dead · OR-lit · OR-dark · mode-unknown |
| Blocking ladder | What blocks what | full graph · spine-isolated · single-element drill · empty (no dependencies) · too-large (>40 nodes → collapse) |
| Provenance drawer | Number → source document | full chain · partial chain · no source in record · document unavailable · loading · sealed/verified · seal-mismatch |
| Exposure panel | Contradictions impeaching our own support | clean · flagged-by-type · unclean-hands · estoppel-risk |
| Approval queue | What counsel must sign off | pending · approved · rejected · expired · not-my-role |
| Export | PDF memo for risk committee | ready · generating · stale-warning |
The most important interaction in the product. If this feels solid, the partner trusts everything else. If it feels thin, nothing else matters.
The affordance. Every derived figure — day counts, tallies, risk levels — carries a dotted underline. Raw transcribed values do not. So the dotted line means something precise: this was computed, and the computation is on file. One consistent affordance, product-wide, learned once.
The mechanism. Click opens the right drawer — never a modal. The partner must be able to read the derivation while still seeing the figure it explains, and compare two deadlines without losing place.
The content, in fixed order. Value → computation with real inputs → governing authority → source document at the page, with the span quoted → chain back up the graph → counsel state → seal.
Absence is rendered, never filled. When an element has no source, the slot shows a dashed oxblood no served copy in record — occupying the same visual position a citation would. The gap is as legible as the proof.
Not a force-directed node cloud. Those reshuffle on every load, and a diagram that moves when the facts didn't looks like it is guessing — fatal here.
The ladder has four fixed semantic columns, taken directly from the schema: evidence → element → logic gate → motion → deadline. Every node sits in exactly one column, every edge flows left to right, and the same data always renders identically. Layout is deterministic because the engine is.
The gate column is the idea. motion_viability.py encodes each motion's legal test as AND (every element required) or OR (any one ground sufficient) — and that distinction completely changes what closing a gap is worth. Closing one gap on an OR-test motion makes it bringable. Closing one gap on an AND-test motion with three open gaps buys nothing. No calendar tool shows this. It is the difference between a to-do list and a strategy.
Dash pattern carries the state independently of hue, so the ladder survives greyscale printing — which matters, because this diagram will end up in a committee pack.
Conflating those two is a malpractice-shaped bug. Each empty state names which one it is.
This matter has no open deadlines. That is either a matter at rest or an unentered docket — the record cannot tell which, and neither can we.
last docket sync: never
All six elements of the linked motion carry counsel-approved, unimpeached support. The motion is bringable now.
6 approved · 0 candidate · 0 gap · sealed a41f…9c02
Readiness cannot be computed until there is a docket to compute against. Three steps, in order:
No sample data, no demo matter. A fabricated clock in a legal tool is not a friendly onboarding — it is a hazard.
Choose a deadline from the clock to see its element ledger and blocking ladder.
The verdict bar and clock rail stay populated — the partner is never looking at a fully blank screen while real deadlines are running.