/* ============================================================
 * Liga Manager — estilo "estadio nocturno" con la limpieza de una
 * app deportiva; el partido (directo y ficha) se cuenta en papel de
 * periódico. Tokens arriba; los nombres antiguos (--verde-cesped,
 * --tiza…) se mantienen como alias para no romper nada.
 * ============================================================ */
:root {
  --fondo: #070B14;
  --panel: #0E1524;
  --panel-alt: #111C2F;
  --linea: #1B2638;
  --linea-fuerte: #2A3A52;
  --texto: #E6EDF7;
  --texto-2: #A7B6CC;
  --texto-3: #8A9BB4;
  --acento: #4ADE80;
  --acento-fondo: #12301F;
  --oro: #FBBF24;
  --peligro: #F87171;
  --info: #93C5FD;
  --cesped: #0F2A1E;
  --cesped-2: #11301F;
  --cesped-linea: rgba(255, 255, 255, 0.22);
  --papel: #F4EFE4;
  --tinta: #1B1A17;
  --tinta-2: #5C574D;
  --rojo-diario: #A4161A;

  --color-portero: #C4B5FD;
  --color-defensa: #7DD3FC;
  --color-medio: #86EFAC;
  --color-delantero: #FDBA74;

  --letra: 'Inter Tight', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --numeros: 'Chakra Petch', 'Inter Tight', monospace;
  --titular: 'Playfair Display', Georgia, serif;
  --serif: 'Source Serif 4', Georgia, serif;
  --rotulo: 'Oswald', 'Inter Tight', sans-serif;

  /* Alias de la paleta anterior */
  --verde-cesped: var(--fondo);
  --verde-panel: var(--panel);
  --verde-panel-alt: var(--panel-alt);
  --tiza: var(--texto);
  --tiza-tenue: var(--texto-3);
  --ambar: var(--oro);
  --ambar-fuerte: var(--oro);
  --rojo: var(--peligro);
  --verde-ascenso: var(--acento);
  --borde: var(--linea);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fondo); color: var(--texto); font-family: var(--letra); font-size: 15px; line-height: 1.45; min-height: 100vh; }
button, input, select, textarea { font-family: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; }
a { color: var(--acento); }

#app { max-width: 1280px; margin: 0 auto; padding-bottom: 48px; }
.cargando { padding: 64px 24px; text-align: center; color: var(--texto-3); }
.mono, .tabla .mono { font-family: var(--numeros); font-variant-numeric: tabular-nums; }

/* ---------- Cabecera y pestañas ---------- */
.nav-fija { position: sticky; top: 0; z-index: 30; background: var(--fondo); border-bottom: 1px solid var(--linea); }
.cabecera { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 24px 8px; flex-wrap: wrap; }
.marca { display: flex; align-items: center; gap: 12px; position: relative; min-width: 0; }
.escudo { width: 40px; height: 40px; border-radius: 10px; background: var(--acento); color: var(--fondo); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 16px; flex-shrink: 0; }
.nombre-club { font-weight: 800; font-size: 18px; letter-spacing: -0.02em; line-height: 1.15; }
.sub-marca { font-size: 12px; color: var(--texto-3); }
.cabecera-derecha { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.saldo-cabecera { font-family: var(--numeros); font-weight: 600; color: var(--oro); padding: 6px 10px; border-radius: 8px; background: var(--panel); border: 1px solid var(--linea); }
.saldo-cabecera.saldo-negativo { color: var(--peligro); }
.cuenta-atras { font-size: 11px; color: var(--texto-3); text-align: right; line-height: 1.3; }
.cuenta-atras strong { color: var(--oro); font-family: var(--numeros); font-size: 13px; }
.campana-avisos { position: relative; margin-left: 4px; background: transparent; border: none; font-size: 18px; line-height: 1; padding: 6px; }
.campana-numero { position: absolute; top: -2px; right: -4px; background: var(--peligro); color: var(--fondo); font-size: 10px; font-weight: 800; border-radius: 999px; padding: 1px 5px; min-width: 16px; text-align: center; }

.tabs { display: flex; gap: 4px; padding: 4px 20px 10px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.tabs::-webkit-scrollbar { display: none; }
.tab { flex-shrink: 0; background: transparent; border: none; color: var(--texto-3); padding: 9px 14px; min-height: 40px; border-radius: 10px; font-size: 14px; font-weight: 500; white-space: nowrap; transition: background 0.15s, color 0.15s; }
.tab:hover { background: var(--panel); color: var(--texto); }
.tab.activa { background: var(--acento-fondo); color: var(--acento); font-weight: 700; }

.contenido { padding: 20px 24px 8px; }

/* ---------- Botones ---------- */
.boton-fantasma { background: transparent; border: 1px solid var(--linea-fuerte); color: var(--texto-2); padding: 8px 14px; min-height: 38px; border-radius: 10px; font-size: 13px; font-weight: 600; }
.boton-fantasma:hover { border-color: var(--texto-3); color: var(--texto); }
.boton-pequeno { padding: 4px 10px; min-height: 30px; font-size: 12px; }
.boton-peligro { border-color: rgba(248, 113, 113, 0.5); color: var(--peligro); }
.boton-peligro:hover { border-color: var(--peligro); color: var(--peligro); }
.boton-foco { background: transparent; border: 1px solid var(--linea-fuerte); color: var(--texto-2); padding: 7px 14px; min-height: 36px; border-radius: 999px; font-size: 13px; font-weight: 500; }
.boton-foco:hover { border-color: var(--texto-3); color: var(--texto); }
.boton-foco.activo { background: var(--acento-fondo); border-color: var(--acento); color: var(--texto); font-weight: 700; }
.boton-foco:disabled { opacity: 0.5; cursor: default; }
.selector-foco { display: flex; gap: 8px; flex-wrap: wrap; }
.boton-jugar { display: block; width: 100%; padding: 14px; margin: 4px 0 18px; background: var(--acento); color: var(--fondo); border: none; border-radius: 12px; font-size: 17px; font-weight: 800; letter-spacing: -0.01em; }
.boton-jugar:active { transform: translateY(1px); }
.boton-jugar:disabled { opacity: 0.6; cursor: default; }
.boton-jugar-cabecera { padding: 9px 16px; min-height: 40px; background: var(--acento); color: var(--fondo); border: none; border-radius: 10px; font-size: 14px; font-weight: 800; }
.boton-jugar-cabecera:disabled { opacity: 0.6; cursor: default; }
.boton-en-vivo { background: var(--peligro); color: var(--fondo); }
.boton-ancho { display: block; width: 100%; padding: 10px; margin: -8px 0 18px; }
.boton-enlace { display: block; margin: 4px auto 0; background: none; border: none; color: var(--texto-2); text-decoration: underline; font: inherit; font-size: 13px; padding: 8px; }
.boton-enlace:hover { color: var(--texto); }
.nombre-jugador { display: inline; text-align: left; color: var(--texto); font-size: inherit; font-weight: 600; text-decoration: none; margin: 0; padding: 4px 0; }
.nombre-jugador:hover { color: var(--acento); }

/* ---------- Paneles ---------- */
.panel { background: var(--panel); border: 1px solid var(--linea); border-radius: 14px; padding: 16px 18px; margin-bottom: 16px; min-width: 0; }
.panel-titulo { font-size: 16px; font-weight: 700; letter-spacing: -0.01em; color: var(--texto); margin-bottom: 12px; }
.panel-subtitulo { margin: 14px 0 6px; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--texto-3); }
.panel-destacado { border-color: var(--acento); }
.panel-alerta { border-color: var(--peligro); }
.panel-avisos { border-color: var(--oro); }
.panel-admin { border-style: dashed; }
.fila-resumen { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--linea); font-size: 14px; }
.fila-resumen:last-child { border-bottom: none; }
.fila-resumen.sub { font-size: 13px; color: var(--texto-2); }
.panel-saldo { text-align: center; }
.saldo-grande { font-family: var(--numeros); font-size: 40px; font-weight: 700; color: var(--oro); }
.saldo-grande.saldo-negativo { color: var(--peligro); }
.nota-copa { font-size: 13px; color: var(--texto-3); margin-top: 10px; }
details.panel > summary { cursor: pointer; list-style: none; }
details.panel > summary::-webkit-details-marker { display: none; }
details.panel > summary::after { content: " ▸"; font-size: 14px; color: var(--texto-3); }
details.panel[open] > summary::after { content: " ▾"; }

