Fix HTML string escaping in NB01 metrics cell

Use triple-quoted f-string and HTML entities (‘) instead of
raw single quotes inside single-quoted strings.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: abossard

notebooks/01_evaluation.ipynb

@@ -76,35 +76,38 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "# Level 1: Binary exact match (simplest)\n",
+    "# Metriken werden immer raffinierter\n",
     "from IPython.display import display, HTML\n",
     "from dspy_tasks.calculations import token_f1\n",
     "\n",
-    "f1_val = token_f1(['apple','banana'], ['apple','cherry'])\n",
+    "f1_val = token_f1([\"apple\", \"banana\"], [\"apple\", \"cherry\"])\n",
     "\n",
-    "display(HTML(\n",
-    "    '<div style=\"margin:8px 0\">'\n",
-    "    '<div style=\"padding:12px; background:#f3f2f1; border-radius:8px; margin-bottom:8px; border-left:4px solid #107c10\">'\n",
-    "    '<b style=\"font-size:1.05em\">Level 1: Exact Match</b>'\n",
-    "    '<div style=\"margin-top:6px; font-family:monospace; font-size:0.95em\">'\n",
-    "    '  'positive' == 'positive' → <span style=\"color:#107c10; font-weight:bold\">1.0</span><br>'\n",
-    "    '  'positive' == 'POSITIVE' → <span style=\"color:#107c10; font-weight:bold\">1.0</span>  <span style=\"color:#605e5c\">(normalized)</span><br>'\n",
-    "    '  'positive' == 'negative' → <span style=\"color:#d13438; font-weight:bold\">0.0</span></div></div>'\n",
-    "    '<div style=\"padding:12px; background:#f3f2f1; border-radius:8px; margin-bottom:8px; border-left:4px solid #0078d4\">'\n",
-    "    '<b style=\"font-size:1.05em\">Level 2: Token F1</b>'\n",
-    "    f'<div style=\"margin-top:6px; font-family:monospace; font-size:0.95em\">'\n",
-    "    f'  gold=['apple','banana'], pred=['apple','cherry'] → <span style=\"color:#0078d4; font-weight:bold\">{f1_val:.3f}</span></div></div>'\n",
-    "    '<div style=\"padding:12px; background:#f3f2f1; border-radius:8px; border-left:4px solid #8764b8\">'\n",
-    "    '<b style=\"font-size:1.05em\">Level 3: Composite (ticket routing)</b>'\n",
-    "    '<div style=\"margin-top:6px; font-size:0.95em\">'\n",
-    "    '  Priority correct (<b>40%</b>) + Category correct (<b>35%</b>) + Team correct (<b>25%</b>)<br>'\n",
-    "    '  = Weighted specification of \"what matters most\"</div></div></div>'\n",
-    "))\n",
+    "display(HTML(f\"\"\"\n",
+    "<div style=\"margin:8px 0\">\n",
+    "<div style=\"padding:12px; background:#f3f2f1; border-radius:8px; margin-bottom:8px; border-left:4px solid #107c10\">\n",
+    "<b style=\"font-size:1.05em\">Level 1: Exact Match</b>\n",
+    "<div style=\"margin-top:6px; font-family:monospace; font-size:0.95em\">\n",
+    "  &lsquo;positive&rsquo; == &lsquo;positive&rsquo; &rarr; <span style='color:#107c10; font-weight:bold'>1.0</span><br>\n",
+    "  &lsquo;positive&rsquo; == &lsquo;POSITIVE&rsquo; &rarr; <span style='color:#107c10; font-weight:bold'>1.0</span> <span style='color:#605e5c'>(normalized)</span><br>\n",
+    "  &lsquo;positive&rsquo; == &lsquo;negative&rsquo; &rarr; <span style='color:#d13438; font-weight:bold'>0.0</span>\n",
+    "</div></div>\n",
+    "<div style=\"padding:12px; background:#f3f2f1; border-radius:8px; margin-bottom:8px; border-left:4px solid #0078d4\">\n",
+    "<b style=\"font-size:1.05em\">Level 2: Token F1</b>\n",
+    "<div style=\"margin-top:6px; font-family:monospace; font-size:0.95em\">\n",
+    "  gold=[&lsquo;apple&rsquo;, &lsquo;banana&rsquo;], pred=[&lsquo;apple&rsquo;, &lsquo;cherry&rsquo;] &rarr; <span style='color:#0078d4; font-weight:bold'>{f1_val:.3f}</span>\n",
+    "</div></div>\n",
+    "<div style=\"padding:12px; background:#f3f2f1; border-radius:8px; border-left:4px solid #8764b8\">\n",
+    "<b style=\"font-size:1.05em\">Level 3: Composite (Ticket Routing)</b>\n",
+    "<div style=\"margin-top:6px; font-size:0.95em\">\n",
+    "  Priority korrekt (<b>40%</b>) + Kategorie korrekt (<b>35%</b>) + Team korrekt (<b>25%</b>)<br>\n",
+    "  = Gewichtete Spezifikation von &ldquo;was am wichtigsten ist&rdquo;\n",
+    "</div></div></div>\n",
+    "\"\"\"))\n",
     "\n",
     "display_insight(\"Der Kern-Insight\",\n",
     "    \"Deine Metrik-Funktion IST deine Produkt-Spezifikation. \"\n",
     "    \"Wenn du die Gewichte änderst, änderst du, wofür das System optimiert. \"\n",
-    "    \"Deshalb ist 'Evaluation die Software der Zukunft'.\")"
+    "    \"Deshalb ist Evaluation die Software der Zukunft.\")\n"
    ]
   },
   {