# Detail and form pages

Detail and form pages share a stable frame while adapting their content width to the task.

## Record context

- Use the record's stable prefixed reference as the contextual eyebrow when one exists.
- The page title names the record or task. Supporting copy explains the page purpose; it does not repeat the title, record name, or type.
- Keep local section navigation concise. A short sidebar label may differ from the complete page title when the meaning remains clear.
- Breadcrumbs, browser titles, actions, and supporting copy must use the active interface locale.

## Detail composition

- Split materially different information into titled semantic sections rather than one undifferentiated grid.
- Use definition lists for stable label-value information.
- Put the primary detail column first and a narrower supporting or summary column second on wide screens.
- A supporting column may be sticky when its content is short and directly assists the primary task.
- Use a subtle section surface and border to separate a supporting summary from the main reading or detail content.

## Dedicated create and edit flows

Use a dedicated page instead of a dialog when the task needs contextual guidance, more than a few fields, a live preview, plan or availability information, or a meaningful post-submit explanation.

- Constrain ordinary forms to a readable width; use the full frame for relationship managers and comparison tasks.
- Keep native text inputs, selects, and textareas aligned with the shared field tokens, including legacy forms.
- Exclude checkboxes, radios, file inputs, ranges, and color controls from blanket native-field styling.
- Put a preview or operational summary in a secondary column when it helps users validate the choice before submission.
- Use `Add [resource]` for the page entry action and `Create` or another precise verb for final submission.

## Rich choice controls

A rich choice control is appropriate when a boolean or small option needs a title, explanation, icon, preview, or consequence.

- Keep the native checkbox or radio in the accessible tree and make the complete card label clickable.
- Use the warm active surface for selection and the quiet hover surface for preview.
- Include a visible selected indicator and a focus-within outline.
- Connect explanatory copy with `aria-describedby`.
- For color or category choices, show the applied label preview as well as the swatch; color alone is never the selected-state signal.

## Discussions

- Put discussion history and the editor in one shared panel.
- Use a field-token border and focus-within ring around the editor.
- Localize the panel description, empty state, action labels, and processing label.
- Empty-state copy should name the current record type without baking that domain term into the reusable component.

## Product boundary

Record identifiers, route structure, authorization, validation, previews, domain terminology, and persistence remain application-owned.