/* Rejillas de pantalla: contenido + columna lateral */
.rejilla-lateral { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.rejilla-lateral-ancha { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.rejilla-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.columna { display: flex; flex-direction: column; min-width: 0; }
.columna > .panel:last-child { margin-bottom: 0; }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.kpi { background: var(--panel); border: 1px solid var(--linea); border-radius: 12px; padding: 12px 14px; min-width: 0; }
.kpi-etiqueta { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--texto-3); }
.kpi-valor { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; }
.kpi-valor.numero { font-family: var(--numeros); color: var(--oro); }
.kpi-valor.acento { color: var(--acento); }

/* ---------- Tablas ---------- */
.tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabla th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--texto-3); padding: 8px 8px; border-bottom: 1px solid var(--linea); white-space: nowrap; }
.tabla td { padding: 9px 8px; border-bottom: 1px solid var(--linea); }
.tabla tr:last-child td { border-bottom: none; }
.tabla tbody tr:hover td { background: rgba(255, 255, 255, 0.015); }
.tabla-clasificacion th, .tabla-clasificacion td { text-align: center; }
.tabla-clasificacion th:nth-child(2), .tabla-clasificacion td:nth-child(2) { text-align: left; }
.tabla-clasificacion .pts { font-weight: 800; color: var(--texto); font-family: var(--numeros); }
.fila-usuario { background: var(--acento-fondo); }
.fila-usuario td:nth-child(2) { color: var(--acento); font-weight: 700; }
.zona-ascenso td:first-child { box-shadow: inset 3px 0 0 var(--acento); }
.zona-descenso td:first-child { box-shadow: inset 3px 0 0 var(--peligro); }
.fila-siguiente { background: rgba(251, 191, 36, 0.06); }
.fila-equipo-actual { background: var(--acento-fondo); }
.fila-puja-propia { background: var(--acento-fondo); }
.fila-ficha td { background: var(--panel-alt); }
.estado-jornada { font-size: 11px; color: var(--texto-3); text-align: right; }
.etiqueta-tipo { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 6px; }
.etiqueta-tipo.liga { background: var(--acento-fondo); color: var(--acento); }
.etiqueta-tipo.copa { background: rgba(251, 191, 36, 0.14); color: var(--oro); }
.tabla-desplazable, .tabla-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tabla-stats { font-size: 13px; white-space: nowrap; }
.tabla-stats th, .tabla-stats td { padding: 6px 8px; }
.tabla-finanzas th:nth-child(3), .tabla-finanzas td:nth-child(3), .tabla-finanzas th:nth-child(4), .tabla-finanzas td:nth-child(4) { text-align: right; }
.cifra-positiva { color: var(--acento); }
.cifra-negativa { color: var(--peligro); }
.puja-ganando { color: var(--acento); font-weight: 700; }
.salario { color: var(--oro); font-weight: 700; font-family: var(--numeros); }

