/* CB GOTHAM · v1.1 · móvil primero. Paleta solo en negro y blanco: sin naranja (02/11/2026) ni dorado (09/11/2026), por decisión de Alejandro.
   Concepto: noche de pabellón. Fondo negro, foto en blanco y negro con grano,
   blanco para acciones, estado, jugadores, MVP y aliados. */
:root{
  --night:#0A0A0B; --asphalt:#151517; --asphalt-2:#1C1C20; --line:#2A2A2F;
  --white:#F1F1EE; --mist:#A0A0A6; --dim:#6E6E75;
  --accent:#F1F1EE; --accent-soft:rgba(241,241,238,.07); --accent2:#F1F1EE; --accent2-soft:rgba(241,241,238,.07);
  --win:#FFFFFF; --loss:#A0A0A6;
  --f-display:"Bebas Neue","Oswald","Arial Narrow",Impact,sans-serif;
  --f-score:"Anton","Bebas Neue",Impact,"Arial Narrow",sans-serif;
  --f-label:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --f-body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --gut:max(16px, env(safe-area-inset-left, 0px));
  --gut-r:max(16px, env(safe-area-inset-right, 0px));
  --tabbar:64px;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--night);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night);color:var(--white);font-family:var(--f-body);font-size:16px;line-height:1.55;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--night)}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
h1,h2,h3,h4{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut-r)}
.label{font-family:var(--f-label);font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.label.o{color:var(--accent)}
.label.g{color:var(--accent2)}
.disp{font-family:var(--f-display);letter-spacing:.02em;line-height:.92}
.num{font-family:var(--f-score);font-variant-numeric:tabular-nums;letter-spacing:.01em}
.muted{color:var(--mist)}
.grain{position:relative;isolation:isolate}
.grain::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- aviso de vista previa ---------- */
.demo{background:var(--accent);color:var(--night);font-family:var(--f-label);font-weight:600;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;text-align:center;padding-block:6px;padding-left:var(--gut);padding-right:var(--gut-r)}

/* ---------- cabecera ---------- */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(10,10,11,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:20px;height:60px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.brand img{width:34px;height:34px;border-radius:50%}
.brand b{font-family:var(--f-display);font-size:1.6rem;font-weight:400;letter-spacing:.06em;line-height:1}
.menu{display:none;gap:4px;margin-left:auto}
.menu a{font-family:var(--f-label);font-weight:600;font-size:.95rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--mist);padding:8px 10px;border-radius:4px;transition:color .2s;white-space:nowrap}
.menu a:hover{color:var(--white)}
.menu a.on{color:var(--white);box-shadow:inset 0 -2px 0 var(--accent)}
.menu a.hot{color:var(--accent)}
.ig{margin-left:auto;display:inline-flex;align-items:center;gap:8px;font-family:var(--f-label);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:.85rem;text-decoration:none;border:1px solid var(--line);padding:7px 12px;border-radius:999px;color:var(--white)}
.ig svg{width:16px;height:16px}
.ig:hover{border-color:var(--accent)}
@media (max-width:599px){.ig{padding:8px;font-size:0;gap:0}.ig svg{width:18px;height:18px}}
@media (min-width:980px){.menu{display:flex}.ig{margin-left:8px}}

/* ---------- barra inferior (móvil) ---------- */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;grid-template-columns:repeat(5,1fr);background:rgba(10,10,11,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
.tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--tabbar);text-decoration:none;color:var(--dim);background:none;border:0;cursor:pointer;font-family:var(--f-label);font-weight:600;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.tabbar svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.tabbar .on{color:var(--white)}
.tabbar .on svg{stroke:var(--accent)}
.tabbar .party span.ico{display:grid;place-items:center;width:46px;height:46px;margin-top:-22px;border-radius:50%;background:var(--accent);color:var(--night);box-shadow:0 0 0 5px var(--night)}
.tabbar .party svg{stroke:var(--night);width:22px;height:22px}
.tabbar .party{color:var(--accent)}
.tabbar .party.on{color:var(--accent)}
.tabbar .party.on svg{stroke:var(--night)}
@media (min-width:980px){.tabbar{display:none}}
body{padding-bottom:calc(var(--tabbar) + env(safe-area-inset-bottom,0px))}
@media (min-width:980px){body{padding-bottom:0}}

/* hoja "Más" */
.sheet{position:fixed;inset:0;z-index:70;display:flex;align-items:flex-end;background:rgba(0,0,0,.6)}
.sheet .panel{width:100%;background:var(--asphalt);border-top:1px solid var(--line);border-radius:16px 16px 0 0;padding-block:18px calc(18px + env(safe-area-inset-bottom,0px));padding-left:var(--gut);padding-right:var(--gut-r);display:grid;gap:8px;animation:up .25s ease-out}
.sheet a{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:10px;text-decoration:none;font-family:var(--f-display);font-size:1.5rem;letter-spacing:.04em}
.sheet a small{font-family:var(--f-label);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mist)}
.sheet a.hot{border-color:var(--accent)}
.sheet .close{justify-self:center;margin-top:4px;background:none;border:0;color:var(--mist);font-family:var(--f-label);letter-spacing:.12em;text-transform:uppercase;padding:10px;cursor:pointer}
@keyframes up{from{transform:translateY(30px);opacity:.4}to{transform:none;opacity:1}}

