Fix mobile chat overflow and make reconnect banner non-shifting

On iPhone Safari (and other narrow viewports) the chat would overflow
horizontally when content arrived, and the reconnect indicator banner
would push the chat down/up as it mounted/unmounted, jumping text out
from under the user.

Changes:

- Bump eca-webview to pick up CSS hardening for chat messages: prose
  now wraps long unbreakable tokens, syntax-highlighted code blocks
  scroll internally, and the messages container can shrink to viewport
  width before children measure (eca-webview 646ac5a).

- AppLayout.css: defensive viewport clip on html/body
  (max-width: 100vw; overflow-x: hidden) plus width: 100% on .app-layout.
  Belt-and-suspenders against iOS Safari's horizontal rubber-band.

- RemoteSession.css: convert .reconnect-banner from a flex sibling to
  position: absolute (anchored to .remote-session, which already has
  position: relative). The chat no longer reflows when the banner
  mounts/unmounts, addressing the reporter's explicit request to make
  the indicator an overlay rather than a layout shifter.

Closes #1.

🤖 Generated with [eca](https://eca.dev)

Co-Authored-By: eca-agent <git@eca.dev>

Author: ericdallo

eca-webview

@@ -1,6 +1,17 @@
+/* Defensive viewport clip — prevents iOS Safari's horizontal rubber-band
+ * if any descendant briefly overflows the viewport during reflow. The
+ * webview's own overflow rules (pre, code, message wrappers) are the
+ * primary fix; this is a belt-and-suspenders for the browser shell. */
+html,
+body {
+  max-width: 100vw;
+  overflow-x: hidden;
+}
+
 .app-layout {
   display: flex;
   flex-direction: column;
+  width: 100%;
   height: 100vh;
   height: 100dvh;
   overflow: hidden;

src/components/AppLayout.css

@@ -67,11 +67,17 @@
 }
 
 /* ---------------------------------------------------------------------------
- * Reconnection banner — slim top bar, chat stays fully visible underneath.
- * Three visual states: reconnecting (amber), reconnected (green), failed (red).
+ * Reconnection banner — slim top overlay so the chat does not reflow when
+ * the banner mounts/unmounts. Anchored to the .remote-session container
+ * (which has position: relative). Three visual states: reconnecting (amber),
+ * reconnected (green), failed (red).
  * ------------------------------------------------------------------------- */
 
 .reconnect-banner {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -82,7 +88,7 @@
   font-size: 0.8rem;
   font-weight: 500;
   z-index: 1000;
-  flex-shrink: 0;
+  pointer-events: auto;
   animation: reconnect-slide-in 0.25s ease-out;
 }