/* FondosYA — sistema de diseño "pizarra de cotizaciones"
   Paleta: hueso #FAFAF7 · tinta #101418 · azul dato #12406F · verde #0E8A3E ·
   rojo #C6323B · marcador #FFD23F (acento propio, resalta al líder del día)
   Tipos: Archivo (display) · Public Sans (texto) · IBM Plex Mono (metadata) */
:root{
  --hueso:#FAFAF7; --tinta:#101418; --gris:#5A6472; --linea:#E4E2D8;
  --azul:#12406F; --pos:#0E8A3E; --neg:#C6323B; --marcador:#FFD23F;
  --radio:10px; --wrap:1100px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--hueso);color:var(--tinta);
  font:16px/1.55 "Public Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 18px}
a{color:var(--azul)} img{max-width:100%}
.mono{font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--gris)}
.display{font-family:Archivo,sans-serif;font-weight:900;letter-spacing:-.015em;
  line-height:1.04;margin:.2em 0 .3em;font-size:clamp(1.9rem,5.5vw,3.4rem)}
h2{font-family:Archivo,sans-serif;font-weight:700;font-size:1.25rem;margin:0 0 .7em}
.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.pos{color:var(--pos);font-weight:700}.neg{color:var(--neg);font-weight:700}
.sd{color:var(--gris)}

/* header */
.topbar{background:#fff;border-bottom:2px solid var(--tinta);position:sticky;top:0;z-index:40}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.logo{font-family:Archivo,sans-serif;font-weight:900;font-size:1.35rem;color:var(--tinta);
  text-decoration:none;letter-spacing:-.02em}
.logo span{background:var(--marcador);padding:0 .12em;border-radius:3px}
.topbar nav{display:flex;gap:4px;overflow-x:auto}
.topbar nav a{color:var(--tinta);text-decoration:none;font-weight:600;font-size:.9rem;
  padding:.45em .7em;border-radius:6px;white-space:nowrap}
