support different setups so that we can reduce the number of charts a bit

app/src/content/embeds/d3-benchmark-comparison.html

@@ -3,7 +3,8 @@
 
   Configuration via data-config attribute:
   {
-    "datasetNames":   { "raw_name": "Display Name", ... },                // required
+    "datasetNames":   { "raw_name": "Display Name", ... },                // required (unless using setups)
+    "setups":         { "Setup Label": { "datasetNames": {...} }, ... },   // optional, multi-setup mode with dropdown + average
     "pinnedColors":   { "DCLM": "#333", "FineWeb-Edu (HQ)": "#86a1a9" },  // optional
     "baselines":      ["dclm", "fw_edu_hq"],                              // optional, raw keys for baseline datasets (dashed lines, striped bars). Default: ["dclm", "fw_edu_hq"]
     "defaultMetric":  "agg_score_macro",                                  // optional, default: "agg_score_macro"
@@ -184,7 +185,15 @@
       } catch (_) {}
 
       // Configurable settings with defaults
-      const DATASET_NAMES = cfg.datasetNames || {};
+      // ─── SETUP SUPPORT ───
+      const SETUPS = cfg.setups || null;
+      const setupNames = SETUPS ? Object.keys(SETUPS) : [];
+      let currentSetup = SETUPS ? setupNames[0] : null;
+      let DATASET_NAMES = SETUPS ? { ...SETUPS[setupNames[0]].datasetNames } : (cfg.datasetNames || {});
+      const AVG_SETUP_KEY = 'Average (all setups)';
+      let avgDatasetNames = {};
+      let parsedData = [];
+
       const RUN_COL       = cfg.runColumn    || 'runname';
       const STEP_COL      = cfg.stepColumn   || 'steps';
       const TOKENS_PER_STEP = cfg.tokensPerStep || 2.1e6;
@@ -286,6 +295,78 @@
         unpinned.forEach((raw, i) => { colorMap[raw] = palette[i % palette.length]; });
       }
 
