Show violation details in flagged response banner

Banner previously showed only the metric name. Now shows the detail
string per failed metric (e.g. "'price update' → should be 'pricing sync'").

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

ui/app.js

@@ -151,9 +151,13 @@ function appendBotMessage(data) {
     .filter(([, m]) => !m.passed)
     .map(([k]) => METRIC_LABELS[k] || k)
     .join(', ');
+  const failedDetails = Object.entries(data.evaluation.metrics)
+    .filter(([, m]) => !m.passed)
+    .map(([k, m]) => `<strong>${METRIC_LABELS[k] || k}:</strong> ${escapeHtml(m.detail)}`)
+    .join('<br>');
   const verdictLabel = overall ? '✓ All checks passed' : `✗ Failed: ${failedNames}`;
   const flagBanner = data.flagged
-    ? `<div class="flagged-banner">⚠ Response flagged — ${failedNames}</div>`
+    ? `<div class="flagged-banner">⚠ Response flagged<br>${failedDetails}</div>`
     : '';
 
   const el = document.createElement('div');