# EM-0043 - Register design system adoption

- Object ID: `em:documentation:sha256:5d78c264199a4f3894b54494c80ab3022420fc2389acda54c57801f9439315a6`
- Kind: `documentation`
- Repository path: [`docs/execution-plans/EM-0043.md`](https://github.com/yoheinakajima/epistemedia/blob/f92846570180dfa4511263f8ba98ecd18f7772c9/docs/execution-plans/EM-0043.md)
- Content digest: `4a7b93bffbd818da9dc70b9f9286e666af637888ea4dbeda7a5901ba50b0e1ce`

**Also filed under:** [Disclosure and Public Projection](https://epistemedia.org/topics/disclosure/), [Epistemedia](https://epistemedia.org/topics/epistemedia/), [Epistemic Mesh Protocol](https://epistemedia.org/topics/epistemic-mesh/), [Sovereign Realm Federation](https://epistemedia.org/topics/federation/), [Autonomous Governance](https://epistemedia.org/topics/governance/), [Knowledge Objects](https://epistemedia.org/topics/knowledge-objects/), [Human and Agent Interfaces](https://epistemedia.org/topics/public-interfaces/), [Releases and Reproducibility](https://epistemedia.org/topics/releases/), [Research Program](https://epistemedia.org/topics/research-program/), [Security and Adversarial Robustness](https://epistemedia.org/topics/security/)

## Source content

# EM-0043 - Register design system adoption

## Objective

Apply the owner-approved Register visual grammar to every generated Epistemedia human surface while
preserving the exact accepted knowledge record and every machine-readable representation.

## Accepted inputs and boundaries

- Epistemedia contract base: `4a5e154abda1bd7279f828f2aa67997a3ae44fbb`.
- Register design source: `yoheinakajima/register` at
  `5ac05e2758885d92ed2a9a8cfd4c6eb70ccbdbe4`.
- Register's `DESIGN.md`, shared stylesheet grammar, Case showcase, and dossier example are design
  references. Their sample content and navigation are not repository evidence and are not imported.
- Accepted Cases 001-004, source spans, relations, counts, evaluations, mission, open dockets,
  receipts, policies, schemas, and public object identities remain unchanged.
- The public `design-slop-cop` npm package was unavailable during the template audit. Its 0/14 score
  is a bounded tooling gap unless the package becomes available. The mapping below records each
  explicit `DESIGN.md` requirement as adopted, adapted, exempt, or not applicable; it does not claim
  scorer equivalence.

## Design mapping

1. Replace the large serif display layer with compact sans headings and preserve monospace only for
   identifiers, labels, counts, state, provenance, and code.
2. Replace decorative grid, gradient, shadow, radius, and card-wall treatments with Register's
   paper tokens, hairlines, aligned rows, restrained fills, and one accent plus explicit state colors.
3. Keep the existing semantic HTML and deterministic compilation model, adding only the shared
   chrome or structural hooks needed to make the system legible across all routes.
4. Recast topic-object collections as aligned records: kind and identity in the register column,
   human title and summary in the reading column, interlinks and technical identity retained but
   visually subordinate.
5. Keep exact count lists, source x-rays, ledgers, receipts, policy switches, native disclosures,
   and HTML/Markdown/JSON twins inspectable without JavaScript.
6. Retain an attribution note for substantial Register-derived design material under its MIT license.

## Register requirement mapping

When `design-slop-cop` is unavailable, record evidence for every row rather than infer its 0/14 score:

1. **Stylesheet, adopted.** Emit one shared external stylesheet for every HTML page. Do not add
   Tailwind, a component library, inline style blocks, or JavaScript required for completeness.
2. **Component grammar, adopted for new or changed markup.** Component classes name structure.
   Variants use `data-surface`, `data-series`, `data-state`, `data-style`, `data-size`, `data-kind`,
   `data-theme`, `data-display`, or `data-skin`, rather than decorative one-off class names.
3. **Surface vocabulary, adopted.** Permitted `data-surface` values are `tint`, `wash`, `deep`,
   `s1`-`s4`, `s1w`-`s4w`, `ok`, `open`, `stop`, `info`, and `duo`.
4. **Series and state vocabulary, adopted where represented.** `data-series` is `1`-`4` and only
   describes data. `data-state` is `done`, `active`, `waiting`, `blocked`, `parked`, `optional`,
   `live`, `reserved`, or `superseded`. Claim states map proposed, sourced, and derived to `waiting`;
   implemented and checked to `active`; verified and independently reproduced to `done`; refuted to
   `blocked`; and superseded and retired to `parked`.
5. **Style, size, kind, theme, and display vocabulary, adopted where represented.** `data-size` uses
   `sm`, `lg`, or `wide`; `data-style` stays component-specific; `data-kind` names the listed object;
   and `data-theme` plus `data-display` belong on `<html>`.
6. **Skin files, adapted.** Epistemedia ships one owner-selected look, not Register's skin gallery.
   Visual variation remains token-only in the shared stylesheet. No `data-skin` file is emitted, so
   skin load order, the skin schema, and the seven-line skin image brief are not applicable. A future
   skin would require a separately scoped change that restores those exact gates.
7. **Images, exempt for preserved assets and not applicable to new work.** EM-0043 adds no generated
   or photographic image and does not alter accepted deterministic SVG share cards. Therefore fixed
   image ratios, palette treatments, captions, provenance lines, prompt templates, pasted skin
   briefs, and the no-generated-text rule are not exercised. If an image enters scope, the task must
   stop rather than mark these requirements passed.
8. **Register identity, adopted.** Each inspectable object keeps its identifier in a consistent
   register position; at 390 px the identifier collapses inline without being hidden.
9. **Rule, do not box, adopted.** Hierarchy comes from hairlines and alignment. Routine content has
   no radius, blurred shadow, gradient, backdrop blur, colored edge stripe, or adjacent deep or
   series surfaces. At most one deep or series surface appears per viewport. A deep surface always
   uses the `--deep` token and never raw `#000`; any future skin relaxation may use only a hard-offset
   shadow, never a blurred shadow.
10. **Typography, adopted for generated chrome.** Identifiers, numbers, labels, and metadata are
    lowercase monospace; prose and headings are sans; names and sentences retain natural case; CSS
    does not use `text-transform: uppercase`.
11. **Color semantics, adopted.** Links and current state use one accent; ok, open, and stop use their
    state colors; series colors are limited to charts or labs; every color meaning also has a glyph
    or word.
12. **Plain-text twins, adapted to Epistemedia's compiler.** Every changed component has a visible
    list, table, key-value block, Markdown twin, or JSON twin. Epistemedia has no `components.html`;
    focused tests and the design mapping document replace Register's component-demo inventory. No
    new component may pass without one of those inspectable twins.
13. **Accent source and ration, adapted.** Epistemedia has no `accents.html` gallery and imports no
    decorative accent asset from Register. The shared stylesheet token block is the sole source of
    accent color or treatment. A page uses at most one signature accent, one texture, and one stamp;
    introducing an accent outside those tokens fails this check.
14. **Exact numbers, adopted.** Exact results use 20 px monospace; ordinary counts remain metadata;
    the largest stat-banner or scorer value is 22 px; no row promotes a value above that ceiling.
    Live readouts, when present, use 18 px monospace.
15. **Figure and source rules, adopted.** A filled figure block stands alone, never in a row. Every
    number strip or chart names its source run, claim, commit, dossier, or review receipt.
16. **Copy, adapted to preserve accepted bytes.** Newly authored navigation and explanatory chrome
    use plain verbs, sentence case, straight quotes, no filler, no em dash, and no emoji. Accepted
    source text, quotations, dossier findings, mission text, and research records remain byte-for-byte
    unchanged even when they contain smart punctuation or an em dash.
17. **Headline and identity integrity, adopted.** Headlines state a specific claim or question. No
    number, identifier, citation, or state is invented, and sample data is explicitly marked.
18. **Responsive behavior, adopted.** At 390 px, no page-level horizontal overflow exists except an
    explicit table wrapper, register columns collapse inline, focus remains visible, and native
    controls remain complete without JavaScript.

## Validation sequence

1. Add focused tests for shared tokens, forbidden visual treatments, compact heading bounds,
   metadata hierarchy, register-style topic rows, semantic chrome, and no-script output.
2. Run focused interface, dossier, mission, open-docket, and research-kit tests.
3. Build the full disposable site twice and run deterministic, disclosure, source-state, link,
   canonical, twin, sitemap, llms.txt, REST, MCP, and CLI checks through `make check`.
4. Serve the candidate locally and inspect representative routes at desktop and 390 px. Record one
   H1, page dimensions, overflow, focus visibility, native disclosure behavior, and console errors.
5. Audit the exact changed path scope and confirm accepted data bytes are unchanged.
6. Obtain a fresh exact-head independent review before protected integration. Validate resulting
   main and perform a separately gated Pages deployment and custom-domain read-back before saying
   the design is live.

## Status

- 2026-09-01: owner requested a site-wide adoption of the Register template after reviewing the
  current four-case Epistemedia design. Contract registration began from exact main
  `4a5e154abda1bd7279f828f2aa67997a3ae44fbb`.
- 2026-09-01: implementation began from the accepted contract merge
  `cf0c09fa01967c727d5f37f823f4bf745c44b083`. The compiler now emits one external
  `register.css` for every HTML projection and applies the Register paper, hairline, compact sans,
  monospace-register, accent, state, and responsive grammar across the homepage, case library,
  Cases 001-004, reviews, About, agent workflow, open dockets, topic projections, objects, Docs,
  Status, and build receipts. Accepted knowledge records and machine-readable twins were not
  edited.
- 2026-09-01: the focused interface suite passed (`32 passed`). The complete governed check passed:
  accepted-input validation, full test suite, public-projection audit, deterministic comparison
  build, and source-tree-state check. A headless Chrome audit covered 16 representative routes at
  both 1440 px and 390 px: all returned HTTP 200, had exactly one H1, one shared stylesheet, no
  script, no page-level horizontal overflow, and routine cards computed to no shadow, no radius,
  and no background image. The unavailable `design-slop-cop` package remains the bounded tooling
  gap documented above; no scorer result is claimed.
- 2026-09-01: exact-head independent review, protected integration, resulting-main validation, and
  separately gated live deployment verification remain pending.
- 2026-09-01: the first exact-head review of `bc43b4d7a2b626cadd0ef0948075cce456dc2702`
  returned CHANGES REQUIRED. It found one legacy `.scope-note` gradient and colored left border still
  effective on 15 generated pages, plus an underspecified CLI run receipt. The stylesheet now gives
  `.scope-note` the same final restrained paper-and-hairline treatment as the surrounding Register
  surfaces, and the interface suite asserts that this effective override follows the legacy rule.
- 2026-09-01: the corrected candidate again passed the full governed check. A fresh 32-observation
  browser audit across 16 routes at desktop and 390 px reported no route, H1, stylesheet, script,
  overflow, routine-card, or scope-note defects. A structured superseding receipt will bind the
  corrected tested commit and tree, commands, versions, catalog/frontier, output hashes, UTC times,
  and bounded scorer limitation before the second exact-head review.
- 2026-09-01: the second exact-head review of
  `1280605a8a84331cf0187fe4d5dedb91f5610025` closed both first-review defects, then found a long
  unbroken test identifier causing one public object route to measure 475 px wide at a 390 px
  viewport. Source-document paragraphs, list items, definitions, and code now wrap long technical
  tokens safely. The exact failing object class was added to the browser matrix; the corrected local
  result is 390 px client width and 390 px scroll width, with no overflow. A new structured receipt
  will supersede the now-outdated 32-observation receipt after exact-commit revalidation.
