Simplify leaderboard layout and remove supplementary sections

Use an official leaderboard heading with compact resource and result controls. Remove the introductory graphic, benchmark statistics, model highlights, methodology and FAQ sections; keep citation and JSON actions in the table footer.

README.md

@@ -7,13 +7,12 @@ sdk: static
 app_file: index.html
 pinned: false
 fullWidth: true
-short_description: Reasoning-informed visual editing — RISEBench & RISEBench++
+short_description: Official Leaderboard of RISEBench
 ---
 
 # RISE Leaderboard
 
-Interactive English and Chinese results for RISEBench++ (58 approaches in each language), plus the original RISEBench results (20 models).
+Official leaderboard of RISEBench and RISEBench++.
 
 [Code](https://github.com/VisionXLab/RISEBench) · [RISEBench++ paper](https://arxiv.org/abs/2610.12343) · [Dataset](https://huggingface.co/datasets/VisionXLab/RISEBench-plusplus) · [Outputs](https://huggingface.co/datasets/VisionXLab/RISEBench-plusplus_Outputs)
 
-Select a benchmark and instruction language, filter and sort results, compare up to three models, and export scores as CSV or JSON.

app.js

@@ -54,35 +54,16 @@
   }
   function renderResources() {
     const b=benchmark();
-    $('#hero-links').innerHTML=[['Paper','paper'],['Dataset','data'],['Model outputs','outputs'],['Code','github']].map(([label,key])=>`<a href="${esc(b.links[key])}" target="_blank" rel="noopener noreferrer">${label} <span aria-hidden="true">↗</span></a>`).join('');
-    $('#method-paper').href=b.links.paper; $('#evaluation-link').href=b.links.github+'#quick-start';
-    $('#board-title').textContent='The reasoning leaderboard';
-    $('#board-description').textContent=isPlus()?'Six reasoning dimensions. Single-image, multi-image, and multi-turn editing.':'Four core reasoning dimensions on the original RISEBench-360 benchmark.';
-    $('#board-edition').textContent=resultLanguageLabel().toUpperCase()+' RESULTS · '+b.name.toUpperCase();
+    $('#hero-links').innerHTML=[['Paper','paper'],['Dataset','data'],['Outputs','outputs'],['Code','github']].map(([label,key])=>`<a href="${esc(b.links[key])}" target="_blank" rel="noopener noreferrer">${label} <span aria-hidden="true">↗</span></a>`).join('');
     $('#board-options').hidden=b.available_result_languages.length<2;
     $$('[data-language]').forEach(button=>button.setAttribute('aria-pressed',button.dataset.language===languageCode()));
-    $('#insights-caption').textContent=resultLanguageLabel()+' results · Full-benchmark highlights';
-    $('#dataset-stats').innerHTML=[[b.models.length,'Models'],[b.case_count.toLocaleString('en-US'),'Test cases'],[b.dimensions.length,'Dimensions']].map(([n,l])=>`<div><strong>${n}</strong><span>${l}</span></div>`).join('');
     $('#group-filters').innerHTML=isPlus()?['all','closed','open','agentic'].map(g=>`<button data-group="${g}" aria-pressed="${state.group===g}">${g==='all'?'All models':groupLabels[g]}<span>${g==='all'?b.models.length:b.models.filter(m=>m.group===g).length}</span></button>`).join(''):'<span class="caption-text">All models</span>';
     $('.input-filter').hidden=!isPlus();
-    $('#ranking-note').textContent=isPlus()?'Total covers the full benchmark. Single and Multi report their respective input subsets. Single-image-only models are evaluated on the single-image subset and have no Multi or Total score.':'Overall covers all 360 cases. Evaluation scores use a separate 100-point scale.';
-    $('#accuracy-explainer').textContent='Accuracy is the percentage of cases that receive full marks on every applicable evaluation dimension. The separate evaluation scores summarize Instruction Reasoning, Appearance Consistency, and Visual Plausibility on a 100-point scale. A high visual-quality score alone does not imply a reasoning-correct edit.';
-    $('#subset-explainer').textContent=isPlus()?'Total covers the complete benchmark; Single and Multi report the respective input subsets. Models without multi-image support only have single-image results. Their dimension and evaluation scores are therefore on a different subset. Use the input-support filter for matched comparisons. A dash means not evaluated, not a score of zero.':'RISEBench covers 360 cases. RISEBench and RISEBench++ use different test sets and evaluation setups; compare models within the same benchmark.';
-    renderColumns(); renderInsights(); renderDimensions();
+    renderColumns();
   }
   function renderColumns() {
     $('#column-options').innerHTML='<div class="eyebrow muted" >VISIBLE SCORE COLUMNS</div>'+availableColumns().map(c=>`<label><input type="checkbox" data-column="${c.key}" ${state.visible.includes(c.key)?'checked':''}>${esc(c.label)}</label>`).join('');
   }
-  function renderInsights() {
-    const b=benchmark();
-    const groups=isPlus()?['closed','open','agentic']:[null,null,null];
-    const leaders=isPlus()?groups.map(g=>b.models.filter(m=>m.group===g&&m.accuracy.total!==null).sort((a,b)=>b.accuracy.total-a.accuracy.total)[0]):[...b.models].filter(m=>m.accuracy.total!==null).sort((a,b)=>b.accuracy.total-a.accuracy.total).slice(0,3);
-    $('#insight-grid').innerHTML=leaders.map((m,i)=>`<article class="insight-card ${esc(groups[i]||'')}"><span class="eyebrow">${isPlus()?(groups[i]==='agentic'?'FEATURED AGENTIC METHOD':'LEADING '+groupLabels[groups[i]].toUpperCase()):'OVERALL RANK '+(i+1)}</span><div class="insight-main"><button data-model="${esc(m.id)}">${esc(m.name)} <span aria-hidden="true">↗</span></button><strong class="insight-score">${fmt(m.accuracy.total)}<small>%</small></strong></div><p>${isPlus()?'Full benchmark · Total accuracy':'RISEBench-360 · Overall accuracy'}</p></article>`).join('');
-  }
-  function renderDimensions() {
-    const symbols={temporal:'◷',causal:'↗',spatial:'⌖',logical:'⊞',counterfactual:'⇄',hybrid:'⋈'};
-    $('#dimension-grid').innerHTML=benchmark().dimensions.map(d=>`<article class="dimension-card"><div class="dimension-icon" aria-hidden="true">${symbols[d.key]}</div><h3>${esc(d.label)}</h3><p>${esc(d.description)}</p></article>`).join('');
-  }
   function renderTable() {
     const b=benchmark(), models=filteredModels(), columns=availableColumns().filter(c=>state.visible.includes(c.key));
     const minimumWidth=370+(isPlus()?86:0)+columns.length*96;
@@ -97,8 +78,7 @@
       return `<tr class="${ours?'ours ':''}${state.selected.includes(m.id)?'selected':''}"><td class="select-cell"><input type="checkbox" data-select="${esc(m.id)}" aria-label="Compare ${esc(m.name)}" ${state.selected.includes(m.id)?'checked':''}></td><td class="rank-cell">${rank===null?'—':`<span class="${rank<=3?'rank-top rank-'+rank:''}">${rank}</span>`}</td><th scope="row" class="model-cell" style="position:sticky;top:auto"><button class="model-button" data-model="${esc(m.id)}">${esc(m.name)}</button><span class="model-meta">${m.group?`<span class="group-dot ${m.group}"></span>${groupLabels[m.group]}`:''}${ours?'<span class="ours-badge">OURS</span>':''}</span></th>${isPlus()?`<td><span class="input-pill ${m.multi_image?'multi':''}" title="${m.multi_image?'Supports multiple input images':'Single-image only'}">${m.multi_image?'Multi':'Single'}</span></td>`:''}${cells}</tr>`;
     }).join('');
     $('#empty-state').hidden=models.length>0; $('#results-table').hidden=models.length===0;