.selector, select.selector { width: 100%; padding: 10px 12px; margin-bottom: 14px; background: var(--panel-alt); color: var(--texto); border: 1px solid var(--linea-fuerte); border-radius: 10px; font-size: 14px; }
.leyenda { display: flex; gap: 16px; margin-top: 10px; font-size: 12px; color: var(--texto-3); align-items: center; flex-wrap: wrap; }
.marca-zona { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }
.marca-zona.zona-ascenso { background: var(--acento); }
.marca-zona.zona-descenso { background: var(--peligro); }
.ascenso-info { margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: var(--acento-fondo); border: 1px solid rgba(74, 222, 128, 0.35); font-size: 14px; color: var(--acento); }
.ascenso-info strong { color: var(--texto); }
.ascenso-info.sin-ascenso { background: var(--panel-alt); border-color: var(--linea); color: var(--texto-3); font-style: italic; }
.separador-jornada { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--texto-3); display: block; padding: 0; margin: 16px 0 6px; }
.subtitulo-partidos { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--texto-3); margin: 14px 0 4px; border-top: 1px solid var(--linea); padding-top: 10px; }
.tendencia-sube { color: var(--acento); font-weight: 700; }
.tendencia-baja { color: var(--peligro); font-weight: 700; }
.tendencia-estable { color: var(--texto-3); }

/* ---------- Etiquetas, puestos, notas ---------- */
.tag-potencial { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; background: var(--panel-alt); color: var(--texto-2); }
.tag-potencial-basico { color: var(--texto-3); }
.tag-potencial-regular { color: var(--texto-2); }
.tag-potencial-normal { color: var(--texto); }
.tag-potencial-bueno { color: var(--color-defensa); background: rgba(125, 211, 252, 0.12); }
.tag-potencial-excelente { color: var(--acento); background: var(--acento-fondo); }
.tag-potencial-brillante { color: var(--oro); background: rgba(251, 191, 36, 0.14); }
.tag-potencial-genio { color: var(--fondo); background: var(--oro); font-weight: 800; }
.badge-posicion { font-size: 11px; font-weight: 800; padding: 2px 7px; border-radius: 6px; color: var(--fondo); white-space: nowrap; display: inline-block; min-width: 34px; text-align: center; }
.badge-portero { background: var(--color-portero); }
.badge-defensa { background: var(--color-defensa); }
.badge-medio { background: var(--color-medio); }
.badge-delantero { background: var(--color-delantero); }
.sub-posicion { font-size: 12px; color: var(--texto-3); margin-left: 6px; }
.fila-posicion td:first-child { box-shadow: inset 3px 0 0 var(--fila-color, var(--texto-3)); }
.fila-portero { --fila-color: var(--color-portero); }
.fila-defensa { --fila-color: var(--color-defensa); }
.fila-medio { --fila-color: var(--color-medio); }
.fila-delantero { --fila-color: var(--color-delantero); }
.nota-alta { color: var(--oro); font-weight: 700; }
.nota-media { color: var(--acento); }
.nota-baja { color: var(--texto); }
.nota-mala { color: var(--texto-3); }
.icono-estado { font-size: 11px; opacity: 0.9; }
.nota-partido { display: inline-block; min-width: 2.6em; text-align: center; padding: 2px 5px; border-radius: 6px; font-weight: 700; font-family: var(--numeros); }
.nota-partido.nota-alta { background: rgba(251, 191, 36, 0.16); color: var(--oro); }
.nota-partido.nota-media { background: var(--acento-fondo); color: var(--acento); }
.nota-partido.nota-baja { background: var(--panel-alt); color: var(--texto); }
.nota-partido.nota-mala { background: rgba(248, 113, 113, 0.14); color: var(--peligro); }
.figura-partido { margin: 6px 0 12px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

.barra-forma { display: inline-block; width: 52px; height: 5px; background: var(--linea); border-radius: 3px; overflow: hidden; vertical-align: middle; margin-right: 6px; }
.barra-forma span { display: block; height: 100%; }
.forma-alta span { background: var(--acento); }
.forma-media span { background: var(--oro); }
.forma-baja span { background: var(--peligro); }
.forma-num { font-size: 12px; color: var(--texto-2); }
.celda-forma { white-space: nowrap; }
.barra-moral { height: 8px; border-radius: 999px; background: var(--linea); overflow: hidden; margin-bottom: 4px; }
.barra-moral-relleno { height: 100%; background: var(--acento); }

/* ---------- Ficha de jugador ---------- */
.ficha-jugador { padding: 8px 2px; }
.atributos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 20px; }
.grupo-titulo { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--texto-3); margin-bottom: 4px; }
.atributo { display: flex; justify-content: space-between; font-size: 13px; padding: 3px 0; border-bottom: 1px solid var(--linea); cursor: help; }
.valor-atributo { font-family: var(--numeros); min-width: 22px; text-align: right; }
.notas-puesto { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 8px; }
.nota-puesto { display: inline-flex; gap: 6px; align-items: center; font-size: 12px; padding: 3px 8px 3px 4px; border-radius: 999px; background: var(--panel-alt); font-family: var(--numeros); }
.fila-forma-ficha { margin-top: 8px; font-size: 13px; color: var(--texto-2); }

