/* ==========================================================================
   Mister: estilos propios (prefijo .mis-). Tablas limpias con cifras tabulares a la derecha, verde para lo
   que gana y rojo para lo que pierde.
   - Entre 700 y 899 px las tablas anchas se desplazan dentro de su tarjeta (con la columna del jugador fija).
   - En el móvil (menos de 700 px) caben enteras: jugador, la cifra que importa en esa tabla y los botones como
     iconos. Las columnas secundarias (clase .mis-sec) se ocultan y su dato sale en la línea gris bajo el
     nombre (.mis-linea, que solo se ve en el móvil).
   - La página nunca se desborda: la envoltura de cada tabla contiene también sus textos para lectores.
   ========================================================================== */

.mis{display:flex;flex-direction:column;gap:var(--e4);min-width:0}
.mis > .mis-errores:empty{display:none}

/* Cabecera */
.mis .pantalla-cabecera{margin-bottom:0;align-items:center}
.mis-cabecera-texto{min-width:0}
.mis-actualizado{margin-top:var(--e1);font-size:var(--t2);color:var(--tinta-2);overflow-wrap:anywhere}
.mis-actualizado:empty{display:none}
.mis-actualizar[aria-busy="true"]{color:var(--tinta-2)}
.mis-actualizar[aria-busy="true"] .icono{animation:girar 1s linear infinite}

/* Cifras de arriba y del Plan. Un importe va siempre en una línea («131.228.000 €» sin el € suelto):
   la rejilla y el tamaño de la cifra se adaptan al ancho para que quepa. Los textos (Dueño) sí se parten. */
.mis-stats,.mis-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--e3)}
.mis-stat{min-width:0;padding:var(--e3) var(--e4);background:var(--tarjeta);border:1px solid var(--borde);border-radius:var(--r)}
.mis-stat--destacado{border-color:var(--borde-fuerte);background:var(--lateral)}
.mis-stat-valor{font-size:var(--t4);font-weight:600;line-height:1.3;font-variant-numeric:tabular-nums;white-space:nowrap}
.mis-stat-valor.mis-stat-texto{white-space:normal;overflow-wrap:anywhere}
.mis-stat-etiqueta{margin-top:2px;font-size:var(--t1);color:var(--tinta-2)}
/* Escritorio estrecho (menú lateral + contenido de 600 a 870 px): cuatro columnas con la cifra algo menor,
   y por debajo de 980 px dos columnas con la cifra normal */
@media (min-width:900px) and (max-width:1099px){
  .mis-stats .mis-stat-valor,.mis-kpis .mis-stat-valor{font-size:var(--t3)}
}
@media (min-width:900px) and (max-width:979px){
  .mis-stats,.mis-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mis-stats .mis-stat-valor,.mis-kpis .mis-stat-valor{font-size:var(--t4)}
}
@media (max-width:899px){
  .mis-stats,.mis-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e2)}
  .mis-stat{padding:var(--e3)}
  .mis-stat-valor{font-size:var(--t3)}
}
@media (max-width:359px){
  .mis-stats .mis-stat-valor,.mis-kpis .mis-stat-valor{font-size:var(--t2)}
}

/* Colores de dinero */
.mis-pos{color:var(--hecho)}
.mis-neg{color:var(--peligro)}
.mis-aviso{color:var(--aviso)}

/* Pestañas y filtros */
.mis-pestanas{margin-top:var(--e2)}
/* En el móvil las 8 pestañas no caben en una fila: van en dos filas de cuatro, todas a la vista, con el mismo
   aspecto (raya fina bajo cada fila y la activa subrayada en tinta) */
