/**
 * smgr/css/pages/manager_acb.css — mini-juego "200 Minutos" (el mini-mánager de la ACB).
 *
 * Reglas del port (iguales que masomenos.css):
 *   · El bloque :root con --mg-* va SIN scope (custom props globales inofensivas).
 *   · El fondo inmersivo va en .game-scope, no en body (el chrome Foco sigue claro).
 *   · TODO el resto va prefijado con ".game-scope " para aislar el juego de rincon.css.
 *
 * Diseño aprendido del mánager de Footholics: rejilla de escudos para elegir equipo,
 * CTA fijo abajo en móvil que además hace de contador, y tarjeta de reanudar con barra
 * de progreso + cajas de estadísticas.
 */

/* ===== Variables (globales, sin scope) ===== */
:root {
    --mg-navy:#1e3a5f; --mg-navy2:#2c5282; --mg-deep:#0f172a; --mg-orange:#ed8936;
    --mg-green:#16a34a; --mg-red:#ef4444; --mg-gold:#f59e0b;
    --mg-bg:#eef2f8; --mg-surface:#fff; --mg-border:#e2e8f0; --mg-muted:#64748b; --mg-ink:#0f172a;
    --mg-shadow:0 1px 2px rgba(15,23,42,.06),0 4px 16px rgba(15,23,42,.07);
    --mg-shadow2:0 2px 6px rgba(15,23,42,.10),0 14px 34px rgba(15,23,42,.12);
    --mg-cA:#1e3a5f; --mg-cB:#7a1220;
}

/* ===== Reset de aislamiento ===== */
.game-scope img { max-width:none; display:inline-block; vertical-align:middle; }
.game-scope button { font:inherit; }
.game-scope { background:var(--mg-bg); }

/* ===== Contenedor ===== */
.game-scope #mg-app { max-width:1180px; margin:0 auto; padding:16px 14px 26px; color:var(--mg-ink); }
.game-scope #mg-app *, .game-scope #mg-app *::before, .game-scope #mg-app *::after { box-sizing:border-box; }
.game-scope img.mg-esc { width:38px; height:38px; object-fit:contain; }
.game-scope .mg-num { font-family:'Space Grotesk',system-ui,sans-serif; font-variant-numeric:tabular-nums; }

/* ===== Tarjetas ===== */
.game-scope .mg-card { background:var(--mg-surface); border-radius:14px; box-shadow:var(--mg-shadow); padding:18px; margin-bottom:14px; }
.game-scope .mg-card.pad0 { padding:0; overflow:hidden; }
.game-scope .mg-h2 { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.28rem; font-weight:700; margin:0 0 3px; letter-spacing:-.3px; }
.game-scope .mg-sub { font-size:13px; color:var(--mg-muted); line-height:1.5; }
.game-scope .mg-lbl { font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.7px; color:var(--mg-muted); margin-bottom:7px; }

/* ===== Hero de portada ===== */
.game-scope .mg-hero { background:linear-gradient(125deg,var(--mg-navy),var(--mg-deep)); color:#fff;
    border-radius:14px; padding:22px 20px; margin-bottom:14px; box-shadow:var(--mg-shadow2); }
.game-scope .mg-hero h1 { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.6rem; font-weight:700; margin:0 0 6px; letter-spacing:-.5px; }
.game-scope .mg-hero img.lockup { width:auto; height:74px; max-width:100%; margin:-6px 0 8px -8px; }
@media (max-width:640px) { .game-scope .mg-hero img.lockup { height:56px; margin-left:-4px; } }
.game-scope .mg-hero .desc { font-family:'JetBrains Mono',ui-monospace,monospace; font-size:10.5px;
    font-weight:700; text-transform:uppercase; letter-spacing:1.6px; color:var(--mg-orange); margin:-2px 0 9px; }
