/* Leyenda: el partido en 3D con controles táctiles */
#partido { position:fixed; inset:0; z-index:50; background:#000; overflow:hidden; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:#fff; }
#pt-cv { position:absolute; inset:0; width:100%; height:100%; display:block; }
#pt-marc { position:absolute; left:calc(env(safe-area-inset-left,0px) + 10px); top:calc(env(safe-area-inset-top,0px) + 8px); display:flex; align-items:stretch; height:28px; border-radius:5px; overflow:hidden; box-shadow:0 3px 12px #0009; font-weight:800; pointer-events:none; }
#pt-marc .pt-eq { display:flex; align-items:center; gap:6px; background:#0b1611f0; padding:0 8px; font-size:.8rem; letter-spacing:.04em; }
#pt-marc .pt-eq i { width:5px; align-self:stretch; background:var(--c); margin:0 -8px; } #pt-marc .pt-eq:first-child i { margin-right:2px; } #pt-marc .pt-eq:nth-child(3) i { margin-left:2px; }
#pt-marc .pt-gol { background:#f8fafc; color:#0b1611; padding:0 10px; display:flex; align-items:center; gap:4px; font-size:1rem; font-variant-numeric:tabular-nums; }
#pt-min { background:#22c55e; color:#04130a; padding:0 8px; display:flex; align-items:center; font-size:.8rem; font-variant-numeric:tabular-nums; min-width:44px; justify-content:center; }
#pt-yo { position:absolute; left:calc(env(safe-area-inset-left,0px) + 10px); top:calc(env(safe-area-inset-top,0px) + 42px); background:#0b1611d9; border-radius:8px; padding:5px 8px; min-width:104px; pointer-events:none; font-size:.76rem; }
#pt-yo b { display:block; font-size:.8rem; margin-bottom:3px; } .pt-bar { height:5px; background:#ffffff26; border-radius:3px; overflow:hidden; } .pt-bar i { display:block; height:100%; width:100%; background:#22c55e; }
#pt-nota { position:absolute; right:8px; top:4px; font-weight:800; color:#facc15; font-size:.82rem; }
#pt-bts { position:absolute; right:calc(env(safe-area-inset-right,0px) + 10px); top:calc(env(safe-area-inset-top,0px) + 8px); display:flex; gap:6px; z-index:3; } #pt-bts button { width:40px; height:36px; border-radius:10px; border:0; background:#0b1611d9; color:#fff; font-size:1rem; }
#pt-radar { position:absolute; left:50%; transform:translateX(-50%); top:calc(env(safe-area-inset-top,0px) + 8px); width:112px; height:75px; border-radius:6px; pointer-events:none; opacity:.92; }
#pt-aviso { position:absolute; left:50%; top:34%; transform:translate(-50%,-50%) scale(.9); text-align:center; font-size:1.5rem; font-weight:900; text-shadow:0 2px 14px #000; opacity:0; pointer-events:none; transition:opacity .25s, transform .25s; white-space:nowrap; }
#pt-aviso.on { opacity:1; transform:translate(-50%,-50%) scale(1); } #pt-aviso small { display:block; font-size:.9rem; font-weight:700; opacity:.9; } #pt-aviso.gol { font-size:2.6rem; color:#facc15; }
#pt-negro { position:absolute; inset:0; background:#000; opacity:0; pointer-events:none; transition:opacity .2s; } #pt-negro.on { opacity:1; }
/* controles */
#pt-ctl { position:absolute; inset:0; z-index:2; }
#pt-joy { position:absolute; left:calc(env(safe-area-inset-left,0px) + 40px); bottom:calc(env(safe-area-inset-bottom,0px) + 36px); width:120px; height:120px; border-radius:50%; background:#ffffff1c; border:2px solid #ffffff44; pointer-events:none; opacity:.55; }
#pt-joy.on { opacity:1; } #pt-joyb { position:absolute; left:40px; top:40px; width:40px; height:40px; border-radius:50%; background:#ffffffb0; }
#pt-btns { position:absolute; right:calc(env(safe-area-inset-right,0px) + 12px); bottom:calc(env(safe-area-inset-bottom,0px) + 14px); width:230px; height:200px; }
.bt { position:absolute; width:64px; height:64px; border-radius:50%; border:2px solid #ffffff66; background:#0b1611b8; color:#fff; font-weight:800; font-size:.74rem; padding:0; touch-action:none; -webkit-tap-highlight-color:transparent; }
.bt.on { background:#22c55ecc; transform:scale(.94); }
.bt.a { right:70px; bottom:6px; background:#16a34ab0; } .bt.b { right:6px; bottom:66px; background:#dc2626b0; } .bt.c { right:70px; bottom:126px; background:#2563ebb0; } .bt.d { right:134px; bottom:66px; background:#eab308b0; color:#111; }
.bt.sp { right:140px; bottom:0; width:54px; height:54px; font-size:.66rem; background:#0b1611d0; left:auto; transform:translate(-26px,-4px); } .bt.r { right:2px; bottom:136px; width:52px; height:52px; font-size:.66rem; background:#7c3aedb0; }
.bt.sp { right:204px; bottom:6px; transform:none; }
#partido:not(.ataque) .bt.r { opacity:.35; }
#pt-pot { position:absolute; right:calc(env(safe-area-inset-right,0px) + 14px); bottom:calc(env(safe-area-inset-bottom,0px) + 226px); width:150px; height:10px; border-radius:6px; background:#0008; overflow:hidden; display:none; } #pt-pot.on { display:block; } #pt-poti { display:block; height:100%; width:0; background:linear-gradient(90deg,#22c55e,#facc15,#ef4444); }
#partido.vert #pt-joy { bottom:calc(env(safe-area-inset-bottom,0px) + 44px); } #partido.vert #pt-btns { transform-origin:100% 100%; transform:scale(.9); }
#pt-panel { position:absolute; inset:0; background:#000a; display:flex; align-items:center; justify-content:center; z-index:5; } #pt-panel.hidden { display:none; }
.pt-card { width:min(92vw,360px); max-height:90vh; overflow:auto; background:#111c17; border:1px solid #24382e; border-radius:16px; padding:16px; text-align:center; } .pt-card h3 { margin:0 0 6px; }
.pt-res { font-size:1.3rem; font-weight:800; margin:6px 0 10px; } .pt-fila { display:grid; grid-template-columns:1fr 1.4fr 1fr; padding:4px 0; border-bottom:1px solid #ffffff12; font-size:.9rem; } .pt-fila span { color:#93a89c; }
.pt-b { display:block; width:100%; margin-top:10px; padding:12px; border:0; border-radius:12px; background:#22c55e; color:#04130a; font-weight:800; font-size:1rem; } .pt-b.sec { background:#ffffff1a; color:#fff; }
#partido.repite #pt-ctl { display:none; } #partido.repite #pt-aviso.rep { top:calc(env(safe-area-inset-top,0px) + 64px); transform:translate(-50%,0); left:auto; right:14px; font-size:1rem; background:#dc2626; padding:3px 10px; border-radius:6px; letter-spacing:.1em; }
#pt-obj { position:absolute; left:calc(env(safe-area-inset-left,0px) + 10px); top:calc(env(safe-area-inset-top,0px) + 100px); font-size:.68rem; line-height:1.35; text-shadow:0 1px 4px #000; pointer-events:none; opacity:.9; } #pt-obj .ok { color:#86efac; }
#pt-ayuda { position:absolute; inset:0; z-index:6; background:#000b; display:flex; align-items:center; justify-content:center; } #pt-ayuda .pt-card { text-align:left; } #pt-ayuda li { margin:6px 0; font-size:.9rem; }

/* presentación, subtítulos y rótulos de TV */
#pt-comp { background:#0b1611f0; padding:0 9px; display:none; align-items:center; font-size:.62rem; color:#9db3a6; letter-spacing:.04em; white-space:nowrap; max-width:170px; overflow:hidden; text-overflow:ellipsis; } @media (min-width:640px) { #pt-comp { display:flex; } }
#pt-sub { position:absolute; left:50%; transform:translateX(-50%); bottom:calc(env(safe-area-inset-bottom,0px) + 14px); max-width:min(46vw,460px); background:#05080fe0; border-left:3px solid #22c55e; padding:6px 11px; font-size:.78rem; line-height:1.3; border-radius:4px; opacity:0; transition:opacity .25s; pointer-events:none; z-index:3; text-shadow:0 1px 3px #000; } #pt-sub.on { opacity:1; } #pt-sub.fuerte { border-left-color:#facc15; font-weight:700; }
#partido.vert #pt-sub { bottom:calc(env(safe-area-inset-bottom,0px) + 240px); max-width:88vw; }
#pt-lt { position:absolute; left:calc(env(safe-area-inset-left,0px) + 12px); bottom:calc(env(safe-area-inset-bottom,0px) + 168px); background:linear-gradient(90deg,#0b1611f2,#0b1611c0); border-left:4px solid #facc15; padding:6px 12px; border-radius:3px; font-size:.82rem; transform:translateX(-30px); opacity:0; transition:all .3s; pointer-events:none; z-index:3; } #pt-lt.on { opacity:1; transform:none; } #pt-lt small { display:block; opacity:.75; font-size:.68rem; }
#partido.vert #pt-lt { bottom:calc(env(safe-area-inset-bottom,0px) + 190px); }
#pt-intro { position:absolute; inset:0; z-index:7; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding:calc(env(safe-area-inset-top,0px) + 14px) 14px 10px; background:linear-gradient(180deg,#000d,#0006 62%,#0000); transition:opacity .9s; } #pt-intro.hidden { display:none; } #pt-intro.fuera { opacity:0; pointer-events:none; }
#pt-intro .li-cab { text-align:center; margin-bottom:8px; } #pt-intro .li-cab b { display:block; font-size:1.3rem; letter-spacing:.02em; } #pt-intro .li-cab small { color:#b5c7bc; display:block; font-size:.74rem; }
#pt-intro .li-cols { display:flex; gap:14px; align-items:flex-start; justify-content:center; width:100%; } #pt-intro .li-eq { flex:1; max-width:260px; background:#0b1611e0; border-top:4px solid var(--c); border-radius:8px; padding:7px 10px; font-size:.74rem; line-height:1.55; } #pt-intro h4 { margin:0 0 3px; font-size:.82rem; } #pt-intro .li-eq b { display:inline-block; min-width:20px; color:#facc15; } #pt-intro .li-eq small { color:#7f9488; float:right; } #pt-intro .li-eq .yo { background:#22c55e30; border-radius:4px; font-weight:800; }
#pt-intro .li-vs { align-self:center; font-weight:900; opacity:.7; } #pt-intro .li-sk { margin-top:6px; color:#9db3a6; font-size:.7rem; }
@media (max-height:430px) { #pt-intro .li-eq { font-size:.62rem; line-height:1.28; padding:4px 8px; } #pt-intro .li-cab b { font-size:1rem; } }

#pt-vig { position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 50% 46%, #0000 54%, #0000004d 100%); z-index:1; }
#partido.clima-lluvia #pt-vig { background:radial-gradient(ellipse at 50% 46%, #0000 46%, #0a182a66 100%); } #partido.clima-niebla #pt-vig { background:radial-gradient(ellipse at 50% 46%, #fff1 30%, #c9d3dc40 100%); }
#partido.cielo-noche #pt-vig { background:radial-gradient(ellipse at 50% 46%, #0000 44%, #00000080 100%); }
#pt-cv { filter:saturate(1.08) contrast(1.04); }