/* ---------- Inicio: marcador ---------- */
.marcador { background: var(--panel); border: 1px solid var(--linea); border-radius: 16px; padding: 24px 20px; text-align: center; margin-bottom: 16px; }
.jornada-numero { font-family: var(--numeros); font-size: 44px; font-weight: 700; color: var(--oro); line-height: 1; }
.tipo-jornada { font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--texto-3); margin-top: 4px; }
.marcador-vs { font-size: 18px; font-weight: 700; margin-top: 16px; display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
.marcador-vs.sin-partido { color: var(--texto-3); font-style: italic; font-weight: 500; }
.marcador-vs .vs { color: var(--texto-3); font-size: 13px; }
.equipo-usuario { color: var(--acento); }
.detalle-marcador { font-size: 13px; color: var(--texto-3); margin-top: 8px; }
.panel-resultado .linea-resultado { font-size: 16px; font-weight: 600; }
.linea-resultado.sin-partido { color: var(--texto-3); font-style: italic; font-weight: 400; }

/* ---------- Copa ---------- */
.copa-cabecera { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.copa-titulo { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; }
.copa-estado { font-size: 14px; color: var(--texto-2); }
.camino-copa { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 16px; }
.paso-copa { background: var(--panel); border: 1px solid var(--linea); border-radius: 12px; padding: 10px 12px; min-width: 0; }
.paso-copa.hecho { border-color: rgba(74, 222, 128, 0.4); }
.paso-copa.actual { border-color: var(--acento); background: var(--acento-fondo); }
.paso-copa.fuera { opacity: 0.55; }
.paso-nombre { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--texto-3); }
.paso-estado { font-size: 14px; font-weight: 700; margin-top: 2px; }
.fase-copa { margin-bottom: 16px; }
.fase-titulo { font-size: 16px; font-weight: 700; margin-bottom: 10px; display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.grid-grupos-copa { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.grupo-copa { background: var(--panel-alt); border: 1px solid var(--linea); border-radius: 12px; padding: 12px 14px; }
.grupo-copa.grupo-destacado { border-color: var(--acento); }
.grupo-copa .tabla td, .grupo-copa .tabla th { padding: 5px 4px; font-size: 13px; }
.lista-grupo { margin: 0; padding-left: 18px; font-size: 13px; }
.lista-grupo li.equipo-usuario { color: var(--acento); font-weight: 700; }
.linea-partido-mini, .linea-partido { font-size: 13px; padding: 6px 0; display: flex; gap: 8px; align-items: center; border-bottom: 1px solid var(--linea); }
.linea-partido-mini:last-child, .linea-partido:last-child { border-bottom: none; }
.linea-partido { justify-content: center; font-size: 14px; }
.linea-partido.linea-usuario, .linea-partido-mini.linea-usuario { color: var(--acento); font-weight: 700; }
.ronda-etiqueta { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--texto-3); background: var(--panel); padding: 2px 6px; border-radius: 6px; }
.cuadro-final { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: center; }
.cruce { background: var(--panel-alt); border: 1px solid var(--linea); border-radius: 12px; overflow: hidden; }
.cruce.mio { border-color: var(--acento); }
.cruce-equipo { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 9px 12px; font-size: 14px; }
.cruce-equipo + .cruce-equipo { border-top: 1px solid var(--linea); }
.cruce-equipo.gana { font-weight: 800; }
.cruce-equipo.pierde { color: var(--texto-3); }
.cruce-goles { font-family: var(--numeros); font-weight: 700; }
.cruce-ronda { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--texto-3); margin-bottom: 6px; }

/* ---------- Módulos ---------- */
.grid-modulos { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-top: 12px; }
.tarjeta-modulo { background: var(--panel-alt); border: 1px dashed var(--linea-fuerte); border-radius: 12px; padding: 12px 14px; opacity: 0.75; }
.tarjeta-modulo.modulo-activo { opacity: 1; border-style: solid; border-color: var(--acento); }
.modulo-titulo { font-size: 15px; font-weight: 700; }
.modulo-desc { font-size: 12px; color: var(--texto-3); margin: 4px 0 8px; line-height: 1.4; }
.modulo-estado { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--oro); }
.modulo-activo .modulo-estado { color: var(--acento); }

