Ejes: arreglar display de los selects; sección 6: pool de ligas

- Los <select> de componentes de eje mostraban siempre la primera opción (bug de
timing de x-model/:value con opciones dinámicas anidadas): ahora usan :selected por
opción, así reflejan el eje real (X=Elaboración, no "Verticalidad").
- Sección 6 (Variables): agregado "Pool: sumar liga" (además de sumar equipo), como en
Recursos; vsDraw maneja pool de ligas + equipos.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/racing_reports/web/templates/home.html

@@ -592,8 +592,8 @@
             <label class="block text-xs text-gray-400 mb-1">Eje X (ejes × peso)</label>
             <template x-for="(c,i) in ejXc" :key="'xc'+i">
               <div class="flex gap-1 mb-1">
-                <select x-model="c.eje" @change="ejDraw()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm flex-1">
-                  <template x-for="(lbl,k) in ejLabels" :key="'x'+i+k"><option :value="k" x-text="lbl"></option></template>
+                <select @change="c.eje=$event.target.value; ejDraw()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm flex-1">
+                  <template x-for="(lbl,k) in ejLabels" :key="'x'+i+k"><option :value="k" :selected="k===c.eje" x-text="lbl"></option></template>
                 </select>
                 <input type="number" min="0" max="9" step="1" x-model.number="c.w" @change="ejDraw()" title="peso" class="w-12 bg-ink-800 border border-ink-600 rounded-lg px-1.5 py-1.5 text-sm text-center">
                 <button @click="ejXc.splice(i,1); ejDraw()" x-show="ejXc.length>1" class="text-red-300 px-1.5">×</button>
@@ -605,8 +605,8 @@
             <label class="block text-xs text-gray-400 mb-1">Eje Y (ejes × peso)</label>
             <template x-for="(c,i) in ejYc" :key="'yc'+i">
               <div class="flex gap-1 mb-1">
-                <select x-model="c.eje" @change="ejDraw()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm flex-1">
-                  <template x-for="(lbl,k) in ejLabels" :key="'y'+i+k"><option :value="k" x-text="lbl"></option></template>
+                <select @change="c.eje=$event.target.value; ejDraw()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm flex-1">
+                  <template x-for="(lbl,k) in ejLabels" :key="'y'+i+k"><option :value="k" :selected="k===c.eje" x-text="lbl"></option></template>
                 </select>
                 <input type="number" min="0" max="9" step="1" x-model.number="c.w" @change="ejDraw()" title="peso" class="w-12 bg-ink-800 border border-ink-600 rounded-lg px-1.5 py-1.5 text-sm text-center">
                 <button @click="ejYc.splice(i,1); ejDraw()" x-show="ejYc.length>1" class="text-red-300 px-1.5">×</button>
@@ -867,6 +867,12 @@
             </select>
           </div>
           <button @click="vsPinned={}; vsDraw()" class="text-xs text-gray-300 border border-ink-600 rounded-lg px-3 py-2 hover:bg-ink-600">Limpiar marcas</button>
+          <div>
+            <label class="block text-xs text-gray-400 mb-1">Pool: sumar liga</label>
+            <input list="vsligalist" x-model="vsPoolLigaIn" @change="vsAddPoolLiga()" placeholder="Liga…"
+                   class="bg-ink-800 border border-ink-600 rounded-lg px-3 py-2 text-sm w-48">
+            <datalist id="vsligalist"><template x-for="l in vsLeagueList" :key="'vspl'+l"><option :value="l"></option></template></datalist>
+          </div>
           <div>
             <label class="block text-xs text-gray-400 mb-1">Sumar y marcar equipo</label>
             <input list="vsteamall" x-model="vsPoolTeamIn" @change="vsAddPoolTeam()" placeholder="Equipo (de cualquier liga)…"
@@ -895,16 +901,16 @@
                 <template x-if="ax==='B'"><label class="cursor-pointer inline-flex items-center gap-1.5"><input type="checkbox" x-model="vsB.on" @change="vsReload()"> Burbuja (tamaño)</label></template>
               </div>
               <div class="flex flex-col gap-2" :class="ax==='B'&&!vsB.on ? 'pointer-events-none':''">
-                <select :value="vsAxis(ax).var" @change="vsAxis(ax).var=$event.target.value; vsReload()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm">
+                <select @change="vsAxis(ax).var=$event.target.value; vsReload()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm">
                   <template x-for="tp in vsTypeList" :key="'vsg'+ax+tp">
                     <optgroup :label="tp">
-                      <template x-for="c in (vsTypeCols[tp]||[])" :key="'vso'+ax+c"><option :value="c" x-text="vsColLabel[c]||c"></option></template>
+                      <template x-for="c in (vsTypeCols[tp]||[])" :key="'vso'+ax+c"><option :value="c" :selected="c===vsAxis(ax).var" x-text="vsColLabel[c]||c"></option></template>
                     </optgroup>
                   </template>
                 </select>
