/* SPORTIA · App y landing. Modo oscuro premium con acentos verde, azul y violeta. */
@font-face{font-family:"Inter";src:url("../fonts/inter-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
	--bg:#050814;--bg2:#080d1e;--card:#0c1328;--card2:#101a35;--card3:#16213f;
	--borde:rgba(148,163,209,.13);--borde2:rgba(148,163,209,.22);
	--txt:#eef2ff;--txt2:#aab4d0;--txt3:#717c99;
	--verde:#22e3a0;--verde2:#16c784;--azul:#3b82f6;--azul2:#38bdf8;--violeta:#8b5cf6;--violeta2:#a78bfa;
	--rojo:#ff4d6d;--ambar:#f5b942;--rosa:#ff4fa3;--naranja:#ff8a3d;--oro:#f5c451;
	--r:18px;--r2:13px;--sombra:0 14px 34px rgba(0,0,0,.38);
	--grad:linear-gradient(120deg,#22e3a0 0%,#3b82f6 52%,#8b5cf6 100%);
	--gradv:linear-gradient(135deg,#6d4dff 0%,#3b6dff 100%);
	--seguro-inf:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);overflow-wrap:anywhere;color:var(--txt);font:15px/1.5 "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}
body.app{background:radial-gradient(1000px 520px at 50% -180px,rgba(59,130,246,.20),transparent 70%),radial-gradient(700px 420px at 100% 30%,rgba(139,92,246,.10),transparent 70%),radial-gradient(600px 420px at 0% 70%,rgba(34,227,160,.06),transparent 70%),var(--bg);background-attachment:fixed}
a{color:var(--azul2);text-decoration:none}
a:hover{color:#7dd3fc}
img,svg{max-width:100%}
h1,h2,h3,h4{margin:0;line-height:1.2;letter-spacing:-.01em}
p{margin:0 0 .7em}
button{font:inherit}
.ic{width:20px;height:20px;flex:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--azul2);outline-offset:2px;border-radius:6px}
b,strong{font-weight:750}
.nota{color:var(--txt3);font-size:13px}
.centro{text-align:center}

/* ---------- Marco ---------- */
.banda-demo{display:flex;gap:8px;align-items:center;justify-content:center;padding:7px 14px;background:linear-gradient(90deg,#3d2b05,#4a3207);color:#ffd88a;font-size:12.5px;line-height:1.35;border-bottom:1px solid rgba(245,185,66,.35);text-align:center}
.banda-demo .ic{width:16px;height:16px;color:var(--ambar)}
.marco{max-width:560px;margin:0 auto;padding:0 14px calc(96px + var(--seguro-inf))}
.cab{display:flex;align-items:center;gap:12px;padding:16px 2px 12px;position:relative}
.logo{display:flex;align-items:center;gap:11px;color:var(--txt);min-width:0}
.logo:hover{color:var(--txt)}
.logo-corona{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:radial-gradient(circle at 30% 20%,rgba(245,196,81,.32),rgba(245,196,81,.06));flex:none}
.logo-corona .ic{width:26px;height:26px;color:var(--oro);fill:rgba(245,196,81,.28);filter:drop-shadow(0 2px 6px rgba(245,196,81,.35))}
.logo-txt{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;min-width:0}
.logo-txt b{font-size:23px;font-weight:900;letter-spacing:.02em}
.logo-pro{font-size:23px;font-weight:900;background:linear-gradient(90deg,#f5c451,#ffe39a);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo-txt small{flex-basis:100%;font-size:9.6px;letter-spacing:.035em;color:var(--txt2);font-weight:650;line-height:1.25}
.cab-acc{margin-left:auto;display:flex;align-items:center;gap:6px;position:relative;flex:none}
.ic-btn{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:transparent;border:0;color:var(--txt);cursor:pointer}
.ic-btn .ic{width:24px;height:24px}
.ic-btn:hover{background:rgba(255,255,255,.06)}
.badge{position:absolute;top:5px;right:5px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--rojo);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px var(--bg)}
.avatar{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:50%;background:linear-gradient(145deg,#3a5ad8,#6d4dff);color:#fff;font-weight:800;font-size:18px;box-shadow:0 0 0 2px rgba(167,139,250,.45),0 6px 18px rgba(109,77,255,.35)}
.avatar:hover{color:#fff}
.avatar .ic{width:24px;height:24px}
.avisos{position:absolute;right:0;top:54px;width:min(320px,86vw);background:var(--card2);border:1px solid var(--borde2);border-radius:var(--r2);padding:14px;box-shadow:var(--sombra);z-index:30}
.avisos ul{list-style:none;margin:8px 0 0;padding:0}
.avisos li a{display:block;padding:9px 0;border-top:1px solid var(--borde);color:var(--txt)}
.avisos li span{display:block;font-size:12.5px;color:var(--txt3)}
.nav-escritorio{display:none}

.deportes{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 14px;scrollbar-width:none;margin:0 -14px;padding-left:14px;padding-right:14px}
.deportes::-webkit-scrollbar{display:none}
.dep{position:relative;display:flex;align-items:center;gap:8px;flex:none;padding:11px 16px;border-radius:14px;background:var(--card);border:1px solid var(--borde);color:var(--txt);font-weight:600;font-size:14.5px}
.dep .ic{width:21px;height:21px}
.dep:hover{color:var(--txt);border-color:var(--borde2)}
.dep.on{background:var(--gradv);border-color:transparent;box-shadow:0 8px 22px rgba(91,77,255,.38),inset 0 1px 0 rgba(255,255,255,.18)}
.dep.pronto{color:var(--txt2)}
.dep em{position:absolute;top:-7px;right:6px;font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.04em;background:#2a3352;color:#c7d2fe;padding:1px 6px;border-radius:6px;text-transform:uppercase}

.contenido{display:block}
.pie{margin:30px 0 0;padding:18px 4px 0;border-top:1px solid var(--borde);font-size:12px;color:var(--txt3)}
.pie p{margin:0 0 8px}
.pie-enl{display:flex;flex-wrap:wrap;gap:6px 14px}
.pie-enl a{color:var(--txt2)}

.nav-inf{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;justify-content:space-around;max-width:560px;margin:0 auto;padding:8px 6px calc(8px + var(--seguro-inf));background:rgba(8,12,28,.86);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--borde)}
.nav-inf a{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;color:var(--txt3);font-size:11.5px;font-weight:600}
.nav-inf a .ic{width:24px;height:24px}
.nav-inf a.on{color:#c4b5fd}
.nav-inf a.on .ic{color:#a78bfa;filter:drop-shadow(0 0 8px rgba(139,92,246,.6))}
.nav-inf a.on::before{content:"";position:absolute;top:-9px;left:22%;right:22%;height:3px;border-radius:0 0 4px 4px;background:var(--gradv);box-shadow:0 0 12px rgba(139,92,246,.8)}

/* ---------- Botones y formularios ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:11px 18px;border-radius:13px;border:1px solid transparent;font-weight:750;font-size:15px;cursor:pointer;text-align:center;transition:transform .15s,box-shadow .2s,background .2s}
.btn .ic{width:18px;height:18px}
.btn:active{transform:scale(.98)}
.btn-pri{background:var(--grad);color:#04121f;box-shadow:0 10px 26px rgba(34,227,160,.22)}
.btn-pri:hover{color:#04121f;box-shadow:0 12px 30px rgba(59,130,246,.35)}
.btn-sec{background:var(--card2);color:var(--txt);border-color:var(--borde2)}
.btn-sec:hover{color:var(--txt);background:var(--card3)}
.btn-txt{background:none;border:0;color:var(--txt2);min-height:auto;padding:6px 0;text-decoration:underline;text-underline-offset:3px;font-weight:600}
.btn-peligro{background:rgba(255,77,109,.12);color:#ff8fa3;border-color:rgba(255,77,109,.4)}
.btn-grande{width:100%;min-height:54px;font-size:16px}
.btn-peq{min-height:36px;padding:6px 12px;font-size:13px;border-radius:10px}
.form{display:flex;flex-direction:column;gap:14px}
.form label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--txt2)}
.form label small{font-weight:500;color:var(--txt3)}
input[type=text],input[type=email],input[type=password],input[type=date],select{width:100%;min-height:48px;padding:11px 13px;border-radius:12px;border:1px solid var(--borde2);background:#0a1124;color:var(--txt);font:inherit;font-size:16px;color-scheme:dark}
input:focus,select:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px rgba(59,130,246,.25)}
input:disabled{opacity:.6}
.form .check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:500;color:var(--txt2);line-height:1.45}
.form .check input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--verde);flex:none}
.dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.tres{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1.2fr);gap:10px}
fieldset{border:1px solid var(--borde);border-radius:var(--r2);padding:12px 14px;margin:0;display:flex;flex-direction:column;gap:12px;min-width:0}
legend{padding:0 6px;font-weight:700;font-size:13.5px;color:var(--txt)}
legend small{color:var(--txt3);font-weight:500}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- Notas ---------- */
.nota-ok,.nota-err,.nota-info,.nota-demo{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r2);margin:0 0 14px;font-size:14px;line-height:1.45}
.nota-ok{background:rgba(34,227,160,.09);border:1px solid rgba(34,227,160,.35);color:#b6f7de}
.nota-err{background:rgba(255,77,109,.09);border:1px solid rgba(255,77,109,.38);color:#ffc2cd}
.nota-info{background:rgba(59,130,246,.09);border:1px solid rgba(59,130,246,.35);color:#cfe0ff;flex-wrap:wrap}
.nota-demo{background:rgba(245,185,66,.10);border:1px solid rgba(245,185,66,.4);color:#ffe0a3}
.nota-ok .ic{color:var(--verde)}.nota-err .ic{color:var(--rojo)}.nota-info .ic{color:var(--azul2)}.nota-demo .ic{color:var(--ambar)}

/* ---------- Tarjeta principal (estadio) ---------- */
.hero{position:relative;overflow:hidden;border-radius:22px;padding:16px 16px 18px;margin:0 0 14px;border:1px solid rgba(148,163,209,.18);box-shadow:var(--sombra),inset 0 1px 0 rgba(255,255,255,.06);
	background:
		radial-gradient(120% 55% at 50% 118%,rgba(34,227,160,.30),transparent 62%),
		linear-gradient(180deg,rgba(5,8,20,0) 0%,rgba(5,8,20,.45) 58%,rgba(5,8,20,.78) 100%),
		radial-gradient(34% 26% at 12% -4%,rgba(255,255,255,.38),transparent 72%),
		radial-gradient(34% 26% at 88% -4%,rgba(255,255,255,.38),transparent 72%),
		radial-gradient(60% 40% at 50% 0%,rgba(96,135,255,.35),transparent 75%),
		repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 2px,transparent 2px 7px),
		linear-gradient(180deg,#1a2a5c 0%,#0c1636 42%,#0a2a2a 78%,#0b3a2c 100%)}
.hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-62%;height:95%;border-radius:50%;border:2px solid rgba(255,255,255,.08);pointer-events:none}
.hero-luz{position:absolute;inset:0;background:radial-gradient(3px 3px at 12% 6%,#fff,transparent),radial-gradient(3px 3px at 16% 4%,#fff,transparent),radial-gradient(3px 3px at 84% 4%,#fff,transparent),radial-gradient(3px 3px at 88% 6%,#fff,transparent);opacity:.8;pointer-events:none}
.hero-top{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px;z-index:1}
.hero-liga{display:flex;align-items:center;gap:9px;min-width:0}
.hero-liga>div{min-width:0}
.hero-liga b{display:block;font-size:15.5px;font-weight:800;line-height:1.2}
.hero-liga span{display:block;font-size:12.5px;color:var(--txt2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill{display:inline-flex;align-items:center;gap:5px;flex:none;padding:5px 9px;border-radius:10px;font-size:10.5px;font-weight:800;letter-spacing:.03em;white-space:nowrap}
.pill .ic{width:14px;height:14px}
.pill-rojo{background:linear-gradient(180deg,rgba(255,77,109,.28),rgba(190,30,60,.22));border:1px solid rgba(255,77,109,.6);color:#ffd2da;box-shadow:0 0 18px rgba(255,77,109,.25)}
.pill-gris{background:rgba(148,163,209,.14);border:1px solid var(--borde2);color:var(--txt2)}
.pill-vivo{background:rgba(34,227,160,.14);border:1px solid rgba(34,227,160,.5);color:#b6f7de}
.pill-vivo i{width:8px;height:8px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 0 rgba(34,227,160,.7);animation:latido 1.6s infinite}
@keyframes latido{0%{box-shadow:0 0 0 0 rgba(34,227,160,.7)}70%{box-shadow:0 0 0 8px rgba(34,227,160,0)}100%{box-shadow:0 0 0 0 rgba(34,227,160,0)}}
.hero-mid{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;margin:14px 0 6px}
.hero-esc{display:grid;place-items:center}
.hero-esc .escudo{width:clamp(70px,22vw,96px);height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.55))}
.hero-centro{text-align:center;min-width:132px}
.hero-fecha{font-size:15px;color:#dbe3ff;font-weight:600}
.hero-hora{font-size:34px;font-weight:850;letter-spacing:.01em;line-height:1.15;font-variant-numeric:tabular-nums;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.hero-marcador{font-size:42px;font-weight:900;line-height:1.1;display:flex;gap:10px;justify-content:center;font-variant-numeric:tabular-nums}
.hero-marcador span{color:var(--txt3)}
.hero-marcador.vivo{color:#b6f7de}
.hero-nota{font-size:12px;color:var(--txt2)}
.cuenta{display:flex;gap:5px;justify-content:center;margin-top:8px}
.cuenta div{min-width:40px;padding:5px 4px 4px;border-radius:9px;background:rgba(5,8,20,.72);border:1px solid rgba(148,163,209,.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.cuenta b{display:block;font-size:19px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums}
.cuenta span{display:block;font-size:10px;color:var(--txt2)}
.hero-nombres{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin-top:8px}
.hero-nombres b{font-size:clamp(14px,4.1vw,18px);font-weight:850;letter-spacing:.01em;line-height:1.15;text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.vs{font-size:clamp(28px,8vw,38px);font-weight:900;font-style:italic;background:linear-gradient(180deg,#fff 10%,#9db8ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 12px rgba(96,135,255,.55));padding:0 4px}

/* ---------- Probabilidades ---------- */
.probs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 0 12px}
.prob{position:relative;min-width:0;padding:14px 8px 12px;border-radius:16px;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01)),var(--card);border:1.5px solid var(--borde2)}
.prob b{display:block;font-size:clamp(28px,8.6vw,36px);font-weight:850;letter-spacing:-.01em;line-height:1.05;font-variant-numeric:tabular-nums}
.prob small{display:block;margin-top:9px;font-size:13.5px;font-weight:650;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barra{display:block;height:7px;margin:11px 6px 0;border-radius:6px;background:rgba(148,163,209,.18);overflow:hidden}
.barra span{display:block;height:100%;width:0;border-radius:6px;transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.vis .barra span,.sin-anim .barra span{width:calc(var(--p) * 1%)}
.prob-l{border-color:rgba(34,227,160,.55);background:linear-gradient(180deg,rgba(34,227,160,.10),rgba(34,227,160,.02)),var(--card)}
.prob-l b{color:#3ef0b0}
.prob-l .barra span{background:linear-gradient(90deg,#16c784,#3ef0b0)}
.prob-x b{color:#dfe4f2}
.prob-x .barra span{background:linear-gradient(90deg,#8d9bbd,#c4cde3)}
.prob-v{border-color:rgba(255,77,109,.55);background:linear-gradient(180deg,rgba(255,77,109,.10),rgba(255,77,109,.02)),var(--card)}
.prob-v b{color:#ff5c7a}
.prob-v .barra span{background:linear-gradient(90deg,#ff2d55,#ff6b85)}
.prob.on{box-shadow:0 0 0 1px currentColor inset}
.prob-l.on{box-shadow:0 0 24px rgba(34,227,160,.28),inset 0 0 0 1px rgba(34,227,160,.4)}
.prob-v.on{box-shadow:0 0 24px rgba(255,77,109,.26),inset 0 0 0 1px rgba(255,77,109,.4)}
.prob-x.on{border-color:rgba(196,205,227,.6);box-shadow:0 0 22px rgba(196,205,227,.16)}

/* ---------- Pronóstico principal ---------- */
.principal{display:flex;align-items:center;gap:10px;padding:16px 12px;margin:0 0 12px;border-radius:18px;color:var(--txt);border:1.5px solid rgba(34,227,160,.65);background:radial-gradient(120% 140% at 0% 0%,rgba(34,227,160,.22),transparent 55%),linear-gradient(180deg,#0d2a24,#0b1a1f);box-shadow:0 0 30px rgba(34,227,160,.16),inset 0 1px 0 rgba(255,255,255,.06)}
.principal:hover{color:var(--txt);box-shadow:0 0 36px rgba(34,227,160,.26)}
.trofeo{display:grid;place-items:center;width:48px;height:52px;flex:none}
.trofeo .ic{width:44px;height:44px;color:#f5c451;fill:rgba(245,196,81,.35);stroke-width:1.6;filter:drop-shadow(0 4px 10px rgba(245,196,81,.45))}
.principal-txt{flex:1;min-width:0;text-align:center}
.principal-txt small{display:block;font-size:12px;font-weight:800;letter-spacing:.08em;color:#3ef0b0}
.principal-txt strong{display:block;font-size:clamp(19px,5.6vw,25px);font-weight:900;letter-spacing:.005em;line-height:1.15;margin:3px 0 4px}
.principal-txt em{display:flex;align-items:center;justify-content:center;gap:6px;font-style:normal;font-size:12.8px;color:var(--txt2);flex-wrap:wrap}
.principal-txt em b{color:#f5c451}
.conf-barras{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.conf-barras i{width:4px;border-radius:1px;background:rgba(148,163,209,.35)}
.conf-barras i:nth-child(1){height:6px}.conf-barras i:nth-child(2){height:10px}.conf-barras i:nth-child(3){height:14px}
.conf-baja .conf-barras i:nth-child(1),.conf-moderada .conf-barras i:nth-child(-n+2),.conf-alta .conf-barras i{background:#3ef0b0}
.conf-alta .principal-txt em b{color:#3ef0b0}
.conf-baja .principal-txt em b{color:#ffb4c1}
.chev .ic{width:26px;height:26px;color:#3ef0b0}

/* ---------- Mercados ---------- */
.mercados{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0 0 14px}
@media (min-width:360px){.mercados{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.mer{padding:10px 8px 11px}.mer small{font-size:11.5px}.mer-v b{font-size:19px}.mer-ic{width:21px;height:21px}.mer-marcador span{font-size:12.5px}}
@media (min-width:480px){.mer{padding:12px 11px}.mer small{font-size:12.5px}.mer-v b{font-size:22px}.mer-ic{width:26px;height:26px}}
.mer{padding:12px 11px 12px;border-radius:15px;background:var(--card);border:1px solid var(--borde2);min-width:0}
.mer small{display:block;font-size:12.5px;font-weight:650;color:var(--txt);line-height:1.25;min-height:2.5em}
.mer-v{display:flex;align-items:center;justify-content:space-between;gap:4px;margin:7px 0 0}
.mer-v b{font-size:22px;font-weight:850;font-variant-numeric:tabular-nums}
.mer-ic{width:26px;height:26px;opacity:.95}
.mer .barra{margin:9px 0 0;height:6px}
.mer-azul{border-color:rgba(56,189,248,.32)}.mer-azul .barra span{background:linear-gradient(90deg,#1d8fff,#38bdf8)}.mer-azul .mer-ic{color:#c9d6ee}
.mer-violeta{border-color:rgba(139,92,246,.4)}.mer-violeta .barra span{background:linear-gradient(90deg,#7c3aed,#a78bfa)}.mer-violeta .mer-ic{color:#a78bfa}
.mer-naranja{border-color:rgba(255,138,61,.32)}.mer-naranja .barra span{background:linear-gradient(90deg,#ff7a1a,#ffb05e)}.mer-naranja .mer-ic{color:#c9d6ee}
.mer-rosa{border-color:rgba(255,79,163,.35)}.mer-rosa .barra span{background:linear-gradient(90deg,#ff2d78,#ff6fb1)}.mer-rosa .mer-ic{color:#ff4fa3}
.mer-marcador{display:flex;flex-direction:column;line-height:1.1}
.mer-marcador span{font-size:14px;font-weight:750;color:var(--txt2)}

/* ---------- Pestañas y tarjetas ---------- */
.tabs{display:flex;gap:7px;overflow-x:auto;margin:0 -14px 12px;padding:2px 14px;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;padding:10px 16px;border-radius:12px;background:var(--card);border:1px solid var(--borde2);color:var(--txt);font-weight:650;font-size:14px;cursor:pointer}
.tab.on{background:var(--gradv);border-color:transparent;box-shadow:0 8px 20px rgba(91,77,255,.35)}
.panel{display:none}
.panel.on{display:block;animation:entra .35s ease both}
.card{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0)),var(--card);border:1px solid var(--borde2);border-radius:var(--r);padding:16px;margin:0 0 14px;min-width:0}
.card h2,.card h3{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:800;margin:0 0 10px}
.card h2 .ic,.card h3 .ic{color:var(--verde);width:22px;height:22px}
.ia h3 .ic{width:26px;height:26px}
.ia p{color:#dfe5f7;font-size:15px;line-height:1.6}
.ia .nota{margin-top:10px}
.vacio{display:flex;gap:10px;align-items:flex-start;color:var(--txt2);margin:0}
.vacio .ic{color:var(--azul2);margin-top:2px}
.vacio-grande{text-align:center;padding:30px 20px}
.vacio-grande>.ic,.vacio-grande .pro-ic .ic{width:44px;height:44px;color:var(--violeta2);margin-bottom:10px}
.vacio-grande h1,.vacio-grande h2{font-size:20px;margin:0 0 8px}
.vacio-grande p{color:var(--txt2)}
.aviso{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:15px;margin:0 0 14px;border:1.5px solid rgba(245,185,66,.55);background:linear-gradient(90deg,rgba(245,185,66,.14),rgba(245,185,66,.05));color:#ffd98f}
.aviso .ic{width:30px;height:30px;color:var(--ambar);flex:none}
.aviso p{margin:0;font-size:14px;line-height:1.45}
.abstencion h3 .ic{color:var(--azul2)}

/* Estadísticas */
.est-cab{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 10px;font-weight:750;font-size:14px}
.est-cab span{display:flex;align-items:center;gap:7px}
.cmp{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--borde)}
.cmp-v{font-weight:800;font-size:15.5px;text-align:center;color:var(--txt2);font-variant-numeric:tabular-nums}
.cmp-v.gana{color:#3ef0b0}
.cmp-c small{display:block;text-align:center;font-size:12.5px;color:var(--txt2);margin-bottom:5px}
.cmp-b{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.cmp-b i{height:6px;border-radius:4px;background:rgba(148,163,209,.16);position:relative;overflow:hidden}
.cmp-b i::after{content:"";position:absolute;top:0;bottom:0;width:var(--w);border-radius:4px}
.cmp-b .izq::after{right:0;background:linear-gradient(270deg,#3ef0b0,#16c784)}
.cmp-b .der::after{left:0;background:linear-gradient(90deg,#ff6b85,#ff2d55)}
.cmp-forma{grid-template-columns:auto 1fr auto}
.forma{display:inline-flex;gap:3px}
.forma i,.ultimos i{display:grid;place-items:center;width:21px;height:21px;border-radius:6px;font-style:normal;font-size:11px;font-weight:800}
.f-g{background:rgba(34,227,160,.2);color:#3ef0b0}.f-e{background:rgba(148,163,209,.2);color:#cfd6ea}.f-p{background:rgba(255,77,109,.2);color:#ff8fa3}

/* Alineaciones */
.ali-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ali h4,.card h4{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:800;margin:0 0 8px}
.ali ol,.bajas,.ultimos,.lista-h2h{list-style:none;margin:0;padding:0}
.ali ol li,.bajas li{display:flex;align-items:center;gap:7px;padding:5px 0;font-size:13.5px;border-bottom:1px solid var(--borde)}
.pos{display:inline-grid;place-items:center;min-width:34px;height:20px;border-radius:5px;font-size:10px;font-weight:800;background:rgba(148,163,209,.16);color:var(--txt2)}
.pos-24{background:rgba(245,196,81,.18);color:#f5c451}.pos-25{background:rgba(56,189,248,.16);color:#7dd3fc}.pos-26{background:rgba(139,92,246,.18);color:#c4b5fd}.pos-27{background:rgba(255,77,109,.16);color:#ff8fa3}
.bajas em{font-style:normal;color:var(--txt3);font-size:12px}
.hab{font-size:10.5px;color:#ffd98f;background:rgba(245,185,66,.14);padding:1px 6px;border-radius:5px}
.bajas-t{margin-top:16px!important}
.lista-h2h li{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--borde);font-size:14px}
.lista-h2h .f{color:var(--txt3);flex:none;width:84px}
.ultimos li{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--borde);font-size:13.5px}
.ultimos li>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--txt2)}

/* Versiones y resultado */
.versiones summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:750;list-style:none}
.versiones summary::-webkit-details-marker{display:none}
.versiones summary .ic{color:var(--violeta2)}
.versiones ol{list-style:none;margin:10px 0;padding:0}
.versiones li{padding:10px 0;border-top:1px solid var(--borde);font-size:13.5px}
.versiones li.oficial{background:linear-gradient(90deg,rgba(34,227,160,.08),transparent);margin:0 -16px;padding:10px 16px}
.versiones .v-num{color:var(--txt2);margin:3px 0}
.versiones code,.hash{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;color:#93a3c9;word-break:break-all}
.tag{display:inline-block;font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:6px;background:rgba(34,227,160,.16);color:#3ef0b0;vertical-align:1px}
.tag.gris{background:rgba(148,163,209,.16);color:var(--txt2)}
.enlace{font-size:13px;font-weight:600}
.res-chips{display:flex;flex-wrap:wrap;gap:7px}
.res{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:10px;font-size:13px;font-weight:650}
.res .ic{width:15px;height:15px}
.res.ok{background:rgba(34,227,160,.13);color:#9ff5d3;border:1px solid rgba(34,227,160,.35)}
.res.ko{background:rgba(255,77,109,.10);color:#ffadbb;border:1px solid rgba(255,77,109,.3)}

/* Bloqueo premium */
.bloqueo{position:relative;margin:0 0 14px;border-radius:18px;overflow:hidden;border:1px solid rgba(167,139,250,.35);background:var(--card)}
.fantasma{position:absolute;left:12px;right:12px;top:14px;filter:blur(6px);opacity:.45;pointer-events:none;user-select:none;margin:0}
.bloqueo-capa{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:22px 16px 20px;background:linear-gradient(180deg,rgba(5,8,20,.35),rgba(5,8,20,.82) 55%)}
.bloqueo-capa p{margin:0;font-size:13px;color:var(--txt2)}
.bloqueo-capa .btn{min-height:42px;margin-top:4px}
.bloqueo-ic .ic{width:26px;height:26px;color:#c4b5fd}

/* Llamada a la suscripción */
.cta-premium{display:flex;align-items:center;gap:12px;padding:14px 15px;margin:0 0 14px;border-radius:18px;color:var(--txt);background:radial-gradient(120% 160% at 100% 0%,rgba(139,92,246,.32),transparent 55%),linear-gradient(135deg,#17153a,#0e1631);border:1px solid rgba(167,139,250,.45);box-shadow:0 10px 28px rgba(91,77,255,.2)}
.cta-premium:hover{color:var(--txt)}
.cta-premium>.ic{margin-left:auto;color:#c4b5fd}
.cta-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(245,196,81,.14);flex:none}
.cta-ic .ic{color:var(--oro);width:26px;height:26px;fill:rgba(245,196,81,.25)}
.cta-premium b{display:block;font-size:15.5px}
.cta-premium small{display:block;font-size:12.5px;color:var(--txt2)}
.cta-premium.compacta{padding:11px 13px}

/* ---------- Listas de partidos ---------- */
.titulo-pag{font-size:26px;font-weight:900;margin:2px 0 10px}
.sub-pag{color:var(--txt2);font-size:14px;margin:-4px 0 14px}
.chips{display:flex;gap:7px;overflow-x:auto;margin:0 -14px 12px;padding:2px 14px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;flex:none;min-height:40px;padding:7px 13px;border-radius:12px;background:var(--card);border:1px solid var(--borde2);color:var(--txt);font-size:13.5px;font-weight:650;cursor:pointer}
.chip:hover{color:var(--txt);border-color:rgba(148,163,209,.4)}
.chip.on{background:var(--gradv);border-color:transparent;color:#fff;box-shadow:0 6px 16px rgba(91,77,255,.3)}
.chip small{font-size:11px;color:var(--txt3);font-weight:600}
.chip.on small{color:#dfe2ff}
.chip.pasado b{color:var(--txt2)}
.chip-liga{flex-direction:row;gap:7px}
.chip-check{flex-direction:row;gap:7px}
.chip-check input{accent-color:var(--violeta)}
.chips.mini{margin:0;padding:0}
.chips.mini .chip{min-height:32px;padding:4px 10px;font-size:12.5px}
.bloque{margin:0 0 18px}
.bloque-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.bloque-cab h2{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:850}
.bloque-cab a,.bloque-cab span{font-size:13px;font-weight:600;color:var(--txt3)}
.bloque-cab a{color:var(--azul2)}
.filas{display:flex;flex-direction:column;gap:8px}
.fila{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:10px;padding:11px 12px;border-radius:15px;background:var(--card);border:1px solid var(--borde);color:var(--txt);transition:border-color .2s,transform .2s}
.fila:hover{color:var(--txt);border-color:rgba(139,92,246,.5);transform:translateY(-1px)}
.fila-hora{text-align:center;line-height:1.15}
.fila-hora b{display:block;font-size:14.5px;font-weight:800;font-variant-numeric:tabular-nums}
.fila-hora small{display:block;font-size:11px;color:var(--txt3)}
.fila-hora .vivo{color:var(--verde)}
.fila-hora .gris{color:var(--txt3);font-size:12px}
.fila-eqs{display:flex;flex-direction:column;gap:5px;min-width:0}
.fila-eq{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;font-weight:600}
.fila-eq .nom{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fila-eq b{font-variant-numeric:tabular-nums}
.fila-eq .escudo{flex:none}
.fila-pr{display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:88px}
.minibar{display:flex;width:88px;height:7px;border-radius:5px;overflow:hidden;gap:2px}
.minibar i{display:block;height:100%}
.minibar .a{background:#3ef0b0}.minibar .b{background:#8d9bbd}.minibar .c{background:#ff5c7a}
.fila-pick{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:800;color:var(--txt);padding:2px 8px;border-radius:7px;background:rgba(148,163,209,.12)}
.fila-pick.conf-alta{background:rgba(34,227,160,.16);color:#3ef0b0}
.fila-pick.conf-moderada{background:rgba(245,196,81,.14);color:#f5d27a}
.fila-pick em .ic{width:14px;height:14px}
.fila-pick em.ok{color:var(--verde)}.fila-pick em.ko{color:var(--rojo)}
.fila-lock{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:#c4b5fd}
.fila-lock .ic{width:15px;height:15px}
.fila-nota{font-size:12px;color:var(--txt3)}
.volver{display:inline-flex;align-items:center;gap:4px;margin:0 0 10px;color:var(--txt2);font-weight:600;font-size:14px}
.volver .ic{width:18px;height:18px}
.resumen-hist{display:flex;align-items:center;gap:12px;color:var(--txt)}
.resumen-hist:hover{color:var(--txt);border-color:rgba(34,227,160,.45)}
.resumen-hist b{display:block}
.resumen-hist small{display:block;color:var(--txt2);font-size:13px;line-height:1.4}
.resumen-hist>.ic{margin-left:auto;color:var(--txt3)}
.rh-ic{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(34,227,160,.12);flex:none}
.rh-ic .ic{color:var(--verde)}

/* Ranking de pronósticos */
.ranking{display:flex;flex-direction:column;gap:9px}
.rank{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:10px;padding:12px;border-radius:16px;background:var(--card);border:1px solid var(--borde);color:var(--txt)}
.rank:hover{color:var(--txt);border-color:rgba(139,92,246,.5)}
.rank-n{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--card3);font-weight:850;font-size:14px;color:#c4b5fd}
.rank-n .ic{width:16px;height:16px}
.rank-eq{min-width:0}
.rank-esc{display:flex;gap:2px;margin-bottom:3px}
.rank-eq b{display:block;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-eq small{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--txt3)}
.rank-sel{text-align:right}
.rank-sel em{display:block;font-style:normal;font-size:12px;color:var(--txt2);max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-sel b{display:block;font-size:24px;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.rank-sel small{font-size:11px;color:var(--txt3)}
.rank-sel small.conf-alta{color:#3ef0b0}
.rank-sel.bloq b{background:none;color:var(--txt3)}

/* Historial */
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:0 0 14px}
@media (min-width:520px){.kpis{grid-template-columns:repeat(3,1fr)}}
.kpi{padding:13px 14px;border-radius:15px;background:var(--card);border:1px solid var(--borde2)}
.kpi small{display:block;font-size:12.5px;color:var(--txt2);font-weight:600}
.kpi b{display:block;font-size:26px;font-weight:900;margin-top:2px;font-variant-numeric:tabular-nums}
.kpi em{font-style:normal;font-size:12px;color:var(--txt3)}
.kpi-verde b{color:#3ef0b0}.kpi-azul b{color:#7dd3fc}.kpi-violeta b{color:#c4b5fd}.kpi-naranja b{color:#ffb05e}.kpi-rosa b{color:#ff8ac4}
.calib{width:100%;height:auto;display:block;margin:6px 0}
.leyenda i{display:inline-block;vertical-align:middle;margin:0 4px 0 2px}
.lg-barra{width:12px;height:10px;border-radius:2px;background:linear-gradient(#22e3a0,#3b82f6)}
.lg-punto{width:8px;height:8px;border-radius:50%;background:#f5c451}
.lg-diag{width:14px;border-top:2px dashed #56627d}
.tabla{width:100%;border-collapse:collapse;font-size:14px}
.tabla th{text-align:left;font-size:12px;color:var(--txt3);font-weight:650;padding:6px 6px;border-bottom:1px solid var(--borde2)}
.tabla td{padding:8px 6px;border-bottom:1px solid var(--borde)}
.tabla td:first-child{display:flex;align-items:center;gap:6px}
.paginas{display:flex;align-items:center;justify-content:center;gap:12px;margin:14px 0;color:var(--txt2);font-size:13px}

/* ---------- Cuenta, suscripción y acceso ---------- */
.auth{max-width:440px;margin:6px auto 0}
.auth-logo{display:flex;align-items:center;gap:10px;justify-content:center;margin:0 0 18px}
.auth-logo b{font-size:24px;font-weight:900}
.auth h1{font-size:26px;font-weight:900;text-align:center;margin:0 0 6px}
.auth .sub{text-align:center;color:var(--txt2);margin:0 0 18px}
.auth .form{background:var(--card);border:1px solid var(--borde2);border-radius:var(--r);padding:18px}
.auth-alt{text-align:center;font-size:14px;color:var(--txt2);margin:14px 0 0}
.suscribirse{max-width:520px;margin:0 auto}
.plan{position:relative;padding:22px 20px;border-radius:22px;background:radial-gradient(120% 90% at 100% 0%,rgba(139,92,246,.25),transparent 55%),radial-gradient(120% 90% at 0% 100%,rgba(34,227,160,.14),transparent 55%),var(--card);border:1px solid rgba(167,139,250,.4);box-shadow:var(--sombra)}
.plan-cab{display:flex;align-items:center;gap:12px}
.plan-cab small{font-size:11.5px;font-weight:800;letter-spacing:.1em;color:var(--txt2)}
.plan-cab h1{font-size:24px;font-weight:900}
.plan-precio{margin:16px 0 4px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.plan-precio b{font-size:46px;font-weight:900;letter-spacing:-.02em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.plan-precio span{color:var(--txt2);font-weight:600}
.plan-prueba{color:#b6f7de;font-weight:600}
.plan-lista{list-style:none;margin:16px 0 20px;padding:0;display:flex;flex-direction:column;gap:9px}
.plan-lista li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:#dfe5f7}
.plan-lista .ic{color:var(--verde);width:19px;height:19px;margin-top:1px}
.plan .form{gap:12px}
.aviso-legal{font-size:12.5px;color:var(--txt3);margin:16px 4px}
.pago-demo h1{font-size:22px;margin:10px 0 0}
.pago-demo .form{margin-top:16px}
.cuenta-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.sus-estado{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:13px;background:var(--card2);border:1px solid var(--borde2);margin:0 0 10px}
.sus-estado span{font-size:13px;font-weight:700;padding:3px 9px;border-radius:8px;background:rgba(148,163,209,.15);color:var(--txt2)}
.est-active span,.est-trialing span{background:rgba(34,227,160,.15);color:#3ef0b0}
.est-past_due span{background:rgba(255,77,109,.15);color:#ff8fa3}
.datos{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 12px;font-size:14px}
.datos dt{color:var(--txt3)}
.datos dd{margin:0;font-weight:650;min-width:0}
.datos dd small{display:block;color:var(--txt3);font-weight:500}
.botones{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.botones form{margin:0}
details.baja{margin-top:10px}
details.baja summary{list-style:none;cursor:pointer;display:inline-flex}
details.baja summary::-webkit-details-marker{display:none}
details.baja .form{margin-top:10px;padding:14px;border:1px solid rgba(255,77,109,.3);border-radius:13px;background:rgba(255,77,109,.04)}
.facturas{list-style:none;margin:0;padding:0}
.facturas li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--borde)}
.facturas li>span{flex:1;min-width:0}
.facturas li small{display:block;color:var(--txt3);font-size:12px}
.imp{font-variant-numeric:tabular-nums}
.imp.neg{color:#ff8fa3}
.texto .card h2{font-size:18px}
.texto .card p,.texto .card li{color:#d6ddf0}
.texto ol{padding-left:20px}
.ok{color:var(--verde)}.ko{color:var(--rojo)}
.proximamente .pro-ic{display:inline-grid;place-items:center;width:76px;height:76px;border-radius:22px;background:var(--card2);border:1px solid var(--borde2);margin-bottom:12px}

/* ---------- Avisos flotantes y cookies ---------- */
.toast{position:fixed;left:50%;bottom:calc(92px + var(--seguro-inf));transform:translateX(-50%);z-index:60;padding:11px 16px;border-radius:12px;background:#1b2547;border:1px solid var(--borde2);color:var(--txt);font-size:14px;box-shadow:var(--sombra);max-width:90vw}
.cookies{position:fixed;left:12px;right:12px;bottom:calc(84px + var(--seguro-inf));z-index:70;max-width:540px;margin:0 auto;padding:16px;border-radius:18px;background:rgba(13,20,42,.97);border:1px solid var(--borde2);box-shadow:0 20px 50px rgba(0,0,0,.55);font-size:13.5px;color:var(--txt2)}
.cookies p{margin:0 0 10px}
.cookies-op{display:flex;flex-wrap:wrap;gap:10px 16px;margin:0 0 12px}
.cookies-op label{display:flex;align-items:center;gap:6px;color:var(--txt)}
.cookies-btn{display:flex;gap:8px;flex-wrap:wrap}
.cookies-btn .btn{flex:1;min-height:42px;font-size:14px;padding:8px 12px}

/* Páginas legales dentro de la app */
.legal-pag h1{font-size:26px;margin:0 0 14px}
.spt-legal h2{font-size:17px;margin:20px 0 8px}
.spt-legal p,.spt-legal li{color:#d6ddf0;font-size:14.5px}
.spt-legal table{width:100%;border-collapse:collapse;font-size:13px;margin:10px 0}
.spt-legal th,.spt-legal td{border-bottom:1px solid var(--borde);padding:8px 6px;text-align:left;vertical-align:top}
.spt-legal-aviso{padding:10px 14px;border-radius:12px;background:rgba(245,185,66,.12);border:1px solid rgba(245,185,66,.4);color:#ffe0a3;margin:0 0 14px;font-size:13px}

/* ---------- Animaciones ---------- */
@keyframes entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.anim{animation:entra .5s cubic-bezier(.2,.8,.2,1) both}
.contenido>.anim:nth-child(2),.inicio-principal>.anim:nth-child(2){animation-delay:.05s}
.contenido>.anim:nth-child(3),.inicio-principal>.anim:nth-child(3){animation-delay:.1s}
.contenido>.anim:nth-child(4),.inicio-principal>.anim:nth-child(4){animation-delay:.15s}
.inicio-principal>.anim:nth-child(5){animation-delay:.2s}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.barra span{width:calc(var(--p) * 1%)!important}}

/* ---------- Escritorio ---------- */
@media (min-width:900px){
	.marco{max-width:1120px;padding:0 28px 40px}
	.cab{padding:20px 0 16px}
	.nav-escritorio{display:flex;gap:4px;margin-left:28px}
	.nav-escritorio a{padding:9px 14px;border-radius:11px;color:var(--txt2);font-weight:650;font-size:14.5px}
	.nav-escritorio a:hover{color:var(--txt);background:rgba(255,255,255,.05)}
	.nav-escritorio a.on{color:#fff;background:rgba(139,92,246,.18);box-shadow:inset 0 0 0 1px rgba(167,139,250,.35)}
	.nav-inf{display:none}
	.deportes,.tabs,.chips{margin-left:0;margin-right:0;padding-left:0;padding-right:0}
	.inicio-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:22px;align-items:start}
	.inicio-grid>*{min-width:0}
	.inicio-lateral{position:sticky;top:16px}
	.detalle{max-width:760px;margin:0 auto}
	.hero{padding:22px 24px 24px}
	.hist-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
	.cuenta-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px;align-items:start}
	.kpis{grid-template-columns:repeat(6,1fr)}
	.ranking{display:grid;grid-template-columns:1fr 1fr}
	.toast{bottom:28px}
	.cookies{bottom:20px}
	.texto{max-width:820px;margin:0 auto}
	.filas{display:grid;grid-template-columns:1fr}
	.sec-partidos .filas,.sec-historial .filas{grid-template-columns:1fr 1fr}
}
@media (max-width:370px){
	.logo-txt b,.logo-pro{font-size:20px}
	.prob b{font-size:26px}
	.cuenta div{min-width:34px}
	.fila{grid-template-columns:40px 1fr auto}
	.fila-pr{min-width:72px}.minibar{width:72px}
	.dos,.tres{grid-template-columns:1fr}
}

/* Escudo ligero (listas) */
.esc-mini{position:relative;display:inline-grid;place-items:center;flex:none;width:var(--t);height:var(--t);clip-path:polygon(50% 0,92% 14%,92% 50%,74% 82%,50% 100%,26% 82%,8% 50%,8% 14%);background:var(--c1)}
.esc-mini.p0{background:linear-gradient(90deg,var(--c1) 50%,var(--c2) 50%)}
.esc-mini.p1{background:linear-gradient(180deg,var(--c1) 38%,var(--c2) 38% 60%,var(--c1) 60%)}
.esc-mini.p2{background:repeating-linear-gradient(90deg,var(--c1) 0 22%,var(--c2) 22% 36%)}
.esc-mini.p3{background:linear-gradient(135deg,var(--c1) 50%,var(--c2) 50%)}
.esc-mini b{position:relative;font-size:calc(var(--t) * .3);font-weight:850;line-height:1;color:#fff;background:rgba(11,17,36,.72);padding:1px 2px;border-radius:2px;letter-spacing:0}
.liga-mini{display:inline-grid;place-items:center;flex:none;width:var(--t);height:var(--t);border-radius:50%;background:linear-gradient(135deg,var(--c1),var(--c2));padding:2px}
.liga-mini b{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#0b1124;color:#fff;font-size:calc(var(--t) * .34);font-weight:850;letter-spacing:-.02em}

/* ---------- Landing ---------- */
.lp{padding-bottom:0}
.lp-ancho{max-width:1120px;margin:0 auto;padding:0 18px}
.lp-cab{position:sticky;top:0;z-index:50;background:rgba(5,8,20,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--borde)}
.lp-cab-in{display:flex;align-items:center;gap:12px;min-height:66px}
.lp-hamb{margin-left:auto}
.lp-menu{display:none;position:absolute;left:0;right:0;top:66px;flex-direction:column;gap:2px;padding:10px 18px 16px;background:#070b19;border-bottom:1px solid var(--borde2)}
.lp-menu.abierto{display:flex}
.lp-menu a{padding:11px 4px;color:var(--txt);font-weight:600}
.lp-menu .btn{margin-top:6px;color:#04121f}
.lp-kicker{font-size:12px;font-weight:800;letter-spacing:.12em;color:#3ef0b0;margin:0 0 10px}
.lp-hero{padding:34px 0 26px;background:radial-gradient(800px 420px at 80% 10%,rgba(139,92,246,.18),transparent 70%),radial-gradient(700px 420px at 10% 30%,rgba(34,227,160,.10),transparent 70%)}
.lp-hero-in{display:grid;gap:30px}
.lp-hero h1{font-size:clamp(31px,8.4vw,56px);font-weight:900;letter-spacing:-.025em;line-height:1.06;margin:0 0 16px}
.lp-grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-lead{font-size:17px;color:var(--txt2);line-height:1.6;margin:0 0 20px}
.lp-ctas{display:flex;flex-direction:column;gap:10px;margin:0 0 18px}
.lp-confianza{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;font-size:13.5px;color:var(--txt2)}
.lp-confianza li{display:flex;align-items:center;gap:6px}
.lp-confianza .ic{width:17px;height:17px;color:var(--verde)}
.lp-telefono{display:flex;justify-content:center}
.lp-tel-marco{width:min(380px,100%);padding:12px;border-radius:44px;background:linear-gradient(160deg,#2a3352,#0b1124 40%,#1c2340);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 0 1px rgba(148,163,209,.25),inset 0 0 0 2px rgba(255,255,255,.04)}
.lp-tel-pantalla{border-radius:34px;padding:14px 12px 10px;background:var(--bg);overflow:hidden;max-height:760px}
.lp-tel-pantalla .hero{margin-bottom:10px}
.lp-tel-pantalla .mercados{grid-template-columns:repeat(2,minmax(0,1fr))}
.lp-tel-nota{font-size:12px;color:var(--txt3);text-align:center;margin:6px 0 2px}
.lp-cifras{padding:6px 0 24px}
.lp-cifras-in{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.lp-cifras-in>div{padding:16px;border-radius:16px;background:var(--card);border:1px solid var(--borde2)}
.lp-cifras b{display:block;font-size:30px;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-cifras span{display:block;font-size:13px;color:var(--txt2);line-height:1.35}
.lp-sec{padding:46px 0}
.lp-sec h2{font-size:clamp(26px,6.5vw,40px);font-weight:900;letter-spacing:-.02em;margin:0 0 22px}
.lp-alt{background:linear-gradient(180deg,rgba(255,255,255,.015),rgba(255,255,255,.035));border-top:1px solid var(--borde);border-bottom:1px solid var(--borde)}
.lp-pasos{display:grid;gap:12px}
.lp-pasos .card{position:relative;margin:0;padding:20px}
.lp-pasos h3{font-size:18px;padding-right:34px}
.lp-pasos p{color:var(--txt2);margin:0}
.lp-num{position:absolute;top:14px;right:16px;font-size:44px;font-weight:900;color:rgba(148,163,209,.12);line-height:1}
.lp-dos{display:grid;gap:28px;align-items:start}
.lp-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.lp-lista li{display:flex;gap:11px;font-size:15.5px;color:#d6ddf0}
.lp-lista .ic{color:var(--verde);margin-top:2px}
.lp-ligas{display:grid;gap:10px;margin:0 0 12px}
.lp-liga{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:15px;background:var(--card);border:1px solid var(--borde2)}
.lp-liga b{display:block}
.lp-liga small{color:var(--txt3)}
.lp-hash code{display:block;padding:12px;border-radius:10px;background:#0a1124;border:1px solid var(--borde);margin:10px 0}
.lp-plan{max-width:480px;margin:0 auto}
.lp-plan h3{font-size:24px;font-weight:900}
.lp-faq{max-width:780px}
.lp-faq details{margin:0 0 10px;padding:0}
.lp-faq summary{cursor:pointer;padding:16px 18px;font-weight:700;font-size:15.5px;list-style:none;display:flex;justify-content:space-between;gap:10px}
.lp-faq summary::after{content:"+";font-size:22px;line-height:1;color:var(--violeta2)}
.lp-faq details[open] summary::after{content:"−"}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq details p{padding:0 18px 16px;color:var(--txt2);margin:0}
.lp-riesgo{padding-top:10px}
.lp-pie{border-top:1px solid var(--borde);padding:28px 0 40px;font-size:13px;color:var(--txt3)}
.lp-pie-in{display:flex;flex-direction:column;gap:14px;margin:0 0 14px}
.lp .cookies{bottom:16px}
@media (min-width:700px){
	.lp-ctas{flex-direction:row}
	.lp-ctas .btn-grande{width:auto;padding:12px 24px}
	.lp-cifras-in{grid-template-columns:repeat(4,1fr)}
	.lp-pasos{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:980px){
	.lp-hamb{display:none}
	.lp-menu{display:flex;position:static;flex-direction:row;align-items:center;gap:4px;padding:0;background:none;border:0;margin-left:auto}
	.lp-menu a{padding:9px 12px;font-size:14.5px;color:var(--txt2)}
	.lp-menu a:hover{color:var(--txt)}
	.lp-menu .btn{margin:0 0 0 8px;min-height:42px;color:#04121f}
	.lp-hero{padding:64px 0 46px}
	.lp-hero-in{grid-template-columns:1.1fr .9fr;align-items:center;gap:48px}
	.lp-pasos{grid-template-columns:repeat(4,1fr)}
	.lp-dos{grid-template-columns:1fr 1fr;gap:56px}
	.lp-sec{padding:72px 0}
	.lp-pie-in{flex-direction:row;align-items:center;justify-content:space-between}
}

/* ---------- Pantallas estrechas: ninguna palabra partida a la mitad ---------- */
.nav-inf a{min-width:0}
.nav-inf a span{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:389px){.nav-inf{padding-left:2px;padding-right:2px}.nav-inf a{padding-left:0;padding-right:0;font-size:10.5px}}
@media (max-width:339px){.nav-inf a{font-size:10px;letter-spacing:-.02em}}
.fila-hora b{white-space:nowrap}
@media (max-width:370px){.fila{grid-template-columns:44px minmax(0,1fr) auto;gap:8px}.fila-hora b{font-size:13.5px}}
.hero-liga b{overflow-wrap:normal}
@media (max-width:339px){.hero-liga b{font-size:14px}}
.form .check{display:block;position:relative;padding-left:30px}
.form .check input{position:absolute;left:0;top:1px;margin:0}
.mer small{overflow-wrap:normal}
.mer-v{flex-wrap:nowrap}
.mer-v b,.mer-marcador{white-space:nowrap}
.mer-v b{flex:0 0 auto}
.mer-ic{flex:0 1 auto;min-width:0}
@media (max-width:479px){.datos{grid-template-columns:minmax(0,1fr);gap:2px 0}.datos dd{margin:0 0 8px}}
code.formula{word-break:normal;overflow-wrap:anywhere}
.btn,.chip,.tab{overflow-wrap:normal}
.facturas b{white-space:nowrap}
@media (min-width:360px) and (max-width:419px){.mer-ic{display:none}}
@media (min-width:360px) and (max-width:389px){.mer small{min-height:3.75em}}
.form fieldset .chips{flex-wrap:wrap;overflow:visible;margin:0;padding:0}
.form .chip-check{flex-direction:row;align-items:center}
.lp-cifras b.txt{white-space:nowrap;font-size:24px;line-height:1.5}
.lp-cifras-in{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:700px){.lp-cifras-in{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- Escudos oficiales y logos de competiciones (imágenes descargadas) ---------- */
img.escudo-img{display:block;flex:none;aspect-ratio:1/1;height:auto;object-fit:contain;filter:drop-shadow(0 0 1px rgba(255,255,255,.4)) drop-shadow(0 1px 2px rgba(0,0,0,.35))}
.hero-esc img.escudo-img{width:clamp(70px,22vw,96px);filter:drop-shadow(0 0 1.5px rgba(255,255,255,.45)) drop-shadow(0 10px 18px rgba(0,0,0,.55))}
img.liga-img{display:inline-block;flex:none;vertical-align:middle;aspect-ratio:1/1;height:auto;object-fit:contain;border-radius:50%;background:#fff;padding:2px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
/* Nombres largos (p. ej. «Mönchengladbach»): el tamaño se ajusta al hueco para no partir palabras. */
.hero{container-type:inline-size}
.hero-nombres b,.principal-txt strong{text-transform:uppercase}
.hero-nombres b.largo,.principal-txt strong.largo{text-transform:none;letter-spacing:0}
@supports (width:1cqi){
	.hero-nombres b{font-size:max(10px,min(clamp(14px,4.1vw,18px),calc((50cqi - 42px) / (var(--nl,8) * .8))))}
	.hero-nombres b.largo{font-size:max(9px,min(clamp(14px,4.1vw,18px),calc((50cqi - 42px) / (var(--nl,8) * .66))))}
	.principal-txt{container-type:inline-size}
	.principal-txt strong{font-size:max(14px,min(clamp(19px,5.6vw,25px),calc(100cqi / (var(--nl,8) * .84))))}
	.principal-txt strong.largo{font-size:max(14px,min(clamp(19px,5.6vw,25px),calc(100cqi / (var(--nl,8) * .66))))}
}
@media (max-width:360px){.lp-tel-pantalla .hero-nombres b{overflow-wrap:normal;overflow:hidden;text-overflow:ellipsis}}
.nav-escritorio a{white-space:nowrap}
@media (min-width:900px) and (max-width:1099px){.nav-escritorio{margin-left:16px;gap:2px}.nav-escritorio a{padding:9px 11px;font-size:14px}.logo-txt small{display:none}}

/* ---------- Marca: SPORTPRO IA ---------- */
.marca-ia{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.04em}
.logo-txt small.premium{display:flex;align-items:center;gap:4px;color:var(--oro);font-weight:800;letter-spacing:.06em}
.logo-txt small.premium .ic{width:12px;height:12px;color:var(--oro);fill:rgba(245,196,81,.35)}
@media (min-width:900px) and (max-width:1099px){.logo-txt small.premium{display:flex}}
@media (max-width:340px){.logo-txt b{font-size:17px}.logo-corona{width:34px;height:34px}.logo-corona .ic{width:22px;height:22px}}
.sus-estado{flex-wrap:wrap}
.sus-estado span{white-space:nowrap}
/* Logo en imagen (símbolo + letras en la app; logo completo en la landing, el acceso y el pie) */
.logo.con-imagen{gap:10px}
.logo-simbolo{display:block;width:40px;height:40px;flex:none;filter:drop-shadow(0 2px 8px rgba(245,196,81,.22))}
.logo-letras{display:block;height:18px;width:auto;flex:none;margin:1px 0 4px}
.logo-img{display:block;height:38px;width:auto;max-width:100%;flex:none}
.lp-pie .logo-img{height:34px}
.auth-logo .logo-img{height:52px}
.plan-simbolo{display:block;width:46px;height:46px;flex:none;filter:drop-shadow(0 2px 10px rgba(245,196,81,.25))}
@media (min-width:980px){.lp-cab .logo-img{height:42px}}
@media (max-width:370px){.logo-simbolo{width:36px;height:36px}.logo-letras{height:16px}}
@media (max-width:340px){.logo-simbolo{width:34px;height:34px}.logo-letras{height:14px}.lp-cab .logo-img{height:33px}.auth-logo .logo-img{height:44px}}