> ## Documentation Index
> Fetch the complete documentation index at: https://project-brain.rocheaiops.net/llms.txt
> Use this file to discover all available pages before exploring further.

# Visual system

> The reusable visual grammar for canonical state, providers, evidence, and future work.

PROJECT B.R.A.I.N. uses editable SVGs as its primary conceptual visual medium.
They use a light technical, schematic treatment: cool near-white canvas, thin
near-black linework, chamfered containers, short labels, and monospace
identifiers. Visuals explain accepted architecture; they do not imply that
deferred work is implemented.

| Element                         | Convention                                                                         |
| ------------------------------- | ---------------------------------------------------------------------------------- |
| Canonical B.R.A.I.N. state      | Coral strong-outline chamfered container, explicitly labeled canonical or durable. |
| Active current state            | Coral treatment plus a small `ACTIVE` pill.                                        |
| Provider or external service    | Blue strong-outline block, explicitly labeled external or replaceable.             |
| Derived or rebuildable state    | Neutral gray dashed container.                                                     |
| Evidence or provenance          | Neutral gray dashed support line with an explicit label.                           |
| Historical or superseded state  | Quiet gray treatment with a `SUPERSEDED` pill.                                     |
| Future component                | Separate gray dashed container labeled `FUTURE` or `not implemented`.              |
| Warning or unverified condition | Reserved warning hue only when an actual warning is present.                       |

Use `ui-monospace` for identifiers such as test IDs, defect IDs, commit
revisions, phase numbers, and status pills. Use sans-serif for prose labels.
Do not rely on color alone: meaningful states also use text, container shape,
line treatment, or position. Each diagram uses the composition that fits its
reader question, and dense visuals link to their full-size SVG for narrow
screens.