Marketing system
One language.Every page.
The system for all Endurance marketing, written in itself. Product UI is a different file. Client demos keep the client identity.
01 · Color
Seven tokens, one accent.
The live values on .theme-paper in landing CSS. Paper is the ground; ink does the work; oxblood has one meaning. Do not invent neighbours.
Paper
The ground. Every page, edge to edge. No wash, no gradient.
--lp-paper · #ffffff
Ink
Claims, headings, figures, the filled button, link underlines.
--lp-ink · #1b1a22
Muted
Body, decks, labels, captions.
--lp-muted · #4d4b57
Line
Rows and frames. Section dividers use the same ink at 0.22.
--lp-line · rgba(27, 26, 34, 0.12)
Oxblood
Means held. The exception count and the gate in the drawing, a negative margin in the spreadsheet. Nowhere else.
--lp-flare · #b03a5e
Night
The close.
--lp-night · #141319
Snow
Type and the filled button on night.
--lp-snow · #f7f6fb
Product frames carry the product’s own red for a blocker; that is the product’s colour, quoted, not ours. Product-app tokens stay in app/globals.css.
02 · Type
Two faces, seven sizes.
Archivo on claims, headings, the closing statement, and every figure, in its tabular lining set so a column of numbers stacks. An American grotesque drawn for print, not a literary serif: a serif claim over a mono eyebrow is what every lab site converged on, and this is a freight ledger. IBM Plex Sans on everything else, including labels. Mono is not a voice of the site; it appears once, as the spreadsheet’s formula inside the hero scene.
The claim
Display, one per page. Tracking −0.04em, leading 1.
68
The number
The ledger's head figure. Tabular lining, tracking −0.035em.
56
The heading
One per section. Also the closing statement.
36
The deck
One step above the body, in muted. Follows the heading.
21
The body
Leading 1.66, measure 34rem.
17
The caption
Sub-labels, captions, the colophon.
14
The label
Sans, tracked 0.14em, uppercase. Numbered.
12
The claim, then its deck
One language, every page.
Roman everywhere. Weight and size carry the hierarchy, so nothing is set in italic.
Body runs at seventeen on a 34rem measure. Headings balance their own line breaks. Widows are the browser’s problem, and it handles them.
03 · Parts
What a page is made of.
Each part below is rendered by its live class, with the data the pages use. Use them. Do not redraw them.
The scene
A hero that is a place.
One per site. A photographed desk, and on its display a typeset spreadsheet of the work the product replaces. Over two screens of scroll the cells peel off, scatter, rush together, and the run assembles where they were, landing on Ready for review. Scroll drives five numbers on the stage; the cells carry their own flight plans as custom properties. Reduced motion shows the finished state, unpinned. The backdrop is the only photograph on the site.
See it on MarginsThe ledger
The proof, before the argument.
The head figure at 56, then label and value on one grid line, one hairline per row, and the colophon that names where the figures came from. Values in the serif’s tabular set.
$4,015,094
Commission settled through Margins
Average weekly payroll
across the closed weeks
$200,755
Loads priced
24,299
Audit lines behind those payouts
one per load, per earner
38,015
Every figure except the finance hours is drawn from the brokerage's production system on August 24, 2026. The hours are the finance team's own estimate.
The exhibit and its proof line
The product’s data, in our hand.
A caption, a serif head, a sub, then rows. It sits in the right column beside the copy, top on the heading, and the chapter’s figures follow it as one line of running text with serif numerals. Never a card with a shadow.
Load L284100
- Hutchins reserveOffice reserve · 5%$21.00
- Hutchins teamTeam pool · 70%$274.00
- Theo YorkDispatch share · 7%$29.00
- Margins keepsRemainder after payouts$89.00
13 pay mechanisms in force · 343 changes filed and reviewed: 311 approved, 29 rejected
The margin note
A story that hangs beside the argument.
When a chapter’s evidence is a sentence rather than a table, it hangs in the right column off a single hairline. Bold lead-in, then the account.
Caught before it paid. An audit found two people sharing one agent code. Every run was still a draft, so nothing had been disbursed, and the book went back to the broker who earned it.
The product frame
The screen, rebuilt in markup.
Never a bitmap. The product’s structure and palette, set in our sans with real text, so it reflows on a phone and stays crisp at any density. Full column, hairline frame, a caption beneath in our voice. The product’s own strings, verbatim.
1 blocker is holding the run
Step 3 — Run pay for the week — stays locked until every blocker is resolved. Warnings don’t block.
Blockers
1
must fix to run
Warnings
15
worth a look
$ at stake
$3,442.33
across 16 exceptions
Resolved
0 / 16
this session
The drawing
The mechanism, once.
One per page. Hairlines and the page’s own numerals, equal stations, no icons. Oxblood on the one thing that is held.
The closing statement
A pause between sections.
Roman, at heading size, on a 30ch measure, standing alone between two rules. Not a quotation: no marks, no italic, no attribution, because it is the firm speaking.
Margins was not designed and then sold. It was built inside a brokerage's Friday, against real loads and real disputes, until the spreadsheet had nothing left to do.
Rows
Outcomes, people, unlocks.
Every list is the same object as the ledger: one hairline per row, label left, the rest on the grid line. Numbered outcomes carry their numeral inline. A person is name and role left, bio right.
01The numbers match.
Margins is proven correct, and the spreadsheet is now redundant.
02Margins finds a difference.
That difference is the return on investment conversation, in your own dollars.
Alex Sok
CEO
Name in the serif, role as a label beneath it, the bio given the width.
Controls
One button, one link.
The filled button at radius 6, the same radius as every frame. Beside it the quiet action: an ink underline, no box. In running text, links underline in ink. The outlined pill is legacy: the form submit on night, and the Brain page’s second action.
The sheet
Still on the Brain page.
Paper with a lift, 920 wide, radius 6. The Brain page is still built from sheets. Margins and the homepage are not: they run as one document on the grid above, and new pages should too.
04 · Recipes
Three pages.
Same system. Different length.
01A product page
The scene, then the ledger. Then numbered chapters: heading, deck, body, and the evidence beside it, an exhibit with its proof line or a margin note. The product itself, rebuilt in markup, under the chapter that needs it. The run drawn once. A method section, the closing statement standing alone, the pilot as a ruled list, then night. This is endurancelabs.ai/margins.
02The lab homepage
A type-only hero, roman, no scene. Two product chapters with exhibits. The lab as prose, the method as the closing statement, the team as ruled rows. Night. This is endurancelabs.ai.
03A one-pager
One column. Claim, ledger, who to talk to. A leave-behind, not a site.
05 · Rules
Do, and do not.
Do
Paper white, edge to edge. One grid line for every right-hand element. Two faces, seven sizes; figures in the serif’s tabular set. Oxblood means held and nothing else. One hairline per row, a heavier one between sections. Evidence as exhibits and ledgers. The product rebuilt in markup. One drawing per page, one scene per site. Every figure names its source and date.
Do not
No gradients or washes. No floating frames, no tilt, no shadows under evidence. No bitmap screenshots. No generated illustration; the scene’s backdrop is the only photograph. No mono labels. No cards in grids. No accent word in the claim. No italic, and no serif. No second Talk on paper. No product-app tokens.