/* ---------- paneles ---------- */
.pane{display:none}
.pane.on{display:block;animation:fade .35s ease-out}
@keyframes fade{from{opacity:.25;transform:translateY(6px)}to{opacity:1;transform:none}}
.sec{padding-block:44px}
.sec + .sec{padding-top:0}
.head{display:grid;gap:10px;margin-bottom:22px}
.head h2{font-family:var(--f-display);font-size:clamp(2.6rem,9vw,4.4rem);line-height:.9;letter-spacing:.02em}
.head p{color:var(--mist);max-width:60ch}
.page-title{padding-block:36px 8px}
.page-title h1{font-family:var(--f-display);font-size:clamp(3.4rem,14vw,7rem);line-height:.86;letter-spacing:.01em}
.page-title p{color:var(--mist);margin-top:10px;max-width:58ch}

/* botones y chips */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:4px;border:1px solid var(--accent);background:var(--accent);color:var(--night);font-family:var(--f-label);font-weight:600;font-size:1rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .15s,background .2s}
.btn:hover{background:#FFFFFF}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--white);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--white)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-family:var(--f-label);font-weight:600;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;padding:5px 10px;border:1px solid var(--line);border-radius:999px;color:var(--white);background:rgba(10,10,11,.5)}
.chip.o{border-color:var(--accent);color:var(--accent)}
.badge18{display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:50%;border:2px solid var(--accent);color:var(--accent);font-family:var(--f-score);font-size:1.05rem;line-height:1}

/* ---------- INICIO: portada ---------- */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero .photo{position:absolute;inset:0;z-index:0}
.hero .photo img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;filter:grayscale(1) contrast(1.1) brightness(.62)}
.hero .photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,11,.55) 0%,rgba(10,10,11,.25) 35%,rgba(10,10,11,.9) 78%,var(--night) 100%)}
.hero .wrap{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding-block:120px 34px;min-height:min(640px,86vh);align-content:end}
.hero h1{font-family:var(--f-display);font-size:clamp(4.2rem,21vw,12rem);line-height:.8;letter-spacing:.01em;display:flex;flex-wrap:wrap;column-gap:.18em;align-items:baseline}
.hero h1 .cb{color:transparent;-webkit-text-stroke:2px var(--white)}
.hero .lead{font-size:1.15rem;max-width:34ch;color:var(--white)}
.hero .crest{position:absolute;z-index:1;right:-60px;top:40px;width:340px;opacity:.07;filter:grayscale(1)}
.hero .ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
@media (min-width:980px){.hero .wrap{padding-block:150px 56px}.hero .crest{right:4%;top:70px;width:420px;opacity:.09}.hero .lead{font-size:1.3rem}}

