refactor: Avatar-Editor als wiederverwendbares Modal-Modul

- Neues avatar-editor.js: Upload, Paste, AI-Generate, Scale, Clear in einem Modal
- Session + Agent Pages: ~280 Zeilen doppelter Avatar-Code → je 5 Zeilen AvatarEditor.init/destroy
- Avatar-Preview klickbar → öffnet Modal mit allen Einstellungen
- chat.css: Shared-Content Message-Styling (max-width, border)

wwwroot/index.html

@@ -100,23 +100,7 @@
     </header>
     <div class="page-content">
       <div class="form">
-        <div class="avatar-section">
-          <div class="avatar-preview" id="sessionImagePreview">?</div>
-          <input type="file" id="sessionImageInput" accept="image/*" hidden>
-          <button id="sessionImageBtn">Bild ändern</button>
-          <button id="sessionImageClearBtn">Entfernen</button>
-        </div>
-        <div class="avatar-scale-row" id="sessionScaleRow" hidden>
-          <label>Zoom</label>
-          <input type="range" id="sessionAvatarScale" min="0.5" max="3" step="0.1" value="1">
-          <span id="sessionScaleValue">1×</span>
-        </div>
-        <div class="avatar-ai-section" id="sessionAiSection" hidden>
-          <div class="input-with-btn">
-            <input type="text" id="sessionAiPrompt" placeholder="Bildbeschreibung eingeben...">
-            <button type="button" id="sessionAiGenerateBtn" class="icon-btn" title="Bild generieren"><i class="fa fa-magic"></i></button>
-          </div>
-        </div>
+        <div class="avatar-preview" id="sessionImagePreview">?</div>
         <label>Name</label>
         <input type="text" id="sessionName" placeholder="Name der Session">
         <label>Agent</label>
@@ -169,23 +153,7 @@
     </header>
     <div class="page-content">
       <div class="form">
-        <div class="avatar-section">
-          <div class="avatar-preview" id="avatarPreview">?</div>
-          <input type="file" id="avatarInput" accept="image/*" hidden>
-          <button id="avatarBtn">Avatar ändern</button>
-          <button id="avatarClearBtn">Entfernen</button>
-        </div>
-        <div class="avatar-scale-row" id="agentScaleRow" hidden>
-          <label>Zoom</label>
-          <input type="range" id="agentAvatarScale" min="0.5" max="3" step="0.1" value="1">
-          <span id="agentScaleValue">1×</span>
-        </div>
-        <div class="avatar-ai-section" id="agentAiSection" hidden>
-          <div class="input-with-btn">
-            <input type="text" id="agentAiPrompt" placeholder="Bildbeschreibung eingeben...">
-            <button type="button" id="agentAiGenerateBtn" class="icon-btn" title="Bild generieren"><i class="fa fa-magic"></i></button>
-          </div>
-        </div>
+        <div class="avatar-preview" id="avatarPreview">?</div>
         <label>Name</label>
         <input type="text" id="agentName" placeholder="Name des Agents">
         <label>Model</label>
@@ -538,6 +506,7 @@
 <script src="js/history.js"></script>
 <script src="js/router.js"></script>
 <script src="js/commands-ui.js"></script>
+<script src="js/avatar-editor.js"></script>
 <script src="js/pages/dashboard.js"></script>
 <script src="js/pages/cronjob-page.js"></script>
 <script src="js/pages/agent-page.js"></script>