[UX] Setup badges consume the new-chat mobile viewport

## Issue Description

On the new chat page at mobile widths, the setup badges wrap across multiple rows and expand to fill most or all of the top section. This pushes the primary chat workflow below the fold and makes the page feel dominated by secondary setup actions.

## Steps to Reproduce

1. Open Azure SRE Agent on a mobile device or resize the viewport to approximately 390 x 844 CSS pixels.
2. Navigate to **New Chat Thread**.
3. Observe the setup badges displayed above the primary chat content.

## Actual Behavior

The badges wrap vertically across multiple rows and consume a large portion of the viewport.

## Expected Behavior

The badges should remain in one compact horizontal row. When they exceed the available width, the row should support horizontal scrolling rather than vertical wrapping. The primary new-chat workflow should remain visible without excessive initial scrolling.

## Impact

Degrades the primary mobile entry experience and obscures the main chat action.

Start by reproducing the New Chat Thread at approximately 390 x 844 CSS pixels, then locate the setup badge layout implementation and inspect its mobile wrapping behavior. Done means the badges stay in one compact horizontal row with horizontal scrolling when needed, while the primary chat workflow remains visible without excessive initial scrolling.

Written by the indexing model from the issue text.