fix(web): responsives Layout + zuverlaessiges Auto-Scrollen (mobil)

- Layout auf echte Viewport-Hoehe (100dvh, vh-Fallback); nur der Nachrichten-
  bereich scrollt (min-height:0), Eingabe + Mic-Button bleiben immer sichtbar
- Mobile: Menue als kompakte Kopfleiste, Chat fuellt den Rest
- Auto-Scroll zentralisiert (scrollToBottom via rAF) und bei token/semantic/done/
  neuer Nachricht ausgeloest; reagiert auf Tastatur (visualViewport) + Resize/Focus
  -> die neueste Antwort ist immer vollstaendig sichtbar

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

app/web/app.js

@@ -54,12 +54,17 @@ async function loadUsers() {
 }
 
 // ---------- Nachrichten-UI ----------
+// Nach dem naechsten Layout ans Ende scrollen -> die neueste Antwort ist sichtbar.
+function scrollToBottom() {
+  requestAnimationFrame(() => { messagesEl.scrollTop = messagesEl.scrollHeight; });
+}
+
 function addMessage(role, text) {
   const div = document.createElement("div");
   div.className = "msg " + role;
   div.textContent = text;
   messagesEl.appendChild(div);
-  messagesEl.scrollTop = messagesEl.scrollHeight;
+  scrollToBottom();
   return div;
 }
 
@@ -113,11 +118,12 @@ function runTurn(path, onopen) {
         case "token":
           if (!answerEl) answerEl = addMessage("assistant", "");
           answerEl.textContent += msg.text || "";
-          messagesEl.scrollTop = messagesEl.scrollHeight;
+          scrollToBottom();
           break;
         case "semantic":
           if (!answerEl) answerEl = addMessage("assistant", "");
           if (msg.text) answerEl.textContent = msg.text;
+          scrollToBottom();
           break;
         case "emergency":
           addMessage("emergency", "⚠ Notfall erkannt (" + (msg.category || "?") + ")");
@@ -126,6 +132,7 @@ function runTurn(path, onopen) {
           sampleRate = msg.sample_rate || 24000;
           playPcm(pcm, sampleRate);
           statusEl.textContent = "";
+          scrollToBottom();
           ws.close();
           break;
         case "error":
@@ -207,4 +214,11 @@ micBtn.addEventListener("click", () => {
 
 $("#reload-users").addEventListener("click", loadUsers);
 
+// Wenn die Bildschirmtastatur die sichtbare Hoehe aendert (iOS), unten bleiben.
+if (window.visualViewport) {
+  window.visualViewport.addEventListener("resize", scrollToBottom);
+}
+window.addEventListener("resize", scrollToBottom);
+promptEl.addEventListener("focus", () => setTimeout(scrollToBottom, 300));
+
 loadMe();