# THE ENIGMA FIELD — design contract

Version 1.0 · Proposed working standards · Public brand manual

## 0. Research log
- Supplied brand narrative and direction are the content authority. The connected amorphous, irregular multi-lobed teal point-cloud direction is approved; this manual does not imply approval of a final master logo.
- Inspected supplied connected-node.webp: luminous teal points on black, one connected organic form. Use the actual image, not an approximation or generated substitute.
- OMH taste foundations and design-system contract consulted. Local `omh design data --kind ux --context docs` informed reading measure, focus order and copy controls.
- External reference lane skipped: supplied identity and explicit LEARN / REFERENCE manual archetype determine the surface. No third-party visual assets or fonts.

## 1. Atmosphere & identity
Precise, expansive, grounded. Primary taste: minimalist/editorial, rendered as a dark studio field manual rather than the default cream/serif editorial style. Signature: the supplied connected point-cloud mark given a large, uninterrupted black stage. Audience: collaborators, designers and builders learning and applying the identity. Primary task: understand the brand, then find and download actionable standards.

Initial generation contract: dependency-free semantic HTML, local CSS and progressive-enhancement JavaScript. One public reading route `/`, ten anchored sections, persistent desktop contents and mobile disclosure. Authenticated annex is optional, separate, and absent from public source. Executor: frontend build owner; deployment and auth backend are outside this artifact.

## 2. Color
| Token | Value | Role |
|---|---|---|
| color.ink | #050708 | Main background |
| color.panel | #0B1012 | Quiet inset surfaces |
| color.teal | #96FCEA | Sampled primary accent; text on dark surfaces |
| color.ivory | #F4F7F7 | Primary text; light surface |
| color.muted | #A5B6B5 | Secondary text on dark |
| color.tealDark | #12685B | Accent text on ivory |
| color.line | #293738 | Structural rules |

Dark surfaces dominate; teal is reserved for the mark, selected navigation, focus and functional emphasis. Do not use light teal as text on ivory. Target WCAG AA: 4.5:1 body text, 3:1 large text and meaningful UI boundaries. Structural dividers are decorative, not sole control boundaries. No semantic meaning communicated by color alone.

## 3. Typography
- Display: `"Avenir Next", Avenir, "Segoe UI", sans-serif`; weight 500/600. Working type direction, not approved custom wordmark.
- Reading: `-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif`; weight 400/500/600; 16px base, 1.7 line-height; 68ch maximum measure.
- Tokens/labels: `"SFMono-Regular", Consolas, "Liberation Mono", monospace`; 12px labels, 14px code.
- Scale: 12, 14, 16, 20, 28, 40, 64, 88px. Fluid hero 48–88px; section headings 32–48px. Display line-height 1.02–1.15, tracking -0.04em. No body tracking. CJK inherits system coverage, 16px body, 1.7 leading, no forced truncation; localization is not yet reviewed.

## 4. Spacing & layout
4px unit: 4, 8, 12, 16, 24, 32, 48, 64, 96, 128px. Reading content maximum 1120px. Desktop navigation 248px. Main gutters fluid 24–72px. Editorial asymmetric pairs, horizontal rule-separated lists, not a repeated SaaS card grid. Section rhythm 96px desktop / 64px mobile. Window owns scrolling; desktop nav may scroll independently at short heights. At 1100px reduce navigation width; at 800px navigation becomes an in-flow sticky disclosure. At 540px paired content becomes a single column. Target review widths: 375, 768, 1440px.

## 5. Components
- Navigation: quiet default, ivory hover, teal active with visible left rule and aria-current. Mobile toggle exposes aria-expanded; no-JS contents remain available.
- Links: underlined in prose; downloads show format and asset status. Hover changes color; keyboard focus 2px teal outline, offset 5px. Active controls depress by 1px; no fake disabled links.
- Copy buttons: bordered native buttons, visible label, success and error announced through polite live status. Controls appear only with JS. Clipboard denial offers selecting the adjacent value.
- Specimen panels: flat dark or ivory surfaces, 1px rules, restrained 2px radius. No clickable card ambiguity.
- Private annex: loading announced; valid empty response explained; malformed/unauthorized/network failure removes private content and restores sign-in. Sign-out visible only when loaded. No public placeholder private copy.

## 6. Motion & interaction
160ms quick / 240ms standard, cubic-bezier(0.2,0,0,1). Only control color/border/transform transitions. No ambient drift in this manual; do not animate or regenerate the mark. Reduced motion removes transitions and smooth scrolling. Hash navigation works without JS. Private insertion uses text nodes only; private content is never stored or printed.

## 7. Depth & surface
No elevation system, blur, gradient or decorative shadow. Color planes and 1px rules define hierarchy. Point-cloud imagery never sits behind reading text. App-icon specimen uses a 24px radius because it illustrates a platform tile, not a general card style.

## 8. Accessibility constraints & accepted debt
Semantic landmarks, skip link, logical heading order, native links/buttons, explicit image alternatives, focus rings, mobile menu and live status. Public content works without JavaScript. Print is public-only, light ink on white, navigation and controls hidden. Private focus/expiry checks fail closed; CSS hides private content for print and the browser back-forward cache is revalidated.

Accepted debt: final vector master, wordmark specification, smallest-size optical trials, print color conversion, localized copy, browser/assistive-technology audit and measured performance remain pending. 32px flat-symbol minimum and quarter-width clear space are proposals, not tested production guarantees.

## Performance and verification contract
No external fonts, dependencies, analytics or service worker. Hero has intrinsic dimensions and eager priority; supporting study is lazy-loaded. Budget: LCP under 2.5s and CLS under 0.1 on `/`, public cold load, mid-tier mobile / simulated 4G. Baseline unavailable because this is a new surface; no performance or p75 field claim is made. Hero image is the expected LCP candidate, not measured attribution. Required subsequent QA: running-page captures at 1440/768/375px; keyboard, menu, copy, no-JS and print review; auth success, empty, failure, expiry and back-forward behavior. Static checks are not browser or accessibility PASS evidence.