@media (max-width:699px){
  .mis-pestanas{display:grid;grid-template-columns:repeat(4,auto);gap:0;overflow:visible;border-bottom:0}
  .mis-pestanas .pestana{
    justify-content:center;min-width:0;margin-bottom:0;padding:var(--e2);
    background:linear-gradient(var(--borde),var(--borde)) left bottom / 100% 1px no-repeat border-box;
  }
}
@media (max-width:359px){
  .mis-pestanas .pestana{padding:var(--e2) var(--e1)}
}
.mis-filtros{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e2)}
.mis-buscar{position:relative;flex:1 1 220px;min-width:0}
.mis-buscar > .icono{position:absolute;left:var(--e3);top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--tinta-2);pointer-events:none}
.mis-buscar .campo{padding-left:38px}
.mis-filtros select.campo{flex:0 1 auto;width:auto;max-width:100%}
@media (max-width:899px){
  .mis-buscar{flex-basis:100%}
  .mis-filtros select.campo{flex:1 1 calc(50% - var(--e1));min-width:0}
}

/* Contenido de cada pestaña */
.mis-contenido{display:flex;flex-direction:column;gap:var(--e4);min-width:0}
.mis-contenido:focus{outline:none}
.mis-espera{display:flex;flex-direction:column;align-items:center;padding-bottom:var(--e6);text-align:center}
.mis-espera .cargando{padding-bottom:var(--e2)}
.mis-nota{font-size:var(--t1);line-height:1.55;color:var(--tinta-2)}
.mis-contenido > .mis-nota{margin:calc(-1 * var(--e2)) var(--e1) 0}

/* Tarjetas con tabla: la tabla llega hasta el borde y se desplaza dentro */
.tarjeta.mis-bloque{padding:0;overflow:hidden}
.mis-bloque--aviso{border-color:var(--aviso)}
.mis-bloque-cabecera{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--e2) var(--e3);padding:var(--e4) var(--e5) var(--e3)}
.mis-bloque-titulo{display:flex;align-items:center;gap:var(--e2);font-family:var(--fuente-titulos);font-size:var(--t4);font-weight:500;line-height:1.3}
.mis-cuenta{font-family:var(--fuente);font-size:var(--t1);font-weight:500;line-height:20px;padding:0 var(--e2);border-radius:999px;color:var(--tinta-2);background:var(--lateral);font-variant-numeric:tabular-nums}
.mis-bloque-cuerpo{display:flex;flex-direction:column;gap:var(--e3);padding:0 var(--e5) var(--e5)}
@media (max-width:899px){
  .mis-bloque-cabecera{padding:var(--e3) var(--e4) var(--e2)}
  .mis-bloque-cuerpo{padding:0 var(--e4) var(--e4)}
}

/* Tablas */
/* Los textos para lectores (.solo-lectores, con position:absolute) de las celdas que no son la primera se
   colocaban respecto a la página y no a la tabla: se salían de la envoltura, ensanchaban la página
   (en el iPhone, 481 px en vez de 375) y el navegador la alejaba. Con la envoltura posicionada se quedan dentro. */
.mis .tabla-envoltura{position:relative}
/* Bordes separados: con «collapse», la celda fija del jugador (sticky, con fondo) tapaba su trozo de la raya
   entre filas y la raya parecía empezar en la segunda columna. Así cada celda pinta su propia raya. */
