/* Re-tema HF del CANON (variables medidas sobre las referencias). Se carga DESPUÉS del CSS ámbito del CANON. */
.canon-host {
  --bg: #07111A; --surface: #0C1822; --elev: #112130; --elev-2: #182C3F; --line: rgba(160, 205, 235, .10); --line-2: rgba(160, 205, 235, .22);
  --text: #F2F5F7; --text-2: #A9BBC9; --text-3: #8497A8;
  --gold: #E3A93F; --gold-2: #F0BE5E; --gold-bg: rgba(227, 169, 63, .15);
  --ember: #E0505A; --ember-text: #F08A92; --ember-bg: rgba(224, 80, 90, .15);
  --ok: #2FDC95; --info: #8AA9FF;
  --r: 16px; --r-s: 10px;
  color: var(--text);
}

/* ===== Alta fidelidad: tarjetas, jerarquía y profundidad (sobre el motor del CANON, sin cambiar su marcado) ===== */
.canon-host .s-lista { background: none; border-radius: 0; overflow: visible; display: grid; gap: 10px; }
.canon-host .s-lista > .s-row, .canon-host .s-lista > a.s-fila-simple {
  background: linear-gradient(180deg, var(--elev), var(--surface)); border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; box-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 8px 22px rgba(0, 0, 0, .3);
}
.canon-host .s-row, .canon-host .s-row:first-child { border-top: 1px solid var(--line); }
.canon-host .s-lista > .s-row[open] { border-color: var(--line-2); }
.canon-host .s-row > summary { padding: 14px 14px; min-height: 68px; gap: 12px; }
.canon-host .s-row > summary:hover { background: rgba(75, 123, 245, .08); }
.canon-host .s-row[open] > summary { background: rgba(75, 123, 245, .10); }
.canon-host .s-nombre { font-size: 16.5px; font-weight: 700; letter-spacing: .005em; }
.canon-host .s-sub { font-size: 13px; }
.canon-host .s-pos { min-width: 2.2em; font-size: 15px; color: var(--gold-2); }
.canon-host .s-pos.vacio { min-width: 0; display: inline-flex; }
.wi-av { display: inline-block; width: 38px; height: 38px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(255, 255, 255, .08), 0 4px 12px rgba(0, 0, 0, .4); flex: none; }
.canon-host .s-cuerpo { background: rgba(8, 20, 32, .55); border-top: 1px solid var(--line); }
.canon-host .s-cuerpo.sin-pos { padding-left: 14px; padding-right: 14px; }
.canon-host .s-kv > div { background: var(--elev); border: 1px solid var(--line); border-radius: var(--r-s); padding: 10px 12px; }
.canon-host .s-resumen > div, .canon-host .s-resumen > a { background: linear-gradient(180deg, var(--elev), var(--surface)); border: 1px solid var(--line); box-shadow: 0 8px 22px rgba(0, 0, 0, .28); }
.canon-host .s-bloque { background: linear-gradient(180deg, var(--elev), var(--surface)); border: 1px solid var(--line); box-shadow: 0 8px 22px rgba(0, 0, 0, .25); }
.canon-host .s-busca { background-color: var(--elev); box-shadow: inset 0 0 0 1px var(--line); border-radius: 14px; }
.canon-host .s-busca:focus { box-shadow: inset 0 0 0 1.5px var(--blue); }
.canon-host .s-ordenar select { background-color: var(--elev-2); }
.canon-host .s-mas { background: var(--blue); color: #fff; box-shadow: none; }
.canon-host .s-cta { background: linear-gradient(180deg, var(--elev), var(--surface)); border: 1px solid var(--line); }
.canon-host .s-h1 { font-size: 26px; letter-spacing: -.01em; margin: 2px 0 12px; }
.canon-host .s-eyebrow { color: var(--text-3); }
.canon-host .s-aviso { border-radius: 999px; padding: 3px 10px; }
.canon-host .s-hoja-panel { background: var(--surface); border: 1px solid var(--line-2); }
.canon-host .s-volver { color: var(--gold-2); }
.banner[data-role="canon-demo-banner"] { padding: 8px 12px; font-size: 13px; gap: 8px; }
.banner[data-role="canon-demo-banner"] svg { width: 16px; height: 16px; }
.nav a.mob { font-size: 12px; letter-spacing: -.02em; }
@media (min-width: 1024px) {
  .canon-host .s-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .canon-host .s-kv { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .canon-host .s-resumen { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Legibilidad: nombres que se parten en vez de cortarse; textos mínimos de 12 px */
.canon-host .s-nombre { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.canon-host .s-valor .s-vsub { font-size: 12px; }
.canon-host .s-sub-h, .canon-host .s-cuenta { font-size: 13px; }

/* ===== Píldoras en el motor del CANON (sin cambiar su marcado) ===== */
.canon-host .s-ordenar select { border-radius: 999px; padding: 0 38px 0 18px; min-height: 44px; background-color: var(--pill-bg); box-shadow: inset 0 0 0 1px var(--pill-edge); }
.canon-host .s-mas { border-radius: 999px; background: var(--blue-grad); box-shadow: var(--blue-shadow); }
.canon-host .s-volver { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px 0 10px; margin: 2px 0 12px; border-radius: 999px; background: linear-gradient(180deg, var(--pill-bg), var(--pill-bg-2)); box-shadow: inset 0 0 0 1px var(--pill-edge); color: var(--gold-2); font-weight: 650; }
.canon-host .s-busca { border-radius: 999px; padding-left: 46px; background-color: var(--pill-bg); box-shadow: inset 0 0 0 1px var(--pill-edge); }
.canon-host .s-busca:focus { box-shadow: inset 0 0 0 2px var(--blue-top); }
.canon-host .s-cta { border-radius: 22px; }
.canon-host .s-aviso, .canon-host .s-conv, .canon-host .s-cob { border-radius: 999px; }
.canon-host .s-grado { border-radius: 999px; padding: 1px 9px; }
.canon-host .s-row, .canon-host .s-lista > .s-row, .canon-host .s-lista > a.s-fila-simple { border-radius: 22px; }
.canon-host .s-bloque, .canon-host .s-resumen > div, .canon-host .s-resumen > a { border-radius: 22px; }
.canon-host .s-kv > div { border-radius: 16px; }
.canon-host .s-hoja-panel { border-radius: 26px 26px 0 0; }
.canon-host .s-hoja-cerrar { border-radius: 50%; }

/* ===== Ficha de cartera: cabecera con avatar (como la ficha de la referencia) y estado «abierto» ===== */
.canon-host .s-ficha-cab { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: center; margin-bottom: 14px; }
.canon-host .s-ficha-cab > .wi-av.lg { grid-column: 1; grid-row: 1 / span 3; width: 64px; height: 64px; }
.canon-host .s-ficha-cab > :not(.wi-av) { grid-column: 2; min-width: 0; }
.canon-host .s-ficha-cab > .s-avisos { grid-column: 1 / -1; margin-top: 10px; }
.canon-host .s-ficha-cab .s-h1 { font-size: 23px; margin: 0; line-height: 1.15; }
.canon-host .s-ficha-cab .s-eyebrow { margin: 0 0 2px; }
.canon-host .s-lista > .s-row[open] { border-color: rgba(94, 141, 255, .55); box-shadow: 0 0 0 1px rgba(94, 141, 255, .25), 0 10px 26px rgba(0, 0, 0, .35); }
.canon-host .s-resumen > div .s-eyebrow, .canon-host .s-resumen > a .s-eyebrow { letter-spacing: .1em; }
.canon-host .s-volver { min-height: 44px; }

/* ===== TABLA DENSA de Carteras (escritorio ≥1024 px). En móvil las columnas no se muestran: siguen las tarjetas. ===== */
.canon-host .s-cols, .canon-host .s-thead { display: none; }
@media (min-width: 1024px) {
  .canon-host { --cols: 46px minmax(230px, 2.3fr) minmax(96px, .9fr) minmax(104px, .9fr) minmax(104px, .9fr) minmax(112px, 1fr) minmax(112px, 1fr) minmax(88px, .8fr) minmax(24px, auto); }
  .canon-host .s-thead { display: grid; grid-template-columns: var(--cols); column-gap: 14px; align-items: end; padding: 14px 18px 10px; margin-top: 6px;
    font-size: 12.5px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--text-3); border-bottom: 1px solid var(--line); }
  .canon-host .s-thead [data-col=entradas], .canon-host .s-thead [data-col=coincidencias], .canon-host .s-thead [data-col=pnl], .canon-host .s-thead [data-col=aciertos], .canon-host .s-thead [data-col=orden] { text-align: right; }
  .canon-host .s-thead + .s-lista, .canon-host .s-lista { display: block; }
  .canon-host .s-lista { background: linear-gradient(180deg, var(--elev), var(--surface)); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; box-shadow: 0 10px 28px rgba(0, 0, 0, .3); }
  .canon-host .s-thead + .s-lista { border-top-left-radius: 0; border-top-right-radius: 0; margin-top: -1px; }
  .canon-host .s-lista > .s-row, .canon-host .s-lista > a.s-fila-simple { border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; box-shadow: none; }
  .canon-host .s-lista > .s-row:first-child { border-top: 0; }
  .canon-host .s-lista > .s-row[open] { border-color: var(--line); box-shadow: inset 3px 0 0 var(--blue-top); background: rgba(94, 141, 255, .06); }
  .canon-host .s-row > summary { grid-template-columns: var(--cols); column-gap: 14px; min-height: 58px; padding: 8px 18px; }
  .canon-host .s-row > summary:hover { background: rgba(94, 141, 255, .09); }
  .canon-host .s-cols { display: contents; }
  .canon-host .s-col { font-variant-numeric: tabular-nums; font-size: 15px; font-weight: 600; color: var(--text); min-width: 0; align-self: center; }
  .canon-host .s-col[data-col=origen] { color: var(--text-2); font-weight: 500; }
  .canon-host .s-col[data-col=sauron] { font-weight: 500; color: var(--text-3); }
  .canon-host .s-col[data-col=entradas], .canon-host .s-col[data-col=coincidencias], .canon-host .s-col[data-col=pnl], .canon-host .s-col[data-col=aciertos] { text-align: right; }
  .canon-host .s-col.pos { color: var(--ok); } .canon-host .s-col.neg { color: var(--ember-text); }
  .canon-host .s-col .s-na { font-weight: 500; font-size: 13px; }
  .canon-host .s-col .s-aviso { font-size: 12.5px; }
  .canon-host .s-quien .s-sub { font-size: 12.5px; }
  .canon-host .s-nombre { font-size: 16.5px; }
  .canon-host .s-cuerpo { padding-left: calc(18px + 46px + 14px); background: rgba(8, 20, 32, .5); }
  .canon-host .s-cuerpo.sin-pos { padding-left: calc(18px + 46px + 14px); }
  .canon-host .s-valor .s-big, .canon-host .s-valor b { font-size: 17px; }
  .canon-host .s-lista > .s-row > summary .s-valor-wrap { justify-self: end; }
  .canon-host .s-lista[data-ranking] > .s-row > summary .s-pos { font-size: 16px; text-align: center; }
}

/* Tipografía condensada también en el motor del CANON */
.canon-host { font-size: 17px; }
.canon-host .s-nombre { font-size: 17.5px; letter-spacing: .005em; }
.canon-host .s-sub, .canon-host .s-cuenta, .canon-host .s-kv dt { font-size: 14px; }
.canon-host .s-kv dd { font-size: 17px; }
.canon-host .s-h1 { font-size: 28px; } .canon-host .s-ficha-cab .s-h1 { font-size: 25px; }
.canon-host .s-resumen .s-grande { font-size: 24px; }
.canon-host .s-aviso { font-size: 13px; }
.canon-host .s-ficha-cab .s-h1 { font-size: 28px; } .canon-host .s-h1 { font-size: 31px; }
.canon-host .s-nombre { font-size: 19px; } .canon-host .s-resumen .s-grande { font-size: 28px; }
.canon-host .s-kv dd { font-size: 19px; } .canon-host .s-bloque > summary { font-size: 18px; }
@media (min-width: 1024px) { .canon-host .s-nombre { font-size: 17.5px; } .canon-host .s-col { font-size: 16px; } .canon-host .s-thead { font-size: 13px; } }

/* Legibilidad y tacto en las pantallas del CANON (Resumen, Tokens, Ranking, Método) */
.canon-host small, .canon-host .s-cob, .canon-host .s-grado, .canon-host .s-tok-ref { font-size: max(12px, .8em); }
.canon-host a.s-link { display: inline-flex; align-items: center; min-height: 44px; }
.canon-host .s-seg button small { font-size: 12px; }