/* ---------- Avisos y club ---------- */
.fila-pendiente { padding: 10px 0; border-bottom: 1px solid var(--linea); }
.fila-pendiente:last-child { border-bottom: none; }
.fila-pendiente-botones { display: flex; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.aviso-club { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: rgba(251, 191, 36, 0.08); border: 1px solid rgba(251, 191, 36, 0.25); font-size: 14px; line-height: 1.6; }
.aviso-solo-mirar { margin: 8px 0; padding: 10px 12px; border: 1px solid rgba(251, 191, 36, 0.35); border-radius: 10px; background: rgba(251, 191, 36, 0.08); }
.fila-renombrar { display: flex; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.fila-renombrar input[type="text"] { flex: 1 1 200px; min-width: 0; background: var(--panel-alt); border: 1px solid var(--linea-fuerte); border-radius: 10px; color: var(--texto); padding: 9px 12px; font-size: 15px; }
.fila-renombrar input[type="text"]:focus { outline: none; border-color: var(--acento); }
.detalle-division { margin-bottom: 10px; }
.detalle-division summary { cursor: pointer; font-size: 15px; font-weight: 700; padding: 6px 0; }
.detalle-division .tabla { margin-top: 6px; }

/* ---------- Formularios ---------- */
.acceso { max-width: 420px; margin: 0 auto; padding: 40px 16px 0; }
.acceso p { font-size: 14px; line-height: 1.5; margin-top: 0; }
.campo { display: block; font-size: 13px; color: var(--texto-2); margin-bottom: 12px; }
.campo input, .campo select { display: block; width: 100%; margin-top: 4px; padding: 11px 12px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font-size: 16px; }
.campo input:focus, .campo select:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.aviso-error { color: var(--peligro); font-size: 14px; margin: 4px 0 12px; }
.aviso-ok { color: var(--acento); font-size: 14px; margin: 4px 0 12px; }
.nota-campo { font-size: 12px; color: var(--texto-3); }
textarea, .campo textarea { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font-size: 15px; resize: vertical; }
input[type="datetime-local"] { padding: 8px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); color-scheme: dark; }
select { color-scheme: dark; }
.fila-formulario { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.fila-formulario input { flex: 1 1 160px; min-width: 0; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font-size: 16px; }
.selector-mundo { max-width: 200px; padding: 7px 10px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font-size: 13px; }
.horario-dias { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 4px 0 10px; font-size: 14px; }
.dia-check { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.codigo-liga { font-family: var(--numeros); font-size: 20px; letter-spacing: 3px; color: var(--oro); padding: 4px 10px; border: 1px dashed var(--linea-fuerte); border-radius: 10px; }
.filtro-admin { width: 100%; margin-bottom: 8px; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font: inherit; }
.fila-resumen-admin { display: flex; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--linea); font-size: 14px; flex-wrap: wrap; }
.fila-resumen-admin:last-child { border-bottom: none; }
.acciones-admin { white-space: nowrap; }
.acciones-admin .boton-pequeno { margin: 2px 0; }

/* ---------- Mensajes ---------- */
.insignia { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--peligro); color: var(--fondo); font-size: 11px; line-height: 18px; text-align: center; font-weight: 800; }
.sub-pestanas { margin-bottom: 12px; }
.mensaje { border-bottom: 1px solid var(--linea); }
.mensaje:last-child { border-bottom: none; }
.boton-mensaje { width: 100%; display: flex; justify-content: space-between; gap: 10px; background: none; border: none; color: var(--texto); text-align: left; padding: 12px 0; font: inherit; font-size: 14px; flex-wrap: wrap; }
.mensaje-nuevo .boton-mensaje strong { color: var(--acento); }
.mensaje-nuevo .boton-mensaje::before { content: "●"; color: var(--acento); margin-right: -4px; }
.mensaje-cuerpo { padding: 0 0 12px; font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; }
.mensaje-tablon { padding: 10px 0; border-bottom: 1px solid var(--linea); font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; }
.mensaje-tablon:last-child { border-bottom: none; }
.mensaje-cabecera .boton-enlace { display: inline; margin: 0 0 0 8px; padding: 0; font-size: 12px; }
.enlace-manager { display: inline; margin: 0; padding: 0; font-size: 12px; }

/* ---------- Plan de partido ---------- */
.regla-plan { border: 1px solid var(--linea); border-radius: 10px; padding: 10px; margin-top: 8px; }
.regla-plan-fila { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 3px 0; }
.regla-plan-fila select { flex: 1 1 120px; min-width: 0; }

/* Selects pequeños en tablas y formularios del juego */
.fila-hueco select, .fila-orden select, .fila-orden-tactica select, .campo-lanzador select, .selector-relato select, .regla-plan-fila select, .fila-cambio select {
  padding: 7px 8px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font-size: 13px; max-width: 100%; min-height: 36px;
}

/* ---------- Táctica: campo con jugadores arrastrables ---------- */
.tactica-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; }
.pizarra { position: relative; width: 100%; max-width: min(520px, calc((100vh - 190px) * 0.68)); margin: 0 auto; aspect-ratio: 68 / 100; border-radius: 14px; overflow: hidden; border: 2px solid #1F4A35;
  background: repeating-linear-gradient(180deg, var(--cesped) 0, var(--cesped) 10%, var(--cesped-2) 10%, var(--cesped-2) 20%); touch-action: none; user-select: none; -webkit-user-select: none; }
.pizarra .linea-pizarra { position: absolute; border: 2px solid var(--cesped-linea); pointer-events: none; }
.hueco-pizarra { position: absolute; width: 96px; margin-left: -48px; margin-top: -30px; display: flex; flex-direction: column; align-items: center; gap: 3px; z-index: 2; }
.ficha-pizarra { width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--numeros); font-weight: 700; font-size: 14px; color: var(--fondo); border: 2px solid rgba(7, 11, 20, 0.6); cursor: grab; touch-action: none; transition: transform 0.12s, box-shadow 0.12s; }
.ficha-pizarra:active { cursor: grabbing; }
.ficha-pizarra.vacia { background: rgba(7, 11, 20, 0.35) !important; border: 2px dashed var(--cesped-linea); color: var(--texto-3); cursor: default; }
.ficha-pizarra.seleccionada { box-shadow: 0 0 0 3px var(--oro); transform: scale(1.06); }
.hueco-pizarra.destino .ficha-pizarra { box-shadow: 0 0 0 3px var(--acento); transform: scale(1.1); }
.nombre-pizarra { font-size: 12px; font-weight: 700; background: rgba(7, 11, 20, 0.78); padding: 1px 7px; border-radius: 6px; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.puesto-pizarra { font-size: 10px; font-weight: 700; color: var(--texto-2); background: rgba(7, 11, 20, 0.6); padding: 0 5px; border-radius: 4px; }
.fantasma-arrastre { position: fixed; z-index: 100; pointer-events: none; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--numeros); font-weight: 700; color: var(--fondo); box-shadow: 0 8px 22px rgba(0, 0, 0, 0.5); opacity: 0.92; }
.banquillo { display: flex; flex-wrap: wrap; gap: 8px; }
.ficha-banquillo { display: flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; background: var(--panel-alt); border: 1px solid var(--linea); color: var(--texto); font-size: 13px; min-height: 40px; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.ficha-banquillo.convocado { border-color: rgba(74, 222, 128, 0.45); }
.ficha-banquillo.seleccionada { box-shadow: 0 0 0 2px var(--oro); }
.ficha-banquillo.destino { box-shadow: 0 0 0 2px var(--acento); }
.ficha-banquillo .barra-forma { width: 36px; }
.ficha-banquillo .mini { width: 34px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--numeros); font-weight: 700; font-size: 11px; color: var(--fondo); }
.zona-banquillo.destino { outline: 2px dashed var(--acento); outline-offset: 4px; border-radius: 12px; }
.ayuda-pizarra { font-size: 13px; color: var(--texto-3); margin-top: 8px; }
.once { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px 18px; margin-top: 8px; }
.fila-hueco { display: grid; grid-template-columns: 54px 1fr 38px; gap: 8px; align-items: center; margin-bottom: 6px; }
.fila-hueco select { width: 100%; }
.lista-suplentes { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 6px 14px; }
.suplente-check { font-size: 13px; }
.fila-orden-tactica { display: flex; gap: 8px; align-items: center; margin: 2px 0 8px; font-size: 13px; flex-wrap: wrap; }
.ordenes-lista .fila-orden-jugador { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--linea); }
.ordenes-lista .fila-orden-jugador:last-child { border-bottom: none; }
.valoraciones { display: grid; gap: 8px; }
.valoracion { display: grid; grid-template-columns: 92px 1fr 92px; gap: 8px; align-items: center; font-size: 13px; }
.valoracion .barra { height: 6px; background: var(--linea); border-radius: 3px; overflow: hidden; }
.valoracion .relleno { display: block; height: 100%; background: var(--oro); border-radius: 3px; }
.valoracion .relleno.gana { background: var(--acento); }
.valoracion .relleno.pierde { background: var(--peligro); }
.lanzadores { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px 14px; }
.campo-lanzador { display: grid; gap: 4px; font-size: 13px; color: var(--texto-3); }
.quimica-once { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--linea); }
.quimica-once .barra-forma { width: 120px; }
.familiaridad { font-size: 0.78em; opacity: 0.7; margin-left: 3px; font-family: var(--numeros); }