-    $('#result-count').innerHTML=`<strong>${models.length}</strong> of ${b.models.length} models <span class="divider">·</span> ${esc(resultLanguageLabel())} <span class="divider">·</span> Sorted by ${esc(scoreLabel(state.sort))} ${state.direction==='desc'?'↓':'↑'}`;
-    $('#row-summary').textContent=`All ${models.length} matching models shown`;
+    $('#result-count').innerHTML=`<strong>${models.length}</strong>${models.length<b.models.length?' / '+b.models.length:''} models`;
     $('#reset-filters').hidden=!(state.query||state.group!=='all'||state.input!=='all');
     $$('#group-filters button').forEach(el=>el.setAttribute('aria-pressed',el.dataset.group===state.group));
     renderTray();
@@ -167,19 +147,16 @@
     const b=benchmark(), models=ids.map(modelById).filter(Boolean);if(!models.length)return;
     const mixed=isPlus()&&new Set(models.map(m=>m.multi_image)).size>1;
     const tableSection=(title,fields,type)=>`<tr class="comparison-section"><td colspan="${models.length+1}">${title}</td></tr>`+fields.map(c=>{const vals=models.map(m=>m[type][c.key]);const max=Math.max(...vals.filter(v=>v!==null));return `<tr><td>${esc(c.label)}</td>${vals.map(v=>`<td class="${v!==null&&v===max&&models.length>1?'best-value':''}">${fmt(v)}${v!==null&&type==='accuracy'?'%':''}</td>`).join('')}</tr>`;}).join('');
-    showDialog(b.name+' · '+resultLanguageLabel().toUpperCase()+' RESULTS',`<h2 class="dialog-title" id="dialog-title">${models.length===1?esc(models[0].name):'Compare reasoning profiles'}</h2><p class="dialog-subtitle">All radar axes use the same 0–100% scale.</p>${mixed?'<p class="comparison-warning">Different input support: single-image-only models use a smaller evaluation subset. Their dimension and evaluation scores are not directly comparable with full-benchmark scores.</p>':''}<div class="comparison-layout">${radar(models)}<div class="compare-summaries">${models.map((m,i)=>`<div class="compare-summary"><div><h4><span class="series-dot" style="background:${colors[i]}"></span>${esc(m.name)}</h4><p>${esc(groupLabels[m.group]||b.name)}${isPlus()?' · '+(m.multi_image?'Multi-image supported':'Single-image only'):''}</p></div><strong style="color:${colors[i]}">${fmt(m.accuracy.total)}<small> ${m.accuracy.total!==null?'%':''}<br>${isPlus()?'Total':'Overall'}</small></strong></div>`).join('')}<p class="caption-text" style="text-align:left;max-width:none">${models.some(m=>m.accuracy.total===null)?'Single-image-only models are evaluated on the single-image subset and have no Total score.':'Total measures full-benchmark accuracy; the radar shows individual reasoning dimensions.'}</p></div></div><div class="comparison-table-wrap"><table class="comparison-table"><thead><tr><th>Metric</th>${models.map((m,i)=>`<th><span class="series-dot" style="background:${colors[i]}"></span>${esc(m.name)}</th>`).join('')}</tr></thead><tbody>${tableSection('REASONING ACCURACY (%)',isPlus()?orderedAccuracyColumns():b.accuracy_columns,'accuracy')}${tableSection('EVALUATION SCORES (/100)',b.metrics,'metrics')}</tbody></table></div><div class="dialog-actions"><button class="outline-button" id="dialog-export">Export ${models.length===1?'model':'comparison'} CSV ↓</button></div>`);
+    showDialog(b.name+' · '+resultLanguageLabel().toUpperCase()+' RESULTS',`<h2 class="dialog-title" id="dialog-title">${models.length===1?esc(models[0].name):'Model comparison'}</h2>${mixed?'<p class="comparison-warning">These models use different evaluation subsets: single-image only and full benchmark.</p>':''}<div class="comparison-layout">${radar(models)}<div class="compare-summaries">${models.map((m,i)=>`<div class="compare-summary"><div><h4><span class="series-dot" style="background:${colors[i]}"></span>${esc(m.name)}</h4><p>${esc(groupLabels[m.group]||b.name)}${isPlus()?' · '+(m.multi_image?'Multi-image supported':'Single-image only'):''}</p></div><strong style="color:${colors[i]}">${fmt(m.accuracy.total)}<small> ${m.accuracy.total!==null?'%':''}<br>${isPlus()?'Total':'Overall'}</small></strong></div>`).join('')}${models.some(m=>m.accuracy.total===null)?'<p class="caption-text">Single-image-only models have no Total score.</p>':''}</div></div><div class="comparison-table-wrap"><table class="comparison-table"><thead><tr><th>Metric</th>${models.map((m,i)=>`<th><span class="series-dot" style="background:${colors[i]}"></span>${esc(m.name)}</th>`).join('')}</tr></thead><tbody>${tableSection('REASONING ACCURACY (%)',isPlus()?orderedAccuracyColumns():b.accuracy_columns,'accuracy')}${tableSection('EVALUATION SCORES (/100)',b.metrics,'metrics')}</tbody></table></div><div class="dialog-actions"><button class="outline-button" id="dialog-export">Export ${models.length===1?'model':'comparison'} CSV ↓</button></div>`);
     $('#dialog-export').addEventListener('click',()=>exportCSV(models,'comparison'));
   }
