fix(mobile): overflow breaks — tables, composer, call bar, previews, cards (M1)

Mobile-audit batch 1. All fixes reuse cinny's own responsive primitives and are
mobile-gated so desktop is unchanged.

- Message tables: wrap <table> in an overflow-x container so a wide table scrolls
  instead of overflowing the message column / page body.
- Composer toolbar: let the before|editable|after row and the toolbar wrap on
  phones (@media <=750px) instead of squeezing the editable to zero and pushing
  Send off-screen.
- In-call control bar: collapse to the compact/stacked layout on a mobile
  viewport (ScreenSize.Mobile) too, not just when the bar's own container is
  <500px — fixes the 500-750px band where the control row overflowed.
- URL-preview card: base width toRem(400) -> min(25rem, 92vw) so a single card
  fits a narrow phone (still exactly 400px on desktop).
- Explore card grid: drop to one column at <=750px (was a fixed 3-col grid).

Two review passes: desktop behavior provably unchanged (all gated by @media /
ScreenSize.Mobile; the table wrapper only contains previously-overflowing tables).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/app/plugins/react-custom-html-parser.tsx

@@ -455,6 +455,17 @@ export const getReactCustomHtmlParser = (
           return <CodeBlock opts={opts}>{children}</CodeBlock>;
         }
 
+        if (name === 'table') {
+          // Sanitize allows tables, but a wide one would otherwise overflow the
+          // message column and the page body on narrow screens. Wrap it in a
+          // horizontally-scrollable container (same idea as CodeBlock's Scroll).
+          return (
+            <div style={{ overflowX: 'auto', maxWidth: '100%' }}>
+              <table {...props}>{domToReact(children as unknown as DOMNode[], opts)}</table>
+            </div>
+          );
+        }
+
         if (name === 'blockquote') {
           return (
             <Text {...props} size="Inherit" as="blockquote" className={css.BlockQuote}>