-                <select :value="vsAxis(ax).dir" @change="vsAxis(ax).dir=+$event.target.value; vsDraw()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm">
-                  <option :value="1">Más es mejor (↑ arriba/derecha)</option>
-                  <option :value="-1">Menos es mejor (↑ arriba/derecha)</option>
+                <select @change="vsAxis(ax).dir=+$event.target.value; vsDraw()" class="bg-ink-800 border border-ink-600 rounded-lg px-2 py-1.5 text-sm">
+                  <option :value="1" :selected="vsAxis(ax).dir===1">Más es mejor (↑ arriba/derecha)</option>
+                  <option :value="-1" :selected="vsAxis(ax).dir===-1">Menos es mejor (↑ arriba/derecha)</option>
                 </select>
               </div>
             </div>
@@ -1181,7 +1187,7 @@
       vsLoaded:false, vsLeagueList:[], vsSeasons:{}, vsLeague:'__all__', vsSeason:'__all__',
       vsColLabel:{}, vsTypeCols:{}, vsTypeList:[], vsNeg:{},
       vsX:{var:'', dir:1}, vsY:{var:'', dir:1}, vsB:{on:false, var:'', dir:1},
-      vsEscala:'liga', vsRows:[], vsError:'', vsPinned:{}, vsPool:[], vsPoolTeamIn:'', vsAllKeys:[],
+      vsEscala:'liga', vsRows:[], vsError:'', vsPinned:{}, vsPool:[], vsPoolTeamIn:'', vsPoolLigaIn:'', vsAllKeys:[],
       // Recursos
       lbLeagues: [], lbRecursos: {}, lbMetricas: {}, lbLeague: '__all__', lbRows: [], lbError: '', lbLoaded: false,
       lbBloques: {}, lbBloqSel: ['bajo','medio','alto'], lbSeason: '__all__',
@@ -1974,10 +1980,16 @@
           await this.$nextTick(); this.vsDraw();
         } catch(e){ this.vsError='Error: '+e; }
       },
+      vsAddPoolLiga(){
+        const l=(this.vsPoolLigaIn||'').trim();
+        if (l && this.vsLeagueList.includes(l) && !this.vsPool.some(p=>p.tipo==='liga'&&p.liga===l))
+          this.vsPool.push({tipo:'liga', liga:l, label:'Liga: '+l});
+        this.vsPoolLigaIn=''; this.vsDraw();
+      },
       vsAddPoolTeam(){
         const k=(this.vsPoolTeamIn||'').trim(); const m=k.match(/^(.*) \((.*)\)$/);
-        if (m && this.vsAllKeys.includes(k) && !this.vsPool.some(p=>p.equipo===m[1]&&p.liga===m[2]))
-          this.vsPool.push({equipo:m[1], liga:m[2], label:k});
+        if (m && this.vsAllKeys.includes(k) && !this.vsPool.some(p=>p.tipo==='equipo'&&p.equipo===m[1]&&p.liga===m[2]))
+          this.vsPool.push({tipo:'equipo', equipo:m[1], liga:m[2], label:k});
         this.vsPoolTeamIn=''; this.vsDraw();
       },
       vsDraw(){
@@ -1985,12 +1997,15 @@
         if (!svg || !this.vsRows.length) return;
         svg.innerHTML='';
         const esc=this.vsEscala, xa=this.vsX, ya=this.vsY, ba=this.vsB;
-        const poolKeys=new Set(this.vsPool.map(p=>p.liga+'|'+p.equipo));
+        const poolLigas=new Set(this.vsPool.filter(p=>p.tipo==='liga').map(p=>p.liga));
+        const poolKeys=new Set(this.vsPool.filter(p=>p.tipo==='equipo').map(p=>p.liga+'|'+p.equipo));
+        const inPool=r=>poolLigas.has(r.liga) || poolKeys.has(r.liga+'|'+r.equipo);
         let rows;
-        if (this.vsLeague!=='__all__') rows=this.vsRows.filter(r=>r.liga===this.vsLeague || poolKeys.has(r.liga+'|'+r.equipo));
+        if (this.vsPool.length) rows=this.vsRows.filter(r=>inPool(r) || (this.vsLeague!=='__all__' && r.liga===this.vsLeague));
+        else if (this.vsLeague!=='__all__') rows=this.vsRows.filter(r=>r.liga===this.vsLeague);
         else rows=this.vsRows;
         if (this.vsLeague!=='__all__' && this.vsSeason!=='__all__')
-          rows=rows.filter(r=>String(r.temporada)===String(this.vsSeason) || poolKeys.has(r.liga+'|'+r.equipo));
+          rows=rows.filter(r=>String(r.temporada)===String(this.vsSeason) || inPool(r));
         const std=(vals)=>{const v=vals.filter(x=>x!=null&&!isNaN(x)); if(v.length<2) return {m:0,s:1};
           const m=v.reduce((a,b)=>a+b,0)/v.length; const s=Math.sqrt(v.reduce((a,b)=>a+(b-m)*(b-m),0)/v.length)||1; return {m,s};};
         const ligaStats=(v)=>{const map={}; for(const r of this.vsRows){const x=r[v]; if(x==null||isNaN(x))continue;(map[r.liga]=map[r.liga]||[]).push(+x);} const o={}; for(const lg in map)o[lg]=std(map[lg]); return o;};