/* banda de fiesta (protagonista) */
.party-band{position:relative;overflow:hidden;background:var(--white);color:var(--night)}
.party-band .wrap{display:grid;gap:18px;padding-block:34px;grid-template-columns:1fr}
.party-band .eyebrow{display:flex;align-items:center;gap:12px;font-family:var(--f-label);font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:.85rem}
.party-band .eyebrow .badge18{border-color:var(--night);color:var(--night);width:38px;height:38px;min-width:38px;font-size:.95rem}
.party-band h2{font-family:var(--f-display);font-size:clamp(3.2rem,13vw,6.4rem);line-height:.86}
.party-band p{max-width:52ch;font-size:1.05rem;font-weight:500}
.party-band .meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-family:var(--f-label);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:.9rem}
.party-band .btn{background:var(--night);color:var(--white);border-color:var(--night)}
.party-band .btn:hover{background:#000}
.party-band .bigword{position:absolute;right:-.06em;bottom:-.2em;font-family:var(--f-display);font-size:clamp(9rem,40vw,22rem);line-height:.8;color:transparent;-webkit-text-stroke:2px rgba(10,10,11,.18);pointer-events:none;user-select:none}
@media (min-width:860px){.party-band .wrap{grid-template-columns:1.3fr 1fr;align-items:end;padding-block:52px}}

/* próximo partido */
.next{background:var(--asphalt);border-bottom:1px solid var(--line)}
.next .wrap{display:grid;gap:20px;padding-block:28px}
.versus{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.side{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-size:clamp(1.6rem,6vw,2.4rem);letter-spacing:.03em;line-height:1}
.cr{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--white);overflow:hidden;flex-shrink:0}
.cr img{width:80%;height:80%;object-fit:contain}
.cr.g{background:var(--night);border:1px solid var(--line)}
.cr.g img{width:100%;height:100%}
.cr.sm{width:30px;height:30px}
.vs{font-family:var(--f-label);font-weight:600;color:var(--accent);letter-spacing:.14em}
.cd{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:420px}
.cd div{background:var(--night);border:1px solid var(--line);border-radius:6px;padding:10px 4px;text-align:center}
.cd b{display:block;font-family:var(--f-score);font-weight:400;font-size:clamp(1.9rem,8vw,2.6rem);line-height:1;font-variant-numeric:tabular-nums}
.cd small{font-family:var(--f-label);font-weight:600;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
@media (min-width:860px){.next .wrap{grid-template-columns:1fr auto;align-items:center}.cd{min-width:380px}}

/* marcador */
.board{background:var(--asphalt);border:1px solid var(--line);border-radius:10px;padding:18px;display:grid;gap:14px}
.board .row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.board .teams{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px}
.board .t{display:grid;gap:8px;justify-items:start;min-width:0}
.board .t:last-child{justify-items:end;text-align:right}
.board .t .n{font-family:var(--f-display);font-size:1.25rem;letter-spacing:.04em;line-height:1;overflow-wrap:anywhere}
.board .pts{font-family:var(--f-score);font-size:clamp(3rem,13vw,4.6rem);line-height:.9;font-variant-numeric:tabular-nums}
.board .pts.lo{color:var(--dim)}
.board .mid{font-family:var(--f-label);color:var(--dim);letter-spacing:.12em;font-weight:600}
.tag{font-family:var(--f-label);font-weight:600;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;padding:3px 8px;border-radius:3px;border:1px solid currentColor}
.tag.w{color:var(--win)}
.tag.l{color:var(--loss)}
.tag.o{color:var(--accent)}
.scorers{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.92rem;color:var(--mist)}
.scorers b{color:var(--white);font-weight:600}
.mvpline{display:flex;align-items:center;gap:10px;border-top:1px dashed var(--line);padding-top:12px}
.mvpline .star{font-family:var(--f-label);font-weight:600;letter-spacing:.14em;font-size:.75rem;color:var(--night);background:var(--accent2);padding:3px 8px;border-radius:3px}
.mvpline b{font-family:var(--f-display);font-size:1.4rem;font-weight:400;letter-spacing:.04em}

/* accesos rápidos */
.quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.quick a{display:grid;gap:4px;padding:18px 16px;border:1px solid var(--line);border-radius:10px;background:var(--asphalt);text-decoration:none;transition:border-color .2s,transform .2s}
.quick a:hover{border-color:var(--accent);transform:translateY(-2px)}
.quick b{font-family:var(--f-display);font-size:1.8rem;font-weight:400;letter-spacing:.03em;line-height:1}
.quick small{color:var(--mist);font-size:.9rem}
@media (min-width:860px){.quick{grid-template-columns:repeat(4,minmax(0,1fr))}}

.duo{display:grid;gap:14px}
@media (min-width:860px){.duo{grid-template-columns:1fr 1fr}}

/* novedades */
.feed{display:grid;gap:0;border-top:1px solid var(--line)}
.feed article{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;padding:16px 0;border-bottom:1px solid var(--line)}
.feed .when{font-family:var(--f-label);font-weight:600;letter-spacing:.12em;font-size:.8rem;color:var(--accent);text-transform:uppercase;min-width:64px}
.feed h3{font-family:var(--f-display);font-size:1.5rem;letter-spacing:.03em;line-height:1}
.feed p{color:var(--mist);font-size:.95rem;grid-column:2}

/* bloque mentalidad */
.mentality{position:relative;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--asphalt)}
.mentality .wrap{padding-block:52px;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.mentality h2{font-family:var(--f-display);font-size:clamp(2.8rem,12vw,7rem);line-height:.86;overflow-wrap:anywhere}
.mentality h2 span{color:var(--accent)}
.mentality p{color:var(--mist);max-width:50ch}
.mentality img.wm{position:absolute;right:-40px;bottom:-40px;width:260px;opacity:.06;filter:grayscale(1)}

/* ---------- FIESTAS ---------- */
.poster{position:relative;overflow:hidden;border-radius:12px;border:1px solid var(--line);background:var(--asphalt)}
.poster .photo{position:relative;aspect-ratio:16/9;max-width:100%;overflow:hidden;background:#0d0d0f}
.poster .photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:grayscale(1) brightness(.5) contrast(1.1)}
.poster .photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,var(--asphalt) 100%)}
.poster .photo .ph{position:absolute;z-index:3;left:16px;top:14px}
.poster .body{position:relative;z-index:3;display:grid;gap:14px;padding:0 18px 22px;margin-top:-56px}
.poster h2{font-family:var(--f-display);font-size:clamp(3rem,13vw,5.6rem);line-height:.86}
.poster .facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.poster .facts div{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--night)}
.poster .facts b{display:block;font-family:var(--f-display);font-size:1.35rem;font-weight:400;letter-spacing:.03em;line-height:1.1}
.ph-note{font-family:var(--f-label);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mist);background:rgba(10,10,11,.75);border:1px dashed var(--dim);padding:4px 8px;border-radius:4px}
.party-grid{display:grid;gap:18px}
@media (min-width:980px){.party-grid{grid-template-columns:1.1fr 1fr;align-items:start}.poster .facts{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* formularios */
.formcard{border:1px solid var(--line);border-radius:12px;background:var(--asphalt);padding:20px 18px;display:grid;gap:16px}
.formcard h3{font-family:var(--f-display);font-size:2.2rem;line-height:.95;letter-spacing:.02em}
.fields{display:grid;gap:12px}
@media (min-width:620px){.fields{grid-template-columns:1fr 1fr}.fields .wide{grid-column:1/-1}}
.field{display:grid;gap:6px;min-width:0}
.field label{font-family:var(--f-label);font-weight:600;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mist)}
.inp{width:100%;min-height:48px;padding:10px 12px;border-radius:6px;border:1px solid var(--line);background:var(--night);color:var(--white);font:inherit;font-size:16px}
.inp:focus{border-color:var(--accent);outline:none}
textarea.inp{min-height:120px;resize:vertical}
.chk{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:.92rem;color:var(--mist)}
.chk input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent)}
.chk.age{color:var(--white);padding:10px 12px;border:1px solid var(--accent);border-radius:8px;background:var(--accent-soft)}
.fmsg{font-size:.92rem;min-height:1.2em}
.fmsg.err{color:var(--white);font-weight:600}
.ok{border:1px solid var(--win);border-radius:10px;padding:16px;display:grid;gap:8px;background:rgba(241,241,238,.06)}
.ok h4{font-family:var(--f-display);font-size:1.8rem;letter-spacing:.03em;font-weight:400}
.democode{font-family:var(--f-score);font-size:1.3rem;letter-spacing:.06em;color:var(--accent2)}
.hp{position:absolute;left:-9999px}

