log scale

README.md

@@ -1,5 +1,5 @@
 ---
-title: InferBench
+title: P-Bench
 emoji: 🥇
 colorFrom: green
 colorTo: indigo
@@ -12,73 +12,34 @@ tags:
 - leaderboard
 ---
 
-# InferBench
+# P-Bench
 
-Evaluate the quality and efficiency of image gen api's.
+Compare text-to-image models on quality, speed, and price. This repo is the
+Gradio dashboard: leaderboards, Pareto plots, and side-by-side samples.
 
-## Installation
+The live Space is [PrunaAI/P-Bench](https://huggingface.co/spaces/PrunaAI/P-Bench).
 
-### Install dependencies
+## Run locally
 
-Install dependencies with conda like that:
-```
-conda env create -f environment.yml
-```
-
-### Install uv
-
-Install uv with pip like that:
-
-```
-uv venv --python 3.12
-```
-
-Then activate the environment:
+From the repo root:
 
 ```
+python -m venv .venv
 source .venv/bin/activate
+pip install "gradio==5.19.0" pandas -r requirements.txt
+python app.py
 ```
 
-Then install the dependencies with uv:
+The app is served at `http://127.0.0.1:7860`.
 
-```
-uv sync --all-groups
-```
+`requirements.txt` lists Plotly. Gradio and pandas are required locally;
+Hugging Face Spaces installs Gradio from the YAML `sdk_version` above.
 
-## Usage
+## Deploy
 
-Create .env file with all the credentials you will need.
+`origin` is the Space (`https://huggingface.co/spaces/PrunaAI/P-Bench`).
+Publish the current branch to the live app with:
 
-This is how you can generate the images.
-```
-python sample.py replicate draw_bench genai_bench geneval hps parti
-```
-
-This is how you would evaluate the benchmarks once you have all images:
-```
-python evaluate.py replicate draw_bench genai_bench geneval hps parti
 ```
-
-## Leaderboard
-
-The leaderboard is [hosted on Hugging Face](https://huggingface.co/spaces/PrunaAI/InferBench/tree/main) with gradio.
-
-To run the dashboard locally, you can use the following command:
-
-```
-python dashboard/app.py
-```
-
-To deploy the dashboard to Hugging Face, you can use the following commands:
-
-First, add the remote:
-
-```
-git remote add hf https://huggingface.co/spaces/PrunaAI/InferBench
-```
-
-Then push the changes of your branch to the remote:
-
+git push origin HEAD:main
 ```
-git push hf $(git rev-parse --abbrev-ref HEAD):main --force
-```

app.py

@@ -1,429 +1,1555 @@
+import asyncio
 import json
 from collections import defaultdict
 from pathlib import Path
 
+# Gradio 5.19's safe_get_lock() returns None on Python 3.12+/3.14 when no
+# event loop exists yet, which breaks /queue/join (pending_message_lock).
+try:
+    asyncio.get_running_loop()
+except RuntimeError:
+    asyncio.set_event_loop(asyncio.new_event_loop())
+
 import gradio as gr
 import pandas as pd
 
 from ui import (
-    render_about,
-    render_benchmarks,
     render_footer,
     render_header,
-    render_home,
+    render_image_workspace,
 )
 
+# Visual tokens from https://www.pruna.ai/ and https://playground.pruna.ai/
 custom_css = """
-.logo {
-    width: 300px;
-    height: auto;
-    max-width: 100%;
-    margin: 0 auto;
-    object-fit: contain;
-    padding-bottom: 0;
-}
-.text {
-    font-size: 16px !important;
-}
-.tabs button,
-.tab-nav button,
-.subtabs button {
-    font-size: 20px;
-    color: #581c87 !important;
-}
-.tabs button.selected,
-.tabs button[aria-selected="true"],
-.tab-nav button.selected,
-.tab-nav button[aria-selected="true"],
-.subtabs button.selected,
-.subtabs button[aria-selected="true"] {
-    color: #ffffff !important;
-    background: #7c3aed !important;
-    border-color: #6d28d9 !important;
-}
-.dark .tabs button,
-.dark .tab-nav button,
-.dark .subtabs button {
-    color: #e9d5ff !important;
-}
-.dark .tabs button.selected,
-.dark .tabs button[aria-selected="true"],
-.dark .tab-nav button.selected,
-.dark .tab-nav button[aria-selected="true"],
-.dark .subtabs button.selected,
-.dark .subtabs button[aria-selected="true"] {
-    color: #ffffff !important;
-    background: #6d28d9 !important;
-}
-.benchmark-catalogue-row {
-    width: 100%;
-    gap: 16px;
-}
-.benchmark-card {
-    width: 100%;
-    max-width: none;
-    min-height: 220px;
-    border: 1px solid rgba(124, 58, 237, 0.45);
-    border-left: 4px solid #7c3aed;
-    border-radius: 12px;
-    background: rgba(139, 92, 246, 0.14);
-    padding: 16px 18px;
-    box-shadow: 0 4px 12px rgba(76, 29, 149, 0.12);
-}
-.benchmark-card:hover {
-    border-color: #5b21b6;
-    box-shadow: 0 6px 18px rgba(76, 29, 149, 0.22);
-}
-.community-footer {
-    margin-top: 24px;
-    padding: 18px 20px;
-    border: 1px solid #c4b5fd;
-    border-radius: 12px;
-    background: rgba(139, 92, 246, 0.16);
-}
-.community-footer h3 {
-    margin: 0 0 10px;
-    color: #581c87;
-    font-size: 1.05rem;
-}
-.community-footer-links {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 10px 14px;
-    align-items: center;
-}
-.dark .community-footer {
-    border-color: #6d28d9;
-    background: rgba(76, 29, 149, 0.35);
-}
-.dark .community-footer h3 {
-    color: #f5f3ff;
-}
-.home-callouts {
-    display: grid;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-    gap: 12px;
-    margin: 8px 0 20px;
+:root, :host, .dark, :host(.dark) {
+    --pruna-bg-primary: #120b1b;
+    --pruna-bg-card: #171021;
+    --pruna-bg-elevated: #1d1429;
+    --pruna-bg-header: #17101f;
+    --pruna-border: rgba(74, 57, 98, 0.75);
+    --pruna-hairline: rgba(255, 255, 255, 0.08);
+    --pruna-text-primary: #fafafa;
+    --pruna-text-body: #d4d4d4;
+    --pruna-text-muted: #a3a3a3;
+    --pruna-accent: #9334e9;
+    --pruna-accent-bright: #8f35ff;
+    --pruna-lavender: #d8b4fe;
+    --pruna-link: #bf8bff;
+    --pruna-font: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
+    --pruna-glow: radial-gradient(ellipse 60% 35% at 50% -5%, rgba(147, 52, 233, 0.18), transparent 55%);
+    --pruna-card-bg: color-mix(in oklab, #1d1429 92%, black 8%);
+    --pruna-card-shadow: 0 24px 55px rgba(0, 0, 0, 0.42), inset 0 1px rgba(255, 255, 255, 0.04);
+    --pruna-callout-bg: color-mix(in oklab, #171021 82%, black 18%);
+    --pruna-menu-border: rgba(255, 255, 255, 0.08);
+    --pruna-menu-bg: rgba(255, 255, 255, 0.03);
+    --pruna-menu-hover-bg: rgba(255, 255, 255, 0.05);
+    --pruna-menu-hover-color: #e4e4e7;
+    --pruna-menu-selected-bg: rgba(143, 53, 255, 0.22);
+    --pruna-menu-selected-color: #ffffff;
+    --pruna-tab-hover: #e4e4e7;
+    --pruna-tab-selected: #ffffff;
+    --pruna-input-bg: rgba(255, 255, 255, 0.03);
+    --pruna-input-border: rgba(255, 255, 255, 0.08);
+    --pruna-focus-border: rgba(143, 53, 255, 0.45);
+    --pruna-focus-ring: 0 0 0 3px rgba(143, 53, 255, 0.16);
+    --pruna-table-hover: rgba(143, 53, 255, 0.16);
+    --pruna-table-hover-text: #ffffff;
+    --pruna-table-sticky: #17101f;
+    --pruna-table-sticky-hover: #2a1844;
+    --pruna-rank-bg: rgba(143, 53, 255, 0.22);
+    --pruna-rank-ring: 0 0 0 1px rgba(143, 53, 255, 0.45);
+    --pruna-score: #ddd6fe;
+    --pruna-accordion-bg: rgba(255, 255, 255, 0.02);
+    --pruna-accordion-border: rgba(216, 180, 254, 0.15);
+    --pruna-dropdown-hover: #2a1844;
+    --pruna-toggle-track: var(--pruna-bg-header);
+    --pruna-toggle-thumb: var(--pruna-bg-elevated);
+    --pruna-toggle-thumb-shadow: 0 1px 2px rgba(0, 0, 0, 0.45), inset 0 1px rgba(255, 255, 255, 0.06);
+    color-scheme: dark;
 }
-.home-callouts > div {
-    padding: 14px 16px;
-    border: 1px solid #a78bfa;
-    border-radius: 10px;
-    background: #f5f3ff;
+
+.light, :host(.light) {
+    --pruna-bg-primary: #f6f3fa;
+    --pruna-bg-card: #ffffff;
+    --pruna-bg-elevated: #ffffff;
+    --pruna-bg-header: #f3eef8;
+    --pruna-border: rgba(126, 34, 206, 0.16);
+    --pruna-hairline: rgba(24, 24, 27, 0.08);
+    --pruna-text-primary: #18181b;
+    --pruna-text-body: #3f3f46;
+    --pruna-text-muted: #71717a;
+    --pruna-accent: #9334e9;
+    --pruna-accent-bright: #7c22ce;
+    --pruna-lavender: #7e22ce;
+    --pruna-link: #6d28d9;
+    --pruna-glow: radial-gradient(ellipse 60% 35% at 50% -5%, rgba(147, 52, 233, 0.10), transparent 55%);
+    --pruna-card-bg: #ffffff;
+    --pruna-card-shadow: 0 10px 28px rgba(88, 28, 135, 0.08);
+    --pruna-callout-bg: #ffffff;
+    --pruna-menu-border: var(--pruna-border);
+    --pruna-menu-bg: var(--pruna-bg-card);
+    --pruna-menu-hover-bg: rgba(147, 52, 233, 0.06);
+    --pruna-menu-hover-color: var(--pruna-text-primary);
+    --pruna-menu-selected-bg: rgba(147, 52, 233, 0.12);
+    --pruna-menu-selected-color: var(--pruna-accent-bright);
+    --pruna-tab-hover: var(--pruna-text-primary);
+    --pruna-tab-selected: var(--pruna-text-primary);
+    --pruna-input-bg: var(--pruna-bg-card);
+    --pruna-input-border: var(--pruna-border);
+    --pruna-focus-border: rgba(124, 34, 206, 0.45);
+    --pruna-focus-ring: 0 0 0 3px rgba(143, 53, 255, 0.16);
+    --pruna-table-hover: rgba(147, 52, 233, 0.08);
+    --pruna-table-hover-text: var(--pruna-text-primary);
+    --pruna-table-sticky: var(--pruna-bg-card);
+    --pruna-table-sticky-hover: #f3e8ff;
+    --pruna-rank-bg: rgba(147, 52, 233, 0.12);
+    --pruna-rank-ring: 0 0 0 1px rgba(147, 52, 233, 0.28);
+    --pruna-score: var(--pruna-accent-bright);
+    --pruna-accordion-bg: var(--pruna-bg-card);
+    --pruna-accordion-border: var(--pruna-border);
+    --pruna-dropdown-hover: #f3e8ff;
+    --pruna-toggle-track: var(--pruna-bg-header);
+    --pruna-toggle-thumb: var(--pruna-bg-card);
+    --pruna-toggle-thumb-shadow: 0 1px 2px rgba(88, 28, 135, 0.12);
+    color-scheme: light;
 }
-.home-callouts span {
-    color: #5b21b6;
-    font-size: 11px;
-    font-weight: 700;
-    letter-spacing: 0.05em;
+
+html {
+    width: 100% !important;
+    max-width: 100% !important;
+    min-width: 0 !important;
+    overflow-x: hidden;
+    overflow-y: auto;
+    -webkit-text-size-adjust: 100%;
+    text-size-adjust: 100%;
+    -webkit-tap-highlight-color: transparent;
+}
+body, gradio-app {
+    width: 100% !important;
+    max-width: 100% !important;
+    min-width: 0 !important;
+    overflow: visible;
+    -webkit-tap-highlight-color: transparent;
 }
-.home-callouts strong {
-    display: block;
-    margin-top: 6px;
-    color: #1e1b4b;
-    font-size: 18px;
-    word-break: break-word;
+html, body, .gradio-container, .main {
+    background: var(--pruna-bg-primary) !important;
+    color: var(--pruna-text-primary) !important;
+    font-family: var(--pruna-font) !important;
 }
-.home-callouts em {
-    display: block;
-    margin-top: 4px;
-    color: #4c1d95;
-    font-style: normal;
-    font-size: 13px;
+button, a, label, input, select, textarea,
+[role="button"], [role="tab"], [role="radio"],
+.gradio-container * {
+    -webkit-tap-highlight-color: transparent !important;
 }
-.home-benchmark-card {
-    height: 100%;
-    padding: 18px 18px 16px;
-    border: 1px solid #a78bfa;
-    border-left: 4px solid #7c3aed;
-    border-radius: 12px;
-    background: #f5f3ff;
-    box-shadow: 0 4px 12px rgba(76, 29, 149, 0.12);
+
+.gradio-container {
+    --input-radius: 10px;
+    --container-radius: 10px;
+    --block-radius: 10px;
 }
-.home-benchmark-title {
-    color: #1e1b4b;
-    font-size: 1.35rem;
-    font-weight: 700;
+
+/* Subtle depth — not a marketing-site hero glow */
+body, .gradio-container {
+    background-image: var(--pruna-glow) !important;
+    background-repeat: no-repeat !important;
+    background-attachment: scroll !important;
+}
+@media (min-width: 701px) and (hover: hover) and (pointer: fine) {
+    body, .gradio-container {
+        background-attachment: fixed !important;
+    }
 }
-.home-benchmark-blurb {
-    margin: 8px 0 14px;
-    color: #312e81;
-    font-size: 0.95rem;
-    line-height: 1.45;
+
+.gradio-container {
+    width: 100% !important;
+    max-width: 1200px !important;
+    min-width: 0 !important;
+    margin: 0 auto !important;
+    padding-top: 0 !important;
+    padding-left: 20px !important;
+    padding-right: 20px !important;
+    box-sizing: border-box !important;
+    overflow-x: hidden;
+}
+.gradio-container .main,
+.gradio-container .wrap,
+.gradio-container .contain,
+.gradio-container .block,
+.gradio-container .form,
+.gradio-container .row,
+.gradio-container .column,
+.gradio-container .gap,
+.gradio-container .html-container,
+.gradio-container .prose,
+.gradio-container .padded,
+.main-tabs,
+.main-tabs .tab-wrapper,
+.main-tabs .tabitem,
+.leaderboard-controls,
+.workspace-shell,
+.workspace-filters,
+.view-filters {
+    max-width: 100% !important;
+    min-width: 0 !important;
 }
-.home-top-label {
-    color: #5b21b6;
-    font-size: 11px;
-    font-weight: 700;
-    letter-spacing: 0.05em;
-    text-transform: uppercase;
+
+/* —— App header (P-Bench only) —— */
+.app-header-host,
+.app-header-host .html-container,
+.app-header-host .prose,
+.app-header-host.block,
+.app-header-host .padded {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 auto !important;
+    width: 100% !important;
+    max-width: none !important;
+    display: block !important;
+    text-align: center !important;
+    overflow: visible !important;
 }
-.home-top-list {
-    list-style: none;
+.app-header {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    width: 100%;
     margin: 8px 0 0;
-    padding: 0;
+    padding: 4px 0 10px;
+    text-align: center;
 }
-.home-top-list li {
+.app-header-bar {
     display: grid;
-    grid-template-columns: 28px 1fr auto;
-    gap: 10px;
+    grid-template-columns: minmax(36px, 1fr) auto minmax(36px, 1fr);
     align-items: center;
-    padding: 8px 0;
-    border-bottom: 1px solid #ddd6fe;
-    color: #1e1b4b;
-}
-.home-rank {
-    width: 28px;
-    height: 28px;
-    border-radius: 999px;
-    background: #ede9fe;
-    color: #5b21b6;
-    font-weight: 700;
-    font-size: 13px;
-    display: inline-flex;
+    width: 100%;
+    column-gap: 8px;
+}
+.app-header .theme-toggle,
+button.theme-toggle {
+    position: static !important;
+    top: auto;
+    right: auto;
+    grid-column: 3;
+    justify-self: end;
+    display: inline-flex !important;
+    align-items: center !important;
+    justify-content: center !important;
+    width: 36px !important;
+    height: 36px !important;
+    min-width: 36px !important;
+    min-height: 36px !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border: 1px solid var(--pruna-menu-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-menu-bg) !important;
+    color: var(--pruna-text-muted) !important;
+    box-shadow: none !important;
+    appearance: none !important;
+    -webkit-appearance: none !important;
+    box-sizing: border-box !important;
+    font: inherit !important;
+    line-height: 0 !important;
+    cursor: pointer;
+    z-index: 6;
+}
+.app-header .theme-toggle:hover,
+.app-header .theme-toggle:active,
+button.theme-toggle:hover,
+button.theme-toggle:active {
+    color: var(--pruna-menu-hover-color) !important;
+    background: var(--pruna-menu-hover-bg) !important;
+    border-color: var(--pruna-menu-border) !important;
+    box-shadow: none !important;
+}
+.app-header .theme-toggle:focus,
+button.theme-toggle:focus {
+    outline: none !important;
+}
+.app-header .theme-toggle:focus-visible,
+button.theme-toggle:focus-visible {
+    color: var(--pruna-menu-hover-color) !important;
+    background: var(--pruna-menu-hover-bg) !important;
+    border-color: var(--pruna-focus-border) !important;
+    box-shadow: var(--pruna-focus-ring) !important;
+}
+.app-header .theme-toggle svg,
+button.theme-toggle svg {
+    width: 18px;
+    height: 18px;
+    flex-shrink: 0;
+}
+.app-header .theme-toggle .theme-icon-sun,
+button.theme-toggle .theme-icon-sun { display: block !important; }
+.app-header .theme-toggle .theme-icon-moon,
+button.theme-toggle .theme-icon-moon { display: none !important; }
+.app-header .theme-toggle[data-mode="light"] .theme-icon-sun,
+button.theme-toggle[data-mode="light"] .theme-icon-sun { display: none !important; }
+.app-header .theme-toggle[data-mode="light"] .theme-icon-moon,
+button.theme-toggle[data-mode="light"] .theme-icon-moon { display: block !important; }
+.app-header-brand {
+    display: inline-flex !important;
+    flex-direction: row;
     align-items: center;
     justify-content: center;
+    gap: 12px;
+    grid-column: 2;
+    justify-self: center;
+    width: auto !important;
+    max-width: 100%;
+    margin: 0;
 }
-.home-model {
-    font-weight: 600;
-    word-break: break-word;
-    color: #1e1b4b;
-}
-.home-score {
-    font-variant-numeric: tabular-nums;
-    color: #4c1d95;
-    font-weight: 600;
-}
-.home-empty {
-    color: #4c1d95;
+.app-header-logo {
+    display: block !important;
+    width: 44px !important;
+    height: 52px !important;
+    margin: 0 !important;
+    object-fit: contain;
+    flex: 0 0 auto;
 }
-.dark .home-callouts > div,
-.dark .home-benchmark-card {
-    border-color: #7c3aed;
-    background: #1e1b4b;
+
+/* —— Page tabs: centered underline nav —— */
+.workspace-shell,
+.workspace-shell.block,
+.workspace-shell.column,
+.workspace-shell.gap {
+    display: flex !important;
+    flex-direction: column !important;
+    gap: 0 !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+}
+/* Flatten tabs so the bar sits above shared filters. display:contents is
+   the fallback; Safari can drop or mis-order those children, so browsers
+   with subgrid use the grid layout below instead. */
+.workspace-shell > .tabs,
+.workspace-shell > .main-tabs,
+.workspace-shell > .block:not(.workspace-filters),
+.workspace-shell .tabs.main-tabs {
+    display: contents !important;
+}
+.workspace-filters {
+    order: 2 !important;
+}
+.main-tabs .tabitem {
+    order: 3 !important;
+}
+.tabs {
+    gap: 0 !important;
+}
+.main-tabs > .tab-wrapper {
+    order: 1 !important;
+    height: auto !important;
+    min-height: 0 !important;
+    padding: 0 !important;
+    margin: 0 0 16px !important;
+    justify-content: center !important;
+    width: 100% !important;
+    overflow: visible !important;
+}
+@supports (grid-template-rows: subgrid) {
+    .workspace-shell,
+    .workspace-shell.block,
+    .workspace-shell.column,
+    .workspace-shell.gap {
+        display: grid !important;
+        grid-template-columns: minmax(0, 1fr) !important;
+        grid-template-rows: auto auto auto !important;
+        align-content: start !important;
+    }
+    .workspace-shell > .tabs,
+    .workspace-shell > .main-tabs,
+    .workspace-shell .tabs.main-tabs {
+        display: grid !important;
+        grid-template-columns: minmax(0, 1fr) !important;
+        grid-template-rows: subgrid !important;
+        grid-column: 1 !important;
+        grid-row: 1 / 4 !important;
+        position: static !important;
+    }
+    .main-tabs > .tab-wrapper {
+        grid-row: 1 !important;
+        order: 0 !important;
+    }
+    .workspace-filters {
+        grid-column: 1 !important;
+        grid-row: 2 !important;
+        order: 0 !important;
+    }
+    .main-tabs .tabitem {
+        grid-row: 3 !important;
+        order: 0 !important;
+        min-width: 0 !important;
+    }
 }
-.dark .home-callouts span,
-.dark .home-top-label,
-.dark .home-rank {
-    color: #c4b5fd;
+.main-tabs .tab-container {
+    height: auto !important;
+    min-height: 0 !important;
+    justify-content: center !important;
+    flex-wrap: wrap !important;
+    overflow: visible !important;
+    max-width: 100% !important;
+    gap: 2px;
+}
+.main-tabs .tab-container::after {
+    background: var(--pruna-hairline) !important;
+}
+.main-tabs .tab-container > button {
+    font-family: var(--pruna-font) !important;
+    font-size: 0.95rem !important;
+    font-weight: 600 !important;
+    letter-spacing: -0.015em !important;
+    color: var(--pruna-text-muted) !important;
+    background: transparent !important;
+    border: none !important;
+    border-radius: 0 !important;
+    box-shadow: none !important;
+    padding: 12px 20px !important;
+    min-height: 44px !important;
+    height: auto !important;
+}
+.main-tabs .tab-container > button:hover:not(.selected),
+.main-tabs .tab-container > button:active:not(.selected) {
+    color: var(--pruna-tab-hover) !important;
+    background: transparent !important;
+}
+.main-tabs .tab-container > button.selected,
+.main-tabs .tab-container > button[aria-selected="true"] {
+    color: var(--pruna-tab-selected) !important;
+    background: transparent !important;
+}
+.main-tabs .tab-container > button:disabled,
+.main-tabs .tab-container > button[disabled] {
+    opacity: 0.4 !important;
+    color: var(--pruna-text-muted) !important;
+    cursor: not-allowed !important;
+}
+.main-tabs .tab-container > button.selected::after,
+.main-tabs .tab-container > button[aria-selected="true"]::after {
+    background: var(--pruna-accent-bright) !important;
+    height: 2px !important;
+}
+.main-tabs .tabitem {
+    padding: 8px 0 0 !important;
+    border-radius: 0 !important;
+    overflow: visible !important;
 }
-.dark .home-rank {
-    background: #312e81;
+
+/* —— About: two columns on desktop, stacked on phone —— */
+.about-layout,
+.about-layout.row,
+.about-layout .form {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: flex-start !important;
+    gap: 8px 40px !important;
+    width: 100% !important;
 }
-.dark .home-callouts strong,
-.dark .home-benchmark-title,
-.dark .home-model,
-.dark .home-top-list li {
-    color: #faf5ff;
+.about-layout > .about-col,
+.about-layout .form > .about-col {
+    flex: 1 1 340px !important;
+    min-width: 280px !important;
+    max-width: 100% !important;
+}
+.about-copy,
+.about-copy.block,
+.about-copy .prose,
+.about-copy.prose,
+.about-copy.padded {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    overflow-wrap: break-word !important;
+    word-break: break-word !important;
 }
-.dark .home-callouts em,
-.dark .home-benchmark-blurb,
-.dark .home-score,
-.dark .home-empty {
-    color: #ddd6fe;
+.about-copy ol,
+.about-copy ul,
+.about-copy .prose ol,
+.about-copy .prose ul {
+    padding-left: 1.25rem !important;
+    margin: 0 0 0.8rem !important;
 }
-.dark .home-top-list li {
-    border-bottom-color: #4c1d95;
+.about-copy li,
+.about-copy .prose li {
+    overflow-wrap: break-word;
 }
+
 @media (max-width: 700px) {
-    .home-callouts {
-        grid-template-columns: 1fr;
+    .gradio-container {
+        padding-left: 12px !important;
+        padding-right: 12px !important;
+    }
+    .gradio-container .block,
+    .gradio-container .form,
+    .gradio-container .row,
+    .gradio-container .column,
+    .gradio-container .wrap,
+    .leaderboard-controls,
+    .view-filters {
+        min-width: 0 !important;
+        max-width: 100% !important;
+    }
+    .app-header {
+        padding: 4px 0 8px;
+        margin: 4px 0 0;
+    }
+    .app-header-logo {
+        width: 36px !important;
+        height: 42px !important;
+    }
+    .app-header-brand h1,
+    .gradio-container .app-header-brand h1 {
+        font-size: 1.55rem !important;
+        width: auto !important;
+        max-width: 100% !important;
+    }
+    .app-header-tagline {
+        font-size: 0.88rem !important;
+        padding: 0 8px !important;
+    }
+    .main-tabs > .tab-wrapper {
+        margin: 4px 0 14px !important;
+    }
+    .main-tabs .tab-container {
+        flex-wrap: wrap !important;
+        justify-content: center !important;
+        gap: 0 !important;
+    }
+    .main-tabs .tab-container > button {
+        padding: 10px 12px !important;
+        font-size: 0.88rem !important;
+        min-height: 40px !important;
+    }
+    .about-layout,
+    .about-layout.row,
+    .about-layout .form {
+        flex-direction: column !important;
+        flex-wrap: nowrap !important;
+        gap: 8px !important;
+    }
+    .about-layout > .about-col,
+    .about-layout > div {
+        flex: 1 1 auto !important;
+        width: 100% !important;
+    }
+    .about-copy h1,
+    .about-copy .prose h1 {
+        font-size: 1.3rem !important;
+    }
+    .about-copy h2,
+    .about-copy .prose h2 {
+        margin-top: 1.25rem !important;
+        font-size: 1.12rem !important;
+    }
+    .community-footer-links {
+        gap: 10px 14px;
+    }
+    .leaderboard-controls,
+    .leaderboard-controls.row,
+    .leaderboard-controls .form,
+    .view-filters,
+    .view-filters.row,
+    .view-filters .form {
+        flex-direction: column !important;
+        align-items: stretch !important;
+    }
+    .leaderboard-controls > div,
+    .leaderboard-controls .form > div,
+    .view-filters > div,
+    .view-filters .form > div {
+        flex: 1 1 auto !important;
+        width: 100% !important;
+        max-width: 100% !important;
+    }
+    .ranking-table-scroll {
+        max-height: min(75vh, 640px);
+        width: 100%;
+    }
+    .ranking-table th,
+    .ranking-table td,
+    .prose .ranking-table th,
+    .prose .ranking-table td {
+        padding: 8px 10px !important;
+    }
+    .ranking-table .rank,
+    .prose .ranking-table .rank,
+    .ranking-table th.rank {
+        position: sticky !important;
+        left: 0 !important;
+        width: 2.4rem;
+        min-width: 2.4rem;
+        box-shadow: 6px 0 8px -6px rgba(0, 0, 0, 0.45);
+    }
+    .ranking-table .model-cell,
+    .prose .ranking-table .model-cell {
+        position: static !important;
+        left: auto !important;
+        z-index: auto;
+        min-width: 140px;
+        max-width: none;
+        background: transparent !important;
+    }
+    .ranking-table th.model-cell,
+    .prose .ranking-table th.model-cell {
+        position: sticky !important;
+        top: 0 !important;
+        left: auto !important;
+        z-index: 3;
+        min-width: 140px;
+        max-width: none;
+        background: var(--pruna-bg-header) !important;
+    }
+    .ranking-table tbody tr:hover .model-cell {
+        background: var(--pruna-table-hover) !important;
+    }
+    .compare-controls,
+    .compare-controls.row,
+    .compare-controls .form {
+        flex-direction: column !important;
+        flex-wrap: nowrap !important;
+        flex: 0 0 auto !important;
+        align-items: stretch !important;
+        align-content: flex-start !important;
+        height: auto !important;
+        min-height: 0 !important;
+        gap: 10px !important;
+        margin-bottom: 12px !important;
+    }
+    .compare-controls .compare-models,
+    .compare-controls .compare-prompt-count,
+    .compare-controls .compare-shuffle,
+    .compare-controls .form > div {
+        flex: 0 0 auto !important;
+        width: 100% !important;
+        max-width: 100% !important;
+        min-width: 0 !important;
+        height: auto !important;
+        min-height: 0 !important;
+        align-self: stretch !important;
+    }
+    .compare-controls .compare-prompt-count {
+        max-width: 100% !important;
+    }
+    .compare-controls .compare-models .wrap,
+    .compare-controls .compare-models .wrap-inner {
+        height: auto !important;
+        min-height: 40px !important;
+    }
+    .compare-controls .compare-shuffle,
+    .compare-controls .compare-shuffle button {
+        width: 100% !important;
+        align-self: stretch !important;
+        margin-top: 0 !important;
+    }
+    .compare-row {
+        grid-template-columns: 1fr !important;
+    }
+    .compare-prompt-meta {
+        flex-wrap: wrap;
+    }
+    .pareto-layout,
+    .pareto-layout.row,
+    .pareto-layout .form {
+        flex-direction: column !important;
+    }
+    .pareto-layout > .pareto-col,
+    .pareto-layout > div,
+    .pareto-layout .form > div {
+        flex: 1 1 auto !important;
+        width: 100% !important;
     }
 }
-.pareto-plot {
-    width: 100%;
+
+/* —— Workspace filters (dataset / metric / models) —— */
+.workspace-filters,
+.workspace-filters.block,
+.workspace-filters.column,
+.workspace-filters.gap {
+    margin: 0 0 12px;
+    padding: 0 !important;
+    gap: 12px !important;
+    overflow: visible !important;
+}
+.view-filters {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: flex-end !important;
+    gap: 12px !important;
+    margin: 0;
+    overflow: visible !important;
+}
+.view-filters > div,
+.view-filters > .block,
+.view-filters > .form {
+    flex: 1 1 0% !important;
+    min-width: 0 !important;
+}
+.view-filters > .block,
+.view-filters .form,
+.view-filters .block {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    overflow: visible !important;
+    --block-border-width: 0 !important;
+}
+.view-filters label {
+    display: block !important;
+    margin: 0 !important;
+    padding: 0 0 8px !important;
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.8rem !important;
+    font-weight: 500 !important;
+    line-height: 1.2 !important;
+}
+.view-filters .wrap {
+    min-width: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    overflow: visible !important;
+}
+.view-filters .wrap-inner {
+    display: flex !important;
+    flex-wrap: nowrap !important;
+    align-items: center !important;
+    gap: 6px !important;
+    min-height: 40px !important;
+    height: 40px !important;
+    padding: 0 10px !important;
+    border: 1px solid var(--pruna-input-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-input-bg) !important;
+    box-shadow: none !important;
+    overflow: hidden !important;
+}
+.view-filters .secondary-wrap {
+    display: flex !important;
+    flex-wrap: nowrap !important;
+    align-items: center !important;
+    flex: 1 1 auto !important;
+    min-width: 0 !important;
+    height: 40px !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    overflow: visible !important;
+}
+.view-filters .filter-chips .wrap-inner {
+    overflow-x: auto !important;
+    overflow-y: hidden !important;
+    overscroll-behavior-x: contain;
+    scrollbar-width: thin;
+    scrollbar-color: var(--pruna-border) transparent;
+}
+.view-filters .filter-chips .secondary-wrap {
+    min-width: 2.5rem !important;
+}
+.view-filters .filter-chips .wrap-inner::-webkit-scrollbar {
+    height: 6px;
+}
+.view-filters .filter-chips .wrap-inner::-webkit-scrollbar-thumb {
+    background: var(--pruna-border);
+    border-radius: 99px;
+}
+.view-filters .filter-chips .token {
+    flex: 0 0 auto !important;
+    white-space: nowrap !important;
+    word-break: keep-all !important;
+}
+.view-filters .filter-chips .token span {
+    white-space: nowrap !important;
+    overflow: hidden !important;
+    text-overflow: ellipsis !important;
+    max-width: 14rem;
+}
+.view-filters .token:empty {
+    display: none !important;
 }
-.pareto-plot .plotly {
+.view-filters input {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    min-height: 28px !important;
+    height: 28px !important;
     width: 100% !important;
+    min-width: 0 !important;
+    padding: 0 4px !important;
+    line-height: 28px !important;
+}
+.view-filters .dropdown-arrow,
+.view-filters .icon-wrap {
+    flex: 0 0 auto !important;
+    align-self: center !important;
+    margin-left: auto !important;
+}
+.view-title,
+.view-title.block,
+.view-title .padded {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 0 8px !important;
+}
+.view-title h1,
+.view-title .prose h1,
+.gradio-container .view-title h1 {
+    margin: 0.35rem 0 0.4rem !important;
+    font-size: 1.45rem !important;
+}
+.filter-help-host,
+.filter-help-host.block,
+.filter-help-host .padded,
+.filter-help-host .html-container,
+.filter-help-host .prose {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+}
+.view-help-host,
+.view-help-host.block,
+.view-help-host .padded,
+.view-help-host .html-container,
+.view-help-host .prose {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 0 10px !important;
+}
+.filter-help,
+.prose .filter-help,
+.view-help,
+.prose .view-help {
+    margin: 0 !important;
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.95rem !important;
+    line-height: 1.45 !important;
+    font-weight: 400 !important;
+}
+.view-help + .view-help,
+.prose .view-help + .view-help {
+    margin-top: 0.45rem !important;
+}
+.view-filters span[data-testid="block-info"],
+.view-filters .info,
+.view-filters .block-info {
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.75rem !important;
+    line-height: 1.35 !important;
+    margin-top: 4px !important;
 }
-.pareto-plot .js-plotly-plot,
-.pareto-plot .plot-container {
+.compare-prompt-block {
+    border: 1px solid var(--pruna-border) !important;
+    border-radius: 16px !important;
+    background: var(--pruna-card-bg) !important;
+    box-shadow: var(--pruna-card-shadow) !important;
+}
+
+/* Page footer — flat community strip + quiet citation accordion */
+.page-footer-host,
+.page-footer-host .html-container,
+.page-footer-host .prose,
+.page-footer-host.block,
+.page-footer-host .padded {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
     width: 100% !important;
+    max-width: none !important;
+    overflow: visible !important;
+}
+.page-footer {
+    margin: 32px 0 16px;
+    padding: 20px 0 0;
+    border-top: 1px solid var(--pruna-hairline);
+}
+.page-footer h3 {
+    margin: 0 0 10px !important;
+    font-size: 1.05rem !important;
+    font-weight: 600 !important;
+    letter-spacing: -0.015em !important;
+    text-transform: none !important;
+    color: var(--pruna-text-primary) !important;
 }
-/* Hide the Plotly toolbar so it doesn't cover points in the top-right. */
-.pareto-plot .modebar {
-    display: none !important;
+.community-footer-links {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px 16px;
+    align-items: center;
 }
-.leaderboard-summary {
-    display: grid;
-    grid-template-columns: repeat(4, minmax(0, 1fr));
-    gap: 12px;
-    margin: 8px 0 16px;
+.community-footer-links a {
+    color: var(--pruna-text-muted) !important;
+    text-decoration: none !important;
+    font-size: 0.9rem !important;
+    font-weight: 500 !important;
 }
-.leaderboard-summary > div {
-    padding: 14px 16px;
-    border: 1px solid #c4b5fd;
-    border-radius: 10px;
-    background: rgba(139, 92, 246, 0.14);
+.community-footer-links a:hover {
+    color: var(--pruna-link) !important;
 }
-.leaderboard-summary span,
-.results-heading {
-    color: #7e22ce;
-    font-size: 11px;
-    font-weight: 700;
-    letter-spacing: 0.05em;
+
+/* Citation accordion — full-width control, not a section heading */
+.citation-accordion {
+    margin: 0 0 28px !important;
+}
+.citation-accordion,
+.citation-accordion.block {
+    border: 1px solid var(--pruna-accordion-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-accordion-bg) !important;
+    box-shadow: none !important;
+    overflow: hidden !important;
+}
+.citation-accordion > .label-wrap,
+.citation-accordion .label-wrap {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 11px 14px !important;
+    font-size: 0.92rem !important;
+    font-weight: 500 !important;
+    color: var(--pruna-text-primary) !important;
+    letter-spacing: -0.01em !important;
+}
+.citation-accordion > .label-wrap:hover,
+.citation-accordion .label-wrap:hover {
+    background: var(--pruna-menu-hover-bg) !important;
+}
+.citation-accordion > .label-wrap span,
+.citation-accordion .label-wrap span {
+    color: var(--pruna-text-primary) !important;
+    font-size: 0.92rem !important;
+    font-weight: 500 !important;
+}
+.citation-accordion .icon,
+.citation-accordion .label-wrap .icon {
+    color: var(--pruna-text-muted) !important;
+    opacity: 0.9;
+}
+.citation-accordion .prose,
+.citation-accordion .markdown,
+.citation-accordion pre,
+.citation-accordion code {
+    color: var(--pruna-text-muted) !important;
+    background: transparent !important;
+    border: none !important;
+    box-shadow: none !important;
+}
+.citation-accordion .wrap,
+.citation-accordion > .wrap {
+    border-top: 1px solid var(--pruna-hairline) !important;
+    padding: 4px 14px 12px !important;
+    background: transparent !important;
+}
+.citation-accordion pre {
+    margin: 0 !important;
+    padding: 0 !important;
+    font-size: 0.8rem !important;
+    line-height: 1.55 !important;
+    overflow-x: auto;
 }
-.leaderboard-summary strong {
-    display: block;
-    margin-top: 4px;
-    color: #581c87;
-    font-size: 22px;
+
+.pareto-plot,
+.pareto-plot.block,
+.pareto-plot .plotly,
+.pareto-plot .js-plotly-plot,
+.pareto-plot .plot-container,
+.pareto-plot .svg-container,
+.pareto-plot .main-svg {
+    width: 100% !important;
+    max-width: 100% !important;
+    background: transparent !important;
+    border-color: var(--pruna-border) !important;
 }
+.pareto-plot .modebar { display: none !important; }
+
 .leaderboard-controls {
-    align-items: end;
-    margin-bottom: 8px;
-}
-.ranking-table-host {
-    width: 100%;
-}
-.ranking-table {
-    margin-top: 4px;
-    width: 100%;
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: flex-end !important;
+    gap: 10px !important;
+    margin-bottom: 12px;
+    overflow: visible !important;
+}
+.leaderboard-controls > div {
+    min-width: 0 !important;
+}
+.leaderboard-controls > .block,
+.leaderboard-controls .form,
+.leaderboard-controls .block {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    --block-border-width: 0 !important;
+}
+.leaderboard-controls label {
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.8rem !important;
+    font-weight: 500 !important;
+}
+.leaderboard-controls textarea {
+    min-height: 40px !important;
+    height: 40px !important;
+    padding: 0 12px !important;
+    border: 1px solid var(--pruna-input-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-input-bg) !important;
+    box-shadow: none !important;
+    color: var(--pruna-text-primary) !important;
+    font-family: var(--pruna-font) !important;
+    font-size: 0.9rem !important;
+    line-height: 40px !important;
+    resize: none !important;
+}
+.leaderboard-controls textarea:focus {
+    border-color: var(--pruna-focus-border) !important;
+    outline: none !important;
+    box-shadow: var(--pruna-focus-ring) !important;
+}
+.leaderboard-controls .wrap {
+    min-height: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    overflow: visible !important;
+}
+.leaderboard-controls .wrap-inner {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: center !important;
+    gap: 6px !important;
+    min-height: 40px !important;
+    height: auto !important;
+    padding: 4px 10px !important;
+    border: 1px solid var(--pruna-input-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-input-bg) !important;
+    box-shadow: none !important;
+    overflow: visible !important;
+}
+.leaderboard-controls .secondary-wrap {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: center !important;
+    gap: 6px !important;
+    flex: 1 1 auto !important;
+    min-width: 0 !important;
+    min-height: 0 !important;
+    height: auto !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+}
+.leaderboard-controls .token {
+    display: inline-flex !important;
+    align-items: center !important;
+    max-width: 100% !important;
+    margin: 0 !important;
+}
+.leaderboard-controls .token:empty {
+    display: none !important;
 }
-.results-heading {
-    display: flex;
-    justify-content: space-between;
-    margin: 16px 0 8px;
-    text-transform: uppercase;
+.leaderboard-controls .dropdown-arrow,
+.leaderboard-controls .icon-wrap {
+    flex: 0 0 auto !important;
+    align-self: center !important;
+    margin-left: auto !important;
+}
+.ranking-table-host,
+.ranking-table-host .html-container,
+.ranking-table-host .prose,
+.ranking-table-host.block,
+.ranking-table-host .padded,
+.ranking-table-host.prose {
+    display: grid !important;
+    grid-template-columns: minmax(0, 1fr) !important;
+    border: none !important;
+    outline: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    min-width: 0 !important;
+    overflow: hidden !important;
+    --block-border-width: 0 !important;
 }
 .ranking-table-scroll {
+    border: 1px solid var(--pruna-menu-border);
+    border-radius: 12px;
+    background: var(--pruna-menu-bg);
+    box-shadow: none;
+    width: 100%;
+    max-width: 100%;
+    min-width: 0;
+    max-height: min(70vh, 720px);
     overflow-x: auto;
-    border: 1px solid #c4b5fd;
-    border-radius: 10px;
-    background: rgba(139, 92, 246, 0.12);
+    overflow-y: auto;
+    -webkit-overflow-scrolling: touch;
+    overscroll-behavior-x: contain;
 }
-.ranking-table table {
+.ranking-table,
+.prose .ranking-table {
     width: 100%;
-    min-width: 800px;
-    border-collapse: collapse;
-    color: #581c87;
-    font-size: 14px;
-}
-.ranking-table th {
-    padding: 11px 14px;
-    border-bottom: 1px solid #c4b5fd;
-    color: #7e22ce;
-    font-size: 11px;
+    margin: 0 !important;
+    overflow: visible;
+}
+.ranking-table table,
+.prose .ranking-table table {
+    display: table !important;
+    width: max-content !important;
+    min-width: 100% !important;
+    max-width: none !important;
+    margin: 0 !important;
+    border-collapse: separate !important;
+    border-spacing: 0 !important;
+    color: var(--pruna-text-body) !important;
+    font-size: 13px !important;
+    line-height: 1.35 !important;
+    background: transparent !important;
+    border: none !important;
+    outline: none !important;
+}
+.ranking-table thead { display: table-header-group !important; }
+.ranking-table tbody { display: table-row-group !important; }
+.ranking-table tr { display: table-row !important; }
+.ranking-table th,
+.ranking-table td,
+.prose .ranking-table th,
+.prose .ranking-table td {
+    display: table-cell !important;
+    vertical-align: middle !important;
+    padding: 11px 14px !important;
+    border: 0 !important;
+    border-bottom: 1px solid var(--pruna-hairline) !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    outline: none !important;
+}
+.ranking-table th,
+.prose .ranking-table th {
+    position: sticky;
+    top: 0;
+    z-index: 3;
+    background: var(--pruna-bg-header) !important;
+    color: var(--pruna-text-muted) !important;
+    font-size: 11px !important;
+    font-weight: 600 !important;
     letter-spacing: 0.04em;
     text-align: left;
     text-transform: uppercase;
-}
-.ranking-table th.sortable-col {
-    cursor: pointer;
-    user-select: none;
     white-space: nowrap;
+    box-shadow: 0 1px 0 var(--pruna-hairline) !important;
 }
-.ranking-table th.sortable-col:hover {
-    color: #4c1d95;
-}
+.ranking-table th.sortable-col { cursor: pointer; user-select: none; }
+.ranking-table th.sortable-col:hover { color: var(--pruna-lavender) !important; }
 .ranking-table th.sortable-col.sorted-asc::after,
 .ranking-table th.sortable-col.sorted-desc::after {
     margin-left: 0.35em;
     font-size: 0.85em;
     opacity: 0.85;
 }
-.ranking-table th.sortable-col.sorted-asc::after {
-    content: "▲";
-}
-.ranking-table th.sortable-col.sorted-desc::after {
-    content: "▼";
-}
-.ranking-table td {
-    padding: 13px 14px;
-    border-bottom: 1px solid #e9d5ff;
-}
-.ranking-table tbody tr:last-child td {
-    border-bottom: 0;
-}
-.ranking-table tbody tr:hover {
-    background: #6d28d9;
+.ranking-table th.sortable-col.sorted-asc::after { content: "▲"; }
+.ranking-table th.sortable-col.sorted-desc::after { content: "▼"; }
+.ranking-table tbody tr:last-child td { border-bottom: 0 !important; }
+.ranking-table tbody tr:hover td {
+    background: var(--pruna-table-hover) !important;
 }
 .ranking-table tbody tr:hover td,
 .ranking-table tbody tr:hover .rank,
 .ranking-table tbody tr:hover .metric-score,
+.ranking-table tbody tr:hover .text-cell,
 .ranking-table tbody tr:hover .model-cell strong,
-.ranking-table tbody tr:hover .model-cell span {
-    color: #ffffff;
+.ranking-table tbody tr:hover .model-cell span { color: var(--pruna-table-hover-text) !important; }
+.ranking-table .rank,
+.prose .ranking-table .rank {
+    position: sticky;
+    left: 0;
+    z-index: 1;
+    box-sizing: border-box;
+    width: 3.25rem;
+    min-width: 3.25rem;
+    color: var(--pruna-lavender) !important;
+    font-weight: 700 !important;
+    text-align: center;
+    background: var(--pruna-table-sticky) !important;
 }
-.ranking-table .rank {
-    color: #7c3aed;
-    font-weight: 700;
+.ranking-table th.rank,
+.prose .ranking-table th.rank {
+    top: 0;
+    left: 0;
+    z-index: 5;
+    text-align: center;
+    background: var(--pruna-bg-header) !important;
+}
+.ranking-table .model-cell,
+.prose .ranking-table .model-cell {
+    position: sticky;
+    left: 3.25rem;
+    z-index: 1;
+    min-width: 180px;
+    max-width: 260px;
+    background: var(--pruna-table-sticky) !important;
+}
+.ranking-table th.model-cell,
+.prose .ranking-table th.model-cell {
+    top: 0;
+    left: 3.25rem;
+    z-index: 5;
+    background: var(--pruna-bg-header) !important;
+}
+.ranking-table tbody tr:hover .rank,
+.ranking-table tbody tr:hover .model-cell {
+    background: var(--pruna-table-sticky-hover) !important;
 }
 .ranking-table .model-cell strong,
-.ranking-table .model-cell span {
-    display: block;
+.ranking-table .model-cell span { display: block; }
+.ranking-table .model-cell strong {
+    color: var(--pruna-text-primary) !important;
+    font-weight: 600 !important;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 .ranking-table .model-cell span {
     margin-top: 3px;
-    color: #9333ea;
+    color: var(--pruna-text-muted) !important;
     font-size: 12px;
 }
-.ranking-table .metric-score {
-    color: #4c1d95;
+.ranking-table .text-cell,
+.prose .ranking-table .text-cell {
+    color: var(--pruna-text-muted) !important;
+    font-weight: 500 !important;
+    white-space: nowrap;
+}
+.ranking-table .metric-score,
+.prose .ranking-table .metric-score {
+    color: var(--pruna-text-primary) !important;
     font-variant-numeric: tabular-nums;
-    font-weight: 700;
+    font-weight: 600 !important;
+    text-align: right;
+    white-space: nowrap;
 }
+.ranking-table th.metric-score { text-align: right; }
 .ranking-table .empty-state {
-    color: #9333ea;
+    color: var(--pruna-text-muted);
     padding: 32px;
     text-align: center;
 }
-@media (prefers-color-scheme: dark) {
-    .leaderboard-summary > div,
-    .ranking-table-scroll {
-        border-color: rgba(221, 214, 254, 0.45);
-    }
-    .leaderboard-summary span,
-    .results-heading,
-    .ranking-table th,
-    .ranking-table .model-cell span,
-    .ranking-table .empty-state {
-        color: #ddd6fe;
-    }
-    .leaderboard-summary strong,
-    .ranking-table table,
-    .ranking-table .rank,
-    .ranking-table .metric-score {
-        color: #f5f3ff;
-    }
-    .ranking-table td {
-        border-bottom-color: rgba(221, 214, 254, 0.2);
-    }
+
+.compare-samples-help { color: var(--pruna-text-body); margin-bottom: 8px; }
+.compare-controls,
+.compare-controls.row,
+.compare-controls.column,
+.compare-controls .form {
+    display: flex !important;
+    flex-direction: column !important;
+    flex-wrap: nowrap !important;
+    align-items: stretch !important;
+    align-content: flex-start !important;
+    justify-content: flex-start !important;
+    gap: 12px !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    flex-grow: 0 !important;
+    height: auto !important;
+    min-height: 0 !important;
+    margin-bottom: 16px;
+}
+.compare-controls > .block,
+.compare-controls .form,
+.compare-controls .block,
+.compare-controls .compare-models,
+.compare-controls .compare-prompt-count {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    --block-border-width: 0 !important;
+    height: auto !important;
+    min-height: 0 !important;
+}
+.compare-controls label,
+.compare-controls span[data-testid="block-info"] {
+    display: block !important;
+    margin: 0 0 6px !important;
+    padding: 0 !important;
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.8rem !important;
+    font-weight: 500 !important;
+    line-height: 1.2 !important;
+}
+.compare-controls .compare-models span[data-testid="block-info"] {
+    min-height: 1.15rem;
+}
+.compare-controls .compare-models {
+    flex: 0 0 auto !important;
+    width: 100% !important;
+    min-width: 0 !important;
+    max-width: 100% !important;
+    align-self: stretch !important;
 }
-.dark .leaderboard-summary > div,
-.dark .ranking-table-scroll {
-    border-color: rgba(221, 214, 254, 0.45);
+.compare-controls .compare-prompt-count {
+    flex: 0 0 auto !important;
+    width: 100% !important;
+    min-width: 0 !important;
+    max-width: 100% !important;
+    align-self: stretch !important;
 }
-.dark .leaderboard-summary span,
-.dark .results-heading,
-.dark .ranking-table th,
-.dark .ranking-table .model-cell span,
-.dark .ranking-table .empty-state {
-    color: #ddd6fe;
+.compare-controls .compare-shuffle {
+    flex: 0 0 auto !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    align-self: stretch !important;
+}
+.compare-controls .compare-models .wrap,
+.compare-controls .compare-models .wrap-inner {
+    min-height: 40px !important;
+    height: auto !important;
+    overflow: hidden !important;
+    border: 1px solid var(--pruna-input-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-input-bg) !important;
+    box-shadow: none !important;
+}
+.compare-controls .compare-models .wrap-inner {
+    display: flex !important;
+    flex-direction: row !important;
+    flex-wrap: wrap !important;
+    align-items: center !important;
+    gap: 6px !important;
+    width: 100% !important;
+    padding: 4px 8px !important;
+}
+.compare-controls .compare-models .secondary-wrap {
+    display: flex !important;
+    flex-direction: row !important;
+    flex-wrap: wrap !important;
+    align-items: center !important;
+    gap: 6px !important;
+    flex: 1 1 auto !important;
+    width: auto !important;
+    min-width: 0 !important;
+    height: auto !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+}
+.compare-controls .compare-models .token {
+    display: inline-flex !important;
+    align-items: center !important;
+    justify-content: center !important;
+    width: auto !important;
+    max-width: 100% !important;
+    margin: 0 !important;
+    white-space: nowrap !important;
+}
+.compare-controls .compare-models .token:empty {
+    display: none !important;
 }
-.dark .leaderboard-summary strong,
-.dark .ranking-table table,
-.dark .ranking-table .rank,
-.dark .ranking-table .metric-score {
-    color: #f5f3ff;
+.compare-controls .compare-models input {
+    width: auto !important;
+    min-width: 2.5rem !important;
+    flex: 1 1 5rem !important;
+    height: 28px !important;
+    min-height: 28px !important;
+}
+.compare-controls .compare-models .dropdown-arrow,
+.compare-controls .compare-models .icon-wrap {
+    flex: 0 0 auto !important;
+    align-self: center !important;
+    margin-left: auto !important;
+}
+.compare-controls .compare-prompt-count .wrap {
+    display: grid !important;
+    grid-template-columns: minmax(0, 1fr) auto;
+    grid-template-rows: auto 40px;
+    gap: 6px 10px;
+    align-items: center;
+    width: 100%;
+    min-height: 0 !important;
+    height: auto !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+}
+.compare-controls .compare-prompt-count .head {
+    display: block !important;
+    grid-column: 1 / -1;
+    grid-row: 1;
+    margin: 0 !important;
+}
+.compare-controls .compare-prompt-count .head label {
+    grid-column: 1 / -1;
+    grid-row: 1;
+}
+.compare-controls .compare-prompt-count .tab-like-container {
+    grid-column: 2;
+    grid-row: 2;
+    height: 40px !important;
+    min-height: 40px !important;
+    align-self: stretch;
+    border: 1px solid var(--pruna-input-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-input-bg) !important;
+    overflow: hidden;
+}
+.compare-controls .compare-prompt-count .slider_input_container {
+    grid-column: 1;
+    grid-row: 2;
+    height: 40px !important;
+    min-height: 40px !important;
+    margin: 0 !important;
+    gap: 0 !important;
+}
+.compare-controls .compare-prompt-count .min_value,
+.compare-controls .compare-prompt-count .max_value {
+    display: none !important;
 }
-.compare-samples-help {
-    color: #6b21a8;
-    margin-bottom: 8px;
+.compare-controls .compare-prompt-count input[type="range"] {
+    height: 40px !important;
+    min-width: 0 !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    background: transparent !important;
+    border: none !important;
+    box-shadow: none !important;
+}
+.compare-controls .compare-prompt-count input[type="number"] {
+    height: 40px !important;
+    min-height: 40px !important;
+    min-width: 2.5rem !important;
+    margin: 0 !important;
+    padding: 0 8px !important;
+    line-height: 40px !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+}
+.compare-controls .compare-shuffle.block:not(button) {
+    width: 100% !important;
+    max-width: 100% !important;
+    align-self: stretch !important;
+    background: transparent !important;
+    border: none !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+}
+.compare-controls button.compare-shuffle,
+.compare-controls .compare-shuffle button,
+.compare-controls .compare-shuffle button.primary,
+.compare-controls .compare-shuffle button.secondary {
+    display: inline-flex !important;
+    justify-content: center !important;
+    align-items: center !important;
+    width: 100% !important;
+    min-width: 0 !important;
+    height: 44px !important;
+    min-height: 44px !important;
+    margin: 0 !important;
+    padding: 0 16px !important;
+    border-radius: 10px !important;
+    align-self: stretch !important;
+    appearance: none !important;
+    -webkit-appearance: none !important;
+    -webkit-tap-highlight-color: transparent !important;
+    background: var(--pruna-accent) !important;
+    border: 1px solid color-mix(in oklab, var(--pruna-accent) 72%, transparent) !important;
+    color: #fff !important;
+    font-family: var(--pruna-font) !important;
+    font-size: 0.95rem !important;
+    font-weight: 600 !important;
+    letter-spacing: -0.01em !important;
+    box-shadow: inset 0 1px #fff3 !important;
+    outline: none !important;
+}
+.compare-controls button.compare-shuffle:hover,
+.compare-controls button.compare-shuffle:active,
+.compare-controls button.compare-shuffle:focus,
+.compare-controls button.compare-shuffle:focus-visible,
+.compare-controls .compare-shuffle button:hover,
+.compare-controls .compare-shuffle button:active,
+.compare-controls .compare-shuffle button:focus,
+.compare-controls .compare-shuffle button:focus-visible {
+    background: var(--pruna-accent) !important;
+    border-color: color-mix(in oklab, var(--pruna-accent) 72%, transparent) !important;
+    color: #fff !important;
+    outline: none !important;
+    box-shadow: inset 0 1px #fff3 !important;
+    -webkit-tap-highlight-color: transparent !important;
+}
+@media (min-width: 701px) {
+    .compare-controls,
+    .compare-controls.row,
+    .compare-controls.column,
+    .compare-controls .form {
+        flex-direction: row !important;
+        flex-wrap: nowrap !important;
+        align-items: flex-end !important;
+    }
+    .compare-controls .compare-models {
+        flex: 4 1 0 !important;
+        width: auto !important;
+        max-width: none !important;
+        align-self: flex-end !important;
+    }
+    .compare-controls .compare-prompt-count {
+        flex: 1 1 200px !important;
+        width: auto !important;
+        min-width: 180px !important;
+        max-width: 280px !important;
+        align-self: flex-end !important;
+    }
+    .compare-controls .compare-shuffle,
+    .compare-controls .compare-shuffle.block:not(button) {
+        flex: 0 0 auto !important;
+        width: auto !important;
+        max-width: none !important;
+        align-self: flex-end !important;
+    }
+    .compare-controls button.compare-shuffle,
+    .compare-controls .compare-shuffle button {
+        width: auto !important;
+        min-width: 10.5rem !important;
+    }
 }
 .compare-prompt-block {
     margin: 0 0 22px;
     padding: 14px 16px;
-    border: 1px solid #c4b5fd;
-    border-radius: 12px;
-    background: rgba(139, 92, 246, 0.10);
+    background: var(--pruna-callout-bg) !important;
 }
 .compare-prompt-meta {
     display: flex;
     justify-content: space-between;
     gap: 12px;
     margin-bottom: 8px;
-    color: #7e22ce;
+    color: var(--pruna-text-muted);
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 0.04em;
@@ -431,20 +1557,221 @@ custom_css = """
 }
 .compare-prompt-text {
     margin: 0 0 14px;
-    color: #3b0764;
+    color: var(--pruna-text-body);
     font-size: 15px;
     line-height: 1.45;
 }
-.compare-row {
-    display: grid;
-    gap: 12px;
+.compare-gallery,
+.compare-gallery.block,
+.compare-gallery .html-container,
+.compare-gallery .prose {
+    width: 100% !important;
+    max-width: 100% !important;
+    min-width: 0 !important;
+    overflow-x: hidden !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+}
+.compare-row { display: grid; gap: 12px; min-width: 0; width: 100%; }
+.compare-prompt-text { overflow-wrap: anywhere; word-break: break-word; }
+.pareto-heading-row,
+.pareto-heading-row.row,
+.pareto-heading-row .form {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: center !important;
+    gap: 8px 12px !important;
+    width: 100% !important;
+    margin-bottom: 0.4rem !important;
+}
+.pareto-heading-row .pareto-subhead,
+.pareto-heading-row > div:first-child,
+.pareto-heading-row .form > div:first-child {
+    flex: 1 1 240px !important;
+    min-width: 0 !important;
+    margin: 0 !important;
+}
+.pareto-heading-row .pareto-scale-control {
+    display: flex !important;
+    flex-direction: row !important;
+    align-items: center !important;
+    justify-content: flex-end !important;
+    flex: 0 0 auto !important;
+    gap: 0 !important;
+    margin-left: auto !important;
+    max-width: 168px !important;
+    padding: 0 !important;
+}
+.pareto-scale-all-row,
+.pareto-scale-all-row.row,
+.pareto-scale-all-row .form {
+    display: flex !important;
+    flex-direction: row !important;
+    flex-wrap: wrap !important;
+    align-items: center !important;
+    justify-content: flex-start !important;
+    gap: 8px 12px !important;
+    width: 100% !important;
+    margin: 2px 0 14px !important;
+}
+.pareto-scale-all-row .html-container,
+.pareto-scale-all-row .block {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    width: auto !important;
+    flex: 0 0 auto !important;
+}
+.pareto-scale-all-row .html-container {
+    flex: 1 1 auto !important;
+    min-width: 0 !important;
+}
+.pareto-scale-all-label {
+    color: var(--pruna-text-muted);
+    font-size: 0.8rem;
+    font-weight: 500;
+    white-space: nowrap;
 }
-.compare-cell {
-    min-width: 0;
+.pareto-scale-all-row .pareto-scale-toggle {
+    margin-left: auto !important;
+}
+.pareto-scale-toggle,
+.pareto-scale-toggle.block {
+    min-width: 0 !important;
+    width: auto !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+}
+.pareto-scale-toggle .wrap,
+.pareto-scale-toggle .form {
+    display: block !important;
+    width: auto !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+}
+.pareto-scale-toggle legend {
+    display: none !important;
+}
+.pareto-scale-toggle fieldset,
+.pareto-scale-toggle .wrap:has(> label),
+.pareto-scale-toggle .form:has(> label) {
+    position: relative !important;
+    display: grid !important;
+    grid-template-columns: 1fr 1fr !important;
+    align-items: stretch !important;
+    isolation: isolate;
+    box-sizing: border-box !important;
+    width: max-content !important;
+    min-width: 0 !important;
+    padding: 4px !important;
+    gap: 4px !important;
+    border: 1px solid var(--pruna-input-border) !important;
+    border-radius: 10px !important;
+    background: var(--pruna-toggle-track) !important;
+    box-shadow: none !important;
+}
+.pareto-scale-toggle fieldset::before,
+.pareto-scale-toggle .wrap:has(> label)::before,
+.pareto-scale-toggle .form:has(> label)::before {
+    content: none !important;
+}
+.pareto-scale-toggle label {
+    position: relative !important;
+    z-index: 1 !important;
+    display: flex !important;
+    flex: 1 1 auto !important;
+    align-items: center !important;
+    justify-content: center !important;
+    gap: 0 !important;
+    box-sizing: border-box !important;
+    min-width: 58px !important;
+    min-height: 26px !important;
+    margin: 0 !important;
+    padding: 5px 12px !important;
+    border: none !important;
+    border-radius: 6px !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    color: var(--pruna-text-body) !important;
+    font-size: 0.72rem !important;
+    font-weight: 600 !important;
+    line-height: 1.2 !important;
+    letter-spacing: 0.01em;
+    white-space: nowrap;
+    cursor: pointer !important;
+}
+.pareto-scale-toggle-all label {
+    min-width: 68px !important;
+    min-height: 30px !important;
+    padding: 6px 14px !important;
+    font-size: 0.85rem !important;
+}
+.pareto-scale-toggle label span {
+    margin: 0 !important;
+    padding: 0 !important;
+    color: inherit !important;
+    opacity: 1 !important;
+}
+.pareto-scale-toggle label > * + * {
+    margin-left: 0 !important;
+}
+.pareto-scale-toggle label + label::before,
+.pareto-scale-toggle label + label {
+    content: none !important;
+    border-left: none !important;
+}
+.pareto-scale-toggle input[type="radio"] {
+    position: absolute !important;
+    appearance: none !important;
+    opacity: 0 !important;
+    width: 0 !important;
+    height: 0 !important;
+    margin: 0 !important;
+    pointer-events: none !important;
+}
+.pareto-scale-toggle label:hover {
+    background: transparent !important;
+    color: var(--pruna-text-primary) !important;
+}
+.pareto-scale-toggle label.selected,
+.pareto-scale-toggle label:has(input:checked) {
+    background: var(--pruna-toggle-thumb) !important;
+    color: var(--pruna-lavender) !important;
+    font-weight: 700 !important;
+    border-color: transparent !important;
+    box-shadow: var(--pruna-toggle-thumb-shadow) !important;
+}
+.pareto-layout,
+.pareto-layout.row,
+.pareto-layout .form {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    align-items: stretch !important;
+    gap: 16px !important;
+    width: 100% !important;
+    max-width: 100% !important;
+}
+.pareto-layout > .pareto-col,
+.pareto-layout .form > .pareto-col {
+    flex: 1 1 360px !important;
+    min-width: 0 !important;
+    max-width: 100% !important;
 }
+.compare-cell { min-width: 0; }
 .compare-model-label {
     margin-bottom: 6px;
-    color: #5b21b6;
+    color: var(--pruna-lavender);
     font-size: 13px;
     font-weight: 700;
     word-break: break-word;
@@ -454,57 +1781,341 @@ custom_css = """
     width: 100%;
     aspect-ratio: 1 / 1;
     object-fit: cover;
-    border-radius: 10px;
-    border: 1px solid #ddd6fe;
-    background: #f5f3ff;
+    border-radius: 12px;
+    border: 1px solid var(--pruna-border);
+    background: var(--pruna-bg-elevated);
 }
-.compare-empty {
-    padding: 18px;
-    border: 1px dashed #c4b5fd;
+.compare-empty,
+.pareto-note-copy {
+    margin: 0;
+    padding: 14px 16px;
+    background: var(--pruna-callout-bg, var(--pruna-bg-card));
+    border: 1px dashed color-mix(in oklab, var(--pruna-border) 70%, transparent);
     border-radius: 10px;
-    color: #6b21a8;
-    text-align: center;
+    color: var(--pruna-text-muted);
+    font-size: 0.95rem;
+    line-height: 1.5;
+    text-align: left;
+}
+
+/*
+  Type scale (playground-like):
+  product title > page h1 > section h2/h3 > meta labels > body
+  Uppercase lavender is reserved for meta labels only — not section titles.
+*/
+.app-header-brand h1,
+.prose .app-header-brand h1,
+.gradio-container .app-header-brand h1,
+.app-header .app-header-brand h1 {
+    display: block !important;
+    width: max-content !important;
+    max-width: 100% !important;
+    flex: 0 0 auto !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    text-align: center !important;
+    font-size: clamp(1.9rem, 3vw, 2.4rem) !important;
+    font-weight: 700 !important;
+    letter-spacing: -0.035em;
+    line-height: 1 !important;
+    color: var(--pruna-text-primary) !important;
+}
+.app-header-tagline,
+.prose .app-header-tagline,
+.gradio-container .app-header-tagline,
+.prose p.app-header-tagline {
+    display: block !important;
+    width: 100% !important;
+    margin: 8px 0 0 !important;
+    padding: 0 !important;
+    text-align: center !important;
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.95rem !important;
+    line-height: 1.45 !important;
+    font-weight: 400 !important;
+}
+
+.gradio-container h1,
+.markdown h1, .md h1, .prose h1 {
+    margin: 0 0 0.65rem !important;
+    padding: 0 !important;
+    color: var(--pruna-text-primary) !important;
+    font-family: var(--pruna-font) !important;
+    font-size: 1.5rem !important;
+    font-weight: 700 !important;
+    letter-spacing: -0.03em !important;
+    line-height: 1.2 !important;
+    text-transform: none !important;
+}
+.gradio-container h2,
+.markdown h2, .md h2, .prose h2 {
+    margin: 1.75rem 0 0.75rem !important;
+    padding: 0 !important;
+    color: var(--pruna-text-primary) !important;
+    font-family: var(--pruna-font) !important;
+    font-size: 1.25rem !important;
+    font-weight: 600 !important;
+    letter-spacing: -0.02em !important;
+    line-height: 1.3 !important;
+    text-transform: none !important;
+}
+.gradio-container h3,
+.markdown h3, .md h3, .prose h3 {
+    margin: 1.35rem 0 0.5rem !important;
+    padding: 0 !important;
+    color: var(--pruna-text-primary) !important;
+    font-family: var(--pruna-font) !important;
+    font-size: 1.05rem !important;
+    font-weight: 600 !important;
+    letter-spacing: -0.015em !important;
+    line-height: 1.35 !important;
+    text-transform: none !important;
+}
+.gradio-container h4,
+.markdown h4, .md h4, .prose h4 {
+    margin: 1rem 0 0.4rem !important;
+    padding: 0 !important;
+    color: var(--pruna-text-body) !important;
+    font-family: var(--pruna-font) !important;
+    font-size: 0.95rem !important;
+    font-weight: 600 !important;
+    letter-spacing: -0.01em !important;
+    line-height: 1.35 !important;
+    text-transform: none !important;
+}
+
+.markdown, .md, .prose,
+.gradio-container .markdown,
+.gradio-container .prose {
+    overflow-wrap: break-word;
+    max-width: 100%;
 }
-.dark .compare-samples-help,
-.dark .compare-prompt-meta,
-.dark .compare-model-label,
-.dark .compare-empty {
-    color: #e9d5ff;
+.markdown p, .md p, .prose p,
+.gradio-container .markdown p {
+    margin: 0 0 0.8rem !important;
+    color: var(--pruna-text-body) !important;
+    font-size: 0.95rem !important;
+    font-weight: 400 !important;
+    line-height: 1.55 !important;
 }
-.dark .compare-prompt-block {
-    border-color: #6d28d9;
-    background: rgba(76, 29, 149, 0.35);
+.markdown li, .md li, .prose li {
+    color: var(--pruna-text-body) !important;
+    font-size: 0.95rem;
+    line-height: 1.5;
 }
-.dark .compare-prompt-text {
-    color: #f5f3ff;
+.markdown strong, .md strong, .prose strong {
+    color: var(--pruna-text-primary) !important;
+    font-weight: 600 !important;
 }
-.dark .compare-cell img {
-    border-color: #6d28d9;
-    background: #2e1065;
+
+label, .block-label span {
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.8rem !important;
+    font-weight: 500 !important;
 }
-.dark .ranking-table td {
-    border-bottom-color: rgba(221, 214, 254, 0.2);
+a { color: var(--pruna-link); }
+
+/* Gradio form chrome → playground */
+button.primary, .gr-button-primary, .primary-button,
+button.primary:hover, button.primary:active, button.primary:focus,
+.gr-button-primary:hover, .gr-button-primary:active {
+    background: var(--pruna-accent) !important;
+    border: 1px solid color-mix(in oklab, var(--pruna-accent) 72%, transparent) !important;
+    color: #fff !important;
+    border-radius: 8px !important;
+    box-shadow: inset 0 1px #fff3 !important;
+    font-weight: 600 !important;
+    outline: none !important;
+    -webkit-tap-highlight-color: transparent !important;
+}
+button.secondary:active, button.secondary:focus,
+.gr-button-secondary:active {
+    outline: none !important;
+    -webkit-tap-highlight-color: transparent !important;
+}
+.block, .gr-group, .form, .panel {
+    border-color: var(--pruna-border) !important;
+    background: transparent !important;
+}
+input, textarea, select {
+    background: var(--pruna-bg-card) !important;
+    border-color: var(--pruna-border) !important;
+    color: var(--pruna-text-primary) !important;
+    border-radius: 10px !important;
+}
+.view-filters input,
+.leaderboard-controls .wrap-inner input {
+    background: transparent !important;
+    border: none !important;
+    box-shadow: none !important;
+    min-height: 28px !important;
+    height: 28px !important;
+    padding: 0 4px !important;
+    line-height: 28px !important;
+}
+.view-filters .wrap-inner:focus-within,
+.leaderboard-controls .wrap-inner:focus-within {
+    border-color: var(--pruna-focus-border) !important;
+    box-shadow: var(--pruna-focus-ring) !important;
+}
+footer, .footer { display: none !important; }
+
+.pareto-note,
+.pareto-note.block,
+.pareto-note .html-container,
+.pareto-note .prose {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 0 12px !important;
+}
+.pareto-metric-block {
+    padding-bottom: 0.5rem;
+    border-bottom: 1px solid var(--pruna-hairline);
+}
+.pareto-metric-block:last-child {
+    border-bottom: none;
+}
+.pareto-metric-title {
+    margin: 0 0 0.75rem;
+    color: var(--pruna-text-primary);
+    font-size: 1.05rem;
+    font-weight: 600;
 }
-@media (max-width: 700px) {
-    .leaderboard-summary {
-        grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
+.pareto-subhead,
+.pareto-subhead.block,
+.pareto-subhead .prose,
+.pareto-subhead .html-container {
+    border: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 0 0.4rem !important;
+    color: var(--pruna-text-muted);
+}
+.pareto-subhead h4,
+.pareto-subhead .prose h4 {
+    margin: 0 !important;
+    color: var(--pruna-text-muted) !important;
+    font-size: 0.95rem !important;
+    font-weight: 600 !important;
 }
-h1, h2 {
-    margin: 0;
-    padding-top: 0;
+
+.options,
+ul.options {
+    position: absolute !important;
+    top: calc(100% + 4px) !important;
+    bottom: auto !important;
+    left: 0 !important;
+    right: auto !important;
+    width: 100% !important;
+    max-height: min(280px, 60vh) !important;
+    background: var(--pruna-bg-card) !important;
+    color: var(--pruna-text-primary) !important;
+    border: 1px solid var(--pruna-border) !important;
+    border-radius: 10px !important;
+    overflow: auto !important;
+    z-index: 50 !important;
+}
+.options .item:first-child,
+.options li:first-child {
+    border-top-left-radius: 10px !important;
+    border-top-right-radius: 10px !important;
+}
+.options .item:last-child,
+.options li:last-child {
+    border-bottom-left-radius: 10px !important;
+    border-bottom-right-radius: 10px !important;
+}
+.dropdown-arrow-inner {
+    background: var(--pruna-bg-card) !important;
+    color: var(--pruna-text-primary) !important;
+    border-color: var(--pruna-border) !important;
+}
+.options .item,
+.options li {
+    color: var(--pruna-text-primary) !important;
+}
+.options .item:hover,
+.options li:hover,
+.options .item.selected {
+    background: var(--pruna-dropdown-hover) !important;
+    color: var(--pruna-text-primary) !important;
+}
+input[type="range"] {
+    accent-color: var(--pruna-accent);
 }
 """
 
-theme = gr.Theme.from_hub("Werli/Purple-Crimson-Gradio-Theme").set(
-    body_background_fill="#c4b5fd",
-    body_background_fill_dark="#120B1B",
-    body_text_color="#3b0764",
-    body_text_color_dark="#ffffff",
-    block_background_fill="#ede9fe",
-    block_background_fill_dark="#2e1065",
+theme = gr.themes.Base(
+    primary_hue=gr.themes.Color(
+        c50="#faf5ff",
+        c100="#f3e8ff",
+        c200="#e9d5ff",
+        c300="#d8b4fe",
+        c400="#c084fc",
+        c500="#9334e9",
+        c600="#9334e9",
+        c700="#7e22ce",
+        c800="#6b21a8",
+        c900="#3b0764",
+        c950="#120b1b",
+    ),
+    secondary_hue="zinc",
+    neutral_hue="zinc",
+    font=[gr.themes.GoogleFont("Inter"), "ui-sans-serif", "system-ui", "sans-serif"],
+    font_mono=[gr.themes.GoogleFont("IBM Plex Mono"), "ui-monospace", "monospace"],
+).set(
+    body_background_fill="#f6f3fa",
+    body_background_fill_dark="#120b1b",
+    body_text_color="#18181b",
+    body_text_color_dark="#fafafa",
+    body_text_color_subdued="#71717a",
+    body_text_color_subdued_dark="#a3a3a3",
+    background_fill_primary="#f6f3fa",
+    background_fill_primary_dark="#120b1b",
+    background_fill_secondary="#ffffff",
+    background_fill_secondary_dark="#171021",
+    block_background_fill="#ffffff",
+    block_background_fill_dark="#1d1429",
+    block_border_color="#e4d7f2",
+    block_border_color_dark="#4a3962bf",
+    block_label_text_color="#71717a",
+    block_label_text_color_dark="#a3a3a3",
+    block_title_text_color="#18181b",
+    block_title_text_color_dark="#fafafa",
+    border_color_primary="#e4d7f2",
+    border_color_primary_dark="#4a3962bf",
+    button_primary_background_fill="#9334e9",
+    button_primary_background_fill_dark="#9334e9",
+    button_primary_background_fill_hover="#7c22ce",
+    button_primary_background_fill_hover_dark="#8f35ff",
+    button_primary_text_color="#ffffff",
+    button_primary_text_color_dark="#ffffff",
+    button_secondary_background_fill="#ffffff",
+    button_secondary_background_fill_dark="#ffffff05",
+    button_secondary_background_fill_hover="#f3e8ff",
+    button_secondary_background_fill_hover_dark="rgba(147, 52, 233, 0.10)",
+    button_secondary_text_color="#18181b",
+    button_secondary_text_color_dark="#fafafa",
+    button_secondary_border_color="#e4d7f2",
+    button_secondary_border_color_dark="#d8b4fe26",
+    input_background_fill="#ffffff",
+    input_background_fill_dark="#171021",
+    input_border_color="#e4d7f2",
+    input_border_color_dark="#4a3962bf",
+    input_placeholder_color="#71717a",
+    input_placeholder_color_dark="#a3a3a3",
+    link_text_color="#6d28d9",
+    link_text_color_dark="#bf8bff",
+    link_text_color_hover="#7c22ce",
+    link_text_color_hover_dark="#d2a8ff",
+    shadow_drop="none",
+    shadow_drop_lg="none",
 )
 
+
 space_root = Path(__file__).resolve().parent
 data_dir = space_root / "data"
 
@@ -563,18 +2174,11 @@ def load_sample_comparison_data(folder):
     }
 
 
-def format_url_links(value):
-    if pd.isna(value) or not value:
-        return ""
-
-    links = [url.strip() for url in str(value).split(",") if url.strip()]
-    if not links:
-        return ""
-
-    return " ".join(
-        f'<a target="_blank" href="{url}" style="color: var(--link-text-color); text-decoration: underline;text-decoration-style: dotted;">run {idx}</a>'
-        for idx, url in enumerate(links, start=1)
-    )
+def _as_numeric(df, columns):
+    for column in columns:
+        if column in df.columns:
+            df[column] = pd.to_numeric(df[column], errors="coerce")
+    return df
 
 
 def load_oneig_dataframe(path):
@@ -582,7 +2186,6 @@ def load_oneig_dataframe(path):
     df = df.rename(
         columns={
             "Owner": "Endpoint Owner",
-            "Optimization": "Optimization Details",
             "Anime Alignment Score": "OneIG (Anime Alignment)",
             "Human Alignment Score": "OneIG (Human Alignment)",
             "Object Alignment Score": "OneIG (Object Alignment)",
@@ -591,67 +2194,86 @@ def load_oneig_dataframe(path):
             "OneIG (General Object) (Alignment Score)": "OneIG (Object Alignment)",
         }
     )
-    if "URL" in df.columns:
-        df["URL"] = df["URL"].apply(format_url_links)
+    df = df.drop(
+        columns=[
+            column
+            for column in ("URL", "Device", "Optimization", "Optimization Details")
+            if column in df.columns
+        ]
+    )
     if "Optimized" in df.columns:
         df["Optimized"] = df["Optimized"].map(
             {True: "Yes", False: "No", "TRUE": "Yes", "FALSE": "No"}
         ).fillna(df["Optimized"])
 
-    for column in [
-        "Price / Image (USD)",
-        "Median Generation Time (s)",
-        "Min Generation Time (s)",
-        "OneIG (Anime Alignment)",
-        "OneIG (Human Alignment)",
-        "OneIG (Object Alignment)",
-        "OneIG Anime Elo",
-        "OneIG Human Elo",
-        "OneIG Object Elo",
-        "P-Judge Overall",
-        "Rapidata Elo",
-    ]:
-        if column in df.columns:
-            df[column] = pd.to_numeric(df[column], errors="coerce")
+    return _as_numeric(
+        df,
+        [
+            "Price / Image (USD)",
+            "Median Generation Time (s)",
+            "Min Generation Time (s)",
+            "OneIG (Anime Alignment)",
+            "OneIG (Human Alignment)",
+            "OneIG (Object Alignment)",
+            "OneIG Anime Elo",
+            "OneIG Human Elo",
+            "OneIG Object Elo",
+            "P-Judge Overall",
+            "Rapidata Elo",
+        ],
+    )
 
-    preferred_columns = [
-        "Platform",
-        "Endpoint Owner",
-        "Device",
-        "Model",
-        "Optimized",
-        "Optimization Details",
-        "OneIG (Anime Alignment)",
-        "OneIG (Human Alignment)",
-        "OneIG (Object Alignment)",
-        "OneIG Anime Elo",
-        "OneIG Human Elo",
-        "OneIG Object Elo",
-        "Median Inference Time",
-        "Median Inference Time (s)",
-        "Median Generation Time (s)",
-        "Min Generation Time (s)",
-        "Median Total Duration (s)",
-        "Price per Image",
-        "Price / Image (USD)",
-        "Evaluation Date (UTC)",
-        "URL",
-    ]
-    present_preferred_columns = [col for col in preferred_columns if col in df.columns]
-    df = df[
-        present_preferred_columns
-        + [col for col in df.columns.tolist() if col not in present_preferred_columns]
-    ]
 
-    if "OneIG (Human Alignment)" in df.columns:
-        df = df.sort_values(
-            by="OneIG (Human Alignment)", ascending=False, na_position="last"
-        )
+def load_artificial_analysis_dataframe(path):
+    """Load the Artificial Analysis text-to-image leaderboard."""
+    df = pd.read_csv(path, na_values=["N/A", "n/a", ""])
+    df = df.rename(
+        columns={
+            "model": "Model",
+            "elo": "Artificial Analysis Elo",
+            "price_per_image_usd": "Price / Image (USD)",
+        }
+    )
+    df["Model"] = df["Model"].astype(str).str.strip()
+    return _as_numeric(
+        df, ["Artificial Analysis Elo", "Price / Image (USD)"]
+    ).reset_index(drop=True)
+
 
-    numeric_cols = df.select_dtypes(include=[float, int]).columns.tolist()
-    for col in numeric_cols:
-        df[col] = df[col].apply(lambda x: round(x, 4) if pd.notna(x) else x)
-    return df
+ARENA_CATEGORY_COLUMNS = {
+    "product_branding_commercial_design_elo": "Arena Branding / Commercial Elo",
+    "3d_imaging_and_modeling_elo": "Arena 3D Imaging Elo",
+    "cartoon_anime_and_fantasy_elo": "Arena Cartoon / Anime Elo",
+    "photorealistic_and_cinematic_imagery_elo": "Arena Photorealistic Elo",
+    "art_elo": "Arena Art Elo",
+    "portraits_elo": "Arena Portraits Elo",
+    "text_rendering_elo": "Arena Text Rendering Elo",
+}
+
+
+def load_arena_ai_dataframe(path):
+    """Load the Arena AI text-to-image leaderboard (overall + category Elos)."""
+    df = pd.read_csv(path, na_values=["N/A", "n/a", ""])
+    rename_map = {"model": "Model", "elo": "Arena Elo"}
+    rename_map.update(
+        {
+            source: label
+            for source, label in ARENA_CATEGORY_COLUMNS.items()
+            if source in df.columns
+        }
+    )
+    df = df.rename(columns=rename_map)
+    df["Model"] = df["Model"].astype(str).str.strip()
+    score_columns = [
+        column
+        for column in ["Arena Elo", *ARENA_CATEGORY_COLUMNS.values()]
+        if column in df.columns
+    ]
+    df = _as_numeric(df, score_columns)
+    ordered = ["Model", *score_columns]
+    return df[[column for column in ordered if column in df.columns]].reset_index(
+        drop=True
+    )
 
 
 def load_qwen_combined_dataframe(path):
@@ -664,36 +2286,17 @@ def load_qwen_combined_dataframe(path):
     df = df[~df["Model"].astype(str).str.startswith("#")].copy()
     df["Model"] = df["Model"].astype(str).str.strip()
 
-    for column in [
-        "Price / Image (USD)",
-        "Median Generation Time (s)",
-        "Min Generation Time (s)",
-        "P-Judge Overall",
-        "Rapidata Elo",
-        "Datapoint Elo",
-    ]:
-        if column in df.columns:
-            df[column] = pd.to_numeric(df[column], errors="coerce")
-
-    sort_column = next(
-        (
-            col
-            for col in [
-                "Datapoint Elo",
-                "P-Judge Overall",
-                "Rapidata Elo",
-            ]
-            if col in df.columns
-        ),
-        None,
-    )
-    if sort_column:
-        df = df.sort_values(by=sort_column, ascending=False, na_position="last")
-
-    numeric_cols = df.select_dtypes(include=[float, int]).columns.tolist()
-    for col in numeric_cols:
-        df[col] = df[col].apply(lambda x: round(x, 4) if pd.notna(x) else x)
-    return df.reset_index(drop=True)
+    return _as_numeric(
+        df,
+        [
+            "Price / Image (USD)",
+            "Median Generation Time (s)",
+            "Min Generation Time (s)",
+            "P-Judge Overall",
+            "Rapidata Elo",
+            "Datapoint Elo",
+        ],
+    ).reset_index(drop=True)
 
 
 df = load_oneig_dataframe(oneig_path)
@@ -712,9 +2315,6 @@ if oneig_metric_columns:
     oneig_df["OneIG Overall Score"] = oneig_df[oneig_metric_columns].mean(
         axis=1, skipna=True
     )
-    oneig_df = oneig_df.sort_values(
-        by="OneIG Overall Score", ascending=False, na_position="last"
-    )
 
 oneig_display_columns = [
     col
@@ -723,6 +2323,7 @@ oneig_display_columns = [
         "Endpoint Owner",
         "Model",
         "Optimized",
+        "OneIG Overall Score",
         *oneig_metric_columns,
         "OneIG Anime Elo",
         "OneIG Human Elo",
@@ -733,12 +2334,9 @@ oneig_display_columns = [
         "Median Generation Time (s)",
         "Min Generation Time (s)",
         "Price / Image (USD)",
-        "URL",
     ]
     if col in oneig_df.columns
 ]
-# Top-level Leaderboard tab uses the same OneIG table.
-display_columns = oneig_display_columns
 
 oneig_combined_dir = _resolve_data_path(
     data_dir / "oneig_combined",
@@ -752,97 +2350,332 @@ qwen_path = _resolve_data_path(
     data_dir / "qwen_image_bench_model_price_and_median_generation_time.csv",
     space_root.parent / "qwen_image_bench_model_price_and_median_generation_time.csv",
 )
+aa_path = _resolve_data_path(
+    data_dir / "artificial_analysis_text_to_image_leaderboard.csv",
+    space_root.parent / "artificial_analysis_text_to_image_leaderboard.csv",
+)
+arena_path = _resolve_data_path(
+    data_dir / "arena_ai_text_to_image_leaderboard.csv",
+    space_root.parent / "arena_ai_text_to_image_leaderboard.csv",
+)
 
 qwen_df = load_qwen_combined_dataframe(qwen_path)
-qwen_score_columns = [
+aa_df = load_artificial_analysis_dataframe(aa_path)
+arena_df = load_arena_ai_dataframe(arena_path)
+qwen_display_columns = [
     col
     for col in [
-        "P-Judge Overall",
+        "Model",
         "Datapoint Elo",
         "Rapidata Elo",
+        "P-Judge Overall",
+        "Raw Win Rate",
+        "Median Generation Time (s)",
+        "Min Generation Time (s)",
+        "Price / Image (USD)",
     ]
     if col in qwen_df.columns
 ]
-qwen_display_columns = [
+aa_display_columns = [
     col
     for col in [
         "Model",
-        *qwen_score_columns,
-        "Raw Win Rate",
-        "Median Generation Time (s)",
-        "Min Generation Time (s)",
+        "Artificial Analysis Elo",
         "Price / Image (USD)",
     ]
-    if col in qwen_df.columns
+    if col in aa_df.columns
+]
+arena_display_columns = [
+    col
+    for col in [
+        "Model",
+        "Arena Elo",
+        *ARENA_CATEGORY_COLUMNS.values(),
+    ]
+    if col in arena_df.columns
 ]
-qwen_overall_column = (
-    "Datapoint Elo"
-    if "Datapoint Elo" in qwen_df.columns
-    else (qwen_score_columns[0] if qwen_score_columns else None)
-)
 
 oneig_samples = load_sample_comparison_data(oneig_combined_dir)
 qwen_samples = load_sample_comparison_data(qwen_combined_dir)
 
-# Dataset-first catalogue: each card is a prompt suite; metrics are leaderboard columns.
-benchmarks = [
+metrics = [
+    {"id": "datapoint_elo", "column": "Datapoint Elo"},
+    {"id": "rapidata_elo", "column": "Rapidata Elo"},
+    {"id": "pjudger", "column": "P-Judge Overall"},
+    {"id": "alignment_overall", "column": "OneIG Overall Score"},
+    {"id": "datapoint_elo_anime", "column": "OneIG Anime Elo"},
+    {"id": "datapoint_elo_human", "column": "OneIG Human Elo"},
+    {"id": "datapoint_elo_object", "column": "OneIG Object Elo"},
+    {"id": "aa_elo", "column": "Artificial Analysis Elo"},
+    {"id": "arena_elo", "column": "Arena Elo"},
+    {"id": "arena_branding", "column": "Arena Branding / Commercial Elo"},
+    {"id": "arena_3d", "column": "Arena 3D Imaging Elo"},
+    {"id": "arena_cartoon", "column": "Arena Cartoon / Anime Elo"},
+    {"id": "arena_photo", "column": "Arena Photorealistic Elo"},
+    {"id": "arena_art", "column": "Arena Art Elo"},
+    {"id": "arena_portraits", "column": "Arena Portraits Elo"},
+    {"id": "arena_text", "column": "Arena Text Rendering Elo"},
+]
+
+
+def _metric_ids_for(data, metric_ids):
+    columns = getattr(data, "columns", [])
+    return [
+        metric_id
+        for metric_id in metric_ids
+        if any(metric["id"] == metric_id and metric["column"] in columns for metric in metrics)
+    ]
+
+
+qwen_metric_ids = _metric_ids_for(
+    qwen_df, ["datapoint_elo", "rapidata_elo", "pjudger"]
+)
+oneig_metric_ids = _metric_ids_for(
+    oneig_df,
+    [
+        "alignment_overall",
+        "rapidata_elo",
+        "pjudger",
+        "datapoint_elo_anime",
+        "datapoint_elo_human",
+        "datapoint_elo_object",
+    ],
+)
+aa_metric_ids = _metric_ids_for(aa_df, ["aa_elo"])
+arena_metric_ids = _metric_ids_for(
+    arena_df,
+    [
+        "arena_elo",
+        "arena_branding",
+        "arena_3d",
+        "arena_cartoon",
+        "arena_photo",
+        "arena_art",
+        "arena_portraits",
+        "arena_text",
+    ],
+)
+
+datasets = [
+    {
+        "id": "qwen",
+        "name": "Qwen Image Dataset",
+        "data": qwen_df,
+        "columns": qwen_display_columns,
+        "metric_ids": qwen_metric_ids,
+        "note": "Rapidata Elo is a metric on this dataset, not a dataset of its own.",
+        "samples": qwen_samples,
+    },
     {
         "id": "oneig",
-        "title": "OneIG Alignment",
-        "emoji": "🎯",
-        "card_description": (
-            "Anime/stylization, portrait, and general-object alignment prompts — "
-            "alignment scores and Datapoint Elo (not the full OneIG suite), plus "
-            "side-by-side generations."
-        ),
-        "intro": (
-            "OneIG Alignment covers the alignment slice of OneIG (not every OneIG "
-            "dimension). The leaderboard shows category alignment scores and Datapoint "
-            "Elo columns; Compare samples uses the combined alignment generations."
-        ),
+        "name": "OneIG Alignment Dataset",
         "data": oneig_df,
         "columns": oneig_display_columns,
-        "score_columns": oneig_metric_columns,
-        "overall_column": "OneIG Overall Score",
-        "best_score_label": "BEST ONEIG ALIGNMENT",
-        "metrics_same_scale": True,
+        "metric_ids": oneig_metric_ids,
         "note": (
-            "> Rankings are ordered by the mean of the available alignment category "
-            "scores. Missing category scores are not included in that model's mean."
+            "Alignment Overall is the mean of the available category scores. "
+            "Missing categories are skipped for that model."
         ),
         "samples": oneig_samples,
     },
     {
-        "id": "qwen_image_bench",
-        "title": "Qwen Image Bench",
-        "emoji": "🖼️",
-        "card_description": (
-            "Qwen image-bench prompts with P-Judge, Datapoint Elo, and Rapidata Elo "
-            "as metric columns, plus combined generations for comparison."
-        ),
-        "intro": (
-            "Qwen Image Bench is a shared prompt suite. The leaderboard joins every "
-            "available metric for this benchmark; Compare samples uses the combined "
-            "Qwen generations."
-        ),
-        "data": qwen_df,
-        "columns": qwen_display_columns,
-        "score_columns": qwen_score_columns,
-        "overall_column": qwen_overall_column,
-        "best_score_label": "BEST DATAPOINT ELO",
-        "metrics_same_scale": False,
-        "note": (
-            "> Models are ordered by Datapoint Elo when available. Other metric "
-            "columns come from the P-Judge and Rapidata evaluations on the same "
-            "prompt suite."
-        ),
-        "samples": qwen_samples,
+        "id": "artificial_analysis",
+        "name": "Artificial Analysis Dataset",
+        "data": aa_df,
+        "columns": aa_display_columns,
+        "metric_ids": aa_metric_ids,
+        "note": "",
+        "samples": None,
+    },
+    {
+        "id": "arena_ai",
+        "name": "Arena AI Dataset",
+        "data": arena_df,
+        "columns": arena_display_columns,
+        "metric_ids": arena_metric_ids,
+        "note": "",
+        "samples": None,
     },
 ]
+datasets = [dataset for dataset in datasets if dataset["metric_ids"]]
+
+DEFAULT_DATASET_ID = next(
+    (dataset["id"] for dataset in datasets if dataset["id"] == "qwen"),
+    datasets[0]["id"] if datasets else None,
+)
+DEFAULT_METRIC_ID = None
 
 
 custom_head = """
 <script>
+(function () {
+  var mode = "dark";
+  try {
+    var stored = localStorage.getItem("inferbench-theme");
+    if (stored === "light" || stored === "dark") mode = stored;
+    else {
+      var param = new URLSearchParams(location.search).get("__theme");
+      if (param === "light" || param === "dark") mode = param;
+    }
+  } catch (e) {}
+  document.documentElement.classList.toggle("dark", mode === "dark");
+  document.documentElement.dataset.theme = mode;
+})();
+</script>
+<link rel="preconnect" href="https://fonts.googleapis.com" />
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
+<script>
+(() => {
+  const STORAGE_KEY = "inferbench-theme";
+  const PLOT_LAYOUT = {
+    dark: {
+      paper_bgcolor: "#171021",
+      plot_bgcolor: "#1d1429",
+      "font.color": "#d4d4d4",
+      "legend.font.color": "#d4d4d4",
+      "xaxis.gridcolor": "rgba(74, 57, 98, 0.55)",
+      "xaxis.color": "#d4d4d4",
+      "xaxis.title.font.color": "#fafafa",
+      "xaxis.tickfont.color": "#a3a3a3",
+      "yaxis.gridcolor": "rgba(74, 57, 98, 0.55)",
+      "yaxis.color": "#d4d4d4",
+      "yaxis.title.font.color": "#fafafa",
+      "yaxis.tickfont.color": "#a3a3a3",
+    },
+    light: {
+      paper_bgcolor: "#f6f3fa",
+      plot_bgcolor: "#ffffff",
+      "font.color": "#3f3f46",
+      "legend.font.color": "#3f3f46",
+      "xaxis.gridcolor": "rgba(126, 34, 206, 0.12)",
+      "xaxis.color": "#3f3f46",
+      "xaxis.title.font.color": "#18181b",
+      "xaxis.tickfont.color": "#71717a",
+      "yaxis.gridcolor": "rgba(126, 34, 206, 0.12)",
+      "yaxis.color": "#3f3f46",
+      "yaxis.title.font.color": "#18181b",
+      "yaxis.tickfont.color": "#71717a",
+    },
+  };
+
+  const currentMode = () => {
+    try {
+      const stored = localStorage.getItem(STORAGE_KEY);
+      if (stored === "light" || stored === "dark") return stored;
+    } catch (e) {}
+    const param = new URLSearchParams(location.search).get("__theme");
+    if (param === "light" || param === "dark") return param;
+    return "dark";
+  };
+
+  const queryAll = (selector) => {
+    const found = [...document.querySelectorAll(selector)];
+    document.querySelectorAll("gradio-app").forEach((app) => {
+      if (app.shadowRoot) found.push(...app.shadowRoot.querySelectorAll(selector));
+    });
+    return found;
+  };
+
+  const applyPlotTheme = (gd, mode) => {
+    const layout = PLOT_LAYOUT[mode];
+    if (!layout || typeof Plotly === "undefined" || !gd) return;
+    if (gd.layout && gd.layout.paper_bgcolor === layout.paper_bgcolor) return;
+    try { Plotly.relayout(gd, layout); } catch (e) {}
+  };
+
+  const watchPlotTheme = (gd) => {
+    if (!gd || gd.__inferbenchThemeBound) return;
+    gd.__inferbenchThemeBound = true;
+    gd.addEventListener("plotly_afterplot", () => applyPlotTheme(gd, currentMode()));
+  };
+
+  const restylePlots = (mode) => {
+    queryAll(".js-plotly-plot").forEach((gd) => {
+      watchPlotTheme(gd);
+      applyPlotTheme(gd, mode);
+    });
+  };
+
+  const applyMode = (mode, persist) => {
+    const dark = mode === "dark";
+    const targets = [
+      document.documentElement,
+      document.body,
+      ...queryAll(".gradio-container"),
+      ...document.querySelectorAll("gradio-app"),
+    ].filter(Boolean);
+    targets.forEach((el) => {
+      el.classList.toggle("dark", dark);
+      el.classList.toggle("light", !dark);
+    });
+    document.documentElement.dataset.theme = mode;
+    const label = dark ? "Switch to light mode" : "Switch to dark mode";
+    queryAll(".theme-toggle").forEach((btn) => {
+      btn.setAttribute("data-mode", mode);
+      btn.setAttribute("aria-label", label);
+      btn.setAttribute("title", label);
+    });
+    if (persist) {
+      try { localStorage.setItem(STORAGE_KEY, mode); } catch (e) {}
+      try {
+        const url = new URL(location.href);
+        url.searchParams.set("__theme", mode);
+        history.replaceState(null, "", url);
+      } catch (e) {}
+    }
+    restylePlots(mode);
+  };
+
+  applyMode(currentMode(), false);
+
+  document.addEventListener("click", (event) => {
+    const path = typeof event.composedPath === "function" ? event.composedPath() : [event.target];
+    const btn = path.find((el) => el.classList && el.classList.contains("theme-toggle"));
+    if (!btn) return;
+    event.preventDefault();
+    const next = currentMode() === "dark" ? "light" : "dark";
+    applyMode(next, true);
+  });
+
+  const sync = () => applyMode(currentMode(), false);
+  document.addEventListener("DOMContentLoaded", sync);
+  window.addEventListener("load", () => {
+    sync();
+    setTimeout(sync, 80);
+    setTimeout(sync, 400);
+  });
+
+  const startObserver = () => {
+    if (!document.body || window.__inferbenchThemeObserver) return;
+    window.__inferbenchThemeObserver = true;
+    const onMutations = (mutations) => {
+      const mode = currentMode();
+      const isDark = document.documentElement.classList.contains("dark");
+      const added = mutations.flatMap((mutation) => [...mutation.addedNodes]).filter((node) => node.nodeType === 1);
+      const hasContainer = added.some((node) => (
+        node.classList?.contains("gradio-container") ||
+        node.querySelector?.(".gradio-container, .theme-toggle")
+      ));
+      if ((mode === "dark") !== isDark || hasContainer) applyMode(mode, false);
+      const hasPlot = added.some((node) => (
+        node.classList?.contains("js-plotly-plot") ||
+        node.querySelector?.(".js-plotly-plot")
+      ));
+      if (hasPlot) restylePlots(mode);
+    };
+    new MutationObserver(onMutations).observe(document.body, { childList: true, subtree: true });
+    document.querySelectorAll("gradio-app").forEach((app) => {
+      if (app.shadowRoot) {
+        new MutationObserver(onMutations).observe(app.shadowRoot, { childList: true, subtree: true });
+      }
+    });
+  };
+  if (document.body) startObserver();
+  else document.addEventListener("DOMContentLoaded", startObserver);
+})();
+</script>
+<script>
 (() => {
   if (window.__inferbenchLeaderboardSortBound) return;
   window.__inferbenchLeaderboardSortBound = true;
@@ -897,25 +2730,40 @@ custom_head = """
   });
 })();
 </script>
+<script>
+(() => {
+  if (window.__inferbenchChipScrollBound) return;
+  window.__inferbenchChipScrollBound = true;
+  document.addEventListener("wheel", (event) => {
+    const row = event.target.closest?.(".view-filters .filter-chips .wrap-inner");
+    if (!row || row.scrollWidth <= row.clientWidth + 1) return;
+    if (Math.abs(event.deltaY) < Math.abs(event.deltaX)) return;
+    row.scrollLeft += event.deltaY;
+    event.preventDefault();
+  }, { capture: true, passive: false });
+})();
+</script>
 """
 
 with gr.Blocks(
-    theme=theme, fill_width=True, css=custom_css, head=custom_head
+    title="P-Bench",
+    theme=theme,
+    fill_width=True,
+    css=custom_css,
+    head=custom_head,
 ) as demo:
     render_header()
-    with gr.Tabs():
-        with gr.TabItem("Home"):
-            render_home(benchmarks)
-        with gr.TabItem("Benchmarks") as benchmarks_tab:
-            reset_benchmarks, reset_benchmark_outputs = render_benchmarks(benchmarks)
-            benchmarks_tab.select(
-                reset_benchmarks,
-                outputs=reset_benchmark_outputs,
-            )
-        with gr.TabItem("About"):
-            render_about()
+    render_image_workspace(
+        datasets,
+        metrics,
+        DEFAULT_DATASET_ID,
+        DEFAULT_METRIC_ID,
+    )
     render_footer()
 
 
 if __name__ == "__main__":
-    demo.launch(ssr_mode=False)
+    demo.launch(
+        ssr_mode=False,
+        allowed_paths=[str(space_root)],
+    )

data/arena_ai_text_to_image_leaderboard.csv

@@ -0,0 +1,77 @@
+model,elo,product_branding_commercial_design_elo,3d_imaging_and_modeling_elo,cartoon_anime_and_fantasy_elo,photorealistic_and_cinematic_imagery_elo,art_elo,portraits_elo,text_rendering_elo
+gpt-image-2 (medium),1381,1391,1361,1397,1380,1370,1429,1425
+mai-image-2.6-preview,1336,1344,1362,1355,1325,1345,1365,1374
+grok-imagine-image-2.0 (low),1316,1309,1268,1321,1327,1306,1371,1353
+reve-2.1,1302,1314,1274,1310,1302,1289,1317,1341
+muse-image,1282,1269,1255,1289,1293,1275,1313,1304
+reve-2.0,1270,1279,1220,1275,1280,1259,1283,1297
+gemini-3.1-flash-image (nano-banana-2) [web-search],1264,1271,1260,1268,1270,1251,1266,1295
+seedream-5.0-pro,1258,1234,1246,1273,1280,1269,1291,1255
+qwen-image-3.0-pro,1257,1258,1240,1271,1257,1257,1273,1289
+mai-image-2.5,1256,1261,1248,1270,1252,1278,1259,1284
+gemini-3.1-flash-lite-image (nano-banana-2-lite),1251,1250,1225,1258,1260,1257,1248,1275
+gemini-3-pro-image-2k (nano-banana-pro),1246,1246,1231,1242,1260,1225,1258,1270
+gpt-image-1.5-high-fidelity,1239,1241,1216,1243,1249,1224,1261,1254
+gemini-3-pro-image-preview (nano-banana-pro),1232,1237,1209,1238,1243,1216,1236,1254
+ideogram-4.0-quality,1204,1224,1180,1195,1203,1199,1201,1238
+qwen-image-2.0-pro-2026-06-22,1191,1187,1198,1191,1205,1177,1216,1201
+uni-1.1-max,1188,1197,1172,1194,1188,1195,1158,1217
+mai-image-2,1183,1175,1179,1180,1203,1177,1207,1175
+uni-1.1,1181,1181,1167,1189,1180,1188,1176,1202
+Cosmos3-Super-Text2Image (Agentic),1175,1162,1170,1191,1189,1195,1212,1151
+grok-imagine-image,1171,1175,1176,1177,1179,1179,1187,1185
+recraft-v4.1-utility-pro,1169,1167,1147,1177,1180,1178,1169,1162
+flux-2-max,1162,1165,1161,1169,1161,1170,1157,1167
+grok-imagine-image-pro,1161,1168,1165,1163,1169,1165,1172,1182
+flux-2-flex,1157,1173,1172,1162,1147,1156,1145,1172
+flux-2-pro,1155,1157,1150,1161,1152,1163,1146,1157
+Cosmos3-Super-Text2Image,1155,1129,1166,1177,1155,1173,1176,1122
+reve-v1.5,1154,1182,1143,1141,1147,1144,1149,1185
+hunyuan-image-3.0,1151,1153,1168,1163,1152,1153,1146,1150
+gemini-2.5-flash-image-preview (nano-banana),1150,1152,1142,1145,1157,1145,1168,1154
+imagen-ultra-4.0-generate-001,1148,1151,1141,1141,1156,1128,1168,1148
+seedream-4.5,1147,1140,1147,1149,1166,1154,1166,1141
+flux-2-dev,1145,1155,1149,1144,1143,1150,1133,1159
+seedream-4-2k,1140,1134,1150,1149,1151,1164,1142,1143
+seedream-5.0-lite,1137,1129,1138,1140,1154,1137,1150,1134
+wan2.6-t2i,1136,1148,1146,1146,1128,1156,1123,1149
+recraft-v4.1-pro,1130,1138,1111,1122,1143,1154,1144,1156
+imagen-4.0-generate-001,1129,1129,1123,1120,1136,1110,1145,1123
+qwen-image-2512,1125,1128,1135,1125,1135,1133,1143,1122
+krea-2-medium,1122,1119,1132,1140,1127,1152,1148,1124
+wan2.5-t2i-preview,1117,1138,1135,1120,1102,1120,1094,1142
+hidream-o1-image,1117,1128,1121,1121,1111,1122,1106,1135
+seedream-4-fal,1116,1128,1138,1109,1121,1119,1116,1124
+gpt-image-1,1115,1115,1114,1115,1115,1115,1115,1115
+recraft-v4,1114,1126,1076,1111,1119,1123,1119,1139
+seedream-4-high-res-fal,1113,1113,1121,1109,1129,1112,1133,1110
+krea-2-turbo,1111,1109,1133,1122,1123,1139,1138,1097
+gpt-image-1-mini,1109,1109,1108,1108,1114,1113,1112,1104
+krea-2-large,1107,1104,1113,1112,1121,1116,1117,1111
+wan2.7-image-pro,1103,1114,1080,1080,1123,1079,1127,1118
+wan2.7-image,1100,1110,1082,1075,1117,1075,1125,1114
+mai-image-1,1093,1086,1096,1100,1103,1104,1095,1070
+seedream-3,1082,1070,1094,1081,1102,1092,1102,1052
+z-image-turbo,1082,1060,1066,1067,1115,1074,1140,1058
+flux-1-kontext-max,1074,1082,1079,1079,1083,1081,1085,1071
+flux-2-klein-9b,1070,1070,1078,1064,1090,1079,1092,1057
+qwen-image-prompt-extend,1061,1087,1082,1062,1047,1055,1051,1082
+flux-1-kontext-pro,1059,1068,1062,1058,1066,1067,1065,1053
+imagen-3.0-generate-002,1058,1057,1046,1048,1075,1059,1077,1045
+qwen-image,1057,1068,1064,1052,1062,1055,1076,1047
+ideogram-v3-quality,1049,1082,1029,1027,1051,1039,1052,1070
+photon,1035,1052,1033,1026,1035,1046,1023,1041
+p-image,1034,1031,1031,1014,1074,1041,1100,1021
+flux-2-klein-4b,1030,1026,1030,1023,1047,1028,1054,1015
+runway-gen4,1025,1027,1013,1008,1041,1019,1022,1019
+recraft-v3,1021,1027,1011,978,1054,991,1040,1005
+flux-1.1-pro,1016,1012,1051,1016,1044,1044,1043,995
+lucid-origin,1013,1020,1015,1007,1035,1031,1043,1005
+ideogram-v2,1013,1054,990,995,1019,1017,1019,1046
+glm-image,1010,1036,1018,1003,1000,1013,1000,1033
+gemini-2.0-flash-preview-image-generation,975,1019,976,954,963,965,961,1007
+flux-1-dev-fp8,969,991,978,957,990,978,999,963
+dall-e-3,968,987,987,988,940,1010,924,969
+flux-1-kontext-dev,940,966,943,924,935,927,944,953
+stable-diffusion-v35-large,938,937,964,946,928,998,941,921
+bagel,898,887,866,885,923,911,926,875

data/artificial_analysis_text_to_image_leaderboard.csv

@@ -0,0 +1,146 @@
+model,elo,price_per_image_usd
+GPT Image 2 (high),1370,0.211
+Reve 2.1,1324,0.2
+Nano Banana 2 (Gemini 3.1 Flash Image Preview),1322,0.067
+GPT Image 1.5 (high),1312,0.133
+MAI-Image-2.5,1306,0.0481
+Nano Banana Pro (Gemini 3 Pro Image),1298,0.134
+Nano Banana 2 Lite (Gemini 3.1 Flash Lite Image),1292,0.0336
+Seedream 5.0 Pro,1281,0.09
+grok-imagine-image-quality,1236,0.05
+Qwen Image 2.0 Pro (2026-04-22),1235,0.075
+FLUX.2 [max],1231,0.07
+MAI-Image-2.5-Flash,1230,0.02
+HiDream-O1-Image-1.5,1227,0.08
+Seedream 4.0,1224,0.03
+Luma UNI 1 Max,1223,0.1
+FLUX.2 [flex],1222,0.06
+Krea 2 Medium Turbo,1222,0.015
+Krea 2 Large,1220,0.06
+grok-imagine-image,1218,0.02
+Recraft V4.1 Utility,1217,0.035
+Ideogram 4.0,1217,0.06
+Recraft V4.1 Utility Pro,1217,0.21
+Ideogram 4.0 (Quality),1214,0.1
+Wan2.6 Text to Image,1213,0.03
+Krea 2 Medium,1212,0.03
+MAI-Image-2,1210,0.035
+FLUX.2 [pro],1208,0.03
+Wan 2.6 Image,1206,0.03
+Seedream 4.5,1205,0.04
+GPT Image 1 (high),1205,0.167
+Luma UNI 1,1205,0.0404
+FLUX.2 [dev] Turbo,1199,0.008
+FLUX.2 [dev],1199,0.012
+Seedream 5.0 Lite,1199,0.035
+Ideogram 4.0 Fast (Quality),1199,0.0175
+P-Image-Ideogram (High),1198,0.015
+Recraft V4 Pro,1195,0.25
+Recraft V4.1,1191,0.035
+Nano Banana (Gemini 2.5 Flash Image),1189,0.039
+Recraft V4.1 Pro,1189,0.21
+Imagen 4 Ultra,1189,0.06
+Ideogram 4.0 Instant,1187,0.0075
+Wan 2.7 Pro,1184,0.064
+Recraft V4,1182,0.04
+MAI-Image-2-Efficient,1182,0.022
+P-Image-Ideogram (Medium),1181,0.01
+FLUX.2 [dev] Flash,1179,0.005
+HiDream-O1-Image,1176,
+Ideogram 4.0 Fast,1176,0.0105
+ImagineArt 2.0,1173,0.03
+Qwen Image Max 2512,1173,0.02
+Wan 2.7,1170,0.026
+ImagineArt 1.5 Preview,1165,0.03
+P-Image-Ideogram (Low),1165,0.0075
+Seedream 3.0,1160,0.03
+Vivago 2.1,1152,0.035
+HunyuanImage 3.0 Instruct (Fal),1151,0.09
+Wan 2.5 Preview,1150,0.021
+FLUX.2 [klein] 9B,1146,0.015
+FLUX.1 Kontext [max],1142,0.08
+Kolors 2.1,1142,0.014
+image-1,1141,0.04
+HunyuanImage 3.0 (Fal),1140,0.1
+Qwen Image 2.0 (2026-03-03),1135,0.035
+Z-Image Turbo,1130,0.005
+Vivago 2.0,1125,
+Imagen 3 (v002),1124,0.04
+Lucid Origin Ultra,1122,0.0867
+Eigen Image,1122,0.025
+Imagen 4 Standard,1120,0.04
+Reve Image (Halfmoon),1116,
+Kling Image 3.0 Omni,1115,0.028
+Vidu Q2,1112,0.03
+P-Image-Ideogram (Very Low),1111,0.003
+Qwen Image Plus 2601,1110,0.03
+GPT Image 1 Mini (medium),1110,0.011
+Lucid Origin Fast,1110,0.0179
+FLUX.1 Kontext [pro],1109,0.04
+Dreamina 3.1,1108,0.03
+FLUX1.1 [pro] Ultra,1104,0.06
+Ideogram 3.0,1101,0.06
+FLUX.2 [klein] Base 9B,1099,0.011
+Imagen 4 Fast,1098,0.02
+P-Image,1093,0.005
+FLUX1.1 [pro],1092,0.04
+Midjourney v7 Alpha,1092,
+Ideogram v2,1084,0.08
+FLUX.1 [pro],1083,0.05
+Qwen Image,1082,0.02
+SRPO,1080,0.026
+HunyuanImage 2.1,1078,0.1
+Midjourney v6,1076,
+Ideogram v2 Turbo,1075,0.05
+FIBO,1075,0.04
+Recraft V3,1075,0.04
+Luma Photon,1074,0.019
+HiDream-O1-Image-Dev,1071,0.005
+Image-01,1070,0.01
+HiDream-I1-Dev,1070,0.024
+GLM-Image,1068,0.05
+Z-Image Base,1064,0.01
+MAI Image 1,1064,
+HiDream-I1-Fast,1063,0.012
+FLUX.2 [klein] 4B,1057,0.014
+Midjourney v6.1,1057,
+Infinity 8B,1056,0.0017
+LongCat Image,1053,0.13
+Stable Diffusion 3 Large,1042,
+FLUX.1 [dev],1041,0.025
+Phoenix 1.0 Ultra,1041,0.0762
+FLUX.1 Krea [dev],1036,0.025
+Stable Diffusion 3.5 Large Turbo,1034,0.04
+Stable Diffusion 3.5 Large,1034,0.065
+Phoenix 0.9 Ultra,1028,0.0762
+Ideogram v2a Turbo,1028,0.025
+Ideogram v2a,1027,0.04
+Playground v3 (beta),1015,0.0105
+Krea 1,1013,
+Phoenix 1.0 Fast,1007,0.0194
+Luma Photon Flash,1004,0.005
+FLUX.1 [schnell],1000,0.003
+Step Image Edit 2,1000,0.003
+Runway Gen-4 Image,992,0.08
+Recraft 20B,984,0.022
+Lumina Image v2,978,0.075
+Playground v2.5,972,0.08
+FLUX.2 [klein] Base 4B,972,0.009
+DALLE 3,968,0.04
+DALLE 3 HD,967,0.08
+Stable Diffusion 3.5 Medium,963,0.02
+Sana Sprint 1.6B,939,0.0015
+Amazon Titan G1 v2 (Standard),923,0.01
+Stable Diffusion 3 Medium,922,0.035
+Stable Diffusion 3 Large Turbo,917,
+Amazon Titan G1 (Standard),914,0.01
+Stable Diffusion 1.6,914,0.009
+OmniGen V2,911,0.15
+SDXL Lightning,909,0.0019
+Bagel,908,0.1
+Bria 3.2,906,0.04
+Stable Diffusion XL 1.0,884,0.009
+Stable Diffusion 2.1,754,0.0039
+DALLE 2,745,0.02
+Janus Pro,720,0.0
+Stable Diffusion 1.5,665,0.044

data/text_to_image.jsonl

@@ -1,31 +0,0 @@
-{"Platform": "Replicate", "Owner": "Pruna AI", "Device": "1xH100", "Model": "FLUX Schnell", "Optimization": "speed_mode_juiced", "URL": "https://replicate.com/prunaai/flux-schnell", "PartiPromts (ARNIQA)": 0.5665, "PartiPromts (ClipScore)": 27.4594, "PartiPromts (ClipIQA)": 0.8594, "PartiPromts (Sharpness - Laplacian Variance)": 4385.7579, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "HPS (v2.1)": 0.2106, "DrawBench (ClipScore)": 27.9985, "DrawBench (Image Reward)": 1.0057, "GenAI-Bench (VQA)": 0.79, "OneIG (Anime and Stylization) (Alignment Score)": null, "Median Inference Time": 0.9082, "Price per Image": 0.055}
-{"Platform": "fal.ai", "Owner": "fal.ai", "Device": "Undisclosed", "Model": "FLUX 1.1 Pro", "Optimization": "Undisclosed", "URL": "https://fal.ai/models/fal-ai/flux-pro/v1.1", "GenAI-Bench (VQA)": 0.7745, "HPS (v2.1)": 0.2093, "PartiPromts (ARNIQA)": 0.5998, "PartiPromts (ClipScore)": 26.7942, "PartiPromts (ClipIQA)": 0.9282, "PartiPromts (Sharpness - Laplacian Variance)": 14290.615, "Long Text Bench (edit_distance)": 163.5862, "Long Text Bench (text_word_accuracy)": null, "OneIG (Anime and Stylization) (Alignment Score)": null, "DrawBench (ClipScore)": 27.2099, "DrawBench (Image Reward)": 0.8609, "Median Inference Time": 4.031, "Price per Image": 0.04}
-{"Platform": "fal.ai", "Owner": "fal.ai", "Device": "Undisclosed", "Model": "FLUX Dev", "Optimization": "dev", "URL": "https://fal.ai/models/fal-ai/flux/dev", "Long Text Bench (edit_distance)": 177.7438, "Long Text Bench (text_word_accuracy)": null, "OneIG (Anime and Stylization) (Alignment Score)": null, "GenAI-Bench (VQA)": 0.7443, "DrawBench (ClipScore)": 27.0164, "DrawBench (Image Reward)": 0.8933, "PartiPromts (ARNIQA)": 0.6305, "PartiPromts (ClipScore)": 27.2592, "PartiPromts (ClipIQA)": 0.8593, "PartiPromts (Sharpness - Laplacian Variance)": 5212.9337, "HPS (v2.1)": 0.1932, "Median Inference Time": 1.9838, "Price per Image": 0.025}
-{"Platform": "Prodia", "Owner": "Prodia", "Device": "Undisclosed", "Model": "FLUX Dev", "Optimization": "fast", "URL": "https://app.prodia.com/models", "PartiPromts (ARNIQA)": 0.6224, "PartiPromts (ClipScore)": 26.8405, "PartiPromts (ClipIQA)": 0.9159, "PartiPromts (Sharpness - Laplacian Variance)": 5774.8605, "DrawBench (ClipScore)": 26.6909, "DrawBench (Image Reward)": 0.9675, "GenAI-Bench (VQA)": 0.7363, "OneIG (Anime and Stylization) (Alignment Score)": null, "Long Text Bench (edit_distance)": 178.3375, "Long Text Bench (text_word_accuracy)": null, "HPS (v2.1)": 0.1995, "Median Inference Time": 1.9977, "Price per Image": 0.02}
-{"Platform": "Prodia", "Owner": "Prodia", "Device": "Undisclosed", "Model": "FLUX 1.1 Pro", "Optimization": "Undisclosed", "URL": "https://app.prodia.com/models", "HPS (v2.1)": 0.2075, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "DrawBench (ClipScore)": 27.6498, "DrawBench (Image Reward)": 0.9484, "GenAI-Bench (VQA)": 0.7739, "OneIG (Anime and Stylization) (Alignment Score)": null, "PartiPromts (ARNIQA)": 0.6181, "PartiPromts (ClipScore)": 27.3402, "PartiPromts (ClipIQA)": 0.895, "PartiPromts (Sharpness - Laplacian Variance)": 6932.3266, "Median Inference Time": 3.285, "Price per Image": 0.04}
-{"Platform": "fal.ai", "Owner": "fal.ai", "Device": "Undisclosed", "Model": "FLUX Schnell", "Optimization": "schnell", "URL": "https://fal.ai/models/fal-ai/flux/schnell", "HPS (v2.1)": 0.206, "Long Text Bench (edit_distance)": 178.3125, "Long Text Bench (text_word_accuracy)": 0.0003, "PartiPromts (ARNIQA)": 0.6637, "PartiPromts (ClipScore)": 27.755, "PartiPromts (ClipIQA)": 0.8991, "PartiPromts (Sharpness - Laplacian Variance)": 6420.4761, "OneIG (Anime and Stylization) (Alignment Score)": null, "GenAI-Bench (VQA)": 0.7919, "DrawBench (ClipScore)": 28.0585, "DrawBench (Image Reward)": 0.9376, "Median Inference Time": 0.7981, "Price per Image": 0.003}
-{"Platform": "Together AI", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX Dev", "Optimization": "dev", "URL": "https://www.together.ai/models/flux-1-dev", "Long Text Bench (edit_distance)": 178.0437, "Long Text Bench (text_word_accuracy)": null, "GenAI-Bench (VQA)": 0.7592, "OneIG (Anime and Stylization) (Alignment Score)": null, "PartiPromts (ARNIQA)": 0.5982, "PartiPromts (ClipScore)": 27.5003, "PartiPromts (ClipIQA)": 0.8799, "PartiPromts (Sharpness - Laplacian Variance)": 5101.113, "HPS (v2.1)": 0.1973, "DrawBench (ClipScore)": 27.3007, "DrawBench (Image Reward)": 0.9612, "Median Inference Time": 3.862, "Price per Image": 0.025}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "1xH100", "Model": "FLUX 1.1 Pro", "Optimization": "Undisclosed", "URL": "https://replicate.com/black-forest-labs/flux-1.1-pro", "PartiPromts (ARNIQA)": 0.5879, "PartiPromts (ClipScore)": 27.8015, "PartiPromts (ClipIQA)": 0.8273, "PartiPromts (Sharpness - Laplacian Variance)": 6773.8274, "HPS (v2.1)": 0.2048, "OneIG (Anime and Stylization) (Alignment Score)": 0.87, "OneIG (General Object) (Alignment Score)": 0.83, "OneIG (Portrait) (Alignment Score)": 0.78, "DrawBench (ClipScore)": 27.7958, "DrawBench (Image Reward)": 0.9258, "Long Text Bench (edit_distance)": 163.28, "Long Text Bench (text_word_accuracy)": null, "GenAI-Bench (VQA)": 0.7813, "Median Inference Time": 2.8571, "Price per Image": 0.04}
-{"Platform": "Black Forest Labs", "Owner": "Black Forest Labs", "Device": "1xH100", "Model": "FLUX 2 pro", "Optimization": "Undisclosed", "URL": "https://bfl.ai/models", "PartiPromts (ARNIQA)": 0.6488, "PartiPromts (ClipScore)": 28.0808, "PartiPromts (ClipIQA)": 0.9172, "PartiPromts (Sharpness - Laplacian Variance)": 9335.3041, "GenAI-Bench (VQA)": 0.9633, "OneIG (Anime and Stylization) (Alignment Score)": null, "DrawBench (ClipScore)": 28.22, "DrawBench (Image Reward)": 1.0339, "Long Text Bench (edit_distance)": 159.2424, "Long Text Bench (text_word_accuracy)": null, "HPS (v2.1)": 0.1894, "Median Inference Time": 9.1787, "Price per Image": 0.1}
-{"Platform": "fal.ai", "Owner": "fal.ai", "Device": "Undisclosed", "Model": "FLUX Krea", "Optimization": "Undisclosed", "URL": "https://fal.ai/models/fal-ai/flux/krea", "DrawBench (ClipScore)": 28.1482, "DrawBench (Image Reward)": 0.9853, "OneIG (Anime and Stylization) (Alignment Score)": null, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "GenAI-Bench (VQA)": 0.7949, "PartiPromts (ARNIQA)": 0.615, "PartiPromts (ClipScore)": 27.7512, "PartiPromts (ClipIQA)": 0.848, "PartiPromts (Sharpness - Laplacian Variance)": 4043.6115, "HPS (v2.1)": 0.1902, "Median Inference Time": 2.0193, "Price per Image": 0.025}
-{"Platform": "Runware", "Owner": "Runware", "Device": "Undisclosed", "Model": "FLUX Dev", "Optimization": "Undisclosed", "URL": "https://runware.ai/models#", "PartiPromts (ARNIQA)": 0.638, "PartiPromts (ClipScore)": 27.3993, "PartiPromts (ClipIQA)": 0.8887, "PartiPromts (Sharpness - Laplacian Variance)": 6238.0671, "DrawBench (ClipScore)": 27.2074, "DrawBench (Image Reward)": 0.9923, "GenAI-Bench (VQA)": 0.7761, "Long Text Bench (edit_distance)": 178.3625, "Long Text Bench (text_word_accuracy)": null, "HPS (v2.1)": 0.194, "OneIG (Anime and Stylization) (Alignment Score)": null, "Median Inference Time": 4.2133, "Price per Image": 0.0038}
-{"Platform": "Black Forest Labs", "Owner": "Black Forest Labs", "Device": "1xH100", "Model": "FLUX 2 beta", "Optimization": "Undisclosed", "URL": "https://bfl.ai/models", "DrawBench (ClipScore)": 28.2489, "DrawBench (Image Reward)": 1.0498, "PartiPromts (ARNIQA)": 0.5988, "PartiPromts (ClipScore)": 28.2471, "PartiPromts (ClipIQA)": 0.8992, "PartiPromts (Sharpness - Laplacian Variance)": 7910.49, "Long Text Bench (edit_distance)": 155.9429, "Long Text Bench (text_word_accuracy)": null, "OneIG (Anime and Stylization) (Alignment Score)": null, "HPS (v2.1)": 0.2121, "GenAI-Bench (VQA)": 0.9673, "Median Inference Time": 15.5713, "Price per Image": 0.025}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "1xH100", "Model": "FLUX Schnell", "Optimization": "go_fast", "URL": "https://replicate.com/black-forest-labs/flux-schnell", "DrawBench (ClipScore)": 28.0363, "DrawBench (Image Reward)": 0.9009, "GenAI-Bench (VQA)": 0.7765, "OneIG (Anime and Stylization) (Alignment Score)": 0.88, "OneIG (Portrait) (Alignment Score)": 0.79, "OneIG (General Object) (Alignment Score)": 0.83, "PartiPromts (ARNIQA)": 0.5714, "PartiPromts (ClipScore)": 27.9771, "PartiPromts (ClipIQA)": 0.7947, "PartiPromts (Sharpness - Laplacian Variance)": 5685.5457, "HPS (v2.1)": 0.2086, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "Median Inference Time": 0.979, "Price per Image": 0.003}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "1xH100", "Model": "FLUX Krea", "Optimization": "go_fast", "URL": "https://replicate.com/black-forest-labs/flux-krea-dev", "DrawBench (ClipScore)": 28.3217, "DrawBench (Image Reward)": 0.9533, "PartiPromts (ARNIQA)": 0.6336, "PartiPromts (ClipScore)": 27.88, "PartiPromts (ClipIQA)": 0.8167, "PartiPromts (Sharpness - Laplacian Variance)": 4121.4541, "HPS (v2.1)": 0.1967, "OneIG (Anime and Stylization) (Alignment Score)": 0.88, "OneIG (Portrait) (Alignment Score)": 0.81, "OneIG (General Object) (Alignment Score)": 0.84, "GenAI-Bench (VQA)": 0.8218, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "Median Inference Time": 1.8774, "Price per Image": 0.025}
-{"Platform": "Prodia", "Owner": "Prodia", "Device": "Undisclosed", "Model": "FLUX Schnell", "Optimization": "fast", "URL": "https://app.prodia.com/models", "PartiPromts (ARNIQA)": 0.5726, "PartiPromts (ClipScore)": 27.388, "PartiPromts (ClipIQA)": 0.8827, "PartiPromts (Sharpness - Laplacian Variance)": 5464.0814, "OneIG (Anime and Stylization) (Alignment Score)": null, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "DrawBench (ClipScore)": 27.7805, "DrawBench (Image Reward)": 0.9845, "GenAI-Bench (VQA)": 0.7878, "HPS (v2.1)": 0.2128, "Median Inference Time": 0.7472, "Price per Image": 0.0015}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "1xH100", "Model": "FLUX Dev", "Optimization": "go_fast", "URL": "https://replicate.com/black-forest-labs/flux-dev", "PartiPromts (ARNIQA)": 0.5764, "PartiPromts (ClipScore)": 27.8144, "PartiPromts (ClipIQA)": 0.7859, "PartiPromts (Sharpness - Laplacian Variance)": 5164.9466, "Long Text Bench (edit_distance)": 177.8931, "Long Text Bench (text_word_accuracy)": null, "DrawBench (ClipScore)": 27.7887, "DrawBench (Image Reward)": 1.0318, "OneIG (Anime and Stylization) (Alignment Score)": 0.85, "OneIG (Portrait) (Alignment Score)": 0.78, "OneIG (General Object) (Alignment Score)": 0.8, "HPS (v2.1)": 0.1982, "GenAI-Bench (VQA)": 0.7686, "Median Inference Time": 1.8018, "Price per Image": 0.025}
-{"Platform": "Together AI", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX Schnell", "Optimization": "schnell", "URL": "https://www.together.ai/models/flux-1-schnell", "PartiPromts (ARNIQA)": 0.6082, "PartiPromts (ClipScore)": 27.6475, "PartiPromts (ClipIQA)": 0.898, "PartiPromts (Sharpness - Laplacian Variance)": 6446.8138, "DrawBench (ClipScore)": 27.6897, "DrawBench (Image Reward)": 0.9301, "GenAI-Bench (VQA)": 0.7706, "OneIG (Anime and Stylization) (Alignment Score)": null, "HPS (v2.1)": 0.2058, "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "Median Inference Time": 1.3602, "Price per Image": 0.003}
-{"Platform": "Runware", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX 1.1 Pro", "Optimization": "Undisclosed", "URL": "https://runware.ai/models#", "PartiPromts (ARNIQA)": 0.659, "PartiPromts (ClipScore)": 27.4929, "PartiPromts (ClipIQA)": 0.9074, "PartiPromts (Sharpness - Laplacian Variance)": 6874.5826, "Long Text Bench (edit_distance)": 167.1325, "Long Text Bench (text_word_accuracy)": null, "DrawBench (ClipScore)": 27.7755, "DrawBench (Image Reward)": 0.9277, "HPS (v2.1)": 0.1971, "OneIG (Anime and Stylization) (Alignment Score)": null, "GenAI-Bench (VQA)": 0.7723, "Median Inference Time": 4.2135, "Price per Image": 0.04}
-{"Platform": "Runware", "Owner": "Runware", "Device": "Undisclosed", "Model": "FLUX Schnell", "Optimization": "Undisclosed", "URL": "https://runware.ai/models#", "HPS (v2.1)": 0.2026, "PartiPromts (ARNIQA)": 0.6344, "PartiPromts (ClipScore)": 27.7251, "PartiPromts (ClipIQA)": 0.8873, "PartiPromts (Sharpness - Laplacian Variance)": 7144.7132, "GenAI-Bench (VQA)": 0.769, "OneIG (Anime and Stylization) (Alignment Score)": null, "DrawBench (ClipScore)": 27.9708, "DrawBench (Image Reward)": 0.9571, "Long Text Bench (edit_distance)": 178.3812, "Long Text Bench (text_word_accuracy)": 0.0005, "Median Inference Time": 1.7584, "Price per Image": 0.0013}
-{"Platform": "Together AI", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX Krea", "Optimization": "dev", "URL": "https://www.together.ai/models/flux-1-krea-dev", "Long Text Bench (edit_distance)": 178.5125, "Long Text Bench (text_word_accuracy)": null, "DrawBench (ClipScore)": 28.2254, "DrawBench (Image Reward)": 1.101, "GenAI-Bench (VQA)": 0.797, "PartiPromts (ARNIQA)": 0.618, "PartiPromts (ClipScore)": 27.6353, "PartiPromts (ClipIQA)": 0.8776, "PartiPromts (Sharpness - Laplacian Variance)": 5297.8361, "OneIG (Anime and Stylization) (Alignment Score)": null, "HPS (v2.1)": 0.1981, "Median Inference Time": 4.3831, "Price per Image": 0.025}
-{"Platform": "Bria", "Owner": "Bria", "Device": "Undisclosed", "Model":"FIBO", Optimization: "Undisclosed", "URL": "https://bria.ai/models", "OneIG (Anime and Stylization) (Alignment Score)": 0.87, "Median Inference Time": 15.8328 , "Price per Image": 0.04}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX 1.1 Pro Ultra", "Optimization": "Undisclosed", "URL": "", "OneIG (Anime and Stylization) (Alignment Score)": 0.89, "OneIG (Portrait) (Alignment Score)": 0.8, "OneIG (General Object) (Alignment Score)": 0.85}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX 2 Pro", "Optimization": "", URL: "", "OneIG (Anime and Stylization) (Alignment Score)": 0.92, "OneIG (Portrait) (Alignment Score)": 0.84, "OneIG (General Object) (Alignment Score)": 0.88}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "FLUX 2 Flex", "Optimization": "", URL: "", "OneIG (Anime and Stylization) (Alignment Score)": 0.92, "OneIG (Portrait) (Alignment Score)": 0.84, "OneIG (General Object) (Alignment Score)": 0.90}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "Flux 2 Max", "Optimization": "", URL: "", "OneIG (Anime and Stylization) (Alignment Score)": 0.93, "OneIG (Portrait) (Alignment Score)": 0.85, "OneIG (General Object) (Alignment Score)": 0.89}
-{"Platform": "Replicate", "Owner": "Black Forest Labs", "Device": "Undisclosed", "Model": "Flux 2 Pro", "Optimization": "", URL: "", "OneIG (Anime and Stylization) (Alignment Score)": null, "OneIG (Portrait) (Alignment Score)": 0.84, "OneIG (General Object) (Alignment Score)": 0.90}
-{"Platform": "Replicate", "Owner": "Open AI", "Device": "Undisclosed", "Model": "GPT Image 1.5", "Optimization": "", URL: "", "OneIG (Anime and Stylization) (Alignment Score)": 0.92, "OneIG (Portrait) (Alignment Score)": 0.85, "OneIG (General Object) (Alignment Score)": null}
-{"Platform": "Replicate", "Owner": "Pruna AI", "Device": "Undisclosed", "Model": "Hidream I1 Dev", "Optimzation": "Extra Juiced", "URL":"", "OneIG (Anime and Stylization) (Alignment Score)": 0.87, "OneIG (Portrait) (Alignment Score)": 0.79, "OneIG (General Object) (Alignment Score)": 0.82}
-{"Platform": "Replicate", "Owner": "Pruna AI", "Device": "Undisclosed", "Model": "Hidream I1 Faast", "Optimzation": "Extra Juiced", "URL":"", "OneIG (Anime and Stylization) (Alignment Score)": 0.87, "OneIG (Portrait) (Alignment Score)": 0.79, "OneIG (General Object) (Alignment Score)": 0.82}
-
-

model_display.py

@@ -0,0 +1,214 @@
+"""UI-only model display names.
+
+Raw CSV / sample IDs stay unchanged; this maps aliases to a shared label
+shown in leaderboards, Pareto plots, dropdowns, and sample headers.
+"""
+
+from __future__ import annotations
+
+import re
+
+# Explicit aliases (any leaderboard / sample id) -> shared display label.
+MODEL_DISPLAY_NAMES = {
+    # FLUX
+    "flux_2_pro": "FLUX.2 [pro]",
+    "flux_2_max": "FLUX.2 [max]",
+    "flux_2_flex": "FLUX.2 [flex]",
+    "flux_2_dev": "FLUX.2 [dev]",
+    "flux_1_1_pro": "FLUX1.1 [pro]",
+    "flux_1_1_pro_ultra": "FLUX1.1 [pro] Ultra",
+    "flux_dev": "FLUX.1 [dev]",
+    "flux_schnell": "FLUX.1 [schnell]",
+    "flux_krea": "FLUX.1 Krea [dev]",
+    # GPT Image
+    "gpt_image_2": "GPT Image 2",
+    "GPT Image 2 (high)": "GPT Image 2",
+    "gpt_image_1_5": "GPT Image 1.5",
+    "GPT Image 1.5 (high)": "GPT Image 1.5",
+    "gpt_image_1": "GPT Image 1",
+    "GPT Image 1 (high)": "GPT Image 1",
+    "GPT Image 1 Mini (medium)": "GPT Image 1 Mini",
+    # Nano Banana / Gemini
+    "nano_banana_2_0": "Nano Banana 2",
+    "nano_banana_2": "Nano Banana 2",
+    "Nano Banana 2 (Gemini 3.1 Flash Image Preview)": "Nano Banana 2",
+    "Nano Banana 2 Lite (Gemini 3.1 Flash Lite Image)": "Nano Banana 2 Lite",
+    "nano_banana_pro": "Nano Banana Pro",
+    "Nano Banana Pro (Gemini 3 Pro Image)": "Nano Banana Pro",
+    "Nano Banana (Gemini 2.5 Flash Image)": "Nano Banana",
+    # Seedream
+    "seedream_5_0": "Seedream 5.0",
+    "seedream_4_5": "Seedream 4.5",
+    "seedream_4_0": "Seedream 4.0",
+    "seedream_3": "Seedream 3.0",
+    # Qwen
+    "qwen_image": "Qwen Image",
+    "qwen_image_2_0_pro": "Qwen Image 2.0 Pro",
+    "Qwen Image 2.0 Pro (2026-04-22)": "Qwen Image 2.0 Pro",
+    "Qwen Image 2.0 (2026-03-03)": "Qwen Image 2.0",
+    "qwen_image_2512": "Qwen Image 2512",
+    "Qwen Image Max 2512": "Qwen Image 2512",
+    "qwen_image_fast": "Qwen Image Fast",
+    # Ideogram
+    "ideogram_4_0_quality": "Ideogram 4.0 Quality",
+    "Ideogram 4.0 (Quality)": "Ideogram 4.0 Quality",
+    "Ideogram 4.0 Fast (Quality)": "Ideogram 4.0 Fast Quality",
+    # Imagen
+    "imagen_4_0": "Imagen 4",
+    "imagen_4": "Imagen 4",
+    "Imagen 4 Standard": "Imagen 4",
+    "imagen_4_0_ultra": "Imagen 4 Ultra",
+    "imagen_4_ultra": "Imagen 4 Ultra",
+    "imagen_4_fast": "Imagen 4 Fast",
+    "Imagen 3 (v002)": "Imagen 3",
+    # HiDream
+    "hidream_i1_dev": "HiDream-I1 Dev",
+    "HiDream-I1-Dev": "HiDream-I1 Dev",
+    "hidream_i1_fast": "HiDream-I1 Fast",
+    "HiDream-I1-Fast": "HiDream-I1 Fast",
+    "hidream_i1_full": "HiDream-I1 Full",
+    "HiDream-O1-Image": "HiDream-O1",
+    "HiDream-O1-Image-1.5": "HiDream-O1 1.5",
+    "HiDream-O1-Image-Dev": "HiDream-O1 Dev",
+    # Reve
+    "reve_2_1": "Reve 2.1",
+    "Reve Image (Halfmoon)": "Reve Image",
+    # P-Image
+    "p_image": "P-Image",
+    "p_image_2_ideogram_very_low_1k": "P-Image-Ideogram Very Low 1K",
+    "p_image_2_ideogram_very_low_2k": "P-Image-Ideogram Very Low 2K",
+    "P-Image-Ideogram (Very Low)": "P-Image-Ideogram Very Low",
+    "p_image_2_ideogram_low_1k": "P-Image-Ideogram Low 1K",
+    "p_image_2_ideogram_low_2k": "P-Image-Ideogram Low 2K",
+    "P-Image-Ideogram (Low)": "P-Image-Ideogram Low",
+    "p_image_2_ideogram_medium_1k": "P-Image-Ideogram Medium 1K",
+    "p_image_2_ideogram_medium_2k": "P-Image-Ideogram Medium 2K",
+    "P-Image-Ideogram (Medium)": "P-Image-Ideogram Medium",
+    "p_image_2_ideogram_high_1k": "P-Image-Ideogram High 1K",
+    "p_image_2_ideogram_high_2k": "P-Image-Ideogram High 2K",
+    "P-Image-Ideogram (High)": "P-Image-Ideogram High",
+    # Others overlapping P-Bench
+    "z_image": "Z-Image",
+    "glm_image": "GLM-Image",
+    "hunyuanimage_3_0": "HunyuanImage 3.0",
+    "hunyuan_image_3": "HunyuanImage 3.0",
+    "HunyuanImage 3.0 (Fal)": "HunyuanImage 3.0",
+    "HunyuanImage 3.0 Instruct (Fal)": "HunyuanImage 3.0 Instruct",
+    "wan_2_2_image": "Wan 2.2 Image",
+    "Wan2.6 Text to Image": "Wan 2.6 Text to Image",
+    "kling_v2_1": "Kling v2.1",
+    "juggernaut_base_flux": "Juggernaut Base FLUX",
+    "juggernaut_pro_flux": "Juggernaut Pro FLUX",
+    "juggernaut_lightning_flux": "Juggernaut Lightning FLUX",
+    "bria_4_fibo": "Bria FIBO",
+    "sdxl": "SDXL 1.0",
+    "Stable Diffusion XL 1.0": "SDXL 1.0",
+    "sdxl_lightning": "SDXL Lightning",
+    # Arena AI (kebab / arena.ai ids)
+    "gpt-image-2 (medium)": "GPT Image 2",
+    "gpt-image-1.5-high-fidelity": "GPT Image 1.5",
+    "gpt-image-1": "GPT Image 1",
+    "gpt-image-1-mini": "GPT Image 1 Mini",
+    "mai-image-2.6-preview": "MAI-Image-2.6 Preview",
+    "mai-image-2.5": "MAI-Image-2.5",
+    "mai-image-2": "MAI-Image-2",
+    "mai-image-1": "MAI Image 1",
+    "grok-imagine-image-2.0 (low)": "Grok Imagine Image 2.0",
+    "grok-imagine-image": "Grok Imagine Image",
+    "grok-imagine-image-pro": "Grok Imagine Image Pro",
+    "reve-2.1": "Reve 2.1",
+    "reve-2.0": "Reve 2.0",
+    "reve-v1.5": "Reve 1.5",
+    "muse-image": "Muse Image",
+    "gemini-3.1-flash-image (nano-banana-2) [web-search]": "Nano Banana 2",
+    "gemini-3.1-flash-lite-image (nano-banana-2-lite)": "Nano Banana 2 Lite",
+    "gemini-3-pro-image-2k (nano-banana-pro)": "Nano Banana Pro 2K",
+    "gemini-3-pro-image-preview (nano-banana-pro)": "Nano Banana Pro",
+    "gemini-2.5-flash-image-preview (nano-banana)": "Nano Banana",
+    "gemini-2.0-flash-preview-image-generation": "Gemini 2.0 Flash Image",
+    "seedream-5.0-pro": "Seedream 5.0 Pro",
+    "seedream-5.0-lite": "Seedream 5.0 Lite",
+    "seedream-4.5": "Seedream 4.5",
+    "seedream-4-2k": "Seedream 4.0 2K",
+    "seedream-4-fal": "Seedream 4.0",
+    "seedream-4-high-res-fal": "Seedream 4.0 High Res",
+    "seedream-3": "Seedream 3.0",
+    "qwen-image-3.0-pro": "Qwen Image 3.0 Pro",
+    "qwen-image-2.0-pro-2026-06-22": "Qwen Image 2.0 Pro",
+    "qwen-image-2512": "Qwen Image 2512",
+    "qwen-image-prompt-extend": "Qwen Image Prompt Extend",
+    "qwen-image": "Qwen Image",
+    "uni-1.1-max": "Luma UNI 1 Max",
+    "uni-1.1": "Luma UNI 1",
+    "Cosmos3-Super-Text2Image (Agentic)": "Cosmos3 Super Text2Image (Agentic)",
+    "Cosmos3-Super-Text2Image": "Cosmos3 Super Text2Image",
+    "recraft-v4.1-utility-pro": "Recraft V4.1 Utility Pro",
+    "recraft-v4.1-pro": "Recraft V4.1 Pro",
+    "recraft-v4": "Recraft V4",
+    "recraft-v3": "Recraft V3",
+    "flux-2-max": "FLUX.2 [max]",
+    "flux-2-flex": "FLUX.2 [flex]",
+    "flux-2-pro": "FLUX.2 [pro]",
+    "flux-2-dev": "FLUX.2 [dev]",
+    "flux-2-klein-9b": "FLUX.2 [klein] 9B",
+    "flux-2-klein-4b": "FLUX.2 [klein] 4B",
+    "flux-1-kontext-max": "FLUX.1 Kontext [max]",
+    "flux-1-kontext-pro": "FLUX.1 Kontext [pro]",
+    "flux-1-kontext-dev": "FLUX.1 Kontext [dev]",
+    "flux-1.1-pro": "FLUX1.1 [pro]",
+    "flux-1-dev-fp8": "FLUX.1 [dev]",
+    "hunyuan-image-3.0": "HunyuanImage 3.0",
+    "imagen-ultra-4.0-generate-001": "Imagen 4 Ultra",
+    "imagen-4.0-generate-001": "Imagen 4",
+    "imagen-3.0-generate-002": "Imagen 3",
+    "wan2.6-t2i": "Wan 2.6 Text to Image",
+    "wan2.5-t2i-preview": "Wan 2.5 Preview",
+    "wan2.7-image-pro": "Wan 2.7 Pro",
+    "wan2.7-image": "Wan 2.7",
+    "ideogram-4.0-quality": "Ideogram 4.0 Quality",
+    "ideogram-v3-quality": "Ideogram 3.0",
+    "ideogram-v2": "Ideogram v2",
+    "krea-2-medium": "Krea 2 Medium",
+    "krea-2-turbo": "Krea 2 Medium Turbo",
+    "krea-2-large": "Krea 2 Large",
+    "hidream-o1-image": "HiDream-O1",
+    "z-image-turbo": "Z-Image Turbo",
+    "photon": "Luma Photon",
+    "p-image": "P-Image",
+    "runway-gen4": "Runway Gen-4 Image",
+    "lucid-origin": "Lucid Origin",
+    "glm-image": "GLM-Image",
+    "dall-e-3": "DALLE 3",
+    "stable-diffusion-v35-large": "Stable Diffusion 3.5 Large",
+    "bagel": "Bagel",
+}
+
+
+def _prettify_snake_case(model_id: str) -> str:
+    parts = [part for part in str(model_id).split("_") if part]
+    pretty = []
+    for part in parts:
+        if part.isdigit():
+            pretty.append(part)
+        elif re.fullmatch(r"\d+k", part, flags=re.IGNORECASE):
+            pretty.append(part.upper())
+        elif part.lower() in {"flux", "gpt", "sdxl", "glm"}:
+            pretty.append(part.upper())
+        else:
+            pretty.append(part.capitalize())
+    return " ".join(pretty)
+
+
+def display_model_name(model_id) -> str:
+    """Return the shared UI label for a raw model id / source name."""
+    if model_id is None:
+        return ""
+    raw = str(model_id).strip()
+    if not raw:
+        return ""
+    if raw in MODEL_DISPLAY_NAMES:
+        return MODEL_DISPLAY_NAMES[raw]
+    # Already a human label (spaces / punctuation) — keep as-is.
+    if re.search(r"[\s.\[\]()]", raw):
+        return raw
+    return _prettify_snake_case(raw)

requirements.txt

@@ -1,2 +1 @@
-gradio-leaderboard
-plotly
+plotly