DESIGN.md@benchmarks/visual/common-ground git:20261013.29afc4fA

Immutable. This exact content never changes and is served at /api/v1/blob/4d7cfa44cece7dfb.

# DESIGN.md

## Visual Direction

- Design stance: Photographic architecture notebook
- Composition: Full-width photographic opening, a compact reading rail, then an unequal pair of portrait observations
- Dominant: The building's diagonal and the actual photograph
- Counterweight: A small observation index and disciplined captions
- Typography: Newsreader for identity and observation titles; Sora for navigation, captions, and body
- Material: Bright neutral reading canvas; photograph tones supply the major contrast; one restrained green accent
- Geometry: Continuous sections without decorative frames; compact rounded controls; portrait photographs preserve their physical edges
- Motion: A quiet image inspection state and tactile selection feedback; reduced motion keeps every final state usable
- Scope: Opening, observation collection, full-resolution modal, notes, source credits, and the ending

## Composition Map

- Opening: image-led full field; index stays high and title/caption share a local end edge so the building remains the dominant read.
- Introduction: centered short title beside a start-aligned reading measure; the paragraph is allowed to remain narrower than the section field.
- Observations: unequal portrait pair on wide screens; the larger image owns the first read and the smaller image begins lower as a deliberate counterweight. On narrow screens they become a single reading sequence with independent image widths.
- Field notes: tinted reading band; title and prose start on one local edge while the detail photograph keeps its own bounded measure instead of stretching to the text width.
- Ending: open source/credit field with compact footer; no filler grid is added to occupy unused width.
- Wide / intermediate / narrow: preserve the subject and reading order, but change image measure, caption relationship, and rail grouping before reducing type.
- At 601-900px the field-note rail becomes a compact centered label, the short title centers above start-aligned prose, and the smaller detail image ends the sequence at its own end edge. The previous two-track version at 768px squeezed the title and prose into a tall narrow strip; before/after screenshots record the repair.

Local style candidates fill missing fields. They do not replace this direction.