/* lobas y grada */
.crowd{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;border:1px solid var(--line);border-radius:12px;padding:22px 18px;background:linear-gradient(135deg,var(--asphalt) 0%,var(--night) 100%)}
.crowd h3{overflow-wrap:anywhere;font-family:var(--f-display);font-size:clamp(2.2rem,9vw,3.4rem);line-height:.9}
.crowd h3 span{color:var(--accent)}

/* ---------- PARTIDOS ---------- */
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tile{border:1px solid var(--line);border-radius:10px;padding:14px;background:var(--asphalt);display:grid;gap:4px}
.tile b{font-family:var(--f-score);font-weight:400;font-size:clamp(2rem,9vw,2.8rem);line-height:1;font-variant-numeric:tabular-nums}
.tile.o b{color:var(--accent)}
@media (min-width:860px){.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
.subtabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-block:26px 18px;scrollbar-width:none}
.subtabs::-webkit-scrollbar{display:none}
.subtabs button{flex-shrink:0;border:1px solid var(--line);background:transparent;border-radius:999px;padding:9px 16px;font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.88rem;color:var(--mist);cursor:pointer}
.subtabs button[aria-pressed="true"]{background:var(--white);color:var(--night);border-color:var(--white)}
.list{display:grid;gap:12px}
@media (min-width:860px){.list.two{grid-template-columns:1fr 1fr}}
.cal{display:grid;border-top:1px solid var(--line)}
.cal article{display:grid;grid-template-columns:62px 1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.cal .d{text-align:center;line-height:1}
.cal .d b{display:block;font-family:var(--f-score);font-weight:400;font-size:2rem}
.cal .d small{font-family:var(--f-label);font-weight:600;letter-spacing:.12em;font-size:.72rem;color:var(--mist)}
.cal .who{display:grid;gap:4px;min-width:0}
.cal .who .side{font-size:1.35rem}
.cal .who .side .n{overflow-wrap:anywhere}
.cal .who .meta{font-size:.85rem;color:var(--mist)}
.cal article.nx{background:var(--accent-soft);border-left:3px solid var(--accent);padding-left:10px}
.cal article.done{opacity:.55}
.cal .res{font-family:var(--f-score);font-size:1.3rem;font-variant-numeric:tabular-nums}
.empty{border:1px dashed var(--dim);border-radius:10px;padding:20px;color:var(--mist);display:grid;gap:8px}
.empty b{font-family:var(--f-display);font-weight:400;font-size:1.6rem;color:var(--white);letter-spacing:.03em}
.table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.table th{font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;color:var(--mist);text-align:right;padding:8px 6px;border-bottom:1px solid var(--line)}
.table th:first-child,.table td:first-child{text-align:left}
.table td{padding:12px 6px;border-bottom:1px solid var(--line);text-align:right}
.table tr.me td{color:var(--accent)}
.scroll-x{overflow-x:auto}

/* MVP */
.mvpcard{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;border:1px solid rgba(241,241,238,.35);border-radius:10px;padding:14px;background:linear-gradient(135deg,var(--accent2-soft),transparent 70%)}
.mvpcard .dn{font-family:var(--f-score);font-size:3rem;line-height:.9;color:var(--accent2);min-width:64px;text-align:center}
.mvpcard b{font-family:var(--f-display);font-weight:400;font-size:1.7rem;letter-spacing:.03em;line-height:1}
.mvpcard p{color:var(--mist);font-size:.9rem}

/* ---------- EQUIPO ---------- */
.feature{display:grid;gap:18px;border:1px solid var(--line);border-radius:14px;background:var(--asphalt);padding:18px;position:relative;overflow:hidden}
.feature .jersey{position:relative;justify-self:center;width:min(240px,62vw);max-width:100%}
.jersey{position:relative;aspect-ratio:330/615;max-width:100%}
.jersey img{width:100%;height:100%;object-fit:contain}
.jersey .jn{position:absolute;left:0;right:0;top:19%;text-align:center;font-family:var(--f-score);color:var(--accent2);letter-spacing:.06em;font-size:clamp(.9rem,4.6vw,1.35rem);line-height:1}
.jersey .jd{position:absolute;left:0;right:0;top:27%;text-align:center;font-family:var(--f-score);color:var(--accent2);font-size:clamp(4.4rem,22vw,7rem);line-height:1}
.feature .info{display:grid;gap:12px;align-content:start;min-width:0}
.feature .bignum{position:absolute;right:-10px;top:-30px;font-family:var(--f-score);font-size:15rem;line-height:1;color:transparent;-webkit-text-stroke:2px rgba(241,241,238,.12);pointer-events:none}
.feature h2{font-family:var(--f-display);font-size:clamp(3.4rem,15vw,6rem);line-height:.85}
.feature .title{font-family:var(--f-label);font-weight:600;font-size:1.15rem;letter-spacing:.06em;color:var(--accent2);text-transform:uppercase}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stats div{border:1px solid var(--line);border-radius:8px;padding:10px;background:var(--night)}
.stats b{display:block;font-family:var(--f-score);font-weight:400;font-size:1.9rem;line-height:1;color:var(--accent2)}
.stats small{font-family:var(--f-label);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:.7rem;color:var(--mist)}
.vote{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
@media (min-width:860px){.feature{grid-template-columns:280px 1fr;padding:28px;gap:32px}.feature .jersey{width:100%}}
.roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:620px){.roster{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:980px){.roster{grid-template-columns:repeat(4,minmax(0,1fr))}}
.pcard{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:10px;background:var(--asphalt);padding:12px;cursor:pointer;transition:border-color .2s,transform .2s;min-width:0}
.pcard:hover{border-color:rgba(241,241,238,.5);transform:translateY(-2px)}
.pcard[aria-pressed="true"]{border-color:var(--accent2);background:linear-gradient(135deg,var(--accent2-soft),var(--asphalt) 70%)}
.pcard .d{font-family:var(--f-score);font-size:2.3rem;line-height:1;color:var(--accent2);min-width:48px;text-align:center}
.pcard b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.45rem;letter-spacing:.03em;line-height:1}
.pcard small{display:block;color:var(--mist);font-size:.8rem;line-height:1.3;margin-top:3px}
.pcard > span{min-width:0}

/* ---------- JUEGA ---------- */
.game{display:grid;gap:18px}
@media (min-width:980px){.game{grid-template-columns:1.1fr 1fr;align-items:start}}
.court{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--asphalt);display:grid;gap:12px;padding-bottom:16px}
.court canvas{width:100%;height:auto;aspect-ratio:640/720;max-width:100%;display:block;cursor:pointer;touch-action:manipulation}
.meter{position:relative;height:14px;margin:0 16px;border-radius:999px;background:var(--night);border:1px solid var(--line);overflow:hidden}
.meter .zone{position:absolute;left:35%;width:30%;top:0;bottom:0;background:rgba(241,241,238,.18)}
.meter .sweet{position:absolute;left:43%;width:14%;top:0;bottom:0;background:rgba(241,241,238,.5)}
.meter b{position:absolute;top:-2px;bottom:-2px;width:4px;margin-left:-2px;background:var(--white);border-radius:2px;left:50%}
.gmsg{padding:0 16px;color:var(--mist);min-height:1.5em}
.gmsg.good{color:var(--accent);font-weight:600}
.court .btn{margin:0 16px}
.wheelbox{border:1px solid var(--line);border-radius:12px;background:var(--asphalt);padding:18px;display:grid;gap:12px;justify-items:center;text-align:center}
.wheelwrap{position:relative;width:min(320px,80vw);max-width:100%;aspect-ratio:1}
.wheelwrap svg{width:100%;height:100%}
.wheelwrap .pin{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:22px solid var(--accent);z-index:2}
.wheelbox.locked .wheelwrap{opacity:.35;filter:grayscale(1)}
.lockmsg{font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mist)}
.wheelbox:not(.locked) .lockmsg{display:none}
.prizes{display:grid;gap:8px;width:100%;text-align:left}
.prizes li{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.prizes li b{font-family:var(--f-label);letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.prizes ul{list-style:none;margin:0;padding:0}

/* ---------- NOTICIAS ---------- */
.filters{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-bottom:18px}
.filters::-webkit-scrollbar{display:none}
.filters button{flex-shrink:0;border:1px solid var(--line);background:transparent;border-radius:999px;padding:8px 14px;font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.85rem;color:var(--mist);cursor:pointer}
.filters button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.lead-story{display:grid;gap:14px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--asphalt)}
.lead-story .photo{position:relative;aspect-ratio:16/9;max-width:100%;overflow:hidden}
.lead-story .photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.55) contrast(1.1)}
.lead-story .photo .sc{position:absolute;z-index:3;left:16px;right:16px;bottom:14px;display:flex;align-items:end;justify-content:space-between;gap:10px}
.lead-story .photo .sc .num{font-size:clamp(3.4rem,15vw,6rem);line-height:.85}
.lead-story .photo .sc .num.lo{color:var(--mist)}
.lead-story .photo .sc .num + .num{text-align:right}
.lead-story .photo .sc span.mid{font-family:var(--f-label);letter-spacing:.12em;color:var(--mist);font-weight:600;padding-bottom:10px}
.lead-story .txt{padding:0 18px 20px;display:grid;gap:10px}
.lead-story h2{font-family:var(--f-display);font-size:clamp(2.2rem,9vw,3.6rem);line-height:.9}
.news{display:grid;gap:12px}
.news article{display:grid;gap:8px;border:1px solid var(--line);border-radius:10px;padding:16px;background:var(--asphalt)}
.news h3{font-family:var(--f-display);font-size:1.7rem;letter-spacing:.03em;line-height:1}
.news p{color:var(--mist);font-size:.95rem}
.news .k{display:flex;gap:10px;align-items:center}
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.gallery figure{margin:0;position:relative;aspect-ratio:1;max-width:100%;overflow:hidden;border-radius:8px;border:1px solid var(--line);background:var(--asphalt);display:grid;place-items:center}
.gallery figure img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1)}
.gallery figure.ph{border-style:dashed}
.gallery figure.ph span{font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;color:var(--dim);text-align:center;padding:10px}
@media (min-width:860px){.gallery{grid-template-columns:repeat(4,minmax(0,1fr))}.news{grid-template-columns:1fr 1fr}}
.videocard{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:18px;background:var(--asphalt)}
.videocard b{font-family:var(--f-display);font-weight:400;font-size:1.8rem;letter-spacing:.03em}

