Align table styling with bar chart: white background, #ddd borders

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

Author: jordimas

asr/table_template.jinja

@@ -1,4 +1,10 @@
-<table style="border-collapse: collapse; width: auto;">
+<style>
+  .eval-table { border-collapse: collapse; width: auto; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 13px; color: #222; background: #fff; }
+  .eval-table th { background: #fff; border: 1px solid #ddd; padding: 7px 12px; font-weight: 600; color: #1a1a1a; text-align: left; }
+  .eval-table td { border: 1px solid #ddd; padding: 6px 12px; background: #fff; }
+  .eval-table tbody tr:hover td { background: #f9f9f9; }
+</style>
+<table class="eval-table">
 <thead>
 <tr>
 <th>Model</th>

llm/table_template.jinja

@@ -1,4 +1,10 @@
-<table style="border-collapse: collapse; width: auto;">
+<style>
+  .eval-table { border-collapse: collapse; width: auto; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 13px; color: #222; background: #fff; }
+  .eval-table th { background: #fff; border: 1px solid #ddd; padding: 7px 12px; font-weight: 600; color: #1a1a1a; text-align: left; }
+  .eval-table td { border: 1px solid #ddd; padding: 6px 12px; background: #fff; }
+  .eval-table tbody tr:hover td { background: #f9f9f9; }
+</style>
+<table class="eval-table">
 <thead>
 <tr>
 <th>Model</th>