The whole app, squared away on warm cream — and clickable.
Every screen below is a self-contained HTML mockup on the ratified C2e Straight Edge foundation — warm deep-cream paper, straight 10px corners, sticker pills, ink outlines, token-drawn charts; orange stays a fill. Follow the day through the yard, or jump straight to a screen. The ☀/☾ toggle up top persists across every page.
One day at Summit Equipment Co.
The product story, walkable: Marco in the yard with no signal, Dana closing the money loop, Sam asking questions. Each step links into the screen where it happens.
Marco's walk-around — offline
Phone in a glove, no signal. A hydraulic leak becomes a photo, a fail, and a reported issue — task T-2205, linked to the exact question — parked on-device, synced at 8:42. A custom-object step parks politely instead of eating input.
Inspection runner →Dana opens the work order
WO-1042 groups both tasks (GearBot suggested it; Dana approved), attaches Ridgeline Construction, tracks parts and labor toward one number: $684.50.
Work order →Skid steer out the gate
SS-107 checks out to Ridgeline on rental R-2210 — the check-out inspection creates itself. The board shows what's out, what's due Friday, what's overdue.
Rental board →Sam asks GearBot
"What's due for service near Route 9?" Three units, distances, sources shown. Then a bigger ask: a Haul Tickets object — drafted, never created, until a human approves.
GearBot →The money loop closes
INV-2209 lands in QuickBooks by itself; paid-status mirrors back. No re-typing, no double books — and the sync health is inspectable, not mystical.
Integrations →Jump anywhere.
Every screen ships Light + Dark and its designed states (empty · loading · error · offline / needs-connection where they apply) — switchable from the ribbon on every page.
KPIs, needs-attention, today's feed with actor attribution, GearBot digest.
states: empty · loading · error · offline 🚜Fleet list260 units, filters, bulk bar — plus first-class empty, offline and error states.
states: empty · loading · error · offline 🔎Gear detail — EX-214Nameplates, tabs (overview · service · inspections · rentals · activity), visible ladder.
states: loading · error · offline ✓Inspection runnerMarco's phone: camera-first cards, report-an-issue → linked task, draft resume + auto-save + conflict seam, parked custom step.
INS · states: offline · online · complete · conflict · error ✓Inspections — hubSubmissions w/ filters + saved views, the anti-stall "pick up where you left off" strip, start pickers, due & scheduled (◇).
INS · states: empty · loading · error · offline 🔎Inspection — submissionSnapshot-pinned answers, reported-issues triage strip, comments, share link + public recipient view, write-back receipts.
INS · states: default · loading · error · offline · shared ▤Inspection templates & builderSections + drag-ordered questions, 12 field types, allow-issue config, gear assignment w/ impact preview; conditional logic ⚠ pending DQ-14.
INS · states: empty · loading · error · offline ✔Inspection review queueOldest-first pending queue, flagged answers + evidence up front, approve/flag, bulk-approve clean w/ confirm — designed ahead (DQ-25).
INS · states: empty · loading · error · offline 🔧Work order — WO-1042Tasks, parts, labor, billing — and “Generate invoice → QuickBooks” with a confirmation gate.
states: invoiced · loading · error · offline ⇄Rental boardWorklist columns from reserved to overdue; return flow sketched as a diagram.
states: empty · loading · error · offline — pending ratification · Attio §6 ✳GearBotAsk-anything with honest sources; draft-an-object with the approve gate front and center.
states: empty · error · needs connection — drafts · humans approve ▤Templates & objectsTemplates-over-blank gallery; custom objects with the needs-connection state designed.
states: empty · loading · error · needs connection ⚡AutomationsWhen-this-do-that as an Excalidraw chain, plus run history with a failing webhook expanded.
states: empty · loading · error · needs connection ⌁IntegrationsQuickBooks connect + sync health, telematics, Slack, MCP — seams shown honestly.
states: loading · error (disconnected) · needs connection ⚙SettingsTwo roles, zero matrix; API keys; webhooks with delivery health; workspace.
states: loading · error · offline — admin / member only ✎Gear form — new / editCreate or edit a unit: cascading Type→Make→Model, meters, ownership, custom fields, ActionsMenu, operational status.
FLE · states: default · loading · error · offline 📥Bulk CSV importUpload → map columns → durable import with live progress; row-level errors; idempotent on serial/VIN; export.
FLE · states: empty · loading · error · offline 🗺Fleet mapToken-drawn schematic (no live satellite): clusters, filters, honest fetch-cap, selected-asset location history.
FLE · states: empty · loading · error · needs connection 📊Fleet analyticsKPI tiles, type/make breakdowns (token-drawn), usage rollups, a permission-graceful admin-only metric.
FLE · states: empty · loading · error · offline 🗂Gear types & componentsType→Make→Model admin, Asset-Type-as-template (field set · status model · defaults), components with confirm-to-move.
FLE · states: empty · loading · error · needs connection ✓Tasks — listFilters (gear/assignee/status/type/source/component), free-text + due-date, My-recent toggle, type/status counts, fault-code dedup.
WRK · states: empty · loading · error · offline 🔧Task detailEnforced status machine, inspection-finding linkage, multi-assignee, comments, status-audit history, share link + external submit.
WRK · states: default · loading · error · offline · shared ⚠Issues — task viewA typed view of the Task entity (founder ruling 2026-07-08): finding + fault-code tasks in one triage lens. No Issue object; CAs descoped. SLA/recurrence overlays design-ahead.
WRK · states: empty · loading · error · needs connection 🧾Work orders — board10-state lifecycle, groups tasks, costing/billable + totals, asset/customer links, SLA automations. Rows → WO-1042 detail.
WRK · states: empty · loading · error · offline 📡Telematics — providers & syncThe live 6-provider set, manual Sync Now, coarse status + scheduled fleet-wide sweep (shipped); schedule-config UI + per-provider intervals (issue #252), sync-health dashboard, live progress — design-ahead.
SIT · states: empty · loading · error · offline 🔗Telematics units — reconcilePlaceholder auto-create + Claim/Merge with real error seams (shipped — FLE-14); the inventory lens + CSV export design-ahead (G-036 superseded).
SIT · states: empty · loading · error · offline ⏱EX-214 — telematicsPer-gear latest snapshot (full shipped field set, per-metric timestamps) + unreviewed faults; hours-over-time, mark-reviewed, create-task — design-ahead.
SIT · states: empty · loading · error · offline ⚡Fault codes — fleetFleet roll-up of the live per-gear fault lists (live route is a stub): severity + occurrence lens, mark-reviewed, CSV, fault→auto-task rules — designed ahead.
SIT · states: empty · loading · error · offline ▦Sites & geofencesGeofence P1 manage/draw shipped (real caps, PR #30); P2 activation (enter/exit, dwell, automations→task+DM, PR #254) + sites-as-records w/ assigned-vs-present — design-ahead.
SIT · states: empty · loading · error · offlineLaws, visible.
Ink rides on orange (7.07:1) — never small white-on-orange. Colored text is always a computed -strong token.
● ▲ ✖ ◆ next to words, never color alone. Machine data — units, VINs, hours, fault codes — is mono, always.
44px minimum targets, 48px for anything primary or state-changing. Offline never eats input — it parks it, visibly.
Foundation: design-foundation-vC2e-straight-diagrams.html → foundation-tokens-vC2e-straight.json (every contrast ratio computed · 42 pairs × 2 modes).
Self-contained HTML, no CDNs · Light + Dark persisted · reduced-motion respected · demo data: Summit Equipment Co. (fictional).