/* ---------- CONTACTO ---------- */
.club{display:grid;gap:18px;border:1px solid var(--line);border-radius:14px;padding:20px 18px;background:var(--asphalt)}
.club .id{display:flex;gap:14px;align-items:center}
.club .id img{width:72px;height:72px;border-radius:50%}
.club .id b{font-family:var(--f-display);font-weight:400;font-size:2.4rem;line-height:.9;letter-spacing:.03em}
.facts6{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.facts6 div{border-top:1px solid var(--line);padding-top:8px;min-width:0}
.facts6 b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.3rem;letter-spacing:.03em;line-height:1.1;overflow-wrap:anywhere}
@media (min-width:860px){.facts6{grid-template-columns:repeat(3,minmax(0,1fr))}}
.channels{display:grid;gap:10px}
.channel{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:14px 16px;background:var(--asphalt);text-decoration:none}
.channel.main{border-color:var(--accent);background:linear-gradient(135deg,var(--accent-soft),var(--asphalt) 70%)}
.channel svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7}
.channel b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.5rem;letter-spacing:.03em;line-height:1}
.channel small{color:var(--mist);overflow-wrap:anywhere}
.channel .go{font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;color:var(--accent);background:none;border:0;cursor:pointer}
.join{display:grid;gap:10px}
@media (min-width:860px){.join{grid-template-columns:repeat(3,minmax(0,1fr))}}
.join article{border:1px solid var(--line);border-radius:10px;padding:18px;background:var(--asphalt);display:grid;gap:8px;align-content:start}
.join h3{font-family:var(--f-display);font-size:2rem;line-height:.95;letter-spacing:.02em}
.join article:first-child h3{color:var(--accent2)}
.join p{color:var(--mist);font-size:.95rem}
.allies{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@media (min-width:860px){.allies{grid-template-columns:repeat(4,minmax(0,1fr))}}
.allies div{aspect-ratio:3/2;max-width:100%;border:1px dashed rgba(241,241,238,.35);border-radius:8px;display:grid;place-items:center;font-family:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;color:var(--dim);text-align:center;padding:8px}

/* favorito de la afición */
.fans{border:1px solid var(--line);border-radius:12px;background:var(--asphalt);padding:18px;display:grid;gap:14px}
.fans h3{font-family:var(--f-display);font-size:2.2rem;line-height:.95;letter-spacing:.02em}
.fanrank{display:grid;gap:6px}
.fr{position:relative;display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:8px 10px;border-radius:6px;overflow:hidden;background:var(--night)}
.fr .bar{position:absolute;left:0;top:0;bottom:0;background:var(--accent2-soft);z-index:0;transition:width .4s}
.fr > span:not(.bar){position:relative;z-index:1}
.fr .p{color:var(--mist)}
.fr .n{font-family:var(--f-display);font-size:1.3rem;letter-spacing:.03em}
.fr .n small{font-family:var(--f-label);font-size:.8rem;color:var(--mist)}
.fr .v{color:var(--accent2);font-size:1.2rem}
.fr.top{outline:1px solid var(--accent2)}

/* avisos (Firebase) e instalación de la app */
.avisos{padding-block:14px}
.av-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-weight:600;letter-spacing:.03em}
.av-pan{max-width:460px;display:grid;gap:4px}.av-pan h3{font-family:var(--f-display);font-size:1.8rem}.av-sm,.av-msg{color:var(--mist);font-size:.9rem}
.av-tg{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line);cursor:pointer}
.av-tg small{display:block;color:var(--mist);font-weight:400}.av-tg input{width:22px;height:22px;accent-color:var(--white)}
.av-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.av-warn{margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:.92rem}
#gtInstall{position:fixed;left:12px;right:12px;bottom:calc(var(--tabbar) + 12px + env(safe-area-inset-bottom,0px));z-index:80;display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--asphalt);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.6);color:var(--white);font:600 14px var(--f-label);letter-spacing:.04em}
#gtInstall img{width:34px;height:34px;border-radius:8px}
#gtInstall span{flex:1}
#gtInstall button{font:inherit;cursor:pointer;border:0;border-radius:8px;padding:8px 12px;background:var(--white);color:var(--night)}
#gtInstall #gtInstX{background:transparent;color:var(--mist);font-size:20px;padding:4px 8px}
@media (min-width:980px){#gtInstall{bottom:12px;left:auto;max-width:420px}}

/* pie */
.foot{border-top:1px solid var(--line);margin-top:20px}
.foot .wrap{padding-block:30px;display:grid;gap:10px;color:var(--mist);font-size:.88rem}
.foot b{font-family:var(--f-display);font-size:1.6rem;font-weight:400;color:var(--white);letter-spacing:.05em}
.foot a{color:var(--mist)}

/* entradas al hacer scroll: visibles en reposo */
.rv{transition:transform .5s ease-out}
.rv.pre{transform:translateY(14px)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
