Merge pull request 'semanticsearch' (#5) from semanticsearch into main

Reviewed-on: #5

.env.example

@@ -178,16 +178,16 @@ GIT_API_TOKEN=your-git-api-token
 # ============================================================================
 
 # Enable detailed audit trail of AI decision-making
-FORENSIC_AUDIT_ENABLED=true
+PUBLIC_FORENSIC_AUDIT_ENABLED=true
 
 # Audit detail level: minimal, standard, verbose
-FORENSIC_AUDIT_DETAIL_LEVEL=standard
+PUBLIC_FORENSIC_AUDIT_DETAIL_LEVEL=standard
 
 # Audit retention time (hours)
-FORENSIC_AUDIT_RETENTION_HOURS=24
+PUBLIC_FORENSIC_AUDIT_RETENTION_HOURS=24
 
 # Maximum audit entries per request
-FORENSIC_AUDIT_MAX_ENTRIES=50
+PUBLIC_FORENSIC_AUDIT_MAX_ENTRIES=50
 
 # ============================================================================
 # 10. SIMPLIFIED CONFIDENCE SCORING SYSTEM  

.gitignore

@@ -85,4 +85,3 @@ temp/
 .astro/data-store.json
 .astro/content.d.ts
 prompt.md
-data/embeddings.json

public/js/auditTrailRenderer.js

@@ -0,0 +1,389 @@
+// src/js/auditTrailRenderer.js
+
+import { auditService } from '../../src/utils/auditService.js';
+
+export class AuditTrailRenderer {
+  constructor(containerId, options = {}) {
+    this.containerId = containerId;
+    this.options = {
+      title: options.title || 'KI-Entscheidungspfad',
+      collapsible: options.collapsible !== false,
+      defaultExpanded: options.defaultExpanded || false,
+      ...options
+    };
+    this.componentId = `audit-trail-${Date.now()}-${Math.random().toString(36).substr(2, 6)}`;
+  }
+
+  /**
+   * Render audit trail from raw audit data
+   * FIXED: Proper Promise handling
+   */
+  render(rawAuditTrail) {
+    const container = document.getElementById(this.containerId);
+    if (!container) {
+      console.error(`[AUDIT RENDERER] Container ${this.containerId} not found`);
+      return;
+    }
+
+    if (!rawAuditTrail || !Array.isArray(rawAuditTrail) || rawAuditTrail.length === 0) {
+      this.renderEmpty();
+      return;
+    }
+
+    try {
+      console.log('[AUDIT RENDERER] Processing audit trail...', rawAuditTrail.length, 'entries');
+      
+      // Process audit trail using the centralized service (synchronous)
+      const processedAudit = auditService.processAuditTrail(rawAuditTrail);
+      
+      console.log('[AUDIT RENDERER] Processed audit:', processedAudit);
+      
+      if (processedAudit && processedAudit.phases && processedAudit.phases.length > 0) {
+        this.renderProcessed(processedAudit);
+        // Attach event handlers after DOM is updated
+        setTimeout(() => this.attachEventHandlers(), 0);
+      } else {
+        console.warn('[AUDIT RENDERER] No processed audit data');
+        this.renderEmpty();
+      }
+    } catch (error) {
+      console.error('[AUDIT RENDERER] Failed to render audit trail:', error);
+      this.renderError(error);
+    }
+  }
+  /**
+   * Render processed audit trail
+   */
+  renderProcessed(processedAudit) {
+    const container = document.getElementById(this.containerId);
+    if (!container) return;
+
+    const detailsId = `${this.componentId}-details`;
+    
+    console.log('[AUDIT RENDERER] Rendering processed audit with', processedAudit.phases.length, 'phases');
+    
+    container.innerHTML = `
+      <div class="audit-trail-container">
+        <div class="audit-trail-header ${this.options.collapsible ? 'clickable' : ''}" 
+             ${this.options.collapsible ? `data-target="${detailsId}"` : ''}>
+          <div class="audit-trail-title">
+            <div class="audit-icon">
+              <div class="audit-icon-gradient">✓</div>
+              <h4>${this.options.title}</h4>
+            </div>
+            
+            <div class="audit-stats">
+              <div class="stat-item">
+                <div class="stat-dot stat-time"></div>
+                <span>${auditService.formatDuration(processedAudit.totalTime)}</span>
+              </div>
+              <div class="stat-item">
+                <div class="stat-dot" style="background-color: ${auditService.getConfidenceColor(processedAudit.avgConfidence)}"></div>
+                <span>${processedAudit.avgConfidence}% Vertrauen</span>
+              </div>
+              <div class="stat-item">
+                <span>${processedAudit.stepCount} Schritte</span>
+              </div>
+            </div>
+          </div>
+          
+          ${this.options.collapsible ? `
+            <div class="toggle-icon">
+              <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <polyline points="6 9 12 15 18 9"/>
+              </svg>
+            </div>
+          ` : ''}
+        </div>
+        
+        <div id="${detailsId}" class="audit-trail-details ${this.options.collapsible && !this.options.defaultExpanded ? 'collapsed' : ''}">
+          ${this.renderSummary(processedAudit)}
+          ${this.renderProcessFlow(processedAudit)}
+          ${this.renderTechnicalDetails(processedAudit)}
+        </div>
+      </div>
+    `;
+
+    console.log('[AUDIT RENDERER] HTML rendered successfully');
+  }
+
+  /**
+   * Render audit summary section
+   */
+  renderSummary(audit) {
+    return `
+      <div class="audit-summary">
+        <div class="summary-header">📊 Analyse-Qualität</div>
+        <div class="summary-grid">
+          <div class="summary-stat">
+            <div class="summary-value success">${audit.highConfidenceSteps}</div>
+            <div class="summary-label">Hohe Sicherheit</div>
+          </div>
+          <div class="summary-stat">
+            <div class="summary-value ${audit.lowConfidenceSteps > 0 ? 'warning' : 'success'}">
+              ${audit.lowConfidenceSteps}
+            </div>
+            <div class="summary-label">Unsichere Schritte</div>
+          </div>
+          <div class="summary-stat">
+            <div class="summary-value">${auditService.formatDuration(audit.totalTime)}</div>
+            <div class="summary-label">Verarbeitungszeit</div>
+          </div>
+        </div>
+        
+        ${audit.summary.keyInsights && audit.summary.keyInsights.length > 0 ? `
+          <div class="insights-section">
+            <div class="insights-header success">✓ Erkenntnisse:</div>
+            <ul class="insights-list">
+              ${audit.summary.keyInsights.map(insight => `<li>${this.escapeHtml(insight)}</li>`).join('')}
+            </ul>
+          </div>
+        ` : ''}
+        
+        ${audit.summary.potentialIssues && audit.summary.potentialIssues.length > 0 ? `
+          <div class="insights-section">
+            <div class="insights-header warning">⚠ Hinweise:</div>
+            <ul class="insights-list">
+              ${audit.summary.potentialIssues.map(issue => `<li>${this.escapeHtml(issue)}</li>`).join('')}
+            </ul>
+          </div>
+        ` : ''}
+      </div>
+    `;
+  }
+
+  /**
+   * Render process flow section
+   */
+  renderProcessFlow(audit) {
+    if (!audit.phases || audit.phases.length === 0) {
+      return '<div class="audit-process-flow"><p>Keine Phasen verfügbar</p></div>';
+    }
+
+    return `
+      <div class="audit-process-flow">
+        ${audit.phases.map((phase, index) => `
+          <div class="phase-group ${index === audit.phases.length - 1 ? 'last-phase' : ''}">
+            <div class="phase-header">
+              <div class="phase-info">
+                <span class="phase-icon">${phase.icon || '📋'}</span>
+                <span class="phase-name">${phase.displayName || phase.name}</span>
+              </div>
+              <div class="phase-divider"></div>
+              <div class="phase-stats">
+                <div class="confidence-bar">
+                  <div class="confidence-fill" 
+                      style="width: ${phase.avgConfidence || 0}%; background-color: ${auditService.getConfidenceColor(phase.avgConfidence || 0)}">
+                  </div>
+                </div>
+                <span class="confidence-text">${phase.avgConfidence || 0}%</span>
+              </div>
+            </div>
+            
+            <div class="phase-entries">
+              ${(phase.entries || []).map(entry => `
+                <div class="audit-entry">
+                  <div class="entry-main">
+                    <span class="entry-action">${auditService.getActionDisplayName(entry.action)}</span>
+                    <div class="entry-meta">
+                      <div class="confidence-indicator" 
+                          style="background-color: ${auditService.getConfidenceColor(entry.confidence || 0)}">
+                      </div>
+                      <span class="confidence-value">${entry.confidence || 0}%</span>
+                      <span class="processing-time">${entry.processingTimeMs || 0}ms</span>
+                    </div>
+                  </div>
+                  
+                  ${(entry.inputSummary && entry.inputSummary !== 'null') || (entry.outputSummary && entry.outputSummary !== 'null') ? `
+                    <div class="entry-details">
+                      ${entry.inputSummary && entry.inputSummary !== 'null' ? `
+                        <div class="detail-item"><strong>Input:</strong> ${this.escapeHtml(entry.inputSummary)}</div>
+                      ` : ''}
+                      ${entry.outputSummary && entry.outputSummary !== 'null' ? `
+                        <div class="detail-item"><strong>Output:</strong> ${this.escapeHtml(entry.outputSummary)}</div>
+                      ` : ''}
+                    </div>
+                  ` : ''}
+                </div>
+              `).join('')}
+            </div>
+          </div>
+        `).join('')}
+      </div>
+    `;
+  }
+
+  /**
+   * Render technical details section
+   */
+  renderTechnicalDetails(audit) {
+    const technicalId = `${this.componentId}-technical`;
+    
+    return `
+      <div class="technical-toggle">
+        <button class="technical-toggle-btn" data-target="${technicalId}">
+          🔧 Technische Details anzeigen
+        </button>
+        <div id="${technicalId}" class="technical-details collapsed">
+          ${(audit.phases || []).map(phase => 
+            (phase.entries || []).map(entry => `
+              <div class="technical-entry">
+                <div class="technical-header">
+                  <span class="technical-phase">${entry.phase}/${entry.action}</span>
+                  <span class="technical-time">
+                    ${new Date(entry.timestamp).toLocaleTimeString('de-DE', { 
+                      hour: '2-digit', 
+                      minute: '2-digit', 
+                      second: '2-digit' 
+                    })} • ${entry.processingTimeMs || 0}ms
+                  </span>
+                </div>
+                <div class="technical-content">
+                  <div class="technical-row">
+                    <strong>Confidence:</strong> ${entry.confidence || 0}%
+                  </div>
+                  ${entry.metadata && Object.keys(entry.metadata).length > 0 ? `
+                    <div class="technical-row">
+                      <strong>Metadata:</strong> ${this.escapeHtml(JSON.stringify(entry.metadata))}
+                    </div>
+                  ` : ''}
+                </div>
+              </div>
+            `).join('')
+          ).join('')}
+        </div>
+      </div>
+    `;
+  }
+
+  /**
+   * Attach event handlers for interactions
+   */
+  attachEventHandlers() {
+    console.log('[AUDIT RENDERER] Attaching event handlers...');
+    
+    // Handle collapsible header
+    if (this.options.collapsible) {
+      const header = document.querySelector(`[data-target="${this.componentId}-details"]`);
+      const details = document.getElementById(`${this.componentId}-details`);
+      const toggleIcon = header?.querySelector('.toggle-icon svg');
+      
+      if (header && details && toggleIcon) {
+        // Remove existing listeners
+        header.replaceWith(header.cloneNode(true));
+        const newHeader = document.querySelector(`[data-target="${this.componentId}-details"]`);
+        const newToggleIcon = newHeader?.querySelector('.toggle-icon svg');
+        
+        if (newHeader && newToggleIcon) {
+          newHeader.addEventListener('click', () => {
+            const isCollapsed = details.classList.contains('collapsed');
+            
+            if (isCollapsed) {
+              details.classList.remove('collapsed');
+              newToggleIcon.style.transform = 'rotate(180deg)';
+            } else {
+              details.classList.add('collapsed');
+              newToggleIcon.style.transform = 'rotate(0deg)';
+            }
+          });
+          console.log('[AUDIT RENDERER] Collapsible header handler attached');
+        }
+      }
+    }
+    
+    // Handle technical details toggle
+    const technicalBtn = document.querySelector(`[data-target="${this.componentId}-technical"]`);
+    const technicalDetails = document.getElementById(`${this.componentId}-technical`);
+    
+    if (technicalBtn && technicalDetails) {
+      // Remove existing listener
+      technicalBtn.replaceWith(technicalBtn.cloneNode(true));
+      const newTechnicalBtn = document.querySelector(`[data-target="${this.componentId}-technical"]`);
+      
+      if (newTechnicalBtn) {
+        newTechnicalBtn.addEventListener('click', () => {
+          const isCollapsed = technicalDetails.classList.contains('collapsed');
+          
+          if (isCollapsed) {
+            technicalDetails.classList.remove('collapsed');
+            newTechnicalBtn.textContent = '🔧 Technische Details ausblenden';
+          } else {
+            technicalDetails.classList.add('collapsed');
+            newTechnicalBtn.textContent = '🔧 Technische Details anzeigen';
+          }
+        });
+        console.log('[AUDIT RENDERER] Technical details handler attached');
+      }
+    }
+  }
+
+  /**
+   * Render empty state
+   */
+  renderEmpty() {
+    const container = document.getElementById(this.containerId);
+    if (container) {
+      container.innerHTML = `
+        <div class="audit-trail-container">
+          <div class="audit-trail-header">
+            <div class="audit-icon">
+              <div class="audit-icon-gradient">ⓘ</div>
+              <h4>Kein Audit-Trail verfügbar</h4>
+            </div>
+          </div>
+        </div>
+      `;
+    }
+  }
+
+  /**
+   * Render error state
+   */
+  renderError(error) {
+    const container = document.getElementById(this.containerId);
+    if (container) {
+      container.innerHTML = `
+        <div class="audit-trail-container">
+          <div class="audit-trail-header">
+            <div class="audit-icon">
+              <div class="audit-icon-gradient" style="background: var(--color-error);">✗</div>
+              <h4>Audit-Trail Fehler</h4>
+            </div>
+          </div>
+          <div class="audit-summary">
+            <p style="color: var(--color-error);">
+              Fehler beim Laden der Audit-Informationen: ${this.escapeHtml(error.message)}
+            </p>
+          </div>
+        </div>
+      `;
+    }
+  }
+
+  /**
+   * Utility method to escape HTML
+   */
+  escapeHtml(text) {
+    if (typeof text !== 'string') return String(text);
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+  }
+
+  /**
+   * Clear the audit trail display
+   */
+  clear() {
+    const container = document.getElementById(this.containerId);
+    if (container) {
+      container.innerHTML = '';
+    }
+  }
+
+  /**
+   * Get container element
+   */
+  getContainer() {
+    return document.getElementById(this.containerId);
+  }
+}

src/components/AIQueryInterface.astro

@@ -1,6 +1,9 @@
 ---
+// src/components/AIQueryInterface.astro
+
 import { getToolsData } from '../utils/dataService.js';
 import { isToolHosted } from '../utils/toolHelpers.js';
+import { AuditTrailRenderer } from '../js/auditTrailRenderer.js';
 
 const data = await getToolsData();
 const tools = data.tools;
@@ -207,16 +210,22 @@ const domainAgnosticSoftware = data['domain-agnostic-software'] || [];
     </div>
 
     <!-- Results -->
-    <div id="ai-results" class="ai-results hidden"></div>
+    <div id="ai-results" class="ai-results hidden">     
+      <!-- Audit trail container - managed by AuditTrailRenderer -->
+      <div id="audit-trail-container"></div>
+    </div>
   </div>
 </section>
 
-<script define:vars={{ tools, phases, domainAgnosticSoftware }}>
+<script type="module" define:vars={{ tools, phases, domainAgnosticSoftware }}>
+  import { AuditTrailRenderer } from '../js/auditTrailRenderer.js';
+
 
 class AIQueryInterface {
   constructor() {
     this.currentMode = 'workflow';
     this.currentRecommendation = null;
+    this.auditTrailRenderer = null;
     this.enhancementTimeout = null;
     this.enhancementAbortController = null;
     this.statusInterval = null;
@@ -519,7 +528,7 @@ class AIQueryInterface {
       }
 
       this.currentRecommendation = data.recommendation;
-      this.displayResults(data.recommendation, query);
+      await this.displayResults(data.recommendation, query);
       
     } catch (error) {
       console.error('[AI Interface] Request failed:', error);
@@ -671,26 +680,31 @@ class AIQueryInterface {
     }, 2000);
   }
 
-  displayResults(recommendation, originalQuery) {
+  async displayResults(recommendation, originalQuery) {
     console.log('[AI DEBUG] Full recommendation object:', recommendation);
-    console.log('[AI DEBUG] Recommended tools:', recommendation.recommended_tools);
+    console.log('[AI DEBUG] Audit trail data:', recommendation.auditTrail);
-    
-    if (recommendation.recommended_tools) {
-      recommendation.recommended_tools.forEach((tool, index) => {
-        console.log(`[AI DEBUG] Tool ${index}:`, tool.name, 'Confidence:', tool.confidence);
-      });
-    }
     
     if (this.currentMode === 'workflow') {
-      this.displayWorkflowResults(recommendation, originalQuery);
+      await this.displayWorkflowResults(recommendation, originalQuery);
     } else {
-      this.displayToolResults(recommendation, originalQuery);
+      await this.displayToolResults(recommendation, originalQuery);
     }
     
+    // Show results first, then render audit trail
     this.showResults();
+    
+    // Render audit trail after DOM is ready
+    setTimeout(async () => {
+      try {
+        await this.renderAuditTrail(recommendation.auditTrail);
+        console.log('[AI DEBUG] Audit trail rendered successfully');
+      } catch (error) {
+        console.error('[AI DEBUG] Failed to render audit trail:', error);
+      }
+    }, 100);
   }
 
-  displayWorkflowResults(recommendation, originalQuery) {
+  async displayWorkflowResults(recommendation, originalQuery) {
     const toolsByPhase = {};
     const phaseOrder = phases.map(phase => phase.id);
     const phaseNames = phases.reduce((acc, phase) => {
@@ -730,14 +744,16 @@ class AIQueryInterface {
         ${this.renderBackgroundKnowledge(recommendation.background_knowledge)}
         ${this.renderWorkflowPhases(toolsByPhase, phaseOrder, phaseNames)}
         ${this.renderWorkflowSuggestion(recommendation.workflow_suggestion)}
-        ${this.renderAuditTrail(recommendation.auditTrail)}
       </div>
+        
+      <div id="audit-trail-container"></div>
     `;
     
     this.elements.results.innerHTML = html;
+    await this.renderAuditTrail(recommendation.auditTrail);
   }
 
-  displayToolResults(recommendation, originalQuery) {
+  async displayToolResults(recommendation, originalQuery) {
     const html = `
       <div class="workflow-container">
         ${this.renderHeader('Handlungsempfehlung', originalQuery)}
@@ -745,11 +761,12 @@ class AIQueryInterface {
         ${this.renderBackgroundKnowledge(recommendation.background_knowledge)}
         ${this.renderToolRecommendations(recommendation.recommended_tools)}
         ${this.renderAdditionalConsiderations(recommendation.additional_considerations)}
-        ${this.renderAuditTrail(recommendation.auditTrail)}
       </div>
+      <div id="audit-trail-container"></div>
     `;
     
     this.elements.results.innerHTML = html;
+    await this.renderAuditTrail(recommendation.auditTrail);
   }
 
   renderConfidenceTooltip(confidence) {
@@ -829,209 +846,68 @@ class AIQueryInterface {
     `;
   }
 
-  renderAuditTrail(auditTrail) {
+  async renderAuditTrail(rawAuditTrail) {
-    if (!auditTrail || !Array.isArray(auditTrail) || auditTrail.length === 0) {
+    console.log('[AI Interface] Starting audit trail render...', rawAuditTrail?.length || 0, 'entries');
-      return '';
+    
+    const container = document.getElementById('audit-trail-container');
+    if (!container) {
+      console.error('[AI Interface] Audit container not found');
+      return;
     }
-    
-    const totalTime = auditTrail.reduce((sum, entry) => sum + entry.processingTimeMs, 0);
-    const avgConfidence = auditTrail.reduce((sum, entry) => sum + entry.confidence, 0) / auditTrail.length;
-    const lowConfidenceSteps = auditTrail.filter(entry => entry.confidence < 60).length;
-    const highConfidenceSteps = auditTrail.filter(entry => entry.confidence >= 80).length;
-    
-    const groupedEntries = auditTrail.reduce((groups, entry) => {
-      if (!groups[entry.phase]) groups[entry.phase] = [];
-      groups[entry.phase].push(entry);
-      return groups;
-    }, {});
-    
-    return `
-      <div class="card-info-sm mt-4" style="border-left: 4px solid var(--color-accent);">
-        <div class="flex items-center justify-between mb-3 cursor-pointer" onclick="const container = this.closest('.card-info-sm'); const details = container.querySelector('.audit-trail-details'); const isHidden = details.style.display === 'none'; details.style.display = isHidden ? 'block' : 'none'; this.querySelector('.toggle-icon').style.transform = isHidden ? 'rotate(180deg)' : 'rotate(0deg)';">
-          <div class="flex items-center gap-3">
-            <div class="flex items-center gap-2">
-              <div style="width: 24px; height: 24px; background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-primary) 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 0.75rem; font-weight: bold;">
-                ✓
-              </div>
-              <h4 class="text-sm font-semibold text-accent mb-0">KI-Entscheidungspfad</h4>
-            </div>
-            
-            <div class="flex gap-3 text-xs">
-              <div class="flex items-center gap-1">
-                <div class="w-2 h-2 rounded-full" style="background-color: var(--color-accent);"></div>
-                <span class="text-muted">${this.formatDuration(totalTime)}</span>
-              </div>
-              <div class="flex items-center gap-1">
-                <div class="w-2 h-2 rounded-full" style="background-color: ${avgConfidence >= 80 ? 'var(--color-accent)' : avgConfidence >= 60 ? 'var(--color-warning)' : 'var(--color-error)'};"></div>
-                <span class="text-muted">${Math.round(avgConfidence)}% Vertrauen</span>
-              </div>
-              <div class="flex items-center gap-1">
-                <span class="text-muted">${auditTrail.length} Schritte</span>
-              </div>
-            </div>
-          </div>
-          
-          <div class="toggle-icon" style="transition: transform 0.2s ease;">
-            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <polyline points="6 9 12 15 18 9"/>
-            </svg>
-          </div>
-        </div>
-        
-        <div style="display: none;" class="audit-trail-details">
-          <div class="grid gap-4">
-            <!-- Summary Section -->
-            <div class="p-3 rounded-lg" style="background-color: var(--color-bg-tertiary);">
-              <div class="text-xs font-medium mb-2 text-accent">📊 Analyse-Qualität</div>
-              <div class="grid grid-cols-3 gap-3 text-xs">
-                <div class="text-center">
-                  <div class="font-semibold" style="color: var(--color-accent);">${highConfidenceSteps}</div>
-                  <div class="text-muted">Hohe Sicherheit</div>
-                </div>
-                <div class="text-center">
-                  <div class="font-semibold" style="color: ${lowConfidenceSteps > 0 ? 'var(--color-warning)' : 'var(--color-accent)'};">${lowConfidenceSteps}</div>
-                  <div class="text-muted">Unsichere Schritte</div>
-                </div>
-                <div class="text-center">
-                  <div class="font-semibold">${this.formatDuration(totalTime)}</div>
-                  <div class="text-muted">Verarbeitungszeit</div>
-                </div>
-              </div>
-            </div>
-            
-            <!-- Process Flow -->
-            <div class="audit-process-flow">
-              ${Object.entries(groupedEntries).map(([phase, entries]) => this.renderPhaseGroup(phase, entries)).join('')}
-            </div>
-            
-            <!-- Technical Details Toggle -->
-            <div class="text-center">
-              <button class="text-xs text-muted hover:text-primary transition-colors cursor-pointer border-none bg-none" onclick="const techDetails = this.nextElementSibling; const isHidden = techDetails.style.display === 'none'; techDetails.style.display = isHidden ? 'block' : 'none'; this.textContent = isHidden ? '🔧 Technische Details ausblenden' : '🔧 Technische Details anzeigen';">
-                🔧 Technische Details anzeigen
-              </button>
-              <div style="display: none;" class="mt-3 p-3 rounded-lg bg-gray-50 dark:bg-gray-800 text-xs">
-                ${auditTrail.map(entry => this.renderTechnicalEntry(entry)).join('')}
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
 
-  renderPhaseGroup(phase, entries) {
+    // Clear previous content
-    const phaseIcons = {
+    container.innerHTML = '';
-      'initialization': '🚀',
+
-      'retrieval': '🔍',
+    // Check if we have audit data
-      'selection': '🎯',
+    if (!rawAuditTrail || !Array.isArray(rawAuditTrail) || rawAuditTrail.length === 0) {
-      'micro-task': '⚡',
+      console.log('[AI Interface] No audit trail data to render');
-      'completion': '✅'
+      container.innerHTML = `
-    };
+        <div class="audit-trail-container">
-    
+          <div class="audit-trail-header">
-    const phaseNames = {
+            <div class="audit-icon">
-      'initialization': 'Initialisierung',
+              <div class="audit-icon-gradient">ⓘ</div>
-      'retrieval': 'Datensuche',
+              <h4>Kein Audit-Trail verfügbar</h4>
-      'selection': 'Tool-Auswahl',
-      'micro-task': 'Detail-Analyse',
-      'completion': 'Finalisierung'
-    };
-    
-    const avgConfidence = entries.reduce((sum, entry) => sum + entry.confidence, 0) / entries.length;
-    const totalTime = entries.reduce((sum, entry) => sum + entry.processingTimeMs, 0);
-    
-    return `
-      <div class="phase-group mb-4">
-        <div class="flex items-center gap-3 mb-3">
-          <div class="flex items-center gap-2">
-            <span class="text-lg">${phaseIcons[phase] || '📋'}</span>
-            <span class="font-medium text-sm">${phaseNames[phase] || phase}</span>
-          </div>
-          <div class="flex-1 h-px bg-border"></div>
-          <div class="flex items-center gap-2 text-xs text-muted">
-            <div class="confidence-indicator w-12 h-2 rounded-full overflow-hidden" style="background-color: var(--color-bg-tertiary);">
-              <div class="h-full rounded-full transition-all" style="width: ${avgConfidence}%; background-color: ${avgConfidence >= 80 ? 'var(--color-accent)' : avgConfidence >= 60 ? 'var(--color-warning)' : 'var(--color-error)'};"></div>
             </div>
-            <span>${Math.round(avgConfidence)}%</span>
           </div>
         </div>
-        
+      `;
-        <div class="grid gap-2 ml-6">
+      return;
-          ${entries.map(entry => this.renderSimplifiedEntry(entry)).join('')}
+    }
-        </div>
-      </div>
-    `;
-  }
 
-  renderSimplifiedEntry(entry) {
+    try {
-    const actionIcons = {
+      // Import and create renderer
-      'pipeline-start': '▶️',
+      //const { AuditTrailRenderer } = await import('../js/auditTrailRenderer.js');
-      'embeddings-search': '🔍',
+      
-      'ai-tool-selection': '🎯',
+      const renderer = new AuditTrailRenderer('audit-trail-container', {
-      'ai-analysis': '🧠',
+        title: 'KI-Entscheidungspfad',
-      'phase-tool-selection': '⚙️',
+        collapsible: true,
-      'tool-evaluation': '📊',
+        defaultExpanded: false
-      'background-knowledge-selection': '📚',
+      });
-      'pipeline-end': '🏁'
+      
-    };
+      // Render synchronously (the method handles async internally)
-    
+      renderer.render(rawAuditTrail);
-    const actionNames = {
+      
-      'pipeline-start': 'Analyse gestartet',
+      console.log('[AI Interface] Audit trail render completed');
-      'embeddings-search': 'Ähnliche Tools gesucht',
+      
-      'ai-tool-selection': 'Tools automatisch ausgewählt',
+    } catch (error) {
-      'ai-analysis': 'KI-Analyse durchgeführt',
+      console.error('[AI Interface] Failed to render audit trail:', error);
-      'phase-tool-selection': 'Phasen-Tools evaluiert',
+      
-      'tool-evaluation': 'Tool-Bewertung erstellt',
+      container.innerHTML = `
-      'background-knowledge-selection': 'Hintergrundwissen ausgewählt',
+        <div class="audit-trail-container">
-      'pipeline-end': 'Analyse abgeschlossen'
+          <div class="audit-trail-header">
-    };
+            <div class="audit-icon">
-    
+              <div class="audit-icon-gradient" style="background: var(--color-error);">✗</div>
-    const confidenceColor = entry.confidence >= 80 ? 'var(--color-accent)' : 
+              <h4>Audit-Trail Fehler</h4>
-                            entry.confidence >= 60 ? 'var(--color-warning)' : 'var(--color-error)';
+            </div>
-    
-    return `
-      <div class="flex items-center gap-3 py-2 px-3 rounded-lg hover:bg-secondary transition-colors">
-        <span class="text-sm">${actionIcons[entry.action] || '📋'}</span>
-        <div class="flex-1 min-w-0">
-          <div class="text-sm font-medium">${actionNames[entry.action] || entry.action}</div>
-          ${entry.output && typeof entry.output === 'object' && entry.output.selectedToolCount ? 
-            `<div class="text-xs text-muted">${entry.output.selectedToolCount} Tools ausgewählt</div>` : ''}
-        </div>
-        <div class="flex items-center gap-2 text-xs">
-          <div class="w-8 h-1.5 rounded-full overflow-hidden" style="background-color: var(--color-bg-tertiary);">
-            <div class="h-full rounded-full" style="width: ${entry.confidence}%; background-color: ${confidenceColor};"></div>
           </div>
-          <span class="text-muted w-8 text-right">${entry.confidence}%</span>
+          <div class="audit-summary">
-          <span class="text-muted w-12 text-right">${entry.processingTimeMs}ms</span>
+            <p style="color: var(--color-error);">
-        </div>
+              Fehler beim Laden der Audit-Informationen: ${error.message}
-      </div>
+            </p>
-    `;
-  }
-
-  renderTechnicalEntry(entry) {
-    const formattedTime = new Date(entry.timestamp).toLocaleTimeString('de-DE', { 
-      hour: '2-digit', 
-      minute: '2-digit', 
-      second: '2-digit' 
-    });
-    
-    return `
-      <div class="border rounded p-2 mb-2" style="border-color: var(--color-border);">
-        <div class="flex justify-between items-center mb-1">
-          <span class="font-mono text-xs">${entry.phase}/${entry.action}</span>
-          <span class="text-xs text-muted">${formattedTime} • ${entry.processingTimeMs}ms</span>
-        </div>
-        ${entry.input && Object.keys(entry.input).length > 0 ? `
-          <div class="text-xs mb-1">
-            <strong>Input:</strong> ${this.formatAuditData(entry.input)}
           </div>
-        ` : ''}
+        </div>
-        ${entry.output && Object.keys(entry.output).length > 0 ? `
+      `;
-          <div class="text-xs">
+    }
-            <strong>Output:</strong> ${this.formatAuditData(entry.output)}
-          </div>
-        ` : ''}
-      </div>
-    `;
   }
 
   renderAuditEntry(entry) {
@@ -1069,29 +945,6 @@ class AIQueryInterface {
     `;
   }
 
-  formatAuditData(data) {
-    if (data === null || data === undefined) return 'null';
-    if (typeof data === 'string') {
-      return data.length > 100 ? data.slice(0, 100) + '...' : data;
-    }
-    if (typeof data === 'number') return data.toString();
-    if (typeof data === 'boolean') return data.toString();
-    if (Array.isArray(data)) {
-      if (data.length === 0) return '[]';
-      if (data.length <= 3) return JSON.stringify(data);
-      return `[${data.slice(0, 3).map(i => typeof i === 'string' ? i : JSON.stringify(i)).join(', ')}, ...+${data.length - 3}]`;
-    }
-    if (typeof data === 'object') {
-      const keys = Object.keys(data);
-      if (keys.length === 0) return '{}';
-      if (keys.length <= 3) {
-        return '{' + keys.map(k => `${k}: ${typeof data[k] === 'string' ? data[k].slice(0, 20) + (data[k].length > 20 ? '...' : '') : JSON.stringify(data[k])}`).join(', ') + '}';
-      }
-      return `{${keys.slice(0, 3).join(', ')}, ...+${keys.length - 3} keys}`;
-    }
-    return String(data);
-  }
-
   renderWorkflowTool(tool) {
     const hasValidProjectUrl = isToolHosted(tool);
     const priorityColors = {
@@ -1522,6 +1375,23 @@ class AIQueryInterface {
     return baseText;
   }
 
+  restoreAIResults() {
+    if (this.currentRecommendation && this.elements.results) {
+      this.showResults();
+      
+      // Re-render audit trail if it exists
+      if (this.currentRecommendation.auditTrail) {
+        setTimeout(() => {
+          this.renderAuditTrail(this.currentRecommendation.auditTrail);
+          console.log('[AI Interface] Audit trail restored successfully');
+        }, 100);
+      }
+      
+      this.hideLoading();
+      this.hideError();
+    }
+  }
+
   escapeHtml(text) {
     if (typeof text !== 'string') return '';
     const div = document.createElement('div');
@@ -1584,13 +1454,28 @@ class AIQueryInterface {
 document.addEventListener('DOMContentLoaded', () => {
   const aiInterface = new AIQueryInterface();
   
+  // FIXED: Global restoreAIResults function with proper error handling
   window.restoreAIResults = () => {
     if (aiInterface.currentRecommendation && aiInterface.elements.results) {
       aiInterface.showResults();
+      
+      // Re-render audit trail if it exists
+      if (aiInterface.currentRecommendation.auditTrail) {
+        setTimeout(() => {
+          try {
+            aiInterface.renderAuditTrail(aiInterface.currentRecommendation.auditTrail);
+            console.log('[AI Interface] Global audit trail restored');
+          } catch (error) {
+            console.error('[AI Interface] Global audit trail restore failed:', error);
+          }
+        }, 100);
+      }
+      
       aiInterface.hideLoading();
       aiInterface.hideError();
     }
   };
-  window.isToolHosted = window.isToolHosted || isToolHosted
+  
+  window.isToolHosted = window.isToolHosted || isToolHosted;
 });
 </script>

src/components/ToolFilters.astro

@@ -25,33 +25,55 @@ const sortedTags = Object.entries(tagFrequency)
 
 <div class="filters-container">
   <!-- Search Section -->
-  <div class="filter-section">
+    <div class="filter-section">
-    <div class="filter-card-compact">
+      <div class="filter-card-compact">
-      <div class="filter-header-compact">
+        <div class="filter-header-compact">
-        <h3>🔍 Suche</h3>
+          <h3>🔍 Suche</h3>
-      </div>
+        </div>
-      <div class="search-wrapper">
+        <div class="search-row">
-        <div class="search-icon">
+          <div class="search-wrapper">
-          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <div class="search-icon">
-            <circle cx="11" cy="11" r="8"/>
+              <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-            <line x1="21" y1="21" x2="16.65" y2="16.65"/>
+                <circle cx="11" cy="11" r="8"/>
-          </svg>
+                <line x1="21" y1="21" x2="16.65" y2="16.65"/>
+              </svg>
+            </div>
+            <input 
+              type="text" 
+              id="search-input" 
+              placeholder="Software, Beschreibung oder Tags durchsuchen..."
+              class="search-input"
+            />
+            <button id="clear-search" class="search-clear hidden" title="Suche löschen">
+              <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <line x1="18" y1="6" x2="6" y2="18"/>
+                <line x1="6" y1="6" x2="18" y2="18"/>
+              </svg>
+            </button>
+          </div>
+          
+          <!-- Semantic Search Toggle - Inline -->
+          <div id="semantic-search-container" class="semantic-search-inline hidden">
+            <label class="semantic-toggle-wrapper" title="Semantische Suche verwendet Embeddings. Dadurch kann mit natürlicher Sprache/Begriffen gesucht werden, die Ergebnisse richten sich nach der euklidischen Distanz.">
+              <input type="checkbox" id="semantic-search-enabled" disabled/>
+              <div class="semantic-checkbox-custom"></div>
+              <span class="semantic-toggle-label">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                  <path d="M9 11H5a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7a2 2 0 0 0-2-2h-4"/>
+                  <path d="M9 11V7a3 3 0 0 1 6 0v4"/>
+                </svg>
+                Semantisch
+              </span>
+            </label>
+          </div>
+        </div>
+        
+        <!-- Status Display -->
+        <div id="semantic-status" class="semantic-status hidden">
+          <span class="semantic-results-count"></span>
         </div>
-        <input 
-          type="text" 
-          id="search-input" 
-          placeholder="Software, Beschreibung oder Tags durchsuchen..."
-          class="search-input"
-        />
-        <button id="clear-search" class="search-clear hidden" title="Suche löschen">
-          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-            <line x1="18" y1="6" x2="6" y2="18"/>
-            <line x1="6" y1="6" x2="18" y2="18"/>
-          </svg>
-        </button>
       </div>
     </div>
-  </div>
 
   <!-- Primary Filters Section - ONLY Domain and Phase -->
   <div class="filter-section">
@@ -289,6 +311,10 @@ const sortedTags = Object.entries(tagFrequency)
     const elements = {
       searchInput: document.getElementById('search-input'),
       clearSearch: document.getElementById('clear-search'),
+      semanticContainer: document.getElementById('semantic-search-container'),
+      semanticCheckbox: document.getElementById('semantic-search-enabled'),
+      semanticStatus: document.getElementById('semantic-status'),
+      semanticResultsCount: document.querySelector('.semantic-results-count'),
       domainSelect: document.getElementById('domain-select'),
       phaseSelect: document.getElementById('phase-select'),
       typeSelect: document.getElementById('type-select'),
@@ -324,6 +350,51 @@ const sortedTags = Object.entries(tagFrequency)
     let selectedTags = new Set();
     let selectedPhase = '';
     let isTagCloudExpanded = false;
+    let semanticSearchEnabled = false;
+    let semanticSearchAvailable = false;
+    let lastSemanticResults = null;
+    
+// Check embeddings availability
+    async function checkEmbeddingsAvailability() {
+      try {
+        const res = await fetch('/api/ai/embeddings-status');
+        const { embeddings } = await res.json();
+        semanticSearchAvailable = embeddings?.enabled && embeddings?.initialized;
+
+        if (semanticSearchAvailable) {
+          elements.semanticContainer.classList.remove('hidden');
+          elements.semanticCheckbox.disabled = false;   // 👈 re-enable
+        }
+      } catch (err) {
+        console.error('[EMBEDDINGS] Status check failed:', err);
+        // leave the checkbox disabled
+      }
+    }
+    
+    // Semantic search function
+    async function performSemanticSearch(query) {
+      if (!semanticSearchAvailable || !query.trim()) {
+        return null;
+      }
+      
+      try {
+        const response = await fetch('/api/search/semantic', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ query: query.trim() })
+        });
+        
+        if (!response.ok) {
+          throw new Error(`HTTP ${response.status}`);
+        }
+        
+        const data = await response.json();
+        return data.results || [];
+      } catch (error) {
+        console.error('[SEMANTIC] Search failed:', error);
+        return null;
+      }
+    }
     
     function toggleCollapsible(toggleBtn, content, storageKey) {
       const isCollapsed = toggleBtn.getAttribute('data-collapsed') === 'true';
@@ -494,7 +565,19 @@ const sortedTags = Object.entries(tagFrequency)
         : `${count} von ${total} Tools`;
     }
     
-    function filterTools() {
+    function updateSemanticStatus(results) {
+      if (!elements.semanticStatus || !elements.semanticResultsCount) return;
+      
+      if (semanticSearchEnabled && results?.length > 0) {
+        elements.semanticStatus.classList.remove('hidden');
+        elements.semanticResultsCount.textContent = `${results.length} semantische Treffer`;
+      } else {
+        elements.semanticStatus.classList.add('hidden');
+      }
+    }
+    
+    // FIXED: Consolidated filtering logic with semantic search support
+    async function filterTools() {
       const searchTerm = elements.searchInput.value.trim().toLowerCase();
       const selectedDomain = elements.domainSelect.value;
       const selectedPhaseFromSelect = elements.phaseSelect.value;
@@ -508,15 +591,32 @@ const sortedTags = Object.entries(tagFrequency)
       
       const activePhase = selectedPhaseFromSelect || selectedPhase;
       
-      const filtered = window.toolsData.filter(tool => {
+      let filteredTools = window.toolsData;
-        if (searchTerm && !(
+      let semanticResults = null;
-          tool.name.toLowerCase().includes(searchTerm) ||
+      
-          tool.description.toLowerCase().includes(searchTerm) ||
+      // CONSOLIDATED: Use semantic search if enabled and search term exists
-          (tool.tags || []).some(tag => tag.toLowerCase().includes(searchTerm))
+      if (semanticSearchEnabled && semanticSearchAvailable && searchTerm) {
-        )) {
+        semanticResults = await performSemanticSearch(searchTerm);
-          return false;
+        lastSemanticResults = semanticResults;
-        }
         
+        if (semanticResults?.length > 0) {
+          filteredTools = [...semanticResults];
+        }
+      } else {
+        lastSemanticResults = null;
+        
+        // Traditional text-based search
+        if (searchTerm) {
+          filteredTools = window.toolsData.filter(tool =>
+            tool.name.toLowerCase().includes(searchTerm) ||
+            tool.description.toLowerCase().includes(searchTerm) ||
+            (tool.tags || []).some(tag => tag.toLowerCase().includes(searchTerm))
+          );
+        }
+      }
+      
+      // Apply additional filters to the results
+      filteredTools = filteredTools.filter(tool => {
         if (selectedDomain && !(tool.domains || []).includes(selectedDomain)) {
           return false;
         }
@@ -560,13 +660,30 @@ const sortedTags = Object.entries(tagFrequency)
         return true;
       });
       
-      const finalResults = searchTerm && window.prioritizeSearchResults 
+      if (semanticSearchEnabled && lastSemanticResults) {
-        ? window.prioritizeSearchResults(filtered, searchTerm)
+        filteredTools.sort(
-        : filtered;
+          (a, b) => (b._semanticSimilarity || 0) - (a._semanticSimilarity || 0)
+        );
+      }
+
+      /* existing code continues */
+      const finalResults = semanticSearchEnabled && lastSemanticResults
+        ? filteredTools               // now properly re-sorted
+        : (searchTerm && window.prioritizeSearchResults
+            ? window.prioritizeSearchResults(filteredTools, searchTerm)
+            : filteredTools);
       
       updateResultsCounter(finalResults.length);
+      updateSemanticStatus(lastSemanticResults);
       
-      window.dispatchEvent(new CustomEvent('toolsFiltered', { detail: finalResults }));
+      window.dispatchEvent(
+        new CustomEvent('toolsFiltered', {
+          detail: {
+            tools: finalResults,
+            semanticSearch: semanticSearchEnabled && !!lastSemanticResults,
+          },
+        })
+      );
     }
     
     function resetPrimaryFilters() {
@@ -599,12 +716,17 @@ const sortedTags = Object.entries(tagFrequency)
     function resetAllFilters() {
       elements.searchInput.value = '';
       elements.clearSearch.classList.add('hidden');
+      elements.semanticCheckbox.checked = false;
+      semanticSearchEnabled = false;
+      lastSemanticResults = null;
+      updateSemanticStatus(null);
       resetPrimaryFilters();
       resetAdvancedFilters();
       resetTags();
       filterTagCloud();
     }
     
+    // Event listeners
     elements.searchInput.addEventListener('input', (e) => {
       const hasValue = e.target.value.length > 0;
       elements.clearSearch.classList.toggle('hidden', !hasValue);
@@ -619,16 +741,30 @@ const sortedTags = Object.entries(tagFrequency)
       filterTools();
     });
     
+    // Semantic search checkbox handler
+    if (elements.semanticCheckbox) {
+      elements.semanticCheckbox.addEventListener('change', (e) => {
+        semanticSearchEnabled = e.target.checked;
+        filterTools();
+      });
+    }
+    
     [elements.domainSelect, elements.phaseSelect, elements.typeSelect, elements.skillSelect, 
      elements.platformSelect, elements.licenseSelect, elements.accessSelect].forEach(select => {
-      select.addEventListener('change', filterTools);
+      if (select) {
+        select.addEventListener('change', filterTools);
+      }
     });
     
     [elements.hostedOnly, elements.knowledgebaseOnly].forEach(checkbox => {
-      checkbox.addEventListener('change', filterTools);
+      if (checkbox) {
+        checkbox.addEventListener('change', filterTools);
+      }
     });
     
-    elements.tagCloudToggle.addEventListener('click', toggleTagCloud);
+    if (elements.tagCloudToggle) {
+      elements.tagCloudToggle.addEventListener('click', toggleTagCloud);
+    }
     
     elements.tagCloudItems.forEach(item => {
       item.addEventListener('click', () => {
@@ -676,6 +812,8 @@ const sortedTags = Object.entries(tagFrequency)
     window.clearTagFilters = resetTags;
     window.clearAllFilters = resetAllFilters;
     
+    // Initialize
+    checkEmbeddingsAvailability();
     initializeCollapsible();
     initTagCloud();
     filterTagCloud();

src/layouts/BaseLayout.astro

@@ -2,6 +2,7 @@
 import Navigation from '../components/Navigation.astro';
 import Footer from '../components/Footer.astro';
 import '../styles/global.css';
+import '../styles/auditTrail.css';
 
 export interface Props {
   title: string;

src/pages/api/ai/embeddings-status.ts

@@ -0,0 +1,37 @@
+// src/pages/api/ai/embeddings-status.ts
+import type { APIRoute } from 'astro';
+
+export const prerender = false;
+
+export const GET: APIRoute = async () => {
+  try {
+    const { embeddingsService } = await import('../../../utils/embeddings.js');
+    await embeddingsService.waitForInitialization();
+    
+    const stats = embeddingsService.getStats();
+    const status = stats.enabled && stats.initialized ? 'ready' : 
+                  stats.enabled && !stats.initialized ? 'initializing' : 'disabled';
+    
+    return new Response(JSON.stringify({
+      success: true,
+      embeddings: stats,
+      timestamp: new Date().toISOString(),
+      status: status
+    }), {
+      status: 200,
+      headers: { 'Content-Type': 'application/json' }
+    });
+    
+  } catch (error) {
+    return new Response(JSON.stringify({
+      success: false,
+      embeddings: { enabled: false, initialized: false, count: 0 },
+      timestamp: new Date().toISOString(),
+      status: 'disabled',
+      error: error.message
+    }), {
+      status: 200,
+      headers: { 'Content-Type': 'application/json' }
+    });
+  }
+};

src/pages/api/ai/embeddings.status.ts

@@ -1,22 +0,0 @@
-// src/pages/api/ai/embeddings-status.ts
-import type { APIRoute } from 'astro';
-import { embeddingsService } from '../../../utils/embeddings.js';
-import { apiResponse, apiServerError } from '../../../utils/api.js';
-
-export const prerender = false;
-
-export const GET: APIRoute = async () => {
-  try {
-    const stats = embeddingsService.getStats();
-    
-    return apiResponse.success({
-      embeddings: stats,
-      timestamp: new Date().toISOString(),
-      status: stats.enabled && stats.initialized ? 'ready' : 
-             stats.enabled && !stats.initialized ? 'initializing' : 'disabled'
-    });
-  } catch (error) {
-    console.error('Embeddings status error:', error);
-    return apiServerError.internal('Failed to get embeddings status');
-  }
-};

src/pages/api/search/semantic.ts

@@ -0,0 +1,84 @@
+// src/pages/api/search/semantic.ts
+import type { APIRoute } from 'astro';
+import { getToolsData } from '../../../utils/dataService.js';
+import { configDotenv } from 'dotenv';
+
+configDotenv();    
+
+const DEFAULT_MAX_RESULTS = (() => {
+  const raw = process.env.AI_EMBEDDING_CANDIDATES;
+  const n   = Number.parseInt(raw ?? '', 10);
+  return Number.isFinite(n) && n > 0 ? n : 50;          // fallback
+})();
+
+const DEFAULT_THRESHOLD = (() => {
+  const raw = process.env.AI_SIMILARITY_THRESHOLD;
+  const n   = Number.parseFloat(raw ?? '');
+  return Number.isFinite(n) && n >= 0 && n <= 1 ? n : 0.45;
+})();
+
+export const prerender = false;
+
+
+export const POST: APIRoute = async ({ request }) => {
+  try {
+    /* ---------- get body & apply defaults from env ---------------- */
+    const {
+      query,
+      maxResults = DEFAULT_MAX_RESULTS,
+      threshold  = DEFAULT_THRESHOLD
+    } = await request.json();
+
+    if (!query || typeof query !== 'string') {
+      return new Response(
+        JSON.stringify({ success: false, error: 'Query is required' }),
+        { status: 400, headers: { 'Content-Type': 'application/json' } }
+      );
+    }
+
+    /* --- (rest of the handler unchanged) -------------------------- */
+    const { embeddingsService } = await import('../../../utils/embeddings.js');
+
+    if (!embeddingsService.isEnabled()) {
+      return new Response(
+        JSON.stringify({ success: false, error: 'Semantic search not available' }),
+        { status: 400, headers: { 'Content-Type': 'application/json' } }
+      );
+    }
+
+    await embeddingsService.waitForInitialization();
+
+    const similarItems = await embeddingsService.findSimilar(
+      query.trim(),
+      maxResults,
+      threshold
+    );
+
+    const toolsData  = await getToolsData();
+    const rankedTools = similarItems
+      .map((s, i) => {
+        const tool = toolsData.tools.find(t => t.name === s.name);
+        return tool ? { ...tool, _semanticSimilarity: s.similarity, _semanticRank: i + 1 } : null;
+      })
+      .filter(Boolean);
+
+    return new Response(
+      JSON.stringify({
+        success: true,
+        query: query.trim(),
+        results: rankedTools,
+        totalFound: rankedTools.length,
+        semanticSearch: true,
+        threshold,
+        maxSimilarity: rankedTools[0]?._semanticSimilarity ?? 0
+      }),
+      { status: 200, headers: { 'Content-Type': 'application/json' } }
+    );
+  } catch (error) {
+    console.error('Semantic search error:', error);
+    return new Response(
+      JSON.stringify({ success: false, error: 'Semantic search failed' }),
+      { status: 500, headers: { 'Content-Type': 'application/json' } }
+    );
+  }
+};

src/pages/index.astro

@@ -198,12 +198,15 @@ const phases = data.phases;
 <script define:vars={{ toolsData: data.tools, phases: data.phases }}>
   window.toolsData = toolsData;
   
+  // CONSOLIDATED: Approach selection - Pure navigation aid
   window.selectApproach = function(approach) {
     console.log(`Selected approach: ${approach}`);
     
+    // Clear any existing AI results
     const aiResults = document.getElementById('ai-results');
     if (aiResults) aiResults.style.display = 'none';
     
+    // Update visual selection state
     document.querySelectorAll('.approach-card').forEach(card => {
       card.classList.remove('selected');
     });
@@ -211,14 +214,20 @@ const phases = data.phases;
     const selectedCard = document.querySelector(`.approach-card.${approach}`);
     if (selectedCard) selectedCard.classList.add('selected');
     
+    // Hide all approach sections first (ensures mutual exclusivity)
+    const methodologySection = document.getElementById('methodology-section');
+    const targetedSection = document.getElementById('targeted-section');
+    
+    if (methodologySection) methodologySection.classList.remove('active');
+    if (targetedSection) targetedSection.classList.remove('active');
+    
+    // Show the selected approach section (navigation aid only)
     if (approach === 'methodology') {
-      const methodologySection = document.getElementById('methodology-section');
       if (methodologySection) {
         methodologySection.classList.add('active');
         window.scrollToElementById('methodology-section');
       }
     } else if (approach === 'targeted') {
-      const targetedSection = document.getElementById('targeted-section');
       if (targetedSection) {
         targetedSection.classList.add('active');
         window.scrollToElementById('targeted-section');
@@ -226,9 +235,11 @@ const phases = data.phases;
     }
   };
 
+  // CONSOLIDATED: Phase selection - Sets unified filter dropdown
   window.selectPhase = function(phase) {
     console.log(`Selected NIST phase: ${phase}`);
     
+    // Update visual selection of phase cards
     document.querySelectorAll('.phase-card').forEach(card => {
       card.classList.remove('active');
     });
@@ -238,17 +249,26 @@ const phases = data.phases;
       selectedCard.classList.add('active');
     }
     
-    const existingPhaseButton = document.querySelector(`[data-phase="${phase}"]`);
+    // CONSOLIDATED: Set the unified phase-select dropdown
-    if (existingPhaseButton && !existingPhaseButton.classList.contains('active')) {
+    const phaseSelect = document.getElementById('phase-select');
-      existingPhaseButton.click();
+    if (phaseSelect) {
+      phaseSelect.value = phase;
+      
+      // Trigger the change event to activate unified filtering
+      const changeEvent = new Event('change', { bubbles: true });
+      phaseSelect.dispatchEvent(changeEvent);
     }
     
+    // Switch to grid view to show filtered results
     const gridToggle = document.querySelector('.view-toggle[data-view="grid"]');
     if (gridToggle && !gridToggle.classList.contains('active')) {
       gridToggle.click();
     }
     
-    window.scrollToElementById('tools-grid');
+    // Scroll to filtered results
+    setTimeout(() => {
+      window.scrollToElementById('tools-grid');
+    }, 200);
   };
 
   document.addEventListener('DOMContentLoaded', () => {
@@ -282,61 +302,68 @@ const phases = data.phases;
       });
     }
 
-  function switchToView(view) {
+    function switchToView(view) {
-    const toolsGrid = document.getElementById('tools-grid');
+      const toolsGrid = document.getElementById('tools-grid');
-    const matrixContainer = document.getElementById('matrix-container');
+      const matrixContainer = document.getElementById('matrix-container');
-    const aiInterface = document.getElementById('ai-interface');
+      const aiInterface = document.getElementById('ai-interface');
-    const filtersSection = document.getElementById('filters-section');
+      const filtersSection = document.getElementById('filters-section');
-    const noResults = document.getElementById('no-results');
+      const noResults = document.getElementById('no-results');
-    
+      
-    if (toolsGrid) toolsGrid.style.display = 'none';
+      // FIXED: Hide approach sections when switching to ANY view mode
-    if (matrixContainer) matrixContainer.style.display = 'none';
+      const methodologySection = document.getElementById('methodology-section');
-    if (aiInterface) aiInterface.style.display = 'none';
+      const targetedSection = document.getElementById('targeted-section');
-    if (filtersSection) filtersSection.style.display = 'none';
+      
-    if (noResults) noResults.style.display = 'none';
+      // Hide all main content areas
-    
+      if (toolsGrid) toolsGrid.style.display = 'none';
-    switch (view) {
+      if (matrixContainer) matrixContainer.style.display = 'none';
-      case 'grid':
+      if (aiInterface) aiInterface.style.display = 'none';
-        if (toolsGrid) toolsGrid.style.display = 'block';
+      if (noResults) noResults.style.display = 'none';
-        if (filtersSection) filtersSection.style.display = 'block';
+      
-        break;
+      // FIXED: Hide approach sections when switching to view modes
-      case 'matrix':
+      if (methodologySection) methodologySection.classList.remove('active');
-        if (matrixContainer) matrixContainer.style.display = 'block';
+      if (targetedSection) targetedSection.classList.remove('active');
-        if (filtersSection) filtersSection.style.display = 'block';
+      
-        break;
+      switch (view) {
-      case 'ai':
+        case 'grid':
-        if (aiInterface) aiInterface.style.display = 'block';
+          if (toolsGrid) toolsGrid.style.display = 'block';
-        break;
+          if (filtersSection) filtersSection.style.display = 'block';
-    }
+          break;
-  }
+        case 'matrix':
-
+          if (matrixContainer) matrixContainer.style.display = 'block';
-    function hideFilterControls() {
+          if (filtersSection) filtersSection.style.display = 'block';
-      const filterSections = document.querySelectorAll('.filter-section');
+          break;
-      filterSections.forEach((section, index) => {
+        case 'ai':
-        if (index < filterSections.length - 1) {
+          if (aiInterface) aiInterface.style.display = 'block';
-          section.style.display = 'none';
+          
-        }
+          // FIXED: Show filters but hide everything except view controls
-      });
+          if (filtersSection) {
-    }
+            filtersSection.style.display = 'block';
-
+            
-    function showFilterControls() {
+            // Hide all filter sections except the last one (view controls)
-      const filterSections = document.querySelectorAll('.filter-section');
+            const filterSections = filtersSection.querySelectorAll('.filter-section');
-      const searchInput = document.getElementById('search-input');
+            filterSections.forEach((section, index) => {
-      const tagCloud = document.querySelector('.tag-cloud');
+              if (index === filterSections.length - 1) {
-      const tagControls = document.querySelector('.tag-controls');
+                // Keep view controls visible
-      const checkboxWrappers = document.querySelectorAll('.checkbox-wrapper');
+                section.style.display = 'block';
-      const allInputs = filtersSection.querySelectorAll('input, select, textarea');
+              } else {
-      
+                // Hide other filter sections
-      filterSections.forEach(section => section.style.display = 'block');
+                section.style.display = 'none';
-      
+              }
-      if (searchInput) searchInput.style.display = 'block';
+            });
-      if (tagCloud) tagCloud.style.display = 'flex';
+          }
-      if (tagControls) tagControls.style.display = 'flex';
+          break;
-      
+      }
-      allInputs.forEach(input => input.style.display = 'block');
+      
-      checkboxWrappers.forEach(wrapper => wrapper.style.display = 'flex');
+      // FIXED: Reset filter sections visibility when not in AI view
+      if (view !== 'ai' && filtersSection) {
+        const filterSections = filtersSection.querySelectorAll('.filter-section');
+        filterSections.forEach(section => {
+          section.style.display = 'block';
+        });
+      }
     }
 
+    // Navigation functions for AI recommendations (unchanged)
     window.navigateToGrid = function(toolName) {
       console.log('Navigating to grid for tool:', toolName);
       
@@ -458,21 +485,100 @@ const phases = data.phases;
       }, 100);
     }
 
-    window.addEventListener('toolsFiltered', (event) => {
+  // REPLACE the existing toolsFiltered event listener in index.astro with this enhanced version:
-      const filtered = event.detail;
+
-      const currentView = document.querySelector('.view-toggle.active')?.getAttribute('data-view');
+  window.addEventListener('toolsFiltered', (event) => {
+    const { tools: filtered, semanticSearch } = event.detail;
+    const currentView = document.querySelector('.view-toggle.active')?.getAttribute('data-view');
+    
+    if (currentView === 'matrix' || currentView === 'ai') {
+      return;
+    }
+    
+    const allToolCards = document.querySelectorAll('.tool-card');
+    const filteredNames = new Set(filtered.map(tool => tool.name.toLowerCase()));
+    const toolsContainer = document.getElementById('tools-container');
+    
+    let visibleCount = 0;
+    
+    if (semanticSearch && filtered.length > 0) {
+      console.log('[SEMANTIC] Reordering tools by semantic similarity');
       
-      if (currentView === 'matrix' || currentView === 'ai') {
+      // FIXED: Create ordered array of cards based on semantic similarity
-        return;
+      const orderedCards = [];
-      }
+      const remainingCards = [];
       
-      const allToolCards = document.querySelectorAll('.tool-card');
+      // First pass: collect cards in semantic order
-      const filteredNames = new Set(filtered.map(tool => tool.name.toLowerCase()));
+      filtered.forEach(tool => {
-      
+        const toolName = tool.name.toLowerCase();
-      let visibleCount = 0;
+        const matchingCard = Array.from(allToolCards).find(card => 
+          card.getAttribute('data-tool-name') === toolName
+        );
+        
+        if (matchingCard) {
+          matchingCard.style.display = 'block';
+          orderedCards.push(matchingCard);
+          visibleCount++;
+          
+          // Add semantic indicators if available
+          if (tool._semanticSimilarity) {
+            matchingCard.setAttribute('data-semantic-similarity', tool._semanticSimilarity.toFixed(3));
+            matchingCard.setAttribute('data-semantic-rank', tool._semanticRank || '');
+            
+            // Visual indication of semantic ranking (subtle)
+            const header = matchingCard.querySelector('.tool-card-header h3');
+            if (header && tool._semanticRank <= 3) {
+              const existingIndicator = header.querySelector('.semantic-rank-indicator');
+              if (existingIndicator) {
+                existingIndicator.remove();
+              }
+              
+              const indicator = document.createElement('span');
+              indicator.className = 'semantic-rank-indicator';
+              indicator.style.cssText = `
+                display: inline-block;
+                width: 6px;
+                height: 6px;
+                background-color: var(--color-accent);
+                border-radius: 50%;
+                margin-left: 0.5rem;
+                opacity: ${1 - (tool._semanticRank - 1) * 0.3};
+              `;
+              indicator.title = `Semantische Relevanz: ${tool._semanticSimilarity.toFixed(3)}`;
+              header.appendChild(indicator);
+            }
+          }
+        }
+      });
       
+      // Second pass: hide non-matching cards and collect them
       allToolCards.forEach(card => {
         const toolName = card.getAttribute('data-tool-name');
+        if (!filteredNames.has(toolName)) {
+          card.style.display = 'none';
+          remainingCards.push(card);
+        }
+      });
+      
+      // Reorder DOM: semantic results first, then hidden cards
+      const allCards = [...orderedCards, ...remainingCards];
+      allCards.forEach(card => {
+        toolsContainer.appendChild(card);
+      });
+      
+    } else {
+      // FIXED: Standard filtering without semantic ordering
+      allToolCards.forEach(card => {
+        const toolName = card.getAttribute('data-tool-name');
+        
+        // Clean up any semantic indicators
+        card.removeAttribute('data-semantic-similarity');
+        card.removeAttribute('data-semantic-rank');
+        const semanticIndicator = card.querySelector('.semantic-rank-indicator');
+        if (semanticIndicator) {
+          semanticIndicator.remove();
+        }
+        
         if (filteredNames.has(toolName)) {
           card.style.display = 'block';
           visibleCount++;
@@ -481,12 +587,33 @@ const phases = data.phases;
         }
       });
       
-      if (visibleCount === 0) {
+      // Restore original order when not using semantic search
-        noResults.style.display = 'block';
+      if (!semanticSearch) {
-      } else {
+        const originalOrder = Array.from(allToolCards).sort((a, b) => {
-        noResults.style.display = 'none';
+          // Get original indices from data attributes or DOM order
+          const aIndex = Array.from(allToolCards).indexOf(a);
+          const bIndex = Array.from(allToolCards).indexOf(b);
+          return aIndex - bIndex;
+        });
+        
+        originalOrder.forEach(card => {
+          toolsContainer.appendChild(card);
+        });
       }
-    });
+    }
+    
+    // Show/hide no results message
+    if (visibleCount === 0) {
+      noResults.style.display = 'block';
+    } else {
+      noResults.style.display = 'none';
+    }
+    
+    // Log semantic search info
+    if (semanticSearch) {
+      console.log(`[SEMANTIC] Displayed ${visibleCount} tools in semantic order`);
+    }
+  });
     
     window.addEventListener('viewChanged', (event) => {
       const view = event.detail;
@@ -497,4 +624,5 @@ const phases = data.phases;
 
     handleSharedURL();
   });
-</script>
+</script>
+</BaseLayout>

src/styles/auditTrail.css

@@ -0,0 +1,407 @@
+/* src/styles/auditTrail.css - Reusable Audit Trail Styles */
+
+.audit-trail-container {
+  background-color: var(--color-bg-secondary);
+  border: 1px solid var(--color-border);
+  border-left: 4px solid var(--color-accent);
+  border-radius: 0.5rem;
+  padding: 1rem;
+  margin: 1rem 0;
+  transition: var(--transition-fast);
+}
+
+.audit-trail-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 1rem;
+}
+
+.audit-trail-header.clickable {
+  cursor: pointer;
+  padding: 0.25rem;
+  border-radius: 0.25rem;
+  margin: -0.25rem;
+  transition: var(--transition-fast);
+}
+
+.audit-trail-header.clickable:hover {
+  background-color: var(--color-bg-tertiary);
+}
+
+.audit-trail-title {
+  display: flex;
+  align-items: center;
+  gap: 1.5rem;
+  flex: 1;
+}
+
+.audit-icon {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+}
+
+.audit-icon-gradient {
+  width: 24px;
+  height: 24px;
+  background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-primary) 100%);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: white;
+  font-size: 0.75rem;
+  font-weight: bold;
+}
+
+.audit-icon h4 {
+  margin: 0;
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: var(--color-accent);
+}
+
+.audit-stats {
+  display: flex;
+  gap: 1rem;
+  font-size: 0.75rem;
+  color: var(--color-text-secondary);
+}
+
+.stat-item {
+  display: flex;
+  align-items: center;
+  gap: 0.375rem;
+}
+
+.stat-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+}
+
+.stat-time {
+  background-color: var(--color-accent);
+}
+
+.toggle-icon {
+  transition: transform var(--transition-medium);
+  color: var(--color-text-secondary);
+}
+
+.audit-trail-details {
+  display: block;
+  transition: all var(--transition-medium);
+  overflow: hidden;
+}
+
+.audit-trail-details.collapsed {
+  display: none;
+}
+
+.audit-summary {
+  background-color: var(--color-bg-tertiary);
+  padding: 1rem;
+  border-radius: 0.5rem;
+  margin-bottom: 1.5rem;
+}
+
+.summary-header {
+  font-size: 0.75rem;
+  font-weight: 600;
+  color: var(--color-accent);
+  margin-bottom: 0.75rem;
+}
+
+.summary-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 1rem;
+  margin-bottom: 1rem;
+}
+
+.summary-stat {
+  text-align: center;
+}
+
+.summary-value {
+  font-size: 1.125rem;
+  font-weight: 700;
+  margin-bottom: 0.25rem;
+}
+
+.summary-value.success {
+  color: var(--color-accent);
+}
+
+.summary-value.warning {
+  color: var(--color-warning);
+}
+
+.summary-label {
+  font-size: 0.6875rem;
+  color: var(--color-text-secondary);
+}
+
+.insights-section {
+  margin-top: 0.75rem;
+}
+
+.insights-header {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  margin-bottom: 0.375rem;
+}
+
+.insights-header.success {
+  color: var(--color-accent);
+}
+
+.insights-header.warning {
+  color: var(--color-warning);
+}
+
+.insights-list {
+  margin: 0;
+  padding-left: 1rem;
+  font-size: 0.625rem;
+  line-height: 1.4;
+}
+
+.insights-list li {
+  margin-bottom: 0.25rem;
+}
+
+.audit-process-flow {
+  display: grid;
+  gap: 1rem;
+}
+
+.phase-group {
+  position: relative;
+}
+
+.phase-group:not(.last-phase)::after {
+  content: '';
+  position: absolute;
+  left: 13px;
+  bottom: -8px;
+  width: 2px;
+  height: 16px;
+  background: linear-gradient(to bottom, var(--color-border) 0%, transparent 100%);
+}
+
+
+.phase-icon {
+  font-size: 1rem;
+}
+
+.phase-name {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--color-text);
+}
+
+.phase-divider {
+  flex: 1;
+  height: 1px;
+  background-color: var(--color-border);
+}
+
+.phase-stats {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  flex-shrink: 0;
+}
+
+.confidence-bar {
+  width: 48px;
+  height: 8px;
+  background-color: var(--color-bg-tertiary);
+  border-radius: 4px;
+  overflow: hidden;
+}
+
+.confidence-fill {
+  height: 100%;
+  border-radius: 4px;
+  transition: var(--transition-fast);
+}
+
+.confidence-text {
+  font-size: 0.75rem;
+  color: var(--color-text-secondary);
+  min-width: 28px;
+}
+
+.phase-entries {
+  margin-left: 1.5rem;
+  display: grid;
+  gap: 0.5rem;
+}
+
+.audit-entry {
+  background-color: var(--color-bg);
+  border: 1px solid var(--color-border);
+  border-radius: 0.375rem;
+  padding: 0.75rem;
+  transition: var(--transition-fast);
+}
+
+.audit-entry:hover {
+  background-color: var(--color-bg-secondary);
+}
+
+.entry-main {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 0.5rem;
+}
+
+.entry-action {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--color-text);
+}
+
+.entry-meta {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.75rem;
+  color: var(--color-text-secondary);
+}
+
+.confidence-indicator {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+}
+
+.confidence-value {
+  min-width: 28px;
+  text-align: right;
+}
+
+.processing-time {
+  min-width: 40px;
+  text-align: right;
+}
+
+.entry-details {
+  font-size: 0.75rem;
+  color: var(--color-text-secondary);
+  padding-top: 0.5rem;
+  border-top: 1px solid var(--color-border);
+}
+
+.detail-item {
+  margin-bottom: 0.25rem;
+  word-break: break-word;
+}
+
+.detail-item:last-child {
+  margin-bottom: 0;
+}
+
+.technical-toggle {
+  text-align: center;
+  margin-top: 1.5rem;
+  padding-top: 1rem;
+  border-top: 1px solid var(--color-border);
+}
+
+.technical-toggle-btn {
+  background: none;
+  border: none;
+  color: var(--color-text-secondary);
+  cursor: pointer;
+  font-size: 0.75rem;
+  padding: 0.5rem 1rem;
+  border-radius: 0.25rem;
+  transition: var(--transition-fast);
+}
+
+.technical-toggle-btn:hover {
+  background-color: var(--color-bg-secondary);
+  color: var(--color-text);
+}
+
+.technical-details {
+  margin-top: 1rem;
+  display: grid;
+  gap: 0.5rem;
+  transition: all var(--transition-medium);
+}
+
+.technical-details.collapsed {
+  display: none;
+}
+
+.technical-entry {
+  background-color: var(--color-bg-secondary);
+  border: 1px solid var(--color-border);
+  border-radius: 0.375rem;
+  padding: 0.75rem;
+  font-size: 0.75rem;
+}
+
+.technical-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 0.5rem;
+  font-family: 'SF Mono', 'Monaco', 'Menlo', 'Consolas', monospace;
+}
+
+.technical-phase {
+  font-weight: 600;
+  color: var(--color-primary);
+}
+
+.technical-time {
+  color: var(--color-text-secondary);
+}
+
+.technical-content {
+  display: grid;
+  gap: 0.375rem;
+}
+
+.technical-row {
+  color: var(--color-text-secondary);
+  word-break: break-word;
+}
+
+/* Responsive Design */
+@media (width <= 768px) {
+  .audit-stats {
+    flex-direction: column;
+    gap: 0.5rem;
+    align-items: flex-start;
+  }
+
+  .summary-grid {
+    grid-template-columns: 1fr;
+    gap: 0.75rem;
+  }
+
+  .phase-divider {
+    display: none;
+  }
+
+  .entry-main {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 0.5rem;
+  }
+
+  .technical-header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 0.25rem;
+  }
+}

src/styles/global.css

@@ -1689,6 +1689,156 @@ input[type="checkbox"] {
   font-size: 0.75rem;
 }
 
+/* ===================================================================
+   SEMANTIC SEARCH STYLES - INLINE VERSION (REPLACE EXISTING)
+   ================================================================= */
+
+/* Search row with inline semantic toggle */
+.search-row {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+}
+
+.search-wrapper {
+  flex: 1;
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+
+/* Inline semantic search toggle */
+.semantic-search-inline {
+  flex-shrink: 0;
+}
+
+.semantic-toggle-wrapper {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  cursor: pointer;
+  padding: 0.5rem 0.75rem;
+  border-radius: 0.375rem;
+  border: 1px solid var(--color-border);
+  background-color: var(--color-bg-secondary);
+  transition: var(--transition-fast);
+  user-select: none;
+  white-space: nowrap;
+}
+
+.semantic-toggle-wrapper:hover {
+  background-color: var(--color-bg-tertiary);
+  border-color: var(--color-accent);
+}
+
+.semantic-toggle-wrapper input[type="checkbox"] {
+  display: none;
+}
+
+.semantic-checkbox-custom {
+  width: 16px;
+  height: 16px;
+  border: 2px solid var(--color-border);
+  border-radius: 0.25rem;
+  background-color: var(--color-bg);
+  transition: var(--transition-fast);
+  position: relative;
+  flex-shrink: 0;
+}
+
+.semantic-checkbox-custom::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%) scale(0);
+  width: 8px;
+  height: 8px;
+  background-color: white;
+  border-radius: 0.125rem;
+  transition: var(--transition-fast);
+}
+
+.semantic-toggle-wrapper input:checked + .semantic-checkbox-custom {
+  background-color: var(--color-accent);
+  border-color: var(--color-accent);
+}
+
+.semantic-toggle-wrapper input:checked + .semantic-checkbox-custom::after {
+  transform: translate(-50%, -50%) scale(1);
+}
+
+.semantic-toggle-label {
+  display: flex;
+  align-items: center;
+  gap: 0.375rem;
+  font-size: 0.8125rem;
+  font-weight: 500;
+  color: var(--color-text);
+}
+
+.semantic-toggle-label svg {
+  width: 14px;
+  height: 14px;
+  color: var(--color-accent);
+  flex-shrink: 0;
+}
+
+/* Semantic Status Display */
+.semantic-status {
+  margin-top: 0.75rem;
+  padding: 0.375rem 0.75rem;
+  background-color: var(--color-accent);
+  color: white;
+  border-radius: 1rem;
+  font-size: 0.75rem;
+  font-weight: 500;
+  text-align: center;
+  opacity: 0.9;
+}
+
+.semantic-results-count {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.375rem;
+}
+
+.semantic-results-count::before {
+  content: '🧠';
+  font-size: 0.875rem;
+}
+
+/* Responsive adjustments */
+@media (width <= 768px) {
+  .search-row {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0.75rem;
+  }
+  
+  .semantic-toggle-wrapper {
+    justify-content: center;
+    padding: 0.625rem;
+  }
+  
+  .semantic-toggle-label {
+    font-size: 0.875rem;
+  }
+}
+
+@media (width <= 480px) {
+  .semantic-toggle-label span {
+    display: none; /* Hide "Semantisch" text on very small screens */
+  }
+  
+  .semantic-toggle-wrapper {
+    padding: 0.5rem;
+    min-width: 40px;
+    justify-content: center;
+  }
+}
+
 /* ===================================================================
    16. AI INTERFACE (CONSOLIDATED)
    ================================================================= */
@@ -1970,9 +2120,12 @@ input[type="checkbox"] {
   margin: 0 auto 0.75rem;
 }
 
-.phase-info { 
+.phase-info {
-  flex: 1; 
+  display: flex;
-  min-width: 0; 
+  flex-direction: column;
+  gap: 0.75rem;
+  flex: 1;
+  min-width: 0;
 }
 
 .phase-title {
@@ -3722,50 +3875,4 @@ footer {
   border: none;
   border-top: 1px solid var(--color-border);
   margin: 2rem 0;
-}
-
-/* ===================================================================
-   26. ENHANCED AUDIT TRAIL STYLES
-   ================================================================= */
-
-.audit-process-flow {
-  position: relative;
-}
-
-.phase-group {
-  position: relative;
-}
-
-.phase-group:not(:last-child)::after {
-  content: '';
-  position: absolute;
-  left: 13px;
-  bottom: -8px;
-  width: 2px;
-  height: 16px;
-  background: linear-gradient(to bottom, var(--color-border) 0%, transparent 100%);
-}
-
-.toggle-icon {
-  transition: transform 0.2s ease;
-}
-
-/* Hover effects for audit entries */
-.audit-trail-details .hover\\:bg-secondary:hover {
-  background-color: var(--color-bg-secondary);
-}
-
-/* Responsive adjustments for audit trail */
-@media (width <= 768px) {
-  .audit-process-flow .grid-cols-3 {
-    grid-template-columns: 1fr;
-    gap: 1rem;
-  }
-  
-  .phase-group .flex {
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 0.5rem;
-  }
-  
 }

src/utils/aiPipeline.ts

@@ -4,6 +4,7 @@ import { getCompressedToolsDataForAI } from './dataService.js';
 import { embeddingsService, type EmbeddingData, type SimilarityResult } from './embeddings.js';
 import { AI_PROMPTS, getPrompt } from '../config/prompts.js';
 import { isToolHosted } from './toolHelpers.js';
+import { auditService } from './auditService.js';  // Add this import
 
 interface AIConfig {
   endpoint: string;
@@ -95,9 +96,9 @@ class ImprovedMicroTaskAIPipeline {
   
   private auditConfig: {
     enabled: boolean;
-    detailLevel: 'minimal' | 'standard' | 'verbose';
+    detailLevel: string;
-    retentionHours: number;
   };
+  private tempAuditEntries: AuditEntry[] = [];
 
   private confidenceConfig: {
     semanticWeight: number;       
@@ -109,8 +110,6 @@ class ImprovedMicroTaskAIPipeline {
     highThreshold: number;
   };
   
-  private tempAuditEntries: AuditEntry[] = [];
-
   constructor() {
     this.config = {
       endpoint: this.getEnv('AI_ANALYZER_ENDPOINT'),
@@ -136,11 +135,12 @@ class ImprovedMicroTaskAIPipeline {
     this.maxPromptTokens = parseInt(process.env.AI_MAX_PROMPT_TOKENS || '1500', 10);
     
     this.auditConfig = {
-      enabled: process.env.FORENSIC_AUDIT_ENABLED === 'true',
+      enabled: process.env.FORENSIC_AUDIT_ENABLED === 'true' || process.env.NODE_ENV === 'development',
-      detailLevel: (process.env.FORENSIC_AUDIT_DETAIL_LEVEL as any) || 'standard',
+      detailLevel: process.env.FORENSIC_AUDIT_DETAIL_LEVEL || 'standard'
-      retentionHours: parseInt(process.env.FORENSIC_AUDIT_RETENTION_HOURS || '72', 10)
     };
     
+    console.log('[AI PIPELINE] Audit trail enabled:', this.auditConfig.enabled);
+    
     this.confidenceConfig = {
       semanticWeight: parseFloat(process.env.CONFIDENCE_SEMANTIC_WEIGHT || '0.3'),   
       suitabilityWeight: parseFloat(process.env.CONFIDENCE_SUITABILITY_WEIGHT || '0.7'), 
@@ -166,47 +166,50 @@ class ImprovedMicroTaskAIPipeline {
   }
 
   private addAuditEntry(
-    context: AnalysisContext | null, 
+    context: AnalysisContext,
-    phase: string, 
+    phase: string,
-    action: string, 
+    action: string,
-    input: any, 
+    input: any,
-    output: any, 
+    output: any,
-    confidence: number, 
+    confidence: number,
-    startTime: number, 
+    startTime: number,
     metadata: Record<string, any> = {}
   ): void {
     if (!this.auditConfig.enabled) return;
-    
+
-    const auditEntry: AuditEntry = {
+    const entry: AuditEntry = {
       timestamp: Date.now(),
       phase,
-      action, 
+      action,
-      input: this.auditConfig.detailLevel === 'verbose' ? input : this.summarizeForAudit(input),
+      input,
-      output: this.auditConfig.detailLevel === 'verbose' ? output : this.summarizeForAudit(output),
+      output,
-      confidence,
+      confidence: Math.round(confidence),
       processingTimeMs: Date.now() - startTime,
       metadata
     };
-    
+
-    if (context) {
+    // Add to context audit trail instead of temp storage
-      context.auditTrail.push(auditEntry);
+    if (!context.auditTrail) {
-    } else {
+      context.auditTrail = [];
-      this.tempAuditEntries.push(auditEntry);
     }
+    context.auditTrail.push(entry);
     
-    console.log(`[AUDIT] ${phase}/${action}: ${confidence}% confidence, ${Date.now() - startTime}ms`);
+    console.log(`[AUDIT] ${phase}/${action}: ${confidence}% confidence, ${entry.processingTimeMs}ms`);
   }
   
   private mergeTemporaryAuditEntries(context: AnalysisContext): void {
     if (!this.auditConfig.enabled || this.tempAuditEntries.length === 0) return;
-    
-    const entryCount = this.tempAuditEntries.length;
-    context.auditTrail.unshift(...this.tempAuditEntries);
-    this.tempAuditEntries = []; 
-    
-    console.log(`[AUDIT] Merged ${entryCount} temporary audit entries into context`);
-  }
 
+    if (!context.auditTrail) {
+      context.auditTrail = [];
+    }
+    
+    context.auditTrail.unshift(...this.tempAuditEntries);
+    this.tempAuditEntries = [];
+    
+    console.log('[AUDIT] Merged temporary entries into context');
+  }
+/**
   private summarizeForAudit(data: any): any {
     if (this.auditConfig.detailLevel === 'minimal') {
       if (typeof data === 'string' && data.length > 100) {
@@ -224,7 +227,7 @@ class ImprovedMicroTaskAIPipeline {
       }
     }
     return data;
-  }
+  }**/
 
   private calculateSelectionConfidence(result: any, candidateCount: number): number {
     if (!result || !result.selectedTools) return 30;
@@ -385,14 +388,13 @@ class ImprovedMicroTaskAIPipeline {
     
     context.embeddingsSimilarities = new Map<string, number>();
     
-    if (process.env.AI_EMBEDDINGS_ENABLED === 'true') {
+    // Always try to initialize embeddings - let the service decide if it should be enabled
-      try {
+    try {
-        console.log('[AI PIPELINE] Waiting for embeddings initialization...');
+      console.log('[AI PIPELINE] Attempting embeddings initialization...');
-        await embeddingsService.waitForInitialization();
+      await embeddingsService.waitForInitialization();
-        console.log('[AI PIPELINE] Embeddings ready, proceeding with similarity search');
+      console.log('[AI PIPELINE] Embeddings initialization completed');
-      } catch (error) {
+    } catch (error) {
-        console.error('[AI PIPELINE] Embeddings initialization failed, falling back to full dataset:', error);
+      console.error('[AI PIPELINE] Embeddings initialization failed:', error);
-      }
     }
     
     if (embeddingsService.isEnabled()) {
@@ -1192,6 +1194,11 @@ ${JSON.stringify(conceptsToSend, null, 2)}`;
       })) || []
     };
 
+    // Process audit trail before returning
+    const processedAuditTrail = this.auditConfig.enabled && context.auditTrail 
+      ? context.auditTrail 
+      : [];
+
     if (isWorkflow) {
       const recommendedToolsWithConfidence = context.selectedTools?.map(st => {
         const confidence = this.calculateRecommendationConfidence(
@@ -1229,7 +1236,8 @@ ${JSON.stringify(conceptsToSend, null, 2)}`;
       return {
         ...base,
         recommended_tools: recommendedToolsWithConfidence,
-        workflow_suggestion: finalContent
+        workflow_suggestion: finalContent,
+        auditTrail: processedAuditTrail  // Always include audit trail array
       };
     } else {
       const recommendedToolsWithConfidence = context.selectedTools?.map(st => {
@@ -1270,7 +1278,8 @@ ${JSON.stringify(conceptsToSend, null, 2)}`;
       return {
         ...base,
         recommended_tools: recommendedToolsWithConfidence,
-        additional_considerations: finalContent
+        additional_considerations: finalContent,
+        auditTrail: processedAuditTrail  // Always include audit trail array
       };
     }
   }

src/utils/auditService.ts

@@ -0,0 +1,427 @@
+// src/utils/auditService.ts - Centralized Audit Trail Management
+
+
+function env(key: string, fallback: string | undefined = undefined): string | undefined {
+  // during dev/server-side rendering
+  if (typeof process !== 'undefined' && process.env?.[key] !== undefined) {
+    return process.env[key];
+  }
+  // during client build / browser
+  if (typeof import.meta !== 'undefined' && (import.meta as any).env?.[key] !== undefined) {
+    return (import.meta as any).env[key];
+  }
+  return fallback;
+}
+
+interface AuditEntry {
+  timestamp: number;
+  phase: string;
+  action: string;
+  input: any;
+  output: any;
+  confidence: number;
+  processingTimeMs: number;
+  metadata: Record<string, any>;
+}
+
+interface AuditConfig {
+  enabled: boolean;
+  detailLevel: 'minimal' | 'standard' | 'verbose';
+  retentionHours: number;
+  maxEntriesPerRequest: number;
+}
+
+interface CompressedAuditEntry {
+  timestamp: number;
+  phase: string;
+  action: string;
+  inputSummary: string;
+  outputSummary: string;
+  confidence: number;
+  processingTimeMs: number;
+  metadata: Record<string, any>;
+}
+
+interface ProcessedAuditTrail {
+  totalTime: number;
+  avgConfidence: number;
+  stepCount: number;
+  highConfidenceSteps: number;
+  lowConfidenceSteps: number;
+  phases: Array<{
+    name: string;
+    icon: string;
+    displayName: string;
+    avgConfidence: number;
+    totalTime: number;
+    entries: CompressedAuditEntry[];
+  }>;
+  summary: {
+    analysisQuality: 'excellent' | 'good' | 'fair' | 'poor';
+    keyInsights: string[];
+    potentialIssues: string[];
+  };
+}
+
+class AuditService {
+  private config: AuditConfig;
+  private tempEntries: AuditEntry[] = [];
+  
+  // Phase configuration with German translations
+  private readonly phaseConfig = {
+    'initialization': { icon: '🚀', displayName: 'Initialisierung' },
+    'retrieval': { icon: '🔍', displayName: 'Datensuche' },
+    'selection': { icon: '🎯', displayName: 'Tool-Auswahl' },
+    'micro-task': { icon: '⚡', displayName: 'Detail-Analyse' },
+    'validation': { icon: '✓', displayName: 'Validierung' },
+    'completion': { icon: '✅', displayName: 'Finalisierung' }
+  };
+
+  // Action translations
+  private readonly actionTranslations = {
+    'pipeline-start': 'Analyse gestartet',
+    'embeddings-search': 'Ähnliche Tools gesucht', 
+    'ai-tool-selection': 'Tools automatisch ausgewählt',
+    'ai-analysis': 'KI-Analyse durchgeführt',
+    'phase-tool-selection': 'Phasen-Tools evaluiert',
+    'tool-evaluation': 'Tool-Bewertung erstellt',
+    'background-knowledge-selection': 'Hintergrundwissen ausgewählt',
+    'confidence-scoring': 'Vertrauenswertung berechnet',
+    'pipeline-end': 'Analyse abgeschlossen'
+  };
+
+  constructor() {
+    this.config = this.loadConfig();
+  }
+
+    private loadConfig(): AuditConfig {
+    // use the helper if you added it
+        const enabledFlag =
+            (typeof import.meta !== 'undefined' &&
+            (import.meta as any).env?.PUBLIC_FORENSIC_AUDIT_ENABLED) ?? 'false';
+
+        return {
+            enabled: enabledFlag === 'true',
+            detailLevel:
+            ((import.meta as any).env?.PUBLIC_FORENSIC_AUDIT_DETAIL_LEVEL as any) ||
+            'standard',
+            retentionHours: parseInt(
+            (import.meta as any).env?.PUBLIC_FORENSIC_AUDIT_RETENTION_HOURS || '72',
+            10
+            ),
+            maxEntriesPerRequest: parseInt(
+            (import.meta as any).env?.PUBLIC_FORENSIC_AUDIT_MAX_ENTRIES || '50',
+            10
+            ),
+        };
+    }
+
+
+  /**
+   * Add an audit entry with automatic data compression
+   */
+  addEntry(
+    phase: string,
+    action: string,
+    input: any,
+    output: any,
+    confidence: number,
+    startTime: number,
+    metadata: Record<string, any> = {}
+  ): void {
+    if (!this.config.enabled) return;
+
+    const entry: AuditEntry = {
+      timestamp: Date.now(),
+      phase,
+      action,
+      input: this.compressData(input),
+      output: this.compressData(output),
+      confidence: Math.round(confidence),
+      processingTimeMs: Date.now() - startTime,
+      metadata
+    };
+
+    this.tempEntries.push(entry);
+    console.log(`[AUDIT] ${phase}/${action}: ${confidence}% confidence, ${entry.processingTimeMs}ms`);
+  }
+
+
+  mergeAndClear(auditTrail: AuditEntry[]): void {
+    if (!this.config.enabled || this.tempEntries.length === 0) return;
+
+    auditTrail.unshift(...this.tempEntries);
+    const entryCount = this.tempEntries.length;
+    this.tempEntries = [];
+    
+    console.log(`[AUDIT] Merged ${entryCount} entries into audit trail`);
+  }
+
+
+  processAuditTrail(rawAuditTrail: AuditEntry[]): ProcessedAuditTrail | null {
+    if (!this.config.enabled) {
+        console.log('[AUDIT] Service disabled, returning null');
+        return null;
+    }
+    
+    if (!rawAuditTrail || !Array.isArray(rawAuditTrail) || rawAuditTrail.length === 0) {
+        console.log('[AUDIT] No audit trail data provided');
+        return null;
+    }
+
+    try {
+        console.log('[AUDIT] Processing', rawAuditTrail.length, 'audit entries');
+
+        // Calculate summary statistics with safe defaults
+        const totalTime = rawAuditTrail.reduce((sum, entry) => sum + (entry.processingTimeMs || 0), 0);
+        const validConfidenceEntries = rawAuditTrail.filter(entry => typeof entry.confidence === 'number');
+        const avgConfidence = validConfidenceEntries.length > 0 
+        ? Math.round(validConfidenceEntries.reduce((sum, entry) => sum + entry.confidence, 0) / validConfidenceEntries.length)
+        : 0;
+        
+        const highConfidenceSteps = rawAuditTrail.filter(entry => (entry.confidence || 0) >= 80).length;
+        const lowConfidenceSteps = rawAuditTrail.filter(entry => (entry.confidence || 0) < 60).length;
+
+        // Group entries by phase with safe handling
+        const groupedEntries = rawAuditTrail.reduce((groups, entry) => {
+        const phase = entry.phase || 'unknown';
+        if (!groups[phase]) groups[phase] = [];
+        groups[phase].push(entry);
+        return groups;
+        }, {} as Record<string, AuditEntry[]>);
+
+        // Process phases with error handling
+        const phases = Object.entries(groupedEntries).map(([phase, entries]) => {
+        const phaseConfig = this.phaseConfig[phase] || { icon: '📋', displayName: phase };
+        const validEntries = entries.filter(entry => entry && typeof entry === 'object');
+        
+        const phaseAvgConfidence = validEntries.length > 0 
+            ? Math.round(validEntries.reduce((sum, entry) => sum + (entry.confidence || 0), 0) / validEntries.length)
+            : 0;
+        
+        const phaseTotalTime = validEntries.reduce((sum, entry) => sum + (entry.processingTimeMs || 0), 0);
+
+        return {
+            name: phase,
+            icon: phaseConfig.icon,
+            displayName: phaseConfig.displayName,
+            avgConfidence: phaseAvgConfidence,
+            totalTime: phaseTotalTime,
+            entries: validEntries
+  .map(e => this.compressEntry(e))
+  .filter((e): e is CompressedAuditEntry => e !== null)
+        };
+        }).filter(phase => phase.entries.length > 0); // Only include phases with valid entries
+
+        // Generate analysis summary
+        const summary = this.generateSummary(rawAuditTrail, avgConfidence, lowConfidenceSteps);
+
+        const result: ProcessedAuditTrail = {
+        totalTime,
+        avgConfidence,
+        stepCount: rawAuditTrail.length,
+        highConfidenceSteps,
+        lowConfidenceSteps,
+        phases,
+        summary
+        };
+
+        console.log('[AUDIT] Successfully processed audit trail:', result);
+        return result;
+        
+    } catch (error) {
+        console.error('[AUDIT] Error processing audit trail:', error);
+        return null;
+    }
+  }
+
+  /**
+   * Compress audit entry for efficient transport
+   */
+  private compressEntry(entry: AuditEntry): CompressedAuditEntry | null {
+    if (!entry || typeof entry !== 'object') {
+        console.warn('[AUDIT] Invalid audit entry:', entry);
+        return null;
+    }
+
+    try {
+        return {
+        timestamp: entry.timestamp || Date.now(),
+        phase: entry.phase || 'unknown',
+        action: entry.action || 'unknown',
+        inputSummary: this.summarizeData(entry.input),
+        outputSummary: this.summarizeData(entry.output),
+        confidence: entry.confidence || 0,
+        processingTimeMs: entry.processingTimeMs || 0,
+        metadata: entry.metadata || {}
+        };
+    } catch (error) {
+        console.error('[AUDIT] Error compressing entry:', error);
+        return null;
+    }
+  }
+
+  /**
+   * Compress data based on detail level
+   */
+  private compressData(data: any): any {
+    if (this.config.detailLevel === 'verbose') {
+      return data; // Keep full data
+    } else if (this.config.detailLevel === 'standard') {
+      return this.summarizeForStorage(data);
+    } else {
+      return this.minimalSummary(data);
+    }
+  }
+
+  /**
+   * Summarize data for display purposes
+   */
+  private summarizeData(data: any): string {
+    if (data === null || data === undefined) return 'null';
+    if (typeof data === 'string') {
+      return data.length > 100 ? data.slice(0, 100) + '...' : data;
+    }
+    if (typeof data === 'number' || typeof data === 'boolean') {
+      return data.toString();
+    }
+    if (Array.isArray(data)) {
+      if (data.length === 0) return '[]';
+      if (data.length <= 3) return JSON.stringify(data);
+      return `[${data.slice(0, 3).map(i => typeof i === 'string' ? i : JSON.stringify(i)).join(', ')}, ...+${data.length - 3}]`;
+    }
+    if (typeof data === 'object') {
+      const keys = Object.keys(data);
+      if (keys.length === 0) return '{}';
+      if (keys.length <= 3) {
+        return '{' + keys.map(k => `${k}: ${typeof data[k] === 'string' ? data[k].slice(0, 20) + (data[k].length > 20 ? '...' : '') : JSON.stringify(data[k])}`).join(', ') + '}';
+      }
+      return `{${keys.slice(0, 3).join(', ')}, ...+${keys.length - 3} keys}`;
+    }
+    return String(data);
+  }
+
+  /**
+   * Standard level data compression
+   */
+  private summarizeForStorage(data: any): any {
+    if (typeof data === 'string' && data.length > 500) {
+      return data.slice(0, 500) + '...[truncated]';
+    }
+    if (Array.isArray(data) && data.length > 10) {
+      return [...data.slice(0, 10), `...[${data.length - 10} more items]`];
+    }
+    return data;
+  }
+
+  /**
+   * Minimal level data compression
+   */
+  private minimalSummary(data: any): any {
+    if (typeof data === 'string' && data.length > 100) {
+      return data.slice(0, 100) + '...[truncated]';
+    }
+    if (Array.isArray(data) && data.length > 3) {
+      return [...data.slice(0, 3), `...[${data.length - 3} more items]`];
+    }
+    return data;
+  }
+
+  /**
+   * Generate analysis summary
+   */
+  private generateSummary(entries: AuditEntry[], avgConfidence: number, lowConfidenceSteps: number): {
+    analysisQuality: 'excellent' | 'good' | 'fair' | 'poor';
+    keyInsights: string[];
+    potentialIssues: string[];
+  } {
+    // Determine analysis quality
+    let analysisQuality: 'excellent' | 'good' | 'fair' | 'poor';
+    if (avgConfidence >= 85 && lowConfidenceSteps === 0) {
+      analysisQuality = 'excellent';
+    } else if (avgConfidence >= 70 && lowConfidenceSteps <= 1) {
+      analysisQuality = 'good';
+    } else if (avgConfidence >= 60 && lowConfidenceSteps <= 3) {
+      analysisQuality = 'fair';
+    } else {
+      analysisQuality = 'poor';
+    }
+
+    // Generate key insights
+    const keyInsights: string[] = [];
+    const embeddingsUsed = entries.some(e => e.action === 'embeddings-search');
+    if (embeddingsUsed) {
+      keyInsights.push('Semantische Suche wurde erfolgreich eingesetzt');
+    }
+
+    const toolSelectionEntries = entries.filter(e => e.action === 'ai-tool-selection');
+    if (toolSelectionEntries.length > 0) {
+      const avgSelectionConfidence = toolSelectionEntries.reduce((sum, e) => sum + e.confidence, 0) / toolSelectionEntries.length;
+      if (avgSelectionConfidence >= 80) {
+        keyInsights.push('Hohe Konfidenz bei der Tool-Auswahl');
+      }
+    }
+
+    // Identify potential issues
+    const potentialIssues: string[] = [];
+    if (lowConfidenceSteps > 2) {
+      potentialIssues.push(`${lowConfidenceSteps} Analyseschritte mit niedriger Konfidenz`);
+    }
+
+    const longSteps = entries.filter(e => e.processingTimeMs > 5000);
+    if (longSteps.length > 0) {
+      potentialIssues.push(`${longSteps.length} Schritte benötigten mehr als 5 Sekunden`);
+    }
+
+    return {
+      analysisQuality,
+      keyInsights,
+      potentialIssues
+    };
+  }
+
+  /**
+   * Get translated action name
+   */
+  getActionDisplayName(action: string): string {
+    return this.actionTranslations[action] || action;
+  }
+
+  /**
+   * Format duration for display
+   */
+  formatDuration(ms: number): string {
+    if (ms < 1000) return '< 1s';
+    if (ms < 60000) return `${Math.ceil(ms / 1000)}s`;
+    const minutes = Math.floor(ms / 60000);
+    const seconds = Math.ceil((ms % 60000) / 1000);
+    return seconds > 0 ? `${minutes}m ${seconds}s` : `${minutes}m`;
+  }
+
+  /**
+   * Get confidence color for UI
+   */
+  getConfidenceColor(confidence: number): string {
+    if (confidence >= 80) return 'var(--color-accent)';
+    if (confidence >= 60) return 'var(--color-warning)';
+    return 'var(--color-error)';
+  }
+
+  /**
+   * Check if audit is enabled
+   */
+  isEnabled(): boolean {
+    return this.config.enabled;
+  }
+
+  /**
+   * Get current configuration
+   */
+  getConfig(): AuditConfig {
+    return { ...this.config };
+  }
+}
+
+// Export singleton instance
+export const auditService = new AuditService();
+export type { ProcessedAuditTrail, CompressedAuditEntry };

src/utils/embeddings.ts

@@ -2,6 +2,8 @@
 import { promises as fs } from 'fs';
 import path from 'path';
 import { getCompressedToolsDataForAI } from './dataService.js';
+import 'dotenv/config';
+import crypto from 'crypto';
 
 interface EmbeddingData {
   id: string;
@@ -35,12 +37,56 @@ class EmbeddingsService {
   private readonly embeddingsPath = path.join(process.cwd(), 'data', 'embeddings.json');
   private readonly batchSize: number;
   private readonly batchDelay: number;
-  private readonly enabled: boolean;
+  private enabled: boolean = false; // Make mutable again
 
   constructor() {
-    this.enabled = process.env.AI_EMBEDDINGS_ENABLED === 'true';
     this.batchSize = parseInt(process.env.AI_EMBEDDINGS_BATCH_SIZE || '20', 10);
     this.batchDelay = parseInt(process.env.AI_EMBEDDINGS_BATCH_DELAY_MS || '1000', 10);
+    
+    // Don't call async method from constructor - handle in initialize() instead
+    this.enabled = true; // Start optimistically enabled for development
+  }
+
+  private async checkEnabledStatus(): Promise<void> {
+    try {
+      // Add debugging to see what's actually in process.env
+      console.log('[EMBEDDINGS] Debug env check:', {
+        AI_EMBEDDINGS_ENABLED: process.env.AI_EMBEDDINGS_ENABLED,
+        envKeys: Object.keys(process.env).filter(k => k.includes('EMBEDDINGS')).length,
+        allEnvKeys: Object.keys(process.env).length
+      });
+      
+      const envEnabled = process.env.AI_EMBEDDINGS_ENABLED;
+      
+      if (envEnabled === 'true') {
+        // Check if we have the required API configuration
+        const endpoint = process.env.AI_EMBEDDINGS_ENDPOINT;
+        const model = process.env.AI_EMBEDDINGS_MODEL;
+        
+        if (!endpoint || !model) {
+          console.warn('[EMBEDDINGS] Embeddings enabled but API configuration missing - disabling');
+          this.enabled = false;
+          return;
+        }
+        
+        console.log('[EMBEDDINGS] All requirements met - enabling embeddings');
+        this.enabled = true;
+        return;
+      }
+      
+      // Check if embeddings file exists
+      try {
+        await fs.stat(this.embeddingsPath);
+        console.log('[EMBEDDINGS] Existing embeddings file found - enabling');
+        this.enabled = true;
+      } catch {
+        console.log('[EMBEDDINGS] Embeddings not explicitly enabled - disabling');
+        this.enabled = false;
+      }
+    } catch (error) {
+      console.error('[EMBEDDINGS] Error checking enabled status:', error);
+      this.enabled = false;
+    }
   }
 
   async initialize(): Promise<void> {
@@ -57,60 +103,61 @@ class EmbeddingsService {
   }
 
   private async performInitialization(): Promise<void> {
+    // 1️⃣ Respect the on/off switch that the newer code introduced
+    await this.checkEnabledStatus();
     if (!this.enabled) {
       console.log('[EMBEDDINGS] Embeddings disabled, skipping initialization');
       return;
     }
 
+    const initStart = Date.now();
     try {
-      console.log('[EMBEDDINGS] Initializing embeddings system...');
+      console.log('[EMBEDDINGS] Initializing embeddings system…');
-      
+
+      // Make sure the data folder exists
       await fs.mkdir(path.dirname(this.embeddingsPath), { recursive: true });
-      
+
-      const toolsData = await getCompressedToolsDataForAI();
+      // Load current tools / concepts and generate a hash
-      const currentDataHash = this.hashData(toolsData);
+      const toolsData        = await getCompressedToolsDataForAI();
-      
+      const currentDataHash  = await this.hashToolsFile();   // <- keep the old helper
-      const existingEmbeddings = await this.loadEmbeddings();
+
-      
+      // Try to read an existing file
-      if (existingEmbeddings && existingEmbeddings.version === currentDataHash) {
+      const existing         = await this.loadEmbeddings();
+      console.log('[EMBEDDINGS] Current hash:', currentDataHash);
+      console.log('[EMBEDDINGS] Existing file version:', existing?.version);
+      console.log('[EMBEDDINGS] Existing embeddings length:', existing?.embeddings?.length);
+
+      const cacheIsUsable =
+        existing &&
+        existing.version === currentDataHash &&
+        Array.isArray(existing.embeddings) &&
+        existing.embeddings.length > 0;
+
+      if (cacheIsUsable) {
         console.log('[EMBEDDINGS] Using cached embeddings');
-        this.embeddings = existingEmbeddings.embeddings;
+        this.embeddings    = existing.embeddings;
       } else {
-        console.log('[EMBEDDINGS] Generating new embeddings...');
+        console.log('[EMBEDDINGS] Generating new embeddings…');
-        await this.generateEmbeddings(toolsData, currentDataHash);
+        // 2️⃣ Build and persist new vectors
+        await this.generateEmbeddings(toolsData, currentDataHash); // <- old helper
       }
-      
+
       this.isInitialized = true;
-      console.log(`[EMBEDDINGS] Initialized with ${this.embeddings.length} embeddings`);
+      console.log(`[EMBEDDINGS] Initialized with ${this.embeddings.length} embeddings in ${Date.now() - initStart} ms`);
-      
+    } catch (err) {
-    } catch (error) {
+      console.error('[EMBEDDINGS] Failed to initialize:', err);
-      console.error('[EMBEDDINGS] Failed to initialize:', error);
       this.isInitialized = false;
-      throw error;
+      throw err;     // Let the caller know – same behaviour as before
     } finally {
+      // 3️⃣ Always clear the promise so subsequent calls don't hang
       this.initializationPromise = null;
     }
   }
 
-  async waitForInitialization(): Promise<void> {
+  private async hashToolsFile(): Promise<string> {
-    if (!this.enabled) {
+    const file = path.join(process.cwd(), 'src', 'data', 'tools.yaml');
-      return Promise.resolve();
+    const raw  = await fs.readFile(file, 'utf8');
-    }
+    return crypto.createHash('sha256').update(raw).digest('hex');   // 64-char hex
-
-    if (this.isInitialized) {
-      return Promise.resolve();
-    }
-
-    if (this.initializationPromise) {
-      await this.initializationPromise;
-      return;
-    }
-
-    return this.initialize();
-  }
-
-  private hashData(data: any): string {
-    return Buffer.from(JSON.stringify(data)).toString('base64').slice(0, 32);
   }
 
   private async loadEmbeddings(): Promise<EmbeddingsDatabase | null> {
@@ -152,7 +199,10 @@ class EmbeddingsService {
     const model = process.env.AI_EMBEDDINGS_MODEL;
 
     if (!endpoint || !model) {
-      throw new Error('Missing embeddings API configuration');
+      const missing: string[] = [];
+      if (!endpoint) missing.push('AI_EMBEDDINGS_ENDPOINT');
+      if (!model) missing.push('AI_EMBEDDINGS_MODEL');
+      throw new Error(`Missing embeddings API configuration: ${missing.join(', ')}`);
     }
 
     const headers: Record<string, string> = {
@@ -240,10 +290,37 @@ class EmbeddingsService {
   }
 
   public async embedText(text: string): Promise<number[]> {
+    if (!this.enabled || !this.isInitialized) {
+      throw new Error('Embeddings service not available');
+    }
     const [embedding] = await this.generateEmbeddingsBatch([text.toLowerCase()]);
     return embedding;
   }
 
+  async waitForInitialization(): Promise<void> {
+    // Always re-check environment status first in case variables loaded after initial check
+    await this.checkEnabledStatus();
+    
+    if (!this.enabled || this.isInitialized) {
+      return Promise.resolve();
+    }
+
+    if (this.initializationPromise) {
+      await this.initializationPromise;
+      return;
+    }
+
+    return this.initialize();
+  }
+
+  // Force re-check of environment status (useful for development)
+  async forceRecheckEnvironment(): Promise<void> {
+    this.enabled = false;
+    this.isInitialized = false;
+    await this.checkEnabledStatus();
+    console.log('[EMBEDDINGS] Environment status re-checked, enabled:', this.enabled);
+  }
+
   private cosineSimilarity(a: number[], b: number[]): number {
     let dotProduct = 0;
     let normA = 0;
@@ -259,54 +336,127 @@ class EmbeddingsService {
   }
 
   async findSimilar(query: string, maxResults: number = 30, threshold: number = 0.3): Promise<SimilarityResult[]> {
-    if (!this.enabled || !this.isInitialized || this.embeddings.length === 0) {
+    if (!this.enabled) {
-      console.log('[EMBEDDINGS] Service not available for similarity search');
+      console.log('[EMBEDDINGS] Service disabled for similarity search');
       return [];
     }
 
     try {
-      const queryEmbeddings = await this.generateEmbeddingsBatch([query.toLowerCase()]);
+      // If we have embeddings data, use it
-      const queryEmbedding = queryEmbeddings[0];
+      if (this.isInitialized && this.embeddings.length > 0) {
-
+        console.log(`[EMBEDDINGS] Using embeddings data for similarity search: ${query}`);
-      console.log(`[EMBEDDINGS] Computing similarities for ${this.embeddings.length} items`);
-
-      const similarities: SimilarityResult[] = this.embeddings.map(item => ({
-        ...item,
-        similarity: this.cosineSimilarity(queryEmbedding, item.embedding)
-      }));
-
-      const results = similarities
-        .filter(item => item.similarity >= threshold)
-        .sort((a, b) => b.similarity - a.similarity) 
-        .slice(0, maxResults);
-
-      const orderingValid = results.every((item, index) => {
-        if (index === 0) return true;
-        return item.similarity <= results[index - 1].similarity;
-      });
-
-      if (!orderingValid) {
-        console.error('[EMBEDDINGS] CRITICAL: Similarity ordering is broken!');
-        results.forEach((item, idx) => {
-          console.error(`  ${idx}: ${item.name} = ${item.similarity.toFixed(4)}`);
-        });
-      }
-
-      console.log(`[EMBEDDINGS] Found ${results.length} similar items (threshold: ${threshold})`);
-      if (results.length > 0) {
-        console.log('[EMBEDDINGS] Top 10 similarity matches:');
-        results.slice(0, 10).forEach((item, idx) => {
-          console.log(`  ${idx + 1}. ${item.name} (${item.type}) = ${item.similarity.toFixed(4)}`);
-        });
         
-        const topSimilarity = results[0].similarity;
+        const queryEmbeddings = await this.generateEmbeddingsBatch([query.toLowerCase()]);
-        const hasHigherSimilarity = results.some(item => item.similarity > topSimilarity);
+        const queryEmbedding = queryEmbeddings[0];
-        if (hasHigherSimilarity) {
-          console.error('[EMBEDDINGS] CRITICAL: Top result is not actually the highest similarity!');
-        }
-      }
 
-      return results;
+        console.log(`[EMBEDDINGS] Computing similarities for ${this.embeddings.length} items`);
+
+        const similarities: SimilarityResult[] = this.embeddings.map(item => ({
+          ...item,
+          similarity: this.cosineSimilarity(queryEmbedding, item.embedding)
+        }));
+
+        const topScore      = Math.max(...similarities.map(s => s.similarity));
+        const dynamicCutOff = Math.max(threshold, topScore * 0.85);
+
+        const results = similarities
+          .filter(item => item.similarity >= dynamicCutOff)
+          .sort((a, b) => b.similarity - a.similarity)
+          .slice(0, maxResults);
+
+
+        const orderingValid = results.every((item, index) => {
+          if (index === 0) return true;
+          return item.similarity <= results[index - 1].similarity;
+        });
+
+        if (!orderingValid) {
+          console.error('[EMBEDDINGS] CRITICAL: Similarity ordering is broken!');
+          results.forEach((item, idx) => {
+            console.error(`  ${idx}: ${item.name} = ${item.similarity.toFixed(4)}`);
+          });
+        }
+
+        console.log(`[EMBEDDINGS] Found ${results.length} similar items (threshold: ${threshold})`);
+        if (results.length > 0) {
+          console.log('[EMBEDDINGS] Top 10 similarity matches:');
+          results.slice(0, 10).forEach((item, idx) => {
+            console.log(`  ${idx + 1}. ${item.name} (${item.type}) = ${item.similarity.toFixed(4)}`);
+          });
+          
+          const topSimilarity = results[0].similarity;
+          const hasHigherSimilarity = results.some(item => item.similarity > topSimilarity);
+          if (hasHigherSimilarity) {
+            console.error('[EMBEDDINGS] CRITICAL: Top result is not actually the highest similarity!');
+          }
+        }
+
+        return results;
+
+      } else {
+        // Fallback: generate mock similarity results from actual tools data
+        console.log(`[EMBEDDINGS] No embeddings data, using fallback text matching: ${query}`);
+        
+        const { getToolsData } = await import('./dataService.js');
+        const toolsData = await getToolsData();
+        
+        const queryLower = query.toLowerCase();
+        const queryWords = queryLower.split(/\s+/).filter(w => w.length > 2);
+        
+        const similarities: SimilarityResult[] = toolsData.tools
+          .map((tool: any) => {
+            let similarity = 0;
+            
+            // Name matching
+            if (tool.name.toLowerCase().includes(queryLower)) {
+              similarity += 0.8;
+            }
+            
+            // Description matching
+            if (tool.description && tool.description.toLowerCase().includes(queryLower)) {
+              similarity += 0.6;
+            }
+            
+            // Tag matching
+            if (tool.tags && Array.isArray(tool.tags)) {
+              const matchingTags = tool.tags.filter((tag: string) => 
+                tag.toLowerCase().includes(queryLower) || queryLower.includes(tag.toLowerCase())
+              );
+              if (tool.tags.length > 0) {
+                similarity += (matchingTags.length / tool.tags.length) * 0.4;
+              }
+            }
+            
+            // Word-level matching
+            const toolText = `${tool.name} ${tool.description || ''} ${(tool.tags || []).join(' ')}`.toLowerCase();
+            const matchingWords = queryWords.filter(word => toolText.includes(word));
+            if (queryWords.length > 0) {
+              similarity += (matchingWords.length / queryWords.length) * 0.3;
+            }
+            
+            return {
+              id: `tool_${tool.name.replace(/[^a-zA-Z0-9]/g, '_').toLowerCase()}`,
+              type: 'tool' as const,
+              name: tool.name,
+              content: toolText,
+              embedding: [], // Empty for fallback
+              metadata: {
+                domains: tool.domains || [],
+                phases: tool.phases || [],
+                tags: tool.tags || [],
+                skillLevel: tool.skillLevel,
+                type: tool.type
+              },
+              similarity: Math.min(similarity, 1.0)
+            };
+          })
+          .filter(item => item.similarity >= threshold)
+          .sort((a, b) => b.similarity - a.similarity)
+          .slice(0, maxResults);
+
+        console.log(`[EMBEDDINGS] Fallback found ${similarities.length} similar items`);
+        return similarities;
+      }
 
     } catch (error) {
       console.error('[EMBEDDINGS] Failed to find similar items:', error);
@@ -315,26 +465,37 @@ class EmbeddingsService {
   }
 
   isEnabled(): boolean {
-    return this.enabled && this.isInitialized;
+    // If not enabled and not initialized, try re-checking environment
+    // This handles the case where environment variables loaded after initial check
+    if (!this.enabled && !this.isInitialized) {
+      // Don't await this, just trigger it and return current status
+      this.checkEnabledStatus().catch(console.error);
+    }
+    
+    return this.enabled;
   }
 
   getStats(): { enabled: boolean; initialized: boolean; count: number } {
     return {
-      enabled: this.enabled,
+      enabled: this.enabled, // Always true during development
       initialized: this.isInitialized,
       count: this.embeddings.length
     };
   }
 }
 
-
-
 const embeddingsService = new EmbeddingsService();
 
 export { embeddingsService, type EmbeddingData, type SimilarityResult };
 
-if (typeof window === 'undefined' && process.env.NODE_ENV !== 'test') {
+// Export utility functions for debugging
-  embeddingsService.initialize().catch(error => {
+export const debugEmbeddings = {
-    console.error('[EMBEDDINGS] Auto-initialization failed:', error);
+  async recheckEnvironment() {
-  });
+    return embeddingsService.forceRecheckEnvironment();
-}
+  },
+  getStatus() {
+    return embeddingsService.getStats();
+  }
+};
+
+// Remove auto-initialization - let it initialize lazily when first needed