.game-scope .mg-hero p { font-size:13.5px; color:#b9c8dd; margin:0; line-height:1.55; max-width:62ch; }
.game-scope .mg-hero .mg-pills { display:flex; gap:7px; flex-wrap:wrap; margin-top:13px; }
.game-scope .mg-hero .mg-pill { font-size:11px; font-weight:700; background:rgba(255,255,255,.12); color:#dbe6f4;
    padding:5px 10px; border-radius:99px; }

/* ===== Botones ===== */
.game-scope .mg-btn { display:block; width:100%; border:0; border-radius:11px; padding:14px 16px; cursor:pointer;
    font-size:15.5px; font-weight:800; background:var(--mg-navy); color:#fff; box-shadow:var(--mg-shadow); transition:filter .12s,transform .06s; }
.game-scope .mg-btn:hover:not(:disabled) { filter:brightness(1.16); }
.game-scope .mg-btn:active { transform:translateY(1px); }
.game-scope .mg-btn:disabled { background:#9fb0c4; cursor:not-allowed; box-shadow:none; }
.game-scope .mg-btn.go { background:var(--mg-orange); color:#231202; }
.game-scope .mg-btn.sec { background:#fff; color:#334155; border:1px solid var(--mg-border); box-shadow:none; }
.game-scope .mg-btn.sm { width:auto; padding:9px 15px; font-size:13px; border-radius:9px; }
.game-scope .mg-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:12px; }
.game-scope .mg-actions .mg-btn { flex:1 1 auto; width:auto; }

/* ===== Segmentado ===== */
.game-scope .mg-seg { display:inline-flex; background:#fff; border:1px solid var(--mg-border); border-radius:11px; overflow:hidden; }
.game-scope .mg-seg button { border:0; background:#fff; color:#475569; font-size:12.5px; font-weight:700; padding:9px 13px; cursor:pointer; }
.game-scope .mg-seg button.on { background:var(--mg-navy); color:#fff; }
.game-scope .mg-seg.wide { display:flex; width:100%; }
.game-scope .mg-seg.wide button { flex:1; }

/* Chips de ELECCIÓN (defensa, cómo ver el partido). Separados y con marca de radio a propósito:
   el .mg-seg de arriba es una tira unida que se lee como PESTAÑAS ("esto cambia el panel de
   abajo") y esto no cambia de panel, se elige una opción. */
.game-scope .mg-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:11px; }
.game-scope .mg-chip { display:inline-flex; align-items:center; gap:8px; background:#fff;
    border:1.5px solid var(--mg-border); border-radius:999px; padding:8px 15px 8px 12px;
    font-size:13px; font-weight:700; color:#334155; cursor:pointer;
    transition:border-color .12s, background .12s, color .12s; }
.game-scope .mg-chip::before { content:''; width:13px; height:13px; border-radius:50%;
    border:2px solid #cbd5e1; flex:0 0 auto; transition:border-color .12s, box-shadow .12s; }
.game-scope .mg-chip i { font-style:normal; font-weight:600; font-size:11.5px; color:var(--mg-muted); }
.game-scope .mg-chip:hover { background:#f4f7fb; border-color:#c7d5e6; }
.game-scope .mg-chip.on { background:var(--mg-navy); border-color:var(--mg-navy); color:#fff; }
.game-scope .mg-chip.on::before { border-color:#fff; box-shadow:inset 0 0 0 2.5px var(--mg-navy), 0 0 0 1px #fff; background:#fff; }
.game-scope .mg-chip.on i { color:#b9c8dd; }

/* ===== Elegir equipo (patrón Footholics) ===== */
.game-scope .mg-pick { display:grid; grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); gap:9px; padding:2px; }
.game-scope .mg-team { border:1px solid var(--mg-border); border-radius:12px; padding:10px 6px 9px; text-align:center;
    cursor:pointer; background:#fff; transition:border-color .1s,background .1s,box-shadow .1s; }
.game-scope .mg-team:hover { background:#f4f7fb; }
.game-scope .mg-team.sel { border-color:var(--mg-navy2); background:#eef4fb; box-shadow:0 0 0 2px #a8c6e8; }
.game-scope .mg-team img { width:42px; height:42px; object-fit:contain; }
.game-scope .mg-team .nm { font-size:11.5px; font-weight:800; margin-top:6px; line-height:1.1; }
.game-scope .mg-team .pj { font-size:10px; font-weight:700; margin-top:3px; color:var(--mg-muted); }
.game-scope .mg-team .pj.alto { color:var(--mg-green); }
.game-scope .mg-team .pj.bajo { color:var(--mg-red); }

/* ===== Reanudar ===== */
.game-scope .mg-res-team { display:flex; align-items:center; gap:13px; margin:10px 0; }
.game-scope .mg-res-team img { width:54px; height:54px; object-fit:contain; flex:0 0 auto; }
.game-scope .mg-res-team .nm { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.3rem; font-weight:700; line-height:1.1; }
.game-scope .mg-res-team .sb { font-size:12.5px; font-weight:700; color:var(--mg-muted); margin-top:3px; }
.game-scope .mg-bar { height:7px; border-radius:99px; background:#e3eaf3; overflow:hidden; margin:10px 0 12px; }
.game-scope .mg-bar i { display:block; height:100%; background:linear-gradient(90deg,var(--mg-navy2),var(--mg-orange)); transition:width .3s; }
.game-scope .mg-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.game-scope .mg-stats .s { background:#f5f8fc; border:1px solid var(--mg-border); border-radius:10px; padding:9px 4px; text-align:center; }
.game-scope .mg-stats .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.1rem; font-weight:700; }
.game-scope .mg-stats .l { font-size:9.5px; text-transform:uppercase; letter-spacing:.4px; font-weight:800; color:var(--mg-muted); margin-top:2px; }

/* ===== Objetivo ===== */
.game-scope .mg-obj { display:flex; gap:16px; flex-wrap:wrap; align-items:center; background:#f5f8fc;
    border-left:3px solid var(--mg-navy); border-radius:10px; padding:12px 14px; margin-top:12px; }
.game-scope .mg-obj .k { font-size:9.5px; text-transform:uppercase; letter-spacing:.7px; color:var(--mg-muted); font-weight:800; display:block; }
.game-scope .mg-obj .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.15rem; font-weight:700; }
.game-scope .mg-obj .tx { flex:1 1 240px; font-size:11.5px; color:var(--mg-muted); line-height:1.5; }

/* ===== Reparto de minutos ===== */
.game-scope .mg-mins { display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr)); gap:0 20px; }
.game-scope .mg-row { display:flex; align-items:center; gap:9px; padding:8px 0; border-bottom:1px solid #f1f5f9; }
.game-scope .mg-row.cero { opacity:.45; }
.game-scope .mg-row .nm { flex:1; font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.game-scope .mg-row .pos { font-size:9.5px; font-weight:800; width:17px; height:17px; line-height:17px; text-align:center;
    border-radius:4px; color:#fff; flex:0 0 auto; }
.game-scope .mg-row .pos.B { background:#2563eb; } .game-scope .mg-row .pos.A { background:#7c3aed; } .game-scope .mg-row .pos.P { background:#059669; }
.game-scope .mg-row .st { display:flex; align-items:center; gap:2px; flex:0 0 auto; }
.game-scope .mg-row .st button { width:29px; height:29px; border:1px solid var(--mg-border); background:#fff; border-radius:7px;
    font-size:15px; font-weight:800; color:#475569; cursor:pointer; line-height:1; padding:0; }
.game-scope .mg-row .st button:active { background:#eef2f7; }
.game-scope .mg-row .st .mn { width:34px; text-align:center; font-family:'Space Grotesk',system-ui,sans-serif; font-weight:700; font-size:14px; }

/* ===== Barra CTA fija (Footholics) ===== */
/* Barra de CTA pegajosa. Va SIEMPRE como último hijo de .mg-card: los márgenes negativos
   cancelan EXACTAMENTE el padding de la tarjeta (18px, 14px en móvil) para quedar a ras de su
   borde inferior, con las mismas esquinas redondeadas. Si se saca de la tarjeta, sobresale por
   los lados y se come el principio del bloque siguiente. */
.game-scope .mg-cta-bar { position:sticky; bottom:0; z-index:30; background:rgba(255,255,255,.96);
    backdrop-filter:blur(6px); border-top:1px solid var(--mg-border); border-radius:0 0 14px 14px;
    margin:14px -18px -18px; padding:11px 18px calc(11px + env(safe-area-inset-bottom,0px));
    display:flex; align-items:center; gap:12px; }
.game-scope .mg-cta-bar .cnt { flex:0 0 auto; font-size:12.5px; font-weight:800; }
.game-scope .mg-cta-bar .cnt b { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.05rem; }
.game-scope .mg-cta-bar .cnt.ok { color:var(--mg-green); } .game-scope .mg-cta-bar .cnt.bad { color:var(--mg-red); }
.game-scope .mg-cta-bar .mg-btn { flex:1 1 auto; width:auto; }

/* Pestañas dentro de una caja (jugada a jugada / clasificación en modo narrada). */
.game-scope .mg-tabs { display:flex; gap:0; background:var(--mg-deep); }
.game-scope .mg-tabs button { flex:1; border:0; background:transparent; color:#93a7c4; cursor:pointer;
    font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; padding:10px 8px;
    border-bottom:2px solid transparent; }
.game-scope .mg-tabs button.on { color:#fff; border-bottom-color:var(--mg-orange); }
.game-scope .mg-feed #mgClaWrap { max-height:340px; overflow-y:auto; }
/* Cosas que sólo existen en móvil: en escritorio hay sitio para todo a la vez. */
.game-scope .mg-tabs.solo-movil, .game-scope .solo-movil { display:none; }

/* Desplegable de los otros ocho partidos. */
.game-scope button.mg-desplegar { width:100%; margin-top:13px; background:#fff; color:var(--mg-navy2);
    border:1px solid var(--mg-border); border-radius:11px; padding:11px 14px; font-size:12.5px;
    font-weight:800; cursor:pointer; box-shadow:var(--mg-shadow); align-items:center;
    justify-content:center; gap:7px; }
.game-scope button.mg-desplegar i { font-style:normal; font-size:10px; opacity:.7; }

/* Barra fija con resultado y minuto: aparece cuando el marcador grande se va de la pantalla. */
/* Va ARRIBA, justo debajo de la cabecera del sitio (que es sticky): el marcador es lo que se
   consulta de un vistazo, y abajo obligaba a bajar hasta el final. El `top` lo pone el JS midiendo
   la cabecera, que en móvil tiene dos filas y no se puede dar por sabida. z-index por debajo de la
   cabecera (300) para no taparla. */
.game-scope .mg-barra { position:fixed; left:0; right:0; top:0; z-index:60;
    background:rgba(15,23,42,.96); backdrop-filter:blur(6px); color:#fff;
    display:flex; align-items:center; justify-content:center; gap:10px;
    padding:9px 12px; box-shadow:0 6px 20px rgba(15,23,42,.35); }
.game-scope .mg-barra[hidden] { display:none; }
.game-scope .mg-barra .eq { font-family:'Space Grotesk',system-ui,sans-serif; font-size:12.5px;
    font-weight:700; letter-spacing:.4px; color:#b9c8dd; }
.game-scope .mg-barra b { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.5rem;
    font-weight:700; line-height:1; font-variant-numeric:tabular-nums; }
.game-scope .mg-barra .rl { font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:700;
    letter-spacing:1px; color:var(--mg-orange); background:rgba(255,255,255,.09);
    padding:4px 9px; border-radius:99px; white-space:nowrap; }

/* Medias de temporada bajo el nombre, en el reparto de minutos: el dato justo donde se decide. */
/* Mercado (reglas >= 3): las propuestas del director deportivo. */
.game-scope .mg-ofertas { display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:9px; margin-top:10px; }
.game-scope .mg-oferta { border:1px solid var(--mg-border); border-radius:11px; padding:11px; background:#fff; }
.game-scope .mg-oferta .of-cab { display:flex; align-items:center; gap:7px; }
.game-scope .mg-oferta .of-cab b { font-size:13.5px; }
.game-scope .mg-oferta .of-tag { font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  color:#0369a1; background:#e0f2fe; border-radius:5px; padding:2px 5px; }
.game-scope .mg-oferta.de-acb { border-color:#c7d2fe; background:#f8faff; }
.game-scope .mg-oferta .of-tag.acb { color:#3730a3; background:#e0e7ff; }
.game-scope .mg-oferta .of-tag.ex { color:#92400e; background:#fef3c7; }
.game-scope .mg-oferta .of-num i { color:var(--mg-muted); font-weight:600; }
.game-scope .mg-oferta .of-num { font-size:11.5px; color:var(--mg-muted); font-weight:600; margin:7px 0 9px; }
.game-scope .mg-oferta .pos { font-size:9.5px; font-weight:800; width:17px; height:17px; line-height:17px; text-align:center;
  border-radius:5px; color:#fff; flex:0 0 auto; }
.game-scope .mg-oferta .pos.B { background:#2563eb; } .game-scope .mg-oferta .pos.A { background:#7c3aed; }
.game-scope .mg-oferta .pos.P { background:#059669; }
/* Energía del jugador (reglas de temporada >= 2): la fatiga que se arrastra entre partidos. */
.game-scope .mg-row .mg-en { display:inline-block; vertical-align:middle; width:38px; height:5px; margin-left:7px;
  background:#e5e7eb; border-radius:3px; overflow:hidden; }
.game-scope .mg-row .mg-en i { display:block; height:100%; border-radius:3px; }
.game-scope .mg-row .med { display:block; font-size:11px; font-weight:600; color:var(--mg-muted);
    margin-top:2px; font-variant-numeric:tabular-nums; }
.game-scope .mg-row .med i { font-style:normal; opacity:.7; }

/* Cabecera de un partido de eliminatoria: yo · contra/recibe a/visita a · rival. */
.game-scope .mg-rival { display:flex; align-items:center; justify-content:center; gap:11px;
    margin-top:11px; flex-wrap:wrap; }
.game-scope .mg-rival b { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.15rem; font-weight:700; }
.game-scope .mg-rival span { color:var(--mg-muted); font-weight:800; font-size:12px; }
.game-scope .mg-rival img, .game-scope .mg-rival img.mg-esc { width:30px; height:30px; object-fit:contain; }

/* ===== Marcador ===== */
.game-scope .mg-board { background:var(--mg-deep); border-radius:14px; overflow:hidden; box-shadow:var(--mg-shadow2); }
.game-scope .mg-bmain { display:flex; align-items:stretch; color:#fff; }
.game-scope .mg-bt { flex:1 1 0; min-width:0; display:flex; align-items:center; gap:11px; padding:17px 15px; position:relative; }
.game-scope .mg-bt::before { content:''; position:absolute; inset:0; opacity:.32; }
.game-scope .mg-bt.a::before { background:linear-gradient(90deg,var(--mg-cA),transparent); }
.game-scope .mg-bt.b::before { background:linear-gradient(-90deg,var(--mg-cB),transparent); }
.game-scope .mg-bt > * { position:relative; z-index:1; }
.game-scope .mg-bt.b { flex-direction:row-reverse; text-align:right; }
.game-scope .mg-bt img { width:44px; height:44px; object-fit:contain; filter:drop-shadow(0 2px 6px rgba(0,0,0,.45)); }
.game-scope .mg-bt .cod { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.35rem; font-weight:700; letter-spacing:.4px; line-height:1; }
.game-scope .mg-bt .tu { display:inline-block; font-size:9px; background:var(--mg-orange); color:#231202; padding:2px 6px;
    border-radius:4px; font-weight:800; margin-top:5px; letter-spacing:.4px; }
.game-scope .mg-sc { font-family:'Space Grotesk',system-ui,sans-serif; font-size:3rem; font-weight:700; line-height:1;
    min-width:74px; text-align:center; align-self:center; color:#fff; transition:color .25s; }
.game-scope .mg-sc.up { color:var(--mg-gold); }
.game-scope .mg-mid { align-self:center; text-align:center; min-width:100px; padding:0 4px; }
.game-scope .mg-clock { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.7rem; font-weight:700; color:var(--mg-gold); line-height:1.05; }
.game-scope .mg-per { font-size:9.5px; text-transform:uppercase; letter-spacing:1.2px; color:#8ba0bb; margin-top:4px; font-weight:800; }
.game-scope .mg-parc { display:flex; background:rgba(255,255,255,.05); border-top:1px solid rgba(255,255,255,.09); color:#c4d2e4; font-size:11.5px; }
.game-scope .mg-parc div { flex:1; text-align:center; padding:7px 2px; border-right:1px solid rgba(255,255,255,.06); }
.game-scope .mg-parc div:last-child { border-right:0; }
.game-scope .mg-parc b { color:#fff; font-weight:800; }
.game-scope .mg-spark { background:rgba(255,255,255,.04); padding:3px 10px 1px; }
.game-scope .mg-spark svg { display:block; width:100%; height:28px; }
.game-scope .mg-parc .k { display:block; font-size:8.5px; letter-spacing:.9px; color:#7f93ae; text-transform:uppercase; margin-bottom:1px; }

/* ===== Parrilla de la jornada ===== */
.game-scope .mg-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-top:12px; }
.game-scope .mg-mini { background:#fff; border-radius:10px; box-shadow:var(--mg-shadow); padding:9px 11px; position:relative; }
.game-scope .mg-mini .q { position:absolute; top:6px; right:8px; font-size:8.5px; font-weight:800; color:var(--mg-orange); letter-spacing:.6px; }
.game-scope .mg-mini.fin .q { color:#9aa7b8; }
.game-scope .mg-mini .f { display:flex; align-items:center; gap:7px; padding:3px 0; }
.game-scope .mg-mini .f img { width:19px; height:19px; object-fit:contain; }
.game-scope .mg-mini .f .c { flex:1; font-size:12px; font-weight:700; }
.game-scope .mg-mini .f .p { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1rem; font-weight:700; min-width:26px; text-align:right; }
.game-scope .mg-mini .f.gana .p { color:var(--mg-green); }
.game-scope .mg-mini .f.pierde { opacity:.5; }

/* ===== Dos columnas: acta + clasificación / narración ===== */
.game-scope .mg-cols { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:13px; margin-top:13px; align-items:start; }
/* narrada: tu acta + la del rival + el jugada a jugada */
.game-scope .mg-cols.narrada { grid-template-columns:minmax(0,1fr) minmax(0,1fr) 300px; }
.game-scope .mg-cols > * { min-width:0; }
.game-scope .mg-box { background:#fff; border-radius:12px; overflow:hidden; box-shadow:var(--mg-shadow); }
.game-scope .mg-box h3 { font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:.7px; padding:11px 13px;
    color:#fff; background:var(--mg-deep); display:flex; justify-content:space-between; align-items:center; gap:8px; margin:0; }
.game-scope .mg-box h3 .p { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.05rem; font-weight:700; }
.game-scope .mg-box .sc { overflow-x:auto; }
.game-scope table.mg-t { width:100%; border-collapse:collapse; font-size:12px; }
.game-scope table.mg-t th { background:#f8fafc; font-size:9.5px; text-transform:uppercase; letter-spacing:.4px; color:var(--mg-muted);
    padding:8px 4px; text-align:right; font-weight:800; border-bottom:1px solid var(--mg-border); }
.game-scope table.mg-t th:first-child { text-align:left; padding-left:12px; }
.game-scope table.mg-t td { padding:6px 4px; text-align:right; border-bottom:1px solid #f1f5f9; white-space:nowrap;
    font-variant-numeric:tabular-nums; }
.game-scope table.mg-t td:first-child { text-align:left; padding-left:12px; overflow:hidden; text-overflow:ellipsis; font-weight:600; }
.game-scope table.mg-t tr.pista td { background:#fffbeb; }
.game-scope table.mg-t tr.pista td:first-child { box-shadow:inset 3px 0 0 var(--mg-orange); }
.game-scope table.mg-t tr.fuera td { opacity:.4; }
.game-scope table.mg-t td.pts { font-weight:800; }
.game-scope table.mg-t td.val { font-weight:800; color:var(--mg-navy); }
.game-scope .mg-en { display:inline-block; width:28px; height:6px; background:#e3eaf3; border-radius:4px; overflow:hidden; vertical-align:middle; }
.game-scope .mg-en i { display:block; height:100%; border-radius:4px; }

/* clasificación */
.game-scope table.mg-t.cla td:first-child { padding-left:8px; }
.game-scope table.mg-t.cla .pos { color:var(--mg-muted); font-weight:800; width:20px; display:inline-block; text-align:right; margin-right:6px; }
.game-scope table.mg-t.cla tr.yo td { background:#fffbeb; font-weight:800; }
.game-scope table.mg-t.cla tr.yo td:first-child { box-shadow:inset 3px 0 0 var(--mg-orange); }
.game-scope table.mg-t.cla .zplay { border-left:3px solid var(--mg-green); }
.game-scope table.mg-t.cla .zdesc { border-left:3px solid var(--mg-red); }
.game-scope table.mg-t.cla img { width:15px; height:15px; object-fit:contain; vertical-align:-3px; margin-right:5px; }
.game-scope .mg-leg { font-size:10.5px; color:var(--mg-muted); padding:8px 12px; line-height:1.5; border-top:1px solid var(--mg-border); }

/* narración */
.game-scope .mg-feed .list { overflow-y:auto; max-height:520px; }
.game-scope .mg-ev { padding:9px 12px; border-bottom:1px solid #f1f5f9; font-size:12.5px; display:flex; gap:9px; line-height:1.45;
    animation:mgEnt .3s ease-out; }
@keyframes mgEnt { from { opacity:0; transform:translateY(-7px); } to { opacity:1; transform:none; } }
.game-scope .mg-ev .t { color:#94a3b8; font-size:10.5px; min-width:48px; font-weight:800; padding-top:1px; font-variant-numeric:tabular-nums; }
.game-scope .mg-ev .x { flex:1; min-width:0; }
.game-scope .mg-ev .eq { display:inline-block; width:7px; height:7px; border-radius:2px; margin-right:6px; vertical-align:middle; }
.game-scope .mg-ev.sc { background:#f0fdf4; }
.game-scope .mg-ev.tri { background:#dcfce7; font-weight:600; }
.game-scope .mg-ev.neg { background:#fef2f2; }
.game-scope .mg-ev.hito { background:var(--mg-deep); color:#fff; font-weight:700; font-size:13px; }
.game-scope .mg-ev.hito .t { color:#8ba0bb; }
.game-scope .mg-ev.mio { box-shadow:inset 3px 0 0 var(--mg-orange); }
.game-scope .mg-ev.cuarto { background:#e9eff7; font-weight:800; font-size:11px; text-transform:uppercase; letter-spacing:1px; color:#475569; }

/* ===== Cuadro de eliminatorias ===== */
/* El margen de abajo importa: el cuadro va seguido del resumen de temporada (o de la tarjeta de
   la Copa) y sin él la tira dorada del campeón queda pegada al bloque siguiente. */
.game-scope .mg-cuadro { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px;
    margin:13px 0 15px; align-items:start; }
.game-scope .mg-ronda { background:#fff; border-radius:12px; box-shadow:var(--mg-shadow); overflow:hidden; }
.game-scope .mg-ronda h3 { font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.9px; padding:10px 13px;
    background:var(--mg-deep); color:#fff; margin:0; }
.game-scope .mg-serie { padding:9px 12px; border-bottom:1px solid #f1f5f9; }
.game-scope .mg-serie:last-child { border-bottom:0; }
.game-scope .mg-serie .l { display:flex; align-items:center; gap:8px; padding:3px 0; }
.game-scope .mg-serie .l img { width:20px; height:20px; object-fit:contain; }
.game-scope .mg-serie .l .c { flex:1; font-size:13px; font-weight:700; }
.game-scope .mg-serie .l .w { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.05rem; font-weight:700; min-width:20px; text-align:right; }
.game-scope .mg-serie .l.gana .w { color:var(--mg-green); }
.game-scope .mg-serie .l.pierde { opacity:.5; }
.game-scope .mg-serie .l.esmio .c::after { content:' TÚ'; font-size:8.5px; background:var(--mg-orange); color:#231202;
    padding:1px 4px; border-radius:3px; margin-left:5px; font-weight:800; vertical-align:1px; }
.game-scope .mg-serie .js { font-size:10.5px; color:var(--mg-muted); margin-top:4px; font-variant-numeric:tabular-nums; }
/* El campeón es una TIRA a todo el ancho bajo el cuadro. Sin `grid-column:1/-1` sería el cuarto
   hijo de una rejilla de tres columnas: se caería a una segunda fila y quedaría encajado debajo
   de la columna de Cuartos, que es como se veía roto. */
.game-scope .mg-campeon-wrap { grid-column:1 / -1; margin-bottom:4px; }
.game-scope .mg-campeon { background:linear-gradient(115deg,#b8860b,#f5c542); color:#3b2f00; border-radius:12px;
    padding:13px 20px; box-shadow:var(--mg-shadow2); display:flex; align-items:center; gap:15px; }
.game-scope .mg-campeon img { width:42px; height:42px; object-fit:contain; flex:0 0 auto; }
.game-scope .mg-campeon .k { font-size:10px; text-transform:uppercase; letter-spacing:1.4px; font-weight:800; opacity:.78; }
.game-scope .mg-campeon .n { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.6rem; font-weight:700;
    line-height:1.05; }
.game-scope .mg-campeon .tu { margin-left:auto; font-size:11px; font-weight:800; text-transform:uppercase;
    letter-spacing:.8px; background:rgba(59,47,0,.16); padding:5px 11px; border-radius:99px; }

/* ===== Fin de jornada / temporada ===== */
.game-scope .mg-fin { background:#fff; border-radius:12px; box-shadow:var(--mg-shadow2); padding:20px; margin-top:13px;
    text-align:center; border-top:4px solid var(--mg-orange); }
.game-scope .mg-fin .r { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.9rem; font-weight:700; margin:6px 0; }
.game-scope .mg-fin .v { font-weight:800; font-size:13px; letter-spacing:.5px; }
.game-scope .mg-fin .d { font-size:13px; color:#475569; margin-top:9px; line-height:1.7; }
.game-scope .mg-fin .nota { margin-top:14px; background:#f5f8fc; border-radius:11px; padding:13px 18px; display:inline-block; }
.game-scope .mg-fin .nota .k { font-size:9.5px; text-transform:uppercase; letter-spacing:1.2px; color:var(--mg-muted); font-weight:800; }
.game-scope .mg-fin .nota .v2 { font-family:'Space Grotesk',system-ui,sans-serif; font-size:2.2rem; font-weight:700; }

.game-scope img.mg-mini-esc { width:16px; height:16px; object-fit:contain; vertical-align:-3px; }

/* ===== Nombre de invitado ===== */
.game-scope .mg-guest { margin-top:14px; background:#f5f8fc; border-left:3px solid var(--mg-navy); border-radius:10px; padding:12px 14px; }
.game-scope .mg-guest label { display:block; font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.7px; color:var(--mg-muted); margin-bottom:6px; }
.game-scope .mg-guest input { width:100%; max-width:340px; padding:10px 12px; border:1px solid var(--mg-border); border-radius:9px; font-size:14.5px; }
.game-scope .mg-guest .err { display:none; color:var(--mg-red); font-size:12px; font-weight:700; margin-top:6px; }
.game-scope .mg-guest .tip { font-size:11.5px; color:var(--mg-muted); margin-top:7px; }
.game-scope .mg-guest.error input { border-color:var(--mg-red); box-shadow:0 0 0 2px #fecaca; }
.game-scope .mg-guest.error .err { display:block; }

/* ===== Palmarés (vitrina, como en Footholics) ===== */
.game-scope .mg-logros { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; margin-top:12px; }
.game-scope .mg-logro { background:linear-gradient(135deg,#fffdf5,#fff7e6); border:1px solid #f3dfae; border-radius:12px; padding:12px; text-align:center; }
.game-scope .mg-logro .ico { font-size:20px; line-height:1; }
.game-scope .mg-logro .n { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.9rem; font-weight:700; color:#8a6100; line-height:1.05; }
.game-scope .mg-logro .nm { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.5px; color:#7c5a12; }
.game-scope .mg-logro .cl { margin-top:7px; display:flex; gap:3px; justify-content:center; flex-wrap:wrap; }
.game-scope .mg-logro .cl img { width:22px; height:22px; object-fit:contain; }
.game-scope .mg-falta { display:flex; gap:8px; flex-wrap:wrap; margin-top:11px; }
.game-scope .mg-falta span { font-size:11px; font-weight:700; color:var(--mg-muted); background:#f5f8fc; border-radius:99px; padding:5px 11px; }

/* ===== Validación del servidor ===== */
.game-scope .mg-val { font-size:12.5px; font-weight:700; margin-top:11px; padding:9px 13px; border-radius:9px;
    background:#f5f8fc; color:var(--mg-muted); display:inline-block; }
.game-scope .mg-val.ok { background:#f0fdf4; color:#15803d; }
.game-scope .mg-val.dif { background:#fffbeb; color:#92400e; }
.game-scope .mg-val.err { background:#fef2f2; color:#b91c1c; }

/* ===== Tarjeta compartible (1200x675, fuera de pantalla) ===== */
#mg-share { position:fixed; left:-20000px; top:0; width:1200px; height:675px; }
#mg-share .card { width:1200px; height:675px; position:relative; overflow:hidden; color:#fff;
    background:linear-gradient(135deg,#0F172A,#1E3A5F); font-family:Inter,system-ui,sans-serif; }
#mg-share .rej { position:absolute; inset:0; opacity:.05; }
#mg-share .rej i { position:absolute; background:#fff; }
#mg-share .marca { position:absolute; left:56px; top:44px; display:flex; align-items:center; gap:16px; }
#mg-share .marca img { width:84px; height:84px; }
#mg-share .marca .n { font-family:'Space Grotesk',system-ui,sans-serif; font-size:34px; font-weight:700; letter-spacing:-1px; line-height:1; }
#mg-share .marca .d { font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; letter-spacing:2.4px;
    color:#93a7c4; margin-top:7px; }
#mg-share .eq { position:absolute; right:56px; top:40px; text-align:right; }
#mg-share .eq img { width:96px; height:96px; object-fit:contain; }
#mg-share .cuerpo { position:absolute; left:56px; top:176px; right:56px; }
#mg-share .ver { font-family:'JetBrains Mono',monospace; font-size:19px; font-weight:700; letter-spacing:3.4px; }
#mg-share .pos { font-family:'Space Grotesk',system-ui,sans-serif; font-size:112px; font-weight:700; line-height:1;
    letter-spacing:-3px; margin-top:6px; }
#mg-share .pos small { font-size:44px; color:#b9c8dd; letter-spacing:-1px; margin-left:14px; }
#mg-share .prev { font-size:25px; color:#dbe6f4; margin-top:14px; }
#mg-share .prev b { color:#fff; }
#mg-share .prev .delta { font-family:'Space Grotesk',system-ui,sans-serif; font-weight:700; }
#mg-share .titulos { display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; }
#mg-share .titulos span { font-size:16px; font-weight:700; background:rgba(255,255,255,.12); padding:8px 15px; border-radius:99px; }
/* Columna derecha: los datos de temporada que dan conversación (máximo anotador, racha).
   La izquierda lleva el titular (puesto + previsión); la derecha, el detalle. */
#mg-share .dcha { position:absolute; right:56px; top:214px; width:396px; text-align:right; }
#mg-share .dcha .dato { margin-bottom:26px; }
#mg-share .dcha .k { font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700;
    letter-spacing:2.4px; color:#7f93ae; }
#mg-share .dcha .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:29px; font-weight:700;
    letter-spacing:-.8px; margin-top:5px; line-height:1.1; }
#mg-share .dcha .s { font-size:16px; color:#b9c8dd; margin-top:3px; }
#mg-share .cuerpo { right:480px; }        /* deja sitio a la columna derecha */
#mg-share .tira { position:absolute; left:56px; bottom:112px; display:flex; gap:3px; }
#mg-share .tira i { width:24px; height:13px; border-radius:3px; }
#mg-share .tiraTxt { position:absolute; left:56px; bottom:88px; font-family:'JetBrains Mono',monospace;
    font-size:11px; font-weight:700; letter-spacing:1.6px; color:#7f93ae; }
#mg-share .nota { position:absolute; right:56px; bottom:84px; text-align:right; }
#mg-share .nota .k { font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; letter-spacing:2.6px; color:#93a7c4; }
#mg-share .nota .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:76px; font-weight:700; line-height:1; letter-spacing:-2px; }
#mg-share .pie { position:absolute; left:56px; bottom:38px; font-family:'JetBrains Mono',monospace;
    font-size:15px; font-weight:700; letter-spacing:1.4px; color:#93a7c4; }
#mg-share .pie s { text-decoration:none; color:#ED8936; }

/* ===== Resumen de fin de temporada (en pantalla) =====
   Mismo lenguaje que la tarjeta compartible (#mg-share) pero FLUIDO: mucha gente hace captura de
   pantalla en vez de usar los botones, así que lo que se ve tiene que valer ya como imagen.
   Escalar la tarjeta de 1200x675 con transform no sirve: en 390px las etiquetas quedarían a 4px. */
.game-scope .mg-resumen { background:linear-gradient(135deg,var(--mg-deep),var(--mg-navy)); color:#fff;
    border-radius:16px; padding:22px 24px 20px; box-shadow:var(--mg-shadow2); margin-bottom:13px;
    position:relative; overflow:hidden; }
.game-scope .mg-resumen .cab { display:flex; align-items:center; gap:13px; }
.game-scope .mg-resumen .cab img.mk { width:52px; height:52px; flex:0 0 auto; }
.game-scope .mg-resumen .cab .tt { flex:1 1 auto; min-width:0; }
.game-scope .mg-resumen .cab .n { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.3rem;
    font-weight:700; letter-spacing:-.5px; line-height:1; }
.game-scope .mg-resumen .cab .d { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700;
    letter-spacing:1.8px; color:#93a7c4; margin-top:6px; }
.game-scope .mg-resumen .cab .esc img, .game-scope .mg-resumen .cab .esc img.mg-esc {
    width:54px; height:54px; object-fit:contain; background:#fff; border-radius:9px; padding:4px; }
.game-scope .mg-resumen .ver { font-family:'JetBrains Mono',monospace; font-size:12.5px; font-weight:700;
    letter-spacing:2.6px; margin-top:19px; }
.game-scope .mg-resumen .big { display:flex; align-items:baseline; gap:12px; margin-top:2px; }
.game-scope .mg-resumen .big .pos { font-family:'Space Grotesk',system-ui,sans-serif; font-size:4.4rem;
    font-weight:700; line-height:1; letter-spacing:-2px; }
.game-scope .mg-resumen .big .rec { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.9rem;
    font-weight:700; color:#b9c8dd; letter-spacing:-.5px; }
.game-scope .mg-resumen .prev { font-size:15px; color:#dbe6f4; margin-top:7px; }
.game-scope .mg-resumen .prev b { color:#fff; }
.game-scope .mg-resumen .chips { display:flex; gap:7px; margin-top:13px; flex-wrap:wrap; }
.game-scope .mg-resumen .chips span { font-size:12.5px; font-weight:800; background:rgba(255,255,255,.13);
    padding:6px 12px; border-radius:99px; }
.game-scope .mg-resumen .datos { display:grid; gap:14px; margin-top:20px;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.game-scope .mg-resumen .datos .k, .game-scope .mg-resumen .nota .k { font-family:'JetBrains Mono',monospace;
    font-size:9.5px; font-weight:700; letter-spacing:1.7px; color:#7f93ae; }
.game-scope .mg-resumen .datos .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1.12rem;
    font-weight:700; letter-spacing:-.4px; margin-top:4px; line-height:1.2; }
.game-scope .mg-resumen .datos .s { font-size:12.5px; color:#b9c8dd; margin-top:2px; }
.game-scope .mg-resumen .pie { display:flex; align-items:flex-end; gap:16px; margin-top:22px;
    padding-top:16px; border-top:1px solid rgba(255,255,255,.12); }
.game-scope .mg-resumen .tiraBox { flex:1 1 auto; min-width:0; }
.game-scope .mg-resumen .tira { display:flex; gap:2px; }
.game-scope .mg-resumen .tira i { flex:1 1 0; min-width:0; height:12px; border-radius:2px; }
.game-scope .mg-resumen .tiraTxt { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700;
    letter-spacing:1.3px; color:#7f93ae; margin-top:6px; }
.game-scope .mg-resumen .nota { text-align:right; flex:0 0 auto; }
.game-scope .mg-resumen .nota .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:2.6rem;
    font-weight:700; line-height:1; letter-spacing:-1.5px; color:var(--mg-orange); }
@media (max-width:640px) {
    .game-scope .mg-resumen { padding:17px 15px 16px; }
    .game-scope .mg-resumen .big .pos { font-size:3.4rem; }
    .game-scope .mg-resumen .big .rec { font-size:1.5rem; }
    .game-scope .mg-resumen .datos { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
    .game-scope .mg-resumen .datos .v { font-size:.98rem; }
    .game-scope .mg-resumen .pie { flex-direction:column; align-items:stretch; gap:12px; }
    .game-scope .mg-resumen .nota { text-align:left; display:flex; align-items:baseline; gap:9px; }
}

/* Enlace a la clasificación completa (convención de la familia: cada board lleva a su pestaña). */
.game-scope .mg-vertodo { display:inline-block; margin-top:11px; color:var(--mg-navy2); text-decoration:none;
    font-weight:700; font-size:13px; }
.game-scope .mg-vertodo i { font-size:11px; margin-left:3px; }

/* Aviso bajo el botón de simular: la temporada simulada puntúa pero no da títulos. */
.game-scope .mg-nota-palm { margin-top:10px; font-size:12px; color:var(--mg-muted); text-align:center;
    line-height:1.45; }
.game-scope .mg-nota-palm b { color:var(--mg-navy); }
.game-scope .mg-sim-nota { color:var(--mg-muted); }

/* Compartir: va JUSTO debajo del resumen y sin tarjeta blanca de por medio, porque es la acción
   que se quiere hacer al acabar la temporada. Lo del servidor va después y en voz baja. */
.game-scope .mg-compartir { margin-top:-4px; }
.game-scope .mg-nota-srv { font-size:12px; color:var(--mg-muted); text-align:center; margin-top:12px; }
.game-scope .mg-nota-srv a { color:var(--mg-navy2); font-weight:700; }

/* botones de compartir en la pantalla final */
.game-scope .mg-share-btns { display:flex; gap:9px; justify-content:center; flex-wrap:wrap; margin-top:14px; }
.game-scope .mg-share-btns button { border:0; border-radius:10px; padding:11px 17px; font-size:13.5px; font-weight:800;
    cursor:pointer; background:#fff; color:#334155; border:1px solid var(--mg-border); box-shadow:var(--mg-shadow); }
.game-scope .mg-share-btns button.pri { background:var(--mg-navy); color:#fff; border-color:var(--mg-navy); }
.game-scope .mg-share-btns button:active { transform:translateY(1px); }
.game-scope .mg-prevista { margin:14px auto 0; max-width:440px; border-radius:10px; box-shadow:var(--mg-shadow2); display:block; }

/* ===== Aviso flotante ===== */
.mg-toast { position:fixed; left:50%; bottom:22px; transform:translateX(-50%); z-index:9999;
    background:#0f172a; color:#fff; font-family:Inter,system-ui,sans-serif; font-size:13.5px; font-weight:600;
    padding:12px 18px; border-radius:10px; box-shadow:0 8px 28px rgba(0,0,0,.3); max-width:92vw; }

/* ===== Cabecera de partida (siempre visible) ===== */
.game-scope .mg-topbar { display:flex; align-items:center; gap:11px; flex-wrap:wrap; background:linear-gradient(125deg,var(--mg-navy),var(--mg-deep));
    color:#fff; border-radius:12px; padding:11px 15px; margin-bottom:13px; box-shadow:var(--mg-shadow); }
.game-scope .mg-topbar .eq { display:flex; align-items:center; gap:9px; }
.game-scope .mg-topbar .eq img, .game-scope .mg-topbar .eq img.mg-esc { width:28px; height:28px; object-fit:contain; }
.game-scope .mg-topbar .eq b { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1rem; font-weight:700; }
.game-scope .mg-topbar .jr { font-size:11.5px; color:#b9c8dd; font-weight:700; }
.game-scope .mg-topbar .sp { flex:1 1 auto; }
.game-scope .mg-topbar .mk { display:flex; gap:11px; background:rgba(255,255,255,.1); padding:6px 12px; border-radius:9px; }
.game-scope .mg-topbar .mk .v { font-family:'Space Grotesk',system-ui,sans-serif; font-size:1rem; font-weight:700; line-height:1.1; }
.game-scope .mg-topbar .mk .k { font-size:9px; color:#b9c8dd; text-transform:uppercase; letter-spacing:.5px; font-weight:800; }

.game-scope .mg-ctrls { display:flex; gap:7px; align-items:center; justify-content:center; margin:13px 0; flex-wrap:wrap; }
.game-scope .mg-hide { display:none; }

/* ===== Responsive ===== */
@media (max-width:1240px) {
    .game-scope .mg-cols.narrada { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
    .game-scope .mg-cols.narrada .mg-feed { grid-column:1 / -1; }
}
@media (max-width:1040px) {
    .game-scope .mg-cols, .game-scope .mg-cols.narrada { grid-template-columns:minmax(0,1fr); }
    /* Apiladas, la clasificación quedaba detrás del acta entera (a ~1.100px de scroll). En móvil se
       convierten en pestañas y sólo se pinta la activa. */
    .game-scope .mg-tabs.solo-movil { display:flex; border-radius:12px 12px 0 0; overflow:hidden; }
    .game-scope .mg-tabbed [data-panel] { display:none; }
    .game-scope .mg-tabbed [data-panel].on { display:block; border-radius:0 0 12px 12px; }
    /* el h3 del acta NO se esconde: dentro va el total de puntos en vivo (#mgRA) */
    .game-scope .solo-movil { display:flex; }
    .game-scope .mg-grid.plegado { display:none; }
    .game-scope .mg-cols.narrada .mg-feed { grid-column:auto; }
    .game-scope .mg-cols .mg-feed { order:-1; }
    .game-scope .mg-feed .list { max-height:300px; }
    .game-scope .mg-cuadro { grid-template-columns:minmax(0,1fr); }
    .game-scope .mg-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
    .game-scope #mg-app { padding:12px 11px 22px; }
    .game-scope .mg-card { padding:14px; }
    .game-scope .mg-hero { padding:17px 15px; } .game-scope .mg-hero h1 { font-size:1.32rem; }
    .game-scope .mg-mins { grid-template-columns:1fr; }
    .game-scope .mg-pick { grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:7px; max-height:48vh; overflow-y:auto; }
    .game-scope .mg-team img { width:34px; height:34px; }
    .game-scope .mg-bt { padding:12px 9px; gap:7px; }
    .game-scope .mg-bt img { width:30px; height:30px; }
    .game-scope .mg-bt .cod { font-size:1rem; }
    .game-scope .mg-sc { font-size:2rem; min-width:46px; }
    .game-scope .mg-mid { min-width:66px; } .game-scope .mg-clock { font-size:1.2rem; }
    .game-scope .mg-per { font-size:8px; letter-spacing:.4px; }
    .game-scope .mg-parc { font-size:10px; }
    .game-scope .mg-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
    .game-scope .mg-mini { padding:7px 8px; }
    .game-scope .mg-mini .f img { width:16px; height:16px; }
    .game-scope .mg-mini .f .c { font-size:11px; }
    .game-scope .mg-stats { grid-template-columns:repeat(2,1fr); }
    .game-scope table.mg-t { font-size:11.5px; }
    .game-scope table.mg-t th.opt, .game-scope table.mg-t td.opt { display:none; }
    .game-scope .mg-cta-bar { margin:12px -14px -14px; padding-left:14px; padding-right:14px; }
    .game-scope .mg-topbar { padding:9px 12px; gap:8px; }
    /* Las cinco defensas no caben en una fila de 390px: los chips envuelven solos, sin recortar. */
    .game-scope .mg-chip { padding:7px 13px 7px 11px; font-size:12.5px; }
    .game-scope .mg-topbar .mk { gap:9px; padding:5px 9px; }
}