-  function showFigure() {
-    showDialog('EVALUATION PIPELINE',`<h2 class="dialog-title" id="dialog-title">How edits are evaluated.</h2><p class="dialog-subtitle">${esc(benchmark().name)} evaluation pipeline.</p><img class="figure-image" src="assets/${isPlus()?'judge-plus.png':'judge-base.png'}" alt="Benchmark evaluation pipeline">`);
-  }
   async function copyCitation(text,button) {
     try {await navigator.clipboard.writeText(text);button.textContent='Copied ✓';toast('BibTeX copied.');}
     catch(_){const area=document.createElement('textarea');area.value=text;$('#dialog-content').appendChild(area);area.select();const copied=document.execCommand('copy');area.remove();toast(copied?'BibTeX copied.':'Select and copy the citation below.');}
   }
   function showCitation() {
     const citation=CITATIONS[state.benchmark];
-    showDialog('CITATION',`<h2 class="dialog-title" id="dialog-title">Cite ${esc(benchmark().name)}</h2><p class="dialog-subtitle">Thank you for using RISE in your research.</p><pre class="citation-code"><code>${esc(citation)}</code></pre><div class="dialog-actions"><button class="primary-button" id="copy-citation">Copy BibTeX</button><button class="outline-button" id="save-citation">Download .bib ↓</button></div>`);
+    showDialog('CITATION',`<h2 class="dialog-title" id="dialog-title">Cite ${esc(benchmark().name)}</h2><pre class="citation-code"><code>${esc(citation)}</code></pre><div class="dialog-actions"><button class="primary-button" id="copy-citation">Copy BibTeX</button><button class="outline-button" id="save-citation">Download .bib ↓</button></div>`);
     $('#copy-citation').addEventListener('click',e=>copyCitation(citation,e.currentTarget));
     $('#save-citation').addEventListener('click',()=>download(state.benchmark+'.bib',citation+'\n','text/plain;charset=utf-8'));
   }
@@ -212,7 +189,6 @@
   $('.dialog-close').addEventListener('click',()=>$('#detail-dialog').close());
   $('#detail-dialog').addEventListener('click',e=>{if(e.target===$('#detail-dialog')){const r=e.target.getBoundingClientRect();if(e.clientX<r.left||e.clientX>r.right||e.clientY<r.top||e.clientY>r.bottom)e.target.close();}});
   $('#citation-button').addEventListener('click',showCitation);