+      // ─── SETUP HELPERS ───
+      function filterData() {
+        const knownNames = Object.keys(DATASET_NAMES);
+        allData = knownNames.length ? parsedData.filter(r => knownNames.includes(r[RUN_COL])) : parsedData;
+        allData.columns = parsedData.columns;
+      }
+
+      function computeAverageData(rawData) {
+        if (!SETUPS || setupNames.length < 2) return { data: [], datasetNames: {} };
+        // Build mapping: displayName -> [rawName1, rawName2, ...]
+        const displayToRaws = {};
+        for (const sName of setupNames) {
+          const dn = SETUPS[sName].datasetNames;
+          for (const [raw, display] of Object.entries(dn)) {
+            if (!displayToRaws[display]) displayToRaws[display] = [];
+            displayToRaws[display].push(raw);
+          }
+        }
+        // Only average display names that appear in ALL setups
+        const fullDisplay = Object.entries(displayToRaws)
+          .filter(([, raws]) => raws.length >= setupNames.length);
+        // Index raw data by runname+step for fast lookup
+        const byRunStep = {};
+        for (const row of rawData) byRunStep[row[RUN_COL] + '|' + row[STEP_COL]] = row;
+        const steps = Array.from(new Set(rawData.map(r => +r[STEP_COL]))).sort((a, b) => a - b);
+        const cols = rawData.columns || Object.keys(rawData[0] || {});
+        const result = [];
+        const dnMap = {};
+        for (const [display, raws] of fullDisplay) {
+          const avgRaw = '__avg__' + display.replace(/[^a-zA-Z0-9]/g, '_');
+          dnMap[avgRaw] = display;
+          for (const step of steps) {
+            const rows = raws.map(r => byRunStep[r + '|' + step]).filter(Boolean);
+            if (!rows.length) continue;
+            const avgRow = { [RUN_COL]: avgRaw, [STEP_COL]: String(step) };
+            for (const col of cols) {
+              if (col === RUN_COL || col === STEP_COL) continue;
+              const vals = rows.map(r => +r[col]).filter(v => !isNaN(v));
+              avgRow[col] = vals.length ? vals.reduce((a, b) => a + b, 0) / vals.length : 0;
+            }
+            result.push(avgRow);
+          }
+        }
+        return { data: result, datasetNames: dnMap };
+      }
+
+      function switchSetup(name) {
+        currentSetup = name;
+        if (name === AVG_SETUP_KEY) {
+          DATASET_NAMES = { ...avgDatasetNames };
+        } else {
+          DATASET_NAMES = { ...SETUPS[name].datasetNames };
+        }
+        // Re-add baselines that may be shared across setups
+        const baselineNames = cfg.baselines || ['dclm', 'fw_edu_hq'];
+        for (const bRaw of baselineNames) {
+          if (parsedData.some(r => r[RUN_COL] === bRaw) && !DATASET_NAMES[bRaw]) {
+            // Find display name from any setup or use raw
+            let bDisplay = bRaw;
+            for (const sName of setupNames) {
+              if (SETUPS[sName].datasetNames[bRaw]) { bDisplay = SETUPS[sName].datasetNames[bRaw]; break; }
+            }
+            DATASET_NAMES[bRaw] = bDisplay;
+          }
+        }
+        colorMap = {};
+        filterData();
+        initColors();
+        render();
+        buildLegend();
+      }
+
       function showTip(html, x, y) {
         tipInner.innerHTML = html;
         const tipW = tip.offsetWidth || 180;
@@ -545,6 +626,26 @@
       function buildUI() {
         const controls = document.createElement('div'); controls.className = 'controls';
 
+        // Setup selector (only shown when setups config is present)
+        if (SETUPS && setupNames.length > 0) {
+          const setupGroup = document.createElement('div'); setupGroup.className = 'control-group';
+          const setupLabel = document.createElement('label'); setupLabel.setAttribute('for', 'setup-' + uid); setupLabel.textContent = 'Setup';
+          const setupSelect = document.createElement('select'); setupSelect.id = 'setup-' + uid;
+          setupNames.forEach(name => {
+            const opt = document.createElement('option'); opt.value = name; opt.textContent = name;
+            if (name === currentSetup) opt.selected = true;
+            setupSelect.appendChild(opt);
+          });
+          // Add Average option
+          if (setupNames.length >= 2) {
+            const avgOpt = document.createElement('option'); avgOpt.value = AVG_SETUP_KEY; avgOpt.textContent = AVG_SETUP_KEY;
+            setupSelect.appendChild(avgOpt);
+          }
+          setupSelect.addEventListener('change', () => { switchSetup(setupSelect.value); });
+          setupGroup.appendChild(setupLabel); setupGroup.appendChild(setupSelect);
+          controls.appendChild(setupGroup);
+        }
+
         // View toggle
         const viewGroup = document.createElement('div'); viewGroup.className = 'control-group';
         const viewLabel = document.createElement('label'); viewLabel.setAttribute('for', 'view-' + uid); viewLabel.textContent = 'View';
@@ -644,10 +745,16 @@
         try {
           const text = await fetchFirstAvailable(csvPaths);
           const parsed = d3.csvParse(text);
+          parsedData = parsed;
+          // Compute average data for setup mode
+          if (SETUPS && setupNames.length >= 2) {
+            const avg = computeAverageData(parsed);
+            avgDatasetNames = avg.datasetNames;
+            parsedData = parsed.concat(avg.data);
+            parsedData.columns = parsed.columns;
+          }
           // Filter to only datasets with configured display names
-          const knownNames = Object.keys(DATASET_NAMES);
-          allData = knownNames.length ? parsed.filter(r => knownNames.includes(r[RUN_COL])) : parsed;
-          allData.columns = parsed.columns;
+          filterData();
           metricKeys = detectMetrics(allData.columns);
           // Ensure defaultMetric is valid; fall back to first available
           if (!metricKeys.includes(currentMetric)) currentMetric = metricKeys[0];