.mis-tabla{min-width:560px;border-collapse:separate;border-spacing:0}
.mis-tabla--ancha{min-width:760px}
.mis-tabla thead th{background:var(--tarjeta);border-top:1px solid var(--borde)}
.mis-tabla td{font-variant-numeric:tabular-nums}
.mis-tabla td.num{white-space:nowrap}
.mis-tabla th:first-child,.mis-tabla td:first-child{padding-left:var(--e5)}
.mis-tabla th:last-child,.mis-tabla td:last-child{padding-right:var(--e5)}
/* La columna del jugador se queda fija al desplazar la tabla */
.mis-tabla th:first-child,.mis-tabla td:first-child{position:sticky;left:0;z-index:1;background:var(--tarjeta);min-width:200px;max-width:300px}
.mis-tabla tbody tr[data-jugador]{cursor:pointer}
.mis-tabla tbody tr:hover td{background:var(--fondo-hover)}
/* Tu fila en Rivales: también la primera celda (la regla de la celda fija, más específica, la dejaba en blanco) */
.mis-tabla tbody tr.mis-fila-mia td{background:var(--lateral)}
@media (max-width:899px){
  .mis-tabla th:first-child,.mis-tabla td:first-child{min-width:160px;max-width:200px;padding-left:var(--e4);box-shadow:inset -1px 0 0 var(--borde)}
  .mis-tabla th:last-child,.mis-tabla td:last-child{padding-right:var(--e4)}
}
/* Lo que solo se ve en el móvil (línea gris bajo el nombre, «piden …» bajo el valor) */
.mis-tabla .mis-movil{display:none}
.mis-linea{font-size:var(--t1);font-weight:400;line-height:1.5;color:var(--tinta-2)}
.mis-linea .mis-valor{font-weight:inherit} /* el valor con flecha de Rendimiento: color y flecha, sin negrita */
.mis-nw{white-space:nowrap}
@media (min-width:360px){.mis-par{white-space:nowrap}} /* «valor 1.080.000 €» junto; más estrecho, la tabla no cabría */
.mis-sub strong{font-weight:600;color:var(--tinta)}
/* Móvil: la tabla cabe en la tarjeta, sin desplazamiento (la envoltura sigue pudiendo desplazarse si hiciera falta) */
@media (max-width:699px){
  .mis-tabla,.mis-tabla--ancha{min-width:0}
  .mis-tabla .mis-sec{display:none}
  .mis-tabla .mis-movil{display:block}
  .mis-jugador-texto > .mis-linea{flex-basis:100%}
  .mis-tabla .mis-avatar{display:none}
  .mis-tabla th{white-space:normal}
  .mis-tabla th,.mis-tabla td{padding:var(--e2) 6px}
  .mis-tabla th:first-child,.mis-tabla td:first-child{position:static;min-width:0;max-width:none;padding-left:var(--e4);box-shadow:none}
  .mis-tabla th:last-child,.mis-tabla td:last-child{padding-right:var(--e4)}
  .mis-pct{display:block;font-size:var(--t1)}
}

/* Celda del jugador */
.mis-jugador{display:flex;align-items:center;gap:var(--e2);min-width:0}
.mis-jugador-texto{display:flex;flex-wrap:wrap;align-items:center;gap:2px var(--e2);min-width:0}
.mis-avatar{flex:none;display:block;width:28px;height:28px;border-radius:50%;object-fit:cover;background:var(--lateral)}
.mis-avatar--medio{width:36px;height:36px}
.mis-avatar--grande{width:56px;height:56px}
.mis-nombre{
  padding:0;border:0;background:none;
  font-weight:500;text-align:left;color:var(--tinta);overflow-wrap:anywhere;
}
.mis-nombre:hover{text-decoration:underline;text-decoration-color:var(--borde-fuerte);text-underline-offset:3px}
.mis-fav{display:inline-flex;color:var(--aviso)}
.mis-valor{display:inline-flex;align-items:center;gap:2px;font-weight:600}
.mis-sub{display:block;font-size:var(--t1);font-weight:400;color:var(--tinta-2)}

