:root{
    --azul:#0a2b5c;
    --azul-dark:#071d3f;
    --oro:#f2b705;
    --bg:#f7f7f5;
    --card:#ffffff;
    --text:#1c1c1c;
    --muted:#6b6b6b;
    --border:#e3e3e0;
    --green:#1b7a3d;
    --red:#b5372b;
  }
  *{box-sizing:border-box;}
  body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);}
  header{background:var(--azul);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 2px 6px rgba(0,0,0,.15);}
  .header-inner{max-width:1280px;margin:0 auto;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;padding:10px 14px;gap:8px;}
  .logo{display:flex;align-items:center;gap:7px;font-weight:700;font-size:15px;white-space:nowrap;flex-shrink:0;}
  .logo .dot{width:10px;height:10px;background:var(--oro);border-radius:50%;flex-shrink:0;}
  nav{display:flex;flex-wrap:nowrap;gap:0;min-width:0;}
  nav button{background:none;border:none;color:#dbe3f0;font-size:12px;padding:7px 7px;cursor:pointer;border-radius:6px;transition:.15s;font-weight:500;white-space:nowrap;}
  nav button:hover{background:rgba(255,255,255,.08);color:#fff;}
  nav button.active{background:var(--oro);color:var(--azul-dark);font-weight:700;}
  .header-right{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  /* Toggle de moneda universal (header, al lado del selector de club): mismo `.segmented` de
     siempre pero con los colores del header (fondo transparente + texto blanco, en vez del
     fondo blanco + azul de `.segmented` normal, pensado para cards sobre fondo claro) — mismo
     criterio visual que ya usa `nav button.active` (dorado) para su propio estado activo. */
  .header-currency-toggle{border:1px solid rgba(255,255,255,.3);border-radius:6px;}
  .header-currency-toggle button{background:transparent;color:#fff;padding:5px 10px;font-size:12px;font-weight:500;}
  .header-currency-toggle button.active{background:var(--oro);color:var(--azul-dark);font-weight:700;}
  /* ======================================================================
     SELECTOR JERÁRQUICO DE CLUB (Versión 137). Reemplaza al <select id="clubSelect">
     plano, que con 41 clubes ya era incómodo y al objetivo de 1000 es inusable.
     Deporte › Región › País › Liga › Equipo, con búsqueda por texto encima.

     TRES DECISIONES DE UX QUE SON PEDIDOS EXPLÍCITOS DE GUIDO, no pulido:
     (1) El botón del header tiene que LEERSE COMO UN CONTROL: borde dorado,
         eyebrow "ESTÁS VIENDO" y la palabra "Cambiar" visible. La versión
         anterior del prototipo era un pill azul sobre header azul con una
         flechita, y se leía como un título ("si yo llego al site en frío, no me
         termina de quedar claro cómo elegir y/o cambiar de equipo").
     (2) SALIR DEL PANEL TIENE QUE SER UN BOTÓN VISIBLE, en los dos modos: "Esc o
         clickear afuera es LA ÚNICA manera en la que el usuario puede salir de
         ese selector. Es mala UX". En móvil es peor todavía: no hay tecla Esc y
         el panel ocupa casi toda la pantalla. Hay DOS salidas visibles (arriba a
         la derecha "✕ Cerrar", abajo a la derecha "Cerrar sin cambiar"); Esc y el
         backdrop quedan como atajos para quien los conoce, nunca como el camino.
     (3) El punto de color de calidad del dato va en la fila, ANTES de entrar al
         club: que nadie descubra recién adentro que eligió un placeholder. Sale
         de `data/club-index.js` (campo `q`), que lo deriva de `sources{}` — no es
         un campo tipeado a mano que se pueda desincronizar del dato real.
     ====================================================================== */
  .cb-wrap{position:relative;flex-shrink:0;}
  .club-btn{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1.5px solid var(--oro);
            color:#fff;border-radius:9px;padding:4px 8px 4px 5px;cursor:pointer;font:inherit;text-align:left;min-width:196px;}
  .club-btn:hover{background:rgba(242,183,5,.2);}
  .club-btn .cb-txt{display:flex;flex-direction:column;line-height:1.2;min-width:0;flex:1;}
  .club-btn .cb-eyebrow{font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#a8b8d4;font-weight:700;}
  .club-btn .cb-name{font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .club-btn .cb-change{font-size:10.5px;font-weight:800;color:var(--oro);white-space:nowrap;background:rgba(242,183,5,.15);
                       border-radius:5px;padding:4px 6px;}
  /* El escudo es un círculo con las iniciales. El azul de acá es el FALLBACK: desde la
     Versión 178 cada club pinta el suyo con su `brandColor` (data/clubs.js), por JS y en
     línea, así que este `background` queda para los clubes que no tienen color verificado
     (hoy Real Madrid y Once Caldas, los dos de camiseta blanca). El color de las iniciales
     tampoco es este `#fff` para todos: lo decide por contraste `textoSobre()` en
     js/selector.js. Los escudos como IMAGEN siguen sin hacerse (derechos y hosting).
     En la comparación, en cambio, cada sujeto lleva un color asignado POR POSICIÓN
     (1º, 2º...), que es dato de la vista y no del club — eso no cambió. */
  .crest{width:26px;height:26px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;
         font-size:9.5px;font-weight:800;color:#fff;letter-spacing:-.02em;background:var(--azul);
         border:1.5px solid rgba(255,255,255,.45);}
  .crest.sm{width:20px;height:20px;font-size:8px;border-width:1px;}
  .crest.on-light{border-color:rgba(0,0,0,.12);}

  .sel-backdrop{position:fixed;inset:0;background:rgba(7,29,63,.45);z-index:80;display:none;}
  .sel-backdrop.open{display:block;}

  @media (max-width:900px){
    /* EL NAV PASA A SU PROPIA FILA (Versión 137). El botón de club mide ~210px contra
       los ~104px del <select> que reemplazó, así que en una sola fila el `nav` quedaba
       aplastado a 0px de ancho y las 4 pestañas desaparecían sin aviso (medido en el
       navegador: nav.getBoundingClientRect().width === 0 a 614px de ancho). Es la to-do 9
       del comentario de arriba, que este cambio hacía urgente. Se resuelve dejando que
       el header envuelva y mandando el nav a una segunda fila completa, en vez de
       esconderlo: son las 4 secciones del sitio y no hay otra forma de llegar a ellas. */
    .header-inner{flex-wrap:wrap;}
    #mainNav{order:3;width:100%;justify-content:center;border-top:1px solid rgba(255,255,255,.12);padding-top:6px;}
    #mainNav button{font-size:12.5px;padding:7px 10px;}
    .logo{min-width:0;overflow:hidden;}
  }

  /* EL HEADER EN EL TELÉFONO: UNA SOLA FILA (56px). Hasta acá eran tres o cuatro filas (logo; moneda, contacto e idioma; "Estás
     viendo"; las pestañas) y el header fijo ocupaba ~165-200px de 812. Queda: logo, lupa (abre el selector) y un botón con la
     sección actual que abre el menú. El menú es el mismo #mainNav más idioma y contacto (.m-extra), mostrado como panel debajo del
     header. La moneda vive en el panel de Finanzas (en todos los anchos); el botón de club no se muestra (la lupa
     abre el mismo selector). En escritorio nada de esto existe: .m-acciones, .m-extra y .m-velo están escondidos y .nav-wrap
     no arma caja (display:contents), así que el nav sigue en la fila del header como siempre. */
  .m-extra,.m-velo,.m-menu-btn{display:none;}
  /* "Estás viendo" sale del header en todos los anchos: el club se nombra en Finanzas, como título. El botón sigue en el DOM porque
     js/selector.js le escribe el estado (aria-expanded, title). En su lugar, "Buscar un club o una liga". */
  .cb-wrap{display:none;}
  .m-acciones{display:flex;align-items:center;order:2;flex-shrink:0;}
  .header-right{order:2;}
  .m-btn{display:flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:8px;border:1px solid rgba(255,255,255,.35);
    background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;}
  .m-btn:hover{background:rgba(255,255,255,.16);}
  .m-btn svg{width:16px;height:16px;}
  .m-btn-k{font:inherit;font-size:11.5px;opacity:.7;}
  .nav-wrap{display:contents;}
  @media (max-width:700px){
    .header-inner{flex-wrap:nowrap;height:56px;padding:0 4px 0 16px;box-sizing:border-box;position:relative;}
    .logo{font-size:16px;font-weight:800;min-width:0;overflow:hidden;flex-shrink:1;}
    .logo > span:last-child{overflow:hidden;text-overflow:ellipsis;}
    .header-right{display:none;}
    .m-acciones{display:flex;align-items:center;flex-shrink:0;}
    .m-btn{width:44px;height:44px;padding:0;justify-content:center;border:0;background:none;}
    .m-btn svg{width:22px;height:22px;}
    .m-btn-l,.m-btn-k{display:none;}
    .m-menu-btn{display:flex;height:44px;display:flex;align-items:center;gap:6px;padding:0 10px;border:0;border-radius:8px;
      background:rgba(255,255,255,.1);color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;}
    .m-menu-btn .m-ico-cerrar{display:none;}
    header.menu-abierto .m-menu-btn{background:var(--oro);color:var(--azul-dark);}
    header.menu-abierto .m-menu-btn .m-ico-abrir{display:none;}
    header.menu-abierto .m-menu-btn .m-ico-cerrar{display:block;}
    .nav-wrap{display:none;position:absolute;top:56px;left:0;right:0;background:#fff;color:var(--text);
      border-radius:0 0 16px 16px;padding:8px 0 12px;box-shadow:0 12px 30px rgba(7,29,63,.25);z-index:2;}
    header.menu-abierto .nav-wrap{display:block;}
    #mainNav{order:0;width:auto;display:flex;flex-direction:column;border-top:0;padding-top:0;justify-content:flex-start;}
    #mainNav button{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:0 20px;border-radius:0;
      font-size:17px;color:var(--text);text-align:left;}
    #mainNav button:hover{background:#f4f5f7;color:var(--text);}
    #mainNav button.active{background:#fdf5dc;color:var(--azul);font-weight:800;}
    #mainNav button.active::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--oro);}
    #mainNav button[hidden]{display:none;}
    .m-extra{display:block;border-top:1px solid var(--border);margin:8px 20px 0;padding-top:8px;}
    .m-idioma{display:flex;align-items:center;justify-content:space-between;min-height:52px;font-size:15px;color:var(--muted);}
    .m-idioma-op{display:flex;gap:4px;background:#eef1f6;border-radius:8px;padding:3px;}
    .m-idioma-op button{height:36px;padding:0 14px;border:0;border-radius:6px;background:none;color:var(--azul);
      font:inherit;font-size:14px;font-weight:700;cursor:pointer;}
    .m-idioma-op button.active{background:var(--azul);color:#fff;}
    .m-contacto{display:flex;align-items:center;width:100%;min-height:44px;padding:0;border:0;background:none;font:inherit;
      font-size:15px;color:var(--muted);cursor:pointer;}
    .m-velo.abierto{display:block;position:fixed;inset:56px 0 0 0;background:rgba(7,29,63,.45);z-index:1;}
  }
  @media (max-width:380px){ .logo{font-size:15px;gap:6px;} .m-menu-btn{padding:0 8px;} .m-btn{width:40px;} }

  /* to-do 23, paso 4: el gráfico de Comparar, A y B en el mismo eje (Chart.js). Reemplaza a la
     composición al 100% (.mix-*), que se fue con este paso. */
  .cd-graf{margin:4px 0 22px;}
  .cd-graf-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;}
  .cd-graf-head h3{margin:0 0 2px;font-size:17px;}
  .cd-graf-sum{display:flex;gap:20px;flex-wrap:wrap;align-items:baseline;margin:6px 0 10px;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;}
  .cd-graf-sum b{color:var(--text);font-size:16px;}
  .cd-graf-sum b.presu{color:#8a6d00;font-style:italic;}
  .cd-graf-cv{position:relative;height:280px;}
  .cd-graf-head .segmented{max-width:100%;overflow-x:auto;}
  .cd-graf-head .segmented button{padding:6px 12px;font-size:12.5px;white-space:nowrap;}
  .cd-letra.b{background:#d9822b;}

  @media (max-width:900px){
    .mix-row{grid-template-columns:104px 1fr 72px;}
  }

  .disclaimer{background:var(--azul-dark);color:#c9d4e6;font-size:12.5px;text-align:center;padding:6px 12px;}
  main{max-width:1160px;margin:0 auto;padding:28px 20px 80px;}
  section{display:none;}
  section.active{display:block;animation:fade .2s ease;}
  @keyframes fade{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}
  h1{font-size:26px;margin:0 0 6px;}
  h2{font-size:20px;margin:0 0 16px;}
  .subtitle{color:var(--muted);font-size:14.5px;margin-bottom:22px;}
  .card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;margin-bottom:32px;}
  .controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:32px;}
  .controls label{font-size:13px;color:var(--muted);margin-right:4px;}
  select{padding:8px 10px;border-radius:6px;border:1px solid var(--border);background:#fff;font-size:14px;}
  /* Ancho fijo (Versión 43, pedido de Guido): sin esto, el <select> de "Año" se achica o agranda
     según el club/ejercicio elegido, porque un <select> nativo mide su ancho por el texto de la
     OPCIÓN seleccionada, no por la más larga de la lista. 300px alcanza para la etiqueta más larga
     de los 3 clubes ("Ejercicio 2025/2026 (esperando datos)", Boca), medida en el navegador
     (~282.5px incluida la flecha nativa) más margen. REGLA: si se agrega un año/label más largo a
     futuro, medir de nuevo contra este ancho antes de asumir que sigue alcanzando. */
  #anioSelect{width:300px;max-width:100%;}
  /* Mismo criterio que #anioSelect de arriba (Versión 44, mismo pedido de Guido extendido a
     "Gestión"): sin ancho fijo, el <select> se achica o agranda según el club (el ancho natural de
     un <select> sigue a la opción MÁS LARGA de su lista actual, no a la seleccionada). 200px
     alcanza para la más larga de los 3 clubes ("Riquelme (2023-actual)", Boca, ~188px medido en el
     navegador) más margen. Misma regla: si se agrega una gestión con nombre más largo, medir de
     nuevo antes de asumir que 200px sigue alcanzando. */
  #gestionSelect{width:200px;max-width:100%;}
  .segmented{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;}
  .segmented button{border:none;background:#fff;padding:8px 16px;font-size:13.5px;cursor:pointer;color:var(--text);}
  .segmented button.active{background:var(--azul);color:#fff;}
  #contactBtn{background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:6px;padding:7px 11px;cursor:pointer;font-size:15px;line-height:1;}
  #contactBtn:hover{background:rgba(255,255,255,.1);}
  /* Selector de idioma (Versión 115). Un botón de globo + menú desplegable, NO una
     tira de botones por idioma: el nav ya se recorta abajo de ~850px (to-do 9), así
     que el costo de ancho del selector tiene que ser constante, no crecer con cada
     idioma nuevo que se agregue a `data/lang/langs.js`. */
  .lang-wrap{position:relative;flex-shrink:0;}
  #langBtn{background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:6px;padding:6px 9px;cursor:pointer;font-size:12px;line-height:1;display:flex;align-items:center;gap:5px;font-weight:600;}
  #langBtn:hover{background:rgba(255,255,255,.1);}
  #langBtn .lang-globe{font-size:14px;line-height:1;}
  #langMenu{position:absolute;top:calc(100% + 6px);right:0;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.18);padding:4px;min-width:150px;z-index:60;}
  #langMenu button{display:block;width:100%;text-align:left;background:none;border:none;padding:8px 10px;font-size:13.5px;color:var(--text);cursor:pointer;border-radius:6px;white-space:nowrap;}
  #langMenu button:hover{background:#f2f2ef;}
  #langMenu button.active{background:var(--azul);color:#fff;font-weight:700;}
  .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:32px;}
  .stat{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px;}
  .stat .label{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
  .stat .value{font-size:22px;font-weight:700;margin-top:4px;}
  /* "Sin dato" no es un número: no va en el mismo cuerpo ni en el mismo peso que una
     cifra, para que no se lea como una (Versión 152, to-do 31). */
  .stat .value.nodato{font-size:17px;font-weight:400;color:var(--muted);font-style:italic;}
  /* to-do 20(h): fila de Formato simplificado cuyo cero es un "no sabemos" porque la fuente
     agrupa esa plata en un bolsón sin desglosar. El "—" ya lo escribe buildNativeSectionHtml();
     esto solo lo atenúa para que no compita visualmente con las filas que sí tienen dato. */
  .mini-table tr.pl-nodato td, table tr.pl-nodato td{color:var(--muted);}
  .stat .value.pos{color:var(--green);}
  .stat .value.neg{color:var(--red);}
  /* Qué ejercicio es cada stat de Inicio (Versión 140). Antes iba en un `title` (tooltip),
     así que en un teléfono no existía: "Último resultado" no decía de qué año era. */
  .stat .stat-sub{font-size:11.5px;color:var(--muted);margin-top:3px;}
  table{width:100%;border-collapse:collapse;font-size:13.5px;}
  th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--border);}
  th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em;}
  tr:last-child td{border-bottom:none;}
  .neg-num{color:var(--red);}
  .pl-bold td{font-weight:700;}
  .pl-shade td{background:#f2f2ef;}
  .pl-highlight td{background:#eef3fa;}
  .pl-clickable{cursor:pointer;}
  .pl-clickable:hover td{background:#f5f8fc;}
  .pl-arrow{display:inline-block;width:14px;color:var(--muted);font-size:10px;}
  .pl-spacer td{padding:0;height:18px;border:none;background:transparent;}
  .pl-breakdown-row td{background:#fafbfc;border-bottom:1px dashed #ececec;font-size:12.5px;color:var(--muted);padding-top:5px;padding-bottom:5px;}
  .pl-section-head td{font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);background:transparent;border-bottom:2px solid var(--azul);padding-top:16px;padding-bottom:4px;}
  /* Un ejercicio sin overlay de Presupuesto (la mayoría) no tiene nada que mostrar en las columnas
     4 y 5, se ocultan con esta clase y la columna Rubro se estira sola para ocupar el ancho libre
     (ver colgroup de abajo). Col. 3 ("% del total" de la col. 2) se agregó en la Versión 31 y se
     muestra SIEMPRE, por eso el corte es nth-child(n+4) (oculta la 4ta EN ADELANTE). ACTUALIZADO
     Versión 60: col. 4 pasó de ser una sola columna "Presupuesto" a 2 (Presupuesto + su propio
     % del total, pedido de Guido: "dos columnas que sean % del total"), pero como nth-child(n+4) ya
     oculta "la 4ta en adelante" (no una cantidad fija), la regla no necesitó tocarse — sigue
     ocultando exactamente lo que corresponde sin importar si son 1, 2 o más columnas extra. */
  #finanzasPLTable.pl-hide-compare th:nth-child(n+4), #finanzasPLTable.pl-hide-compare td:nth-child(n+4){display:none;}
  /* REGLA (Versión 39, bug real reportado por Guido con captura: la columna del ejercicio arrancaba
     en un % distinto del ancho de la tabla según el club/formato mostrado, ej. 41% en "Formato del
     club" de Boca vs. 47% en "Formato simplificado", medido en el navegador con getBoundingClientRect
    , porque #finanzasPLTable no tenía table-layout:fixed y el ancho de la columna Rubro se
     recalculaba solo, según el largo del texto más largo de esa tabla puntual. Con table-layout:fixed
     + el <colgroup> de arriba, las columnas 2-6 (numéricas) tienen SIEMPRE el mismo ancho fijo en
     píxeles pase lo que pase en Rubro (que se lleva el resto del ancho y ella sola se estira/wrappea),
     así que arrancan siempre en el mismo lugar, sin importar cuán largo sea el rubro más largo de
     ese club/año/formato puntual, y sin importar si son 3 columnas visibles (año a año) o 6 (por
     gestión). Si se agrega una columna nueva a esta tabla en el futuro, la REGLA es: sumarle su
     <col style="width:...px"> al colgroup (nunca dejarla sin ancho fijo), de lo contrario vuelve el
     mismo bug. Todas las columnas numéricas van siempre alineadas a la derecha, sea cual sea el modo
     (antes solo la col. 2 lo hacía en "Año a año", nunca en "Por gestión", inconsistencia de paso,
     corregida acá de una).
     BUG REAL #2 (mismo día, encontrado por Guido: "quedó horrible, no usa todo el ancho del card"):
     ocultar el <td>/<th> de las columnas 4-6 con la regla de arriba SÍ libera su espacio, pero un
     <col> con `display:none` en el <colgroup> NO, probado en el navegador con getBoundingClientRect:
     agregar `display:none` a esos <col> no cambió en nada el ancho de Rubro, seguía tan angosto como
     con los <col> visibles. En "table-layout:fixed" el ancho de columna lo fija el <col>, y ocultarlo
     con CSS no hace que el motor de layout libere ese ancho, a diferencia de una celda oculta. Único
     fix confiable: que esas columnas NO EXISTAN en el <colgroup> en modo "Año a año", no que existan
     ocultas. Por eso `syncPLTableColgroup()` (ver función en JS, arriba de `renderNativePLTable`)
     REESCRIBE el `<colgroup>` entero según el modo, en vez de dejarlo fijo en HTML y ocultar
     columnas por CSS. ACTUALIZADO Versión 57/59/60 (el resto del párrafo es historia, ya no la
     lectura actual): el criterio para reescribir el colgroup pasó de "Año a año vs. Por gestión" a
     "el ejercicio tiene overlay de Presupuesto o no" (Versión 57), y las columnas Var./Var.% se
     sacaron de la tabla del todo (Versión 59, ver `buildNativeSectionHtml`). En la Versión 60 se
     agregó una 2da columna de "% del total" (para Presupuesto) Y se angostaron los anchos numéricos
     existentes (100/65px → 84/54px) para que las 5 columnas totales entren sin scroll horizontal
     (pedido de Guido: "desliza las columnas apenas a la izquierda para que no haya que scrollear.
     esto tambien deberia ser regla" — REGLA: toda columna nueva que se agregue a esta tabla a
     futuro tiene que angostar las existentes en la misma medida que agranda el total, no solo
     sumarse encima). Hoy son 3 `<col>` sin overlay (Rubro + 2 numéricas) y 5 con overlay (Rubro +
     4), no 3/6 como decía este párrafo originalmente. Los anchos finales (84/54, no 78/40 como en un
     primer intento) salieron de verificar en el navegador con scrollWidth/clientWidth: 78/40 hacía
     que el propio CONTENIDO de la celda (el header "PRESUPUESTO" en mayúsculas, o "100%") desbordara
     su columna aunque la tabla en sí no excediera el contenedor — ver el comentario de
     `overflow-wrap:break-word` más abajo para el fix complementario. */
  /* El wrapper `.table-scroll` (overflow-x:auto) es la salida para pantallas angostas donde ni
     siquiera las columnas numéricas realmente visibles + un Rubro legible entran, scrollea horizontal
     en vez de aplastar las columnas y romper la regla de arriba. El `min-width` de la tabla depende
     de si el ejercicio tiene overlay de Presupuesto: con overlay necesita lugar para 4 columnas
     numéricas (276px, Versión 60: 84+54+84+54) + Rubro; sin overlay solo necesita 2 (138px) + Rubro,
     así que su mínimo es más chico, si usáramos el mismo min-width en los dos casos, el caso sin
     overlay (la mayoría de los ejercicios) forzaría scroll en mobile sin necesidad. */
  .table-scroll{overflow-x:auto;}
  #finanzasPLTable{table-layout:fixed;min-width:600px;}
  #finanzasPLTable.pl-hide-compare{min-width:300px;}
  #finanzasPLTable th:nth-child(n+2), #finanzasPLTable td:nth-child(n+2){text-align:right;}
  #finanzasPLTable th:nth-child(3), #finanzasPLTable td:nth-child(3), #finanzasPLTable th:nth-child(5), #finanzasPLTable td:nth-child(5){color:var(--muted);}
  /* BUG REAL (Versión 60, encontrado en el navegador con getBoundingClientRect/scrollWidth mientras
     se verificaba el fix de "desliza las columnas... para que no haya que scrollear"): con columnas
     numéricas angostas (54-84px), un header de una sola palabra en mayúsculas (`text-transform:
     uppercase` de arriba) como "PRESUPUESTO" no entra en una sola línea y, sin este fix, DESBORDA la
     celda en vez de cortar — eso por sí solo empujaba el ancho real de la tabla más allá del
     contenedor y forzaba scroll horizontal, aunque el <colgroup>/table-layout:fixed dijeran otra
     cosa (el ancho de columna no evita que el CONTENIDO de una celda desborde, son dos mecanismos
     distintos). Fix: `overflow-wrap:break-word` en los `<th>` de esta tabla, así una palabra que no
     entra se parte en dos líneas en vez de desbordar. Confirmado en el navegador (1280px de ancho):
     scrollWidth del wrapper `.table-scroll` volvió a ser igual a su clientWidth (antes 1091 vs 1078,
     una tabla con overlay de Presupuesto forzaba 13px de scroll de más). */
  #finanzasPLTable th{overflow-wrap:break-word;}
  .waterfall-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:16px;}
  .waterfall-step{flex:1 1 110px;padding:9px 8px;text-align:center;}
  .waterfall-step .label{font-size:10px;line-height:1.25;}
  .waterfall-step .value{font-size:12.5px;margin-top:3px;word-break:break-all;}
  .waterfall-op{flex:0 0 auto;font-size:17px;font-weight:700;color:var(--muted);}
  .waterfall-result{background:#eef3fa;border-color:var(--azul);}
  .source-note{font-size:12px;color:var(--muted);margin-top:8px;}
  .compare-table td.better{font-weight:700;}
  .charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:6px;}
  .chart-wrap{position:relative;height:270px;margin-top:8px;}
  /* Antes se dibujaba el "$" a mano dentro del <canvas> (afterDraw de Chart.js) para evitar que
     Chart.js lo rotara 90° (rota siempre el título nativo del eje Y), pero el glyph salía roto en
     el canvas (reportado por Guido, no se veía como un "$"). Un <span> de HTML normal, superpuesto
     arriba a la izquierda del área del gráfico, evita todo el lío de fuentes/transform del canvas:
     es texto de verdad, se ve exactamente como en el resto de la página. */
  .chart-axis-dollar{position:absolute;top:2px;left:6px;font-size:12px;font-weight:600;color:var(--muted);z-index:2;pointer-events:none;}
  .chart-caption{font-size:13px;color:var(--muted);}
  footer{background:var(--azul-dark);color:#c9d4e6;padding:26px 20px;font-size:13px;text-align:center;}
  footer a{color:var(--oro);}
  .modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;z-index:200;padding:20px;}
  .modal-overlay.open{display:flex;}
  .modal-box{background:#fff;border-radius:10px;padding:24px;max-width:440px;width:100%;}
  .modal-box label{display:block;font-size:13px;color:var(--muted);margin-bottom:2px;}
  .modal-box input,.modal-box select,.modal-box textarea{width:100%;padding:9px;margin:4px 0 14px;border:1px solid var(--border);border-radius:6px;font-family:inherit;font-size:14px;}
  .modal-actions{display:flex;gap:10px;justify-content:flex-end;}
  .btn-secondary{padding:9px 16px;border-radius:6px;border:1px solid var(--border);background:#fff;cursor:pointer;font-size:14px;}
  .btn-primary{padding:9px 16px;border-radius:6px;border:none;background:var(--azul);color:#fff;cursor:pointer;font-weight:600;font-size:14px;}

  /* Mi Cuenta / Saved Searches (to-do 70) */
  .saved-search-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);}
  .saved-search-row:last-child{border-bottom:none;}
  .saved-search-open{flex:1;text-align:left;background:none;border:none;cursor:pointer;font-size:14.5px;color:var(--azul);padding:4px 0;}
  .saved-search-open:hover{text-decoration:underline;}
  .saved-search-fav{background:none;border:none;cursor:pointer;font-size:17px;color:var(--border);line-height:1;padding:2px;}
  .saved-search-fav.active{color:var(--oro);}
  .saved-search-delete{background:none;border:none;cursor:pointer;font-size:14px;color:var(--muted);line-height:1;padding:2px 4px;}
  .saved-search-delete:hover{color:#c0392b;}

  details.accordion{border:1px solid var(--border);border-radius:8px;margin-bottom:8px;overflow:hidden;background:#fff;}
  details.accordion>summary{cursor:pointer;padding:11px 14px;font-weight:700;font-size:13.5px;list-style:none;background:#eef1f6;display:flex;justify-content:space-between;align-items:center;gap:10px;}
  details.accordion>summary::-webkit-details-marker{display:none;}
  details.accordion>summary::after{content:'+';font-size:16px;color:var(--muted);flex-shrink:0;}
  details.accordion[open]>summary::after{content:'\2212';}
  details.accordion .accordion-body{padding:12px 14px;}
  details.accordion.nested{margin-left:0;border-color:#e9e9e6;margin-bottom:6px;}
  details.accordion.nested>summary{background:#f7f7f5;font-size:12.5px;font-weight:600;padding:8px 12px;}
  /* El ::after (+/−) es un 3er hijo flex además de los 2 <span>, con justify-content:space-between
     el monto (2do hijo) quedaba "flotando" a una distancia distinta del borde derecho en cada fila
     (según cuánto medía el label), no alineado. Ancho fijo para el label (crece/achica) y para el
     monto (siempre el mismo ancho, alineado a la derecha) resuelve la alineación entre filas. */
  details.accordion.nested>summary>span:first-child{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  details.accordion.nested>summary>span:last-child{flex:0 0 130px;text-align:right;}
  details.accordion.nested details.accordion.nested>summary{background:#fbfbfa;font-size:12px;}
  .mini-table{width:100%;border-collapse:collapse;font-size:12.5px;margin-bottom:2px;table-layout:fixed;}
  .mini-table td{padding:4px 8px;border-bottom:1px solid #f1f1ee;word-wrap:break-word;}
  .mini-table td.amount{text-align:right;white-space:nowrap;width:130px;}
  .mini-table tr.subtotal-row td{font-weight:700;background:#f4f4f1;}
  .mini-table tr.total-row td{font-weight:700;background:#e9edf3;}
  .mini-table tr.subhead td{font-style:italic;color:var(--muted);font-size:11px;padding-top:8px;background:transparent;border-bottom:none;}
  .mini-table tr.neg-row td{color:var(--red);}
  /* La fila que explica por qué no hay gastos, en vez de una lista de rubros en 0. */
  .pl-nodata td{color:var(--muted);font-size:12.5px;font-style:italic;line-height:1.5;padding:10px 12px;}
  .premisas-list{font-size:13.5px;color:var(--text);line-height:1.7;margin:0 0 12px;padding-left:20px;}
  .premisas-list li{margin-bottom:4px;}
  .premisas-h{font-size:13px;font-weight:700;margin:14px 0 4px;}
  .premisas-h:first-child{margin-top:0;}

  /* ===== EL SELECTOR DENTRO DE FINANZAS (Versión 143) =====
     Sin club elegido, Finanzas era la peor pantalla del sitio: tablas vacías, selectores
     de Año sin opciones, y el banner amarillo de "dato placeholder" encima, que además
     miente — no hay un dato inventado, no hay ningún dato. Ahora esa pantalla es UNA
     cosa: el selector. Con club elegido el mismo card se encoge a una línea, porque ya
     no es la tarea sino cómo se cambia de club.
     Viene del prototipo 4 (`Admin/Archive/selector-merge-a-produccion.md`, etapa 1 del plan
     de merge). Es la única etapa independiente de todo el resto: no toca js/selector.js
     ni el modelo de datos, así que el botón de acá abre el panel de columnas de hoy. */
  #finanzas.sin-club > *:not(h1):not(.subtitle):not(.fin-sel){display:none !important;}
  .fin-sel{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px 16px;
           margin-bottom:18px;display:flex;align-items:center;gap:13px;flex-wrap:wrap;}
  .fin-sel.vacio{border-style:dashed;border-color:var(--azul);background:#f3f7ff;}
  .fin-sel-ico{width:38px;height:38px;border-radius:50%;background:var(--azul);color:#fff;font-size:13px;
               font-weight:800;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .fin-sel-txt{display:flex;flex-direction:column;min-width:0;flex:1;}
  .fin-sel-t{font-size:16px;font-weight:800;}
  .fin-sel-s{font-size:12.5px;color:var(--muted);}
  .fin-sel-btn{background:var(--azul);color:#fff;border:1px solid var(--azul);border-radius:9px;padding:10px 16px;
               font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;}
  .fin-sel-btn:hover{background:var(--azul-dark);}
  .fin-sel-btn.alt{background:none;color:var(--azul);}
  .fin-sel-btn.alt:hover{background:#eef2f9;color:var(--azul-dark);}

  /* ===== INICIO =====
     Arriba qué es el sitio y el buscador como acción principal; abajo las tarjetas de ranking; al pie, las reglas del dato. Las
     tarjetas (.vid-card) son el lenguaje visual que comparten Inicio, Ligas y Finanzas: blanco sobre --bg, borde fino, radio 14,
     barras horizontales con el punto del color de cada club. */
  .ini-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:40px;align-items:center;padding:28px 0 40px;}
  .ini-hero-txt{display:flex;flex-direction:column;gap:14px;}
  .ini-eyebrow{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-height:1em;}
  .ini-hero h1{margin:0;font-size:42px;line-height:1.08;letter-spacing:-.02em;color:var(--azul);}
  .ini-lead{margin:0;font-size:17px;line-height:1.55;color:#45474d;max-width:520px;}
  .ini-busca{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:24px;display:flex;flex-direction:column;gap:16px;}
  .ini-busca-l{font-weight:700;font-size:15px;}
  .ini-busca-campo{display:flex;align-items:center;gap:12px;height:56px;padding:0 16px;border:2px solid var(--azul);border-radius:10px;color:var(--azul);background:#fff;}
  .ini-busca-campo input{flex:1 1 auto;min-width:0;border:0;outline:none;font:inherit;font-size:17px;background:transparent;color:var(--text);}
  .ini-busca-campo:focus-within{box-shadow:0 0 0 3px rgba(10,43,92,.15);}
  .ini-kbd{font:inherit;font-size:12px;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:2px 6px;}
  .ini-atajos{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:32px;}
  .ini-atajos-l{font-size:13px;color:var(--muted);}
  .ini-atajo{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;border:0;background:#eef1f6;
    color:var(--azul);font:inherit;font-size:13px;font-weight:600;cursor:pointer;}
  .ini-atajo:hover{background:#e1e7f0;}
  .ini-cmp{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:16px 0 0;border:0;
    border-top:1px solid var(--border);background:none;font:inherit;color:var(--azul);text-align:left;cursor:pointer;}
  .ini-cmp > span{display:flex;flex-direction:column;gap:2px;}
  .ini-cmp-t{font-weight:700;font-size:15px;}
  .ini-cmp-s{font-size:13px;color:var(--muted);}
  .ini-cmp:hover .ini-cmp-t{text-decoration:underline;}
  .ini-reglas{margin-top:48px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;}
  .ini-regla-t{font-weight:700;font-size:15px;color:var(--azul);margin-bottom:6px;}
  .ini-reglas p{margin:0;font-size:14px;color:#45474d;line-height:1.5;}
  .ini-reglas a{color:var(--azul);}
  @media (max-width:600px){ .ini-hero h1{font-size:32px;} .ini-hero{padding-top:8px;gap:24px;} }

  .vidriera{display:flex;flex-direction:column;gap:48px;}
  .vid-sec{display:flex;flex-direction:column;gap:20px;}
  .vid-sec:empty{display:none;}
  .vid-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:8px;}
  .vid-h{margin:0 0 4px;font-size:24px;color:var(--azul);}
  .vid-sub{margin:0;font-size:14px;color:var(--muted);line-height:1.5;max-width:760px;}
  .vid-link{background:none;border:0;padding:0;min-height:32px;font:inherit;font-size:13.5px;font-weight:700;color:var(--azul);
    cursor:pointer;white-space:nowrap;}
  .vid-link:hover{text-decoration:underline;}
  .vid-grilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:16px;}
  .vid-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:14px;}
  .vid-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
  .vid-card-h{margin:0;font-size:18px;display:flex;align-items:center;gap:8px;}
  .vid-chip{font-size:20px;line-height:1;}
  .vid-card-sub{font-size:13px;color:var(--muted);margin-top:4px;}
  .vid-filas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;}
  .vid-fila{width:100%;display:grid;grid-template-columns:20px minmax(0,1.3fr) minmax(0,1fr) 92px;align-items:center;gap:10px;
    padding:5px 6px;margin:0 -6px;border:0;border-radius:6px;background:none;font:inherit;font-size:14px;color:var(--text);
    text-align:left;cursor:pointer;font-variant-numeric:tabular-nums;box-sizing:content-box;}
  .vid-fila:hover{background:#f4f5f7;}
  .vid-pos{color:var(--muted);font-size:12px;text-align:right;}
  .vid-nom{display:flex;align-items:center;gap:8px;min-width:0;}
  .vid-nom-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .vid-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);}
  .vid-pais{font-size:14px;line-height:1;flex:0 0 auto;}
  .vid-barra{height:10px;border-radius:5px;background:#eef0f3;overflow:hidden;}
  .vid-barra > span{display:block;height:100%;border-radius:5px;}
  .vid-val{text-align:right;font-weight:700;white-space:nowrap;}
  .vid-card-pie{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:var(--muted);
    border-top:1px solid #f0f0ee;padding-top:12px;}
  .vid-aviso{background:#fdf5dc;color:#6b4e00;border-radius:999px;padding:4px 10px;font-weight:600;}
  /* En el teléfono la barra baja a una segunda línea: si no, el nombre del club queda en tres letras. */
  @media (max-width:560px){
    .vid-fila{grid-template-columns:20px minmax(0,1fr) auto;row-gap:4px;}
    .vid-val{grid-row:1;grid-column:3;}
    .vid-barra{grid-row:2;grid-column:2 / 4;height:6px;}
  }
  /* `display:flex` de una clase le gana al `display:none` que el navegador le da a
     [hidden]: sin esta regla, un .fin-sel escondido se ve igual. */
  .fin-sel[hidden]{display:none;}
  /* to-do 147, paso 2: "otra liga" como card propio, texto a la izquierda y el botón a la derecha. */
  .liga-sim-card{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
  .liga-sim-txt{flex:1 1 240px;min-width:0;}
  .liga-sim-txt .subtitle{margin-bottom:0;}
  /* paso 13: el puesto en otra liga, a la derecha del texto (abajo en celular). */
  .liga-sim-res{text-align:center;min-width:220px;flex:0 1 300px;}
  .liga-sim-res[hidden]{display:none;}
  .liga-sim-pick{font-size:13px;color:var(--muted);display:block;margin-bottom:6px;}
  .liga-sim-pick select{font:inherit;padding:4px 8px;border:1px solid var(--border);border-radius:6px;color:var(--text);max-width:180px;}
  .liga-sim-big{font-size:34px;font-weight:800;color:var(--azul);line-height:1.1;}
  .liga-sim-cap{font-size:12.5px;color:var(--muted);margin:2px 0 10px;}
  /* to-do 147, paso 4: los cards de ejercicios (vista multi-año). Un card por año, se prende y se apaga
     solo; sin checkbox (pedido de Guido): prendido = borde azul y fondo celeste. */
  .fin-multi #anioSelectWrap{display:none !important;}
  /* FINANZAS, lo de arriba: el título con "Cambiar de club", la guía de una línea, la tarjeta de ejercicios con la vista en palabras
     y el panel "Más opciones" (moneda, inflación, formato), el aviso compacto y el índice fijo de la página. */
  .fin-titulo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .fin-titulo h1{margin:0;}
  .fin-cambiar{min-height:36px;padding:0 12px;border-radius:8px;border:0;background:#eef1f6;color:var(--azul);font:inherit;
    font-size:13px;font-weight:700;cursor:pointer;}
  .fin-cambiar:hover{background:#e1e7f0;}
  .fin-cambiar[hidden]{display:none;}
  .fin-guia{display:flex;align-items:flex-start;gap:12px;background:#eef1f6;border-radius:12px;padding:12px 16px;font-size:14px;
    color:var(--azul);margin:0 0 16px;line-height:1.5;}
  .fin-guia[hidden]{display:none;}
  .fin-guia > svg{flex:0 0 auto;margin-top:1px;}
  .fin-guia > span{flex:1 1 auto;}
  .fin-guia-x{flex:0 0 auto;width:32px;height:32px;margin:-6px -8px -6px 0;border:0;background:none;color:var(--azul);font-size:20px;cursor:pointer;}
  .fin-years{margin-bottom:14px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px 20px;}
  .fin-vista{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #f0f0ee;
    padding-top:12px;margin-top:12px;}
  .fin-vista-txt{font-size:14px;color:#45474d;}
  .fin-vista-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:10px;border:1px solid #c9ced8;
    background:#fff;color:var(--azul);font:inherit;font-size:14px;font-weight:700;cursor:pointer;}
  .fin-vista-btn[aria-expanded="true"]{background:var(--azul);border-color:var(--azul);color:#fff;}
  .controls.fin-ajustes{display:none;}
  .controls.fin-ajustes.abierto{display:flex;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 20px;
    margin:-6px 0 16px;gap:12px 20px;}
  .fin-moneda-slot:empty{display:none;}
  .fin-moneda-slot .header-currency-toggle{border:1px solid var(--border);border-radius:8px;}
  .fin-moneda-slot .header-currency-toggle button{color:var(--azul);padding:6px 12px;font-size:13px;}
  .fin-moneda-slot .header-currency-toggle button.active{background:var(--azul);color:#fff;}
  .fin-aviso{margin:0 0 16px;padding:10px 14px;border-radius:10px;background:#fdf5dc;color:#6b4e00;font-size:13.5px;line-height:1.5;}
  .fin-indice{position:sticky;top:58px;z-index:5;display:flex;gap:4px;overflow-x:auto;background:var(--bg);
    border-bottom:1px solid var(--border);margin:8px 0 18px;scrollbar-width:none;}
  .fin-indice[hidden]{display:none;}
  .fin-indice a{padding:10px 14px;font-size:14px;color:#45474d;text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;}
  .fin-indice a:hover{color:var(--azul);}
  .fin-indice a.activo{color:var(--azul);font-weight:700;border-bottom-color:var(--oro);}
  #finTrendCard,#finPL,#finDeuda,#finContexto,#ligaSimWrap,#finEstructura,#finAuditoria,#finCitar,#finanzasFuentesCard{scroll-margin-top:120px;}
  @media (max-width:700px){ .fin-indice{top:56px;} }
  /* Entre 701 y 900 el header tiene varias filas y alto variable: ahí el índice no queda fijo. */
  @media (min-width:701px) and (max-width:900px){ .fin-indice{position:static;} }
  .fin-years-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
  .fin-years-lbl{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-right:4px;}
  .fin-years-presets{display:flex;gap:6px;flex-wrap:wrap;}
  .fin-years-presets button{border:1px solid var(--border);background:#fff;border-radius:6px;padding:5px 10px;font-size:13px;cursor:pointer;}
  .fin-years-presets button.on{border-color:var(--azul);color:var(--azul);font-weight:600;}
  .fin-years-row{display:flex;gap:6px;flex-wrap:wrap;align-items:stretch;}
  .fin-year{border:1px solid var(--border);background:#fff;border-radius:8px;padding:5px 10px;cursor:pointer;text-align:left;min-width:64px;font:inherit;line-height:1.15;color:var(--text);}
  .fin-year b{display:block;font-size:13px;font-variant-numeric:tabular-nums;}
  .fin-year span{display:block;font-size:10px;color:var(--muted);white-space:nowrap;}
  .fin-year.on{border-color:var(--azul);background:#eef2f9;}
  .fin-year.on b{color:var(--azul);}
  .fin-year.presu{border-style:dashed;}
  .fin-year.presu span{color:#8a6d00;}
  .fin-year.sinpub{cursor:not-allowed;opacity:.55;background:repeating-linear-gradient(135deg,#fff 0 6px,#f1f1ee 6px 12px);}
  .fin-years-more{align-self:center;white-space:nowrap;border:0;background:none;padding:0 4px 0 0;color:var(--azul);font-size:13px;font-weight:600;cursor:pointer;}
  /* paso 12: la fila Gestión, arriba de los cards de ejercicios. */
  .fin-years-gest{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 8px;}
  .fin-years-gest[hidden]{display:none;}
  .fin-gest{white-space:nowrap;border:1px solid #cfd8e6;background:#fff;border-radius:16px;padding:4px 11px;font-size:12.5px;cursor:pointer;color:var(--azul);}
  .fin-gest small{color:var(--muted);margin-left:5px;font-size:11px;}
  .fin-gest.on{background:var(--azul);border-color:var(--azul);color:#fff;}
  .fin-gest.on small{color:#cfd8e6;}
  .fin-years-empty{font-size:13px;color:var(--muted);margin:10px 0 0;}
  /* Sin ningún ejercicio elegido, la página se queda con el título, los cards y el aviso. */
  /* to-do 147, paso 5a: Estado de resultados con una columna por ejercicio. Ancho automático (no el
     table-layout:fixed de la tabla de un año) y la columna Rubro fija al scrollear de costado. */
  table[hidden]{display:none !important;}
  .pl-multi{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;}
  .pl-multi th,.pl-multi td{text-align:right;white-space:nowrap;padding:7px 10px;}
  .pl-multi th{vertical-align:bottom;}
  .pl-multi th small{display:block;font-weight:500;font-size:10.5px;color:var(--muted);text-transform:none;letter-spacing:0;}
  .pl-multi th:first-child,.pl-multi td:first-child{text-align:left;white-space:normal;min-width:170px;position:sticky;left:0;background:var(--card);z-index:1;}
  .pl-multi tr.pl-shade td:first-child{background:#f2f2ef;}
  .pl-multi tr.pl-highlight td:first-child{background:#eef3fa;}
  .pl-multi tr.pl-section-head td{text-align:left;}
  .pl-multi .pl-col-presu{background:#fdf8e7;color:#8a6d00;font-style:italic;}
  .pl-multi th.pl-col-presu small{color:#8a6d00;}
  .pl-multi .pl-gap{padding:0 2px;min-width:14px;color:#bbb;text-align:center;}
  .pl-multi .pl-delta{font-size:13px;}
  .pl-multi .pl-spark{text-align:center;padding-top:2px;padding-bottom:2px;}
  .pl-multi .pl-up{color:var(--green);}
  .pl-multi .pl-down{color:var(--red);}
  /* paso 5b: rubro desplegable con su gráfico, desvío vs. presupuesto, controles arriba de la tabla. */
  .pl-multi tr.pl-row-open{cursor:pointer;}
  .pl-multi tr.pl-row-open:hover td{background:#f6f8fc;}
  .pl-multi tr.pl-row-open.abierto td{background:#eef3fa;}
  .pl-multi tr.pl-row-open .pl-arrow{color:var(--muted);margin-right:4px;}
  .pl-multi tr.pl-row-chart td{background:#f8fafd;text-align:left;padding:10px 12px 14px;}
  .pl-row-chart-wrap{position:sticky;left:12px;height:190px;max-width:calc(100vw - 80px);width:760px;}
  .pl-multi tr.pl-gest-row th{padding:6px 4px 0;text-align:center;border-bottom:0;}
  .pl-multi th.pl-gest span{display:block;border-bottom:2px solid var(--azul);color:var(--azul);font-weight:700;font-size:11.5px;padding-bottom:3px;overflow:hidden;text-overflow:ellipsis;}
  .pl-multi th.pl-gest.alt span{border-color:#8fb0dd;color:#3f6fb5;}
  .pl-multi .pl-dev{font-size:12.5px;background:#fafaf8;}
  .pl-multi th small{font-style:normal;}
  .pl-multi-ctrls{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 10px;}
  .pl-multi-ctrls[hidden]{display:none;}
  .pl-multi-hint{font-size:12.5px;color:var(--muted);}
  .pl-multi-right{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
  .pl-multi-bud{border:1px solid var(--border);background:#fff;border-radius:6px;padding:6px 10px;font-size:13px;cursor:pointer;}
  /* paso 11: la explicación del ajuste por inflación. */
  .fin-real-note{margin:-18px 0 22px;font-size:13px;background:#eef6f0;border:1px solid #cfe5d6;border-radius:8px;padding:8px 12px;color:#1d4d2e;}
  .fin-real-note[hidden]{display:none;}
  /* paso 9: fuentes por ejercicio, año en los cards de presupuesto. */
  .fin-src-year{border-top:1px solid var(--border);padding:8px 0;}
  .fin-src-year > summary{cursor:pointer;font-weight:600;font-size:14.5px;}
  .fin-card-yr{color:var(--muted);font-weight:400;}
  /* paso 7: el gráfico de evolución arriba de la tabla; la sección "Gráficos" vieja no va en multi. */
  .fin-multi #finChartsCard{display:none !important;}
  .fin-mchart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;}
  .fin-mchart-head .subtitle{margin-bottom:8px;}
  .fin-mchart-wrap{position:relative;height:300px;}
  @media (max-width:640px){ .fin-mchart-wrap{height:240px;} }
  /* paso 6: KPIs en modo multi-año. */
  .stat .stat-year{color:var(--muted);font-weight:400;}
  .stat .stat-tag{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#8a6d00;background:#fdf8e7;border:1px dashed #d9c27a;border-radius:4px;padding:0 4px;vertical-align:1px;}
  .stat.stat-presu{border-style:dashed;border-color:#d9c27a;background:#fffcf2;}
  .stat-cmp{display:flex;justify-content:space-between;align-items:flex-end;gap:6px;margin-top:6px;font-size:12px;color:var(--muted);}
  .stat-cmp b{font-weight:600;}
  .stat-cmp b.pos{color:var(--green);} .stat-cmp b.neg{color:var(--red);}
  .pl-multi-bud.on{border-color:#d9c27a;background:#fdf8e7;color:#8a6d00;font-weight:600;}
  #finanzas.sin-anio > *:not(h1):not(.subtitle):not(.fin-sel):not(.fin-years){display:none !important;}
  @media (max-width:640px){
    .fin-years-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;}
    .fin-year,.fin-years-more{flex:none;}
    .pl-multi th:first-child,.pl-multi td:first-child{min-width:130px;}
  }
  /* El aviso de "no se pudo cargar el club" vivía adentro del hero del cold start
     (borrado en la Versión 146) y heredaba su paleta oscura: acá va sobre fondo claro. */
  .aviso-error{background:#fdecea;border:1px solid #e08d84;color:#8c2b21;border-radius:8px;
               padding:9px 12px;font-size:13px;margin:14px 0 0;}
  .aviso-error[hidden]{display:none;}

  /* ===== EL SELECTOR PASO A PASO (Versión 146) =====
     Reemplaza al panel de Miller columns. Un modal con los pasos apilados: el
     resuelto se encoge a una línea, el actual se abre, los de abajo esperan.
     Viene del prototipo 4 (etapa 3 del merge). */
  .sel-modal{position:fixed;inset:0;z-index:90;display:none;align-items:flex-start;justify-content:center;
             padding:34px 16px;overflow-y:auto;}
  .sel-modal.open{display:flex;}
  .modal-panel{background:linear-gradient(160deg,var(--azul) 0%,var(--azul-dark) 100%);color:#fff;border-radius:14px;
               width:100%;max-width:760px;padding:18px 20px 22px;box-shadow:0 24px 60px rgba(7,29,63,.45);}
  .modal-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
  .modal-h{font-size:20px;font-weight:800;flex:1;margin:0;}
  .modal-x{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#fff;border-radius:8px;
           width:30px;height:30px;font-size:15px;line-height:1;cursor:pointer;font-family:inherit;}
  .modal-x:hover{background:rgba(242,183,5,.22);border-color:var(--oro);}
  .modal-busca{display:flex;align-items:center;gap:8px;background:#fff;border-radius:10px;padding:4px 4px 4px 14px;margin-bottom:16px;}
  .modal-busca input{flex:1;border:none;outline:none;font-size:15px;padding:10px 0;background:none;font-family:inherit;color:var(--text);}
  .modal-busca .lupa{color:var(--muted);font-size:15px;}

  /* Un card por paso, con sus tres estados: resuelto, actual y pendiente.
     `color` explícito: el panel de afuera es azul con texto blanco, y sin esto
     cualquier texto del card que no traiga color propio nace blanco sobre blanco. */
  .paso{background:var(--card);color:var(--text);border-radius:12px;margin-bottom:10px;overflow:hidden;
        border:1px solid transparent;}
  .paso.pendiente{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#fff;}
  .paso.ahora{border-color:var(--oro);box-shadow:0 8px 24px rgba(7,29,63,.25);}
  .paso-head{display:flex;align-items:center;gap:11px;padding:11px 14px;}
  .paso-n{width:22px;height:22px;border-radius:50%;background:#eef2f9;color:var(--azul);font-size:11.5px;
          font-weight:800;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .paso.ahora .paso-n{background:var(--oro);color:var(--azul-dark);}
  .paso.pendiente .paso-n{background:rgba(255,255,255,.12);color:#a8b8d4;}
  .paso-ht{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1;}
  .paso-t{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:var(--muted);}
  .paso.pendiente .paso-t{color:#8fa3c4;}
  .paso-v{font-size:15px;font-weight:700;color:var(--text);}
  .paso-change{background:none;border:1px solid var(--border);color:var(--azul);border-radius:7px;
               padding:4px 10px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;}
  .paso-change:hover{border-color:var(--azul);background:#eef2f9;}
  .paso-body{padding:2px 14px 14px;}
  .paso-vacio{color:var(--muted);font-size:13.5px;margin:6px 0;}
  /* "Mostrar más" del buscador y del constructor de mezcla (Versión 165). */
  .sel-mas{
    display:block;margin:10px auto 2px;padding:7px 16px;border:1px solid var(--border);
    border-radius:8px;background:var(--card);color:var(--azul);font-size:13.5px;
    font-weight:600;cursor:pointer;
  }
  .sel-mas:hover{background:var(--bg);}
  .paso-ayuda{color:var(--muted);font-size:12.5px;margin:0 0 10px;}

  /* Las opciones. Grilla que se acomoda sola: en desktop entran 2 o 3 por fila, en
     un teléfono queda una columna, sin una sola media query. */
  .op-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;}
  .op-grid.clubes{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));max-height:340px;overflow-y:auto;}
  .op{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:#fff;border:1px solid var(--border);
      border-radius:9px;padding:10px 12px;font-family:inherit;font-size:14px;cursor:pointer;color:var(--text);}
  .op:hover{border-color:var(--azul);background:#eef2f9;}
  .op.off{opacity:.45;cursor:not-allowed;}
  .op.off:hover{border-color:var(--border);background:#fff;}
  /* La casilla. Cada paso es multi-selección, y una casilla lo dice sin explicarlo:
     un botón que se pinta al tocarlo se lee como un radio. */
  .op-check{width:17px;height:17px;border-radius:5px;border:1.5px solid var(--border);flex:0 0 auto;
            display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;background:#fff;}
  .op.on{border-color:var(--azul);background:#eef2f9;}
  .op.on .op-check{background:var(--azul);border-color:var(--azul);}
  .op.off .op-check{opacity:.5;}
  .op-icon{font-size:17px;flex:0 0 auto;}
  .op-crest{width:24px;height:24px;border-radius:50%;background:var(--azul);color:#fff;font-size:9px;font-weight:800;
            display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .op-txt{display:flex;flex-direction:column;min-width:0;flex:1;}
  /* El label ENVUELVE en vez de cortarse con puntos suspensivos: el modal mide
     760px y "Fútbol americano" quedaba en "Fútbol …". Un nombre cortado en una
     lista de opciones es peor que una fila de dos renglones. */
  .op-label{font-weight:600;line-height:1.25;}
  .op-sub{font-size:11.5px;color:var(--muted);}
  /* flex:0 0 auto + margin-left: sin esto el meta se encimaba con un label largo
     ("Automovilismo · próximamente"), porque nowrap no reserva su propio lugar. */
  .op-meta{font-size:11.5px;color:var(--muted);white-space:nowrap;flex:0 0 auto;margin-left:auto;padding-left:6px;}

  /* El "?" de una opción con explicación (to-do 47: por qué México casi no tiene
     clubes cargados). `.op-cell` envuelve el botón de selección (`.op`) y el de
     info: los dos son <button> hermanos, nunca uno anidado en el otro. */
  .op-cell{position:relative;}
  .op-cell .op{padding-right:32px;}
  .op-info{position:absolute;top:8px;right:8px;width:19px;height:19px;border-radius:50%;
           border:1.5px solid var(--muted);background:#fff;color:var(--muted);padding:0;
           font-family:inherit;font-size:11px;font-weight:800;line-height:1;cursor:pointer;
           display:flex;align-items:center;justify-content:center;}
  .op-info:hover{border-color:var(--azul);color:var(--azul);}
  /* El bocadillo del "?" NO es descendiente de `.op-info` (ver el comentario de
     `infoBtn()`/`mostrarInfo()` en js/selector.js): `.paso` recorta con
     `overflow:hidden` para sus esquinas redondeadas, y un bocadillo anidado se
     cortaba apenas el botón quedaba cerca del borde de la card. Un único
     `position:fixed` colgado de `document.body` y reposicionado en JS con
     `getBoundingClientRect()` esquiva ese recorte. Oculto por default: JS lo
     muestra con `display:block` al hacer hover o click sobre un `.op-info`. */
  /* (Versión 515) "Dentro de otro rubro" en Finanzas y Ligas: el rubro va en el mismo bocadillo (data-info-tip). */
  .pl-incluido{cursor:help;border-bottom:1px dotted currentColor;}
  .op-info-float{display:none;position:fixed;width:230px;max-width:min(230px,70vw);
                 background:var(--text);color:#fff;font-size:12px;font-weight:400;line-height:1.45;
                 text-align:left;white-space:normal;padding:10px 12px;border-radius:8px;
                 box-shadow:0 4px 14px rgba(0,0,0,.25);z-index:2000;}

  .paso-todos-fila{display:flex;gap:8px;margin-bottom:9px;flex-wrap:wrap;}
  .paso-todos{background:#fff;border:1px solid var(--azul);color:var(--azul);border-radius:7px;padding:5px 11px;
              font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;}
  .paso-todos.on, .paso-todos:hover{background:var(--azul);color:#fff;}
  .paso-nada{background:none;border:1px solid var(--border);color:var(--muted);border-radius:7px;padding:5px 11px;
             font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;}
  .paso-nada:hover{border-color:var(--red);color:var(--red);}

  /* El pie de cada paso: confirmar, o decidir después. "Elegir más tarde" está en
     todos los pasos, y por eso ninguno dice "opcional": todos lo son. */
  .paso-pie{display:flex;align-items:center;gap:14px;margin-top:12px;flex-wrap:wrap;}
  .paso-ok{background:var(--azul);color:#fff;border:1px solid var(--azul);border-radius:8px;
           padding:9px 16px;font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;}
  .paso-ok:hover{background:var(--azul-dark);}
  .paso-ok.off{background:#eef2f9;color:var(--muted);border-color:var(--border);cursor:not-allowed;}
  .paso-skip{background:none;border:none;color:var(--azul);font-family:inherit;font-size:13px;
             cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:2px 0;}
  .paso-skip:hover{color:var(--azul-dark);}

  /* El paso del ejercicio: una fila por club, con su año al lado. La regla que lo
     ordena es que un ejercicio nunca aparece suelto, siempre cuelga de su club. */
  .armado{display:flex;flex-direction:column;gap:9px;max-height:390px;overflow-y:auto;}
  .arm-fila{border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:#fff;}
  .arm-cab{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
  .arm-crest{width:24px;height:24px;border-radius:50%;background:var(--azul);color:#fff;font-size:9px;font-weight:800;
             display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .arm-n{font-size:14.5px;font-weight:700;}
  .arm-anio{display:flex;align-items:center;gap:7px;margin-bottom:6px;}
  .arm-anio select{flex:1;font-family:inherit;font-size:13px;padding:7px 8px;border:1px solid var(--border);
                   border-radius:8px;background:#fff;color:var(--text);cursor:pointer;}
  .arm-x{background:none;border:1px solid var(--border);color:var(--muted);border-radius:7px;width:28px;height:28px;
         font-size:15px;line-height:1;cursor:pointer;flex:0 0 auto;}
  .arm-x:hover{border-color:var(--red);color:var(--red);}
  .arm-mas{background:none;border:none;color:var(--azul);font-family:inherit;font-size:12.5px;cursor:pointer;
           text-decoration:underline;text-underline-offset:3px;padding:2px 0;}

  /* El promedio de una liga, comparando: reemplaza al "+" de la columna de ligas. */
  .cmp-ligas{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);}

  /* El card final: dice qué se eligió y lo confirma. */
  .paso.resultado .paso-n{background:var(--green);color:#fff;}
  .res-msg{font-size:15.5px;font-weight:700;margin:0 0 4px;}
  .res-sub{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 12px;max-width:620px;}

  /* ===== EL PASO 4 Y SUS RAMAS (Versión 148) =====
     Tres opciones grandes, no una grilla de filtros: es una bifurcación. */
  .op-grid.tipo{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
  .op-grid.tipo .op{flex-direction:column;align-items:flex-start;gap:5px;padding:14px;}
  .op-grid.tipo .op-check{display:none;}
  .op-grid.unico .op-check{display:none;} /* elección única (el club en el camino de Finanzas, to-do 96): tocar avanza, no hay casilla */
  .op-grid.tipo .op-icon{font-size:24px;}
  .op-grid.tipo .op-label{font-size:15px;font-weight:800;}
  .op-grid.tipo .op-meta{margin-left:0;}

  /* La rama Ligas: temporadas como chips, con cuántos equipos tenía cada una. Sin
     ese dato, "la liga creció" mezcla plata con aritmética. */
  .arm-fila.total{background:#f3f7ff;border-color:#c9d8f2;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .arm-ico{font-size:17px;}
  .arm-chips{display:flex;flex-wrap:wrap;gap:6px;}
  .arm-chip{background:#fff;border:1px solid var(--border);color:var(--text);border-radius:999px;padding:5px 12px;
            font-family:inherit;font-size:12.5px;font-weight:700;cursor:pointer;}
  .arm-chip:hover{border-color:var(--azul);background:#eef2f9;}
  .arm-chip.on{background:var(--azul);border-color:var(--azul);color:#fff;}
  .arm-chip.off{opacity:.4;cursor:not-allowed;}
  .arm-vacio{font-size:12.5px;color:var(--muted);}
  .agg-fila{display:flex;align-items:center;gap:7px;margin-top:9px;flex-wrap:wrap;}
  .agg-lbl{font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:800;color:var(--muted);}
  .agg-btn{background:#fff;border:1px solid var(--border);color:var(--muted);border-radius:7px;padding:5px 11px;
           font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;}
  .agg-btn:hover{border-color:var(--azul);color:var(--azul);}
  .agg-btn.on{background:var(--azul);border-color:var(--azul);color:#fff;}

  /* El constructor de la mezcla, con forma de tabla dinámica: una fila por parte,
     con qué es, de qué año, cómo se agrega y qué entra. */
  .mz-fila{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:10px;
           padding:9px 11px;background:#fff;flex-wrap:wrap;}
  .mz-num{width:20px;height:20px;border-radius:50%;background:#eef2f9;color:var(--azul);font-size:11px;font-weight:800;
          display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .mz-que{display:flex;flex-direction:column;min-width:150px;flex:1;}
  .mz-n{font-size:14px;font-weight:700;}
  .mz-s{font-size:11.5px;color:var(--muted);}
  .mz-anio select{font-family:inherit;font-size:12.5px;padding:6px 7px;border:1px solid var(--border);
                  border-radius:7px;background:#fff;color:var(--text);cursor:pointer;}
  .mz-agg{display:flex;gap:5px;}
  .mz-entra{font-size:11.5px;color:var(--muted);font-weight:700;white-space:nowrap;}
  .mz-x{background:none;border:none;color:var(--muted);font-size:17px;line-height:1;cursor:pointer;padding:0 3px;}
  .mz-x:hover{color:var(--red);}
  .mz-formula{margin:4px 0 0;font-size:12.5px;color:var(--azul);font-weight:700;}
  .mz-add{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap;}
  .mz-add-btn{background:#fff;border:1px dashed var(--azul);color:var(--azul);border-radius:9px;padding:9px 14px;
              font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;}
  .mz-add-btn:hover{background:#eef2f9;}
  .mz-panel{border:1px solid var(--azul);border-radius:10px;padding:12px;background:#f3f7ff;margin-top:4px;}
  .mz-panel-t{margin:0 0 9px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:800;color:var(--muted);}
  .mz-panel .op-grid{max-height:220px;overflow-y:auto;}
  .res-warn{background:#fdf6e3;border:1px solid #f0d98a;border-radius:9px;padding:9px 11px;font-size:12.5px;
            line-height:1.5;color:#7a5c00;margin:0 0 12px;}

  /* ===== LOS DOS CARDS DE COMPARAR (Versión 148) =====
     Arrancan VACÍOS: el card vacío es un botón grande y nada más, así la pantalla
     abre con una pregunta en vez de con un árbol de cinco niveles por lado. */
  /* to-do 23: los dos cards son blancos y sueltos, como los de Finanzas (antes iban en una franja azul con "VS"). */
  .cd-wrap{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch;margin-bottom:16px;}
  .cd-col{min-width:0;background:var(--card);color:var(--text);border-radius:12px;border:1px solid var(--border);overflow:hidden;
          display:flex;flex-direction:column;}
  .cd-head{display:flex;align-items:center;gap:9px;padding:11px 13px;border-bottom:1px solid var(--border);}
  .cd-letra{width:22px;height:22px;border-radius:50%;background:var(--azul);color:#fff;font-size:11.5px;font-weight:800;
            display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .cd-letra.chica{display:inline-flex;width:19px;height:19px;font-size:10.5px;margin-right:7px;vertical-align:1px;}
  .cd-titulo{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:var(--muted);flex:1;}
  .cd-x{background:none;border:none;color:var(--muted);font-size:19px;line-height:1;cursor:pointer;padding:0 3px;}
  .cd-x:hover{color:var(--red);}
  /* El botón ocupa el alto del card entero, para que apretar "en cualquier parte
     del card" haga lo que el visitante espera. */
  .cd-vacio{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
            background:none;border:2px dashed var(--border);border-radius:11px;margin:11px;padding:30px 18px;
            font-family:inherit;color:var(--text);cursor:pointer;text-align:center;}
  .cd-vacio:hover{border-color:var(--azul);background:#f3f7ff;}
  .cd-vacio-mas{width:34px;height:34px;border-radius:50%;background:var(--azul);color:#fff;font-size:21px;line-height:1;
                display:flex;align-items:center;justify-content:center;margin-bottom:3px;}
  .cd-vacio-t{font-size:16px;font-weight:800;}
  .cd-vacio-s{font-size:12.5px;color:var(--muted);max-width:280px;line-height:1.45;}
  .cd-elegido{padding:13px;}
  .cd-sujeto{display:flex;align-items:center;gap:11px;margin-bottom:12px;}
  .cd-crest{width:34px;height:34px;border-radius:50%;background:var(--azul);color:#fff;font-size:12px;font-weight:800;
            display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
  .cd-op-txt{display:flex;flex-direction:column;min-width:0;}
  .cd-op-s{font-size:11.5px;color:var(--muted);}
  .cd-sujeto-n{font-size:17px;font-weight:800;}
  .cd-otro{margin-left:auto;background:none;border:1px solid var(--border);color:var(--muted);border-radius:7px;
           padding:5px 9px;font-family:inherit;font-size:11.5px;font-weight:700;cursor:pointer;flex:0 0 auto;}
  .cd-otro:hover{border-color:var(--azul);color:var(--azul);}
  /* La fórmula en lugar de un toggle Promedio/Sumatoria: con un agregador por
     bloque, un botón único ya no puede decir cómo se mide este lado. */
  .cd-formula{margin:0 0 10px;font-size:12px;color:var(--azul);font-weight:700;line-height:1.45;}
  .cd-anio{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted);font-weight:700;}
  .cd-anio select{flex:1;font-family:inherit;font-size:13px;padding:7px 8px;border:1px solid var(--border);
                  border-radius:8px;background:#fff;color:var(--text);cursor:pointer;}
  .cd-anios{margin:0;font-size:12px;color:var(--muted);font-weight:700;}
  .cd-pie{margin:-6px 0 18px;}
  .cd-pie[hidden]{display:none;}
  .cd-falta{margin:0;font-size:13px;color:var(--muted);}
  /* to-do 23: chips de ejercicio (las clases .fin-year* de Finanzas) y "Cómo se junta". */
  .cd-chips .fin-years-lbl{display:block;margin-bottom:6px;}
  .cd-agg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;}
  .cd-agg .segmented button{padding:5px 11px;font-size:12.5px;}
  .cd-tag-presu{display:inline-block;font-size:10.5px;font-weight:600;color:#8a6d00;border:1px dashed #d9c27a;border-radius:4px;padding:0 4px;background:#fdf8e7;}
  /* to-do 23, paso 3: la barra de Comparar (formato fijo + valores) y su franja verde. */
  .cd-controles{margin-bottom:16px;}
  .cd-controles[hidden]{display:none;}
  .cd-ctl{display:inline-flex;align-items:center;gap:8px;}
  .cd-fmt-fijo{font-size:13px;color:var(--muted);border:1px solid var(--border);border-radius:8px;padding:7px 12px;background:#fff;}
  .cd-fmt-fijo b{color:var(--text);font-weight:600;}
  .cd-real-note{margin:-6px 0 18px;}
  /* Comparar siempre muestra USD: el USD / ARS del header no hace nada ahí, así que no se muestra. */
  body[data-section="vs"] #currencyToggleGlobal{display:none;}

  /* El resultado: una barra por lado en cada indicador, a escala DENTRO de su
     indicador y no entre indicadores (misma regla que la comparación de hoy). */
  .cd-resultado{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px 22px;margin-bottom:26px;}
  .cd-resultado[hidden]{display:none;}
  .cd-res-sub{color:var(--muted);font-size:13px;margin:0 0 16px;}
  .cd-cargando{color:var(--muted);font-size:13.5px;margin:0;}
  /* to-do 23, paso 5: la tabla de Comparar usa la de Finanzas (.pl-multi) más esto. */
  .cd-pl{margin-top:6px;}
  .cd-falla{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:9px 12px;border-radius:8px;background:#fdf1ef;border:1px solid #f0c9c2;color:#8a2a1f;font-size:13px;}
  .cd-falla button{border:1px solid #d79a90;background:#fff;color:#8a2a1f;border-radius:6px;padding:4px 10px;font:inherit;font-size:12.5px;cursor:pointer;}
  /* to-do 23, paso 6: avisos de cada lado en su card, fuentes por ejercicio. */
  .cd-avisos-lado:empty{display:none;}
  .cd-avisos-lado{margin-top:10px;border-top:1px dashed var(--border);padding-top:8px;}
  .cd-avisos-lado p{margin:3px 0;font-size:12px;color:var(--muted);line-height:1.4;}
  .cd-fuentes{margin-top:22px;padding-top:16px;border-top:1px solid var(--border);}
  .cd-fuentes h3{margin:0 0 2px;font-size:17px;}
  .cd-fuentes .fin-src-year summary{display:flex;align-items:center;gap:2px;}
  .cd-src-row{font-size:13px;margin:5px 0 0 14px;line-height:1.45;}
  .cd-src-more{display:inline-block;font-size:13.5px;margin:10px 0 0;}
  .cd-cnt-inline{color:var(--muted);}
  .cd-tw{overflow-x:auto;border-top:1px solid var(--border);}
  .cd-tabla-n th .cd-letra.chica{margin-right:6px;}
  .cd-tabla-n th{color:var(--text);text-transform:none;letter-spacing:0;font-size:13px;}
  .cd-tabla-n th:first-child{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.03em;}
  /* El nombre de cada lado se parte en varias líneas: con nowrap, "Primera División 2020 + 2024" empujaba
     las columnas de números fuera de la pantalla de un teléfono. */
  .cd-tabla-n thead th{white-space:normal;min-width:84px;}
  @media (max-width:640px){
    .cd-tabla-n th:first-child,.cd-tabla-n td:first-child{min-width:112px;}
    .cd-tabla-n th,.cd-tabla-n td{padding:7px 6px;}
    .cd-tabla-n thead th{font-size:12px;}
  }
  .cd-tabla-n .cd-rat{color:var(--muted);font-size:12.5px;}
  .cd-tabla-n th.cd-rat{font-size:12px;}
  .cd-cnt{display:block;font-size:10.5px;color:var(--muted);font-style:normal;font-weight:400;}
  .cd-q{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;border:1px solid #c9c9c4;
        color:var(--muted);font-size:10px;font-weight:700;margin-left:5px;cursor:help;vertical-align:1px;text-transform:none;letter-spacing:0;}
  /* ======================================================================
     PESTAÑA LIGAS. Mismo lenguaje que las tarjetas de Inicio (.vid-card). El
     estado frío es un buscador, las regiones como filtro y una fila por país;
     la liga elegida, el ranking con barras horizontales a la izquierda y la
     composición y el simulador a la derecha (una sola columna en el teléfono).
     ====================================================================== */
  .liga-vacio{color:var(--muted);font-size:13.5px;margin:0 0 18px;}
  .liga-volver{display:inline-flex;align-items:center;gap:4px;min-height:36px;background:none;border:none;
    padding:0;margin:0 0 8px;font:inherit;font-size:14px;font-weight:700;color:var(--azul);cursor:pointer;}
  .liga-volver:hover{text-decoration:underline;}
  .lg-flag{font-size:1.15em;line-height:1;margin-right:8px;}
  /* Estado frío */
  .lg-frio{display:flex;flex-direction:column;gap:20px;}
  .lg-frio-sim{background:#fff8ea;border:1px solid #e3c07a;border-radius:14px;padding:14px 16px;color:#5c4300;font-weight:600;}
  .lg-frio-sim p{margin:0;}
  .lg-frio-barra{display:flex;flex-wrap:wrap;align-items:center;gap:12px;}
  .lg-buscar{flex:1 1 320px;display:flex;align-items:center;gap:10px;height:48px;padding:0 14px;background:#fff;
    border:2px solid var(--azul);border-radius:10px;color:var(--azul);box-sizing:border-box;}
  .lg-buscar input{flex:1 1 auto;min-width:0;border:0;outline:none;font:inherit;font-size:16px;background:transparent;color:var(--text);}
  .lg-buscar:focus-within{box-shadow:0 0 0 3px rgba(10,43,92,.15);}
  .lg-regiones,.lg-anios-p{display:flex;flex-wrap:wrap;gap:6px;}
  .lg-region{height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--border);background:#fff;color:var(--azul);
    font:inherit;font-size:14px;font-weight:600;cursor:pointer;}
  .lg-region:hover{border-color:var(--azul);}
  .lg-region.activa{background:var(--azul);border-color:var(--azul);color:#fff;}
  .lg-region-n{opacity:.7;font-weight:400;}
  .lg-frio-lista{display:flex;flex-direction:column;gap:20px;}
  .lg-reg{display:flex;flex-direction:column;gap:10px;}
  .lg-reg-h{margin:0;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
  .lg-reg-card{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;}
  .lg-pais{display:grid;grid-template-columns:minmax(140px,200px) minmax(0,1fr);gap:12px;align-items:center;padding:12px 20px;
    border-top:1px solid #f0f0ee;}
  .lg-pais:first-child{border-top:0;}
  .lg-pais-n{display:flex;align-items:center;font-weight:700;font-size:15px;}
  .lg-pais-ligas{display:flex;flex-wrap:wrap;gap:8px;}
  .lg-liga{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;
    border:1px solid var(--border);background:#fafaf8;font:inherit;color:var(--text);cursor:pointer;text-align:left;}
  .lg-liga:hover{border-color:var(--azul);background:#f6f9ff;}
  .lg-liga-n{font-weight:700;font-size:14px;}
  .lg-frio-nada{color:var(--muted);margin:0;}
  .lg-sindatos{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 20px;}
  .lg-sindatos summary{cursor:pointer;font-weight:700;font-size:14px;color:#45474d;}
  .lg-sindatos p{margin:10px 0 0;font-size:13.5px;color:var(--muted);line-height:1.6;}
  @media (max-width:600px){ .lg-pais{grid-template-columns:1fr;gap:8px;padding:12px 16px;} }
  /* Finanzas: quién auditó estos números (js/auditoria.js) */
  .aud-lista{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;}
  .aud-fila{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px 16px;padding:12px 0;border-top:1px solid #f0f0ee;}
  .aud-fila:first-child{border-top:0;}
  .aud-anio{flex:0 0 72px;font-weight:800;color:var(--azul);font-size:15px;}
  .aud-quien{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;gap:2px;}
  .aud-nombre{font-size:15px;font-weight:700;}
  .aud-gris{color:var(--muted);}
  .aud-sub{font-size:12.5px;color:var(--muted);}
  .aud-que{flex:2 1 300px;min-width:0;display:flex;flex-direction:column;gap:6px;}
  .aud-chips{display:flex;flex-wrap:wrap;gap:6px;}
  .aud-chip{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;font-size:13px;font-weight:700;}
  .aud-ok{background:#e3f1e7;color:#1b5e33;}
  .aud-salv{background:#fde9c8;color:#8a4b00;}
  .aud-mal{background:#fbe1de;color:#9b2c1f;}
  .aud-gris.aud-chip,.aud-chip.aud-gris{background:#eef0f3;color:#45474d;}
  .aud-nosabe{background:#f4f4f2;color:var(--muted);font-weight:600;}
  .aud-x{font-size:13px;color:#45474d;line-height:1.45;}
  .aud-link{flex:0 0 auto;font-size:13px;}
  .aud-ver{font-size:13px;}
  .aud-liga{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;}
  .aud-liga-txt{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:3px;}
  .aud-liga-txt h2{margin:0;font-size:15px;}
  .aud-liga-txt p{margin:0;font-size:14px;color:#45474d;line-height:1.5;}
  .aud-liga-der{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;}
    /* La página de un sponsor o una marca (js/sponsor.js) */
  #mainNav button[data-section="sponsor"]{display:none;}
  .spo-view{display:flex;flex-direction:column;gap:16px;}
  .spo-head{display:flex;flex-direction:column;gap:6px;}
  .spo-head h1{margin:0;font-size:34px;letter-spacing:-.02em;color:var(--azul);}
  .spo-rol{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
  .spo-resumen{margin:0;font-size:14px;color:var(--muted);}
  .spo-card{display:flex;flex-direction:column;gap:12px;}
  .spo-card h2{margin:0;font-size:18px;}
  .spo-hoy-grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:8px;}
  .spo-hoy{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 12px;border-radius:10px;border:1px solid var(--border);
    background:#fff;text-decoration:none;color:var(--text);}
  a.spo-hoy:hover{border-color:var(--azul);}
  .spo-hoy.spo-gris{background:#f4f4f2;color:#8a8a8a;}
  .spo-hoy-txt{display:flex;flex-direction:column;min-width:0;}
  .spo-hoy-n{font-size:14.5px;font-weight:700;}
  .spo-hoy-l{font-size:12.5px;color:var(--muted);}
  .spo-flag{font-size:16px;line-height:1;margin-right:6px;}
  .spo-nota{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5;}
  .spo-tabla{border-collapse:collapse;font-size:14px;}
  .spo-tabla th,.spo-tabla td{text-transform:none;letter-spacing:normal;}
  .spo-tabla thead th{padding:6px 2px;font-size:12px;color:var(--muted);font-weight:700;text-align:center;}
  .spo-tabla thead th:first-child{text-align:left;padding-right:12px;}
  .spo-tabla tbody th{text-align:left;padding:6px 12px 6px 0;font-weight:600;white-space:nowrap;}
  .spo-tabla tbody th a{color:var(--text);text-decoration:none;}
  .spo-tabla tbody th a:hover{text-decoration:underline;}
  .spo-tabla th.spo-gris{color:#8a8a8a;}
  .spo-tabla td{padding:3px 2px;min-width:34px;}
  .spo-c{display:block;height:18px;border-radius:4px;background:#f4f4f2;}
  .spo-c.on{background:#e8501f;}
  .spo-c.on.m{background:#4f86d9;}
  .spo-c.gris{background:#c9ced8;}
  /* Finanzas: estadio y camiseta (js/contexto.js) */
  .ctx-tabla{width:100%;min-width:480px;border-collapse:collapse;font-size:14px;}
  .ctx-tabla th,.ctx-tabla td{text-align:left;padding:10px;border-bottom:1px solid #f0f0ee;vertical-align:top;text-transform:none;letter-spacing:normal;}
  .ctx-tabla thead th{font-size:14px;font-weight:800;color:var(--azul);border-bottom:1px solid var(--border);}
  .ctx-tabla tbody th{font-weight:600;color:#45474d;white-space:nowrap;padding-left:0;}
  .ctx-nada{color:#9a9a9a;}
  .ctx-tabla tr:last-child th,.ctx-tabla tr:last-child td{border-bottom:0;font-size:12.5px;}
  .ctx-fuente-l{color:var(--muted);}
  /* Finanzas: citar y descargar (js/citar.js) */
  .citar-card{display:flex;flex-direction:column;gap:16px;}
  .citar-grilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:20px;}
  .citar-bloque{display:flex;flex-direction:column;gap:10px;min-width:0;}
  .citar-bloque h3{margin:0;font-size:15px;}
  .citar-texto{margin:0;padding:14px 16px;background:#f4f6fa;border-radius:10px;font-size:14px;line-height:1.55;overflow-wrap:anywhere;}
  .citar-botones{display:flex;flex-wrap:wrap;gap:8px;}
  .citar-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--azul);
    background:var(--azul);color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;}
  .citar-btn.citar-sec{background:#fff;color:var(--azul);border-color:#c9ced8;}
  .citar-csv-que{margin:0;font-size:14px;color:#45474d;line-height:1.5;}
  .citar-nota{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5;}
  .citar-metodo{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:700;}
    /* Ligas: estimados en la tabla de ingresos */
  .lg-est-tag{flex:0 0 auto;white-space:nowrap;color:#8a4b00;font-weight:600;}
  .lg-fila.estimada .lg-club{flex-wrap:wrap;row-gap:0;}
  .lg-fila.estimada .lg-est-tag{padding-left:2px;}
  .lg-fila.estimada .vid-val{color:#8a4b00;}
  span.lg-club{cursor:default;}
  .lg-est-nota{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted);}
  /* Ligas: la liga en total, por categoría */
  .lg-cons{display:flex;flex-direction:column;gap:14px;}
  .lg-cons-txt{display:flex;flex-direction:column;gap:4px;}
  .lg-cons-total{display:flex;align-items:baseline;gap:8px;}
  .lg-cons-total-l{font-size:13px;color:var(--muted);}
  .lg-cons-total strong{font-size:26px;font-weight:800;color:var(--azul);font-variant-numeric:tabular-nums;}
  .lg-cons-barra{display:flex;height:22px;border-radius:6px;overflow:hidden;background:#eef0f3;}
  .lg-cons-barra > span{display:block;height:100%;}
  .lg-cons-filas{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:0 28px;}
  .lg-cons-fila{display:grid;grid-template-columns:12px minmax(0,1fr) auto 52px;align-items:center;gap:8px;padding:6px 0;
    border-bottom:1px solid #f0f0ee;font-size:14px;font-variant-numeric:tabular-nums;}
  .lg-cons-sw{width:12px;height:12px;border-radius:3px;}
  .lg-cons-v{font-weight:700;white-space:nowrap;}
  .lg-cons-p{text-align:right;color:var(--muted);font-size:13px;}
  .lg-cons-fila.estimada .lg-cons-v,.lg-cons-fila.estimada .lg-cons-n{color:#8a4b00;}
  /* Una liga elegida */
  .lg-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px;}
  .lg-h{margin:0;font-size:32px;letter-spacing:-.02em;color:var(--azul);display:flex;align-items:center;}
  .lg-sub{margin:6px 0 0;font-size:14px;color:var(--muted);line-height:1.5;}
  .lg-anios{display:flex;flex-direction:column;gap:6px;}
  .lg-anios-l{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
  .lg-grilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr));gap:16px;align-items:start;}
  .lg-col{display:flex;flex-direction:column;gap:16px;min-width:0;}
  .lg-card-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 12px;}
  .lg-card-h{margin:0;font-size:18px;}
  .lg-card-sub{margin:0;font-size:13px;color:var(--muted);line-height:1.5;}
  .lg-filas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
  .lg-fila{display:grid;grid-template-columns:22px minmax(0,1.3fr) minmax(0,1fr) 92px;align-items:center;gap:10px;font-size:14px;
    font-variant-numeric:tabular-nums;padding:2px 0;}
  .lg-fila.simulada{background:#fff8ea;border-radius:8px;}
  .lg-fila-nom{display:flex;flex-direction:column;min-width:0;}
  .lg-club{display:flex;align-items:center;gap:8px;min-width:0;padding:0;border:0;background:none;font:inherit;color:var(--text);
    cursor:pointer;text-align:left;}
  .lg-club:hover .vid-nom-t{text-decoration:underline;}
  .lg-doc{font-size:11.5px;margin-left:18px;color:var(--muted);}
  .lg-total{font-size:15px;color:var(--text);font-variant-numeric:tabular-nums;}
  @media (max-width:560px){
    .lg-fila{grid-template-columns:20px minmax(0,1fr) auto;row-gap:4px;}
    .lg-fila .vid-val{grid-row:1;grid-column:3;}
    .lg-fila .vid-barra{grid-row:2;grid-column:2 / 4;height:6px;}
  }
  /* La composición: una barra apilada al 100% por club. */
  .lg-ley{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:6px 14px;font-size:12.5px;color:#45474d;}
  .lg-ley-it{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
  .lg-ley-sw{width:10px;height:10px;border-radius:2px;}
  .lg-mix-filas{display:flex;flex-direction:column;gap:8px;}
  .lg-mix-fila{display:grid;grid-template-columns:minmax(0,130px) minmax(0,1fr);gap:4px 10px;align-items:center;font-size:13px;}
  .lg-mix-fila.simulada{background:#fff8ea;border-radius:6px;}
  .lg-mix-n{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .lg-mix-barra{display:flex;height:14px;border-radius:4px;overflow:hidden;background:#eef0f3;}
  .lg-mix-barra > span{display:block;height:100%;}
  .lg-mix-nota{grid-column:2;font-size:11.5px;color:var(--muted);}
  .lg-informes{margin-top:20px;display:flex;flex-direction:column;gap:6px;}
  .lg-inf-grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-top:8px;}
  .lg-inf{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:6px;}
  .lg-inf p{margin:0;font-size:13.5px;line-height:1.5;color:var(--muted);}
  .lg-inf-top{display:flex;align-items:center;gap:8px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
  .lg-inf-borrador{padding:1px 8px;border-radius:999px;background:#fff8ea;border:1px solid #e3c07a;color:#5c4300;letter-spacing:0;text-transform:none;font-weight:600;}
  .lg-inf-t{margin:0;font-size:16px;line-height:1.3;color:var(--azul);}
  .lg-inf-ed{font-weight:600;color:var(--text);}
  p.lg-inf-frase{color:var(--text);}
  .lg-inf p.lg-inf-cifra{margin-top:4px;padding:10px 12px;border-radius:10px;background:#f4f6fa;display:flex;flex-direction:column;gap:2px;color:var(--text);}
  .lg-inf-cifra strong{font-size:14px;line-height:1.4;}
  .lg-inf-fuente{font-size:12px;color:var(--muted);}
  .lg-inf-link{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--azul);}
  .lg-avisos{margin-top:16px;}
  .lg-avisos p{margin:0;font-size:13px;color:var(--muted);line-height:1.6;}
  .lg-avisos p.lg-cita-lista{margin-top:6px;}
  /* TO-DO 83: "¿cómo le iría este/estos club(es) en otra liga?". `.liga-sim-panel`
     es el contenedor neutro (siempre visible, aunque no haya nada simulado — ahí
     vive el buscador de "sumar un club"); `.liga-sim-activa` es la caja ámbar de
     adentro, SOLO cuando hay algo simulado — mismo tono que ya usa
     `.liga-doc.presu`/`.liga-doc.nooficial` para "esto no es un dato normal de
     la liga". */
  .liga-sim-activa{background:#fff8ea;border:1px solid #e3c07a;border-radius:10px;
    padding:14px 16px;margin-top:12px;}
  .liga-sim-linea{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:6px;}
  .liga-sim-texto{margin:0;font-size:14.5px;font-weight:600;color:#5c4300;line-height:1.5;}
  .liga-sim-chico{margin:2px 0 10px;font-size:12px;color:#8a6c1a;line-height:1.5;}
  .liga-sim-quitar, .liga-sim-cancelar, .liga-sim-quitar-uno{background:none;border:1px solid #c9a34d;border-radius:6px;
    padding:5px 10px;font:inherit;font-size:12.5px;font-weight:600;color:#5c4300;cursor:pointer;}
  .liga-sim-quitar:hover, .liga-sim-cancelar:hover, .liga-sim-quitar-uno:hover{background:#f3e2b8;}
  .liga-sim-cancelar{margin-top:8px;}
  .liga-sim-quitar-uno{padding:2px 7px;flex-shrink:0;}
  /* El dropdown de "probar en otra liga" y "Quitar simulación", en una misma fila. */
  .liga-sim-fila{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
  .liga-sim-liga{display:flex;align-items:center;gap:7px;}
  .liga-sim-liga-l{font-size:12px;color:#8a6c1a;text-transform:uppercase;letter-spacing:.04em;font-weight:700;}
  .liga-sim-liga select{font:inherit;font-size:13px;padding:6px 9px;border:1px solid #c9a34d;border-radius:7px;background:#fff;max-width:260px;}
  /* EL BUSCADOR DE "SUMAR UN CLUB" (segunda parte del to-do 83): caja blanca
     normal, no ámbar — es una acción disponible siempre, no un aviso. */
  .liga-sim-buscador{position:relative;}
  .liga-sim-input{width:100%;box-sizing:border-box;font:inherit;font-size:13.5px;padding:9px 12px;
    border:1px solid var(--border);border-radius:8px;background:#fff;}
  .liga-sim-input:focus{outline:none;border-color:var(--azul);}
  .liga-sim-resultados:empty{display:none;}
  .liga-sim-resultados{margin-top:4px;border:1px solid var(--border);border-radius:8px;overflow:hidden;
    background:#fff;box-shadow:0 4px 10px rgba(0,0,0,.06);}
  .liga-sim-resultado{display:block;width:100%;text-align:left;background:none;border:none;
    padding:8px 12px;font:inherit;font-size:13.5px;cursor:pointer;border-bottom:1px solid var(--border);}
  .liga-sim-resultado:last-child{border-bottom:none;}
  .liga-sim-resultado:hover{background:#f6f9ff;}
  /* "Sumar toda una liga" — mismo botón, pero se distingue del de un club
     suelto (fondo levemente distinto, negrita) para que no se confunda con un
     club de nombre parecido. */
  .liga-sim-resultado-liga{background:#f8f5ff;font-weight:600;}
  .liga-sim-resultado-liga:hover{background:#efe8ff;}
  .liga-sim-sinresultados{margin:0;padding:8px 12px;font-size:12.5px;color:var(--muted);}
  /* El dropdown de año INLINE, adentro de la frase de cada club simulado
     ("Boca Juniors (▾2024/2025): con..."). Chico, no rompe el renglón. */
  .liga-sim-anio-club{font:inherit;font-size:13px;font-weight:600;padding:1px 4px;
    border:1px solid #c9a34d;border-radius:5px;background:#fff;color:#5c4300;}
  /* La fila/bloque insertado, en la tabla y en el desglose: mismo tono ámbar del
     callout, para que sea obvio de un vistazo que no es un club real de la liga. */
  tr.liga-fila-simulada{background:#fff8ea;}
  .liga-desglose-club.liga-fila-simulada{background:#fff8ea;border-radius:8px;padding-left:10px;padding-right:10px;}
  .liga-sim-badge{color:#8a5a00;font-size:11px;font-weight:700;margin-left:6px;}
  @media (max-width:720px){
    .liga-chart-box{height:300px;}
    .liga-head-top{align-items:flex-start;}
  }
  .cd-avisos{margin-top:14px;}
  .cd-avisos p{color:var(--muted);font-size:12px;line-height:1.5;margin:0 0 5px;}

  @media (max-width:900px){
    .sel-modal{padding:12px 8px;}
    /* Los dos cards se apilan. */
    .cd-wrap{grid-template-columns:minmax(0,1fr);}
  }

  /* ===== Estructura del club (tarjeta #finEstructura, js/finanzas-estructura.js) ===== */
  .estr-frase{font-size:15px;line-height:1.55;max-width:820px;margin:4px 0 16px;}
  .estr-h3{margin:0 0 8px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
  .estr-verde{color:var(--green);}
  .estr-ambar{color:#8a4b00;margin-top:16px;}
  .estr-cols{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;}
  .estr-col{flex:1 1 360px;min-width:0;}
  .estr-cadena{display:flex;flex-direction:column;gap:18px;}
  .estr-caja{position:relative;border:1px solid var(--border);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;background:#fff;}
  .estr-caja + .estr-caja::before{content:"";position:absolute;left:50%;top:-19px;width:2px;height:18px;background:#c9ced8;}
  .estr-caja.estr-yo{border:2px solid var(--azul);background:#eef1f6;}
  .estr-rol{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);}
  .estr-nombre{font-size:15px;font-weight:700;color:var(--azul);}
  .estr-det{font-size:13px;color:#45474d;line-height:1.45;}
  .estr-ver{font-size:12px;color:var(--muted);}
  .estr-lista{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:12px;}
  .estr-lista li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding:10px 14px;}
  .estr-lista li + li{border-top:1px solid #f0f0ee;}
  .estr-li-txt{display:flex;flex-direction:column;gap:2px;min-width:0;}
  .estr-li-txt .estr-nombre{font-size:14px;color:var(--text);}
  .estr-li-der{font-size:13px;color:#45474d;white-space:nowrap;}
  .estr-duenos{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px;}
  .estr-dueno{min-width:92px;padding:8px 10px;border-radius:10px;border:1px solid var(--border);display:flex;flex-direction:column;gap:2px;font-size:12px;}
  .estr-dueno strong{font-size:13px;color:var(--azul);}
  .estr-dueno.estr-yo{border:2px solid var(--azul);background:#eef1f6;}
  .estr-ing{display:block;margin-top:6px;padding:8px 10px;border-radius:8px;background:#f4f6f9;font-size:13.5px;color:var(--text);line-height:1.45;}
  .estr-nota{margin:18px 0 0;background:#eef1f6;border-radius:12px;padding:12px 16px;font-size:14px;line-height:1.5;color:var(--azul);}
  #finIndice a[hidden]{display:none;}

  /* ===== Grupo multiclub (sección #grupo, js/grupo.js) ===== */
  #mainNav button[data-section="grupo"]{display:none;}
  .grupo-view{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:6px;}
  .grupo-volver{align-self:flex-start;min-height:44px;padding:0 4px;border:0;background:none;color:var(--azul);font:inherit;font-size:14px;font-weight:700;cursor:pointer;}
  .grupo-kicker{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
  .grupo-h1{margin:0;font-size:34px;letter-spacing:-.02em;color:var(--azul);}
  .grupo-sub{margin:0 0 16px;font-size:15px;color:#45474d;line-height:1.6;max-width:820px;}
  .grupo-tabla{width:100%;border-collapse:collapse;font-size:14px;min-width:640px;}
  .grupo-tabla th{text-align:left;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em;padding:8px 10px;border-bottom:1px solid var(--border);}
  .grupo-tabla td{padding:12px 10px;border-bottom:1px solid #f0f0ee;color:#45474d;}
  .grupo-tabla .num{text-align:right;font-weight:700;color:var(--text);}
  .grupo-club{display:flex;align-items:center;gap:10px;font-weight:700;}
  .grupo-sw{width:12px;height:12px;border-radius:3px;flex:0 0 auto;}
  .grupo-sin{color:#9a9a9a;font-weight:400;}
  .grupo-chart{position:relative;height:280px;}
  .grupo-cuantos{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--muted);margin:10px 0 0;}
  .grupo-aviso{margin:14px 0 0;background:#fdf5dc;color:#6b4e00;border-radius:12px;padding:12px 16px;font-size:14px;line-height:1.5;}