ryux-ui: UI design

Group UI · Delivery Gate area UI · RX-2.0. Levels are defined in ryux-core.

Separate functional UI from decorative UI. Functional UI helps the user read, decide, or act. Decorative UI needs a stated reason (see the purpose gates in ryux-anti-slop).

Work in this order:

1. Hierarchy: what is read first, second, third? The primary action and key information win.
2. Layout and alignment: a shared grid; groups by meaning; consistent edges.
3. Spacing and type: one scale; size and weight carry hierarchy, not color alone.
4. Density: compact for repeat work, roomier for first-time or high-stakes decisions.
5. Color: roles first (surface, text, accent for the primary action, status); contrast checked.
6. Containers: use a container only when it groups or separates something.
7. Icons: next to labels, from one set, at consistent sizes.
8. Motion: only to explain change; short; never blocking.