# Fig. System — RSM Field Notes editorial illustration spec (v1)

One reusable plate design for every blog illustration. New articles get a new
plate, never a stock photo. All plates are hand-authored SVG, dark/mint,
abstract operational line art — no dashboards, no screenshots, no client
marks, no invented data.

## Plate constants

- Canvas: `viewBox="0 0 880 520"` (also the rendered `width`/`height`).
- Background: `#07090c`.
- Frame: hairline rect at `x=20 y=20 w=840 h=480`, stroke `rgba(79,227,154,.18)`, width 1.
- Corner ticks: 20px L-marks at each frame corner, `#4fe39a` at 50% opacity, width 1.5.
- Plate label (top-left, inside frame): `x=40 y=56`, JetBrains Mono (falls
  back to any mono), 13px, letter-spacing 3, fill `#4fe39a`, format
  `FIG. NN — TITLE`.
- Caption (bottom-left): `x=40 y=482`, mono 10px, letter-spacing 2, fill `#4d5a52`.
- Signature (bottom-right): `x=840 y=482`, anchor end, mono 10px, fill `#4d5a52`,
  text `RSM · FIELD NOTES`.

## Palette

| Role            | Value                        |
|-----------------|------------------------------|
| Ink / canvas    | `#07090c`                    |
| Accent (mint)   | `#4fe39a`                    |
| Mint structural | `rgba(79,227,154,.35)`       |
| Hairline        | `rgba(79,227,154,.14)`       |
| Secondary text  | `#8ea096`                    |
| Tertiary text   | `#4d5a52`                    |
| Warning (amber) | `#ffb84a`                    |
| Amber soft      | `rgba(255,184,74,.4)`        |

## Stroke grammar

- Hairline guides: 1px, mint hairline color.
- Structural lines (lanes, perimeters, paths): 1.5px, mint structural.
- Focus elements (the thing the note is about): 2px, full accent or amber.
- Dashed = provisional / human / not-yet-resolved (`stroke-dasharray="5 6"`).
- Solid = the system's path. Amber marks the exception, never the norm.

## Type

Mono only, uppercase, letter-spacing ≥ 2. In-figure labels 10–13px.
Words allowed in plates are structural labels (TRIGGER, TEAM A, M T W…),
never metrics, client names, or outcomes.

## Composition rules

1. One concept per plate. The focus element sits off-center (left-third or
   right-third), matching the page's asymmetric layout.
2. Flow reads left → right; problems appear mid-path, resolution at the
   right edge or below.
3. Every plate includes at most one amber exception.
4. No numbers that read as results. Counts that are structural (8 slots,
   7 days) are allowed because the article itself defines them.

## Current plates

| Fig. | File | Article | Concept |
|------|------|---------|---------|
| 01 | `blog-ai-gate.svg` | When Not to Use AI in Sales | automated lane, gate diverts one record to a human-review lane |
| 02 | `blog-security-gap.svg` | The Security Gap in Most HubSpot Portals | portal perimeter with role checks and one unmonitored segment |
| 03 | `blog-workflow-errors.svg` | The Workflow Errors I See in Every HubSpot Portal | one trigger, branching paths, recurring error shapes |
| 04 | `blog-daily-habits.svg` | Building HubSpot into Daily Habits, Not Extra Work | seven day cells, usage dip, re-anchor |
| 05 | `blog-hygiene-eight.svg` | 8 U.S. HubSpot Data Hygiene Consultants for 2026 | eight ledger slots with fit-marker checks |
| 06 | `blog-handoff-report.svg` | How Custom HubSpot Reports Expose Handoff Failures | record crossing a handoff line; report frame surfaces the break |

## Adding a plate

Copy any plate file, keep the frame/label/caption/signature chrome, replace
the middle drawing, increment `FIG. NN`, register it in this table.