/* Botones de la fila: candado (intocable), «Vender» y «Objetivo» */
.mis-acciones{text-align:right;white-space:nowrap}
.mis-acciones .boton + .boton{margin-left:var(--e1)}
.mis-acciones .boton{vertical-align:middle} /* el candado (solo icono) no se queda más alto que «Vender» */
.mis-alternar[aria-pressed="true"],.mis-alternar[aria-pressed="true"]:hover{background:var(--tinta);border-color:var(--tinta);color:var(--sobre-tinta)}
.mis-alternar.boton--icono[aria-pressed="false"]{border-color:var(--borde-fuerte);background:var(--tarjeta)}
.mis-alternar[aria-busy="true"]{opacity:.55;cursor:progress}
.mis-alternar[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
/* «Vender» y «Objetivo»: texto en escritorio; en el móvil, botón cuadrado con su icono (etiqueta y diana),
   del mismo tamaño que el candado. El nombre completo sigue en aria-label. */
.mis-alternar .mis-accion-icono{display:none}
@media (max-width:699px){
  .mis-acciones .mis-alternar{width:28px;padding:0}
  .mis-acciones .mis-alternar .mis-accion-texto{display:none}
  .mis-acciones .mis-alternar .mis-accion-icono{display:block}
}
@media (max-width:699px) and (pointer:coarse){
  .mis-acciones .mis-alternar{width:32px}
}

/* Listas de cifras (Balance, Oportunidades) */
.mis-cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--e3) var(--e5);margin:0}
.mis-cifras > div{min-width:0}
.mis-cifras dt{font-size:var(--t1);color:var(--tinta-2)}
.mis-cifras dd{margin:2px 0 0;font-size:var(--t3);font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

/* Dos columnas de «etiqueta … cifra» (Plan y Rivales) */
.mis-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--e6)}
.mis-resultado{display:flex;flex-direction:column;margin:0;min-width:0}
.mis-resultado > div{display:flex;align-items:baseline;justify-content:space-between;gap:var(--e3);padding:6px 0;border-bottom:1px solid var(--borde)}
.mis-resultado dt{min-width:0;color:var(--tinta-2)}
.mis-resultado dd{margin:0;font-weight:600;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
/* En el móvil la cifra sigue en una línea (sin el € suelto) y es la etiqueta la que se parte */
@media (max-width:699px){
  .mis-cols{grid-template-columns:minmax(0,1fr)}
}

/* Tarjetas del Plan */
.mis-plan{display:flex;flex-direction:column;gap:var(--e3)}
.mis-plan--ok{border-left:3px solid var(--hecho)}
.mis-plan--mal{border-left:3px solid var(--peligro)}
.mis-plan-cabecera{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--e2) var(--e3)}
.mis-plan-titulo{font-family:var(--fuente-titulos);font-size:var(--t4);font-weight:500;line-height:1.3}
.mis-recs{display:flex;flex-direction:column;gap:var(--e2)}
.mis-rec{padding:var(--e3) var(--e4);line-height:1.55;background:var(--fondo);border:1px solid var(--borde);border-radius:var(--r);overflow-wrap:anywhere}
.mis-rec strong{font-weight:600}
.mis-rec--ok{border-left:3px solid var(--hecho)}
.mis-rec--mal{border-left:3px solid var(--peligro)}
.mis-rec--aviso{border-left:3px solid var(--aviso);background:var(--aviso-fondo)}
.mis-rec .enlace{font-weight:500}

/* Filas del plan (ventas y objetivos de compra) */
.mis-ops{display:flex;flex-direction:column;gap:var(--e2)}
.mis-op{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e3);padding:var(--e3);background:var(--tarjeta);border:1px solid var(--borde);border-radius:var(--r)}
.mis-op[aria-busy="true"]{opacity:.6}
.mis-op--off .mis-op-principal{opacity:.5}
.mis-op-principal{display:flex;flex:1 1 260px;align-items:center;gap:var(--e3);min-width:0}
.mis-op-cuerpo{flex:1;min-width:0}
.mis-op-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px var(--e3);margin-top:2px;font-size:var(--t1);color:var(--tinta-2);font-variant-numeric:tabular-nums}
.mis-op-controles{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--e2);margin-left:auto}
.mis-select{width:auto;height:32px}
.mis-importe{font-variant-numeric:tabular-nums}
@media (max-width:899px){
  .mis-op-controles{width:100%;justify-content:flex-start;margin-left:0}
  .mis-select{flex:1 1 140px;height:38px}
}
/* Móvil: el desplegable a todo el ancho y debajo el importe, con la X de quitar a la derecha (antes la X
   se quedaba sola en otra línea) */
