UI Overhaul: Premium Slate Aesthetic, Tabbed Interface, and Grid Refinements

data/gpt5.4-judge-all-scores.json

@@ -1,13 +1,4 @@
 {
-  "o3-2025-04-16": {
-    "comprehension_score": 7.389285714285714,
-    "structure_score": 7.417857142857143,
-    "prose_style_score": 7.575,
-    "creativity_score": 7.564285714285714,
-    "depth_score": 7.196428571428571,
-    "helpfulness_score": 7.357142857142857,
-    "overall_score": 7.307142857142857
-  },
   "Deepseek-R1-0528": {
     "comprehension_score": 7.146428571428571,
     "structure_score": 7.0964285714285715,
@@ -26,32 +17,14 @@
     "helpfulness_score": 6.364285714285714,
     "overall_score": 6.457142857142857
   },
-  "Qwen3-235B-Thinking": {
-    "comprehension_score": 6.4071428571428575,
-    "structure_score": 6.446428571428571,
-    "prose_style_score": 7.2214285714285715,
-    "creativity_score": 7.75,
-    "depth_score": 6.739285714285714,
-    "helpfulness_score": 6.239285714285714,
-    "overall_score": 6.517857142857143
-  },
-  "Qwen3-32B-Thinking": {
-    "comprehension_score": 6.457142857142857,
-    "structure_score": 6.4714285714285715,
-    "prose_style_score": 7.128571428571429,
-    "creativity_score": 7.525,
-    "depth_score": 6.614285714285714,
-    "helpfulness_score": 6.317857142857143,
-    "overall_score": 6.546428571428572
-  },
-  "Qwen3-30B-A3B-Thinking": {
-    "comprehension_score": 5.964285714285714,
-    "structure_score": 6.110714285714286,
-    "prose_style_score": 6.521428571428571,
-    "creativity_score": 6.8428571428571425,
-    "depth_score": 5.985714285714286,
-    "helpfulness_score": 5.882142857142857,
-    "overall_score": 6.010714285714286
+  "GLM-5": {
+    "comprehension_score": 7.103571428571429,
+    "structure_score": 7.182142857142857,
+    "prose_style_score": 7.114285714285714,
+    "creativity_score": 7.185714285714286,
+    "depth_score": 6.964285714285714,
+    "helpfulness_score": 7.146428571428571,
+    "overall_score": 7.042857142857143
   },
   "Gemini-2.5-Flash": {
     "comprehension_score": 6.503571428571429,
@@ -62,6 +35,69 @@
     "helpfulness_score": 6.428571428571429,
     "overall_score": 6.2785714285714285
   },
+  "Gemini-3.1-Flash": {
+    "comprehension_score": 7.0964285714285715,
+    "structure_score": 7.232142857142857,
+    "prose_style_score": 7.317857142857143,
+    "creativity_score": 7.417857142857143,
+    "depth_score": 7.053571428571429,
+    "helpfulness_score": 7.185714285714286,
+    "overall_score": 7.117857142857143
+  },
+  "Gemini-3.1-Pro": {
+    "comprehension_score": 7.510714285714286,
+    "structure_score": 7.5321428571428575,
+    "prose_style_score": 7.5285714285714285,
+    "creativity_score": 7.614285714285714,
+    "depth_score": 7.321428571428571,
+    "helpfulness_score": 7.65,
+    "overall_score": 7.460714285714285
+  },
+  "MiniMax-M2.5": {
+    "comprehension_score": 6.292857142857143,
+    "structure_score": 6.442857142857143,
+    "prose_style_score": 5.614285714285714,
+    "creativity_score": 6.171428571428572,
+    "depth_score": 5.975,
+    "helpfulness_score": 6.242857142857143,
+    "overall_score": 6.071428571428571
+  },
+  "Mistral-3.1-24B-2503": {
+    "comprehension_score": 4.303571428571429,
+    "structure_score": 4.521428571428571,
+    "prose_style_score": 3.6857142857142855,
+    "creativity_score": 3.9642857142857144,
+    "depth_score": 3.8285714285714287,
+    "helpfulness_score": 4.021428571428571,
+    "overall_score": 3.9214285714285713
+  },
+  "Mistral-3.2-24B-2506": {
+    "comprehension_score": 5.475,
+    "structure_score": 5.746428571428571,
+    "prose_style_score": 5.35,
+    "creativity_score": 5.885714285714286,
+    "depth_score": 5.214285714285714,
+    "helpfulness_score": 5.3464285714285715,
+    "overall_score": 5.335714285714285
+  },
+  "Phi-4-14B": {
+    "comprehension_score": 4.2785714285714285,
+    "structure_score": 4.514285714285714,
+    "prose_style_score": 3.7714285714285714,
+    "creativity_score": 4.310714285714286,
+    "depth_score": 4.0285714285714285,
+    "helpfulness_score": 4.017857142857143,
+    "overall_score": 3.9857142857142858
+  },
+  "Qwen3.5-Plus": {
+    "comprehension_score": 7.228571428571429,
+    "structure_score": 7.3,
+    "prose_style_score": 7.232142857142857,
+    "creativity_score": 7.353571428571429,
+    "depth_score": 7.196428571428571,
+    "helpfulness_score": 7.289285714285715,
+    "overall_score": 7.189285714285714
+  },
   "Qwen3-235B": {
     "comprehension_score": 5.896428571428571,
     "structure_score": 6.2,
@@ -71,6 +107,33 @@
     "helpfulness_score": 5.8464285714285715,
     "overall_score": 5.767857142857143
   },
+  "Qwen3-235B-Thinking": {
+    "comprehension_score": 6.4071428571428575,
+    "structure_score": 6.446428571428571,
+    "prose_style_score": 7.2214285714285715,
+    "creativity_score": 7.75,
+    "depth_score": 6.739285714285714,
+    "helpfulness_score": 6.239285714285714,
+    "overall_score": 6.517857142857143
+  },
+  "Qwen3-30B-A3B": {
+    "comprehension_score": 4.953571428571428,
+    "structure_score": 5.2214285714285715,
+    "prose_style_score": 4.6,
+    "creativity_score": 4.7785714285714285,
+    "depth_score": 4.521428571428571,
+    "helpfulness_score": 4.760714285714286,
+    "overall_score": 4.65
+  },
+  "Qwen3-30B-A3B-Thinking": {
+    "comprehension_score": 5.964285714285714,
+    "structure_score": 6.110714285714286,
+    "prose_style_score": 6.521428571428571,
+    "creativity_score": 6.8428571428571425,
+    "depth_score": 5.985714285714286,
+    "helpfulness_score": 5.882142857142857,
+    "overall_score": 6.010714285714286
+  },
   "Qwen3-32B": {
     "comprehension_score": 5.303571428571429,
     "structure_score": 5.582142857142857,
@@ -80,6 +143,15 @@
     "helpfulness_score": 5.117857142857143,
     "overall_score": 5.042857142857143
   },
+  "Qwen3-32B-Thinking": {
+    "comprehension_score": 6.457142857142857,
+    "structure_score": 6.4714285714285715,
+    "prose_style_score": 7.128571428571429,
+    "creativity_score": 7.525,
+    "depth_score": 6.614285714285714,
+    "helpfulness_score": 6.317857142857143,
+    "overall_score": 6.546428571428572
+  },
   "Qwen3-8B": {
     "comprehension_score": 4.860714285714286,
     "structure_score": 5.0928571428571425,
@@ -89,15 +161,6 @@
     "helpfulness_score": 4.639285714285714,
     "overall_score": 4.560714285714286
   },
-  "Qwen3-30B-A3B": {
-    "comprehension_score": 4.953571428571428,
-    "structure_score": 5.2214285714285715,
-    "prose_style_score": 4.6,
-    "creativity_score": 4.7785714285714285,
-    "depth_score": 4.521428571428571,
-    "helpfulness_score": 4.760714285714286,
-    "overall_score": 4.65
-  },
   "gemma3-27b": {
     "comprehension_score": 5.164285714285715,
     "structure_score": 5.364285714285714,
@@ -107,32 +170,14 @@
     "helpfulness_score": 4.992857142857143,
     "overall_score": 4.814285714285714
   },
-  "Phi-4-14B": {
-    "comprehension_score": 4.2785714285714285,
-    "structure_score": 4.514285714285714,
-    "prose_style_score": 3.7714285714285714,
-    "creativity_score": 4.310714285714286,
-    "depth_score": 4.0285714285714285,
-    "helpfulness_score": 4.017857142857143,
-    "overall_score": 3.9857142857142858
-  },
-  "Mistral-3.2-24B-2506": {
-    "comprehension_score": 5.475,
-    "structure_score": 5.746428571428571,
-    "prose_style_score": 5.35,
-    "creativity_score": 5.885714285714286,
-    "depth_score": 5.214285714285714,
-    "helpfulness_score": 5.3464285714285715,
-    "overall_score": 5.335714285714285
-  },
-  "Mistral-3.1-24B-2503": {
-    "comprehension_score": 4.303571428571429,
-    "structure_score": 4.521428571428571,
-    "prose_style_score": 3.6857142857142855,
-    "creativity_score": 3.9642857142857144,
-    "depth_score": 3.8285714285714287,
-    "helpfulness_score": 4.021428571428571,
-    "overall_score": 3.9214285714285713
+  "gpt-4.1-mini-2025-04-14": {
+    "comprehension_score": 4.8,
+    "structure_score": 4.746428571428571,
+    "prose_style_score": 4.339285714285714,
+    "creativity_score": 4.489285714285714,
+    "depth_score": 4.275,
+    "helpfulness_score": 4.389285714285714,
+    "overall_score": 4.35
   },
   "gpt-4o-2024-11-20": {
     "comprehension_score": 5.275,
@@ -143,15 +188,6 @@
     "helpfulness_score": 4.957142857142857,
     "overall_score": 4.985714285714286
   },
-  "gpt-4.1-mini-2025-04-14": {
-    "comprehension_score": 4.8,
-    "structure_score": 4.746428571428571,
-    "prose_style_score": 4.339285714285714,
-    "creativity_score": 4.489285714285714,
-    "depth_score": 4.275,
-    "helpfulness_score": 4.389285714285714,
-    "overall_score": 4.35
-  },
   "gpt-4o-mini-2024-07-18": {
     "comprehension_score": 4.417857142857143,
     "structure_score": 4.575,
@@ -161,15 +197,6 @@
     "helpfulness_score": 4.139285714285714,
     "overall_score": 4.15
   },
-  "o4-mini-2025-04-16": {
-    "comprehension_score": 5.803571428571429,
-    "structure_score": 5.864285714285714,
-    "prose_style_score": 5.428571428571429,
-    "creativity_score": 5.760714285714286,
-    "depth_score": 5.310714285714286,
-    "helpfulness_score": 5.617857142857143,
-    "overall_score": 5.557142857142857
-  },
   "gpt-5.4": {
     "comprehension_score": 7.4678571428571425,
     "structure_score": 7.517857142857143,
@@ -179,41 +206,23 @@
     "helpfulness_score": 7.664285714285715,
     "overall_score": 7.421428571428572
   },
-  "Gemini-3.1-Flash": {
-    "comprehension_score": 7.0964285714285715,
-    "structure_score": 7.232142857142857,
-    "prose_style_score": 7.317857142857143,
-    "creativity_score": 7.417857142857143,
-    "depth_score": 7.053571428571429,
-    "helpfulness_score": 7.185714285714286,
-    "overall_score": 7.117857142857143
-  },
-  "Gemini-3.1-Pro": {
-    "comprehension_score": 7.510714285714286,
-    "structure_score": 7.5321428571428575,
-    "prose_style_score": 7.5285714285714285,
-    "creativity_score": 7.614285714285714,
-    "depth_score": 7.321428571428571,
-    "helpfulness_score": 7.65,
-    "overall_score": 7.460714285714285
-  },
-  "MiniMax-M2.5": {
-    "comprehension_score": 6.292857142857143,
-    "structure_score": 6.442857142857143,
-    "prose_style_score": 5.614285714285714,
-    "creativity_score": 6.171428571428572,
-    "depth_score": 5.975,
-    "helpfulness_score": 6.242857142857143,
-    "overall_score": 6.071428571428571
-  },
-  "Qwen3.5-Plus": {
-    "comprehension_score": 7.228571428571429,
-    "structure_score": 7.3,
-    "prose_style_score": 7.232142857142857,
-    "creativity_score": 7.353571428571429,
+  "o3-2025-04-16": {
+    "comprehension_score": 7.389285714285714,
+    "structure_score": 7.417857142857143,
+    "prose_style_score": 7.575,
+    "creativity_score": 7.564285714285714,
     "depth_score": 7.196428571428571,
-    "helpfulness_score": 7.289285714285715,
-    "overall_score": 7.189285714285714
+    "helpfulness_score": 7.357142857142857,
+    "overall_score": 7.307142857142857
+  },
+  "o4-mini-2025-04-16": {
+    "comprehension_score": 5.803571428571429,
+    "structure_score": 5.864285714285714,
+    "prose_style_score": 5.428571428571429,
+    "creativity_score": 5.760714285714286,
+    "depth_score": 5.310714285714286,
+    "helpfulness_score": 5.617857142857143,
+    "overall_score": 5.557142857142857
   },
   "step-3.5-flash": {
     "comprehension_score": 7.285714285714286,
@@ -224,13 +233,13 @@
     "helpfulness_score": 7.2178571428571425,
     "overall_score": 7.253571428571429
   },
-  "GLM-5": {
-    "comprehension_score": 7.103571428571429,
-    "structure_score": 7.182142857142857,
-    "prose_style_score": 7.114285714285714,
-    "creativity_score": 7.185714285714286,
-    "depth_score": 6.964285714285714,
-    "helpfulness_score": 7.146428571428571,
-    "overall_score": 7.042857142857143
+  "gpt-4.1-2025-04-14": {
+    "comprehension_score": 5.0,
+    "structure_score": 5.0,
+    "prose_style_score": 5.0,
+    "creativity_score": 5.0,
+    "depth_score": 5.0,
+    "helpfulness_score": 5.0,
+    "overall_score": 5.0
   }
 }

data/gpt5.4-judge-complicated-writing-scores.json

@@ -1,236 +1,245 @@
 {
-  "o3-2025-04-16": {
-    "comprehension_score": 7.5,
-    "structure_score": 7.541176470588235,
-    "prose_style_score": 7.788235294117647,
-    "creativity_score": 7.688235294117647,
-    "depth_score": 7.358823529411764,
-    "helpfulness_score": 7.476470588235294,
-    "overall_score": 7.4411764705882355
-  },
   "Deepseek-R1-0528": {
-    "comprehension_score": 7.070588235294117,
-    "structure_score": 7.0,
-    "prose_style_score": 7.352941176470588,
-    "creativity_score": 7.647058823529412,
-    "depth_score": 7.341176470588235,
-    "helpfulness_score": 6.923529411764706,
-    "overall_score": 7.105882352941176
+    "comprehension_score": 7.481132075471698,
+    "structure_score": 7.339622641509434,
+    "prose_style_score": 7.59433962264151,
+    "creativity_score": 8.018867924528301,
+    "depth_score": 7.688679245283019,
+    "helpfulness_score": 7.367924528301887,
+    "overall_score": 7.5
   },
   "Deepseek-V3-0324": {
-    "comprehension_score": 6.188235294117647,
-    "structure_score": 6.3,
-    "prose_style_score": 6.758823529411765,
-    "creativity_score": 7.0588235294117645,
-    "depth_score": 6.223529411764706,
-    "helpfulness_score": 6.035294117647059,
-    "overall_score": 6.223529411764706
+    "comprehension_score": 6.39622641509434,
+    "structure_score": 6.386792452830188,
+    "prose_style_score": 6.9245283018867925,
+    "creativity_score": 7.367924528301887,
+    "depth_score": 6.311320754716981,
+    "helpfulness_score": 6.216981132075472,
+    "overall_score": 6.367924528301887
   },
-  "Qwen3-235B-Thinking": {
-    "comprehension_score": 6.376470588235295,
-    "structure_score": 6.252941176470588,
-    "prose_style_score": 7.435294117647059,
-    "creativity_score": 7.829411764705882,
-    "depth_score": 6.7176470588235295,
-    "helpfulness_score": 6.176470588235294,
-    "overall_score": 6.517647058823529
+  "GLM-5": {
+    "comprehension_score": 7.4245283018867925,
+    "structure_score": 7.518867924528302,
+    "prose_style_score": 7.320754716981132,
+    "creativity_score": 7.433962264150943,
+    "depth_score": 7.254716981132075,
+    "helpfulness_score": 7.443396226415095,
+    "overall_score": 7.330188679245283
   },
-  "Qwen3-32B-Thinking": {
-    "comprehension_score": 6.3882352941176475,
-    "structure_score": 6.323529411764706,
-    "prose_style_score": 7.323529411764706,
-    "creativity_score": 7.570588235294117,
-    "depth_score": 6.523529411764706,
-    "helpfulness_score": 6.258823529411765,
-    "overall_score": 6.523529411764706
+  "Gemini-2.5-Flash": {
+    "comprehension_score": 6.4245283018867925,
+    "structure_score": 6.490566037735849,
+    "prose_style_score": 5.773584905660377,
+    "creativity_score": 5.990566037735849,
+    "depth_score": 6.018867924528302,
+    "helpfulness_score": 6.339622641509434,
+    "overall_score": 6.09433962264151
   },
-  "Qwen3-30B-A3B-Thinking": {
-    "comprehension_score": 5.823529411764706,
-    "structure_score": 5.952941176470588,
-    "prose_style_score": 6.570588235294117,
-    "creativity_score": 6.829411764705882,
-    "depth_score": 5.7823529411764705,
-    "helpfulness_score": 5.735294117647059,
-    "overall_score": 5.876470588235295
+  "Gemini-3.1-Flash": {
+    "comprehension_score": 7.415094339622642,
+    "structure_score": 7.471698113207547,
+    "prose_style_score": 7.632075471698113,
+    "creativity_score": 7.669811320754717,
+    "depth_score": 7.2924528301886795,
+    "helpfulness_score": 7.433962264150943,
+    "overall_score": 7.40566037735849
   },
-  "Gemini-2.5-Flash": {
-    "comprehension_score": 6.429411764705883,
-    "structure_score": 6.482352941176471,
-    "prose_style_score": 5.847058823529411,
-    "creativity_score": 6.147058823529412,
-    "depth_score": 6.094117647058823,
-    "helpfulness_score": 6.2823529411764705,
-    "overall_score": 6.147058823529412
+  "Gemini-3.1-Pro": {
+    "comprehension_score": 7.830188679245283,
+    "structure_score": 7.764150943396227,
+    "prose_style_score": 7.811320754716981,
+    "creativity_score": 8.037735849056604,
+    "depth_score": 7.688679245283019,
+    "helpfulness_score": 7.962264150943396,
+    "overall_score": 7.745283018867925
   },
-  "Qwen3-235B": {
-    "comprehension_score": 5.788235294117647,
-    "structure_score": 6.070588235294117,
-    "prose_style_score": 5.511764705882353,
-    "creativity_score": 5.647058823529412,
-    "depth_score": 5.4,
-    "helpfulness_score": 5.623529411764705,
-    "overall_score": 5.58235294117647
+  "MiniMax-M2.5": {
+    "comprehension_score": 6.1415094339622645,
+    "structure_score": 6.39622641509434,
+    "prose_style_score": 5.377358490566038,
+    "creativity_score": 6.066037735849057,
+    "depth_score": 5.688679245283019,
+    "helpfulness_score": 6.10377358490566,
+    "overall_score": 5.849056603773585
   },
-  "Qwen3-32B": {
-    "comprehension_score": 5.117647058823529,
-    "structure_score": 5.364705882352941,
-    "prose_style_score": 4.694117647058824,
-    "creativity_score": 4.982352941176471,
-    "depth_score": 4.647058823529412,
-    "helpfulness_score": 4.794117647058823,
-    "overall_score": 4.729411764705882
+  "Mistral-3.1-24B-2503": {
+    "comprehension_score": 4.1415094339622645,
+    "structure_score": 4.386792452830188,
+    "prose_style_score": 3.30188679245283,
+    "creativity_score": 3.650943396226415,
+    "depth_score": 3.518867924528302,
+    "helpfulness_score": 3.8679245283018866,
+    "overall_score": 3.7264150943396226
   },
-  "Qwen3-8B": {
-    "comprehension_score": 4.6647058823529415,
-    "structure_score": 4.870588235294117,
-    "prose_style_score": 4.2823529411764705,
-    "creativity_score": 4.5,
-    "depth_score": 4.241176470588235,
-    "helpfulness_score": 4.347058823529411,
-    "overall_score": 4.3
+  "Mistral-3.2-24B-2506": {
+    "comprehension_score": 5.169811320754717,
+    "structure_score": 5.311320754716981,
+    "prose_style_score": 4.89622641509434,
+    "creativity_score": 5.688679245283019,
+    "depth_score": 4.745283018867925,
+    "helpfulness_score": 4.981132075471698,
+    "overall_score": 4.89622641509434
+  },
+  "Phi-4-14B": {
+    "comprehension_score": 4.245283018867925,
+    "structure_score": 4.40566037735849,
+    "prose_style_score": 3.5754716981132075,
+    "creativity_score": 4.0754716981132075,
+    "depth_score": 3.707547169811321,
+    "helpfulness_score": 4.009433962264151,
+    "overall_score": 3.858490566037736
+  },
+  "Qwen3.5-Plus": {
+    "comprehension_score": 7.632075471698113,
+    "structure_score": 7.745283018867925,
+    "prose_style_score": 7.754716981132075,
+    "creativity_score": 7.716981132075472,
+    "depth_score": 7.622641509433962,
+    "helpfulness_score": 7.632075471698113,
+    "overall_score": 7.556603773584905
+  },
+  "Qwen3-235B": {
+    "comprehension_score": 5.773584905660377,
+    "structure_score": 6.113207547169812,
+    "prose_style_score": 5.433962264150943,
+    "creativity_score": 5.745283018867925,
+    "depth_score": 5.226415094339623,
+    "helpfulness_score": 5.679245283018868,
+    "overall_score": 5.566037735849057
+  },
+  "Qwen3-235B-Thinking": {
+    "comprehension_score": 6.179245283018868,
+    "structure_score": 6.1415094339622645,
+    "prose_style_score": 7.490566037735849,
+    "creativity_score": 8.056603773584905,
+    "depth_score": 6.69811320754717,
+    "helpfulness_score": 6.084905660377358,
+    "overall_score": 6.39622641509434
   },
   "Qwen3-30B-A3B": {
-    "comprehension_score": 4.805882352941176,
-    "structure_score": 4.988235294117647,
-    "prose_style_score": 4.405882352941177,
-    "creativity_score": 4.617647058823529,
-    "depth_score": 4.364705882352941,
-    "helpfulness_score": 4.523529411764706,
-    "overall_score": 4.429411764705883
+    "comprehension_score": 4.7075471698113205,
+    "structure_score": 5.10377358490566,
+    "prose_style_score": 4.179245283018868,
+    "creativity_score": 4.547169811320755,
+    "depth_score": 4.245283018867925,
+    "helpfulness_score": 4.471698113207547,
+    "overall_score": 4.330188679245283
   },
-  "gemma3-27b": {
-    "comprehension_score": 5.070588235294117,
-    "structure_score": 5.241176470588235,
-    "prose_style_score": 4.470588235294118,
-    "creativity_score": 5.011764705882353,
-    "depth_score": 4.58235294117647,
-    "helpfulness_score": 4.817647058823529,
-    "overall_score": 4.6647058823529415
+  "Qwen3-30B-A3B-Thinking": {
+    "comprehension_score": 5.867924528301887,
+    "structure_score": 6.009433962264151,
+    "prose_style_score": 6.584905660377358,
+    "creativity_score": 7.122641509433962,
+    "depth_score": 6.009433962264151,
+    "helpfulness_score": 5.811320754716981,
+    "overall_score": 5.943396226415095
   },
-  "Phi-4-14B": {
-    "comprehension_score": 4.235294117647059,
-    "structure_score": 4.529411764705882,
-    "prose_style_score": 3.652941176470588,
-    "creativity_score": 4.258823529411765,
-    "depth_score": 4.023529411764706,
-    "helpfulness_score": 4.017647058823529,
-    "overall_score": 3.9647058823529413
+  "Qwen3-32B": {
+    "comprehension_score": 5.037735849056604,
+    "structure_score": 5.30188679245283,
+    "prose_style_score": 4.518867924528302,
+    "creativity_score": 5.018867924528302,
+    "depth_score": 4.5754716981132075,
+    "helpfulness_score": 4.754716981132075,
+    "overall_score": 4.688679245283019
   },
-  "Mistral-3.2-24B-2506": {
-    "comprehension_score": 5.3352941176470585,
-    "structure_score": 5.570588235294117,
-    "prose_style_score": 5.188235294117647,
-    "creativity_score": 5.7176470588235295,
-    "depth_score": 5.047058823529412,
-    "helpfulness_score": 5.147058823529412,
-    "overall_score": 5.147058823529412
+  "Qwen3-32B-Thinking": {
+    "comprehension_score": 6.377358490566038,
+    "structure_score": 6.273584905660377,
+    "prose_style_score": 7.3584905660377355,
+    "creativity_score": 7.886792452830188,
+    "depth_score": 6.60377358490566,
+    "helpfulness_score": 6.2924528301886795,
+    "overall_score": 6.5
   },
-  "Mistral-3.1-24B-2503": {
-    "comprehension_score": 4.276470588235294,
-    "structure_score": 4.523529411764706,
-    "prose_style_score": 3.523529411764706,
-    "creativity_score": 3.9411764705882355,
-    "depth_score": 3.8117647058823527,
-    "helpfulness_score": 4.029411764705882,
-    "overall_score": 3.9058823529411764
+  "Qwen3-8B": {
+    "comprehension_score": 4.613207547169812,
+    "structure_score": 4.811320754716981,
+    "prose_style_score": 4.216981132075472,
+    "creativity_score": 4.528301886792453,
+    "depth_score": 4.169811320754717,
+    "helpfulness_score": 4.433962264150943,
+    "overall_score": 4.311320754716981
   },
-  "gpt-4o-2024-11-20": {
-    "comprehension_score": 5.223529411764706,
-    "structure_score": 5.176470588235294,
-    "prose_style_score": 4.882352941176471,
-    "creativity_score": 5.211764705882353,
-    "depth_score": 4.788235294117647,
-    "helpfulness_score": 4.852941176470588,
-    "overall_score": 4.858823529411764
+  "gemma3-27b": {
+    "comprehension_score": 4.90566037735849,
+    "structure_score": 5.113207547169812,
+    "prose_style_score": 4.047169811320755,
+    "creativity_score": 4.7075471698113205,
+    "depth_score": 4.30188679245283,
+    "helpfulness_score": 4.632075471698113,
+    "overall_score": 4.367924528301887
   },
   "gpt-4.1-mini-2025-04-14": {
-    "comprehension_score": 4.7,
-    "structure_score": 4.694117647058824,
-    "prose_style_score": 4.247058823529412,
-    "creativity_score": 4.405882352941177,
-    "depth_score": 4.176470588235294,
-    "helpfulness_score": 4.264705882352941,
-    "overall_score": 4.241176470588235
+    "comprehension_score": 4.69811320754717,
+    "structure_score": 4.613207547169812,
+    "prose_style_score": 4.179245283018868,
+    "creativity_score": 4.4245283018867925,
+    "depth_score": 4.160377358490566,
+    "helpfulness_score": 4.235849056603773,
+    "overall_score": 4.216981132075472
   },
-  "gpt-4o-mini-2024-07-18": {
-    "comprehension_score": 4.41764705882353,
-    "structure_score": 4.588235294117647,
-    "prose_style_score": 4.0,
-    "creativity_score": 4.329411764705882,
-    "depth_score": 4.076470588235294,
-    "helpfulness_score": 4.117647058823529,
-    "overall_score": 4.147058823529412
+  "gpt-4o-2024-11-20": {
+    "comprehension_score": 5.2075471698113205,
+    "structure_score": 5.216981132075472,
+    "prose_style_score": 4.877358490566038,
+    "creativity_score": 5.377358490566038,
+    "depth_score": 4.764150943396227,
+    "helpfulness_score": 4.8584905660377355,
+    "overall_score": 4.877358490566038
   },
-  "o4-mini-2025-04-16": {
-    "comprehension_score": 5.694117647058824,
-    "structure_score": 5.764705882352941,
-    "prose_style_score": 5.341176470588235,
-    "creativity_score": 5.623529411764705,
-    "depth_score": 5.152941176470589,
-    "helpfulness_score": 5.488235294117647,
-    "overall_score": 5.41764705882353
+  "gpt-4o-mini-2024-07-18": {
+    "comprehension_score": 4.2924528301886795,
+    "structure_score": 4.5,
+    "prose_style_score": 3.8773584905660377,
+    "creativity_score": 4.122641509433962,
+    "depth_score": 3.952830188679245,
+    "helpfulness_score": 4.0754716981132075,
+    "overall_score": 4.047169811320755
   },
   "gpt-5.4": {
-    "comprehension_score": 7.529411764705882,
-    "structure_score": 7.535294117647059,
-    "prose_style_score": 7.858823529411764,
-    "creativity_score": 7.3,
-    "depth_score": 7.7176470588235295,
-    "helpfulness_score": 7.5588235294117645,
-    "overall_score": 7.482352941176471
-  },
-  "Gemini-3.1-Flash": {
-    "comprehension_score": 7.041176470588235,
-    "structure_score": 7.1647058823529415,
-    "prose_style_score": 7.411764705882353,
-    "creativity_score": 7.294117647058823,
-    "depth_score": 7.0,
-    "helpfulness_score": 7.064705882352941,
-    "overall_score": 7.064705882352941
-  },
-  "Gemini-3.1-Pro": {
-    "comprehension_score": 7.511764705882353,
-    "structure_score": 7.5,
-    "prose_style_score": 7.682352941176471,
-    "creativity_score": 7.5,
-    "depth_score": 7.305882352941176,
-    "helpfulness_score": 7.552941176470588,
-    "overall_score": 7.452941176470588
+    "comprehension_score": 8.0,
+    "structure_score": 7.971698113207547,
+    "prose_style_score": 8.377358490566039,
+    "creativity_score": 7.830188679245283,
+    "depth_score": 8.216981132075471,
+    "helpfulness_score": 8.11320754716981,
+    "overall_score": 7.943396226415095
   },
-  "MiniMax-M2.5": {
-    "comprehension_score": 6.176470588235294,
-    "structure_score": 6.323529411764706,
-    "prose_style_score": 5.511764705882353,
-    "creativity_score": 6.011764705882353,
-    "depth_score": 5.788235294117647,
-    "helpfulness_score": 6.035294117647059,
-    "overall_score": 5.905882352941177
+  "o3-2025-04-16": {
+    "comprehension_score": 7.886792452830188,
+    "structure_score": 7.933962264150943,
+    "prose_style_score": 8.273584905660377,
+    "creativity_score": 8.160377358490566,
+    "depth_score": 7.764150943396227,
+    "helpfulness_score": 7.90566037735849,
+    "overall_score": 7.8584905660377355
   },
-  "Qwen3.5-Plus": {
-    "comprehension_score": 7.205882352941177,
-    "structure_score": 7.2823529411764705,
-    "prose_style_score": 7.41764705882353,
-    "creativity_score": 7.394117647058824,
-    "depth_score": 7.205882352941177,
-    "helpfulness_score": 7.229411764705882,
-    "overall_score": 7.2
+  "o4-mini-2025-04-16": {
+    "comprehension_score": 5.433962264150943,
+    "structure_score": 5.537735849056604,
+    "prose_style_score": 4.971698113207547,
+    "creativity_score": 5.5,
+    "depth_score": 4.8584905660377355,
+    "helpfulness_score": 5.150943396226415,
+    "overall_score": 5.056603773584905
   },
   "step-3.5-flash": {
-    "comprehension_score": 7.258823529411765,
-    "structure_score": 7.252941176470588,
-    "prose_style_score": 7.105882352941176,
-    "creativity_score": 7.8352941176470585,
-    "depth_score": 7.552941176470588,
-    "helpfulness_score": 7.1647058823529415,
-    "overall_score": 7.229411764705882
-  },
-  "GLM-5": {
-    "comprehension_score": 7.064705882352941,
-    "structure_score": 7.147058823529412,
-    "prose_style_score": 7.176470588235294,
-    "creativity_score": 7.1,
-    "depth_score": 6.8882352941176475,
-    "helpfulness_score": 7.064705882352941,
-    "overall_score": 7.011764705882353
+    "comprehension_score": 7.5754716981132075,
+    "structure_score": 7.59433962264151,
+    "prose_style_score": 7.481132075471698,
+    "creativity_score": 8.339622641509434,
+    "depth_score": 7.877358490566038,
+    "helpfulness_score": 7.490566037735849,
+    "overall_score": 7.547169811320755
+  },
+  "gpt-4.1-2025-04-14": {
+    "comprehension_score": 5.0,
+    "structure_score": 5.0,
+    "prose_style_score": 5.0,
+    "creativity_score": 5.0,
+    "depth_score": 5.0,
+    "helpfulness_score": 5.0,
+    "overall_score": 5.0
   }
 }

index.html

@@ -1,13 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Zhiyin</title>
-    <link rel="stylesheet" href="styles.css">
+    <link rel="stylesheet" href="styles.css?v=3">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
 </head>
+
 <body>
     <div class="container">
         <header class="header">
@@ -18,24 +20,29 @@
         <div class="dashboard card">
             <section class="overview-section">
                 <h2 class="section-title">
-                  <span class="accent-bar"></span>
-                  Benchmark Overview
-                  <span class="section-title-spacer"></span>
-                  <span class="external-links-text">
-                    <a href="https://github.com/zake7749/Chinese-Writing-Bench" target="_blank" rel="noopener" class="external-link-text">GitHub</a>
-                    <span class="divider">&bull;</span>
-                    <a href="https://huggingface.co/datasets/zake7749/chinese-writing-benchmark" target="_blank" rel="noopener" class="external-link-text">Hugging Face</a>
-                  </span>
+                    <span class="accent-bar"></span>
+                    Benchmark Overview
+                    <span class="section-title-spacer"></span>
+                    <span class="external-links-text">
+                        <a href="https://github.com/zake7749/Chinese-Writing-Bench" target="_blank" rel="noopener"
+                            class="external-link-text">GitHub</a>
+                        <span class="divider">&bull;</span>
+                        <a href="https://huggingface.co/datasets/zake7749/chinese-writing-benchmark" target="_blank"
+                            rel="noopener" class="external-link-text">Hugging Face</a>
+                    </span>
                 </h2>
                 <div class="overview-content">
                     <div class="overview-text">
                         <p>
-                          <strong>Zhiyin</strong> is an LLM-as-a-judge benchmark for Chinese writing evaluation, featuring 280 test cases across 18 diverse writing tasks in this V1 release.
+                            <strong>Zhiyin</strong> is an LLM-as-a-judge benchmark for Chinese writing evaluation,
+                            featuring 280 test cases across 18 diverse writing tasks in this V1 release.
                         </p>
                         <p>
-                            Our method relies on <strong>pairwise comparison</strong>. A powerful language model acts as the judge, scoring a model's response relative to a fixed baseline (GPT-4.1), which is anchored at a score of 5.
+                            Our method relies on <strong>pairwise comparison</strong>. A powerful language model acts as
+                            the judge, scoring a model's response relative to a fixed baseline (GPT-4.1), which is
+                            anchored at a score of 5.
                         </p>
-                
+
                         <h4>Scoring System</h4>
                         <p>The judge assigns the model's response an integer score from 0 to 10, where:</p>
                         <ul>
@@ -43,38 +50,58 @@
                             <li>A score = 5 indicates the response is <strong>on par</strong> with the baseline.</li>
                             <li>A score < 5 indicates the response is <strong>inferior</strong> to the baseline.</li>
                         </ul>
-                
+
                         <h4>Evaluation Dimensions</h4>
-                        <p>To ensure a comprehensive analysis, the final score is informed by a multi-dimensional assessment. The judge evaluates the response across six key criteria:</p>
+                        <p>To ensure a comprehensive analysis, the final score is informed by a multi-dimensional
+                            assessment. The judge evaluates the response across six key criteria:</p>
                         <ol>
-                            <li><strong>Comprehension & Relevance:</strong> How well the response understands the prompt's intent and stays on topic.</li>
-                            <li><strong>Structure & Coherence:</strong> How clear, logical, and well-organized the writing is.</li>
-                            <li><strong>Prose & Style:</strong> The quality of the language, grammar, and adherence to the requested tone.</li>
-                            <li><strong>Creativity & Originality:</strong> The novelty of the ideas and the uniqueness of the perspective.</li>
-                            <li><strong>Depth & Insight:</strong> The level of detail, analysis, and substance provided.</li>
-                            <li><strong>Helpfulness:</strong> How effectively the response fulfills the user's overall goal.</li>
+                            <li><strong>Comprehension & Relevance:</strong> How well the response understands the
+                                prompt's intent and stays on topic.</li>
+                            <li><strong>Structure & Coherence:</strong> How clear, logical, and well-organized the
+                                writing is.</li>
+                            <li><strong>Prose & Style:</strong> The quality of the language, grammar, and adherence to
+                                the requested tone.</li>
+                            <li><strong>Creativity & Originality:</strong> The novelty of the ideas and the uniqueness
+                                of the perspective.</li>
+                            <li><strong>Depth & Insight:</strong> The level of detail, analysis, and substance provided.
+                            </li>
+                            <li><strong>Helpfulness:</strong> How effectively the response fulfills the user's overall
+                                goal.</li>
                         </ol>
                     </div>
                 </div>
             </section>
 
-            <section class="judge-section">
-                <h2 class="section-title"><span class="accent-bar"></span>Judge Model</h2>
-                <div class="judge-toggle">
-                    <button class="judge-btn active" data-judge="o3">O3</button>
-                    <button class="judge-btn" data-judge="gpt5.4">GPT-5.4</button>
+            <section class="dashboard-controls">
+                <div class="controls-header">
+                    <div class="judge-selector">
+                        <span class="control-label">Judge Model</span>
+                        <div class="judge-toggle">
+                            <button class="judge-btn active" data-judge="gpt5.4">GPT-5.4</button>
+                            <button class="judge-btn" data-judge="o3">O3</button>
+                        </div>
+                    </div>
+                    <div class="search-container">
+                        <i class="fas fa-search search-icon"></i>
+                        <input type="text" id="globalSearch" class="search-input" placeholder="Search models...">
+                    </div>
+                </div>
+
+                <div class="tabs-container">
+                    <div class="tabs-header">
+                        <button class="tab-btn active" data-target="generalTableSection">All Writing Tasks</button>
+                        <button class="tab-btn" data-target="complicatedTableSection">Complicated Writing Tasks</button>
+                    </div>
                 </div>
             </section>
 
-            <section class="table-section">
-                <h2 class="section-title"><span class="accent-bar"></span>All Writing Tasks</h2>
+            <section class="tab-content active" id="generalTableSection">
                 <div id="generalTable" class="table-container">
                     <!-- General Writing table will be populated here -->
                 </div>
             </section>
 
-            <section class="table-section">
-                <h2 class="section-title"><span class="accent-bar"></span>Complicated Writing Tasks</h2>
+            <section class="tab-content" id="complicatedTableSection">
                 <div id="complicatedTable" class="table-container">
                     <!-- Complicated Writing table will be populated here -->
                 </div>
@@ -85,7 +112,8 @@
                 <div class="citation-content">
                     <p>
                         If you use these results, please cite our paper:<br>
-                        <em>"Zhiyin: Exploring the Frontier of Chinese LLM Writing, 2025. https://github.com/zake7749/Chinese-Writing-Bench"</em>
+                        <em>"Zhiyin: Exploring the Frontier of Chinese LLM Writing, 2025.
+                            https://github.com/zake7749/Chinese-Writing-Bench"</em>
                     </p>
                 </div>
             </section>
@@ -98,4 +126,5 @@
     </div>
     <script src="script.js"></script>
 </body>
-</html> 
+
+</html>

script.js

@@ -1,6 +1,7 @@
 class LLMBenchmarkDashboard {
     constructor() {
-        this.currentJudge = 'o3';
+        this.currentJudge = 'gpt5.4';
+        this.searchQuery = '';
         this.judgeData = {
             o3: { general: null, complicated: null },
             'gpt5.4': { general: null, complicated: null }
@@ -16,6 +17,15 @@ class LLMBenchmarkDashboard {
             helpfulness_score: 'Helpfulness',
             overall_score: 'Overall'
         };
+        this.metricDescriptions = {
+            comprehension_score: 'How well the response understands the prompt intent and stays on topic.',
+            structure_score: 'How clear, logical, and well-organized the writing is.',
+            prose_style_score: 'The quality of language, grammar, and adherence to the requested tone.',
+            creativity_score: 'The novelty of ideas and uniqueness of perspective.',
+            depth_score: 'The level of detail, analysis, and substance provided.',
+            helpfulness_score: 'How effectively the response fulfills the user\'s overall goal.',
+            overall_score: 'Average score across all six criteria.'
+        };
         this.judgePaths = {
             o3: {
                 general: 'data/all-scores.json',
@@ -44,7 +54,9 @@ class LLMBenchmarkDashboard {
         await Promise.all(promises);
         this.renderTable('general');
         this.renderTable('complicated');
+        this.setupSearch();
         this.setupJudgeToggle();
+        this.setupTabs();
         this.showLoading(false);
     }
 
@@ -85,6 +97,41 @@ class LLMBenchmarkDashboard {
         });
     }
 
+    setupSearch() {
+        const searchInput = document.getElementById('globalSearch');
+        if (searchInput) {
+            searchInput.addEventListener('input', (e) => {
+                this.searchQuery = e.target.value.toLowerCase().trim();
+                this.renderTable('general');
+                this.renderTable('complicated');
+            });
+        }
+    }
+
+    setupTabs() {
+        const tabBtns = document.querySelectorAll('.tab-btn');
+        const tabContents = document.querySelectorAll('.tab-content');
+
+        tabBtns.forEach(btn => {
+            btn.addEventListener('click', () => {
+                const targetId = btn.dataset.target;
+
+                // Update active state of buttons
+                tabBtns.forEach(b => b.classList.remove('active'));
+                btn.classList.add('active');
+
+                // Update active state of content
+                tabContents.forEach(content => {
+                    if (content.id === targetId) {
+                        content.classList.add('active');
+                    } else {
+                        content.classList.remove('active');
+                    }
+                });
+            });
+        });
+    }
+
     renderTable(type) {
         const data = type === 'general' ? this.generalData : this.complicatedData;
         const sortState = type === 'general' ? this.generalSort : this.complicatedSort;
@@ -105,17 +152,35 @@ class LLMBenchmarkDashboard {
                     </tr>
                 </thead>
                 <tbody>
-                    ${this.getSortedTableData(data, sortState, metrics).map(row => {
-                        const isMonomer = this.modelLinks[row.model];
-                        return `
-                        <tr${isMonomer ? ' class="highlight-row"' : ''}>
-                            <td class="model-cell">${isMonomer ? `<a href="${this.modelLinks[row.model]}" target="_blank" rel="noopener" class="model-link">${row.model}</a>` : row.model}</td>
+                    ${this.getSortedTableData(data, sortState, metrics).map((row, index) => {
+            const isMonomer = this.modelLinks[row.model];
+            const isBaseline = row.model === 'gpt-4.1-2025-04-14';
+            let rowClass = '';
+            if (isMonomer) rowClass = 'highlight-row';
+            if (isBaseline) rowClass = 'baseline-row';
+
+            // Generate rank medal for the sorted column if it's a metric
+            let medalHtml = '';
+            if (sortState.column !== 'model' && ['desc', 'asc'].includes(sortState.direction)) {
+                const rank = sortState.direction === 'desc' ? index + 1 : Object.keys(data).length - index;
+                if (rank === 1) medalHtml = '<span class="rank-medal">🥇</span>';
+                else if (rank === 2) medalHtml = '<span class="rank-medal">🥈</span>';
+                else if (rank === 3) medalHtml = '<span class="rank-medal">🥉</span>';
+            }
+
+            return `
+                        <tr class="${rowClass}">
+                            <td class="model-cell">
+                                ${medalHtml}
+                                ${isMonomer ? `<a href="${this.modelLinks[row.model]}" target="_blank" rel="noopener" class="model-link">${row.model}</a>` : row.model}
+                                ${isBaseline ? ' (Baseline)' : ''}
+                            </td>
                             ${metrics.map(metric => `
-                                <td class="score-cell">${this.formatScore(row[metric])}</td>
+                                <td class="score-cell" style="background-color: ${this.getHeatmapColor(row[metric], type, metric)}">${this.formatScore(row[metric])}</td>
                             `).join('')}
                         </tr>
                     `;
-                    }).join('')}
+        }).join('')}
                 </tbody>
             </table>
         `;
@@ -126,10 +191,15 @@ class LLMBenchmarkDashboard {
 
     getSortedTableData(data, sortState, metrics) {
         const models = Object.keys(data);
-        let tableData = models.map(model => ({
-            model,
-            ...data[model]
-        }));
+        let tableData = models
+            .filter(model => {
+                if (!this.searchQuery) return true;
+                return model.toLowerCase().includes(this.searchQuery);
+            })
+            .map(model => ({
+                model,
+                ...data[model]
+            }));
 
         if (sortState.column) {
             tableData.sort((a, b) => {
@@ -154,6 +224,31 @@ class LLMBenchmarkDashboard {
         return value;
     }
 
+    getHeatmapColor(val, type, metric) {
+        if (val === null || val === undefined) return 'transparent';
+
+        // Use 5.0 as the neutral midpoint since that is the baseline
+        // Less than 5.0: increasingly red. Greater than 5.0: increasingly green/purple.
+        // Let's go from 3.0 to 9.0 as the typical min/max
+        const minVal = 3.5;
+        const maxVal = 8.5;
+        const baseline = 5.0;
+
+        let color = 'transparent';
+        if (val < baseline) {
+            // Bad score: red hue
+            const intensity = Math.min(1, (baseline - val) / (baseline - minVal));
+            // e.g. rgba(255, 99, 132, intensity)
+            // But we want extremely light background colors so text remains readable
+            color = `rgba(239, 68, 68, ${intensity * 0.2})`;
+        } else if (val > baseline) {
+            // Good score: purple/green hue
+            const intensity = Math.min(1, (val - baseline) / (maxVal - baseline));
+            color = `rgba(16, 185, 129, ${intensity * 0.2})`;
+        }
+        return color;
+    }
+
     setupTableSorting(type) {
         const tableContainer = document.getElementById(type === 'general' ? 'generalTable' : 'complicatedTable');
         const headers = tableContainer.querySelectorAll('th.sortable');

styles.css

@@ -6,25 +6,25 @@
 
 body {
     font-family: 'Inter', sans-serif;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    background: #f8fafc;
     min-height: 100vh;
-    color: #333;
+    color: #334155;
 }
 
 .container {
-    max-width: 1400px;
+    max-width: 1440px;
+    width: 95%;
     margin: 0 auto;
-    padding: 20px;
+    padding: 20px 40px;
 }
 
 .header {
     text-align: center;
     margin-bottom: 24px;
-    color: white;
+    color: #0f172a;
     padding: 48px 0 36px 0;
     position: relative;
     background: none;
-    box-shadow: 0 2px 12px 0 rgba(76, 75, 162, 0.06);
 }
 
 .header h1 {
@@ -40,19 +40,18 @@ body {
 
 .header h1 .fas {
     font-size: 2.2rem;
-    background: linear-gradient(135deg, #764ba2 60%, #667eea 100%);
+    background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%);
     color: white;
     border-radius: 50%;
     padding: 16px 18px;
-    box-shadow: 0 2px 12px #764ba244;
+    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.3);
     vertical-align: middle;
 }
 
 .header p {
     font-size: 1.25rem;
     font-weight: 400;
-    color: #ece6fa;
-    opacity: 0.92;
+    color: #64748b;
     margin-top: 0;
     margin-bottom: 0;
     letter-spacing: 0.04em;
@@ -61,8 +60,8 @@ body {
 .card {
     background: white;
     border-radius: 16px;
-    box-shadow: 0 6px 32px 0 rgba(76, 75, 162, 0.08);
-    border: 1.5px solid #ece6fa;
+    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
+    border: 1px solid #e2e8f0;
     padding: 32px 32px 24px 32px;
 }
 
@@ -71,7 +70,7 @@ body {
     align-items: center;
     font-size: 1.35rem;
     font-weight: 700;
-    color: #4b2996;
+    color: #1e293b;
     margin-bottom: 28px;
     letter-spacing: 0.5px;
     text-transform: none;
@@ -80,7 +79,7 @@ body {
     padding-left: 0;
     position: relative;
     padding-bottom: 8px;
-    border-bottom: 2px solid #ecf0f1;
+    border-bottom: 1px solid #e2e8f0;
 }
 
 .section-title-spacer {
@@ -89,23 +88,24 @@ body {
 
 .accent-bar {
     display: inline-block;
-    width: 7px;
-    height: 28px;
+    width: 6px;
+    height: 24px;
     border-radius: 4px;
-    background: linear-gradient(180deg, #764ba2 0%, #667eea 100%);
-    margin-right: 16px;
+    background: linear-gradient(180deg, #6366f1 0%, #a855f7 100%);
+    margin-right: 14px;
 }
 
-.overview-section, .table-section, .citation-section {
+.overview-section,
+.table-section,
+.citation-section {
     margin-bottom: 56px;
 }
 
 .overview-content {
-    font-size: 1.08rem;
-    color: #3a3550;
+    font-size: 1.05rem;
+    color: #475569;
     line-height: 1.7;
-    padding-left: 2px;
-    border-left: 4px solid #ece6fa;
+    border-left: 3px solid #e2e8f0;
     padding-left: 24px;
     background: none;
 }
@@ -116,9 +116,9 @@ body {
 }
 
 .overview-content h4 {
-    font-size: 1.13rem;
+    font-size: 1.1rem;
     font-weight: 700;
-    color: #764ba2;
+    color: #0f172a;
     margin-top: 28px;
     margin-bottom: 10px;
     letter-spacing: 0.02em;
@@ -143,103 +143,123 @@ body {
 }
 
 .citation-content {
-    font-size: 1.08rem;
-    color: #3a3550;
+    font-size: 1.05rem;
+    color: #475569;
     line-height: 1.7;
     padding-left: 2px;
 }
 
 .citation-content em {
-    color: #764ba2;
-    font-size: 1rem;
+    color: #334155;
+    font-size: 0.95rem;
     font-style: italic;
-    background: #f3f0fa;
-    padding: 2px 6px;
-    border-radius: 4px;
+    background: #f1f5f9;
+    padding: 4px 8px;
+    border-radius: 6px;
 }
 
 .table-container {
     overflow-x: auto;
-    background: #f8f9fa;
+    background: white;
     border-radius: 12px;
-    padding: 20px;
-    max-height: 480px;
+    padding: 0;
+    max-height: 580px;
     overflow-y: auto;
+    position: relative;
+    border: 1px solid #e9ecef;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
 }
 
 table {
     width: 100%;
+    min-width: 1250px;
     border-collapse: collapse;
     background: white;
-    border-radius: 8px;
-    overflow: hidden;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+    table-layout: fixed;
 }
 
-th, td {
-    padding: 14px 18px;
+th,
+td {
+    padding: 12px 6px;
     border-bottom: 1px solid #e9ecef;
 }
 
 th {
-    background: #764ba2;
-    color: white;
-    font-weight: 700;
-    font-size: 1rem;
+    background: #f8fafc;
+    color: #334155;
+    font-weight: 600;
+    font-size: 0.9rem;
     cursor: pointer;
-    transition: background-color 0.3s ease;
+    transition: background-color 0.2s ease;
     position: sticky;
     top: 0;
     z-index: 2;
-    text-transform: none;
-    letter-spacing: 0.1em;
-    padding-right: 32px;
+    letter-spacing: 0.02em;
+    padding-right: 18px;
+    white-space: nowrap;
+    overflow: hidden;
+    border-bottom: 2px solid #e2e8f0;
 }
 
 th:hover {
-    background: #5e388e;
+    background: #f1f5f9;
 }
 
 th.sortable::after {
     content: '';
     display: inline-block;
     position: absolute;
-    right: 12px;
+    right: 4px;
     top: 50%;
     transform: translateY(-50%);
-    width: 16px;
-    height: 16px;
+    width: 12px;
+    height: 12px;
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 16px 16px;
-    opacity: 0.7;
+    background-size: 12px 12px;
+    opacity: 0.4;
     /* Default: double chevron (unsorted) */
-    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 6l4-4 4 4" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M4 10l4 4 4-4" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
+    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 6l4-4 4 4" stroke="%2364748b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M4 10l4 4 4-4" stroke="%2364748b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
 }
 
 th.sort-asc::after {
     /* Up chevron */
-    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 10l4-4 4 4" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
+    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 10l4-4 4 4" stroke="%23334155" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
     opacity: 1;
 }
 
 th.sort-desc::after {
     /* Down chevron */
-    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 6l4 4 4-4" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
+    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 6l4 4 4-4" stroke="%23334155" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
     opacity: 1;
 }
 
-.model-cell, th:first-child {
+.model-cell,
+th:first-child {
     text-align: left;
+    position: sticky;
+    left: 0;
+    background: white;
+    z-index: 1;
+    border-right: 1px solid #e9ecef;
+    width: 250px;
+    /* Fixed width for model column */
+    padding-left: 20px;
 }
 
-td:not(.model-cell), th:not(:first-child) {
-    text-align: right;
+th:first-child {
+    background: #f8fafc;
+    z-index: 3;
+}
+
+td:not(.model-cell),
+th:not(:first-child) {
+    text-align: center;
 }
 
 td {
-    font-size: 1rem;
-    color: #4b2996;
+    font-size: 0.90rem;
+    color: #334155;
     font-weight: 500;
 }
 
@@ -248,12 +268,14 @@ tr:hover {
 }
 
 .score-cell {
-    font-weight: 700;
-    color: #764ba2;
+    font-weight: 600;
+    color: #495057;
+    /* We'll let heatmap coloring handle the exact shade */
+    transition: background-color 0.3s;
 }
 
 .model-cell {
-    font-weight: 700;
+    font-weight: 600;
     color: #495057;
 }
 
@@ -263,7 +285,7 @@ tr:hover {
     left: 0;
     width: 100%;
     height: 100%;
-    background: rgba(0,0,0,0.8);
+    background: rgba(0, 0, 0, 0.8);
     display: flex;
     flex-direction: column;
     justify-content: center;
@@ -287,8 +309,13 @@ tr:hover {
 }
 
 @keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
+    0% {
+        transform: rotate(0deg);
+    }
+
+    100% {
+        transform: rotate(360deg);
+    }
 }
 
 .no-data {
@@ -308,64 +335,153 @@ tr:hover {
     .container {
         padding: 10px;
     }
+
     .header h1 {
         font-size: 2rem;
     }
+
     .dashboard.card {
         padding: 12px 4px 12px 4px;
     }
+
     .card {
         padding: 12px 4px 12px 4px;
     }
+
     .table-container {
         padding: 10px;
     }
-    th, td {
+
+    th,
+    td {
         padding: 8px 8px;
         font-size: 0.92rem;
     }
-    .overview-section, .table-section, .citation-section {
+
+    .overview-section,
+    .table-section,
+    .citation-section {
         margin-bottom: 36px;
     }
 }
 
-.judge-section {
-    margin-bottom: 36px;
+.dashboard-controls {
+    margin-bottom: 20px;
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+}
+
+.controls-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 16px;
+}
+
+.judge-selector {
+    display: flex;
+    align-items: center;
+    gap: 16px;
 }
 
 .judge-toggle {
     display: flex;
-    gap: 0;
+    align-items: center;
+    background: #f1f3f5;
     border-radius: 10px;
-    overflow: hidden;
-    border: 2px solid #764ba2;
-    width: fit-content;
+    padding: 4px;
+    border: 1px solid #e9ecef;
 }
 
-.judge-btn {
-    padding: 10px 28px;
-    font-size: 1rem;
+.control-label {
+    font-size: 1.05rem;
     font-weight: 700;
+    color: #1e293b;
+}
+
+.judge-btn {
+    padding: 8px 24px;
+    font-size: 0.95rem;
+    font-weight: 600;
     font-family: 'Inter', sans-serif;
     cursor: pointer;
     border: none;
-    background: white;
-    color: #764ba2;
-    transition: background 0.2s, color 0.2s;
+    background: transparent;
+    color: #64748b;
+    border-radius: 8px;
+    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
     letter-spacing: 0.03em;
 }
 
-.judge-btn:not(:last-child) {
-    border-right: 2px solid #764ba2;
-}
-
 .judge-btn:hover {
-    background: #f3eaff;
+    color: #0f172a;
 }
 
 .judge-btn.active {
-    background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
-    color: white;
+    background: white;
+    color: #0f172a;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+/* --- Tabs --- */
+.tabs-container {
+    display: flex;
+    border-bottom: 2px solid #e9ecef;
+    margin-bottom: 16px;
+}
+
+.tabs-header {
+    display: flex;
+    gap: 24px;
+    margin-bottom: -2px;
+}
+
+.tab-btn {
+    padding: 12px 4px;
+    font-size: 1.05rem;
+    font-weight: 600;
+    font-family: 'Inter', sans-serif;
+    cursor: pointer;
+    border: none;
+    background: transparent;
+    color: #64748b;
+    border-bottom: 3px solid transparent;
+    transition: all 0.2s;
+    letter-spacing: 0.02em;
+}
+
+.tab-btn:hover {
+    color: #0f172a;
+}
+
+.tab-btn.active {
+    color: #0f172a;
+    border-bottom-color: #6366f1;
+    font-weight: 700;
+}
+
+.tab-content {
+    display: none;
+    animation: fadeIn 0.3s ease-in-out;
+    margin-bottom: 56px;
+}
+
+.tab-content.active {
+    display: block;
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(5px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
 }
 
 .highlight-row {
@@ -373,15 +489,27 @@ tr:hover {
     box-shadow: 0 2px 8px 0 rgba(118, 75, 162, 0.08);
 }
 
+.baseline-row {
+    background: #fefce8 !important;
+}
+
+.baseline-row .model-cell {
+    color: #ca8a04;
+}
+
+.baseline-row td {
+    font-style: italic;
+}
+
 .model-link {
-    color: #764ba2;
+    color: #6366f1;
     font-weight: 700;
     text-decoration: none;
     transition: color 0.2s;
 }
 
 .model-link:hover {
-    color: #4b2996;
+    color: #4f46e5;
     text-decoration: none;
 }
 
@@ -455,4 +583,53 @@ tr:hover {
     vertical-align: middle;
     line-height: 0.5;
     letter-spacing: 0;
-} 
+}
+
+/* --- Search Bar --- */
+.search-container {
+    position: relative;
+    width: 250px;
+    flex-shrink: 0;
+}
+
+.search-input {
+    width: 100%;
+    padding: 10px 16px 10px 38px;
+    border: 1.5px solid #e2e8f0;
+    border-radius: 8px;
+    font-size: 0.95rem;
+    font-family: 'Inter', sans-serif;
+    color: #334155;
+    transition: border-color 0.2s, box-shadow 0.2s;
+    background: #f8fafc;
+}
+
+.search-input:focus {
+    outline: none;
+    border-color: #6366f1;
+    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
+    background: white;
+}
+
+.search-icon {
+    position: absolute;
+    left: 14px;
+    top: 50%;
+    transform: translateY(-50%);
+    color: #9ba1a6;
+    font-size: 0.9rem;
+}
+
+/* --- Rank Medals --- */
+.rank-medal {
+    font-size: 1.1rem;
+    margin-right: 6px;
+    vertical-align: middle;
+}
+
+/* Ensure data cells don't overflow */
+.score-cell {
+    font-weight: 600;
+    color: #334155;
+    transition: background-color 0.3s;
+}