feat: Multiple attachments + paste support (App + Diagnostic)

App:
- Multiple pending attachments (horizontal scroll preview)
- Individual remove (X) or clear all
- Send button shows when any attachment pending
- All files sent before text message

Diagnostic:
- Clip icon for file selection (multiple)
- Paste images/files from clipboard (Ctrl+V)
- Pending preview with thumbnails
- Files sent via RVS before text message

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

diagnostic/index.html

@@ -205,8 +205,14 @@
         <span><span style="animation:pulse 1s infinite;">&#x1F4AD;</span> <span id="thinking-text">ARIA denkt...</span></span>
         <button class="btn secondary" onclick="cancelRequest()" style="padding:2px 10px;font-size:11px;color:#FF3B30;border-color:#FF3B30;">Abbrechen</button>
       </div>
+      <div id="diag-pending-attachments" style="display:none;padding:6px 10px;background:#1E1E2E;border-radius:6px 6px 0 0;margin-bottom:-4px;display:flex;gap:6px;flex-wrap:wrap;align-items:center;">
+      </div>
       <div class="input-row">
-        <input type="text" id="chat-input" placeholder="Nachricht an ARIA...">
+        <label class="btn secondary" style="padding:6px 10px;cursor:pointer;font-size:14px;" title="Datei anhaengen">
+          &#x1F4CE;
+          <input type="file" id="diag-file-input" multiple accept="image/*,application/pdf,.doc,.docx,.txt" style="display:none;" onchange="handleDiagFileSelect(this.files)">
+        </label>
+        <input type="text" id="chat-input" placeholder="Nachricht an ARIA..." onpaste="handleDiagPaste(event)">
         <button class="btn" id="btn-gw" onclick="testGateway()">Gateway senden</button>
         <button class="btn" id="btn-rvs" onclick="testRVS()">Via RVS senden</button>
       </div>
@@ -939,21 +945,39 @@
       }
     }
 
+    function sendDiagAttachments() {
+      // Alle pending Dateien an RVS senden
+      for (const f of diagPendingFiles) {
+        send({ action: 'send_file', name: f.name, type: f.type, size: f.size, base64: f.base64 });
+      }
+      if (diagPendingFiles.length > 0) {
+        addChat('sent', `${diagPendingFiles.length} Anhang/Anhaenge`, 'Datei');
+      }
+      diagPendingFiles = [];
+      renderDiagPending();
+    }
+
     function testGateway() {
       const input = document.getElementById('chat-input');
       const text = input.value.trim();
-      if (!text) return;
-      addChat('sent', text, 'Gateway direkt');
-      send({ action: 'test_gateway', text });
+      if (!text && diagPendingFiles.length === 0) return;
+      if (diagPendingFiles.length > 0) sendDiagAttachments();
+      if (text) {
+        addChat('sent', text, 'Gateway direkt');
+        send({ action: 'test_gateway', text });
+      }
       input.value = '';
     }
 
     function testRVS() {
       const input = document.getElementById('chat-input');
       const text = input.value.trim();
-      if (!text) return;
-      addChat('sent', text, 'via RVS');
-      send({ action: 'test_rvs', text });
+      if (!text && diagPendingFiles.length === 0) return;
+      if (diagPendingFiles.length > 0) sendDiagAttachments();
+      if (text) {
+        addChat('sent', text, 'via RVS');
+        send({ action: 'test_rvs', text });
+      }
       input.value = '';
     }
 
@@ -1302,6 +1326,56 @@
       }
     }
 
+    // ── Diagnostic Anhang-Handling ─────────────
+    let diagPendingFiles = [];
+
+    function handleDiagFileSelect(files) {
+      for (const file of files) {
+        const reader = new FileReader();
+        reader.onload = () => {
+          const base64 = reader.result.split(',')[1];
+          diagPendingFiles.push({ name: file.name, type: file.type, size: file.size, base64 });
+          renderDiagPending();
+        };
+        reader.readAsDataURL(file);
+      }
+    }
+
+    function handleDiagPaste(event) {
+      const items = event.clipboardData?.items;
+      if (!items) return;
+      for (const item of items) {
+        if (item.kind === 'file') {
+          event.preventDefault();
+          const file = item.getAsFile();
+          if (file) handleDiagFileSelect([file]);
+        }
+      }
+    }
+
+    function renderDiagPending() {
+      const container = document.getElementById('diag-pending-attachments');
+      if (diagPendingFiles.length === 0) {
+        container.style.display = 'none';
+        return;
+      }
+      container.style.display = 'flex';
+      container.innerHTML = diagPendingFiles.map((f, i) => {
+        const isImage = f.type.startsWith('image/');
+        const preview = isImage ? `<img src="data:${f.type};base64,${f.base64}" style="width:40px;height:40px;border-radius:4px;object-fit:cover;">` : `<span style="font-size:20px;">&#x1F4C4;</span>`;
+        return `<div style="position:relative;display:inline-block;">
+          ${preview}
+          <span onclick="removeDiagPending(${i})" style="position:absolute;top:-4px;right:-4px;width:16px;height:16px;border-radius:8px;background:#FF3B30;color:#fff;font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;">X</span>
+        </div>`;
+      }).join('') + `<span style="color:#8888AA;font-size:11px;margin-left:4px;">${diagPendingFiles.length} Datei(en)</span>
+        <span onclick="diagPendingFiles=[];renderDiagPending();" style="color:#FF3B30;font-size:11px;cursor:pointer;margin-left:8px;">Alle X</span>`;
+    }
+
+    function removeDiagPending(idx) {
+      diagPendingFiles.splice(idx, 1);
+      renderDiagPending();
+    }
+
     // ── Abbrechen ──────────────────────────────
     function cancelRequest() {
       send({ action: 'cancel_request' });