/* Panel del club. Sale del mismo molde que admin/admin.css —misma cabecera,
   mismos colores, mismas tarjetas— para que el coordinador sienta que sigue en
   la misma casa. Está copiado y no enlazado a propósito: el panel de
   administración es privado y puede cambiar sin avisar a nadie. */
:root{
  color-scheme:dark;
  --fondo:#061526;--panel:#0b223b;--panel2:#102b48;--line:#1c3a59;
  --texto:#f5f8fc;--suave:#9eb1c5;--azul:#56a7ff;--verde:#39d98a;
  --ambar:#ffc861;--rojo:#ff7777;
}
*{box-sizing:border-box}
/* El display de .acceso le gana al [hidden] del navegador (ver admin.css). */
[hidden]{display:none!important}
body{margin:0;min-height:100vh;background:
  radial-gradient(circle at 90% -10%,#123d68 0,transparent 34rem),var(--fondo);
  color:var(--texto);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
button,input,select{font:inherit}
.cabecera{height:72px;padding:12px max(18px,env(safe-area-inset-right)) 12px max(18px,env(safe-area-inset-left));
  display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;background:#061526dd;backdrop-filter:blur(12px)}
.marca{display:flex;align-items:center;gap:9px;text-decoration:none}
.marca img{display:block;width:34px;height:34px;border-radius:9px;box-shadow:0 0 0 1px #ffffff29}
.marca span{font-weight:900;font-size:17px;letter-spacing:-.025em;color:var(--texto);white-space:nowrap}
.marca em{font-style:normal;color:var(--verde)}
.volver{color:#cfe5ff;text-decoration:none;font-size:14px;font-weight:700;padding:9px 12px;border:1px solid var(--line);border-radius:10px}
main{width:min(1120px,100%);margin:auto;padding:28px max(16px,env(safe-area-inset-right)) 50px max(16px,env(safe-area-inset-left))}

.acceso{min-height:58vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--suave)}
.acceso h1{color:var(--texto);margin:8px 0 5px}.acceso p{margin:0 0 22px}.acceso-icono{font-size:42px}
.acceso .acceso-nota{max-width:420px;font-size:13px;line-height:1.5}
.spinner{width:34px;height:34px;border:3px solid #ffffff22;border-top-color:var(--azul);border-radius:50%;animation:giro .8s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
.boton{border:0;border-radius:11px;background:var(--azul);color:#031426;font-weight:800;padding:12px 18px;text-decoration:none;cursor:pointer}

.titulo{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.titulo-acciones{display:flex;gap:8px;align-items:center}
.identidad{display:flex;align-items:center;gap:16px;min-width:0}
.escudo{flex:none;width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 4px 12px #0008)}
.identidad-texto{min-width:0}
.sub{color:#b9cbe0;font-size:15px;margin:0 0 6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.chip-demo{font-size:11.5px;font-weight:800;color:#cfe5ff;background:#56a7ff1f;border:1px solid #56a7ff40;border-radius:99px;padding:3px 10px}
.actualizado{color:var(--suave);font-size:13px;margin:0;display:flex;align-items:center;gap:6px}
.recargar{border:0;background:transparent;color:var(--suave);font-size:18px;line-height:1;cursor:pointer;padding:4px 6px;border-radius:8px}
.recargar:hover{color:var(--texto);background:#ffffff0d}.recargar:disabled{opacity:.4}
.ceja{display:block;color:var(--azul);font-size:11px;letter-spacing:.14em;font-weight:900;margin-bottom:7px}
h1{font-size:clamp(25px,5vw,38px);line-height:1.08;margin:0 0 8px;letter-spacing:-.035em}

.icono-boton{width:43px;height:43px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--texto);font-size:22px;cursor:pointer}
.icono-boton:disabled{opacity:.45}
select{height:43px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--texto);padding:0 12px;outline:0;max-width:220px}

.demo{margin:0 0 16px;color:#cfe5ff;background:#56a7ff12;border:1px solid #56a7ff30;border-radius:12px;padding:10px 12px;font-size:12.5px}
.error{color:#ffc3c3;background:#411d29;border:1px solid #7c3345;border-radius:12px;padding:13px 15px;margin:0 0 16px;font-size:13.5px}

/* Las tarjetas del resumen son botones: cada una lleva a su pestaña. */
.metricas{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:28px}
.metrica{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:start;text-align:left;
  background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:15px;padding:15px;color:var(--texto);cursor:pointer}
.metrica:hover,.metrica:focus-visible{border-color:#56a7ff66;outline:0}
.metrica svg{width:28px;height:28px;fill:none;stroke:#7fbfff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.metrica.verde svg{stroke:var(--verde)}.metrica.ambar svg{stroke:var(--ambar)}
.metrica-texto span,.metrica-texto small{display:block;color:var(--suave);font-size:12.5px}
.metrica-texto strong{display:block;font-size:28px;line-height:1.15;margin:3px 0 2px;letter-spacing:-.04em;font-variant-numeric:tabular-nums;white-space:nowrap}
.metricas .malo{color:var(--rojo)}
.metrica-texto strong .unidad{display:inline;font-size:.6em;letter-spacing:-.01em;color:var(--texto);font-weight:800}
.chevron{color:var(--suave);font-size:22px;line-height:1;align-self:center}

/* Pestañas. En PC, una fila con subrayado; en el móvil bajan a una barra fija. */
.pestanas{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--line);margin:0 0 22px}
.pestanas button{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;border:0;background:transparent;
  color:var(--suave);font-weight:700;font-size:15px;padding:12px 6px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
.pestanas button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pestanas button.activa{color:var(--verde);border-bottom-color:var(--verde)}
@media(hover:hover){.pestanas button:not(.activa):hover{color:var(--texto)}}
.insignia{min-width:19px;height:19px;border-radius:99px;background:var(--ambar);color:#231600;font-size:11px;font-weight:900;
  display:inline-grid;place-items:center;padding:0 5px}
.insignia.rojo{background:var(--rojo);color:#2a0606}
.insignia.vivo{background:var(--rojo);color:#fff;animation:late 1.4s ease-in-out infinite}
.pestanas button.tab-directos.activa{color:#ff8f8f;border-bottom-color:var(--rojo)}

.bloque-titulo .ver,.ver{margin-left:auto;border:0;background:transparent;color:var(--verde);font-weight:800;font-size:14px;cursor:pointer;padding:4px 0}
.ver:hover{text-decoration:underline}
.ver-mas{display:block;margin:10px 0 0;font-size:13px}

/* Avisos del resumen: una línea cada uno, con el texto corto. */
.avisos-top{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aviso-corto{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;text-align:left;
  background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--ambar);border-radius:12px;padding:13px 14px;color:var(--texto);cursor:pointer}
.aviso-corto.rojo{border-left-color:var(--rojo)}
.aviso-corto:hover,.aviso-corto:focus-visible{border-color:#56a7ff66;outline:0}
.aviso-corto-texto b{display:block;font-size:15px}
.aviso-corto-texto span{display:block;color:#c9d7e6;font-size:13.5px;margin-top:2px}

/* «Tus equipos» en el resumen. */
.equipos-top{width:100%;border-collapse:collapse;font-size:14px}
.equipos-top th{text-align:left;color:var(--suave);font-size:12px;font-weight:700;padding:11px 14px;border-bottom:1px solid var(--line)}
.equipos-top td{padding:12px 14px;border-bottom:1px solid #ffffff0b}
.equipos-top tr[data-fila]{cursor:pointer}
.equipos-top tr[data-fila]:hover td,.equipos-top tr[data-fila]:focus-visible td{background:#ffffff08;outline:0}
.equipos-top td.chevron{width:30px;text-align:right}
.equipos-top .nombre{white-space:nowrap}
.bien{color:#8ef0bd}
.pie-tabla{margin:0;padding:10px 14px 12px;color:var(--suave);font-size:12px}

/* Agenda: una cabecera por día y debajo sus partidos. */
.agenda-caja{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:4px 14px 10px}
.dia+.dia{border-top:1px solid var(--line)}
.dia-titulo{margin:12px 0 4px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--suave)}
.dia-titulo.vivo{color:#8ef0bd}
.agenda-caja .vacio{margin:10px 0 4px}
.partido .hora{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;border-right:1px solid var(--line);padding-right:8px}
.partido .hora.suave{font-size:12.5px;font-weight:700}
.chip.casa{color:#8ef0bd;background:#39d98a1c}

.bloque{margin-bottom:30px}
h2{font-size:20px;letter-spacing:-.02em;margin:0 0 12px}
h3{font-size:13px;color:var(--suave);font-weight:800;letter-spacing:.02em;margin:0 0 10px;display:flex;align-items:center;gap:8px}
h3 small{font-weight:600;color:#6f849a}
.bloque-titulo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.bloque-titulo h2{margin:0}
.resumen{font-size:13px;font-weight:700;border-radius:999px;padding:4px 10px;background:#ffc86117;color:#ffda91}
.resumen.rojo{background:#ff6b6b1c;color:#ffb3b3}
.resumen.bien{background:#39d98a17;color:#8ef0bd}
.bloque-titulo .resumen{margin-left:auto}
.ordenar{display:flex;align-items:center;gap:8px;color:var(--suave);font-size:12.5px;font-weight:700}
.ordenar select{height:36px;font-size:13px}
/* Avisos: una línea por problema, el color dice cuánto urge y el equipo va
   delante porque es lo primero que el coordinador busca con la vista. */
.avisos{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aviso{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;
  background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--ambar);border-radius:12px;padding:12px 14px}
.aviso.rojo{border-left-color:var(--rojo)}
.aviso-icono{font-size:18px;line-height:1}
.aviso strong{display:block;font-size:14px}
.aviso p{margin:3px 0 0;color:#c9d7e6;font-size:13px;line-height:1.4}
/* Un desplegable por equipo: cerrado enseña el primer aviso; abierto, todos. */
.grupo{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--ambar);border-radius:12px}
.grupo.rojo{border-left-color:var(--rojo)}
.grupo summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none}
.grupo summary::-webkit-details-marker{display:none}
.grupo summary strong{display:block;font-size:14px}
.grupo .cuenta{color:var(--suave);font-weight:600;font-size:12px;margin-left:4px}
.grupo .primero{margin:3px 0 0;color:#c9d7e6;font-size:13px;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grupo[open] .primero{display:none}
.grupo .flecha{color:var(--suave);transition:transform .15s}
.grupo[open] .flecha{transform:rotate(180deg)}
.avisos-equipo{list-style:none;margin:0;padding:0 14px;display:grid;gap:6px}
.avisos-equipo .aviso{border:0;border-top:1px solid #ffffff0b;border-radius:0;background:transparent;padding:10px 0;grid-template-columns:auto minmax(0,1fr) auto}
.avisos-equipo .aviso p{margin:0}
.ocultar{border:1px solid var(--line);background:transparent;color:var(--suave);border-radius:8px;padding:5px 9px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.ocultar:hover{color:var(--texto)}
.grupo .ir{margin:4px 14px 14px;border:1px solid var(--line);background:transparent;color:#cfe5ff;border-radius:9px;padding:7px 10px;font-size:12px;font-weight:700;cursor:pointer}
.ocultos-pie{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--suave);font-size:12.5px;padding:4px 2px}
.ocultos-pie .mini{margin-left:0}
.todo-bien{background:#39d98a12;border:1px solid #39d98a33;color:#8ef0bd;border-radius:12px;padding:14px;font-size:14px}

.semana{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.columna{min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:14px}
.partidos{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.partido{display:grid;grid-template-columns:68px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid #ffffff0b}
.partido:first-child{border-top:0}
.partido .cuando{color:var(--suave);font-size:12px;line-height:1.3}
.partido .cuando b{display:block;color:var(--texto);font-size:13px}
.partido .quien{min-width:0}
.partido .quien b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.partido .quien span{display:block;color:var(--suave);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.marcador{font-weight:900;font-variant-numeric:tabular-nums;font-size:15px;display:flex;align-items:center;gap:7px}
.res{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;font-size:11px;font-weight:900;color:#031426}
.res.G{background:var(--verde)}.res.E{background:#b9c7d6}.res.P{background:var(--rojo)}
.chip{font-size:11px;color:#bdd0e4;background:#ffffff0d;border-radius:99px;padding:4px 8px;white-space:nowrap}
.chip.vivo{color:#8ef0bd;background:#39d98a1c}
.vacio{color:var(--suave);font-size:13px;padding:6px 0}
.mini{margin-left:auto;border:1px solid var(--line);background:transparent;color:#cfe5ff;border-radius:8px;padding:4px 9px;font-size:12px;font-weight:700;cursor:pointer}
.ok{color:#8ef0bd;font-size:12px;margin:8px 0 0}.ok:empty{display:none}

.tabla-caja{background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden}
.equipos{width:100%;border-collapse:collapse;font-size:13.5px}
.equipos th{text-align:left;color:var(--suave);font-size:11.5px;font-weight:700;padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.equipos td{padding:11px 12px;border-bottom:1px solid #ffffff0b;vertical-align:middle}
.equipos tr:last-child td{border-bottom:0}
.equipos tr.resaltada td{background:#56a7ff14}
.nombre{display:flex;align-items:center;gap:9px;font-weight:800}
.estado{flex:none;width:9px;height:9px;border-radius:50%;background:var(--verde)}
.estado.ambar{background:var(--ambar)}.estado.rojo{background:var(--rojo)}.estado.gris{background:#5a6f86}
.mod{font-size:10.5px;font-weight:700;color:var(--suave);border:1px solid var(--line);border-radius:6px;padding:1px 5px}
.suave{color:var(--suave)}
.falta{color:#ffda91}
.barra{display:flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums}
.barra i{display:block;width:54px;height:6px;border-radius:9px;background:#ffffff14;overflow:hidden}
.barra i b{display:block;height:100%;background:var(--verde)}
.barra.baja i b{background:var(--ambar)}
.abrir{border:1px solid var(--line);background:transparent;color:#cfe5ff;border-radius:9px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.cerrar{display:block;margin:10px auto 0;border:0;background:transparent;color:var(--suave);text-decoration:underline;cursor:pointer;padding:10px}
footer{text-align:center;color:#6f849a;font-size:11px;padding:0 15px calc(20px + env(safe-area-inset-bottom))}

/* Buscador de jugadores. La lista de resultados cuelga debajo, sobre el resto
   del panel, como un desplegable. */
.buscador{position:relative;margin:0 0 18px}
.buscar{display:flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:0 14px;color:var(--suave)}
.buscar:focus-within{border-color:var(--azul)}
.buscar input{width:100%;height:48px;border:0;outline:0;background:transparent;color:var(--texto);font-size:15px}
.encontrados{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 6px);list-style:none;margin:0;padding:6px;
  background:var(--panel2);border:1px solid var(--line);border-radius:13px;box-shadow:0 18px 40px #0009;max-height:360px;overflow:auto}
.encontrados button{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:0;background:transparent;color:var(--texto);
  padding:10px;border-radius:9px;cursor:pointer}
.encontrados button:hover,.encontrados button:focus-visible{background:#56a7ff1f;outline:0}
.encontrados .dorsal{flex:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#ffffff12;font-weight:900;font-size:13px}
.encontrados b{display:block;font-size:14px}.encontrados small{display:block;color:var(--suave);font-size:12px}
.encontrados .nada{color:var(--suave);font-size:13px;padding:10px}

/* La ficha del jugador. En el móvil ocupa la pantalla entera: es lo que el
   coordinador tiene delante mientras habla con el padre. */
.ficha{width:min(720px,calc(100% - 24px));max-height:calc(100% - 40px);padding:0;border:1px solid var(--line);border-radius:18px;
  background:var(--fondo);color:var(--texto)}
.ficha::backdrop{background:#020a14cc}
.ficha-cabecera{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;gap:12px;align-items:flex-start;
  padding:18px 18px 14px;background:linear-gradient(180deg,var(--panel2),var(--fondo));border-bottom:1px solid var(--line)}
.ficha-cabecera h2{font-size:24px;letter-spacing:-.03em;margin:0 0 4px}
.ficha-cabecera p{margin:0;color:var(--suave);font-size:13px}
#fichaCuerpo{padding:16px 18px 22px}
.ficha-cabecera .mini{align-self:center;white-space:nowrap}
#fichaCopiado{padding:0 18px}
.ficha h3{margin:20px 0 10px}
.ficha h3:first-child{margin-top:0}
.cifras{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cifras div{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px}
.cifras span{display:block;color:var(--suave);font-size:11.5px}
.cifras strong{display:block;font-size:22px;letter-spacing:-.03em;margin-top:3px;font-variant-numeric:tabular-nums}
.cifras small{display:block;color:var(--suave);font-size:11px;margin-top:2px}
.comparar{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:8px;font-size:13px;color:#c9d7e6}
.comparar .pista{position:relative;height:8px;border-radius:9px;background:#ffffff14;margin:10px 0 6px}
.comparar .pista b{position:absolute;left:0;top:0;bottom:0;border-radius:9px;background:var(--azul)}
.comparar .pista i{position:absolute;top:-4px;width:2px;height:16px;background:var(--ambar)}
.comparar .leyenda{display:flex;justify-content:space-between;color:var(--suave);font-size:11.5px}
.desglose{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.faltas{color:var(--suave);font-size:12.5px;margin:8px 0 0}
.lista-partidos{list-style:none;margin:0;padding:0;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.lista-partidos li{display:grid;grid-template-columns:62px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:9px 12px;border-top:1px solid #ffffff0b;font-size:13px}
.lista-partidos li:first-child{border-top:0}
.lista-partidos .suave{font-size:12px}
.lista-partidos .min{font-variant-numeric:tabular-nums;font-weight:800;text-align:right;min-width:44px}
.lista-partidos .min.cero{color:var(--suave);font-weight:600}
.pocos-datos{margin:0 0 14px;color:#ffda91;background:#ffc8610f;border:1px solid #ffc86126;border-radius:12px;padding:10px 12px;font-size:12.5px;line-height:1.45}

/* En el móvil la tabla se convierte en tarjetas: siete columnas no caben en
   390 px, y una tabla que obliga a desplazarse de lado esconde justo la
   columna que se estaba buscando. Cada celda lleva su rótulo en data-t. */
@media(max-width:760px){
  .semana{grid-template-columns:1fr}
  .metricas{grid-template-columns:1fr 1fr}
  /* La botonera baja a una barra fija, al alcance del pulgar. */
  .pestanas{position:fixed;left:0;right:0;bottom:0;z-index:20;margin:0;border:0;border-top:1px solid var(--line);
    background:#061526f2;backdrop-filter:blur(12px);padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .pestanas button{flex-direction:column;gap:3px;font-size:11.5px;padding:7px 2px;border:0;margin:0}
  .pestanas button svg{width:24px;height:24px}
  .pestanas button.activa{border:0}
  .pestanas .insignia{position:absolute;top:3px;left:calc(50% + 6px);min-width:17px;height:17px;font-size:10px}
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .equipos thead{display:none}
  .equipos,.equipos tbody,.equipos tr,.equipos td{display:block;width:100%}
  .tabla-caja{background:transparent;border:0;overflow:visible}
  .equipos tr{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:6px 4px;margin-bottom:9px;
    display:grid;grid-template-columns:1fr 1fr}
  .equipos td{border:0;padding:7px 10px}
  .equipos td:first-child{grid-column:1/-1}
  .equipos td[data-t]::before{content:attr(data-t);display:block;color:var(--suave);font-size:10.5px;font-weight:700;margin-bottom:3px}
  .equipos td.celda-abrir{grid-column:1/-1}
  .equipos td.celda-abrir .abrir{width:100%;padding:9px}
}
@media(max-width:640px){
  .ficha{width:100%;max-width:none;height:100%;max-height:none;margin:0;border-radius:0;border:0}
  .cifras{grid-template-columns:1fr 1fr}
  .lista-partidos li{grid-template-columns:56px minmax(0,1fr) auto auto;gap:8px;padding:9px 10px}
  .cabecera{height:64px}.marca img{width:30px;height:30px}.marca span{font-size:15px}.volver{font-size:12px;padding:8px 10px}
  main{padding-top:22px}.metrica{padding:13px 11px;gap:9px}.metrica svg{width:24px;height:24px}.metrica-texto strong{font-size:24px}
  .titulo{flex-direction:column}.escudo{width:58px;height:58px}.identidad{gap:12px}.titulo-acciones{align-self:stretch}.titulo-acciones select{flex:1;max-width:none}
  .equipos-top th,.equipos-top td{padding:11px 8px}.equipos-top th:first-child,.equipos-top td:first-child{padding-left:12px}
  .avisos-equipo .aviso{grid-template-columns:auto minmax(0,1fr)}.avisos-equipo .ocultar{grid-column:2;justify-self:start}
}

/* ====================== DIRECTOS ======================
   La jornada del club en directo. El rojo es el del «en directo» de la tele:
   aquí, y solo aquí, significa «está pasando ahora», no «hay un problema». */
@keyframes late{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.insignia.vivo,.d-pill.vivo i,.d-titulo.vivo i,.d-cifra.vivo i{animation:none!important}}
.partido.directo{cursor:pointer}
.partido.directo:hover{background:#ffffff06}
.partido.directo .hora{color:#ff9d9d}

.banner-directo{width:100%;display:flex;align-items:center;gap:14px;flex-wrap:wrap;text-align:left;margin:0 0 22px;padding:14px 16px;cursor:pointer;
  color:var(--texto);border:1px solid #ff777766;border-radius:15px;background:linear-gradient(110deg,#4a1220,#2a1530 55%,var(--panel))}
.banner-directo:hover{border-color:#ff7777aa}
.b-lista{display:flex;gap:6px 16px;flex-wrap:wrap;flex:1;min-width:0;font-variant-numeric:tabular-nums}
.b-lista span{white-space:nowrap}
.b-ir{color:#ffb3b3;font-weight:800;font-size:14px;margin-left:auto}

.d-pill{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 10px;border-radius:99px;background:#ffffff12;color:var(--suave);white-space:nowrap}
.d-pill.vivo{background:var(--rojo);color:#fff}
.d-pill.vivo i{width:8px;height:8px;border-radius:50%;background:#fff;animation:late 1.4s ease-in-out infinite}
.d-pill.fin{background:#fff;color:#061526}
.d-pill .res{width:18px;height:18px;font-size:10px;border-radius:5px}

.tele-boton{margin-left:auto}
.d-cifras{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 16px}
.d-cifra{display:inline-flex;align-items:center;gap:7px;background:var(--panel);border:1px solid var(--line);border-radius:99px;padding:6px 12px;font-size:13px;color:#c9d7e6}
.d-cifra b{color:var(--texto);font-size:15px;font-variant-numeric:tabular-nums}
.d-cifra.cero{opacity:.55}
.d-cifra.vivo i{width:8px;height:8px;border-radius:50%;background:var(--rojo);animation:late 1.4s ease-in-out infinite}
.d-cifra.vivo.cero i{animation:none;background:var(--suave)}
.d-balance{margin-left:auto;color:var(--suave);font-size:13px}
.d-balance b{color:var(--texto)}

.d-grupo+.d-grupo{margin-top:22px}
.d-titulo{display:flex;align-items:center;gap:8px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--suave);margin:0 0 10px}
.d-titulo.vivo{color:#ff9d9d}
.d-titulo.vivo i{width:8px;height:8px;border-radius:50%;background:var(--rojo);animation:late 1.4s ease-in-out infinite}
.d-rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}

.d-tarjeta{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:18px;padding:14px 16px 12px}
.d-tarjeta.juego{border-color:#ff777755;box-shadow:0 0 0 1px #ff777722,0 10px 30px #0006}
.d-tarjeta.final{opacity:.92}
.d-tarjeta.final.res-G{border-color:#39d98a44}
.d-cab{display:flex;align-items:center;justify-content:space-between;gap:10px}
.d-cab b{font-size:16px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d-contexto{margin:3px 0 0;color:var(--suave);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d-marcador{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;margin:14px 0 4px}
.d-lado{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;min-width:0}
.d-lado b{font-size:13px;line-height:1.2;color:#dfe8f2;font-weight:700;overflow-wrap:anywhere}
.d-lado.nuestro b{color:var(--texto);font-weight:900}
.d-escudo{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 3px 8px #0008)}
.d-inicial{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#ffffff10;border:2px solid var(--line);font-weight:900;font-size:19px;color:#cfe5ff}
.d-lado.nuestro .d-inicial{border-color:var(--verde);color:var(--texto)}
.d-num{font-size:46px;line-height:1;font-weight:900;letter-spacing:-.04em;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:8px;white-space:nowrap}
.d-num i{font-style:normal;color:var(--suave);font-size:28px;font-weight:700}
.d-reloj{text-align:center;margin:6px 0 10px;min-height:22px}
.d-reloj span{font-size:20px;font-weight:900;color:#ff9d9d;font-variant-numeric:tabular-nums}
.d-tarjeta.pausa .d-reloj span{color:var(--ambar)}
.d-reloj small{display:block;color:var(--suave);font-size:12px;margin-top:1px}
.d-goles{list-style:none;margin:0;padding:10px 0 0;border-top:1px solid #ffffff0d;display:grid;gap:5px}
.d-goles li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:8px;align-items:baseline;font-size:13px}
.d-goles .m{font-weight:900;color:var(--verde);font-variant-numeric:tabular-nums;text-align:right}
.d-goles .q small{color:var(--suave);margin-left:6px;font-size:11.5px}
.d-goles li.rival{color:var(--suave)}
.d-goles li.rival .m{color:var(--suave)}
.d-sin{margin:0;padding-top:10px;border-top:1px solid #ffffff0d;color:var(--suave);font-size:12.5px}
.d-act{margin:10px 0 0;color:#6f849a;font-size:11.5px}
.d-act:empty{display:none}
.d-act.viejo{color:var(--ambar)}

/* ¡Gol! La tarjeta se ilumina y el rótulo cruza por encima unos segundos. */
.d-gol{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0;
  background:radial-gradient(circle,#39d98acc 0,#1f6f4ad9 60%,#0b223bee 100%)}
.d-gol span{font-size:64px;font-weight:900;letter-spacing:-.04em;color:#fff;text-shadow:0 6px 24px #0008;transform:scale(.4)}
.d-tarjeta.gol .d-gol{animation:gol-fondo 7s ease var(--gol-t,0ms) forwards}
.d-tarjeta.gol .d-gol span{animation:gol-texto 7s cubic-bezier(.2,1.6,.4,1) var(--gol-t,0ms) forwards}
.d-tarjeta.gol{border-color:var(--verde)}
.d-tarjeta.gol .d-num{color:var(--verde)}
.d-tarjeta.gol-rival{animation:gol-rival 1.2s ease 2}
@keyframes gol-fondo{0%{opacity:0}6%{opacity:1}45%{opacity:1}60%{opacity:0}100%{opacity:0}}
/* La opacidad va en TODOS los pasos: si no, se interpola desde el principio
   hacia el 0 del 60 % y el rótulo nunca llega a verse. */
@keyframes gol-texto{0%{transform:scale(.4);opacity:1}12%{transform:scale(1.15);opacity:1}20%{transform:scale(1);opacity:1}45%{transform:scale(1);opacity:1}60%{transform:scale(1.6);opacity:0}100%{opacity:0}}
@keyframes gol-rival{0%,100%{border-color:var(--line)}50%{border-color:var(--rojo);box-shadow:0 0 0 2px #ff777744}}
@media(prefers-reduced-motion:reduce){
  .d-tarjeta.gol .d-gol,.d-tarjeta.gol .d-gol span{animation:none}
  .d-tarjeta.gol .d-gol{opacity:1;transition:opacity .3s}
  .d-tarjeta.gol-rival{animation:none;border-color:var(--rojo)}
}
.gol-aviso{position:fixed;z-index:30;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translate(-50%,140%);
  display:flex;align-items:center;gap:12px;max-width:calc(100% - 32px);padding:12px 18px 12px 14px;border-radius:16px;
  background:linear-gradient(120deg,#1f8f5a,#146b44);color:#fff;box-shadow:0 18px 40px #000a;transition:transform .45s cubic-bezier(.2,1.4,.4,1)}
.gol-aviso.dentro{transform:translate(-50%,0)}
.gol-aviso.rival{background:linear-gradient(120deg,#3a2230,#2a1a28);border:1px solid #ff777755}
.gol-aviso b{display:block;font-size:16px}
.gol-aviso small{display:block;font-size:12.5px;opacity:.85;font-variant-numeric:tabular-nums}
.gol-icono{font-size:28px;animation:gira 1s ease}
@keyframes gira{from{transform:rotate(-360deg) scale(.3)}to{transform:none}}

.d-pendientes{list-style:none;margin:0;padding:4px 14px;background:var(--panel);border:1px solid var(--line);border-radius:15px}
.d-pendiente{display:grid;grid-template-columns:68px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid #ffffff0b}
.d-pendiente:first-child{border-top:0}
.d-pendiente .hora{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;border-right:1px solid var(--line);padding-right:8px}
.d-pendiente .quien{min-width:0}
.d-pendiente .quien b{display:block;font-size:13.5px}
.d-pendiente .quien span{display:block;color:var(--suave);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d-archivados{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:4px 14px;margin-top:12px}
.d-vacio{text-align:center;background:var(--panel);border:1px dashed var(--line);border-radius:18px;padding:34px 20px}
.d-vacio-icono{font-size:40px}
.d-vacio h3{display:block;color:var(--texto);font-size:18px;margin:8px 0 6px}
.d-vacio p{color:var(--suave);font-size:13.5px;max-width:440px;margin:0 auto;line-height:1.5}
.d-vacio .d-prox{margin-top:14px;color:#cfe5ff}
.d-nota{color:#6f849a;font-size:12px;margin:14px 0 0}

/* ---------- Modo pantalla: la tele del club ----------
   Solo queda la jornada, a lo grande. Se sale con el botón, con Esc o
   cambiando de pestaña. */
.tv-cab,.tv-salir{display:none}
body.tele{padding-bottom:0}
body.tele .cabecera,body.tele footer,body.tele .titulo,body.tele .buscador,body.tele .pestanas,body.tele .error,
body.tele .cerrar,body.tele #tab-directos .bloque-titulo,body.tele .d-nota{display:none!important}
body.tele main{width:100%;max-width:none;padding:20px 28px 28px}
body.tele .tv-cab{display:flex;align-items:center;gap:16px;margin:0 0 18px}
body.tele .tv-cab b{display:block;font-size:30px;letter-spacing:-.03em}
body.tele .tv-cab div span{display:block;color:#ff9d9d;font-weight:800;font-size:14px;letter-spacing:.14em;text-transform:uppercase}
.tv-escudo{width:64px;height:64px;object-fit:contain}
body.tele .tv-hora{margin-left:auto;font-size:40px;font-weight:900;font-variant-numeric:tabular-nums;color:#cfe5ff}
body.tele .d-rejilla{grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:16px}
body.tele .d-cab b{font-size:20px}
body.tele .d-num{font-size:68px}
body.tele .d-escudo,body.tele .d-inicial{width:60px;height:60px}
body.tele .d-lado b{font-size:16px}
body.tele .d-reloj span{font-size:28px}
body.tele .d-goles li{font-size:15px}
body.tele .tv-salir{display:block;position:fixed;right:16px;bottom:16px;z-index:25;opacity:.25;border:1px solid var(--line);background:var(--panel);
  color:var(--texto);border-radius:10px;padding:8px 12px;font-size:12px;cursor:pointer;transition:opacity .2s}
body.tele .tv-salir:hover,body.tele .tv-salir:focus-visible{opacity:1}

@media(max-width:640px){
  .d-rejilla{grid-template-columns:1fr}
  .d-num{font-size:40px}
  .d-balance{margin-left:0;width:100%}
  .banner-directo{padding:12px 14px}
  .b-ir{margin-left:0}
  .tele-boton{margin-left:0}
  body.tele main{padding:14px 12px}
  body.tele .d-rejilla{grid-template-columns:1fr}
  body.tele .tv-cab b{font-size:20px}
  body.tele .tv-hora{font-size:26px}
  body.tele .d-num{font-size:52px}
}