.topbar nav a:hover,.topbar nav a[aria-current]{background:var(--tinta);color:#fff}

/* hero pizarra */
.hero{padding:2.6rem 0 1.4rem}
.hero .kicker{display:inline-block;background:var(--tinta);color:var(--marcador);
  font-family:"IBM Plex Mono",monospace;font-size:.75rem;letter-spacing:.1em;
  padding:.35em .8em;border-radius:4px;text-transform:uppercase}
.hero p.sub{max-width:640px;color:var(--gris);font-size:1.05rem;margin:.4em 0 0}
.sub{color:var(--gris)}
.miga{margin:1.4rem 0 .2rem}

/* pizarra (ranking hero) */
.pizarra{background:#fff;border:2px solid var(--tinta);border-radius:var(--radio);
  overflow:hidden;box-shadow:5px 5px 0 var(--tinta)}
.pizarra header{display:flex;justify-content:space-between;align-items:baseline;gap:1em;
  padding:.8rem 1rem;border-bottom:2px solid var(--tinta);flex-wrap:wrap}
.pizarra header h2{margin:0}
.pizarra table{width:100%;border-collapse:collapse}
.pizarra td,.pizarra th{padding:.7rem .9rem;border-top:1px solid var(--linea);font-size:.95rem}
.pizarra th{border-top:0;font-family:"IBM Plex Mono",monospace;font-size:.72rem;
  letter-spacing:.05em;text-transform:uppercase;color:var(--gris);text-align:left;font-weight:500}
.pizarra tr.lider{position:relative;background:
  linear-gradient(104deg,transparent 0 2px,var(--marcador) 2px 99%,transparent 99%)}
.pizarra tr.lider td:first-child::before{content:"🏆 ";font-size:.85em}
.pizarra .tna{font-family:Archivo,sans-serif;font-weight:900;font-size:1.35rem}
.rank-pos{color:var(--gris);font-family:"IBM Plex Mono",monospace;width:2ch}

/* chips de marca */
.chip{display:inline-flex;align-items:center;gap:.4em;font-weight:700;font-size:.8rem;
  color:var(--c,#333);border:1.5px solid var(--c,#333);border-radius:999px;
  padding:.12em .7em;text-decoration:none;background:#fff;white-space:nowrap}
.chip::before{content:"";width:.6em;height:.6em;border-radius:50%;background:var(--c,#333)}
.chip img{height:1.05em;width:auto;display:block}
.chip.has-logo::before{display:none}

/* grillas y cards */
.grid{display:grid;gap:16px;margin:1rem 0}
.grid.plataformas{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.grid.ligas{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{background:#fff;border:1.5px solid var(--linea);border-radius:var(--radio);
  padding:1.1rem 1.2rem;margin:1.2rem 0}
.card.plat{margin:0;padding:1rem;border-color:var(--tinta);border-width:1.5px;
  text-decoration:none;color:var(--tinta);display:flex;flex-direction:column;gap:.5em;
  transition:transform .12s}
.card.plat:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--pc,var(--tinta))}
.card.plat .marca{display:flex;align-items:center;gap:.5em;font-family:Archivo,sans-serif;
  font-weight:700;font-size:1.05rem}
.card.plat .marca i{width:.85em;height:.85em;border-radius:3px;background:var(--pc);flex:none}
.card.plat .marca img{height:1.4em;width:auto}
.card.plat .dato{font-family:Archivo,sans-serif;font-weight:900;font-size:1.5rem}
.card.liga{margin:0;border:2px solid var(--tinta)}
.card.liga h3{font-family:Archivo,sans-serif;font-weight:900;margin:0;font-size:1.15rem}
.card.liga .pregunta{color:var(--gris);font-size:.88rem;margin:.15em 0 .8em}
.card.liga table{width:100%;border-collapse:collapse;font-size:.9rem}
.card.liga td{padding:.5em 0;border-top:1px solid var(--linea)}
.card.liga tr.lider td{background:linear-gradient(180deg,transparent 15%,var(--marcador) 15% 88%,transparent 88%)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:1.2rem 0}
.kpi{background:#fff;border:1.5px solid var(--linea);border-radius:var(--radio);padding:.9rem 1rem}
.kpi strong{display:block;font-family:Archivo,sans-serif;font-weight:900;font-size:1.25rem;margin-top:.2em}

/* tablas genéricas */
.tabla{width:100%;border-collapse:collapse;font-size:.93rem}
.tabla th{font-family:"IBM Plex Mono",monospace;font-size:.72rem;text-transform:uppercase;
  letter-spacing:.05em;color:var(--gris);text-align:left;font-weight:500;padding:.5em .6em}
.tabla td{padding:.55em .6em;border-top:1px solid var(--linea)}
.tabla th.sortable{cursor:pointer;user-select:none}
.tabla th.sortable:hover{color:var(--tinta)}
.tabla th.sorted::after{content:" ▼"}

/* simulador */
.simulador{background:var(--tinta);color:#fff;border-radius:var(--radio);padding:1.3rem;margin:1.6rem 0}
.simulador h2{color:var(--marcador)}
.simulador .fila{display:flex;flex-wrap:wrap;gap:.6em;align-items:center;font-size:1.05rem}
.simulador select,.simulador input{font:inherit;padding:.35em .5em;border-radius:6px;
  border:0;background:#fff;color:var(--tinta);font-weight:600;max-width:9.5em}
.simulador .resultado{margin-top:1em;font-family:Archivo,sans-serif;font-size:1.15rem;line-height:1.4}
.simulador .resultado strong{color:var(--marcador);font-size:1.5rem}
.share{display:inline-flex;gap:.5em;margin-top:.9em}
.share a,.btn-sec{display:inline-block;background:#fff;color:var(--tinta);font-weight:700;
  padding:.5em 1em;border-radius:8px;text-decoration:none;border:1.5px solid var(--tinta);font-size:.9rem}
.btn-sec:hover{background:var(--marcador)}

/* gráfico */
.grafico{position:relative;min-height:280px}
.grafico canvas{max-height:380px}
.vacio,.vacio-inline{color:var(--gris);background:repeating-linear-gradient(45deg,#fff,#fff 8px,#f4f2ea 8px,#f4f2ea 16px);
  border:1.5px dashed var(--linea);border-radius:8px;padding:1.2rem;text-align:center}
.aviso{background:#FFF6D6;border:1.5px solid var(--marcador);border-radius:8px;padding:.7rem 1rem;font-size:.92rem}

/* controles */
.controles{display:flex;flex-wrap:wrap;gap:.6em;margin:1rem 0;align-items:center}
.controles select,.controles input[type=search]{font:inherit;padding:.5em .7em;
  border:1.5px solid var(--tinta);border-radius:8px;background:#fff;min-width:0}
.controles input[type=search]{flex:1;min-width:200px}
.ventanas{display:inline-flex;border:1.5px solid var(--tinta);border-radius:8px;overflow:hidden}
.ventanas button{font:inherit;font-weight:700;border:0;background:#fff;padding:.45em .8em;cursor:pointer}
.ventanas button[aria-pressed=true]{background:var(--tinta);color:var(--marcador)}
.seleccion{display:flex;flex-wrap:wrap;gap:.4em;margin:.6em 0}
.seleccion .tag{background:#fff;border:1.5px solid var(--tinta);border-radius:999px;
  padding:.15em .4em .15em .8em;font-size:.85rem;font-weight:600;display:inline-flex;gap:.4em;align-items:center}
.seleccion .tag button{border:0;background:var(--tinta);color:#fff;border-radius:50%;
  width:1.3em;height:1.3em;cursor:pointer;line-height:1}
.sugerencias{position:absolute;background:#fff;border:1.5px solid var(--tinta);border-radius:8px;
  max-height:260px;overflow:auto;z-index:30;width:min(480px,90vw);box-shadow:4px 4px 0 rgba(16,20,24,.15)}
.sugerencias div{padding:.5em .8em;cursor:pointer;font-size:.9rem}
.sugerencias div:hover{background:var(--marcador)}
.rel{position:relative}

/* ads + footer */
.adslot{display:flex;align-items:center;justify-content:center;color:var(--gris);
  border:1.5px dashed var(--linea);border-radius:8px;min-height:90px;margin:1.4rem 0;
  font-family:"IBM Plex Mono",monospace;font-size:.75rem}
.pie{background:var(--tinta);color:#cfd6de;margin-top:3rem;padding:2rem 0}
.pie p{font-size:.85rem;max-width:820px}
.pie .legal{color:#8b95a1;font-size:.78rem}
.pie a{color:var(--marcador)}
.nota{font-size:.8rem;text-transform:none;letter-spacing:0}
.faq-grupo{font-family:Archivo,sans-serif;font-weight:900;font-size:1.05rem;text-transform:uppercase;letter-spacing:.03em;color:var(--gris);margin:2rem 0 .5rem;padding-bottom:.3rem;border-bottom:2px solid var(--linea)}
.faq-grupo:first-of-type{margin-top:1.4rem}
.faq details{background:#fff;border:1.5px solid var(--linea);border-radius:8px;
  padding:.8rem 1rem;margin:.6rem 0}
.faq summary{font-weight:700;cursor:pointer}
.demo-banner{background:var(--marcador);border-bottom:2px solid var(--tinta);
  text-align:center;font-size:.85rem;font-weight:600;padding:.4em .8em}

@media (max-width:640px){
  .pizarra td,.pizarra th{padding:.55rem .5rem;font-size:.85rem}
  .pizarra .tna{font-size:1.1rem}
  .oculta-m{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
:focus-visible{outline:3px solid var(--azul);outline-offset:2px}

/* Fondos propios (Chimpay · Ohana) — destacado sobrio, el liderazgo lo marca el amarillo */
tr.propio td{background:rgba(13,113,185,.06)}
tr.propio td:first-child{box-shadow:inset 3px 0 0 #0d71b9}
tr.lider.propio td{background:transparent}
.chip img{height:1.15em;width:auto;display:block}
.card.plat .marca img{height:1.5em;width:auto;max-width:130px;object-fit:contain}
.card.plat .marca:has(img) i{display:none}
.chip.has-logo{padding:.18em .6em}
abbr[title]{text-decoration:underline dotted;cursor:help}

/* Toggle de ventanas mini (dentro de ligas) */
.liga-head{margin:.2em 0 .8em}
.ventanas.mini{display:inline-flex;border:1.5px solid var(--tinta);border-radius:7px;overflow:hidden}
.ventanas.mini button{font:600 .78rem "Public Sans",sans-serif;border:0;background:#fff;padding:.3em .6em;cursor:pointer;border-right:1px solid var(--linea)}
.ventanas.mini button:last-child{border-right:0}
.ventanas.mini button[aria-pressed=true]{background:var(--tinta);color:var(--marcador)}

/* Letra chica: badge + popover */
.caveat{font:600 .68rem "IBM Plex Mono",monospace;color:#8a6d00;background:#FFF6D6;
  border:1px solid var(--marcador);border-radius:5px;padding:.1em .45em;cursor:pointer;
  white-space:nowrap;vertical-align:middle;transition:background .12s}
.caveat:hover{background:var(--marcador)}
.caveat-pop{display:block;margin:.5em 0 .2em;background:var(--tinta);color:#fff;
  font-size:.82rem;line-height:1.45;padding:.7em .85em;border-radius:8px;max-width:340px;
  box-shadow:4px 4px 0 rgba(16,20,24,.15);animation:pop .12s ease}
@keyframes pop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* Nota editorial de liga (voz experta) */
.nota-editorial{font-size:.86rem;line-height:1.5;color:var(--gris);
  border-top:1.5px solid var(--linea);margin:.9em 0 0;padding-top:.7em}

/* Sub-hero: diferencial de posicionamiento */
.hero-fuentes{max-width:640px;margin:.9rem 0 0;font-size:.78rem;line-height:1.5;
  text-transform:none;letter-spacing:.01em;color:var(--gris)}

/* Cards de plataforma pendientes (sin dato): atenuadas, no compiten */
.grid.plataformas.pend{opacity:.72}
.card.plat.pend{border-style:dashed;border-color:var(--linea)}
.card.plat.pend:hover{opacity:1;transform:none;box-shadow:none;border-color:var(--pc)}

/* Bloque de marca Chimpay (cierre de autoridad) */
.marca-chimpay{background:#0f395c;color:#eaf2fa;border-radius:var(--radio);
  padding:2.4rem 2rem;margin:2.4rem 0 0;text-align:center}
.marca-chimpay .marca-logo{height:38px;width:auto;margin:0 auto .4rem;
  filter:brightness(0) invert(1);opacity:.95}
.marca-chimpay h2{font-family:Archivo,sans-serif;font-weight:900;font-size:clamp(1.3rem,3vw,1.9rem);
  margin:.3em auto .5em;max-width:16ch;line-height:1.15;color:#fff}
.marca-chimpay p{max-width:60ch;margin:0 auto;font-size:.96rem;line-height:1.6;color:#cfdeeb}
.marca-chimpay .marca-links{margin-top:1.2rem;display:flex;gap:1.4rem;justify-content:center;flex-wrap:wrap}
.marca-chimpay .marca-links a{color:var(--marcador);font-weight:700;text-decoration:none}
.marca-chimpay .marca-links a:hover{text-decoration:underline}

/* KPI de track record destacado (ficha de fondos Chimpay) */
.kpi.track{background:#0f395c;border-color:#0f395c}
.kpi.track span.mono{color:#9fc0dc}
.kpi.track strong{color:var(--marcador);font-size:1.5rem}
.kpi.track .nota{display:block;color:#cfdeeb;margin-top:.15em;text-transform:none;letter-spacing:0}

/* Card de plataforma: extra (patrimonio + tope) y caso sin FCI */
.plat-extra{display:block;margin-top:.5em;font-size:.72rem;color:var(--gris)}
.chip-tope{background:#FFF6D6;border:1px solid var(--marcador);border-radius:4px;padding:.05em .35em;color:#8a6d00;cursor:help}
.card.plat.sinfci .dato-sinfci{display:block;font:700 1.05rem "Archivo",sans-serif;color:var(--gris);margin:.2em 0}
.card.plat.sinfci{border-style:dashed}

/* Chip de tope en ligas */
.liga .chip-tope{font-size:.66rem;margin-left:.3em}

/* Sección educativa cuenta remunerada vs FCI */
.explicativo{margin:2.4rem 0 0}
.explicativo h2{font-family:Archivo,sans-serif;font-weight:900}
.grid.dos{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}
.grid.dos h3{font-family:Archivo,sans-serif;font-size:1.05rem;margin:0 0 .4em;color:var(--azul)}
.grid.dos p{font-size:.9rem;line-height:1.55;margin:0}
@media(max-width:640px){.grid.dos{grid-template-columns:1fr}}

/* Módulo Chimpay vs bancos */
.vs-bancos{margin:2.4rem 0 0}
.vs-bancos h2{font-family:Archivo,sans-serif;font-weight:900}
.tabla-bancos{width:100%;border-collapse:collapse;margin-top:1rem;border:2px solid var(--tinta);border-radius:12px;overflow:hidden;background:#fff;box-shadow:3px 3px 0 rgba(16,20,24,.1)}
.tabla-bancos td{padding:.75em 1em;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla-bancos tr:last-child td{border-bottom:0}
.tabla-bancos tr.propio td{background:var(--marcador)}
.tabla-bancos tr.propio td:first-child{box-shadow:inset 4px 0 0 #0d71b9}
.tabla-bancos td.num-30{text-align:right;white-space:nowrap}
.tabla-bancos td.num-30 .nota-col{display:block;font-size:.56rem;text-transform:uppercase;letter-spacing:.04em;color:var(--gris);margin-bottom:.05em}
.tabla-bancos td.num-30 strong{font-size:1.15rem;font-variant-numeric:tabular-nums}
.tabla-bancos a{font-weight:700;color:var(--tinta);text-decoration:none}
.tabla-bancos a:hover{text-decoration:underline}
.banco-tag{display:inline-block;font:600 .66rem "IBM Plex Mono",monospace;background:var(--tinta);color:#fff;padding:.1em .45em;border-radius:4px;vertical-align:middle}

/* Gráfico teaser interactivo */
.teaser-controles{margin:.5rem 0 1rem}
.teaser-vent{margin-bottom:.7rem}
.teaser-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip-fondo{font:600 .76rem "Public Sans",sans-serif;border:1.5px solid var(--linea);
  background:#fff;color:var(--gris);border-radius:16px;padding:.25em .7em;cursor:pointer;transition:all .12s}
.chip-fondo.on{border-color:var(--cc);color:var(--tinta);background:color-mix(in srgb,var(--cc) 8%,#fff)}
.chip-fondo:hover{border-color:var(--cc)}

/* Teaser: fila de controles (ventana + escala) */
.teaser-fila{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;margin-bottom:.7rem}
.teaser-esc{margin-left:auto}
@media(max-width:640px){.teaser-esc{margin-left:0}}

/* Gráfico teaser: más alto para que las series respiren; chips = leyenda */
#chartTeaser{min-height:420px}
.grafico:has(#chartTeaser){height:440px}
.teaser-modo button{font-size:.72rem}

/* ═══ S2: Buscador principal ═══ */
.buscador-home{position:relative;max-width:560px;margin:1.2rem 0 .4rem}
.buscador-home input{width:100%;font:600 1.05rem "Public Sans",sans-serif;padding:.85em 1.1em;
  border:2.5px solid var(--tinta);border-radius:12px;background:#fff;box-shadow:4px 4px 0 rgba(16,20,24,.12)}
.buscador-home input:focus{outline:none;border-color:var(--azul);box-shadow:4px 4px 0 rgba(13,113,185,.25)}
.buscador-resultados{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;
  border:2px solid var(--tinta);border-radius:12px;overflow:hidden;z-index:50;
  box-shadow:6px 6px 0 rgba(16,20,24,.14)}
.b-item{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;
  padding:.65em 1em;border-bottom:1px solid var(--linea);text-decoration:none;color:var(--tinta);font-size:.92rem}
.b-item:last-child{border-bottom:0}
a.b-item:hover{background:#FFF6D6}

/* ═══ S2: Tabs de categoría ═══ */
.cat-tabs{display:flex;gap:0;border:2px solid var(--tinta);border-radius:10px;overflow:hidden;
  margin:1rem 0 1.2rem;max-width:640px}
.cat-tabs button{flex:1;font:700 .9rem "Archivo",sans-serif;padding:.7em .4em;border:0;
  background:#fff;cursor:pointer;border-right:1.5px solid var(--linea);transition:background .12s}
.cat-tabs button:last-child{border-right:0}
.cat-tabs button[aria-pressed=true]{background:var(--tinta);color:var(--marcador)}
@media(max-width:640px){.cat-tabs{flex-wrap:wrap}.cat-tabs button{flex:1 1 45%;font-size:.8rem}}

/* ═══ S2: Tabla principal ═══ */
.tp-vent{margin-bottom:.9rem}
.tp-scroll{overflow-x:auto;border:2px solid var(--tinta);border-radius:12px;background:#fff;
  box-shadow:5px 5px 0 rgba(16,20,24,.1)}
table.tp{width:100%;border-collapse:collapse;font-size:.92rem}
table.tp th{font:600 .68rem "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.05em;
  color:var(--gris);text-align:left;padding:.8em .9em;border-bottom:2px solid var(--tinta)}
table.tp th.num{text-align:right}
table.tp td{padding:.7em .9em;border-bottom:1px solid var(--linea);vertical-align:middle}
table.tp tr:last-child td{border-bottom:0}
table.tp .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
table.tp .metrica{font-size:1.05rem}
table.tp tr.lider td{background:var(--marcador)}
table.tp tr.propio td{background:rgba(13,113,185,.07)}
table.tp tr.propio td:first-child{box-shadow:inset 3px 0 0 #0d71b9}
table.tp tr.lider.propio td{background:var(--marcador)}

/* ── v3: fichas minimalistas — origen del dato y CTA a CAFCI (patch30) ── */
.rend-v td,.rend-v th{padding:.55em .7em}
.origen-tag{font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.03em;
  text-transform:uppercase;white-space:nowrap;color:var(--gris)}
.origen-tag.ok{color:var(--azul);font-weight:600}
.origen-tag.comb{color:#8A5A00;font-weight:600}
.origen-tag.est{color:#6B5CA5}
.cta-cafci{margin:1.2em 0 .3em}
.btn-cafci{display:inline-block;font-family:Archivo,sans-serif;font-weight:700;
  background:#fff;color:var(--tinta);border:2px solid var(--tinta);border-radius:8px;
  padding:.6em 1.1em;text-decoration:none;box-shadow:3px 3px 0 var(--marcador)}
.btn-cafci:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--marcador)}

/* ═══════════════════════════════════════════════════════════════════════
   S3 · Tabla compacta v3.1 — 6 columnas, sin scroll, apta captura.
   Modal "Fuente y cálculo" + mobile cards con todo visible. (patch34)
   ═══════════════════════════════════════════════════════════════════════ */

/* Selector acumulado / TNA */
.modo-metrica{display:flex;align-items:center;gap:.5rem;margin:.2rem 0 .9rem;flex-wrap:wrap}
.modo-metrica button{font:600 .8rem "Public Sans",sans-serif;padding:.38em .85em;
  border:1.5px solid var(--tinta);background:#fff;color:var(--tinta);border-radius:7px;cursor:pointer}
.modo-metrica button[aria-pressed=true]{background:var(--tinta);color:#fff}

/* Tabla desktop compacta */
.tp-scroll{border:2px solid var(--tinta);border-radius:12px;background:#fff;overflow:hidden;
  box-shadow:5px 5px 0 rgba(16,20,24,.1)}
table.tp.v31{width:100%;border-collapse:collapse;font-size:.95rem;table-layout:fixed}
table.tp.v31 th{font:600 .66rem "IBM Plex Mono",monospace;text-transform:uppercase;
  letter-spacing:.04em;color:var(--gris);padding:.7em .5em;border-bottom:2px solid var(--tinta);
  text-align:right;white-space:nowrap}
table.tp.v31 th.th-prod{text-align:left;width:auto}
table.tp.v31 th.th-marca{text-align:left;width:6.2rem}
table.tp.v31 th.th-src{text-align:center;width:4.4rem}
table.tp.v31 th.num{width:4.1rem}
table.tp.v31 th.th-fc{width:2rem}
table.tp.v31 th.sortable{cursor:pointer;user-select:none}
table.tp.v31 th.sortable:hover{color:var(--tinta)}
table.tp.v31 th.sorted{color:var(--tinta);background:rgba(255,210,63,.3)}
table.tp.v31 th .arr{margin-left:1px}
table.tp.v31 td{padding:.62em .5em;border-bottom:1px solid var(--linea);vertical-align:middle}
table.tp.v31 tr:last-child td{border-bottom:0}
table.tp.v31 td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;
  font-size:1rem;font-weight:600}
table.tp.v31 td.col-sort{background:rgba(255,210,63,.1)}
table.tp.v31 tr.lider td{background:var(--marcador)}
table.tp.v31 tr.lider td.col-sort{background:transparent}
table.tp.v31 tr.propio td{background:rgba(13,113,185,.07)}
table.tp.v31 tr.propio td:first-child{box-shadow:inset 3px 0 0 #0d71b9}
table.tp.v31 tr.lider.propio td{background:var(--marcador)}

/* Producto */
table.tp.v31 td.prod{white-space:normal;line-height:1.25}
table.tp.v31 td.prod a{font-weight:700;color:var(--tinta);text-decoration:none}
table.tp.v31 td.prod a:hover{text-decoration:underline}
table.tp.v31 td.src{text-align:center}
.prod-badge{margin-top:.28em}

/* Columna Marca (logo grande, aprovecha el espacio antes de Fuente) */
table.tp.v31 td.marca-col{white-space:normal}
.marca-col .plat-marca{display:inline-flex;align-items:center;font:600 .74rem "Public Sans",sans-serif;
  color:var(--gris);gap:.35em;line-height:1}
.marca-col .plat-marca::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c,#333);flex:none}
.marca-col .plat-marca.has-logo::before{display:none}
.marca-col .plat-marca img{height:22px;width:auto;max-width:100px;display:block}
.marca-col .via{display:block;font-size:.64rem;color:var(--gris);text-transform:none;letter-spacing:0;margin-top:.15em}
.via{font-size:.66rem;color:var(--gris);text-transform:none;letter-spacing:0}
.banco-tag{display:inline-block;font:600 .62rem "IBM Plex Mono",monospace;text-transform:uppercase;
  background:var(--tinta);color:#fff;padding:.16em .45em;border-radius:4px;letter-spacing:.02em}

/* Marca genérica (fallback para mobile/otros usos) */
.plat-marca{display:inline-flex;align-items:center;font:600 .7rem "Public Sans",sans-serif;
  color:var(--gris);gap:.3em;line-height:1}
.plat-marca::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c,#333);flex:none}
.plat-marca.has-logo::before{display:none}
.plat-marca img{height:16px;width:auto;max-width:78px;display:block}

/* Badge Ohana/Chimpay mini */
.bdg-ch.mini{display:inline-block;font:600 .56rem "IBM Plex Mono",monospace;letter-spacing:.02em;
  text-transform:uppercase;background:var(--tinta);color:var(--marcador);padding:.14em .42em;
  border-radius:4px;line-height:1.2}

/* Tag fuente */
.src-tag{display:inline-block;font:600 .6rem "IBM Plex Mono",monospace;letter-spacing:.04em;
  padding:.18em .45em;border-radius:5px;text-transform:uppercase}
.src-tag.cafci{background:#E7EEF6;color:var(--azul)}
.src-tag.plat{background:#F0EEE4;color:var(--gris)}

/* Ícono Fuente y cálculo */
.ico-fc{background:none;border:0;color:var(--azul);font-size:1.15rem;cursor:pointer;
  line-height:1;padding:.1em .2em}
.ico-fc:hover{color:var(--tinta)}
.ico-fc.lin{font:600 .74rem "Public Sans",sans-serif;color:var(--azul);margin-top:.5em}

/* Modal Fuente y cálculo */
.modal-fc-bg{position:fixed;inset:0;background:rgba(16,20,24,.55);z-index:100;
  display:flex;align-items:flex-start;justify-content:center;padding:5vh 4vw;overflow-y:auto}
.modal-fc{background:var(--hueso);border:2px solid var(--tinta);border-radius:14px;
  max-width:560px;width:100%;padding:1.6rem 1.7rem 1.9rem;position:relative;
  box-shadow:8px 8px 0 rgba(16,20,24,.2)}
.modal-fc h3{font-family:Archivo,sans-serif;font-size:1.3rem;margin:0 .8em .1em 0;line-height:1.15}
.modal-fc h4{font-family:Archivo,sans-serif;font-size:.95rem;margin:1.2em 0 .5em}
.modal-sub{margin:.1em 0 1em}
.modal-x{position:absolute;top:.7rem;right:.9rem;background:none;border:0;font-size:1.7rem;
  line-height:1;cursor:pointer;color:var(--gris)}
.modal-x:hover{color:var(--tinta)}
.modal-meta{display:grid;grid-template-columns:1fr 1fr;gap:.7em 1.2em;margin:0 0 .5em}
.modal-meta>div{display:flex;flex-direction:column}
.modal-meta dt{font:600 .64rem "IBM Plex Mono",monospace;text-transform:uppercase;
  letter-spacing:.04em;color:var(--gris)}
.modal-meta dd{margin:.1em 0 0;font-weight:600}
.modal-tabla{width:100%;font-size:.88rem}
.modal-tabla th{font:600 .64rem "IBM Plex Mono",monospace;text-transform:uppercase;
  color:var(--gris);text-align:left;padding:.4em .5em;border-bottom:1.5px solid var(--tinta)}
.modal-tabla td{padding:.42em .5em;border-bottom:1px solid var(--linea)}
.modal-formula{background:#fff;border:1px solid var(--linea);border-radius:8px;
  padding:.7em .9em;margin:.9em 0 0;font-size:.72rem;line-height:1.5;color:var(--tinta);
  text-transform:none;letter-spacing:0}
.modal-nota{font-size:.82rem;color:var(--gris);margin:.8em 0 0;line-height:1.5}
.modal-cta{margin:1.1em 0 0}
.origen-tag{font:600 .64rem "IBM Plex Mono",monospace;letter-spacing:.03em;
  text-transform:uppercase;white-space:nowrap;color:var(--gris)}
.origen-tag.ok{color:var(--azul)}
.origen-tag.comb{color:#8A5A00}
.origen-tag.est{color:#6B5CA5}

/* ── Mobile: filas-ranking compactas (densas, muchas por pantalla) ── */
.tp-cards{display:none}
@media(max-width:640px){
  .tp-scroll{display:none}
  .tp-cards{display:block;border:2px solid var(--tinta);border-radius:12px;background:#fff;
    overflow:hidden;box-shadow:3px 3px 0 rgba(16,20,24,.1)}
  .cards-head{display:flex;justify-content:space-between;padding:.5em .8em;
    font-size:.6rem;text-transform:uppercase;letter-spacing:.05em;color:var(--gris);
    border-bottom:2px solid var(--tinta);background:var(--hueso)}
  .frow{display:flex;align-items:center;justify-content:space-between;gap:.7em;width:100%;
    padding:.6em .8em;border:0;border-bottom:1px solid var(--linea);background:#fff;
    text-align:left;cursor:pointer;font-family:inherit}
  .frow:last-of-type{border-bottom:0}
  .frow.lider{background:var(--marcador)}
  .frow.propio{box-shadow:inset 4px 0 0 #0d71b9}
  .frow.lider.propio{background:var(--marcador)}
  .frow-id{display:flex;flex-direction:column;gap:.12em;min-width:0}
  .frow-id b{font-size:.92rem;color:var(--tinta);line-height:1.15}
  .frow-marca{display:flex;align-items:center;flex-wrap:wrap;gap:.3em;font-size:.62rem;color:var(--gris)}
  .frow-marca .plat-marca img{height:13px;max-width:60px}
  .frow-marca .plat-marca::before{width:6px;height:6px}
  .frow-marca .src-tag{font-size:.54rem;padding:.12em .35em}
  .frow-marca .bdg-ch.mini{font-size:.52rem}
  .frow-val{font-family:Archivo,sans-serif;font-weight:900;font-size:1.15rem;
    font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
  .frow-val .pos{color:var(--verde)}.frow-val .neg{color:var(--rojo)}
  .cards-hint{padding:.6em .8em;font-size:.64rem;color:var(--gris);text-align:center;
    text-transform:none;letter-spacing:0;background:var(--hueso)}
  .modal-meta{grid-template-columns:1fr}
  .modal-fc{padding:1.3rem 1.2rem 1.5rem}
}

/* ── S4 · Banners (motor ads.js) ── */
.adslot.ad-activo{padding:0;border:0;background:none;display:flex;justify-content:center;margin:1.6rem 0}
.ad-pieza{display:block;text-decoration:none;width:100%;max-width:970px}
.ad-pieza img{width:100%;height:auto;display:block;border-radius:12px}
/* Placeholder Ohana (HTML nativo mientras no haya creatividades del diseñador) */
.ad-ohana{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  background:linear-gradient(100deg,#0f395c,#0d71b9);color:#fff;border-radius:14px;
  padding:1.4rem 1.8rem;box-shadow:5px 5px 0 rgba(16,20,24,.12)}
.ad-ohana.compacto{padding:1rem 1.4rem}
.ad-ohana-txt{display:flex;flex-direction:column;gap:.25em}
.ad-ohana-txt strong{font-family:Archivo,sans-serif;font-weight:900;font-size:1.15rem;line-height:1.2}
.ad-ohana.compacto .ad-ohana-txt strong{font-size:1rem}
.ad-ohana-txt span{font-size:.9rem;color:#dbe9f6}
.ad-ohana-cta{font-family:Archivo,sans-serif;font-weight:700;background:var(--marcador);
  color:var(--tinta);padding:.6em 1.1em;border-radius:9px;white-space:nowrap;flex:none}
.ad-pieza:hover .ad-ohana-cta{transform:translateY(-1px)}
.adslot:not(.ad-activo){opacity:.5}
@media(max-width:640px){
  .ad-ohana{flex-direction:column;text-align:center;padding:1.1rem 1.2rem;gap:.8rem}
  .ad-ohana-txt{align-items:center}
}