/* Sitio público: azul marino con títulos grandes (Poppins), botones en píldora y formas geométricas.
   Solo afecta a las páginas con <body class="pub">. */
body.pub{
  --bg:#0a1a3c; --panel:#10264f; --panel2:#17336a; --line:#2a4a8a;
  --text:#ffffff; --muted:#a9b8d9; --accent:#3d8bff; --on-accent:#ffffff;
  --glass:rgba(10,26,60,.94);
  --good:#35d399; --bad:#ff7b7b;
  background:var(--bg); color:var(--text); font-family:var(--head);
}
body.pub h1,body.pub h2,body.pub h3{font-family:var(--head);font-weight:800;text-transform:none;letter-spacing:-.4px;color:var(--text)}
body.pub h2{font-size:30px;margin:44px 0 18px;letter-spacing:-.5px}
body.pub h2::after{display:none}
body.pub h2::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-right:12px;flex:none}
body.pub .muted,body.pub small{font-weight:500}

/* barra superior y navegación */
body.pub .top{background:var(--glass);border-bottom:1px solid var(--line);box-shadow:none}
body.pub .top .brandtxt small{color:var(--muted)}
body.pub #nav{background:transparent}
body.pub #nav a{text-transform:none;letter-spacing:0;font-weight:600;color:var(--muted)}
body.pub #nav a:hover{color:var(--text)}
body.pub #nav a.on{color:#fff;border-bottom-color:var(--accent)}
@media(max-width:759px){body.pub #nav{background:var(--glass)!important;border-top:1px solid var(--line)}body.pub #nav a{color:var(--muted)}body.pub #nav a.on{color:var(--accent)}body.pub #nav a.on svg{filter:none}}
body.pub .backbtn{background:var(--panel);border-color:var(--line);color:#fff}
body.pub .backbtn:hover{border-color:var(--accent);color:var(--accent)}

/* portada del equipo / liga: título grande y formas geométricas */
body.pub .phero{position:relative;overflow:hidden;background:linear-gradient(180deg,#0e2250,var(--bg));border:0;border-bottom:1px solid var(--line);box-shadow:none}
body.pub .phero > *{position:relative;z-index:1}
body.pub .phero h1{font-family:var(--head);font-weight:800;text-transform:none;letter-spacing:-1.5px;line-height:1.02;color:#fff}
body.pub .phero small.eb{color:#6aa4ff;letter-spacing:2.5px}
body.pub .phero .sub{color:var(--muted)}
body.pub .phero::before{content:"";position:absolute;right:13%;top:24px;width:62px;height:62px;border-radius:50%;border:10px solid var(--accent);border-bottom-color:transparent;border-left-color:transparent;transform:rotate(-25deg);pointer-events:none;opacity:.95}
body.pub .phero::after{content:"";position:absolute;right:5%;bottom:30px;width:40px;height:40px;pointer-events:none;background:linear-gradient(45deg,transparent 40%,#8fbcff 40% 60%,transparent 60%),linear-gradient(-45deg,transparent 40%,#8fbcff 40% 60%,transparent 60%)}
body.pub #view[data-r="landing"]{position:relative}
body.pub #view[data-r="landing"]::before{content:"";position:absolute;right:9%;top:40px;width:54px;height:54px;border-radius:50%;border:9px solid var(--accent);border-bottom-color:transparent;border-left-color:transparent;transform:rotate(-25deg);pointer-events:none}
body.pub #view[data-r="landing"]::after{content:"";position:absolute;right:20%;top:150px;width:32px;height:32px;pointer-events:none;background:linear-gradient(45deg,transparent 40%,#8fbcff 40% 60%,transparent 60%),linear-gradient(-45deg,transparent 40%,#8fbcff 40% 60%,transparent 60%)}
body.pub .land{position:relative;z-index:1}

/* botones en píldora */
body.pub .btn,body.pub .pill,body.pub input,body.pub select,body.pub button{font-family:var(--head)}
body.pub .btn{border-radius:999px;background:var(--panel2);border:1px solid var(--line);color:#fff;font-weight:700}
body.pub .btn.primary,body.pub .pill.on{background:var(--accent);color:#fff;border:0}
body.pub .btn.primary:hover{background:#2f7bff}
body.pub .btn.ghost{background:transparent}
body.pub .pill{border-radius:999px;color:var(--muted)}
body.pub .pill.on{color:#fff}
@media(min-width:1000px){body.pub .pills{border-bottom:1px solid var(--line)}body.pub .pill{border-radius:0;background:none;color:var(--muted);border-bottom:3px solid transparent}body.pub .pill.on{background:none;color:#fff;border-bottom-color:var(--accent)}}

/* tarjetas azul marino con sombra suave */
body.pub .card,body.pub .lcard,body.pub .tk,body.pub .tcard,body.pub .tchip,body.pub .lgame,body.pub details.pl,body.pub .tblwrap,body.pub .kpi,body.pub .grow,body.pub .lhead{
  background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:0 18px 40px -28px rgba(0,0,0,.7)}
body.pub .tchip{border-radius:999px}
body.pub .card.empty,body.pub .empty{background:transparent;border:1px dashed var(--line);box-shadow:none}
body.pub .lcard::before{background:var(--accent)}
body.pub .lcard:hover,body.pub .tk:hover,body.pub .tchip:hover,body.pub a.lgame:hover,body.pub .tcard:hover{border-color:var(--accent)}
body.pub .grow::before{width:5px}
body.pub .tbl th,body.pub .ptbl th{background:var(--panel2)}
body.pub .tbl tbody tr:hover,body.pub .ptbl tbody tr:hover{background:var(--panel2)}
body.pub .ptbl tr.first td{background:rgba(61,139,255,.12)}
body.pub .lg{background:var(--panel2);border-color:var(--line);color:#fff}
body.pub .livebig,body.pub .lgame.live{background:rgba(255,123,123,.1);border-color:rgba(255,123,123,.45)}
body.pub .leader .pos{background:var(--panel2)}
body.pub .leader .pos.first{background:var(--accent);color:#fff}
body.pub .crumb a:first-child{color:#8fbcff}
body.pub .lct b{font-family:var(--head);font-weight:800;font-size:28px;letter-spacing:-.5px;text-transform:none}

/* pie de página: azul marino más oscuro */
body.pub .sitefoot{background:#071430;border-top:1px solid var(--line);color:#9fb0d4}
body.pub .sitefoot .fb b{color:#fff}
body.pub .sitefoot a:hover{color:#8fbcff}

/* más aire a los lados */
body.pub .card{padding:18px 24px}
body.pub .card.tight{padding:14px 22px}
body.pub .leader{padding:14px 0}
body.pub .tcard{padding:24px 18px!important}
body.pub .lgame{padding-left:20px;padding-right:20px}
@media(max-width:999px){
  body.pub #view.wrap{padding-left:20px;padding-right:20px}
  body.pub .lbody{padding-left:20px;padding-right:20px}
  body.pub .phero{padding-left:20px;padding-right:20px}
  body.pub .crumb{padding-left:20px;padding-right:20px}
}
@media(min-width:760px) and (max-width:1180px){
  body.pub .top{padding-left:16px;padding-right:12px}
  body.pub .top .brand img.logo{height:42px}body.pub .top .brand .wm{height:26px}body.pub .top .brandtxt small{display:none}
  body.pub #nav{right:8px}body.pub #nav a{padding:0 9px;font-size:13px}
}
@media(min-width:1000px){
  body.pub .phero h1{letter-spacing:-2.5px}
  body.pub #view[data-r] .tblwrap{background:var(--panel);border:1px solid var(--line);border-radius:20px}
  body.pub .lgame{border-radius:0;box-shadow:none;border-left:0;border-right:0;border-top:0;background:transparent}
  body.pub .kpis{border-bottom:1px solid var(--line)}
  body.pub .kpi{background:transparent;border:0;border-left:1px solid var(--line);border-radius:0;box-shadow:none}
  body.pub .kpi:first-child{border-left:0}
  body.pub #view:not([data-r="home"]) .kpi{background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:0 18px 40px -28px rgba(0,0,0,.7)}
}

/* tarjeta del próximo juego */
.mcard{display:block;text-decoration:none;color:inherit;padding:22px 24px;margin:10px 0;border-radius:24px;background:linear-gradient(135deg,var(--panel2),var(--panel));border:1px solid var(--line);position:relative;overflow:hidden;box-shadow:0 18px 40px -28px rgba(0,0,0,.7)}
.mcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--accent)}
a.mcard:hover{border-color:var(--accent)}
.mc-tag{display:block;color:#8fbcff;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;font-size:12px;margin-bottom:14px}
.mc-teams{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mc-t{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;min-width:0}
.mc-t b{font-weight:800;font-size:18px;overflow-wrap:anywhere}
.mlogo{width:72px;height:72px;border-radius:50%;object-fit:contain;background:var(--panel);border:2px solid var(--line);display:grid;place-items:center;font-family:var(--display);font-size:28px;color:#fff;flex:none}
.mc-vs{font-weight:800;color:var(--accent);font-size:20px}
.mc-info{display:flex;flex-wrap:wrap;gap:6px 0;justify-content:center;margin-top:18px;color:var(--muted);font-weight:600;font-size:14px}
.mc-info span:not(:first-child)::before{content:"·";margin:0 10px}
.mcard.big{padding:34px 28px}.mcard.big .mlogo{width:120px;height:120px;font-size:44px}.mcard.big .mc-t b{font-size:26px}.mcard.big .mc-vs{font-size:28px}

/* ===== teléfono: más aire y sin amontonar ===== */
@media(max-width:759px){
  body.pub .top{background:var(--bg)}
  body.pub #view.wrap{padding-bottom:120px}
  body.pub h2{font-size:23px;margin:34px 0 14px;align-items:flex-start}
  body.pub h2::before{margin-top:9px;width:8px;height:8px;margin-right:10px}
  /* portada: logo arriba y título abajo, formas pequeñas en la esquina */
  body.pub .phero{flex-direction:column;align-items:flex-start;gap:14px;padding:26px 20px 28px;margin:0 -20px 18px;border-radius:0}
  body.pub #view:not(.wrap) .phero{margin:0 0 18px}
  body.pub .phero .big,body.pub .phero img.big{width:72px;height:72px;font-size:28px}
  body.pub .phero h1{font-size:40px;letter-spacing:-1.2px}
  body.pub .phero small.eb{font-size:11px;letter-spacing:2px}
  body.pub .phero::before{width:34px;height:34px;border-width:7px;top:18px;right:20px}
  body.pub .phero::after{width:22px;height:22px;right:26px;bottom:22px}
  body.pub #view[data-r="landing"]::before{width:34px;height:34px;border-width:7px;top:26px;right:22px}
  body.pub #view[data-r="landing"]::after{display:none}
  body.pub .crumb{padding-top:16px;padding-bottom:6px;font-size:13px}
  /* juego en vivo */
  body.pub .livebig{padding:18px}
  body.pub .livebig .row.between{margin-bottom:14px}
  body.pub .score .team span{font-size:14px}
  /* cifras y tarjetas */
  body.pub .kpis{gap:12px}
  body.pub .kpi{padding:18px 10px}
  body.pub .kpi b{font-size:38px}
  body.pub .kpi span{font-size:11px;letter-spacing:1.2px}
  body.pub .card{padding:16px 18px}
  body.pub .grow{padding:16px 16px 16px 20px}
  body.pub .mcard{padding:20px 18px}.mc-t b{font-size:16px}.mlogo{width:60px;height:60px}
  body.pub .mcard.big .mlogo{width:84px;height:84px}
  /* estadísticas en tarjetas: etiquetas y cifras legibles */
  body.pub .tbl tr{padding:16px 18px;gap:12px 8px}
  body.pub .tbl td{font-size:17px;font-weight:700;padding:0}
  body.pub .tbl td:first-child{font-size:18px;padding-bottom:8px}
  body.pub .tbl td::before{font-size:11px;font-weight:600;letter-spacing:.8px;margin-bottom:2px}
  /* marcador y pizarra del detalle */
  body.pub .card > .chip{margin-bottom:8px}
  body.pub .card > .chip + .muted{display:block;margin:6px 0 14px;line-height:1.4}
  body.pub .score{margin:10px 0 6px}
  body.pub table.line{font-size:13px;width:100%}
  body.pub table.line td,body.pub table.line th{padding:8px 4px}
  /* navegación inferior */
  body.pub #nav a{font-size:10px;gap:4px;padding:8px 2px}
  body.pub #nav a svg{width:21px;height:21px}
  /* liga */
  body.pub .catbar{overflow-x:auto;flex-wrap:nowrap;margin-bottom:6px}body.pub .catbar .pill{flex:none}
  body.pub .ptbl th,body.pub .ptbl td{padding:12px 2px;font-size:12.5px}
  body.pub .gscore{gap:8px;padding:18px 0}.gscore .gn span,.gscore .gn i{font-size:64px}.gscore .gt b{font-size:17px}
  body.pub .tcard{padding:20px 14px!important}
  body.pub .tks{gap:10px}
  body.pub .tk{min-width:220px}
  body.pub details.pl summary{flex-wrap:wrap;gap:4px 10px;padding:14px 16px}
  body.pub details.pl .st{margin-left:0;text-align:left;width:100%}
  body.pub .leader{gap:12px}
  body.pub .lcard.slim .lch{padding:18px}.lct b{font-size:22px}
}
/* en la portada y la liga el contenido ya trae su propio margen: no se duplica */
@media(max-width:759px){
  body.pub.lp #view.wrap{padding-left:0;padding-right:0}
  body.pub.lp .phero{margin:0 0 18px}
}
@media(max-width:759px){
  body.pub .lscore{min-width:0;font-size:12.5px}
  body.pub .lscore th,body.pub .lscore td{padding:10px 2px}
  body.pub .lscore td.tn{max-width:74px;overflow:hidden;text-overflow:ellipsis;padding-left:8px}
  body.pub .lscore td.t{font-size:19px}
  body.pub .tblwrap{overflow-x:visible}
}
@media(max-width:759px){
  body.pub details.pl summary{position:relative;padding-right:46px}
  body.pub details.pl summary::after{position:absolute;right:18px;top:12px;margin:0}
}

/* teléfono: equipos en lista compacta (no una tarjeta gigante por equipo) */
@media(max-width:759px){
  body.pub .teamgrid{display:flex;flex-direction:column;gap:8px}
  body.pub .tcard{flex-direction:row;justify-content:flex-start;align-items:center;text-align:left;gap:12px;padding:10px 14px!important;border-radius:16px}
  body.pub .tcard .lg.big{width:42px;height:42px;font-size:17px}
  body.pub .tcard b{font-size:16px;flex:1;min-width:0}
  body.pub .tcard .muted{font-size:12px;text-align:right;flex:none}
}
@media(max-width:759px){body.pub .teamgrid .tcard{margin:0;min-height:0}}