/* LIGA FUNDADORES y LIGA JUGADORES PRO — la misma página para las dos (09/10/2026).
   Se mudó del <style> de liga-fundadores.html cuando Franco pidió la de Jugadores Pro
   «exactamente lo mismo (…) es un espejo»: una hoja, dos páginas. */

/* ══════════════════════════════════════════════════════════════════
   LIGA FUNDADORES (09/10/2026)
   Franco: «ahí va a ser la liga competitiva entre nuestros influencers,
   cada uno va a representar a un equipo del fútbol argentino, otros a un
   equipo del fútbol brasilero y así (…) el mismo sistema de ligas en
   carrusel que el modo carrera y fútbol 11, y abajo las tabs (…) por
   ahora simulá todo eso con los bots».
   · Arriba: el riel de ligas (`COPRiel`, el de Carrera y Fútbol 11).
   · Equipos: la tabla de la liga (cada equipo con su representante).
   · Partidos: el partido REAL de esa fecha arriba y las cartas de los dos
     representantes (`COPDuelo` con `cartas:true`, la de Champions).
   · Recompensas: la escalera de siempre, por puesto final (1 a 10).
   ⚠ SIMULADA: los representantes son bots sorteados por equipo y los
   puntos de cada duelo salen de un sorteo fijo por partido. Lo dice el
   rótulo de arriba. Cuando haya influencers, cambia `armarLiga()` y nada
   más: el dibujo es el mismo.
   ══════════════════════════════════════════════════════════════════ */
