/* Sala de estar (/sala). Se sirve con versión (?v=, la calcula app.py con el contenido), así que
   no hace falta tocar nada al cambiarlo. Antes vivía adentro de templates/sala.html (oct-2026). */
  /* Sala de estar (oct-2026): los partidos de la noche para seguirlos juntos.
     Etapa 1: estado por horario del calendario, resultado del Predictor,
     transmisión de Twitch y cuenta regresiva. Todo se valida en el servidor. */
  .sl-wrap { max-width: 1680px; margin: 0 auto; padding: 1rem 16px 6rem; }
  .sl-wrap [hidden] { display: none !important; }
  /* ── Tokens de la Sala (rediseño E5, 7-oct) ──
     Tipografía: una escala fija (nada por debajo de 12 px). Títulos y números grandes en Bebas Neue
     (--font-titulo); el resto en la letra del sitio (--font-body).
     Contraste (medido con contraste.py): los grises de la Sala son más claros que los del resto del
     sitio para llegar a AA (4,5:1) también sobre el fondo más claro de las tarjetas.
     Colores con un solo significado en toda la Sala (la leyenda «Qué significa cada color» los lista).
     La ventana de «Ver la jugada» y el aviso van fuera de .sl-wrap (en el body): también los llevan. */
  .sl-wrap, .sl-rec-fondo, .sl-toast {
    --sl-fs-xs: .75rem;      /* 12 px: lo más chico (rótulos, leyendas, notas) */
    --sl-fs-sm: .8125rem;    /* 13 px: botones chicos, detalle */
    --sl-fs-md: .875rem;     /* 14 px: texto corriente */
    --sl-fs-base: .9375rem;  /* 15 px: frases, nombres */
    --sl-fs-lg: 1.0625rem;   /* 17 px: conclusiones */
    --sl-lh: 1.45;
    --sl-lh-tight: 1.25;
    --gdt-text-mid: #a3adb9;   /* 7:1 sobre las tarjetas (era #7f8b98: 4,6:1) */
    --gdt-text-lo: #8d98a5;    /* 5,5:1 (era #565f6a: 2,5:1, no llegaba) */
    --sl-linea: rgba(255, 255, 255, .36);   /* líneas de la cancha: 3,3:1 (eran 1,7:1) */
    --sl-local: var(--gdt-accent);
    --sl-visit: #4f8cff;
    --sl-visit-hi: #8db4ff;
    --sl-gol: var(--gdt-accent);
    --sl-atajada: #ffd34d;
    --sl-afuera: #b8c0cc;
    --sl-clave: #c58bff;       /* violeta: solo pases clave, asistencias y pases largos */
    --sl-falta: #ff8a3d;       /* naranja: faltas y tiros libres */
    --sl-recup: #3ddc97;       /* turquesa: recuperaciones y contraataques */
    --sl-intercep: #4fc3f7;    /* celeste: intercepciones */
    --sl-bloq: #ff7ac3;        /* rosa: bloqueos */
    --sl-desp: #ffb020;        /* ámbar: despejes */
    --sl-perd: #ff6b6b;        /* rojo: pérdidas */
    --sl-offside: #f2f4f7;     /* blanco: offsides (la forma del punto dice cómo fue) */
    --sl-corner: #a3e635;      /* lima: córners */
    --sl-lateral: #9aa4b2;     /* gris: laterales */
    --sl-destacado: #ffd34d;   /* dorado: lo destacado (el eje y la sociedad de la red de pases) */
    font-family: var(--font-body, 'DM Sans'), sans-serif;
    line-height: var(--sl-lh);
  }

  /* El chat: su caja (el lugar lo decide la grilla, más abajo) */
  .sl-chat { display: flex; flex-direction: column; background: var(--gdt-surface-1);
             border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-lg); overflow: hidden; }
  .sl-chat-cab { display: flex; align-items: center; justify-content: space-between; gap: .5rem;
                 padding: .6rem .7rem; border-bottom: 1px solid var(--gdt-border); }
  .sl-canales { display: flex; gap: .35rem; min-width: 0; }
  .sl-canal { font: inherit; font-size: var(--sl-fs-sm); font-weight: 700; cursor: pointer; white-space: nowrap;
              background: transparent; color: var(--gdt-text-mid); border: 1px solid var(--gdt-border);
              border-radius: var(--gdt-r-pill); padding: .3rem .75rem; }
  .sl-canal.on { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); }
  .sl-mirando { display: inline-flex; align-items: center; gap: .35rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-mid);
                white-space: nowrap; }
  .sl-mirando::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--gdt-accent); }

  .sl-msgs { flex: 1; overflow-y: auto; padding: .6rem .7rem; display: flex; flex-direction: column; gap: .15rem;
             overscroll-behavior: contain; }
  .sl-msgs-vacio { margin: auto; text-align: center; color: var(--gdt-text-mid); font-size: var(--sl-fs-md); padding: 1rem; }
  .sl-msg { padding: .35rem .5rem; border-radius: var(--gdt-r-sm); font-size: var(--sl-fs-md); line-height: 1.4;
            overflow-wrap: anywhere; }
  .sl-msg:hover { background: var(--gdt-surface-2); }
  .sl-msg.mio { background: rgba(255,255,255,.025); }
  .sl-msg.mencion { background: var(--gdt-accent-soft); box-shadow: inset 3px 0 0 var(--gdt-accent); }
  .sl-msg-cab { display: flex; align-items: baseline; gap: .4rem; flex-wrap: wrap; }
  .sl-msg-n { font-weight: 700; color: var(--gdt-text-hi); font-size: var(--sl-fs-sm); }
  .sl-msg-n .dt-tit { font-size: var(--sl-fs-xs); }
  .sl-msg-h { font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-msg-t { margin: .1rem 0 0; color: var(--gdt-text); white-space: pre-wrap; }
  .sl-msg-t .at { color: var(--gdt-accent-hi); font-weight: 600; }
  .sl-msg-t a { color: var(--gdt-accent-hi); }
  .sl-msg { position: relative; }
  .sl-msg-mas { position: absolute; top: .2rem; right: .2rem; width: 28px; height: 28px; display: grid; place-items: center;
                border: 0; border-radius: var(--gdt-r-sm); background: transparent; color: var(--gdt-text-lo);
                cursor: pointer; opacity: 0; }
  .sl-msg:hover .sl-msg-mas, .sl-msg-mas:focus-visible, .sl-msg-mas[aria-expanded="true"] { opacity: 1; }
  .sl-msg-mas:hover { background: var(--gdt-surface-3); color: var(--gdt-text-hi); }
  .sl-msg-mas svg { width: 16px; height: 16px; }
  @media (hover: none) { .sl-msg-mas { opacity: .55; } }
  .sl-msg.oculto { opacity: .55; }
  .sl-msg.oculto .sl-msg-t { text-decoration: line-through; text-decoration-color: rgba(255,255,255,.25); }
  .sl-msg-tag { font-size: var(--sl-fs-xs); font-weight: 700; border-radius: var(--gdt-r-pill); padding: 0 6px;
                border: 1px solid rgba(255,179,0,.4); color: var(--gdt-warn); }
  .sl-msg-tag.err { border-color: rgba(255,82,82,.45); color: var(--gdt-danger); }
  .sl-menu { position: absolute; z-index: 20; min-width: 190px; padding: .3rem; background: var(--gdt-surface-2);
             border: 1px solid var(--gdt-border-hi); border-radius: var(--gdt-r-md); box-shadow: var(--gdt-shadow-lg); }
  .sl-menu button { display: block; width: 100%; text-align: left; font: inherit; font-size: var(--sl-fs-sm); cursor: pointer;
                    background: transparent; border: 0; color: var(--gdt-text); padding: .45rem .6rem; border-radius: var(--gdt-r-sm); }
  .sl-menu button:hover { background: var(--gdt-surface-3); color: var(--gdt-text-hi); }
  .sl-menu button.peligro { color: var(--gdt-danger); }
  .sl-menu hr { border: 0; border-top: 1px solid var(--gdt-border); margin: .25rem 0; }
  .sl-chat-err.ok { color: var(--gdt-accent-hi); background: var(--gdt-accent-soft); border-top-color: var(--gdt-accent-line); }
  .sl-chat-sancion { margin: 0; padding: .7rem; font-size: var(--sl-fs-sm); color: var(--gdt-warn); text-align: center;
                     border-top: 1px solid var(--gdt-border); }
  .sl-nuevos { align-self: center; margin: -2.6rem 0 .6rem; position: relative; z-index: 1; font: inherit; font-size: var(--sl-fs-xs);
               font-weight: 700; cursor: pointer; border-radius: var(--gdt-r-pill); padding: .35rem .9rem;
               background: var(--gdt-accent); color: #04140a; border: 0; box-shadow: var(--gdt-shadow-md); }
  .sl-chat-err { margin: 0; padding: .45rem .7rem; font-size: var(--sl-fs-sm); color: var(--gdt-warn);
                 background: rgba(255,179,0,.07); border-top: 1px solid rgba(255,179,0,.25); }
  .sl-form { display: flex; gap: .45rem; align-items: flex-end; padding: .6rem .7rem; border-top: 1px solid var(--gdt-border); }
  .sl-form textarea { flex: 1; resize: none; min-height: 40px; max-height: 120px; font: inherit; font-size: var(--sl-fs-md);
                      background: var(--gdt-surface-2); color: var(--gdt-text-hi); border: 1px solid var(--gdt-border);
                      border-radius: var(--gdt-r-md); padding: .55rem .7rem; line-height: 1.35; }
  .sl-form textarea:focus { outline: none; border-color: var(--gdt-accent-line); }
  .sl-enviar { font: inherit; font-size: var(--sl-fs-md); font-weight: 700; cursor: pointer; border: 0; height: 40px;
               border-radius: var(--gdt-r-md); padding: 0 1rem; background: var(--gdt-accent); color: #04140a; }
  .sl-enviar:disabled { opacity: .5; cursor: default; }
  .sl-chat-login { margin: 0; padding: .7rem; font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); text-align: center;
                   border-top: 1px solid var(--gdt-border); }
  .sl-chat-login a { color: var(--gdt-accent-hi); font-weight: 600; }

  .sl-hero { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; padding: .5rem 0 .9rem; }
  .sl-titulo { font-family: var(--font-titulo, 'Bebas Neue'), sans-serif; font-size: 2.2rem; font-weight: 400; line-height: 1;
               letter-spacing: .03em; color: var(--gdt-text-hi); margin: 0; }
  .sl-sub { color: var(--gdt-text-mid); font-size: var(--sl-fs-md); line-height: 1.5; margin: 0; }
  @media (max-width: 699px) {
    .sl-hero { padding: .2rem 0 .6rem; }
    .sl-titulo { font-size: 1.8rem; }
    .sl-sub { display: none; }
  }

  /* Pestañas Oficiales | MM */
  .sl-vistas { display: flex; gap: 1.4rem; border-bottom: 1px solid var(--gdt-border); margin: .2rem 0 0; }
  .sl-vistas button { font: inherit; font-size: var(--sl-fs-base); font-weight: 700; cursor: pointer; background: none; border: 0;
                      color: var(--gdt-text-mid); padding: .5rem .1rem .6rem; margin-bottom: -1px;
                      border-bottom: 2px solid transparent; display: inline-flex; align-items: center; gap: .45rem; }
  .sl-vistas button:hover { color: var(--gdt-text-hi); }
  .sl-vistas button.on { color: var(--gdt-text-hi); border-bottom-color: var(--gdt-accent); }
  .sl-vistas button:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; border-radius: 4px; }
  .sl-vista-n { font-size: var(--sl-fs-xs); font-weight: 700; color: var(--gdt-text-lo); }
  .sl-vista-n.vivo { color: var(--gdt-danger); display: inline-flex; align-items: center; gap: .3rem; }

  /* Chips de la jornada */
  .sl-chips { display: flex; gap: .5rem; overflow-x: auto; padding: .15rem 0; min-width: 0; flex: 1 1 auto; scrollbar-width: thin; }
  .sl-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: .45rem; font: inherit;
             background: var(--gdt-surface-1); color: var(--gdt-text); border: 1px solid var(--gdt-border);
             border-radius: var(--gdt-r-pill); padding: .35rem .75rem .35rem .45rem; cursor: pointer;
             font-size: var(--sl-fs-sm); font-weight: 600; white-space: nowrap; text-decoration: none; min-height: 40px; }
  .sl-chip:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; }
  .sl-chip:hover { border-color: var(--gdt-border-hi); }
  .sl-chip.on { border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); color: var(--gdt-text-hi); }
  .sl-chip img, .sl-chip .sl-ini { width: 20px; height: 20px; }
  .sl-chip-liga { font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); text-transform: uppercase; letter-spacing: .04em; }

  .sl-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gdt-text-lo); flex: none; }
  .sl-dot.vivo { background: var(--gdt-danger); box-shadow: 0 0 0 0 rgba(255,82,82,.5); animation: slLate 2.8s ease-out infinite; }
  @keyframes slLate { 60% { box-shadow: 0 0 0 6px rgba(255,82,82,0); } 100% { box-shadow: 0 0 0 0 rgba(255,82,82,0); } }
  .sl-dot.fin { background: var(--gdt-text-mid); }
  .sl-dot.prox { background: var(--gdt-accent); }

  /* Tarjeta del partido */
  .sl-card { background: var(--gdt-surface-1); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-lg);
             padding: 1.1rem 1rem 1.2rem; box-shadow: var(--gdt-shadow-sm); }
  .sl-card-top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex-wrap: wrap;
                 margin-bottom: 1rem; }
  .sl-torneo { font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); font-weight: 600; }
  .sl-estado { display: inline-flex; align-items: center; gap: .4rem; font-size: var(--sl-fs-xs); font-weight: 700;
               border-radius: var(--gdt-r-pill); padding: 3px 10px; border: 1px solid var(--gdt-border);
               color: var(--gdt-text-mid); text-transform: uppercase; letter-spacing: .04em; }
  .sl-estado.vivo { color: var(--gdt-danger); border-color: rgba(255,82,82,.4); background: rgba(255,82,82,.07); }
  .sl-estado.prox { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); }

  .sl-match { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .6rem; }
  .sl-team { display: flex; flex-direction: column; align-items: center; gap: .45rem; text-align: center; min-width: 0; }
  .sl-team img, .sl-team .sl-ini { width: 64px; height: 64px; }
  .sl-team-nom { font-weight: 700; color: var(--gdt-text-hi); font-size: var(--sl-fs-base); line-height: 1.25;
                 overflow-wrap: break-word; hyphens: auto; max-width: 100%; }
  .sl-centro { text-align: center; min-width: 92px; }
  .sl-score { font-family: 'Bebas Neue', sans-serif; font-size: 3rem; line-height: 1; color: var(--gdt-text-hi);
              letter-spacing: .04em; }
  .sl-hora { font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem; line-height: 1; color: var(--gdt-text-hi); }
  .sl-cuenta { font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); margin-top: .3rem; }
  .sl-reloj { display: inline-flex; align-items: center; gap: .35rem; margin-top: .35rem; font-size: var(--sl-fs-md); font-weight: 800;
              color: var(--gdt-danger, #ff4d4d); font-variant-numeric: tabular-nums; }
  .sl-reloj.corre::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor;
                            animation: sl-late 2.8s ease-in-out infinite; animation-delay: var(--sl-fase, 0s); }
  @keyframes sl-late { 50% { opacity: .3; } }
  .sl-dot.vivo { animation-delay: var(--sl-fase, 0s); }
  /* Partido en vivo: Cómo va | Estadísticas | Jugadores, una sección por vez */
  .sl-vt { display: flex; margin: 1rem 0 .9rem; border-bottom: 1px solid var(--gdt-border); overflow-x: auto; scrollbar-width: none; }
  .sl-vt::-webkit-scrollbar { display: none; }
  .sl-vt button { flex: 1 0 auto; min-width: 0; font: inherit; font-size: var(--sl-fs-md); font-weight: 700; cursor: pointer; background: none;
                  border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: .55rem .2rem .6rem;
                  color: var(--gdt-text-mid); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sl-vt button:hover { color: var(--gdt-text-hi); }
  .sl-vt button.on { color: var(--gdt-text-hi); border-bottom-color: var(--gdt-accent); }
  .sl-vt button:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: -2px; border-radius: 4px; }
  @media (max-width: 480px) {
    /* con 4 pestañas en el celu, cada una ocupa lo que su texto (si no, "Estadísticas" se corta) */
    .sl-vt button { flex: 1 1 auto; font-size: var(--sl-fs-sm); padding-left: .15rem; padding-right: .15rem; }
  }
  .sl-vt-panel .sl-cf-vivo { margin-top: 0; padding-top: 0; border-top: 0; }
  .sl-vt-nada { margin: .4rem 0; text-align: center; font-size: var(--sl-fs-md); color: var(--gdt-text-lo); }
  .sl-ini { display: inline-grid; place-items: center; border-radius: 50%; background: var(--gdt-surface-3);
            color: var(--gdt-text-mid); font-weight: 700; font-size: .8em; flex: none; }
  .sl-team .sl-ini { font-size: 1.3rem; }
  img.sl-esc { object-fit: contain; flex: none; }

  /* Goles y tarjetas: los del local a la izquierda, los del visitante a la derecha */
  .sl-tarj { display: inline-block; width: 10px; height: 14px; border-radius: 2px; }
  .sl-tarj.amarilla { background: #ffd34d; }
  .sl-tarj.roja { background: #ff4d4d; }

  /* Resumen del partido */
  /* Todo el resumen usa la misma escala: etiquetas .68-.72rem en mayúscula,
     texto .8-.84rem, nombres .88rem y números grandes en Bebas. */
  .sl-res { margin-top: 1rem; background: var(--gdt-surface-1); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-lg);
            padding: 1rem 1.1rem 1.1rem; }
  .sl-res-cab { display: flex; align-items: center; justify-content: space-between; gap: .4rem .75rem; flex-wrap: wrap; margin-bottom: .35rem; }
  .sl-res-cab h2 { margin: 0; font-size: var(--sl-fs-xs); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .1em; color: var(--gdt-text-mid); }
  .sl-res-fuente { font-size: var(--sl-fs-xs); font-weight: 600; line-height: 1.4; color: var(--gdt-text-mid); background: var(--gdt-surface-2);
                   border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-pill); padding: .12rem .6rem; }
  .sl-res-carga { margin: .6rem 0 0; font-size: var(--sl-fs-xs); line-height: 1.45; color: var(--gdt-text-lo); }
  /* Los dos equipos arriba de cada pestaña (mismas columnas que Cómo fue) */
  .sl-rs-eqs { display: grid; grid-template-columns: minmax(0, 1fr) 54px minmax(0, 1fr); align-items: center; margin-bottom: .8rem;
               font-size: var(--sl-fs-md); font-weight: 700; }
  .sl-rs-eqs > span { display: flex; align-items: center; gap: .5rem; min-width: 0; }
  .sl-rs-eqs .l { grid-column: 1; justify-content: flex-end; text-align: right; color: var(--gdt-accent); }
  .sl-rs-eqs .v { grid-column: 3; color: var(--sl-visit); }
  .sl-rs-nom { min-width: 0; line-height: 1.25; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .sl-rs-eqs .sl-esc, .sl-rs-eqs .sl-ini { width: 26px; height: 26px; font-size: var(--sl-fs-xs); flex: none; }
  /* Cómo fue: línea de tiempo con el minuto en el medio */
  .sl-cf-chips { display: flex; justify-content: center; flex-wrap: wrap; gap: .4rem; margin-bottom: .9rem; }
  .sl-cf-chip { font: inherit; font-size: var(--sl-fs-xs); font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem;
                padding: .3rem .75rem; border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border);
                background: transparent; color: var(--gdt-text-mid); }
  .sl-cf-chip svg { width: 14px; height: 14px; }
  .sl-cf-chip b { color: var(--gdt-text-hi); }
  .sl-cf-chip.on { color: var(--gdt-warn); border-color: rgba(255, 179, 0, .45); background: rgba(255, 179, 0, .1); }
  .sl-cf-chip[data-cf="afuera"].on { color: var(--gdt-text-hi); border-color: var(--gdt-border-hi); background: var(--gdt-surface-2); }
  .sl-cf-fila { display: grid; grid-template-columns: minmax(0, 1fr) 54px minmax(0, 1fr); align-items: center; }
  .sl-cf-lista { list-style: none; margin: 0; padding: 0; }
  /* La línea del medio la dibuja cada renglón: así termina justo en el "Final" */
  .sl-cf-lista > li { position: relative; }
  .sl-cf-lista > li::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; margin-left: -.5px; background: var(--gdt-border); }
  .sl-cf-lista > li.fin::before { bottom: 50%; }
  .sl-cf-fila { padding: .3rem 0; }
  .sl-cf-fila.t-atajada, .sl-cf-fila.t-afuera { display: none; }
  .sl-cf.ver-atajada .t-atajada, .sl-cf.ver-afuera .t-afuera { display: grid; }
  .sl-cf-min { grid-column: 2; justify-self: center; position: relative; z-index: 1; min-width: 38px; height: 26px; padding: 0 .35rem;
               display: inline-grid; place-items: center; border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border);
               background: var(--gdt-surface-1); font-size: var(--sl-fs-xs); font-weight: 700; color: var(--gdt-text-lo);
               font-variant-numeric: tabular-nums; white-space: nowrap; }
  .t-gol .sl-cf-min { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line);
                      background: linear-gradient(var(--gdt-accent-soft), var(--gdt-accent-soft)), var(--gdt-surface-1); }
  .sl-cf-lado { display: flex; align-items: center; gap: .5rem; min-width: 0; }
  .sl-cf-fila > .sl-cf-lado:first-child { flex-direction: row-reverse; text-align: right; }
  .sl-cf-ic { flex: none; width: 18px; height: 18px; display: grid; place-items: center; color: var(--gdt-text-mid); }
  .sl-cf-ic svg { width: 16px; height: 16px; }
  .t-gol .sl-cf-ic { color: var(--gdt-text-hi); }
  .sl-cf-txt { min-width: 0; display: grid; gap: 1px; }
  .sl-cf-txt b { display: flex; align-items: center; gap: .4rem; min-width: 0; font-size: var(--sl-fs-md); color: var(--gdt-text-hi); }
  .sl-cf-fila > .sl-cf-lado:first-child .sl-cf-txt b { justify-content: flex-end; }
  /* Los nombres largos pasan a un segundo renglón en vez de cortarse */
  .sl-cf-nom { min-width: 0; overflow: hidden; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .sl-cf-vivo { margin-top: 1rem; padding-top: .7rem; border-top: 1px solid var(--gdt-border); }
  .t-gol .sl-cf-txt b { font-size: var(--sl-fs-base); }
  .t-afuera .sl-cf-txt b { color: var(--gdt-text); font-weight: 600; }
  .sl-cf-txt small { font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); overflow-wrap: anywhere; }
  .t-atajada .sl-cf-txt small { color: var(--gdt-warn); opacity: .8; }
  .sl-cf-marc { flex: none; display: inline-block; padding: 0 .35rem; border-radius: 4px; background: var(--gdt-accent-soft);
                color: var(--gdt-accent-hi); font-size: var(--sl-fs-xs); font-variant-numeric: tabular-nums; vertical-align: 1px; }
  .sl-cf-sep { display: flex; justify-content: center; padding: .55rem 0; }
  .sl-cf-sep span { position: relative; z-index: 1; background: var(--gdt-surface-1); border: 1px solid var(--gdt-border);
                    border-radius: var(--gdt-r-pill); padding: .25rem .8rem; font-size: var(--sl-fs-xs); font-weight: 700;
                    letter-spacing: .1em; text-transform: uppercase; color: var(--gdt-text-mid); }
  .sl-cf-sep.fin span { color: var(--gdt-text-hi); border-color: var(--gdt-border-hi); }
  /* Tiros: media cancha por equipo */
  .sl-tr-ley { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1rem; margin-bottom: 1rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); }
  .sl-tr-ley > span { display: inline-flex; align-items: center; gap: .35rem; }
  .sl-tr-ley i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: none; }
  .sl-tr-ley .sl-tr-xg i { background: var(--gdt-text-lo); }
  .sl-tr-ley .sl-tr-xg i.ch { width: 5px; height: 5px; }
  .sl-tr-ley .sl-tr-xg i.gr { width: 11px; height: 11px; margin-left: -.15rem; }
  .sl-tr-ley i.gol { background: var(--gdt-accent); }
  .sl-tr-ley i.atajada { background: var(--sl-atajada); }
  .sl-tr-ley i.afuera { border: 1.5px solid #9aa4b2; }
  .sl-tr-w { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; }
  /* La jugada (recorridos, plugin 0.9.6+): ventana arriba de todo con la cancha entera */
  .sl-rec-ver { margin-left: .4rem; padding: .12rem .55rem; border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-accent-line);
                background: var(--gdt-accent-soft); color: var(--gdt-accent-hi); font: inherit; font-size: var(--sl-fs-xs); font-weight: 700; cursor: pointer; white-space: nowrap; }
  .sl-rec-ver:hover { background: rgba(0, 224, 90, .2); }
  .sl-rec-fondo { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 12px; background: rgba(0, 0, 0, .72); }
  .sl-rec-caja { position: relative; width: 100%; max-width: 30rem; max-height: calc(100vh - 24px); overflow-y: auto; padding: 1rem 1rem .9rem;
                 border-radius: var(--gdt-r-lg, 14px); background: var(--gdt-surface-1); border: 1px solid var(--gdt-border); box-shadow: 0 20px 60px rgba(0,0,0,.6); }
  .sl-rec-x { position: absolute; top: .55rem; right: .55rem; width: 2rem; height: 2rem; border-radius: 50%; border: 1px solid var(--gdt-border);
              background: var(--gdt-surface-2); color: var(--gdt-text-hi); font-size: 1rem; line-height: 1; cursor: pointer; }
  .sl-rec-tit { margin: 0 2.4rem .15rem 0; font-size: var(--sl-fs-base); font-weight: 700; color: var(--gdt-text-hi); }
  .sl-rec-cola { display: flex; align-items: center; justify-content: center; gap: .6rem; margin: .35rem 0 .2rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); }
  .sl-rec-cola span { font-weight: 700; color: var(--gdt-text-hi); font-variant-numeric: tabular-nums; }
  .sl-rec-cola button { padding: .25rem .7rem; border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border); background: var(--gdt-surface-2);
                        color: var(--gdt-text); font: inherit; font-size: var(--sl-fs-xs); font-weight: 700; cursor: pointer; }
  .sl-rec-cola button:disabled { opacity: .4; cursor: default; }
  .sl-rec-c circle.festejo { fill: none; stroke: var(--gdt-accent-hi); display: none; pointer-events: none; }
  .sl-cf-ver { display: block; margin-top: .25rem; }
  .sl-cf-ver .sl-rec-ver { margin-left: 0; }
  .sl-cf-fila > .sl-cf-lado:first-child .sl-cf-ver { text-align: right; }
  .sl-cf-goles { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); }
  .sl-rec-sub { margin: 0 0 .6rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-rec-c { display: block; width: 100%; max-width: 21rem; margin: 0 auto; }
  .sl-rec-c path.cam { fill: none; stroke: #fff; stroke-linecap: round; stroke-dasharray: 1.1 .9; }
  .sl-rec-c path.tiro { fill: none; stroke-width: .9; stroke-linecap: round; }
  .sl-rec-c path.tiro.gol { stroke: var(--gdt-accent); }
  .sl-rec-c path.tiro.atajada { stroke: var(--sl-atajada); }
  .sl-rec-c path.tiro.afuera { stroke: #b8c0cc; }
  .sl-rec-c path.tiro.pase { stroke: var(--sl-clave); }
  .sl-rec-c path.cam.desp { stroke-opacity: .35; }
  .sl-an-lista li .sl-rec-ver { float: right; margin: -.05rem 0 0 .4rem; }
  .sl-rec-c path.fl { fill: none; stroke: #fff; stroke-width: .45; stroke-linecap: round; stroke-linejoin: round; }
  .sl-rec-c circle.ini { fill: none; stroke: #fff; stroke-width: .4; stroke-opacity: .8; }
  .sl-rec-c circle.j { stroke: #000; stroke-opacity: .5; stroke-width: .3; fill-opacity: .9; }
  .sl-rec-c circle.j.l { fill: var(--gdt-accent); }
  .sl-rec-c circle.j.v { fill: var(--sl-visit); }
  .sl-rec-c circle.j.tira { stroke: #fff; stroke-opacity: 1; stroke-width: .55; }
  .sl-rec-c circle.toq { fill: #fff; stroke: #000; stroke-opacity: .5; stroke-width: .25; }
  .sl-rec-c text { font-size: 2.6px; font-weight: 700; fill: #fff; text-anchor: middle; paint-order: stroke; stroke: rgba(0,0,0,.8); stroke-width: .7px; pointer-events: none; }
  .sl-rec-c text.tira { font-size: 3px; }
  .sl-rec-seq { margin: .7rem 0 0; font-size: var(--sl-fs-sm); line-height: 1.5; text-align: center; color: var(--gdt-text); }
  .sl-rec-seq b { color: var(--gdt-text-hi); }
  .sl-rec-ley { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem .8rem; margin: .5rem 0 0; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-rec-ley span { display: inline-flex; align-items: center; gap: .3rem; }
  .sl-rec-ley i { display: inline-block; width: 16px; height: 0; border-top: 1.5px dashed #fff; }
  .sl-rec-ley i.t { border-top-style: solid; border-top-width: 2.5px; border-color: var(--gdt-accent); }
  .sl-rec-ley i.p { width: 9px; height: 9px; border: 0; border-radius: 50%; background: var(--gdt-accent); }
  .sl-rec-ley i.p.v { background: var(--sl-visit); }
  .sl-rec-carga { padding: 2rem 0; text-align: center; font-size: var(--sl-fs-md); color: var(--gdt-text-lo); }
  /* Animación: el dibujo fijo queda tenue y se mueven la pelota (con estela) y los jugadores */
  .sl-rec-c .anim { display: none; }
  .sl-rec-c.anima .anim { display: inline; }
  .sl-rec-c.anima .fijo { opacity: .16; }
  .sl-rec-c path.rastro { fill: none; stroke: #fff; stroke-linecap: round; }
  .sl-rec-c circle.bola { fill: #fff; stroke: #000; stroke-opacity: .6; }
  .sl-rec-c circle.sombra { fill: #000; fill-opacity: .45; }
  .sl-rec-c circle.aj { stroke: #000; stroke-opacity: .5; fill-opacity: .95; }
  .sl-rec-c circle.aj.l { fill: var(--gdt-accent); }
  .sl-rec-c circle.aj.v { fill: var(--sl-visit); }
  .sl-rec-c circle.aj.tira { stroke: #fff; stroke-opacity: 1; }
  .sl-rec-c text.cartel { fill: #ffd34d; }
  .sl-rec-c text.cartel.gol { fill: var(--gdt-accent-hi); }
  .sl-rec-ctl { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .4rem; margin: .6rem 0 0; }
  .sl-rec-ctl button { display: inline-flex; align-items: center; gap: .35rem; padding: .32rem .8rem; border-radius: var(--gdt-r-pill); cursor: pointer;
                       border: 1px solid var(--gdt-border); background: var(--gdt-surface-2); color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-xs); font-weight: 700; }
  .sl-rec-ctl button.play { border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); color: var(--gdt-accent-hi); min-width: 7.6rem; justify-content: center; }
  .sl-rec-ctl button.on { border-color: #ffd34d; color: #ffd34d; background: rgba(255, 211, 77, .1); }
  .sl-rec-linea { display: grid; grid-template-columns: minmax(0, 1fr) 4.2rem; align-items: center; gap: .6rem; margin: .5rem 0 0; }
  .sl-rec-linea input { width: 100%; accent-color: var(--gdt-accent); }
  .sl-rec-linea span { font-size: var(--sl-fs-xs); font-weight: 700; text-align: right; color: var(--gdt-text); font-variant-numeric: tabular-nums; }
  .sl-tr-col { min-width: 0; }
  .sl-tr-col h3 { display: flex; align-items: center; gap: .45rem; min-width: 0; margin: 0 0 .6rem; font-size: var(--sl-fs-md); font-weight: 700; color: var(--gdt-accent); }
  .sl-tr-col h3 span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-tr-col h3 .sl-esc, .sl-tr-col h3 .sl-ini { width: 22px; height: 22px; font-size: var(--sl-fs-xs); flex: none; }
  .sl-tr-col.v h3 { color: var(--sl-visit); }
  .sl-tr-res { display: flex; gap: .4rem; margin: 0 0 .6rem; }
  .sl-tr-res > div { flex: 1 1 0; min-width: 0; display: grid; justify-items: center; gap: .15rem; padding: .4rem .25rem;
                     background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-md); }
  .sl-tr-res b { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; font-weight: 400; line-height: 1; letter-spacing: .02em; color: var(--gdt-text-hi); }
  .sl-tr-res span { font-size: var(--sl-fs-xs); font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--gdt-text-lo); white-space: nowrap; }
  .sl-tr { width: 100%; height: auto; display: block; border-radius: var(--gdt-r-md); border: 1px solid #1c3a22;
           background: linear-gradient(180deg, #0c2417 0%, #071710 100%); }
  .sl-tr rect, .sl-tr path { fill: none; stroke: var(--sl-linea); stroke-width: .35; }
  .sl-tr rect.arco { fill: rgba(255,255,255,.35); stroke: none; }
  .sl-tr circle.p { fill: rgba(255,255,255,.3); }
  .sl-tr-g { cursor: pointer; outline: none; }
  .sl-tr circle.hit { fill: transparent; stroke: none; }
  .sl-tr circle.t { stroke-width: .35; }
  .sl-tr circle.gol { fill: var(--gdt-accent); stroke: #052; }
  .sl-tr circle.atajada { fill: var(--sl-atajada); fill-opacity: .85; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.afuera { fill: rgba(154,164,178,.15); stroke: #9aa4b2; }
  .sl-tr-g:hover circle.t, .sl-tr-g:focus-visible circle.t, .sl-tr-g.sel circle.t { stroke: #fff; stroke-width: .7; stroke-opacity: 1; }
  .sl-tr-det { margin-top: .6rem; min-height: 2.6em; padding: .5rem .7rem; font-size: var(--sl-fs-sm); line-height: 1.4; color: var(--gdt-text-mid);
                background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-md); }
  .sl-tr-det ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; color: var(--gdt-text-hi); }
  .sl-tr-n { display: block; margin-bottom: .25rem; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gdt-text-lo); }
  @media (max-width: 600px) {
    .sl-tr-w { grid-template-columns: minmax(0, 1fr); }
  }
  /* Mapa en vivo: remates (como "Tiros"), faltas y calor, con cancha entera */
  .sl-mp-seg { margin-bottom: .9rem; }
  .sl-tr circle.c { fill: none; stroke: var(--sl-linea); stroke-width: .35; }
  .sl-tr circle.falta { fill: var(--sl-falta); fill-opacity: .85; stroke: #000; stroke-opacity: .4; }
  .sl-tr-ley i.falta { background: var(--sl-falta); }
  /* Recuperaciones, intercepciones, bloqueos y pérdidas (plugin 0.9+) */
  .sl-tr circle.recup { fill: var(--sl-recup); fill-opacity: .85; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.intercep { fill: var(--sl-intercep); fill-opacity: .8; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.intercep.imp { fill-opacity: 1; stroke: #fff; stroke-opacity: .9; stroke-width: .5; }
  .sl-tr circle.bloq { fill: var(--sl-bloq); fill-opacity: .9; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.perd { fill: var(--sl-perd); fill-opacity: .85; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.perd.pase { fill: rgba(255,107,107,.12); stroke: #ff6b6b; stroke-opacity: 1; }
  .sl-tr circle.perd.afuera { fill: none; stroke: #ffb3b3; stroke-opacity: 1; stroke-dasharray: .7 .5; }
  .sl-tr circle.tenue.afuera { fill: none; stroke: #ffb3b3; stroke-opacity: .6; stroke-width: .3; }
  .sl-tr circle.tenue { fill-opacity: .55; stroke: none; pointer-events: none; }
  .sl-tr circle.tenue.pase { fill: none; stroke: #ff6b6b; stroke-opacity: .6; stroke-width: .3; }
  .sl-tr-ley i.recup { background: var(--sl-recup); }
  .sl-tr-ley i.intercep { background: var(--sl-intercep); }
  .sl-tr-ley i.intercep.imp { width: 12px; height: 12px; box-shadow: 0 0 0 1.5px #fff inset; }
  .sl-tr-ley i.bloq { background: var(--sl-bloq); }
  .sl-tr-ley i.perd { background: var(--sl-perd); }
  .sl-tr-ley i.perd.pase { background: transparent; border: 1.5px solid #ff6b6b; }
  .sl-tr-ley i.perd.afuera { background: transparent; border: 1.5px dashed #ffb3b3; }
  .sl-mp-pel { margin-bottom: .8rem; }
  /* Análisis: contraataques y pelota parada */
  .sl-an-intro { margin: 0 0 .9rem; text-align: center; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-an-sec + .sl-an-sec { margin-top: 1.6rem; padding-top: 1.2rem; border-top: 1px solid var(--gdt-border); }
  .sl-an-tit { margin: 0 0 .35rem; text-align: center; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gdt-text-hi); }
  .sl-tr path.sl-an-flecha { stroke: var(--sl-recup); stroke-width: .55; stroke-opacity: .75; stroke-dasharray: 1.4 .9; }
  .sl-tr path.sl-an-flecha.gol { stroke: var(--gdt-accent); stroke-opacity: .95; }
  .sl-tr circle.sl-an-ini { fill: none; stroke: var(--sl-recup); stroke-width: .45; }
  .sl-tr circle.sl-an-ini.gol { stroke: var(--gdt-accent); }
  .sl-tr circle.sl-an-ini.clave { stroke: var(--sl-clave); }
  .sl-tr circle.sl-an-ini.clave.gol { stroke: var(--sl-gol); }
  .sl-tr-ley i.sl-an-i.clave { border-color: var(--sl-clave); }
  .sl-tr circle.sl-an-fin { fill: #e8edf2; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.sl-an-corner { fill: var(--sl-corner); fill-opacity: .55; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.sl-an-libre { fill: var(--sl-falta); fill-opacity: .55; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.sl-an-lateral { fill: var(--sl-lateral); fill-opacity: .5; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.rem { fill-opacity: 1; stroke: #fff; stroke-opacity: .95; stroke-width: .5; }
  .sl-tr circle.sl-an-corner.gol, .sl-tr circle.sl-an-libre.gol, .sl-tr circle.sl-an-lateral.gol { fill: var(--gdt-accent); fill-opacity: 1; stroke: #fff; stroke-width: .5; }
  .sl-tr-ley i.sl-an-i { background: transparent; border: 1.5px solid var(--sl-recup); }
  .sl-tr-ley i.sl-an-f { background: #e8edf2; }
  .sl-tr-ley i.sl-an-corner { background: var(--sl-corner); }
  .sl-tr-ley i.sl-an-libre { background: var(--sl-falta); }
  .sl-tr-ley i.sl-an-lateral { background: var(--sl-lateral); }
  .sl-tr-ley i.sl-an-rem { background: transparent; box-shadow: 0 0 0 1.5px #fff inset; }
  .sl-an-lista { list-style: none; margin: .6rem 0 0; padding: 0; display: grid; gap: .3rem; font-size: var(--sl-fs-xs); line-height: 1.35; color: var(--gdt-text); }
  .sl-an-lista li { padding: .35rem .55rem; border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); }
  .sl-an-lista li.gol { border-color: var(--gdt-accent-line); color: var(--gdt-text-hi); }
  .sl-an-nada { margin: .6rem 0 0; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  /* Velocidad de los remates: de más flojo (amarillo) a más fuerte (rojo) */
  .sl-tr circle.sl-an-v1 { fill: #ffe08a; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.sl-an-v2 { fill: #ff9f43; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.sl-an-v3 { fill: #ff4d4d; stroke: #000; stroke-opacity: .4; }
  .sl-tr circle.sl-an-vg { stroke: #fff; stroke-opacity: 1; stroke-width: .6; }
  .sl-tr-ley i.sl-an-v1 { background: #ffe08a; }
  .sl-tr-ley i.sl-an-v2 { background: #ff9f43; }
  .sl-tr-ley i.sl-an-v3 { background: #ff4d4d; }
  .sl-an-vel li { display: grid; grid-template-columns: 4.6rem 1fr; gap: .1rem .5rem; align-items: center; }
  .sl-an-vel li b { font-variant-numeric: tabular-nums; color: var(--gdt-text-hi); white-space: nowrap; }
  .sl-an-vel li span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-an-vel li i { grid-column: 1 / -1; display: block; height: 3px; border-radius: 2px; background: var(--gdt-surface-3, rgba(255,255,255,.08)); }
  .sl-an-vel li i i { height: 100%; background: #ff9f43; }
  /* Dominio del campo */
  .sl-tr text.sl-an-dom-n { font-size: 6.5px; font-weight: 800; fill: #fff; text-anchor: middle; paint-order: stroke; stroke: rgba(0,0,0,.7); stroke-width: 1.1px; }
  .sl-tr path.sl-an-dom-l { stroke: #fff; stroke-width: .35; stroke-opacity: .55; }
  .sl-tr text.sl-an-dom-t { font-size: 3.4px; font-weight: 700; fill: #fff; text-anchor: end; paint-order: stroke; stroke: rgba(0,0,0,.65); stroke-width: .8px; }
  /* Red de pases por zonas (1.65.0) */
  .sl-an-zr { fill: var(--sl-local); fill-opacity: calc(.04 + var(--t, 0) * .55); stroke: rgba(255,255,255,.18); stroke-width: .25; }
  .sl-tr-col.v .sl-an-zr { fill: var(--sl-visit); }
  text.sl-an-zt { fill: var(--gdt-text-hi); font-size: 4px; font-weight: 700; opacity: .8; }
  .sl-an-zf line { stroke: #fff; stroke-opacity: .85; stroke-linecap: round; }
  .sl-an-zf polygon { fill: #fff; fill-opacity: .9; }
  text.sl-an-zn { fill: #fff; font-size: 3.2px; font-weight: 700; text-anchor: middle; paint-order: stroke; stroke: #000; stroke-width: .6px; }
  .sl-an-zr-i { display: inline-block; width: 12px; height: 12px; border-radius: 2px; background: var(--sl-local); opacity: .6; }
  /* Formación real: franjas de la cancha (1.65.0). --t = qué parte del tiempo de esa línea (0..1) */
  .sl-an-fj { width: 100%; border-collapse: separate; border-spacing: 2px; margin-top: .5rem; font-size: var(--sl-fs-sm); font-variant-numeric: tabular-nums; }
  .sl-an-fj caption { caption-side: top; text-align: left; color: var(--gdt-text-mid); font-size: var(--sl-fs-xs); padding-bottom: .25rem; }
  .sl-an-fj th { color: var(--gdt-text-mid); font-weight: 600; text-align: left; padding: .2rem .35rem; white-space: nowrap; }
  .sl-an-fj thead th { text-align: center; }
  .sl-an-fj td { text-align: center; padding: .3rem .2rem; border-radius: 4px; color: var(--gdt-text-hi);
    background: color-mix(in srgb, var(--sl-local) calc(var(--t, 0) * 70%), var(--gdt-surface-2)); }
  .sl-tr-col.v .sl-an-fj td { background: color-mix(in srgb, var(--sl-visit) calc(var(--t, 0) * 70%), var(--gdt-surface-2)); }
  .sl-an-car { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin-top: .35rem; }
  .sl-an-car span { display: grid; gap: .1rem; padding: .35rem .45rem; border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); text-align: center; }
  .sl-an-car b { font-size: var(--sl-fs-md); color: var(--gdt-text-hi); font-variant-numeric: tabular-nums; }
  .sl-an-car small { font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-an-car i { display: block; height: 3px; border-radius: 2px; background: rgba(255,255,255,.08); }
  .sl-an-car i i { height: 100%; background: var(--gdt-accent); }
  /* Cómo se paró: el bloque sin pelota (lleno) y con pelota (punteado) */
  .sl-an-etq { margin: .5rem 0 0; font-size: var(--sl-fs-xs); text-align: center; color: var(--gdt-text); }
  .sl-an-etq b { color: var(--gdt-text-hi); }
  .sl-an-car small + small { font-size: var(--sl-fs-xs); line-height: 1.2; }
  .sl-an-car span { min-width: 0; }
  /* Formación real: selector Todo / Con / Sin la pelota */
  .sl-an-fseg { display: flex; justify-content: center; margin: .2rem auto .6rem; width: max-content; max-width: 100%; }
  .sl-an-nota { margin: .3rem 0 0; font-size: var(--sl-fs-xs); text-align: center; color: var(--gdt-text-lo); }
  /* Red de pases (rehecha 7-oct): flechas por sentido, el eje y la sociedad en dorado, etiquetas con fondo */
  .sl-tr .sl-an-rl path { stroke: #dfe9f7; stroke-linecap: round; fill: none; }
  .sl-tr .sl-an-rl path.pt { fill: #dfe9f7; stroke: none; }
  .sl-tr .sl-an-rl.soc path { stroke: var(--sl-destacado); }
  .sl-tr .sl-an-rl.soc path.pt { fill: var(--sl-destacado); stroke: none; }
  .sl-tr circle.sl-an-rn { fill: var(--gdt-accent); fill-opacity: .9; stroke: #04140a; stroke-width: .5; }
  .sl-tr circle.sl-an-rn.v { fill: var(--sl-visit); stroke: #050c1c; }
  .sl-tr circle.sl-an-rn.eje { stroke: var(--sl-destacado); stroke-width: .9; }
  .sl-tr circle.sl-an-rn.arq { fill: #0a1a12; stroke: #c9d3e0; stroke-width: .6; stroke-dasharray: .9 .5; }
  .sl-tr .sl-an-re rect { fill: rgba(4,12,8,.86); stroke: var(--sl-linea); stroke-width: .25; }
  .sl-tr .sl-an-re.eje rect { stroke: #ffd34d; stroke-width: .35; }
  .sl-tr .sl-an-re text { font-size: 2.7px; font-weight: 700; fill: #fff; text-anchor: middle; pointer-events: none; }
  .sl-tr .sl-an-re { pointer-events: none; }
  .sl-tr-ley i.sl-an-rn { background: var(--gdt-accent); }
  .sl-tr-ley i.sl-an-rn.eje { background: var(--gdt-accent); box-shadow: 0 0 0 2px #ffd34d inset; }
  .sl-tr-ley i.sl-an-rl { width: 16px; height: 0; border-radius: 0; background: none; border-top: 2px solid #dfe9f7; position: relative; }
  .sl-tr-ley i.sl-an-rl::after { content: ''; position: absolute; right: -2px; top: -5px; border-left: 6px solid #dfe9f7; border-top: 4px solid transparent; border-bottom: 4px solid transparent; }
  .sl-tr-ley i.sl-an-rl.soc { border-top-color: #ffd34d; }
  .sl-tr-ley i.sl-an-rl.soc::after { border-left-color: #ffd34d; }
  .sl-an-red-fr { margin: .1rem 0 .2rem; font-size: var(--sl-fs-md); }
  .sl-an-sub { margin: 0 0 .55rem; font-size: var(--sl-fs-xs); line-height: 1.4; text-align: center; color: var(--gdt-text-mid); }
  .sl-an-red-car { list-style: none; margin: .55rem 0 0; padding: 0; display: grid; gap: .3rem; }
  .sl-an-red-car li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .1rem .5rem; padding: .4rem .6rem;
                      border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); }
  .sl-an-red-car small { font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gdt-text-lo); }
  .sl-an-red-car b { grid-column: 1 / -1; grid-row: 2; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--sl-fs-sm); color: var(--gdt-text-hi); }
  .sl-an-red-car span { font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); white-space: nowrap; font-variant-numeric: tabular-nums; }
  .sl-an-red-car li:first-child { box-shadow: inset 3px 0 0 #ffd34d; }
  .sl-an-lista li small { color: var(--gdt-text-lo); }
  /* Pases clave */
  .sl-tr path.sl-an-cl { stroke: var(--sl-clave); stroke-linecap: round; }
  .sl-rec-c path.tiro.pase.clave { stroke: var(--sl-clave); stroke-opacity: .95; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .sl-rec-c circle.clave-ini { fill: #0a1a12; stroke: var(--sl-clave); }
  .sl-tr path.sl-an-cl.gol { stroke: var(--gdt-accent); }
  .sl-tr circle.sl-an-cl-f { fill: var(--sl-clave); stroke: #000; stroke-opacity: .45; }
  .sl-tr-ley i.sl-an-cl-f { background: var(--sl-clave); }
  /* Estilo de juego: una tarjeta por etiqueta, con el color de su grupo */
  .sl-es { --es-c: #4fc3f7; }
  .sl-es.g-sin { --es-c: #ff9f43; }
  .sl-es.g-por { --es-c: #3ddc97; }
  .sl-es.g-rem { --es-c: #dbe4ee; }
  .sl-es-frase { margin: 0 0 .7rem; font-size: var(--sl-fs-base); font-weight: 700; line-height: 1.35; text-align: center; color: var(--gdt-text-hi); }
  .sl-es-frase.nada { font-size: var(--sl-fs-sm); font-weight: 400; color: var(--gdt-text-lo); }
  .sl-es-lista { display: grid; gap: .5rem; }
  .sl-es { padding: .55rem .7rem .6rem; border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border);
           box-shadow: inset 3px 0 0 var(--es-c); }
  .sl-es-n { display: inline-block; margin-bottom: .3rem; padding: .12rem .55rem; border-radius: 999px; font-size: var(--sl-fs-xs); font-weight: 700;
             color: #0b1a10; background: var(--es-c); }
  .sl-es-p { margin: 0 0 .45rem; font-size: var(--sl-fs-xs); line-height: 1.4; color: var(--gdt-text); }
  .sl-es-b { display: grid; grid-template-columns: minmax(0, 6.5rem) minmax(2.5rem, 1fr) 2.6rem; align-items: center; gap: .2rem .45rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-es-b > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-es-b > i { display: block; height: 6px; border-radius: 3px; background: rgba(255,255,255,.07); }
  .sl-es-b > i i { display: block; height: 100%; border-radius: 3px; background: rgba(255,255,255,.3); }
  .sl-es-b > i.yo i { background: var(--gdt-accent); }
  .sl-tr-col.v .sl-es-b > i.yo i { background: var(--sl-visit); }
  .sl-es-b b { text-align: right; font-variant-numeric: tabular-nums; color: var(--gdt-text); }
  .sl-es-b b.yo { color: var(--gdt-text-hi); }
  .sl-es-b small { grid-column: 1 / -1; font-size: var(--sl-fs-xs); }
  .sl-es-ley { display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem .8rem; margin: 0 0 .8rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-es-ley span { display: inline-flex; align-items: center; gap: .3rem; }
  .sl-es-ley i { width: 10px; height: 10px; border-radius: 50%; }
  /* Arqueros */
  .sl-an-arq + .sl-an-arq { margin-top: 1rem; padding-top: .8rem; border-top: 1px dashed var(--gdt-border); }
  .sl-an-arq-n { margin: .2rem 0 .3rem; font-size: var(--sl-fs-md); font-weight: 700; color: var(--gdt-text-hi); text-align: center; }
  .sl-an-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem; margin-bottom: .45rem; }
  .sl-an-chip { padding: .15rem .55rem; border-radius: 999px; font-size: var(--sl-fs-xs); font-weight: 600; color: #0b1a10; background: #ffd34d; cursor: help; }
  .sl-an-chip.vacio { background: var(--gdt-surface-2); color: var(--gdt-text-lo); font-weight: 400; cursor: default; }
  .sl-tr.sl-an-arq-c { aspect-ratio: 52 / 25.4; }
  .sl-tr path.sl-an-arq-z { stroke: #ffd34d; stroke-width: .3; stroke-opacity: .5; stroke-dasharray: 1 1; }
  .sl-tr circle.sl-an-arq-p { fill: var(--sl-atajada); stroke: #000; stroke-opacity: .5; stroke-width: .3; }
  .sl-tr circle.sl-an-arq-p.rech { fill: none; stroke: var(--sl-atajada); stroke-opacity: 1; stroke-width: .6; }
  .sl-tr-ley i.sl-an-arq-p { background: var(--sl-atajada); }
  .sl-tr-ley i.sl-an-arq-p.rech { background: transparent; border: 2px solid var(--sl-atajada); }
  .sl-an-arq .sl-an-car { grid-template-columns: repeat(auto-fit, minmax(5.2rem, 1fr)); }
  .sl-mp-arq { margin: .4rem 0 .2rem; padding: .5rem .55rem .6rem; border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); }
  .sl-mp-arq .sl-mp-bt { margin-top: 0; text-align: center; }
  .sl-mp-arq .sl-an-car { grid-template-columns: repeat(auto-fit, minmax(4.8rem, 1fr)); }
  .sl-mp-arq .sl-tr-det { margin-top: .3rem; min-height: 0; font-size: var(--sl-fs-xs); }
  .sl-jg-seg.sl-mp-seg, .sl-jg-seg.sl-mp-pel { flex-wrap: wrap; overflow: visible; }   /* en el celu bajan de renglón en vez de cortarse */
  /* Recuperaciones: qué es, comparación, cancha por zonas y quién */
  .sl-pel { --pel-c: #3ddc97; }
  .sl-pel.t-intercep { --pel-c: var(--sl-intercep); }
  .sl-pel.t-bloq { --pel-c: var(--sl-bloq); }
  .sl-pel.t-perd { --pel-c: var(--sl-perd); }
  .sl-pel.t-desp { --pel-c: var(--sl-desp); }
  /* Despejes: zoom a su área; aro blanco si fue de centro, con la línea desde donde vino */
  .sl-tr.sl-desp-c { aspect-ratio: 68 / 37.4; }
  .sl-tr circle.desp { fill: var(--sl-desp); fill-opacity: .9; stroke: #000; stroke-opacity: .45; stroke-width: .3; }
  .sl-tr circle.desp.centro { stroke: #fff; stroke-opacity: 1; stroke-width: .55; }
  .sl-tr path.sl-desp-l { stroke: #ffb020; stroke-width: .45; stroke-opacity: .8; stroke-dasharray: 1.2 .8; fill: none; }
  .sl-tr circle.sl-desp-o { fill: none; stroke: #ffb020; stroke-width: .35; stroke-opacity: .8; }
  .sl-tr-ley i.desp { background: var(--sl-desp); }
  .sl-tr-ley i.desp.centro { box-shadow: 0 0 0 1.5px #fff inset; }
  .sl-tr-ley i.sl-desp-l { width: 14px; height: 0; border-radius: 0; background: none; border-top: 1.5px dashed #ffb020; }
  .sl-pel-que { max-width: 38rem; margin: 0 auto .8rem; text-align: center; font-size: var(--sl-fs-sm); line-height: 1.45; color: var(--gdt-text-mid); }
  .sl-pel-cmp { margin: 0 0 1rem; padding: .7rem .85rem .5rem; background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-md); }
  .sl-pel-cmp .sl-rs-eqs { margin-bottom: .3rem; }
  .sl-pel-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .7rem; }
  .sl-pel-barra .sl-jg-seg { margin: 0; }
  .sl-pel-quitar { display: inline-flex; align-items: center; gap: .4rem; max-width: 100%; padding: .3rem .7rem; border-radius: var(--gdt-r-pill);
                   border: 1px solid var(--pel-c); background: transparent; color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-xs); cursor: pointer;
                   overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-pel-quitar span { color: var(--gdt-text-lo); }
  .sl-pel-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .9rem; }
  .sl-pel-cols .sl-tr-col h3 { font-size: var(--sl-fs-sm); }
  .sl-tr rect.sl-pel-z { fill: var(--pel-c); stroke: none; }
  .sl-tr path.sl-pel-tl { stroke: rgba(255,255,255,.22); stroke-width: .3; stroke-dasharray: 1 1; }
  .sl-pel-zn { fill: #fff; font-family: 'Bebas Neue', sans-serif; font-size: 8px; text-anchor: middle; pointer-events: none;
               paint-order: stroke; stroke: rgba(0,0,0,.45); stroke-width: .6px; }
  .sl-pel-zp { fill: rgba(255,255,255,.8); font-size: 3.4px; font-weight: 700; text-anchor: middle; pointer-events: none; }
  .sl-pel-zg:hover rect.sl-pel-z, .sl-pel-zg.sel rect.sl-pel-z { stroke: #fff; stroke-width: .5; }
  .sl-pel-lista { display: grid; gap: .25rem; }
  .sl-pel-j { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) auto; align-items: center; column-gap: .5rem; row-gap: .3rem; width: 100%;
              padding: .4rem .55rem; border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-md); background: var(--gdt-surface-2);
              color: inherit; font: inherit; text-align: left; cursor: pointer; }
  .sl-pel-j:hover { border-color: var(--gdt-border-hi); }
  .sl-pel-j.on { border-color: var(--pel-c); box-shadow: 0 0 0 1px var(--pel-c) inset; }
  .sl-pel-jn { display: grid; min-width: 0; }
  .sl-pel-jn b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--sl-fs-sm); color: var(--gdt-text-hi); }
  .sl-pel-jn small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-pel-jc { font-family: 'Bebas Neue', sans-serif; font-size: 1.35rem; line-height: 1; color: var(--gdt-text-hi); }
  .sl-pel-jb { grid-column: 1 / -1; display: block; height: 4px; border-radius: var(--gdt-r-pill); background: rgba(255,255,255,.06); overflow: hidden; }
  .sl-pel-jb i { display: block; height: 100%; border-radius: var(--gdt-r-pill); background: var(--pel-c); }
  .sl-pel-col .sl-tr-det { max-height: 12rem; overflow-y: auto; }
  .sl-pel-col .sl-mp-bt { margin-top: .8rem; }
  .sl-pel-j .sl-mp-pu.vacio { visibility: hidden; }
  @media (max-width: 460px) {
    .sl-pel-cols { grid-template-columns: minmax(0, 1fr); }
  }
  .sl-mp-dos .sl-tr-res span { white-space: normal; text-align: center; line-height: 1.15; }
  .sl-tr-w.sl-mp-dos { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .7rem; }
  .sl-mp-dos .sl-tr-col h3 { font-size: var(--sl-fs-sm); }
  .sl-mp-cal { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .sl-mp-grupos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: .8rem; }
  .sl-mp-grupos .sl-mp-eq + .sl-mp-eq { margin-top: 0; }
  .sl-mp-abajo { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 1rem; align-items: start; }
  .sl-mp-filas { display: grid; grid-template-columns: minmax(0, 1fr); gap: .2rem; }
  .sl-mp-fila { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; align-items: center; gap: .5rem; width: 100%;
                font: inherit; font-size: var(--sl-fs-xs); text-align: left; cursor: pointer; min-height: 32px; padding: .2rem .55rem;
                color: var(--gdt-text-mid); background: transparent; border: 1px solid transparent; border-radius: 8px; }
  .sl-mp-fila:hover { color: var(--gdt-text-hi); background: var(--gdt-surface-2); }
  .sl-mp-fila.on { color: var(--gdt-text-hi); border-color: var(--gdt-accent); background: var(--gdt-surface-2); }
  .sl-mp-eq.v .sl-mp-fila.on { border-color: var(--sl-visit); }
  .sl-mp-fila:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 1px; }
  .sl-mp-todo { font-style: italic; }
  .sl-mp-nom { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
  .sl-mp-min { font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); font-variant-numeric: tabular-nums; }
  .sl-mp-pu { display: inline-block; min-width: 2.3rem; text-align: center; font-size: var(--sl-fs-xs); font-weight: 800; letter-spacing: .03em;
              padding: .12rem .3rem; border-radius: 5px; background: var(--gdt-surface-2); color: var(--gdt-text-hi); border: 1px solid var(--gdt-border); }
  .sl-mp-pu.est { color: var(--gdt-text-lo); font-weight: 600; border-style: dashed; }
  .sl-mp-quien .sl-mp-pu { margin-right: .1rem; }
  .sl-mp-ficha { min-width: 0; }
  .sl-mp-nums { margin: 0 0 .5rem; font-size: var(--sl-fs-xs); color: var(--gdt-text); }
  .sl-mp-bt { margin: .5rem 0 .2rem; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gdt-text-lo); }
  .sl-mp-bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
  .sl-mp-bar span { position: relative; min-width: 0; padding: .3rem .4rem .45rem; background: var(--gdt-surface-2); border-radius: 6px; overflow: hidden; }
  .sl-mp-bar em { display: block; font-style: normal; font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sl-mp-bar b { display: block; font-size: var(--sl-fs-md); color: var(--gdt-text-hi); font-variant-numeric: tabular-nums; }
  .sl-mp-bar i { position: absolute; left: 0; bottom: 0; height: 3px; background: var(--gdt-accent); }
  .sl-mp-ficha.v .sl-mp-bar i { background: var(--sl-visit); }
  .sl-mp-aviso { margin: .5rem 0 0; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-tr circle.sl-mp-prom { fill: #fff; stroke: #000; stroke-width: .6; stroke-opacity: .7; }
  .sl-mp-esc em { display: inline-flex; align-items: center; gap: .3rem; margin-left: .7rem; font-style: normal; }
  .sl-mp-esc i.sl-mp-prom-ley { width: 9px; height: 9px; border-radius: 50%; background: #fff; border: 1px solid #000; }
  .sl-mp-cal .sl-tr { max-width: 280px; margin: 0 auto; }
  .sl-mp-eq + .sl-mp-eq { margin-top: .8rem; }
  .sl-mp-eqn { display: block; margin-bottom: .35rem; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gdt-accent); }
  .sl-mp-eq.v .sl-mp-eqn { color: var(--sl-visit); }
  .sl-mp-jugs { display: flex; flex-wrap: wrap; gap: .3rem; }
  .sl-mp-jugs button { font: inherit; font-size: var(--sl-fs-xs); font-weight: 700; cursor: pointer; background: transparent; min-height: 30px;
                       color: var(--gdt-text-mid); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-pill); padding: .25rem .65rem;
                       max-width: 11rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-mp-jugs button:hover { color: var(--gdt-text-hi); }
  .sl-mp-jugs button.on { color: var(--gdt-text-hi); border-color: var(--gdt-accent); background: var(--gdt-surface-2); }
  .sl-mp-jugs button:focus-visible, .sl-jg-seg button:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 1px; }
  .sl-mp-quien { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin: 0 0 .45rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); }
  .sl-mp-quien > span:not(.sl-mp-pu) { width: 100%; }
  .sl-mp-quien b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gdt-text-hi); }
  .sl-mp-esc { display: flex; align-items: center; justify-content: center; gap: .4rem; margin-top: .45rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-mp-esc i { width: 110px; height: 9px; border-radius: 5px; background: linear-gradient(90deg, rgb(40,60,170) 0%, rgb(25,170,230) 20%, rgb(40,210,110) 40%, rgb(250,225,50) 60%, rgb(255,135,25) 80%, rgb(225,15,15) 100%); }
  .sl-mp-desde { margin: .1rem auto .8rem; max-width: 36rem; text-align: center; font-size: var(--sl-fs-xs); color: var(--gdt-warn); }
  .sl-mp-nota { margin: .9rem 0 0; text-align: center; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }

  /* Formaciones: la cancha (acostada en la compu, parada en el celu) */
  .sl-fm-cancha { position: relative; aspect-ratio: 105 / 68; border-radius: var(--gdt-r-lg); border: 1px solid #1c3a22;
                  background: linear-gradient(90deg, rgba(255,255,255,.02) 50%, transparent 50%) 0 0 / 20% 100%,
                              linear-gradient(180deg, #0c2417 0%, #071710 100%); overflow: hidden; }
  .sl-fm-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
  .sl-fm-svg rect, .sl-fm-svg line, .sl-fm-svg circle { fill: none; stroke: var(--sl-linea); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
  .sl-fm-svg circle.p { fill: rgba(255,255,255,.25); stroke: none; }
  .sl-fm-svg.parada { display: none; }
  .sl-fm-eq { position: absolute; top: 8px; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
              max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-fm-eq.l { left: 10px; color: var(--gdt-accent); }
  .sl-fm-eq.v { right: 10px; color: var(--sl-visit); }
  .sl-fm-j { position: absolute; left: var(--lx); top: var(--ly); transform: translate(-50%, -50%); width: 86px;
             display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; z-index: 1; }
  .sl-fm-c { position: relative; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
             background: #0a1a12; border: 2px solid var(--gdt-accent); font-size: var(--sl-fs-xs); font-weight: 800; color: var(--gdt-text-hi); }
  .sl-fm-j.v .sl-fm-c { border-color: var(--sl-visit); }
  /* Formación real: un círculo por jugador con su puesto y el nombre abajo */
  .sl-tr .sl-an-fr circle { fill: #0a1a12; stroke: var(--gdt-accent); stroke-width: .7; }
  .sl-tr .sl-an-fr.v circle { stroke: var(--sl-visit); }
  .sl-tr .sl-an-fr.poco { opacity: .55; }
  .sl-tr .sl-an-fr text { text-anchor: middle; font-weight: 800; fill: #fff; }
  .sl-tr .sl-an-fr text.pu { font-size: 2.6px; }
  .sl-tr .sl-an-fr text.nm { font-size: 2.6px; font-weight: 600; paint-order: stroke; stroke: rgba(0,0,0,.8); stroke-width: .7px; }
  /* Formación real (rehecha 7-oct): las líneas, el arquero aparte, los que jugaron poco */
  .sl-tr .sl-an-fr circle { fill: var(--gdt-accent); fill-opacity: .9; stroke: #04140a; stroke-width: .5; }
  .sl-tr .sl-an-fr.v circle { fill: var(--sl-visit); stroke: #050c1c; }
  .sl-tr .sl-an-fr text.pu { font-size: 2.6px; font-weight: 800; fill: #04140a; }
  .sl-tr .sl-an-fr.v text.pu { fill: #fff; }
  .sl-tr .sl-an-fr.arq circle { fill: #0a1a12; stroke: #c9d3e0; stroke-width: .6; stroke-dasharray: .9 .5; }
  .sl-tr .sl-an-fr.arq text.pu { fill: #c9d3e0; }
  .sl-tr .sl-an-fr.poco circle { fill-opacity: .35; }
  .sl-tr .sl-an-re.poco { opacity: .7; }
  .sl-tr path.sl-an-fl { fill: none; stroke: var(--gdt-accent); stroke-width: .7; stroke-opacity: .55; stroke-dasharray: 1.4 .9; stroke-linejoin: round; }
  .sl-tr path.sl-an-fl.v { stroke: var(--sl-visit); }
  .sl-tr-ley i.sl-an-fl-i { width: 16px; height: 0; border-radius: 0; background: none; border-top: 2px dashed var(--gdt-text-mid); }
  .sl-tr-ley i.sl-an-fr-i { background: var(--gdt-text-mid); }
  .sl-tr-ley i.sl-an-fr-i.poco { opacity: .4; }
  .sl-an-fm-lin { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .25rem; }
  .sl-an-fm-lin li { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: .5rem; align-items: baseline; padding: .3rem .55rem;
                     border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border); font-size: var(--sl-fs-xs); color: var(--gdt-text); }
  .sl-an-fm-lin small { font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gdt-text-lo); }
  .sl-an-fm-lin li.arq { border-style: dashed; }
  .sl-an-fm-lin em { font-style: normal; color: var(--gdt-text-lo); }
  .sl-an-forma .sl-an-car { margin-top: .55rem; }
  .sl-fm-c b.na { color: var(--gdt-accent-hi); }
  .sl-fm-c b.nb { color: #ffd34d; }
  .sl-fm-c b.nc { color: #ff8a3d; }
  .sl-fm-star { position: absolute; top: -9px; left: -9px; font-size: var(--sl-fs-sm); color: #ffd34d; text-shadow: 0 0 4px #000; }
  .sl-fm-evs { position: absolute; top: -8px; right: -18px; display: flex; gap: 2px; align-items: center; }
  .sl-fm-ev { display: inline-flex; align-items: center; gap: 1px; font-size: var(--sl-fs-xs); font-weight: 800; color: var(--gdt-text-hi);
              background: #0a1a12; border-radius: var(--gdt-r-pill); padding: 0 3px; line-height: 14px; }
  .sl-fm-ev svg { width: 11px; height: 11px; }
  .sl-fm-ev.a { color: var(--gdt-accent-hi); }
  .sl-fm-evs .sl-tarj { width: 7px; height: 10px; }
  .sl-fm-n { max-width: 100%; font-size: var(--sl-fs-xs); font-weight: 600; color: var(--gdt-text-hi); line-height: 1.15;
             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 1px 2px #000; }
  .sl-fm-sale { font-size: var(--sl-fs-xs); font-weight: 700; color: #ff8a8a; line-height: 1; }
  .sl-fm-cambios-w { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; margin-top: .8rem; }
  .sl-fm-eqx { display: none; margin: .3rem 0; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
               text-align: center; overflow-wrap: anywhere; }
  .sl-fm-eqx.l { color: var(--gdt-accent); }
  .sl-fm-eqx.v { color: var(--sl-visit); }
  .sl-fm-cambios h3 { margin: 0 0 .4rem; font-size: var(--sl-fs-xs); color: var(--gdt-accent); overflow-wrap: anywhere; }
  .sl-fm-cambios.v h3 { color: var(--sl-visit); }
  .sl-fm-cambios ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; font-size: var(--sl-fs-sm); }
  .sl-fm-cambios li { display: flex; gap: .45rem; align-items: baseline; color: var(--gdt-text); }
  .sl-fm-cambios li > span:last-child { min-width: 0; overflow-wrap: anywhere; }
  .sl-fm-cambios b { color: var(--gdt-text-hi); font-weight: 600; }
  .sl-fm-cambios small { color: var(--gdt-text-lo); }
  .sl-fm-min { flex: none; min-width: 2.4em; font-weight: 700; color: var(--gdt-text-mid); font-variant-numeric: tabular-nums; }
  .sl-fm-in { color: var(--gdt-accent); font-size: .7em; margin-right: .2rem; }
  .sl-fm-out { color: #ff6b6b; font-size: .7em; margin: 0 .2rem 0 .3rem; }
  @media (max-width: 600px) {
    .sl-fm-cancha { aspect-ratio: 68 / 128; background: linear-gradient(0deg, rgba(255,255,255,.02) 50%, transparent 50%) 0 0 / 100% 20%,
                                                     linear-gradient(180deg, #0c2417 0%, #071710 100%); }
    .sl-fm-svg.acostada { display: none; }
    .sl-fm-svg.parada { display: block; }
    .sl-fm-j { left: var(--px); top: var(--py); width: 76px; gap: 1px; }
    .sl-fm-c { width: 30px; height: 30px; font-size: var(--sl-fs-xs); }
    .sl-fm-n { font-size: var(--sl-fs-xs); }
    .sl-fm-eq { display: none; }
    .sl-fm-eqx { display: block; }
    .sl-fm-cambios-w { grid-template-columns: minmax(0, 1fr); }
  }
  /* Jugadores: la figura y la tabla */
  .sl-fig { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .4rem .8rem;
            padding: .8rem .9rem; margin-bottom: .9rem; border-radius: var(--gdt-r-md); background: var(--gdt-surface-2);
            border: 1px solid var(--gdt-border); border-left: 3px solid var(--gdt-accent); }
  .sl-fig.v { border-left-color: var(--sl-visit); }
  .sl-fig-ic { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; font-size: 1.15rem;
               color: #ffd34d; background: rgba(255, 211, 77, .12); }
  .sl-fig-txt { display: grid; min-width: 0; }
  .sl-fig-txt small { font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gdt-text-lo); }
  .sl-fig-txt b { font-size: var(--sl-fs-lg); color: var(--gdt-text-hi); overflow-wrap: anywhere; }
  .sl-fig-txt span { font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); overflow-wrap: anywhere; }
  .sl-fig-rat { text-align: center; }
  .sl-fig-rat b { display: block; font-family: 'Bebas Neue', sans-serif; font-size: 2rem; line-height: 1; color: var(--gdt-text-hi); }
  .sl-fig-rat small { font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-fig-dat { grid-column: 1 / -1; list-style: none; margin: .2rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; }
  .sl-fig-dat li { font-size: var(--sl-fs-xs); color: var(--gdt-text); background: var(--gdt-surface-1); border: 1px solid var(--gdt-border);
                   border-radius: var(--gdt-r-pill); padding: .15rem .55rem; }
  .sl-jg-ctrl { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; margin-bottom: .6rem; }
  .sl-jg-seg, .sl-jg-grupos { display: flex; gap: .3rem; min-width: 0; overflow-x: auto; scrollbar-width: none; }
  .sl-jg-seg::-webkit-scrollbar, .sl-jg-grupos::-webkit-scrollbar { display: none; }
  .sl-jg-seg button, .sl-jg-grupos button { flex: none; }
  .sl-rat { display: inline-block; min-width: 2.2em; padding: .08rem .3rem; border-radius: 5px; font-weight: 800; font-size: var(--sl-fs-xs); text-align: center; }
  .sl-rat.na { background: rgba(0, 224, 90, .16); color: var(--gdt-accent-hi); }
  .sl-rat.nb { background: rgba(255, 211, 77, .15); color: #ffd34d; }
  .sl-rat.nc { background: rgba(255, 138, 61, .15); color: #ff8a3d; }
  .sl-jg-seg { flex: 1 1 260px; }
  .sl-jg-seg button, .sl-jg-grupos button { font: inherit; font-size: var(--sl-fs-xs); font-weight: 700; cursor: pointer; background: transparent;
             color: var(--gdt-text-mid); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-pill); padding: .28rem .7rem;
             max-width: 11rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-jg-seg button.on, .sl-jg-grupos button.on { color: var(--gdt-text-hi); border-color: var(--gdt-border-hi); background: var(--gdt-surface-2); }
  .sl-jg { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: var(--sl-fs-sm); }
  .sl-jg th, .sl-jg td { padding: .42rem .25rem; border-bottom: 1px solid var(--gdt-border); }
  .sl-jg thead th { font-weight: 700; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); text-align: center; width: 54px; }
  .sl-jg thead th:first-child { text-align: left; width: auto; }
  .sl-jg thead button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: .1rem .2rem; border-radius: 4px; }
  .sl-jg thead button.on { color: var(--gdt-accent-hi); }
  .sl-jg thead button.on::after { content: ' ▾'; }
  .sl-jg tbody th { text-align: left; font-weight: 600; color: var(--gdt-text-hi); border-left: 3px solid var(--gdt-accent); padding-left: .45rem; }
  .sl-jg-cel { display: flex; align-items: center; gap: .35rem; min-width: 0; }
  .sl-jg tbody tr.v th { border-left-color: var(--sl-visit); }
  .sl-jg tbody tr.fig { background: rgba(255, 211, 77, .06); }
  .sl-jg-pos { flex: none; font-size: var(--sl-fs-xs); font-weight: 700; color: var(--gdt-text-lo); min-width: 1.9em; }
  .sl-jg-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-jg-star { color: #ffd34d; flex: none; }
  .sl-jg .sl-tarj { width: 8px; height: 11px; flex: none; }
  .sl-jg td { text-align: center; font-variant-numeric: tabular-nums; color: var(--gdt-text); }
  .sl-jg td.ord { color: var(--gdt-text-hi); font-weight: 700; }
  .sl-jg .cero { color: var(--gdt-text-lo); opacity: .6; font-weight: 400; }
  @media (max-width: 520px) {
    .sl-res { padding: .9rem .85rem 1rem; }
    .sl-tr-res b { font-size: 1.15rem; }
    .sl-jg { font-size: var(--sl-fs-xs); }
    .sl-jg thead th { width: 33px; font-size: var(--sl-fs-xs); }
    .sl-jg th, .sl-jg td { padding: .42rem .1rem; }
    .sl-jg thead button { padding: .1rem 0; white-space: nowrap; }
    .sl-jg thead button.on::after { content: '▾'; }
    .sl-jg tbody th { padding-left: .35rem; }
    .sl-jg-cel { gap: .25rem; }
    .sl-jg-pos { min-width: 1.7em; font-size: var(--sl-fs-xs); }
    .sl-fig-rat b { font-size: 1.7rem; }
  }
  @media (max-width: 520px) {
    .sl-rs-eqs, .sl-cf-fila { grid-template-columns: minmax(0, 1fr) 46px minmax(0, 1fr); }
    .sl-rs-eqs { font-size: var(--sl-fs-sm); }
    .sl-cf-lado { gap: .35rem; }
    .sl-cf-txt b { font-size: var(--sl-fs-sm); }
    .t-gol .sl-cf-txt b { font-size: var(--sl-fs-md); }
    .sl-cf-txt small { font-size: var(--sl-fs-xs); }
    .sl-cf-min { min-width: 34px; font-size: var(--sl-fs-xs); }
  }
  .sl-st-grupo + .sl-st-grupo { margin-top: .9rem; }
  .sl-st-grupo h3 { margin: 0 0 .2rem; font-size: var(--sl-fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
                    color: var(--gdt-text-lo); text-align: center; }
  .sl-st { padding: .42rem 0; }
  .sl-st-fila { display: grid; grid-template-columns: 4.4em minmax(0, 1fr) 4.4em; align-items: center; margin-bottom: .35rem; font-size: var(--sl-fs-sm); }
  .sl-st-fila span { color: var(--gdt-text-mid); text-align: center; }
  .sl-st-fila b { justify-self: start; padding: .05rem .45rem; border-radius: 6px; font-weight: 700; color: var(--gdt-text);
                  font-variant-numeric: tabular-nums; }
  .sl-st-fila b.v { justify-self: end; }
  .sl-st-fila b.mas.l { background: rgba(0, 224, 90, .16); color: var(--gdt-accent-hi); }
  .sl-st-fila b.mas.v { background: rgba(79, 140, 255, .18); color: var(--sl-visit-hi); }
  .sl-st-barra { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; height: 6px; }
  .sl-st-barra > span { display: flex; overflow: hidden; border-radius: var(--gdt-r-pill); background: rgba(255, 255, 255, .05); }
  .sl-st-barra > span.l { justify-content: flex-end; }
  .sl-st-barra i { display: block; height: 100%; border-radius: var(--gdt-r-pill); }
  .sl-st-barra .l i { background: rgba(0, 224, 90, .38); }
  .sl-st-barra .l i.mas { background: var(--gdt-accent); }
  .sl-st-barra .v i { background: rgba(79, 140, 255, .4); }
  .sl-st-barra .v i.mas { background: var(--sl-visit); }
  .sl-mom { width: 100%; height: auto; display: block; }
  .sl-mom rect.l { fill: var(--gdt-accent); }
  .sl-mom rect.v { fill: var(--sl-visit); }
  .sl-mom line { stroke: var(--gdt-border-hi); }
  .sl-mom line.ht { stroke: var(--gdt-text-lo); stroke-dasharray: 4 4; }
  .sl-mom circle.gol { fill: #fff; stroke-width: 2; }
  .sl-mom circle.gol.l { stroke: var(--gdt-accent); }
  .sl-mom circle.gol.v { stroke: var(--sl-visit); }
  .sl-mom-eje { position: relative; height: 1.2em; margin-top: .3rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }
  .sl-mom-eje span { position: absolute; top: 0; left: 0; }
  .sl-mom-eje span[style] { transform: translateX(-50%); }
  .sl-mom-eje span.fin { left: auto; right: 0; }
  .sl-al:not([hidden]) { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
  .sl-al h3 { margin: 0 0 .4rem; font-size: var(--sl-fs-sm); color: var(--gdt-text-hi); }
  .sl-al ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
  .sl-al li { display: flex; align-items: center; gap: .4rem; font-size: var(--sl-fs-sm); min-width: 0; }
  .sl-al-pos { width: 2.4em; flex: none; font-size: var(--sl-fs-xs); font-weight: 700; color: var(--gdt-text-lo); }
  .sl-al-n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gdt-text); }
  .sl-al-g { display: inline-flex; align-items: center; gap: 1px; font-size: var(--sl-fs-xs); color: var(--gdt-text-hi); }
  .sl-al-g svg { width: 12px; height: 12px; }
  .sl-al-min { flex: none; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); font-variant-numeric: tabular-nums; }
  .sl-srv { margin: .8rem auto 0; max-width: 520px; font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); text-align: center; }
  .sl-srv summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: .4rem; }
  .sl-srv summary::-webkit-details-marker { display: none; }
  .sl-srv summary b { color: var(--gdt-text-hi); }
  .sl-srv p { margin: .4rem 0 0; font-size: var(--sl-fs-sm); color: var(--gdt-text); line-height: 1.5; }
  .sl-srv-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gdt-text-lo); }
  .sl-srv-dot.on { background: var(--gdt-accent); }

  .sl-nota { margin: 1rem 0 0; font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); line-height: 1.5; text-align: center; }

  .sl-acciones { display: flex; gap: .5rem; flex-wrap: wrap; justify-content: center; margin-top: 1rem; }
  .sl-btn { display: inline-flex; align-items: center; gap: .45rem; font: inherit; font-size: var(--sl-fs-md); font-weight: 700;
            border-radius: var(--gdt-r-pill); padding: .5rem 1rem; cursor: pointer; text-decoration: none;
            border: 1px solid var(--gdt-border-hi); background: var(--gdt-surface-2); color: var(--gdt-text-hi); }
  .sl-btn:hover { border-color: var(--gdt-accent-line); }
  .sl-btn.tw { background: #6441a5; border-color: #7d5bbe; color: #fff; }
  .sl-btn svg { width: 16px; height: 16px; flex: none; }
  .sl-btn-info { cursor: default; background: transparent; color: var(--gdt-text-mid); border-style: dashed; }
  .sl-btn-info:hover { border-color: var(--gdt-border-hi); }

  .sl-tw { margin-top: 1rem; position: relative; padding-top: 56.25%; border-radius: var(--gdt-r-md); overflow: hidden;
           background: #000; }
  .sl-tw iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

  /* Predictor */
  .sl-pred { margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--gdt-border); }
  .sl-pred-fila { display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap;
                  font-size: var(--sl-fs-md); color: var(--gdt-text); }
  .sl-pred-fila b { color: var(--gdt-text-hi); }
  .sl-pred a { color: var(--gdt-accent-hi); font-weight: 600; text-decoration: none; }
  .sl-rep { margin-top: .7rem; }
  .sl-rep-barra { display: flex; height: 10px; border-radius: var(--gdt-r-pill); overflow: hidden; background: var(--gdt-surface-3); }
  .sl-rep-barra span { display: block; height: 100%; }
  .sl-rep-l { background: var(--gdt-accent); }
  .sl-rep-e { background: var(--gdt-text-lo); }
  .sl-rep-v { background: var(--sl-visit); }
  .sl-rep-ley { display: flex; justify-content: space-between; gap: .3rem .8rem; flex-wrap: wrap; margin-top: .45rem;
                font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); }
  .sl-rep-ley i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 5px; }
  .sl-rep-ley b { color: var(--gdt-text-hi); font-weight: 700; }
  .sl-rep-n { margin-top: .35rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-lo); }

  .sl-aviso { margin: 0 0 .6rem; font-size: var(--sl-fs-md); color: var(--gdt-text-mid); }
  .sl-vacio { text-align: center; color: var(--gdt-text-mid); padding: 2rem 1rem; font-size: var(--sl-fs-base);
              border: 1px dashed var(--gdt-border); border-radius: var(--gdt-r-md); }
  .sl-vacio b { display: block; color: var(--gdt-text-hi); font-size: 1rem; margin-bottom: .25rem; }

  @media (max-width: 560px) {
    .sl-titulo { font-size: 2.2rem; }
    .sl-team img, .sl-team .sl-ini { width: 48px; height: 48px; }
    .sl-team-nom { font-size: var(--sl-fs-sm); }
    .sl-score { font-size: 2.5rem; }
    .sl-hora { font-size: 1.8rem; }
    .sl-centro { min-width: 76px; max-width: 112px; }
    .sl-fila-eq { font-size: var(--sl-fs-sm); }
    .sl-rep-ley { flex-direction: column; }
  }

  /* ── Links propios (rediseño E2, 7-oct) ── */
  .sl-card-der { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
  .sl-compartir { display: inline-flex; align-items: center; gap: .4rem; min-height: 32px; padding: .3rem .8rem; cursor: pointer;
                  font: inherit; font-size: var(--sl-fs-sm); font-weight: 700; color: var(--gdt-text-hi); background: var(--gdt-surface-2);
                  border: 1px solid var(--gdt-border-hi); border-radius: var(--gdt-r-pill); }
  .sl-compartir:hover { border-color: var(--gdt-accent-line); color: var(--gdt-accent-hi); }
  .sl-compartir:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; }
  .sl-compartir svg { width: 16px; height: 16px; flex: none; }
  .sl-toast { position: fixed; left: 50%; bottom: 24px; z-index: 1200; max-width: min(92vw, 30rem); padding: .7rem 1.1rem;
              transform: translate(-50%, 12px); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease;
              font-size: var(--sl-fs-md); font-weight: 600; line-height: 1.4; text-align: center; overflow-wrap: anywhere;
              color: var(--gdt-text-hi); background: var(--gdt-surface-3); border: 1px solid var(--gdt-accent-line);
              border-radius: var(--gdt-r-md); box-shadow: 0 10px 30px rgba(0, 0, 0, .5); }
  .sl-toast.on { opacity: 1; transform: translate(-50%, 0); }
  @media (prefers-reduced-motion: reduce) { .sl-toast { transition: opacity .15s linear; transform: translate(-50%, 0); } }
  .sl-no-esta .sl-btn { margin-top: 1rem; }

  /* ── La grilla de la Sala (rediseño E3, 7-oct) ──
     Celu y compu angosta (<1100): una columna; la lista de partidos y el chat son paneles que se abren.
     1100-1439: lista a la izquierda + partido; el chat, panel con botón flotante.
     1440 o más: lista + partido + chat (que se puede plegar a una tira). */
  .sl-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; align-items: start; }
  .sl-col-partido { min-width: 0; }
  @media (min-width: 1100px) { .sl-layout { grid-template-columns: 300px minmax(0, 1fr); } }
  @media (min-width: 1440px) {
    .sl-layout { grid-template-columns: 300px minmax(0, 1fr) 340px; }
    .sl-wrap.chat-plegado .sl-layout { grid-template-columns: 300px minmax(0, 1fr) 56px; }
  }
  .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .sl-icono { flex: none; width: 40px; height: 40px; display: inline-grid; place-items: center; border-radius: 50%; cursor: pointer;
              border: 1px solid var(--gdt-border-hi); background: var(--gdt-surface-2); color: var(--gdt-text-hi); font: inherit; font-size: 1rem; }
  .sl-icono svg { width: 18px; height: 18px; }
  .sl-icono:hover { border-color: var(--gdt-accent-line); }
  .sl-icono:focus-visible, .sl-barra-btn:focus-visible, .sl-chat-fab:focus-visible, .sl-chat-riel:focus-visible,
  .sl-pag button:focus-visible, .sl-fl-dias button:focus-visible, .sl-link:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; }

  /* La barra de arriba (menos de 1100 px): botón «Partidos» y los partidos de ahora */
  .sl-barra { display: flex; align-items: center; gap: .5rem; margin: 0 0 .8rem; min-width: 0; }
  .sl-barra-btn { flex: none; display: inline-flex; align-items: center; gap: .45rem; min-height: 40px; padding: 0 .95rem; cursor: pointer;
                  border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border-hi); background: var(--gdt-surface-2);
                  color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-md); font-weight: 700; }
  .sl-barra-btn svg { width: 18px; height: 18px; }

  /* La lista de partidos */
  .sl-nav { background: var(--gdt-surface-1); border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-lg);
            padding: .75rem .75rem 1rem; overscroll-behavior: contain; scrollbar-width: thin; }
  .sl-nav-cab { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .2rem; }
  .sl-nav-cab h2 { margin: 0; font-family: var(--font-titulo, 'Bebas Neue'), sans-serif; font-size: 1.35rem; font-weight: 400;
                   letter-spacing: .04em; color: var(--gdt-text-hi); }
  @media (min-width: 1100px) {
    .sl-nav { position: sticky; top: calc(var(--gdt-nav-h, 60px) + 12px); max-height: calc(100vh - var(--gdt-nav-h, 60px) - 24px); overflow-y: auto; }
    .sl-barra, .sl-nav-x, .sl-nav-fondo { display: none !important; }
  }
  @media (max-width: 1099px) {
    .sl-nav { position: fixed; z-index: 950; top: var(--gdt-nav-h, 60px); left: 0; bottom: 0; width: min(380px, 92vw); overflow-y: auto;
              border-radius: 0 var(--gdt-r-lg) var(--gdt-r-lg) 0; border-left: 0; box-shadow: 12px 0 40px rgba(0, 0, 0, .55);
              display: none; }
    /* cerrado = display none (con visibility el navegador dejaba «ocultas» las filas y el foco no entraba) */
    .sl-wrap.nav-abierta .sl-nav { display: block; animation: slPanelIzq .22s ease-out; }
    .sl-nav-fondo { position: fixed; z-index: 940; inset: var(--gdt-nav-h, 60px) 0 0 0; background: rgba(0, 0, 0, .55); }
  }
  .sl-nav-ahora { padding-bottom: .7rem; margin-bottom: .5rem; border-bottom: 1px solid var(--gdt-border); }
  .sl-nav-tit { display: flex; align-items: center; gap: .45rem; margin: .55rem 0 .45rem; font-size: var(--sl-fs-xs); font-weight: 800;
                letter-spacing: .08em; text-transform: uppercase; color: var(--gdt-text-mid); }
  .sl-nav-tit b { color: var(--gdt-danger); }
  .sl-nav-nada { margin: .3rem 0 .5rem; font-size: var(--sl-fs-md); line-height: 1.5; color: var(--gdt-text-mid); }
  .sl-fn-lista { display: grid; gap: .35rem; }
  .sl-fn { display: grid; grid-template-columns: minmax(0, 1fr); gap: .2rem; padding: .5rem .6rem .45rem; min-height: 44px;
           border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); border: 1px solid var(--gdt-border);
           color: var(--gdt-text); text-decoration: none; }
  .sl-fn:hover { border-color: var(--gdt-border-hi); }
  .sl-fn:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; }
  .sl-fn.vivo { border-color: rgba(255, 82, 82, .35); }
  .sl-fn.on { border-color: var(--gdt-accent-line); background: linear-gradient(var(--gdt-accent-soft), var(--gdt-accent-soft)), var(--gdt-surface-2);
              box-shadow: inset 3px 0 0 var(--gdt-accent); }
  .sl-fn-eq { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: .45rem;
              font-size: var(--sl-fs-md); font-weight: 600; line-height: 1.3; }
  .sl-fn-eq .sl-esc, .sl-fn-eq .sl-ini { width: 20px; height: 20px; font-size: var(--sl-fs-xs); }
  .sl-fn-nom { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-fn-g { min-width: 1.3em; text-align: right; font-family: var(--font-titulo, 'Bebas Neue'), sans-serif; font-size: 1.2rem; font-weight: 400;
             line-height: 1; color: var(--gdt-text-hi); font-variant-numeric: tabular-nums; }
  .sl-fn-eq.gana { color: var(--gdt-text-hi); }
  .sl-fn-eq.gana .sl-fn-g { color: var(--gdt-accent-hi); }
  .sl-fn-meta { display: flex; align-items: center; gap: .5rem; margin-top: .1rem; font-size: var(--sl-fs-xs); color: var(--gdt-text-mid); white-space: nowrap; }
  .sl-fn-extra { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-fn-ms { flex: none; display: inline-flex; gap: .15rem; }
  .sl-fn-vivo { display: inline-flex; align-items: center; gap: .3rem; font-weight: 700; color: var(--gdt-danger); font-variant-numeric: tabular-nums; }
  .sl-fn-hora { color: var(--gdt-accent-hi); font-weight: 600; }
  .sl-fn-m { display: inline-grid; place-items: center; width: 18px; height: 18px; color: var(--gdt-accent-hi); }
  .sl-fn-m svg { width: 15px; height: 15px; }
  /* Esqueleto de carga de la lista */
  .sl-esq { pointer-events: none; }
  .sl-esq i { display: block; height: .8rem; border-radius: 4px; background: linear-gradient(90deg, var(--gdt-surface-3) 0%, #262e38 50%, var(--gdt-surface-3) 100%);
              background-size: 200% 100%; animation: slEsq 1.3s linear infinite; }
  .sl-esq i:nth-child(1) { width: 72%; }
  .sl-esq i:nth-child(2) { width: 58%; }
  .sl-esq i:nth-child(3) { width: 40%; height: .65rem; }
  @keyframes slEsq { from { background-position: 200% 0; } to { background-position: -200% 0; } }
  @media (prefers-reduced-motion: reduce) { .sl-esq i { animation-duration: 3s; } }

  /* Filtros de la lista */
  .sl-filtros { display: grid; gap: .5rem; margin: .7rem 0 .2rem; }
  .sl-busca { display: flex; align-items: center; gap: .45rem; min-height: 40px; padding: 0 .7rem; color: var(--gdt-text-mid);
              background: var(--gdt-surface-2); border: 1px solid var(--gdt-border-hi); border-radius: var(--gdt-r-md); }
  .sl-busca:focus-within { border-color: var(--gdt-accent-line); box-shadow: 0 0 0 2px var(--gdt-accent-soft); }
  .sl-busca svg { width: 16px; height: 16px; flex: none; }
  .sl-busca input { flex: 1; min-width: 0; height: 38px; background: transparent; border: 0; outline: none; color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-md); }
  .sl-busca input::placeholder, .sl-fl-campo input::placeholder { color: var(--gdt-text-mid); opacity: 1; }
  .sl-fl-dias { display: flex; flex-wrap: wrap; gap: .3rem; }
  .sl-fl-dias button, .sl-fl-dia { display: inline-flex; align-items: center; min-height: 36px; padding: 0 .75rem; cursor: pointer;
              border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border-hi); background: transparent; color: var(--gdt-text);
              font: inherit; font-size: var(--sl-fs-sm); font-weight: 600; }
  .sl-fl-dias button:hover, .sl-fl-dia:hover { color: var(--gdt-text-hi); border-color: var(--gdt-text-mid); }
  .sl-fl-dias button.on, .sl-fl-dia.on { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); }
  .sl-fl-dia { padding: 0 .5rem; }
  .sl-fl-dia:focus-within { outline: 2px solid var(--gdt-accent); outline-offset: 2px; }
  .sl-fl-dia input { width: 8.2rem; min-width: 0; background: transparent; border: 0; outline: none; color: inherit; font: inherit; color-scheme: dark; }
  .sl-fl-mas summary { display: flex; align-items: center; gap: .45rem; min-height: 36px; cursor: pointer; list-style: none;
                       font-size: var(--sl-fs-sm); font-weight: 700; color: var(--gdt-text); }
  .sl-fl-mas summary::-webkit-details-marker { display: none; }
  .sl-fl-mas summary::before { content: ''; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
                               transform: rotate(-45deg); transition: transform .15s ease; }
  .sl-fl-mas[open] summary::before { transform: rotate(45deg); }
  .sl-fl-mas summary b { min-width: 20px; padding: 0 6px; border-radius: var(--gdt-r-pill); background: var(--gdt-accent); color: #04140a;
                         font-size: var(--sl-fs-xs); line-height: 20px; text-align: center; }
  .sl-fl-mas summary:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; border-radius: 6px; }
  .sl-fl-grid { display: grid; gap: .5rem; margin-top: .35rem; }
  .sl-fl-campo { display: grid; gap: .25rem; font-size: var(--sl-fs-xs); font-weight: 700; color: var(--gdt-text-mid); }
  .sl-fl-campo select, .sl-fl-campo input { min-height: 40px; padding: 0 .6rem; background: var(--gdt-surface-2); border: 1px solid var(--gdt-border-hi);
              border-radius: var(--gdt-r-sm); color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-md); font-weight: 500; color-scheme: dark; }
  .sl-fl-campo select:focus-visible, .sl-fl-campo input:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 1px; }
  .sl-hist-cab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .3rem .6rem; min-height: 1.5em;
                 margin: .7rem 0 .45rem; font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); }
  .sl-hist-cab b { color: var(--gdt-text-hi); }
  .sl-link { background: none; border: 0; padding: 0; cursor: pointer; color: var(--gdt-accent-hi); font: inherit; font-weight: 700;
             text-decoration: underline; text-underline-offset: 2px; }
  .sl-pag { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: .7rem; }
  .sl-pag:empty { display: none; }
  .sl-pag button { min-height: 40px; padding: 0 .85rem; cursor: pointer; border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border-hi);
                   background: var(--gdt-surface-2); color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-sm); font-weight: 700; }
  .sl-pag button:disabled { opacity: .4; cursor: default; }
  .sl-pag span { font-size: var(--sl-fs-sm); color: var(--gdt-text-mid); text-align: center; }
  .sl-pag span b { color: var(--gdt-text-hi); }

  /* El chat según el ancho */
  .sl-chat-cab .sl-mirando { margin-left: auto; }
  .sl-chat-cab .sl-icono { width: 34px; height: 34px; }
  .sl-chat-riel { display: none; }
  .sl-chat-n { min-width: 20px; padding: 0 6px; border-radius: var(--gdt-r-pill); background: var(--gdt-danger); color: #fff;
               font-size: var(--sl-fs-xs); font-weight: 800; line-height: 20px; text-align: center; }
  .sl-chat-fab { position: fixed; z-index: 930; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
                 display: inline-flex; align-items: center; gap: .45rem; min-height: 48px; padding: 0 1.15rem; cursor: pointer;
                 border: 0; border-radius: var(--gdt-r-pill); background: var(--gdt-accent); color: #04140a;
                 font: inherit; font-size: var(--sl-fs-base); font-weight: 800; box-shadow: 0 8px 26px rgba(0, 0, 0, .5); }
  .sl-chat-fab svg { width: 20px; height: 20px; }
  .sl-wrap.chat-abierto .sl-chat-fab { display: none; }
  @media (min-width: 1440px) {
    .sl-chat { position: sticky; top: calc(var(--gdt-nav-h, 60px) + 12px); height: calc(100vh - var(--gdt-nav-h, 60px) - 24px); }
    .sl-chat-x, .sl-chat-fab { display: none !important; }
    .sl-wrap.chat-plegado .sl-chat > :not(.sl-chat-riel) { display: none !important; }
    .sl-wrap.chat-plegado .sl-chat-riel { display: flex; flex-direction: column; align-items: center; gap: .6rem; width: 100%; height: 100%;
             padding: 1rem 0; cursor: pointer; background: none; border: 0; color: var(--gdt-text); font: inherit; font-size: var(--sl-fs-md); font-weight: 700; }
    .sl-wrap.chat-plegado .sl-chat-riel:hover { color: var(--gdt-accent-hi); }
    .sl-chat-riel svg { width: 22px; height: 22px; }
    .sl-chat-riel span { writing-mode: vertical-rl; letter-spacing: .08em; }
  }
  @media (max-width: 1439px) {
    .sl-chat { position: fixed; z-index: 960; top: var(--gdt-nav-h, 60px); right: 0; bottom: 0; width: min(400px, 100vw);
               border-radius: var(--gdt-r-lg) 0 0 var(--gdt-r-lg); border-right: 0; box-shadow: -12px 0 40px rgba(0, 0, 0, .55);
               display: none; }
    .sl-wrap.chat-abierto .sl-chat { display: flex; animation: slPanelDer .22s ease-out; }
    .sl-chat-plegar { display: none !important; }
    .sl-toast { bottom: 84px; }
  }
  @media (max-width: 599px) {
    .sl-chat { width: 100vw; border-radius: 0; border-left: 0; }
  }
  @media (prefers-reduced-motion: reduce) {
    .sl-wrap.nav-abierta .sl-nav, .sl-wrap.chat-abierto .sl-chat { animation: slFundido .15s linear; }
  }

  /* ── El partido por dentro (rediseño E4, 7-oct) ── */
  .sl-cuerpo { margin-top: .9rem; padding: 0 1rem 1.2rem; background: var(--gdt-surface-1); border: 1px solid var(--gdt-border);
               border-radius: var(--gdt-r-lg); min-width: 0; }
  .sl-cuerpo > .sl-vt-panel:first-child { padding-top: 1rem; }
  /* La barra de pestañas: se pega arriba al bajar y ahí muestra el marcador chico */
  .sl-pbar { position: sticky; top: var(--gdt-nav-h, 60px); z-index: 30; display: flex; align-items: stretch; gap: .5rem;
             margin: 0 -1rem; padding: 0 1rem; background: var(--gdt-surface-1); border-bottom: 1px solid var(--gdt-border);
             border-radius: var(--gdt-r-lg) var(--gdt-r-lg) 0 0; }
  .sl-pbar.pegada { border-radius: 0; box-shadow: 0 10px 18px -12px rgba(0, 0, 0, .8); }
  .sl-pbar .sl-vt { flex: 1 1 auto; margin: 0; border-bottom: 0; }
  .sl-pbar .sl-vt button { min-height: 46px; }
  .sl-pbar-mini { display: none; flex: none; align-items: center; gap: .35rem; padding-right: .6rem; border-right: 1px solid var(--gdt-border);
                  font-variant-numeric: tabular-nums; }
  .sl-pbar.pegada .sl-pbar-mini { display: inline-flex; }
  .sl-pbar-mini .sl-esc, .sl-pbar-mini .sl-ini { width: 22px; height: 22px; font-size: var(--sl-fs-xs); }
  .sl-pbar-mini b { font-family: var(--font-titulo, 'Bebas Neue'), sans-serif; font-size: 1.3rem; font-weight: 400; line-height: 1; color: var(--gdt-text-hi); }
  .sl-pbar-min { font-size: var(--sl-fs-xs); font-weight: 800; color: var(--gdt-danger); }
  .sl-vt-panel { padding-top: .9rem; min-width: 0; }
  /* Secciones de Mapa, Análisis y Jugadores: una por vez, con chips */
  .sl-secs { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 .8rem; }
  .sl-secs button { display: inline-flex; align-items: center; min-height: 36px; padding: 0 .85rem; cursor: pointer; white-space: nowrap;
                    border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border-hi); background: transparent;
                    color: var(--gdt-text); font: inherit; font-size: var(--sl-fs-sm); font-weight: 600; }
  .sl-secs button:hover { color: var(--gdt-text-hi); border-color: var(--gdt-text-mid); }
  .sl-secs button.on { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); }
  .sl-secs button:focus-visible, .sl-eqsel button:focus-visible, .sl-sec-nav button:focus-visible, .sl-ver-todos:focus-visible {
    outline: 2px solid var(--gdt-accent); outline-offset: 2px; }
  @media (max-width: 699px) {
    /* en el celu, una sola fila que se desliza (si no, 10 secciones ocupan media pantalla) */
    .sl-secs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -1rem .8rem; padding: 0 1rem;
               -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 1rem, #000 calc(100% - 1.5rem), transparent);
                       mask-image: linear-gradient(90deg, transparent 0, #000 1rem, #000 calc(100% - 1.5rem), transparent); }
    .sl-secs::-webkit-scrollbar { display: none; }
    .sl-secs button { min-height: 40px; }
  }
  /* Celu (y pantallas de hasta 760 px): un equipo por vez. Con los dos al lado, las letras de las canchas quedaban de 11 px */
  .sl-eqsel { display: none; }
  @media (max-width: 760px) {
    .sl-eqsel { display: flex; gap: .35rem; margin: 0 0 .9rem; }
    .sl-eqsel button { flex: 1 1 0; min-width: 0; min-height: 40px; padding: 0 .5rem; cursor: pointer; overflow: hidden; text-overflow: ellipsis;
                       white-space: nowrap; border-radius: var(--gdt-r-md); border: 1px solid var(--gdt-border-hi); background: var(--gdt-surface-2);
                       color: var(--gdt-text); font: inherit; font-size: var(--sl-fs-sm); font-weight: 700; }
    .sl-eqsel button.on { color: var(--gdt-text-hi); border-color: var(--gdt-text-mid); }
    .sl-eqsel button.l.on { color: var(--gdt-accent-hi); border-color: var(--gdt-accent-line); background: var(--gdt-accent-soft); }
    .sl-eqsel button.v.on { color: var(--sl-visit-hi); border-color: rgba(79, 140, 255, .5); background: rgba(79, 140, 255, .12); }
    .sl-cuerpo[data-eq="local"] .sl-tr-col.v, .sl-cuerpo[data-eq="visitante"] .sl-tr-col.l { display: none; }
    .sl-cuerpo .sl-pel-cols, .sl-cuerpo .sl-tr-w, .sl-cuerpo .sl-tr-w.sl-mp-dos { grid-template-columns: minmax(0, 1fr); }
  }
  /* Anterior / siguiente sección */
  .sl-sec-nav { display: flex; justify-content: space-between; gap: .5rem; margin-top: 1.3rem; padding-top: .9rem; border-top: 1px solid var(--gdt-border); }
  .sl-sec-nav button { min-height: 40px; padding: 0 1rem; cursor: pointer; border-radius: var(--gdt-r-pill); border: 1px solid var(--gdt-border-hi);
                       background: var(--gdt-surface-2); color: var(--gdt-text-hi); font: inherit; font-size: var(--sl-fs-sm); font-weight: 700; }
  .sl-sec-nav button:hover { border-color: var(--gdt-accent-line); }
  .sl-an-sec + .sl-sec-nav { margin-top: 1.3rem; }
  /* Listas largas: «Ver todos» */
  .sl-ver-todos { display: block; margin: .45rem auto 0; min-height: 36px; padding: 0 1rem; cursor: pointer; border-radius: var(--gdt-r-pill);
                  border: 1px dashed var(--gdt-border-hi); background: transparent; color: var(--gdt-text); font: inherit; font-size: var(--sl-fs-sm); font-weight: 700; }
  .sl-ver-todos:hover { color: var(--gdt-text-hi); border-color: var(--gdt-text-mid); }
  /* Cómo fue: el momento arriba, compacto */
  .sl-sub-tit { margin: 0 0 .5rem; font-size: var(--sl-fs-xs); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; text-align: center; color: var(--gdt-text-mid); }
  .sl-mom-w { margin-bottom: 1.1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--gdt-border); }
  .sl-fuente { margin: 1rem 0 0; font-size: var(--sl-fs-xs); text-align: center; color: var(--gdt-text-mid); }
  /* Esqueleto mientras carga (mismo alto aproximado: la página no salta) */
  .sl-esq-panel { display: grid; gap: .7rem; min-height: 340px; padding: 1.2rem 0; }
  .sl-esq-panel i { display: block; height: 1rem; border-radius: 6px; background: linear-gradient(90deg, var(--gdt-surface-2) 0%, #222a33 50%, var(--gdt-surface-2) 100%);
                    background-size: 200% 100%; animation: slEsq 1.3s linear infinite; }
  .sl-esq-panel i:nth-child(2) { width: 70%; } .sl-esq-panel i:nth-child(3) { height: 9rem; } .sl-esq-panel i:nth-child(4) { width: 55%; }
  @media (prefers-reduced-motion: reduce) { .sl-esq-panel i { animation-duration: 3s; } }
  @media (max-width: 520px) {
    .sl-cuerpo { padding: 0 .85rem 1rem; }
    .sl-pbar { margin: 0 -.85rem; padding: 0 .85rem; }
    .sl-pbar.pegada .sl-pbar-mini .sl-esc, .sl-pbar.pegada .sl-pbar-mini .sl-ini { display: none; }
  }

  /* ── Jerarquía de cada sección (rediseño E5): la conclusión arriba, grande ── */
  .sl-concl { margin: 0 auto .85rem; max-width: 46rem; font-size: var(--sl-fs-lg); font-weight: 700; line-height: 1.35; text-align: center;
              color: var(--gdt-text-hi); text-wrap: balance; }
  .sl-concl b { font-weight: 800; }
  .sl-concl b.l { color: var(--sl-local); }
  .sl-concl b.v { color: var(--sl-visit-hi); }
  .sl-an-tit + .sl-concl { margin-top: .35rem; }
  /* Una sola leyenda de colores (al final de Mapa y Análisis) */
  .sl-colores { margin: 1.2rem 0 0; padding: .6rem .8rem; border: 1px solid var(--gdt-border); border-radius: var(--gdt-r-md); background: var(--gdt-surface-2); }
  .sl-colores summary { display: flex; align-items: center; gap: .45rem; min-height: 32px; cursor: pointer; list-style: none;
                        font-size: var(--sl-fs-sm); font-weight: 700; color: var(--gdt-text); }
  .sl-colores summary::-webkit-details-marker { display: none; }
  .sl-colores summary::before { content: ''; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
                                transform: rotate(-45deg); transition: transform .15s ease; }
  .sl-colores[open] summary::before { transform: rotate(45deg); }
  .sl-colores summary:focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; border-radius: 6px; }
  .sl-colores ul { list-style: none; margin: .5rem 0 .2rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
                   gap: .35rem .9rem; font-size: var(--sl-fs-sm); color: var(--gdt-text); }
  .sl-colores li { display: flex; align-items: center; gap: .5rem; }
  .sl-colores li i { flex: none; width: 14px; height: 14px; border-radius: 50%; }
  .sl-colores li i.esc-calor { width: 34px; border-radius: 7px; background: linear-gradient(90deg, rgb(40,60,170), rgb(25,170,230), rgb(40,210,110), rgb(250,225,50), rgb(255,135,25), rgb(225,15,15)); }
  .sl-colores li i.esc-vel { width: 34px; border-radius: 7px; background: linear-gradient(90deg, #ffe08a 0 33%, #ff9f43 33% 66%, #ff4d4d 66%); }

  /* ── Movimiento (rediseño E6, 7-oct) ──
     Corto (0,22 s) y solo al cambiar de partido, de pestaña, de sección o de página: no en cada actualización.
     Con «reducir movimiento» del sistema: un fundido de 0,15 s, sin desplazamientos ni agrandados. Las
     pestañas no tienen transición (en las capturas salían dos elegidas a mitad del cambio). */
  @keyframes slEntra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
  @keyframes slFundido { from { opacity: 0; } to { opacity: 1; } }
  .entra { animation: slEntra .22s ease-out both; }
  /* El marcador late con un gol (y aparece el aviso «¡Gol de…!») */
  @keyframes slGol { 0% { transform: scale(1); } 22% { transform: scale(1.22); color: var(--gdt-accent-hi); text-shadow: 0 0 22px rgba(0, 224, 90, .55); } 100% { transform: scale(1); } }
  @keyframes slGolQuieto { 0%, 45% { color: var(--gdt-accent-hi); text-shadow: 0 0 22px rgba(0, 224, 90, .55); } }
  .sl-score.late, .sl-pbar-mini b.late { animation: slGol 1.1s ease-out; }
  .sl-pbar-mini b { display: inline-block; }
  @media (prefers-reduced-motion: reduce) {
    .entra { animation: slFundido .15s linear both; }
    .sl-score.late, .sl-pbar-mini b.late { animation: slGolQuieto 1.4s ease-out; }
  }
  .sl-fn, .sl-chip, .sl-fl-dias button, .sl-pag button, .sl-sec-nav button, .sl-ver-todos, .sl-compartir, .sl-barra-btn {
    transition: border-color .15s ease, background-color .15s ease, color .15s ease; }
  /* Esqueleto de la tarjeta mientras carga (mismo alto que la tarjeta: la página no salta) */
  .sl-esq-card { min-height: 232px; display: grid; align-content: center; justify-items: center; gap: .9rem; }
  .sl-esq-card i { display: block; width: 60%; height: 1rem; border-radius: 6px; background: linear-gradient(90deg, var(--gdt-surface-2) 0%, #222a33 50%, var(--gdt-surface-2) 100%);
                   background-size: 200% 100%; animation: slEsq 1.3s linear infinite; }
  .sl-esq-card i:nth-child(3) { width: 30%; height: 2.6rem; }
  .sl-esq-card i:nth-child(4) { width: 45%; }
  @media (prefers-reduced-motion: reduce) { .sl-esq-card i { animation-duration: 3s; } }
  /* Estados vacíos y errores: una caja clara, no un renglón suelto */
  .sl-vt-nada { margin: .6rem 0; padding: 1.3rem 1rem; text-align: center; font-size: var(--sl-fs-md); line-height: 1.5; color: var(--gdt-text-mid);
                border: 1px dashed var(--gdt-border-hi); border-radius: var(--gdt-r-md); }

  /* ── Accesibilidad (rediseño E7, 7-oct) ── */
  /* Foco visible en todo lo que se puede tocar (también en la ventana de la jugada, que va en el body) */
  .sl-wrap :is(button, a[href], summary, select, input, textarea, [tabindex="0"]):focus-visible,
  .sl-rec-fondo :is(button, input):focus-visible { outline: 2px solid var(--gdt-accent); outline-offset: 2px; }
  .sl-tr-g:focus-visible circle.t { stroke: #fff; stroke-width: .9; stroke-opacity: 1; }
  /* Pantallas táctiles (y el celu): todo lo que se toca mide 40 px o más de alto */
  @media (pointer: coarse), (max-width: 760px) {
    .sl-compartir, .sl-cf-chip, .sl-rec-ver, .sl-colores summary, .sl-fl-mas summary, .sl-fl-dias button, .sl-fl-dia, .sl-canal,
    .sl-jg-seg button, .sl-jg-grupos button, .sl-mp-fila, .sl-mp-jugs button, .sl-pel-quitar, .sl-ver-todos, .sl-link,
    .sl-rec-ctl button, .sl-rec-cola button, .sl-an-fseg button { min-height: 40px; }
    .sl-cf-chip, .sl-rec-ver, .sl-link, .sl-compartir { display: inline-flex; align-items: center; justify-content: center; }
    .sl-chat-cab .sl-icono, .sl-rec-x { width: 40px; height: 40px; }
    .sl-msg-mas { width: 40px; height: 40px; top: 0; right: 0; }
    .sl-jg thead button { display: block; width: 100%; min-height: 40px; }
    .sl-fl-dia input { min-height: 38px; }
    .sl-link { padding: 0 .2rem; }
  }
  @keyframes slPanelIzq { from { transform: translateX(-100%); } to { transform: none; } }
  @keyframes slPanelDer { from { transform: translateX(100%); } to { transform: none; } }

/* ── Relato (oct-2026) ── */
.sl-wrap .sl-rl { list-style: none; margin: .4rem 0; padding: 0; display: grid; gap: .35rem; }
.sl-wrap .sl-rl-l { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr) auto; gap: .6rem; align-items: start;
  padding: .55rem .7rem; border-radius: 10px; background: var(--gdt-surface-2); font-size: var(--sl-fs-base); line-height: 1.5; }
.sl-wrap .sl-rl-l.t-gol { border-left: 3px solid var(--sl-gol); }
.sl-wrap .sl-rl-l.t-tarjeta { border-left: 3px solid var(--sl-falta); }
.sl-wrap .sl-rl-l.t-gran_atajada { border-left: 3px solid var(--sl-atajada); }
.sl-wrap .sl-rl-l.largo { background: var(--gdt-surface-3); }
.sl-wrap .sl-rl-min { font-size: var(--sl-fs-sm); font-weight: 700; color: var(--gdt-text-mid); padding-top: .1rem; font-variant-numeric: tabular-nums; }
.sl-wrap .sl-rl-txt { color: var(--gdt-text); overflow-wrap: anywhere; }
.sl-wrap .sl-rl-p { display: block; }
.sl-wrap .sl-rl-p + .sl-rl-p { margin-top: .5rem; }
.sl-wrap .sl-rl-l.t-gol .sl-rl-txt { font-weight: 600; }
.sl-wrap .sl-rl-borrar { background: none; border: 1px solid var(--gdt-border, rgba(255,255,255,.15)); color: var(--gdt-text-lo);
  border-radius: 8px; min-width: 2rem; min-height: 2rem; cursor: pointer; font-size: var(--sl-fs-sm); }
.sl-wrap .sl-rl-borrar:hover { color: var(--sl-perd); border-color: var(--sl-perd); }
@media (max-width: 480px) { .sl-wrap .sl-rl-l { grid-template-columns: 2.8rem minmax(0, 1fr) auto; gap: .45rem; padding: .5rem .55rem; } }
@media (max-width: 480px) {
  /* con 6 pestañas (Relato) no entran: la barra se desliza y ningún nombre se corta */
  .sl-wrap .sl-vt button { flex: 0 0 auto; padding-left: .6rem; padding-right: .6rem; overflow: visible; text-overflow: clip; }
}

  /* ── Offsides (plugin 0.9.12+, 13-oct-2026): blanco = offside; la forma dice cómo fue ── */
  .sl-tr .t.sl-off-p { fill: var(--sl-offside); stroke: #000; stroke-width: .35; }
  .sl-tr .t.sl-off-p.nada { fill: none; stroke: var(--sl-offside); stroke-width: .5; }
  .sl-tr-g:hover .t.sl-off-p, .sl-tr-g:focus-visible .t.sl-off-p, .sl-tr-g.sel .t.sl-off-p { stroke: var(--sl-destacado); stroke-width: .7; }
  .sl-tr .sl-off-poco { fill: none; stroke: var(--sl-offside); stroke-width: .35; stroke-dasharray: .8 .6; pointer-events: none; }
  .sl-tr .sl-off-lin { fill: none; stroke-width: .55; stroke-dasharray: 1.2 .9; pointer-events: none; }
  .sl-tr .sl-off-lin.l, .sl-rec-c .sl-off-l.l { stroke: var(--sl-local); }
  .sl-tr .sl-off-lin.v, .sl-rec-c .sl-off-l.v { stroke: var(--sl-visit); }
  .sl-tr .sl-off-pase { fill: none; stroke: var(--sl-offside); stroke-opacity: .45; stroke-width: .35; stroke-dasharray: .7 .7; pointer-events: none; }
  .sl-rec-c path.tiro.offside { stroke: var(--sl-offside); }
  .sl-rec-c .sl-off-l { fill: none; stroke-opacity: .95; }
  .sl-rec-c text.sl-off-tl { text-anchor: end; }
  .sl-rec-c text.sl-off-tl.l { fill: var(--sl-local); }
  .sl-rec-c text.sl-off-tl.v { fill: var(--sl-visit-hi); }
  .sl-rec-ley i.lin { border-top: 2px dashed var(--sl-local); }
  .sl-rec-ley i.lin.v { border-top-color: var(--sl-visit); }
  .sl-tr-ley i.sl-off-c, .sl-tr-ley i.sl-off-t, .sl-tr-ley i.sl-off-s, .sl-tr-ley i.sl-off-r { background: var(--sl-offside); }
  .sl-tr-ley i.sl-off-t { border-radius: 0; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
  .sl-tr-ley i.sl-off-s { border-radius: 1px; width: 9px; height: 9px; }
  .sl-tr-ley i.sl-off-r { border-radius: 1px; width: 8px; height: 8px; transform: rotate(45deg); }
  .sl-tr-ley i.sl-off-poco { border: 1.5px dashed var(--sl-offside); }
  .sl-tr-ley i.sl-off-lin { width: 16px; height: 0; border-radius: 0; border-top: 2px dashed var(--gdt-text-mid); }