/* ---------- Directo: hoja de periódico + campo con balón ---------- */
.directo-rejilla { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.periodico { background: var(--papel); color: var(--tinta); border-radius: 6px; padding: 20px 26px; font-family: var(--serif); min-width: 0; }
.periodico-cintillo { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-family: var(--rotulo); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; border-bottom: 3px double var(--tinta); padding-bottom: 8px; color: var(--tinta-2); }
.periodico-cintillo .vivo { color: var(--rojo-diario); }
.periodico-titular { margin: 12px 0 10px; font-family: var(--titular); font-weight: 900; font-size: 34px; line-height: 1.06; color: var(--tinta); }
.periodico-marcador { display: flex; align-items: baseline; justify-content: center; gap: 16px; flex-wrap: wrap; border-top: 1px solid var(--tinta); border-bottom: 1px solid var(--tinta); padding: 8px 0; }
.periodico-equipo { font-family: var(--titular); font-weight: 700; font-size: 22px; }
.periodico-equipo.mio { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.periodico-goles { font-family: var(--titular); font-weight: 900; font-size: 40px; font-variant-numeric: tabular-nums; }
.periodico-goleadores { font-size: 14px; color: var(--tinta-2); font-style: italic; margin: 6px 0 10px; text-align: center; }
.periodico-seccion { font-family: var(--rotulo); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; border-bottom: 2px solid var(--tinta); padding-bottom: 5px; margin: 14px 0 8px; }
.periodico-texto { font-size: 16px; line-height: 1.55; }
.periodico-columnas { column-count: 2; column-gap: 24px; font-size: 15.5px; line-height: 1.55; }
.periodico-columnas p { margin: 0 0 10px; }
.periodico-columnas p:first-child::first-letter { font-family: var(--titular); font-weight: 900; font-size: 46px; float: left; line-height: 0.85; margin: 6px 8px 0 0; }
.periodico-pie { margin-top: 12px; font-size: 13px; font-style: italic; color: var(--tinta-2); border-top: 1px solid var(--tinta); padding-top: 8px; }
.periodico .nota-copa { color: var(--tinta-2); }
.periodico .selector-relato select { background: transparent; color: var(--tinta); border-color: var(--tinta-2); color-scheme: light; }
.cronica-papel { max-height: 460px; overflow-y: auto; }
.cronica-papel .linea-cronica { border-bottom: 1px dotted #B9B1A0; color: var(--tinta) !important; }
.cronica-papel .linea-cronica .minuto { font-family: var(--rotulo); font-weight: 600; color: var(--tinta); }
.cronica-papel .cronica-gol { color: var(--rojo-diario) !important; font-weight: 700; }
.cronica-papel .cronica-mia { color: var(--tinta) !important; }
.cronica-papel .cronica-comentario { font-style: italic; color: var(--tinta-2) !important; background: transparent; }
.cronica-papel .icono-cronica { filter: grayscale(0.2); }

.linea-cronica { display: grid; grid-template-columns: 40px 24px 1fr; gap: 4px; padding: 6px 0; border-bottom: 1px solid var(--linea); font-size: 14px; }
.linea-cronica .minuto { color: var(--texto-3); font-family: var(--numeros); }
.cronica-mia { color: var(--texto); }
.linea-cronica:not(.cronica-mia) { color: var(--texto-2); }
.cronica-gol { font-weight: 700; color: var(--oro) !important; }
.cronica-comentario { font-style: italic; color: var(--texto-3) !important; }
.cronica-vivo { max-height: 380px; overflow-y: auto; }
.cronica-completa { max-height: 560px; overflow-y: auto; }
.selector-relato { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; }

.campo-vivo { position: relative; width: 100%; aspect-ratio: 105 / 68; border-radius: 10px; overflow: hidden; border: 2px solid #1F4A35;
  background: repeating-linear-gradient(90deg, var(--cesped) 0, var(--cesped) 10%, var(--cesped-2) 10%, var(--cesped-2) 20%); }
.campo-vivo .linea-pizarra { position: absolute; border: 2px solid var(--cesped-linea); pointer-events: none; }
.campo-vivo .rastro { position: absolute; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: #fff; pointer-events: none; transition: left 0.6s, top 0.6s, opacity 0.6s; }
.balon-vivo { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; transition: left 0.75s ease-in-out, top 0.75s ease-in-out; pointer-events: none; z-index: 3; }
.balon-vivo .bola { width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 2px solid var(--fondo); box-shadow: 0 0 10px rgba(255, 255, 255, 0.6); }
.balon-vivo .quien { margin-top: 4px; font-size: 11px; font-weight: 800; padding: 1px 7px; border-radius: 5px; color: var(--fondo); white-space: nowrap; background: var(--acento); }
.balon-vivo .quien.rival { background: var(--info); }
@media (prefers-reduced-motion: reduce) { .balon-vivo, .campo-vivo .rastro { transition: none; } }
.minicampo-equipos { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; margin-bottom: 8px; color: var(--texto-3); }
.minicampo-texto { min-height: 2.6em; margin-top: 8px; font-size: 14px; color: var(--texto-2); }
.campo-svg { width: 100%; height: auto; display: block; }

.marcador-vivo { padding: 18px 16px; }
.punto-vivo { color: var(--peligro); animation: latido 1.4s ease-in-out infinite; }
@keyframes latido { 50% { opacity: 0.3; } }
@media (prefers-reduced-motion: reduce) { .punto-vivo { animation: none; } }
.marcador-vivo-fila { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; margin-top: 12px; }
.equipo-vivo { font-weight: 700; font-size: 17px; overflow-wrap: anywhere; }
.equipo-vivo:first-child { text-align: right; }
.equipo-vivo:last-child { text-align: left; }
.goles-vivo { font-family: var(--numeros); font-size: 52px; font-weight: 700; line-height: 1; color: var(--oro); background: #000; border: 1px solid var(--linea-fuerte); border-radius: 10px; padding: 6px 16px; font-variant-numeric: tabular-nums; }
@keyframes destello { 0% { box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.9); } 100% { box-shadow: 0 0 0 18px rgba(251, 191, 36, 0); } }
.destello-gol { animation: destello 1.2s ease-out 2; }
.linea-tiempo { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin-top: 14px; }
.tramo { height: 8px; border-radius: 4px; background: var(--linea); font-size: 0; }
.tramo.jugado { background: var(--acento); }
.tramo.siguiente { background: var(--linea-fuerte); box-shadow: 0 0 0 1px var(--oro) inset; }
.tramo-descanso { margin-right: 6px; }
.nota-directo { text-align: center; margin: -6px 0 14px; }
.boton-desesperada { border-color: var(--peligro); color: var(--texto); }
.evento-vivo { display: flex; gap: 10px; align-items: baseline; padding: 7px 0; border-bottom: 1px solid var(--linea); font-size: 14px; flex-wrap: wrap; }
.evento-vivo:last-child { border-bottom: none; }
.evento-vivo .minuto { color: var(--texto-3); font-size: 12px; min-width: 52px; font-family: var(--numeros); }
.evento-vivo .evento-jugador { margin-left: auto; }
.evento-equipo { color: var(--texto-3); font-size: 12px; }
.evento-mio .evento-jugador { color: var(--acento); font-weight: 600; }
.contador-vivo { font-size: 12px; color: var(--texto-3); margin-left: 6px; font-weight: 500; }
.fila-cambio { display: flex; gap: 8px; flex-wrap: wrap; }
.fila-cambio select { flex: 1 1 160px; min-width: 0; }
.nota-fuera { color: var(--peligro); font-size: 12px; }
.fila-marcador { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--linea); font-size: 14px; }
.fila-marcador:last-child { border-bottom: none; }
.fila-marcador span:first-child { text-align: right; }
.fila-marcador .mono { color: var(--oro); }
.fila-orden { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--linea); }
.nombre-orden { min-width: 120px; flex: 1; font-size: 14px; }
.tabla-estadisticas td, .tabla-estadisticas th { padding: 6px 8px; }
.tabla-estadisticas .der { text-align: right; }
.tabla-estadisticas .centro { text-align: center; color: var(--texto-3); font-size: 13px; }
.tabla-estadisticas-jugadores td, .tabla-estadisticas-jugadores th { font-size: 13px; padding: 6px 6px; white-space: nowrap; }
.barra-stat { display: flex; height: 6px; border-radius: 3px; overflow: hidden; background: var(--linea); margin-top: 4px; }
.barra-stat span:first-child { background: var(--acento); }
.barra-stat span:last-child { background: #475569; flex: 1; }
.fila-stat { padding: 7px 0; }
.fila-stat-cifras { display: flex; justify-content: space-between; gap: 8px; font-size: 14px; font-weight: 600; }
.fila-stat-cifras .centro { color: var(--texto-3); font-weight: 500; text-align: center; }

/* ---------- Estadísticas ---------- */
.lideres-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.lideres-titulo { font-weight: 700; margin-bottom: 4px; font-size: 14px; }
.arb-local, .arb-visit { font-weight: 600; }
.arb-favor { color: var(--acento); font-weight: 600; }
.arb-contra { color: var(--peligro); font-weight: 600; }

/* ---------- Mercado ---------- */
.oferta { display: grid; grid-template-columns: 44px minmax(0, 1.4fr) 56px 90px minmax(0, 1fr) 130px auto; align-items: center; gap: 12px; background: var(--panel); border: 1px solid var(--linea); border-radius: 14px; padding: 12px 16px; margin-bottom: 8px; }
.oferta.mia { border-color: var(--acento); }
.oferta-nombre { font-weight: 700; font-size: 15px; }
.oferta-sub { font-size: 13px; color: var(--texto-3); }
.oferta-precio { text-align: right; font-family: var(--numeros); font-weight: 700; font-size: 16px; }
.oferta-estado { font-size: 13px; color: var(--texto-2); }
.oferta-acciones { display: flex; gap: 6px; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.oferta-acciones input { width: 120px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--linea-fuerte); background: var(--panel-alt); color: var(--texto); font-family: var(--numeros); }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .rejilla-lateral { grid-template-columns: minmax(0, 1fr) 300px; }
  .tactica-rejilla { grid-template-columns: minmax(0, 1fr) 320px; }
  .oferta { grid-template-columns: 44px minmax(0, 1fr) 56px minmax(0, 1fr) 120px; }
  .oferta .oferta-estado { display: none; }
  .oferta-acciones { grid-column: 1 / -1; justify-content: flex-start; }
}
/* Tablet apaisada (1024×768 y similares): columnas laterales más estrechas */
@media (max-width: 1024px) and (orientation: landscape) {
  .contenido { padding: 16px 18px 8px; }
  .directo-rejilla { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
  .tactica-rejilla .pizarra { max-width: min(100%, calc((100vh - 170px) * 0.68)); }
}
@media (max-width: 900px) and (orientation: portrait), (max-width: 760px) {
  .rejilla-lateral, .rejilla-lateral-ancha, .directo-rejilla, .tactica-rejilla, .rejilla-2 { grid-template-columns: minmax(0, 1fr); }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .camino-copa { grid-template-columns: repeat(5, minmax(110px, 1fr)); overflow-x: auto; }
  .cuadro-final { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  body { font-size: 14px; }
  .cabecera { padding: 10px 14px 6px; }
  .escudo { width: 34px; height: 34px; font-size: 14px; }
  .nombre-club { font-size: 16px; }
  .cabecera-derecha { gap: 6px; }
  .cabecera-derecha .boton-fantasma { padding: 6px 10px; min-height: 34px; }
  .tabs { padding: 2px 10px 8px; }
  .tab { padding: 8px 12px; font-size: 13px; }
  .contenido { padding: 14px 12px 8px; }
  .panel { padding: 14px; border-radius: 12px; }
  .periodico { padding: 16px; }
  .periodico-titular { font-size: 26px; }
  .periodico-columnas { column-count: 1; }
  .cronica-papel { max-height: 300px; }
  .goles-vivo { font-size: 40px; padding: 4px 12px; }
  .equipo-vivo { font-size: 14px; }
  .jornada-numero { font-size: 36px; }
  .oferta { grid-template-columns: 44px minmax(0, 1fr) auto; }
  .oferta > :nth-child(4), .oferta > :nth-child(5) { display: none; }
  .oferta-precio { grid-column: 2 / 3; text-align: left; }
  .hueco-pizarra { width: 72px; margin-left: -36px; }
  .ficha-pizarra { width: 38px; height: 38px; font-size: 12px; }
  .nombre-pizarra { font-size: 11px; padding: 1px 5px; }
  .valoracion { grid-template-columns: 76px 1fr 70px; }
  .linea-cronica { grid-template-columns: 34px 22px 1fr; font-size: 13px; }
}

/* Mostrar solo en escritorio / solo en móvil */
.solo-movil { display: none; }
@media (max-width: 900px) and (orientation: portrait), (max-width: 760px) {
  .solo-escritorio { display: none; }
  tr.solo-movil { display: table-row; }
  .solo-movil:not(tr) { display: block; }
}

.ficha-historial { width: 100%; display: flex; align-items: center; gap: 10px; background: transparent; border: 0; border-bottom: 1px solid var(--linea); color: var(--texto); padding: 11px 4px; font-size: 14px; text-align: left; }
.ficha-historial:last-child { border-bottom: 0; }
.ficha-historial:hover { background: var(--panel-alt); }

/* Dentro de la columna lateral, las ofertas propias se apilan */
aside .oferta { grid-template-columns: 44px minmax(0, 1fr) auto; background: var(--panel-alt); }
aside .oferta > :nth-child(3), aside .oferta > :nth-child(4), aside .oferta > :nth-child(5) { display: none; }

/* Pantallas de lectura: columna centrada */
.vista-mensajes, .vista-cantera, .vista-modulos { max-width: 920px; margin: 0 auto; }
.linea-partido:not(:has(.ronda-etiqueta)) { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; }
.linea-partido:not(:has(.ronda-etiqueta)) > span:first-child { text-align: right; }
.linea-partido .mono { color: var(--oro); }

/* Cabeceras de tabla que ordenan */
.cabecera-orden { background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; display: inline-flex; align-items: center; gap: 4px; min-height: 28px; white-space: nowrap; }
.cabecera-orden:hover, .cabecera-orden.activa { color: var(--texto); }
.flecha-orden { font-size: 9px; color: var(--acento); min-width: 8px; }

.tabla-rendimiento td, .tabla-rendimiento th { padding: 7px 6px; }
th.solo-escritorio, td.solo-escritorio { display: table-cell; }
@media (max-width: 900px) and (orientation: portrait), (max-width: 760px) { th.solo-escritorio, td.solo-escritorio { display: none; } }
/* Resultados de la jornada en directo */
.tabla-resultados td { padding: 7px 6px; font-size: 14px; }
.tabla-resultados .res-local { text-align: right; width: 44%; }
.tabla-resultados .res-visit { width: 44%; }
.tabla-resultados .res-goles { text-align: center; white-space: nowrap; color: var(--oro); font-weight: 700; }
.tabla-resultados .res-gana { font-weight: 700; }
.tabla-resultados .fila-mia td { background: rgba(74, 222, 128, 0.10); }
.tabla-resultados .fila-mia td:first-child { box-shadow: inset 3px 0 0 var(--acento); }
/* Ocupar toda la pantalla en cualquier dispositivo */
#app { max-width: none; }
.vista-mensajes, .vista-cantera, .vista-modulos { max-width: none; }
@media (min-width: 1700px) { body { zoom: 1.15; } }
@media (min-width: 2200px) { body { zoom: 1.4; } }
@media (min-width: 3000px) { body { zoom: 1.9; } }
.resultados-scroll { max-height: 440px; overflow-y: auto; }
.lideres-division .fila-resumen.lider-mio { color: var(--acento); font-weight: 700; background: rgba(74, 222, 128, 0.08); box-shadow: inset 3px 0 0 var(--acento); padding-left: 8px; padding-right: 6px; border-radius: 4px; }