body{background:var(--bg,#0b0e14);color:var(--text,#f4f6fb);font-family:Inter,sans-serif}
.lf-main{max-width:var(--cop-ancho,720px);margin:0 auto;padding:0 var(--aire-contenido,16px) calc(var(--bb-h,58.5px) + var(--gap-2xl,1.8rem))}
.lf-hero{--riel-alto:107px;margin:0 calc(-1 * var(--aire-contenido,16px)) var(--gap-md,.7rem)}
.lf-hero .cop-riel{padding:0 var(--aire-contenido,16px)}
.lf-sub{margin:0 0 var(--gap-lg,1rem);text-align:center;font:600 var(--fs-sm,.8rem)/1.4 Inter,sans-serif;color:var(--text-dim,#9aa3b5)}
.lf-sub b{color:#fff}
/* ⚠ 16/10/2026 · Franco: «Liga Fundadores a todo el ancho de la pantalla».
   Las tabs son las del sistema (`cop-tabs--full`): el riel va de borde a
   borde en el teléfono (100vw de cop-ui-tabs.css) y las pestañas guardan
   el aire de la app. Antes acá se le pisaba el ancho (`width:auto`,
   `padding-inline:0`) y la línea quedaba cortada en los 16 px del costado. */
.lf-tabs{margin-top:0}
/* cuatro pestañas en 320-390: cada una toma lo que necesita y el aire se reparte */
.lf-tabs.cop-tabs--full .cop-tab{flex:1 1 auto;min-width:0;padding-inline:var(--gap-xs,.3rem)}
@media (max-width:420px){ .lf-tabs.cop-tabs--full .cop-tab{font-size:var(--fs-sm,.8rem);letter-spacing:0} }
.lf-panel[hidden]{display:none}
.lf-vacio{padding:var(--gap-2xl,1.8rem) 0;text-align:center;font:600 var(--fs-md,.88rem)/1.4 Inter,sans-serif;color:var(--text-dim,#9aa3b5)}

/* ── la tabla: puesto · equipo y su representante · PJ G E P · PTS ── */
.lf-tabla{display:block}
.lf-fila{display:grid;grid-template-columns:1.5rem 34px minmax(0,1fr) repeat(3,1.45rem) 2.2rem;align-items:center;
  gap:var(--gap-sm,.5rem);padding:var(--gap-sm,.5rem) 0;border-bottom:1px solid var(--card-border,#1e2330)}
.lf-fila:last-child{border-bottom:0}
.lf-cab{padding-top:0;font:800 var(--fs-xs,.72rem)/1 Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint,#5a6275)}
.lf-cab span:nth-child(n+4){text-align:center}
.lf-pos{font:400 var(--fs-lg,1.15rem)/1 Anton,Inter,sans-serif;text-align:center;color:var(--text-dim,#9aa3b5)}
.lf-fila[data-zona="top"] .lf-pos{color:rgb(var(--cop-acento-rgb,12,149,235))}
.lf-cam{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.45))}
.lf-quien{display:flex;flex-direction:column;gap:2px;min-width:0}
.lf-eq{font:800 var(--fs-md,.88rem)/1.15 Inter,sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lf-rep{display:flex;align-items:center;gap:var(--gap-xs,.3rem);min-width:0;font:600 var(--fs-xs,.72rem)/1.2 Inter,sans-serif;color:var(--text-dim,#9aa3b5)}
.lf-rep .cop-mini{--mini-w:15px}
.lf-rep b{color:var(--text,#f4f6fb);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lf-n{text-align:center;font:700 var(--fs-sm,.8rem)/1 Inter,sans-serif;font-variant-numeric:tabular-nums;color:var(--text-dim,#9aa3b5)}
.lf-pts{text-align:center;font:400 var(--fs-lg,1.15rem)/1 Anton,Inter,sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.lf-leyenda{margin:var(--gap-md,.7rem) 0 0;display:flex;align-items:center;gap:var(--gap-sm,.5rem);font:600 var(--fs-xs,.72rem)/1.3 Inter,sans-serif;color:var(--text-faint,#5a6275)}
.lf-leyenda i{width:10px;height:10px;border-radius:3px;background:rgb(var(--cop-acento-rgb,12,149,235))}
@media (max-width:359px){ .lf-fila{grid-template-columns:1.3rem 30px minmax(0,1fr) repeat(3,1.3rem) 2rem;gap:var(--gap-xs,.3rem)} .lf-cam{width:32px;height:32px} }

/* ── partidos: la fecha y las tarjetas de Champions ── */
.lf-fecha{margin:var(--gap-xl,1.3rem) 0 var(--gap-sm,.5rem);font:800 var(--fs-sm,.8rem)/1 Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim,#9aa3b5)}
.lf-fecha:first-child{margin-top:0}
/* las tarjetas van a sangre (.cop-partidos): la fecha recupera el aire de la página */
.cop-partidos > .lf-fecha{padding:0 var(--aire-contenido,16px)}

/* ── recompensas: la escalera de siempre, por puesto ── */
.lf-premios .lvl-insignia .cop-div{--cop-div:48px;height:48px}
.lf-premios .lvl-card{min-height:0;padding:var(--gap-sm,.5rem) var(--aire-contenido,16px)}
.lf-premios .lvl-fila{--lvl-gap:.75rem}
.lf-premios .lvl-sub{font-size:var(--fs-xs,.72rem)}
.lf-pago{margin-left:auto;flex:0 0 auto;display:flex;align-items:center}
.lf-boost{display:inline-flex;align-items:center;gap:var(--gap-sm,.5rem)}
.lf-boost img{width:44px;height:auto;filter:drop-shadow(0 2px 6px rgba(245,197,66,.35))}
.lf-boost b{font:400 var(--fs-lg,1.15rem)/1 Anton,Impact,sans-serif;letter-spacing:.02em;color:#f5c542;text-transform:uppercase}
.lf-pago .cop-pr-monto b{font-size:var(--fs-xl,1.3rem)}
.lf-nota{margin:var(--gap-lg,1rem) 0 0;text-align:center;font:600 var(--fs-xs,.72rem)/1.4 Inter,sans-serif;color:var(--text-faint,#5a6275)}

/* ── equipos: grilla de 2 (3 desde 600 px) ──
   ⚠ 16/10/2026 · Franco: «SIN el recuadro blanco/caja. Arriba, centrados,
   el nombre del club con su camiseta; abajo la carta del usuario que lo
   representa SOLA, sin nada alrededor». Jugadores Pro: igual, con la mini
   tarjeta y el alias. Tocar abre el menú del equipo (cop-liga-menu). */
.lf-grilla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-xl,1.2rem) var(--gap-md,.7rem)}
@media (min-width:600px){ .lf-grilla{grid-template-columns:repeat(3,minmax(0,1fr))} }
.lf-tj{min-width:0;display:flex;flex-direction:column;align-items:center;gap:var(--gap-sm,.5rem);
  border-radius:var(--r-card,14px);-webkit-tap-highlight-color:transparent;
  animation:lfTj .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 40ms)}
.lf-tj[data-club]{cursor:pointer}
.lf-tj[data-club]:focus-visible{outline:2px solid rgb(var(--cop-acento-rgb,12,149,235));outline-offset:4px}
.lf-tj-cab{display:flex;flex-direction:column;align-items:center;gap:var(--gap-xs,.3rem);min-width:0;width:100%;text-align:center}
.lf-tj-cam{width:40px;height:40px;object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}
.lf-tj-club{max-width:100%;min-height:2.3em;font:800 var(--fs-sm,.8rem)/1.15 Inter,sans-serif;color:#fff;letter-spacing:.01em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lf-tj-carta{width:100%;max-width:170px;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
@media (hover:hover) and (pointer:fine){ .lf-tj[data-club]:hover .lf-tj-carta{transform:translateY(-3px)} }
.lf-tj[data-club]:active .lf-tj-carta{transform:scale(.97)}
.lf-tj-hueco{aspect-ratio:1052/1328;display:grid;place-items:center;border:1.5px dashed rgba(255,255,255,.18);border-radius:var(--r-card,14px);
  font:600 var(--fs-xs,.72rem)/1.3 Inter,sans-serif;color:var(--text-dim,#9aa3b5);text-align:center;padding:var(--gap-sm,.5rem)}
@keyframes lfTj{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .lf-tj{animation:none} .lf-tj-carta{transition:none} }

/* ── Jugadores Pro: la mini tarjeta con la skin en lugar de la camiseta ── */
.lf-cam--mini{height:auto;display:grid;place-items:center;filter:none}
.lf-cam--mini .cop-mini{--mini-w:30px}
.lf-tj-cam--mini{width:auto;height:auto;filter:none}
.lf-tj-cam--mini .cop-mini{--mini-w:34px}

/* ── 16/10/2026 · LA LIGA REAL: los estados honestos y los premios sin monto ──
   error = el texto + «Reintentar» (el botón de la ley), centrados como el vacío;
   «Próximamente» donde iría el monto cuando `economia` no trae premios: el
   sello apagado del sistema, no un número inventado. */
.lf-error{display:flex;flex-direction:column;align-items:center;gap:var(--gap-md,.7rem)}
.lf-error p{margin:0}
.lf-pronto{margin-left:auto;flex:0 0 auto;display:inline-flex;align-items:center;padding:.28rem var(--gap-md,.7rem);
  border:1px solid rgba(255,255,255,.22);border-radius:999px;color:var(--text-dim,#9aa3b5);opacity:.75;
  font:800 var(--fs-xs,.72rem)/1 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase}
