Problem

The Control UI hard-codes .chat-group-messages { max-width: min(900px, 68%) } in the bundled CSS. On wide monitors (≥1440px), this leaves massive blank space on the right side of the chat area, making the UI feel cramped and wasteful.

Every OpenClaw upgrade overwrites the CSS bundle, so any manual patch is lost. Users currently have to re-patch minified CSS after every update.

Proposed Solution

Add a config option (e.g. webchat.chatMaxWidth or controlUI.chatMaxWidth) that injects a CSS custom property like --chat-max-width into the UI shell. The CSS rule would then read:

.chat-group-messages {
  max-width: var(--chat-max-width, min(900px, 68%));
}

This lets users customize via openclaw.json without touching the bundle:

{
  "webchat": {
    "chatMaxWidth": "min(1280px, 82%)"
  }
}

Alternatives Considered

• Custom CSS file injection: A controlUI.customCssPath option that loads an additional stylesheet. More flexible but heavier.
• Manual patching: Current workaround. Fragile, breaks on every upgrade.

Environment

• OpenClaw 2026.4.14
• macOS arm64
• Wide monitor (2560×1440+)