-  $('#pipeline-button').addEventListener('click',showFigure);
   document.addEventListener('click',e=>{if(!$('#column-menu').contains(e.target))$('#column-menu').open=false;});
   document.addEventListener('keydown',e=>{
     if(e.key==='/'&&!['INPUT','TEXTAREA','SELECT'].includes(document.activeElement.tagName)&&!$('#detail-dialog').open){e.preventDefault();$('#model-search').focus();}

index.html

@@ -3,43 +3,33 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <meta name="description" content="Explore the RISEBench and RISEBench++ leaderboards for reasoning-informed visual editing. Compare models across reasoning dimensions and evaluation metrics.">
+  <meta name="description" content="Official leaderboard of RISEBench and RISEBench++.">
   <meta name="theme-color" content="#f7f9f9">
-  <title>RISE · Visual Reasoning Leaderboard</title>
+  <title>RISEBench · Official Leaderboard</title>
   <link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
   <link rel="stylesheet" href="styles.css">
 </head>
 <body>
   <a class="skip-link" href="#leaderboard">Skip to leaderboard</a>
-  <header class="site-header">
-    <a href="#" class="wordmark" aria-label="RISE leaderboard home"><svg viewBox="0 0 32 32" aria-hidden="true"><path d="M3 26 12 17 18 22 29 7M19 7h10v10"/></svg><strong>RISE<span>Bench</span></strong><span class="wordmark-rule"></span><span class="wordmark-caption">LEADERBOARD</span></a>
-    <nav aria-label="Main navigation"><a class="nav-active" href="#leaderboard">Rankings</a><a href="#methodology">About the benchmark</a><a href="https://github.com/VisionXLab/RISEBench" target="_blank" rel="noopener noreferrer">GitHub <span aria-hidden="true">↗</span></a></nav>
-  </header>
   <main>
-    <section class="hero page-width" aria-labelledby="hero-title">
-      <div class="hero-copy"><div class="eyebrow"><span class="live-dot"></span> VISIONXLAB · REASONING-INFORMED VISUAL EDITING</div><h1 id="hero-title">Visual reasoning,<br><span>measured.</span></h1><p>How well can visual editors understand what comes next?<br class="desktop-break"> Explore, compare, and understand the RISE benchmark results.</p><div class="resource-links" id="hero-links"></div></div>
-      <div class="hero-art" aria-label="RISEBench++ covers six reasoning dimensions"><svg viewBox="0 0 430 290" role="img" aria-labelledby="art-title"><title id="art-title">Six connected dimensions of visual reasoning</title><defs><linearGradient id="orbitGradient" x1="0" y1="0" x2="1" y2="1"><stop stop-color="#5397b2"/><stop offset="1" stop-color="#6ab28c"/></linearGradient></defs><g fill="none" stroke="#dde7ed"><circle cx="215" cy="145" r="112" stroke-dasharray="3 7"/><circle cx="215" cy="145" r="79"/><path d="M215 33v224M118 89l194 112M118 201 312 89"/></g><polygon points="215,63 289,102 282,184 215,226 143,185 153,109" fill="url(#orbitGradient)" fill-opacity=".11" stroke="url(#orbitGradient)" stroke-width="1.6"/><circle cx="215" cy="145" r="48" fill="white" stroke="#e1e9ee"/><text x="215" y="144" class="orbit-center" text-anchor="middle">RISE<tspan fill="#167b79">++</tspan></text><text x="215" y="161" class="orbit-sub" text-anchor="middle">REASON · EDIT · EVALUATE</text><g class="orbit-labels"><g transform="translate(174 10)"><rect width="82" height="30" rx="8"/><text x="41" y="19">Temporal</text></g><g transform="translate(308 75)"><rect width="79" height="30" rx="8"/><text x="39" y="19">Causal</text></g><g transform="translate(305 193)"><rect width="80" height="30" rx="8"/><text x="40" y="19">Spatial</text></g><g transform="translate(177 250)"><rect width="77" height="30" rx="8"/><text x="38" y="19">Logical</text></g><g transform="translate(9 193)"><rect width="112" height="30" rx="8"/><text x="56" y="19">Counterfactual</text></g><g transform="translate(43 75)"><rect width="76" height="30" rx="8"/><text x="38" y="19">Hybrid</text></g></g><g fill="#42968c" stroke="white" stroke-width="3"><circle cx="215" cy="63" r="5"/><circle cx="289" cy="102" r="5"/><circle cx="282" cy="184" r="5"/><circle cx="215" cy="226" r="5"/><circle cx="143" cy="185" r="5"/><circle cx="153" cy="109" r="5"/></g></svg><span class="art-caption">From implicit intent to precise visual change.</span></div>
-    </section>
+    <header class="leaderboard-header page-width">
+      <h1>Official Leaderboard of RISEBench</h1>
+      <nav class="resource-links" id="hero-links" aria-label="Benchmark resources"></nav>
+    </header>
     <section class="page-width board-section" id="leaderboard" aria-label="Benchmark rankings">
-      <div class="benchmark-bar"><div class="benchmark-tabs" role="group" aria-label="Choose benchmark"><button id="tab-plus" aria-pressed="true" data-benchmark="risebench-plusplus">RISEBench<span class="plus">++</span><span class="small-tag">EXTENDED</span></button><button id="tab-base" aria-pressed="false" data-benchmark="risebench">RISEBench<span class="small-tag neutral">ORIGINAL</span></button></div></div>
-      <div class="board-intro"><div><div class="eyebrow muted" id="board-edition">ENGLISH RESULTS · FULL BENCHMARK</div><h2 id="board-title">The reasoning leaderboard</h2><p id="board-description"></p></div><div class="dataset-stats" id="dataset-stats"></div></div>
-      <div class="board-options" id="board-options">
-        <div class="result-language" id="result-language"><span id="language-label">Instruction language</span><div class="language-tabs" role="group" aria-labelledby="language-label"><button data-language="en" aria-pressed="true" aria-label="English instruction results">English</button><button data-language="zh" aria-pressed="false" aria-label="Chinese instruction results"><span lang="zh-Hans">中文</span></button></div></div>
+      <div class="benchmark-bar">
+        <div class="benchmark-tabs" role="group" aria-label="Choose benchmark"><button id="tab-plus" aria-pressed="true" data-benchmark="risebench-plusplus">RISEBench<span class="plus">++</span></button><button id="tab-base" aria-pressed="false" data-benchmark="risebench">RISEBench</button></div>
+        <div class="board-options" id="board-options"><div class="result-language"><span id="language-label">Instruction language</span><div class="language-tabs" role="group" aria-labelledby="language-label"><button data-language="en" aria-pressed="true" aria-label="English instruction results">English</button><button data-language="zh" aria-pressed="false" aria-label="Chinese instruction results"><span lang="zh-Hans">中文</span></button></div></div></div>
       </div>
       <div class="board-card">
         <div class="view-row"><div class="view-tabs" role="group" aria-label="Result view"><button aria-pressed="true" data-view="accuracy">Reasoning accuracy <span>%</span></button><button aria-pressed="false" data-view="metrics">Evaluation scores <span>/100</span></button></div><div class="view-actions"><button id="download-csv" class="quiet-button" title="Download all filtered rows, in current sort order"><svg class="button-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3v12m-4-4 4 4 4-4M5 16v4h14v-4"/></svg> Export CSV</button><details class="column-menu" id="column-menu"><summary class="quiet-button"><svg class="button-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="4" y="4" width="16" height="16" rx="2"/><path d="M10 4v16m5-16v16"/></svg> Columns</summary><div class="column-popover" id="column-options"></div></details></div></div>
         <div class="filter-row"><label class="search-box"><svg viewBox="0 0 20 20" aria-hidden="true"><circle cx="8.5" cy="8.5" r="5.5"/><path d="m13 13 4 4"/></svg><input type="search" id="model-search" placeholder="Search models…" aria-label="Search models"><kbd>/</kbd></label><div id="group-filters" class="group-filters" role="group" aria-label="Model category"></div><label class="input-filter"><span class="sr-only">Input support</span><select id="input-filter"><option value="all">All inputs</option><option value="multi">Multi-image supported</option><option value="single">Single-image only</option></select></label></div>
-        <div class="table-context"><span id="result-count" aria-live="polite"></span><span class="sort-hint">Click any score to sort <span aria-hidden="true">↕</span><span class="divider">·</span> Select up to 3 models to compare</span><button id="reset-filters" class="text-button" hidden>Reset filters</button></div>
+        <div class="table-context"><span id="result-count" aria-live="polite"></span><span class="sort-hint">Select up to 3 models to compare</span><button id="reset-filters" class="text-button" hidden>Reset filters</button></div>
         <div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable benchmark results"><table id="results-table"><caption class="sr-only" id="table-caption"></caption><thead id="table-head"></thead><tbody id="table-body"></tbody></table><div id="empty-state" class="empty-state" hidden><span aria-hidden="true">⌕</span><h3>No matching models</h3><p>Try another model name or clear the filters.</p><button class="primary-button" id="empty-reset">Reset filters</button></div></div>
-        <div class="table-footer"><div><span class="legend-swatch"></span> Stronger tint = higher score <span class="divider">·</span> <b>—</b> Not evaluated</div><div class="rows-summary" id="row-summary"></div></div>
+        <div class="table-footer"><span><b>—</b> Not evaluated</span><div class="footer-actions"><button id="citation-button" class="quiet-button">Cite</button><a id="json-download" href="data/leaderboard.json" download class="quiet-button">JSON ↓</a></div></div>
       </div>
-      <p class="ranking-note" id="ranking-note"></p>
     </section>
-    <section class="page-width insights-section" aria-labelledby="insights-title"><div class="section-heading"><div><span class="eyebrow muted">A CLOSER LOOK</span><h2 id="insights-title">Different strengths. Different reasoning.</h2></div><span class="caption-text" id="insights-caption">Full-benchmark highlights</span></div><div class="insight-grid" id="insight-grid"></div></section>
-    <section class="method-section" id="methodology"><div class="page-width"><div class="section-heading"><div><span class="eyebrow muted">UNDERSTAND THE BENCHMARK</span><h2>More than following an instruction.</h2></div><a class="text-link" id="method-paper" target="_blank" rel="noopener noreferrer">Read the paper ↗</a></div><p class="section-intro">RISE asks editors to infer the intended outcome, then make the right visual change. Explore the reasoning capabilities behind each score.</p><div class="dimension-grid" id="dimension-grid"></div><div class="method-bottom"><div class="evaluation-card"><span class="eyebrow muted">THREE EVALUATION DIMENSIONS</span><h3>Every applicable dimension matters.</h3><div class="eval-item"><span>01</span><div><h4>Instruction Reasoning</h4><p>Does the image realize the intended reasoning outcome?</p></div></div><div class="eval-item"><span>02</span><div><h4>Appearance Consistency</h4><p>Does unrelated content remain consistent with the input?</p></div></div><div class="eval-item"><span>03</span><div><h4>Visual Plausibility</h4><p>Is the image visually coherent? Logical tasks are excluded; intentionally impossible counterfactual outcomes are not penalized.</p></div></div><button id="pipeline-button" class="text-button">View evaluation pipeline ↗</button></div><div class="faq-list"><details open><summary>How is accuracy different from evaluation scores?</summary><p id="accuracy-explainer"></p></details><details><summary>How should I compare single- and multi-image models?</summary><p id="subset-explainer"></p></details><details><summary>What does the rank mean?</summary><p>Ranks reflect the selected metric across all models in the current benchmark and language. Higher scores rank first; equal scores share a rank. Filtering preserves these ranks, and missing results appear last.</p></details><details><summary>How can I evaluate a model or contribute results?</summary><p>Download the full dataset, follow the evaluation instructions, and report the model version, input setting, judge configuration, and generated outputs. Use the repository to discuss or submit reproducible results.</p><div class="faq-links"><a id="evaluation-link" target="_blank" rel="noopener noreferrer">Evaluation instructions ↗</a><a href="https://github.com/VisionXLab/RISEBench/issues/new" target="_blank" rel="noopener noreferrer">Open a GitHub issue ↗</a></div></details></div></div></div></section>
-    <section class="page-width citation-section"><div><span class="eyebrow muted">BUILT FOR REPRODUCIBLE RESEARCH</span><h2>Use RISE in your work.</h2><p>Explore the data, inspect model outputs, and cite the benchmark.</p></div><div class="citation-actions"><button id="citation-button" class="outline-button"><span aria-hidden="true">{ }</span> Cite this benchmark</button><a id="json-download" href="data/leaderboard.json" download class="quiet-button">Download leaderboard JSON ↓</a></div></section>
   </main>
-  <footer class="page-width"><div><strong>RISE<span>Bench</span></strong><p>Reasoning-Informed Visual Editing</p></div><div>VisionXLab <span class="divider">/</span> RISE Research Series<br><a href="https://github.com/VisionXLab/RISEBench" target="_blank" rel="noopener noreferrer">Data & methodology ↗</a></div></footer>
   <div class="compare-tray" id="compare-tray" hidden><div><strong id="compare-count"></strong><div id="compare-chips"></div></div><div class="tray-actions"><button id="clear-compare" class="quiet-button">Clear</button><button id="compare-open" class="primary-button">Compare models <span aria-hidden="true">↗</span></button></div></div>
   <dialog id="detail-dialog" aria-labelledby="dialog-title"><div class="dialog-top"><span class="eyebrow muted" id="dialog-eyebrow">MODEL COMPARISON</span><button class="dialog-close" aria-label="Close dialog">×</button></div><div id="dialog-content"></div></dialog>
   <div role="status" class="toast" id="toast" hidden></div>

styles.css

@@ -32,72 +32,39 @@ a:hover { color: var(--blue); }
 .muted { color: var(--muted); }
 .divider { margin: 0 8px; color: #b1c0c4; }
 
-/* Identity and introduction */
-.site-header { height: 88px; padding-inline: max(48px, calc((100% - 1536px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); background: white; }
-.wordmark { display: flex; align-items: center; gap: 11px; white-space: nowrap; }
-.wordmark svg { width: 32px; height: 32px; fill: none; stroke: var(--teal); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
-.wordmark strong { font-size: 27px; letter-spacing: -1.1px; }
-.wordmark strong span, footer strong span { font-weight: 400; color: #55717b; }
-.wordmark-rule { height: 24px; width: 1px; background: var(--line); margin: 0 10px; }
-.wordmark-caption { font-size: 12px; letter-spacing: 1.8px; font-weight: 650; color: var(--muted); }
-.site-header nav { display: flex; gap: 32px; align-items: center; font-size: 15px; font-weight: 550; color: #526875; }
-.site-header nav .nav-active { color: var(--teal); }
-.site-header nav a:last-child { border: 1px solid var(--line); border-radius: 9px; padding: 7px 16px; }
-.hero { display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; gap: 48px; padding-block: 44px 48px; }
+/* Compact page heading */
+main { padding-bottom: 48px; }
+.leaderboard-header { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; padding-block: 36px 30px; }
+.leaderboard-header h1 { font-size: clamp(28px, 2.5vw, 36px); font-weight: 650; line-height: 1.25; letter-spacing: -1.1px; margin: 0; }
+.resource-links { display: flex; gap: 20px; flex-wrap: wrap; align-items: center; }
+.resource-links a { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; font-size: 15px; font-weight: 550; color: #58717f; }
+.resource-links a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
+.resource-links span { font-size: 14px; color: #8b9eaa; }
 .eyebrow { font-size: 12px; letter-spacing: 1.4px; font-weight: 700; color: var(--blue); display: flex; align-items: center; gap: 9px; line-height: 1.6; }
 .eyebrow.muted { color: var(--muted); }
-.live-dot { width: 7px; height: 7px; background: #299c88; border-radius: 50%; flex-shrink: 0; box-shadow: 0 0 0 5px #299c8810; }
-.hero h1 { font-size: clamp(44px, 3.8vw, 62px); line-height: 1.08; letter-spacing: -2.6px; margin: 18px 0; font-weight: 720; }
-.hero h1 > span { color: var(--teal); }
-.hero-copy > p { font-size: 17px; color: #607681; line-height: 1.75; margin: 0 0 24px; }
-.resource-links { display: flex; gap: 10px; flex-wrap: wrap; }
-.resource-links a { display: inline-flex; align-items: center; gap: 20px; border: 1px solid #d5e0e2; background: white; min-height: 44px; padding: 8px 17px; font-size: 14px; font-weight: 600; border-radius: 9px; transition: border-color .15s, transform .15s; }
-.resource-links a:hover { border-color: var(--teal); transform: translateY(-1px); }
-.resource-links a:first-child { background: var(--navy); border-color: var(--navy); color: white; }
-.resource-links span { font-size: 17px; }
-.hero-art { max-width: 410px; width: 100%; justify-self: center; text-align: center; position: relative; }
-.hero-art:before { content: ""; position: absolute; inset: 5% 2%; border-radius: 50%; background: radial-gradient(ellipse, #dceeea 0%, #f7f9f900 68%); z-index: -1; }
-.hero-art svg { width: 100%; overflow: visible; }
-.orbit-center { font: 700 24px -apple-system, sans-serif; fill: var(--ink); letter-spacing: -.7px; }
-.orbit-sub { font: 600 6px sans-serif; letter-spacing: .15px; fill: #60818a; }
-.orbit-labels rect { fill: #fff; stroke: #d2e1df; stroke-width: 1; }
-.orbit-labels text { text-anchor: middle; font: 550 12px -apple-system, sans-serif; fill: #405e6b; }
-.art-caption { font-size: 13px; color: #627f89; }
 
 /* Benchmark switcher and context */
 .board-section { scroll-margin-top: 24px; }
-.benchmark-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
+.benchmark-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding-bottom: 22px; }
 .benchmark-tabs { display: inline-flex; gap: 6px; padding: 6px; background: #eaf0f0; border: 1px solid #dde6e7; border-radius: 14px; }
 .benchmark-tabs button { display: flex; align-items: center; justify-content: center; padding: 10px 22px; min-height: 50px; border: 1px solid transparent; border-radius: 10px; font-size: 20px; font-weight: 650; color: #637982; letter-spacing: -.5px; transition: background .15s, color .15s; }
 .benchmark-tabs button:hover { color: var(--ink); }
 .benchmark-tabs button[aria-pressed=true] { background: white; color: var(--ink); border-color: #d8e5e3; box-shadow: 0 2px 6px #193b4810; }
 .plus { color: var(--teal); }
-.small-tag { font-size: 10px; letter-spacing: .7px; font-weight: 700; background: #e6f3ef; color: #317966; line-height: 1.5; border-radius: 5px; margin-left: 10px; padding: 3px 7px; }
-.small-tag.neutral { color: #71848d; background: #edf1f3; }
-.board-intro { display: flex; justify-content: space-between; align-items: center; padding: 30px 0 18px; gap: 32px; }
-.board-intro h2 { font-size: 30px; letter-spacing: -.9px; line-height: 1.3; margin: 6px 0 9px; font-weight: 700; }
-.board-intro p { font-size: 15px; color: var(--muted); margin: 0; }
-.dataset-stats { display: flex; flex-shrink: 0; gap: 30px; }
-.dataset-stats > div { border-left: 1px solid #d6e1e3; padding-left: 28px; display: flex; flex-direction: column; }
-.dataset-stats strong { font-size: 33px; letter-spacing: -1px; font-weight: 650; line-height: 1.3; font-variant-numeric: tabular-nums; }
-.dataset-stats span { font-size: 11px; color: var(--muted); margin-top: 3px; text-transform: uppercase; letter-spacing: 1.2px; }
 .text-button { padding: 0; color: var(--blue); font-size: 14px; font-weight: 600; white-space: nowrap; }
 .text-button:hover, .text-link:hover { text-decoration: underline; text-underline-offset: 4px; }
 
 /* Instruction language is a result setting, shared by both score views. */
-.board-options { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 16px 24px; padding-bottom: 22px; }
+.board-options { display: flex; align-items: center; margin-left: auto; }
 .result-language { display: flex; align-items: center; gap: 13px; flex-shrink: 0; margin-left: auto; }
 .result-language > span { font-size: 13px; color: #627886; }
 .language-tabs { display: flex; gap: 3px; padding: 4px; background: #eaf0f5; border: 1px solid #dde5ed; border-radius: 11px; }
 .language-tabs button { min-height: 38px; min-width: 75px; padding: 6px 16px; border: 1px solid transparent; border-radius: 7px; font-size: 14px; font-weight: 550; line-height: 1.5; color: #718599; }
 .language-tabs button:hover { color: #355777; background: #ffffff65; }
 .language-tabs button[aria-pressed=true] { background: #fff; color: #355777; border-color: #d5e0eb; box-shadow: 0 1px 4px #2649630d; font-weight: 650; }
-@media (max-width: 820px) {
-  .board-options { align-items: start; }
-  .result-language { margin-left: 0; }
-}
+
 @media (max-width: 540px) {
-  .board-options { gap: 15px; padding-bottom: 18px; }
+  .board-options { width: 100%; margin-top: 14px; }
   .result-language { width: 100%; justify-content: space-between; }
   .language-tabs button { min-height: 40px; padding-inline: 13px; min-width: 70px; }
 }
@@ -194,10 +161,9 @@ input[type=checkbox] { accent-color: var(--teal); width: 17px; height: 17px; mar
 .table-scroll tbody tr.selected th.model-cell { background: #eaf5f0; box-shadow: inset 3px 0 #31947b; }
 .table-scroll tbody tr.ours th.model-cell { background: #f0f8f3; }
 .table-scroll tr.ours .model-button { color: #24754f; }
-.table-footer { padding: 17px 24px; display: flex; align-items: center; justify-content: space-between; gap: 15px; font-size: 12px; color: #728b94; border-top: 1px solid var(--line); }
-.legend-swatch { display: inline-block; height: 8px; width: 30px; background: linear-gradient(90deg,#f7f9fb,#c8d5e5); border-radius: 3px; margin-right: 5px; }
-.rows-summary { white-space: nowrap; color: #567480; font-size: 12px; }
-.ranking-note { font-size: 13px; color: #6e8791; line-height: 1.8; margin: 16px 0 0; max-width: 1180px; }
+.table-footer { padding: 8px 20px; display: flex; align-items: center; justify-content: space-between; gap: 15px; font-size: 13px; color: #728b94; border-top: 1px solid var(--line); }
+.footer-actions { display: flex; gap: 6px; align-items: center; }
+.footer-actions .quiet-button { font-size: 13px; min-height: 38px; padding: 6px 10px; }
 .empty-state { padding: 60px 20px; text-align: center; }
 .empty-state > span { font-size: 40px; color: #a2c0c1; }
 .empty-state h3 { font-size: 22px; margin: 5px; }
@@ -205,55 +171,7 @@ input[type=checkbox] { accent-color: var(--teal); width: 17px; height: 17px; mar
 .primary-button { background: var(--teal); color: white; font-size: 15px; font-weight: 600; padding: 11px 19px; min-height: 46px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; box-shadow: 0 2px 4px #167b7910; }
 .primary-button:hover:not(:disabled) { background: #106b67; color: white; }
 
-/* Context, methodology, and research resources */
-.insights-section { padding-block: 60px; }
-.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; }
-.section-heading h2, .citation-section h2 { font-size: 30px; letter-spacing: -.8px; font-weight: 650; margin: 8px 0 0; line-height: 1.35; }
-.caption-text { font-size: 13px; color: #728991; max-width: 300px; text-align: right; }
-.insight-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: 25px; }
-.insight-card { border: 1px solid #dbe5e6; border-radius: 14px; background: white; padding: 25px 26px; position: relative; overflow: hidden; }
-.insight-card:before { content: ""; position: absolute; left: 0; top: 27px; width: 3px; height: 36px; background: #6395bb; }
-.insight-card.open:before { background: #519c81; }
-.insight-card.agentic:before { background: #9c83bf; }
-.insight-card .eyebrow { font-size: 11px; letter-spacing: 1px; color: #788e97; }
-.insight-main { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-top: 12px; }
-.insight-main button { font-size: 17px; font-weight: 650; padding: 0; text-align: left; max-width: 70%; line-height: 1.5; }
-.insight-main button:hover { color: var(--teal); }
-.insight-score { font-size: 37px; letter-spacing: -1.5px; color: #256b70; font-variant-numeric: tabular-nums; font-weight: 600; }
-.insight-score small { font-size: 14px; letter-spacing: 0; margin-left: 3px; color: #8ba5aa; }
-.insight-card > p { font-size: 13px; color: #788f98; margin: 10px 0 0; }
-.method-section { padding: 56px 0; background: #edf3f2; border-block: 1px solid #e0e9e5; }
-.text-link { font-size: 15px; color: var(--blue); font-weight: 600; white-space: nowrap; }
-.section-intro { font-size: 16px; max-width: 830px; color: #66808b; line-height: 1.8; margin: 16px 0 28px; }
-.dimension-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 16px; }
-.dimension-card { padding: 23px 20px; background: #fff; border: 1px solid #dde6e3; border-radius: 12px; }
-.dimension-icon { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; background: #eaf2f6; color: #538296; border-radius: 10px; font-size: 23px; font-weight: 500; margin-bottom: 17px; }
-.dimension-card:nth-child(2n) .dimension-icon { color: #518e78; background: #e8f4ec; }
-.dimension-card h3 { font-size: 16px; margin: 0 0 9px; font-weight: 650; }
-.dimension-card p { font-size: 14px; color: #71858d; line-height: 1.7; margin: 0; }
-.method-bottom { display: grid; grid-template-columns: .9fr 1.1fr; gap: 75px; margin-top: 48px; }
-.evaluation-card h3 { font-size: 25px; letter-spacing: -.5px; font-weight: 650; margin: 8px 0 24px; }
-.eval-item { display: flex; align-items: start; gap: 18px; margin: 22px 0; }
-.eval-item > span { font: 13px/1.7 ui-monospace,monospace; color: #779c9c; margin-top: 2px; }
-.eval-item h4 { font-size: 16px; margin: 0 0 5px; font-weight: 600; }
-.eval-item p { font-size: 14px; margin: 0; color: #71878d; }
-.evaluation-card > .text-button { margin: 8px 0 0 36px; }
-.faq-list details { border-bottom: 1px solid #d5e2dd; }
-.faq-list details:first-child { border-top: 1px solid #d5e2dd; }
-.faq-list summary { padding: 19px 26px 19px 0; list-style: none; font-size: 15px; font-weight: 600; position: relative; }
-.faq-list summary::-webkit-details-marker { display: none; }
-.faq-list summary:after { content: "+"; position: absolute; right: 3px; color: #608c87; font-size: 23px; font-weight: 400; top: 13px; }
-.faq-list details[open] summary:after { content: "−"; }
-.faq-list p { font-size: 14px; color: #6e858c; margin: 0 0 21px; line-height: 1.85; }
-.faq-links { display: flex; flex-wrap: wrap; gap: 18px; font-size: 14px; color: var(--blue); padding-bottom: 22px; }
-.citation-section { display: flex; align-items: center; justify-content: space-between; padding-block: 52px; gap: 30px; }
-.citation-section h2 { font-size: 29px; }
-.citation-section p { font-size: 15px; color: var(--muted); margin: 8px 0 0; }
-.citation-actions { display: flex; align-items: center; gap: 12px; }
-footer { display: flex; justify-content: space-between; align-items: center; padding: 32px 0 42px; border-top: 1px solid #dce5e5; }
-footer strong { font-size: 25px; letter-spacing: -.8px; }
-footer p { font-size: 12px; color: #78919a; margin: 3px 0; }
-footer > div:last-child { text-align: right; font-size: 12px; color: #708a94; line-height: 2; }
+.caption-text { font-size: 13px; color: #728991; margin: 10px 0 0; }
 
 /* Comparisons and dialogs */
 .compare-tray { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); width: min(1040px, calc(100% - 40px)); padding: 18px 22px; background: #fffffff5; backdrop-filter: blur(14px); border: 1px solid #c4dbd6; box-shadow: 0 12px 60px #163c4929; border-radius: 16px; z-index: 25; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
@@ -291,7 +209,6 @@ dialog::backdrop { background: #15384070; backdrop-filter: blur(5px); }
 .comparison-section td { font-size: 11px; font-weight: 700; letter-spacing: 1px; color: #78948f; padding-top: 24px; background: #fcfefd; }
 .dialog-actions { display: flex; gap: 12px; margin-top: 26px; justify-content: flex-end; flex-wrap: wrap; }
 .citation-code { background: #f3f7f5; border: 1px solid #dfe8e3; border-radius: 10px; padding: 22px; font: 13px/1.85 ui-monospace,SFMono-Regular,monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
-.figure-image { width: 100%; height: auto; border-radius: 10px; border: 1px solid #e1e8e6; }
 .toast { position: fixed; bottom: 132px; left: 50%; transform: translateX(-50%); padding: 12px 22px; background: #234e58; color: #fff; font-size: 14px; border-radius: 10px; box-shadow: 0 5px 25px #17324d20; z-index: 100; text-align: center; max-width: 90%; }
 .noscript { margin: 30px; text-align: center; }
 .noscript a { text-decoration: underline; }
@@ -299,31 +216,13 @@ dialog::backdrop { background: #15384070; backdrop-filter: blur(5px); }
 /* Maintain readable text at smaller widths; only the score table scrolls. */
 @media (max-width: 1350px) {
   .page-width { width: calc(100% - 64px); }
-  .site-header { padding-inline: 32px; }
-  .hero { gap: 36px; }
   .filter-row { gap: 14px; }
   .search-box { width: 240px; }
   .group-filters { gap: 2px; }
   .group-filters button { padding-inline: 9px; }
   .input-filter select { width: 218px; }
-  .dataset-stats { gap: 22px; }
-  .dataset-stats > div { padding-left: 22px; }
-  .dimension-grid { grid-template-columns: repeat(3,1fr); }
-  .dimension-card { padding: 24px; }
-  .method-bottom { gap: 44px; }
-  .citation-actions { flex-direction: column; align-items: end; }
 }
 @media (max-width: 1100px) {
-  .hero { grid-template-columns: 1.4fr 1fr; }
-  .hero h1 { font-size: 48px; }
-  .hero-copy > p { font-size: 16px; }
-  .hero-art { max-width: 330px; }
-  .board-intro { align-items: start; }
-  .dataset-stats { margin-top: 8px; }
-  .dataset-stats strong { font-size: 29px; }
-  .dataset-stats > div { padding-left: 18px; }
-  .dataset-stats span { font-size: 10px; }
-  .board-intro h2 { font-size: 28px; }
   .filter-row .search-box { width: 270px; }
   .group-filters { order: 3; width: 100%; gap: 8px; }
   .input-filter { margin-left: auto; }
@@ -332,42 +231,15 @@ dialog::backdrop { background: #15384070; backdrop-filter: blur(5px); }
   .view-tabs button { padding-inline: 12px; }
   .view-actions { gap: 6px; }
   .view-actions .quiet-button { padding-inline: 12px; font-size: 14px; }
-  .insight-main { flex-wrap: wrap; gap: 6px; }
-  .insight-main button { max-width: 100%; min-height: 50px; }
-  .insight-card { padding: 22px; }
 }
 @media (max-width: 820px) {
   .page-width { width: calc(100% - 40px); }
-  .site-header { height: 76px; padding-inline: 20px; }
-  .site-header nav { gap: 20px; }
-  .site-header nav a:nth-child(2), .wordmark-caption, .wordmark-rule { display: none; }
-  .hero { padding-block: 36px; grid-template-columns: 1fr; }
-  .hero-art { display: none; }
-  .hero-copy > p { max-width: 540px; }
-  .hero h1 { font-size: 50px; }
-  .board-intro { flex-direction: column; gap: 22px; }
-  .dataset-stats { gap: 30px; width: 100%; }
-  .dataset-stats > div { min-width: 120px; }
-  .dataset-stats > div:first-child { border: 0; padding-left: 0; }
-  .dataset-stats strong { font-size: 32px; }
-  .dataset-stats span { font-size: 11px; }
   .benchmark-tabs button { padding-inline: 16px; font-size: 19px; }
-  .small-tag { display: none; }
   .view-row { flex-wrap: wrap; padding: 16px 20px; gap: 14px; }
   .view-actions { margin-left: auto; }
   .sort-hint { width: 100%; }
   .table-context { padding-inline: 22px; }
-  .section-heading { align-items: start; flex-direction: column; gap: 10px; }
-  .section-heading h2 { font-size: 28px; }
   .caption-text { text-align: left; max-width: none; }
-  .insight-grid { grid-template-columns: 1fr; gap: 12px; }
-  .insight-main { flex-wrap: nowrap; margin-top: 5px; }
-  .insight-main button { min-height: 0; }
-  .insight-card > p { margin-top: 0; }
-  .dimension-grid { grid-template-columns: repeat(2,1fr); }
-  .method-bottom { grid-template-columns: 1fr; gap: 36px; }
-  .citation-section { display: block; }
-  .citation-actions { flex-direction: row; align-items: center; margin-top: 22px; flex-wrap: wrap; }
   .comparison-layout { grid-template-columns: 1fr; gap: 24px; }
   .radar { max-height: 320px; }
   .table-footer { flex-wrap: wrap; }
@@ -377,30 +249,13 @@ dialog::backdrop { background: #15384070; backdrop-filter: blur(5px); }
 }
 @media (max-width: 540px) {
   .page-width { width: calc(100% - 32px); }
-  .site-header { height: 72px; padding-inline: 16px; }
-  .wordmark { gap: 7px; }
-  .wordmark strong { font-size: 23px; }
-  .wordmark svg { width: 26px; }
-  .site-header nav { gap: 16px; font-size: 13px; }
-  .site-header nav a:last-child { border: 0; padding: 0; }
-  .hero { padding-block: 32px; }
-  .hero .eyebrow { font-size: 10px; letter-spacing: 1.1px; }
-  .hero h1 { font-size: 46px; letter-spacing: -2px; margin: 16px 0; }
-  .hero-copy > p { font-size: 16px; }
-  .desktop-break { display: none; }
-  .resource-links { gap: 8px; }
-  .resource-links a { font-size: 14px; min-height: 44px; padding-inline: 13px; gap: 14px; }
+  .leaderboard-header { padding-block: 26px 22px; gap: 12px; }
+  .leaderboard-header h1 { font-size: 28px; letter-spacing: -.7px; }
+  .resource-links { gap: 20px; }
+  .resource-links a { font-size: 14px; min-height: 36px; }
   .benchmark-bar { display: block; padding-bottom: 18px; }
   .benchmark-tabs { width: 100%; gap: 4px; padding: 5px; }
   .benchmark-tabs button { flex: 1; padding: 9px 10px; min-height: 48px; font-size: 19px; }
-  .board-intro { padding-top: 24px; gap: 21px; }
-  .board-intro h2 { font-size: 27px; }
-  .board-intro p { font-size: 14px; }
-  .board-intro .eyebrow { font-size: 11px; }
-  .dataset-stats { gap: 0; justify-content: space-between; }
-  .dataset-stats > div { min-width: 0; padding-left: 24px; }
-  .dataset-stats strong { font-size: 30px; }
-  .dataset-stats span { font-size: 10px; }
   .board-card { border-radius: 13px; }
   .view-row { padding: 14px; gap: 14px; }
   .view-tabs { width: 100%; gap: 2px; }
@@ -420,28 +275,8 @@ dialog::backdrop { background: #15384070; backdrop-filter: blur(5px); }
   .table-scroll .model-cell { width: 190px; }
   .table-scroll tbody th.model-cell { padding: 14px 10px; }
   .table-scroll .model-button { font-size: 15px; }
-  .table-footer { padding: 15px; gap: 10px; font-size: 11px; }
+  .table-footer { padding: 8px 14px; gap: 10px; font-size: 12px; }
   .table-footer .divider { margin-inline: 4px; }
-  .rows-summary { font-size: 12px; }
-  .ranking-note { font-size: 12px; }
-  .insights-section { padding-block: 38px; }
-  .section-heading h2 { font-size: 27px; }
-  .insight-card { padding: 20px; }
-  .insight-main button { max-width: 70%; font-size: 16px; }
-  .insight-score { font-size: 34px; }
-  .method-section { padding-block: 38px; }
-  .section-intro { font-size: 15px; }
-  .dimension-grid { gap: 10px; }
-  .dimension-card { padding: 18px 15px; }
-  .dimension-card h3 { font-size: 15px; }
-  .dimension-card p { font-size: 13px; }
-  .evaluation-card h3 { font-size: 23px; }
-  .citation-section { padding-block: 34px; }
-  .citation-section h2 { font-size: 27px; }
-  .citation-actions { display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
-  footer { align-items: start; gap: 25px; padding-block: 26px; }
-  footer strong { font-size: 22px; }
-  footer p, footer > div:last-child { font-size: 11px; }
   .compare-tray { width: calc(100% - 20px); bottom: 10px; padding: 12px; gap: 8px; align-items: start; }
   .compare-tray #compare-chips { gap: 4px; }
   .compare-chip { font-size: 11px; padding: 3px 7px; }