feat: center the chat conversation column

ui/src/pages/chat/chat-view.ts

@@ -310,7 +310,12 @@ export function renderChat(props: ChatProps) {
       })}
       class="card chat"
       style=${styleMap(
-        props.chatMessageMaxWidth ? { "--chat-message-max-width": props.chatMessageMaxWidth } : {},
+        props.chatMessageMaxWidth
+          ? {
+              "--chat-thread-max-width": props.chatMessageMaxWidth,
+              "--chat-message-max-width": "100%",
+            }
+          : {},
       )}
       @drop=${(event: DragEvent) => {
         event.preventDefault();

ui/src/styles/chat/layout.css

@@ -11,6 +11,8 @@ openclaw-chat-page {
 }
 
 .chat {
+  --chat-thread-max-width: 48rem;
+
   position: relative;
   display: flex;
   flex-direction: column;
@@ -101,6 +103,13 @@ openclaw-chat-pane:has(> .chat-pane__header) .chat-thread {
   margin-top: 0 !important;
 }
 
+.chat-thread-inner {
+  box-sizing: border-box;
+  width: calc(100% - 36px);
+  max-width: var(--chat-thread-max-width);
+  margin-inline: auto;
+}
+
 /* New messages indicator - floating pill above compose */
 .chat-new-messages {
   align-self: center;