Responsive client UI

1. Minimum viewport

Use a viewport width of 390 CSS px as the primary acceptance minimum. There must be no unintended overlap, clipping, page-wide horizontal scrolling, or inaccessible primary actions. Below 390px, layout requirements may be relaxed.

2. Decision order

1. First adjust space allocation or wrap elements onto another line; then consider text truncation, icon-only controls, or moving icons into the More menu.
2. Primary actions and primary states must not be omitted.
3. Do not hide conflicts through global clipping, reducing all font sizes, or shrinking click targets.
4. Reduce font sizes only when specifically required by product design.

3. Text truncation

1. Truncated content must be fully available on a secondary page or by opening a menu. Example: Session statistics below the input box.
2. Truncation must not lose errors or other key information.
3. Prefer single-line truncation for tab navigation, visible selectors, buttons, tags, and similar components.
4. Important information that is not available on another page must be displayed in full without truncation.