@media (max-width:699px){
  .mis-op-controles{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .mis-op-controles .mis-select{grid-column:1 / -1;width:100%}
  .mis-op-controles .mis-importe{justify-self:start;max-width:100%}
}

/* Casilla redonda «cuenta en la simulación» */
.mis-activo{
  position:relative;flex:none;display:grid;place-items:center;
  width:22px;height:22px;padding:0;
  color:transparent;background:var(--tarjeta);border:1.5px solid var(--borde-fuerte);border-radius:50%;
  transition:background-color .12s ease,border-color .12s ease,color .12s ease;
}
.mis-activo::after{content:'';position:absolute;inset:-10px}
.mis-activo .icono{width:14px;height:14px}
.mis-activo:hover{border-color:var(--hecho);color:var(--hecho)}
.mis-activo[aria-pressed="true"]{background:var(--hecho);border-color:var(--hecho);color:var(--sobre-acento)}

/* Intocables */
.mis-intocables{display:flex;flex-wrap:wrap;gap:var(--e2)}
.mis-intocable{padding-right:4px;color:var(--tinta)}
.mis-chip-quitar{display:grid;place-items:center;width:22px;height:22px;padding:0;border:0;border-radius:50%;background:none;color:var(--tinta-2)}
.mis-chip-quitar:hover{background:var(--peligro-fondo);color:var(--peligro)}
.mis-chip-quitar[aria-busy="true"]{opacity:.5}
@media (pointer:coarse){.mis-chip-quitar{width:28px;height:28px}}

/* Rivales */
.mis-rival{display:flex;flex-direction:column;gap:4px;min-width:0}
.mis-rival-nombre{font-weight:600;overflow-wrap:anywhere}
.mis-pildoras{display:flex;flex-wrap:wrap;gap:var(--e1)}

/* Ficha del jugador (panel lateral). El panel es un hijo flex de la capa: sin min-width:0 su contenido podría
   ensancharlo más que la pantalla y dejar la X de cerrar fuera. */
.mis-ficha-panel{min-width:0}
.mis-ficha{display:flex;flex-direction:column;gap:var(--e4);min-width:0}
.mis-ficha-cabecera{display:flex;align-items:center;gap:var(--e3);min-width:0}
.mis-ficha-titulo{min-width:0}
.mis-ficha-nombre{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-family:var(--fuente-titulos);font-size:var(--t4);font-weight:500;line-height:1.3;overflow-wrap:anywhere}
.mis-ficha-meta{color:var(--tinta-2);overflow-wrap:anywhere}
.mis-ficha-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e2)}
.mis-ficha-stats .mis-stat{padding:var(--e2) var(--e3)}
.mis-ficha-stats .mis-stat-valor{font-size:var(--t2)}
/* Móvil: Valor y Cláusula lado a lado y el dueño debajo, a todo el ancho */
@media (max-width:699px){
  .mis-ficha-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mis-ficha-stats .mis-stat:last-child{grid-column:1 / -1}
}
.mis-spark{display:block;width:100%;max-width:100%;height:70px;color:var(--tinta);background:var(--lateral);border-radius:var(--r-peq)}
.mis-ficha-seccion{display:flex;flex-direction:column;gap:var(--e1)}
.mis-ficha-subtitulo{font-family:var(--fuente);font-size:var(--t2);font-weight:600;line-height:1.4;color:var(--tinta)}
.mis-ficha-texto{line-height:1.7;color:var(--tinta-2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.mis-ficha-texto strong{color:var(--tinta);font-weight:600;white-space:nowrap} /* cifras cortas: sin el € suelto */
.mis-ficha-texto strong.mis-pos{color:var(--hecho)}
.mis-ficha-texto strong.mis-neg{color:var(--peligro)}
.mis-ficha-texto strong.mis-aviso{color:var(--aviso)}
.mis-ficha-texto .mis-nota{margin-top:var(--e2)}
.mis-senales{display:flex;flex-direction:column;gap:var(--e1);margin-top:var(--e2)}
.mis-senal{display:flex;align-items:flex-start;gap:var(--e2);padding:6px var(--e3);line-height:1.5;color:var(--tinta);background:var(--aviso-fondo);border-radius:var(--r-peq)}
.mis-senal .icono{flex:none;width:16px;height:16px;margin-top:2px;color:var(--aviso)}

/* Ventana del importe */
.mis-modal-nombre{font-weight:600}
.mis-importe-vista{min-height:21px;font-size:var(--t1);color:var(--tinta-2);font-variant-numeric:tabular-nums}
.mis-importe-vista--mal{color:var(--aviso);font-weight:500}