/* ==========================================================
   TORNEO NUBOT · estilos
   ----------------------------------------------------------
   Base heredada de las otras webs del torneo; la identidad de
   Nubot (Geometry Dash + PlayUs) está en «TEMA NUBOT», al final
   (JetBrains Mono) y titulares anchos (Unbounded). Esquinas
   casi rectas y etiquetas inclinadas. Primero para el móvil.
   ========================================================== */

html{ touch-action:pan-x pan-y; }
:root{
  color-scheme: dark;
  --bg:#08090C; --bg-2:#0C0E13; --surface:#12151B; --surface-2:#191D25;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.17);
  --text:#F4F5F7; --text-2:#A9B0BC; --text-3:#6B7383;
  --red:#FF2E43; --red-2:#E01B31; --red-soft:rgba(255,46,67,.14);
  --purple:#B26CFF; --green:#2BD67B; --yellow:#FFD23F; --down:#FF6A5A;
  --gold:#F2C14E; --silver:#D9DEE7; --bronze:#D99057;
  --f-d:"Unbounded","Arial Black",system-ui,sans-serif;
  --f-m:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --f-b:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gutter:16px; --maxw:1160px; --hdr:60px; --r:4px;
}

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--hdr) + 12px); }
body{
  margin:0; min-height:100vh; background:var(--bg); color:var(--text);
  font-family:var(--f-b); font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-x:hidden;
}
/* mapa de puntos + brillo rojo */
body::before{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.11) 1px, transparent 1.4px);
  background-size:14px 14px;
  -webkit-mask-image:radial-gradient(ellipse 70% 45% at 60% 8%, #000 10%, transparent 75%);
  mask-image:radial-gradient(ellipse 70% 45% at 60% 8%, #000 10%, transparent 75%);
}
body::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(520px 380px at 100% 0%, rgba(255,46,67,.16), transparent 70%),
             radial-gradient(600px 420px at 0% 40%, rgba(178,108,255,.06), transparent 70%);
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; }
button, select, input{ font:inherit; color:inherit; -webkit-tap-highlight-color:transparent; }
h1,h2,h3,h4,p,ol,ul,figure{ margin:0; }
ol,ul{ padding:0; list-style:none; }
h1,h2,h3{ overflow-wrap:break-word; -webkit-hyphens:auto; hyphens:auto; }
b,strong{ font-weight:700; }
[hidden]{ display:none !important; }
::selection{ background:var(--red); color:#fff; }
:focus-visible{ outline:2px solid var(--red); outline-offset:3px; }
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }
.narrow{ max-width:820px; }
.skip{ position:fixed; left:12px; top:-60px; z-index:100; padding:10px 16px; background:var(--red); color:#fff; font-weight:700; transition:top .2s; }
.skip:focus{ top:12px; }
.i{ width:1.15em; height:1.15em; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* ---------- textos ---------- */
.eyebrow, .lbl{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--f-m); font-weight:700; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--red);
}
.eyebrow::before{ content:""; width:8px; height:8px; background:currentColor; }
.lbl{ color:var(--text-3); letter-spacing:.14em; }
.h2{
  font-family:var(--f-d); font-weight:800; text-transform:uppercase;
  font-size:clamp(30px, 8.6vw, 56px); line-height:1.02; letter-spacing:-.02em; text-wrap:balance;
}
.sec{ position:relative; padding:64px 0; }
.sec-head{ margin-bottom:22px; }
.sec-head .h2{ margin-top:12px; }
.sub{ margin-top:12px; color:var(--text-2); font-size:15.5px; max-width:58ch; text-wrap:pretty; }
.sub b{ color:var(--text); }
.meta{ margin-top:12px; font-family:var(--f-m); font-size:12px; color:var(--text-3); }
.sec-head.split .more{ margin-top:14px; }
.more{ display:inline-flex; align-items:center; gap:8px; font-family:var(--f-m); font-weight:700; font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text); }
.more .i{ color:var(--red); transition:transform .2s; }
.more:hover .i{ transform:translateX(3px); }
.panel{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r); }
.empty{ padding:24px 18px; border:1px dashed var(--line-2); border-radius:var(--r); text-align:center; color:var(--text-2); font-size:14px; }
.empty-line{ font-size:14px; color:var(--text-2); }
.skel{ border-radius:var(--r); background:linear-gradient(90deg, rgba(255,255,255,.03) 25%, rgba(255,255,255,.07) 50%, rgba(255,255,255,.03) 75%); background-size:200% 100%; animation:skel 1.3s linear infinite; }
@keyframes skel{ to{ background-position:-200% 0; } }

/* etiqueta inclinada, como en los rótulos de televisión */
.tagx{
  display:inline-block; padding:3px 10px; transform:skewX(-12deg);
  background:var(--red); color:#fff; font-family:var(--f-m); font-weight:800; font-size:11px; letter-spacing:.12em; text-transform:uppercase; line-height:1.4;
}

/* ---------- botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:50px; padding:0 22px; border-radius:3px; border:1px solid transparent; cursor:pointer;
  font-family:var(--f-d); font-weight:700; font-size:13px; letter-spacing:.06em; text-transform:uppercase; line-height:1; white-space:nowrap;
  transition:background-color .15s, border-color .15s, color .15s, transform .12s;
}
.btn:active{ transform:scale(.98); }
/* un botón nunca más ancho que la pantalla: si el texto no cabe, a dos líneas */
.btn{ max-width:100%; }
.btn > span{ min-width:0; white-space:normal; text-align:center; line-height:1.2; }
.btn .i{ width:18px; height:18px; }
.btn-red{ background:var(--red); color:#fff; box-shadow:0 10px 30px -14px rgba(255,46,67,.9); }
.btn-red:hover{ background:var(--red-2); }
.btn-ghost{ background:transparent; color:var(--text); border-color:var(--line-2); }
.btn-ghost:hover{ border-color:var(--text); }
.btn-sm{ min-height:40px; padding:0 14px; font-size:11.5px; }
.btn-block{ width:100%; }
.btn[aria-disabled="true"], .btn:disabled{ opacity:.4; pointer-events:none; }

/* ---------- estado ---------- */
.status{
  display:inline-flex; align-items:center; gap:9px; max-width:100%; padding:6px 12px;
  border:1px solid var(--line-2); border-radius:2px;
  font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap;
}
.status > span:last-child{ overflow:hidden; text-overflow:ellipsis; }
.led{ width:8px; height:8px; flex:none; border-radius:50%; background:var(--text-3); }
.status.is-live .led, .day-live .led{ background:var(--green); animation:led 1.6s ease-out infinite; }
.status.is-pre .led{ background:var(--purple); }
.status.is-done .led{ background:var(--gold); }
.status.is-loading{ color:var(--text-3); }
@keyframes led{ 0%{ box-shadow:0 0 0 0 rgba(43,214,123,.6); } 80%,100%{ box-shadow:0 0 0 8px rgba(43,214,123,0); } }

/* ==========================================================
   CABECERA Y MENÚ
   ========================================================== */
.hdr{ position:sticky; top:0; z-index:60; background:rgba(8,9,12,.86); -webkit-backdrop-filter:blur(14px) saturate(1.4); backdrop-filter:blur(14px) saturate(1.4); border-bottom:1px solid var(--line); }
.hdr-in{ height:var(--hdr); display:flex; align-items:center; gap:10px; }
.brand{ display:flex; align-items:center; gap:10px; min-width:0; margin-right:auto; }
.logo{ width:36px; height:36px; flex:none; }
.brand-t{ display:flex; flex-direction:column; line-height:1; }
.brand-t b{ font-family:var(--f-d); font-weight:800; font-size:16px; letter-spacing:-.01em; white-space:nowrap; }
.brand-t small{ margin-top:5px; font-family:var(--f-m); font-weight:700; font-size:10px; letter-spacing:.34em; text-transform:uppercase; color:var(--red); }
.nav, .hdr .lang, .hdr-cta{ display:none !important; }
.lang{ display:flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:3px; }
.lang button{ min-width:34px; height:28px; padding:0 6px; border:0; border-radius:2px; background:none; cursor:pointer; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.06em; color:var(--text-3); }
.lang button.on{ background:var(--text); color:var(--bg); }
.menu-btn{ width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--line-2); border-radius:3px; background:none; cursor:pointer; }
.menu-btn span, .menu-btn span::before, .menu-btn span::after{ display:block; width:18px; height:2px; background:var(--text); transition:transform .2s; }
.menu-btn span{ position:relative; }
.menu-btn span::before, .menu-btn span::after{ content:""; position:absolute; left:0; }
.menu-btn span::before{ top:-6px; }
.menu-btn span::after{ top:6px; width:12px; background:var(--red); }
.menu-btn[aria-expanded="true"] span{ background:transparent; }
.menu-btn[aria-expanded="true"] span::before{ top:0; transform:rotate(45deg); }
.menu-btn[aria-expanded="true"] span::after{ top:0; width:18px; transform:rotate(-45deg); background:var(--text); }
.menu{ position:fixed; inset:var(--hdr) 0 0; z-index:59; overflow-y:auto; padding:10px var(--gutter) calc(30px + env(safe-area-inset-bottom)); background:rgba(8,9,12,.98); animation:menuIn .2s ease; }
@keyframes menuIn{ from{ opacity:0; transform:translateY(-8px); } }
.menu nav a{ display:flex; align-items:center; justify-content:space-between; min-height:58px; border-bottom:1px solid var(--line); font-family:var(--f-d); font-weight:700; font-size:20px; text-transform:uppercase; }
.menu nav a::after{ content:"→"; font-family:var(--f-m); color:var(--text-3); }
.menu nav a.on{ color:var(--red); }
.menu-foot{ display:flex; align-items:center; justify-content:space-between; margin:22px 0; }
.menu-lbl{ font-family:var(--f-m); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
body.menu-open{ overflow:hidden; }

/* ==========================================================
   PORTADA
   ========================================================== */
.hero{ position:relative; padding:26px 0 0; overflow:hidden; }
.hero-in{ display:grid; gap:20px; }
.kicker{ margin-top:18px; font-family:var(--f-m); font-weight:700; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-2); }
.hero-t{ display:flex; flex-direction:column; margin-top:8px; font-family:var(--f-d); text-transform:uppercase; line-height:.86; }
.ht-top{ font-weight:800; font-size:clamp(46px, 15vw, 96px); letter-spacing:.02em; color:transparent; -webkit-text-stroke:1.5px rgba(255,255,255,.85); }
.ht-num{ font-weight:900; font-size:clamp(120px, 44vw, 270px); letter-spacing:-.06em; margin-left:-.04em; }
.ht-num em{ font-style:normal; color:var(--red); font-size:.62em; letter-spacing:-.02em; margin-left:.02em; text-shadow:0 0 50px rgba(255,46,67,.45); }
.ht-sub{ margin-top:10px; font-family:var(--f-m); font-weight:800; font-size:clamp(14px, 4.4vw, 20px); letter-spacing:.62em; color:var(--text-2); }
.lead{ margin-top:18px; font-size:16px; color:var(--text-2); max-width:52ch; text-wrap:pretty; }
.lead b{ color:var(--text); }
.ctas{ display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.ctas .btn{ flex:1 1 200px; }
.hero-me{ display:flex; align-items:center; gap:8px; margin-top:16px; font-family:var(--f-m); font-size:13px; color:var(--text-2); }
.hero-me .i{ color:var(--gold); fill:currentColor; }
.hero-me b{ color:var(--text); }
/* el dial del percentil */
.dial{ display:none; position:relative; width:100%; max-width:420px; aspect-ratio:1; margin-left:auto; }
.dial svg{ width:100%; height:100%; transform:rotate(-90deg); }
.dial-track{ fill:none; stroke:rgba(255,255,255,.07); stroke-width:10; }
.dial-ticks{ fill:none; stroke:rgba(255,255,255,.22); stroke-width:7; stroke-dasharray:1 5.03; }
.dial-arc{ fill:none; stroke:var(--red); stroke-width:10; stroke-linecap:round; stroke-dasharray:0 528; filter:drop-shadow(0 0 8px rgba(255,46,67,.9)); animation:arco 1.6s .3s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes arco{ to{ stroke-dasharray:22 528; } }
.dial-t{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; font-family:var(--f-d); }
.dial-t b{ font-weight:900; font-size:96px; line-height:1; letter-spacing:-.05em; }
.dial-t b em{ font-style:normal; color:var(--red); font-size:.6em; }
.dial-t i{ margin-top:10px; font-style:normal; font-family:var(--f-m); font-weight:700; font-size:13px; letter-spacing:.5em; color:var(--text-3); }

.spec{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); margin-top:34px; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.spec li{ display:flex; flex-direction:column; gap:6px; padding:16px 14px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.spec b{ font-family:var(--f-d); font-weight:800; font-size:34px; line-height:1; }
.spec b em{ font-style:normal; color:var(--red); }
.spec li > span{ font-size:12.5px; line-height:1.35; color:var(--text-2); }

.ticker{ margin-top:30px; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.015); }
.ticker-in{ display:flex; width:max-content; animation:ticker 70s linear infinite; }
.ticker-in span{ display:inline-flex; align-items:center; gap:18px; padding:11px 0 11px 18px; font-family:var(--f-m); font-weight:700; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); white-space:nowrap; }
.ticker-in span::after{ content:""; width:6px; height:6px; background:var(--red); transform:rotate(45deg); }
@keyframes ticker{ to{ transform:translateX(-50%); } }

/* ---------- en directo ---------- */
#directo .eyebrow{ margin-bottom:16px; }
.live{ display:grid; gap:14px; }
.game-hero{ position:relative; overflow:hidden; border-radius:var(--r); background:var(--surface-2); }
.game-hero img, .game-hero .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; }
.game-hero figcaption{
  position:absolute; inset:auto 0 0; display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:40px 14px 12px;
  background:linear-gradient(transparent, rgba(0,0,0,.85));
}
.game-hero small{ font-family:var(--f-m); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-2); }
.game-hero b{ font-family:var(--f-d); font-weight:800; font-size:24px; text-transform:uppercase; line-height:1.05; }
.noimg{ display:grid; place-items:center; background:var(--surface-2); font-size:34px; }
.noimg.big{ font-size:64px; }
.game-tip{ margin:12px 0; color:var(--text-2); font-size:14.5px; }
.game-novideo{ margin-top:12px; font-size:13px; color:var(--text-3); }
.live-game > .btn{ margin-top:4px; }
.mystery{ position:relative; }
.mystery-grid{ position:relative; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:4px; border-radius:var(--r); overflow:hidden; }
.mystery-grid span img, .mystery-grid span .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; filter:grayscale(1) brightness(.35) blur(1px); }
.mystery-grid > b{ position:absolute; inset:0; display:grid; place-items:center; font-family:var(--f-d); font-weight:900; font-size:96px; color:var(--red); text-shadow:0 0 40px rgba(255,46,67,.6); }
.game-cap{ margin-top:12px; }
.game-cap p{ margin-top:10px; color:var(--text-2); font-size:14.5px; }
.live-side{ padding:18px; }
.clock{ display:flex; align-items:flex-start; gap:4px; margin-top:10px; }
.cu{ display:flex; flex-direction:column; align-items:center; }
.cu b{ font-family:var(--f-m); font-weight:800; font-size:44px; line-height:1; font-variant-numeric:tabular-nums; }
.cu small{ margin-top:6px; font-family:var(--f-m); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.clock .sep{ font-style:normal; font-family:var(--f-m); font-weight:800; font-size:36px; line-height:1.1; color:var(--red); }
.clock-txt{ display:flex; align-items:center; gap:10px; font-family:var(--f-d); font-weight:800; font-size:22px; text-transform:uppercase; }
.clock-txt .i{ color:var(--red); }
.note{ margin-top:10px; font-size:12.5px; color:var(--text-3); }
.laps{ margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.laps-h, .laps-f{ display:flex; justify-content:space-between; gap:10px; font-family:var(--f-m); font-size:12px; color:var(--text-2); }
.laps-h b{ color:var(--text); font-size:15px; }
.laps-f{ margin-top:8px; font-size:11px; color:var(--text-3); text-transform:uppercase; letter-spacing:.1em; }
.lapbar{ display:grid; grid-template-columns:repeat(var(--n,21), minmax(0,1fr)); gap:3px; margin-top:10px; }
.lap{ height:10px; background:rgba(255,255,255,.08); }
.lap.done{ background:rgba(255,255,255,.55); }
.lap.now{ background:var(--red); box-shadow:0 0 10px rgba(255,46,67,.8); }
.leader{ display:flex; flex-wrap:wrap; gap:4px 10px; margin-top:16px; padding:10px 12px; background:var(--bg-2); border-left:3px solid var(--gold); font-family:var(--f-m); font-size:12.5px; }
.leader span{ color:var(--gold); text-transform:uppercase; letter-spacing:.12em; font-weight:700; }

/* ==========================================================
   LA TORRE
   ========================================================== */
.tower-tools{ display:grid; gap:10px; margin-bottom:12px; }
.seg{ display:inline-flex; justify-self:start; padding:3px; border:1px solid var(--line-2); border-radius:3px; }
.seg button{ padding:8px 12px; border:0; border-radius:2px; background:none; cursor:pointer; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-2); }
.seg button[aria-pressed="true"]{ background:var(--text); color:var(--bg); }
.find{ position:relative; display:block; }
.find .i{ position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--text-3); pointer-events:none; }
.find input{ width:100%; height:46px; padding:0 14px 0 42px; border:1px solid var(--line-2); border-radius:3px; background:var(--surface); outline:none; font-size:16px; -webkit-appearance:none; appearance:none; }
.find input:focus{ border-color:var(--red); }
.find input::placeholder{ color:var(--text-3); }
.find input::-webkit-search-cancel-button{ filter:invert(1) opacity(.5); }
#searchResult:not(:empty){ margin-bottom:12px; }
.follow{ margin-bottom:12px; }
.follow-h{ display:flex; align-items:center; gap:8px; margin-bottom:6px; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
.follow-h .i{ fill:currentColor; }

.tower{ display:grid; gap:4px; }
.tw{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:3px; overflow:hidden; }
.tw.me{ border-color:rgba(242,193,78,.55); }
.tw.open{ background:var(--surface-2); border-color:var(--line-2); }
.tw-main{
  display:grid; grid-template-columns:42px 4px minmax(0,1fr) auto; align-items:stretch; gap:0 10px;
  width:100%; min-height:56px; padding:0 12px 0 0; border:0; background:none; text-align:left; cursor:pointer;
}
.tw-pos{ display:grid; place-items:center; font-family:var(--f-m); font-weight:800; font-size:17px; background:rgba(255,255,255,.05); font-variant-numeric:tabular-nums; }
.tw.p1 .tw-pos{ background:var(--gold); color:#1C1400; }
.tw.p2 .tw-pos{ background:var(--silver); color:#141820; }
.tw.p3 .tw-pos{ background:var(--bronze); color:#1E0F04; }
.tw-bar{ margin:9px 0; border-radius:2px; background:var(--line-2); }
.tw-bar.b-win{ background:var(--purple); box-shadow:0 0 10px rgba(178,108,255,.8); }
.tw-bar.b-up{ background:var(--green); }
.tw-bar.b-down{ background:var(--down); }
.tw-who{ min-width:0; display:flex; flex-direction:column; justify-content:center; gap:3px; padding:8px 0; }
.tw-l1{ display:flex; align-items:baseline; gap:8px; min-width:0; }
.tw-code{ flex:none; font-family:var(--f-m); font-weight:800; font-size:15px; letter-spacing:.04em; }
.tw-name{ min-width:0; font-size:13.5px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tw.p1 .tw-name, .tw.me .tw-name{ color:var(--text); }
.tw-l2{ display:flex; align-items:center; gap:8px; font-family:var(--f-m); font-size:11px; color:var(--text-3); }
.mv{ min-width:30px; font-weight:700; }
.mv.up{ color:var(--green); }
.mv.down{ color:var(--down); }
.tw-j{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sect, .legend span:not(.ley-tip){ display:inline-flex; align-items:center; gap:2px; }
.sect i, .legend i{ display:block; width:9px; height:9px; border-radius:1px; }
.s-win{ background:var(--purple); }
.s-top{ background:var(--green); }
.s-mid{ background:rgba(255,255,255,.55); }
.s-low{ background:rgba(255,255,255,.16); }
.s-no{ background:transparent; box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); }
.tw-val{ display:flex; flex-direction:column; align-items:flex-end; justify-content:center; text-align:right; }
.tw-val b{ font-family:var(--f-m); font-weight:800; font-size:16px; line-height:1.1; font-variant-numeric:tabular-nums; }
.tw-val b.lead{ color:var(--gold); font-size:12px; letter-spacing:.14em; text-transform:uppercase; }
.tw-val small{ font-family:var(--f-m); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.tw.p1 .tw-val b{ color:var(--gold); }

/* telemetría (al tocar un jugador) */
.tel{ padding:4px 12px 16px; border-top:1px solid var(--line); animation:menuIn .2s ease; }
.tel-h{ margin:14px 0 8px; font-family:var(--f-m); font-weight:700; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--red); }
.tel-gap{ display:grid; gap:4px; }
.tel-gap li{ display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--text-2); }
.tel-gap li.ok{ color:var(--text); }
.tel-gap .i{ width:15px; height:15px; color:var(--text-3); }
.tel-gap li.ok .i{ color:var(--green); }
.tel-stats{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1px; margin-top:12px; background:var(--line); border:1px solid var(--line); }
.tel-stats > div{ display:flex; flex-direction:column; gap:2px; min-width:0; padding:10px; background:var(--bg-2); }
.tel-stats b{ font-family:var(--f-m); font-weight:800; font-size:18px; line-height:1.1; }
.tel-stats span{ font-family:var(--f-m); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); line-height:1.25; }
.tel-stats small{ font-size:11px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tel-strip{ display:grid; grid-template-columns:repeat(auto-fill, minmax(30px, 1fr)); gap:3px; }
.cell{ display:flex; flex-direction:column; align-items:center; justify-content:center; height:40px; border-radius:2px; font-family:var(--f-m); line-height:1.1; }
.cell b{ font-size:11px; }
.cell small{ font-size:8.5px; opacity:.6; }
.cell.s-win{ color:#fff; }
.cell.s-top{ color:#04140B; }
.cell.s-mid{ color:#0B0C10; }
.cell.s-no{ color:var(--text-3); }
.tel-acc{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.tel-acc .btn[aria-pressed="true"] .i{ color:var(--gold); fill:currentColor; }
.legend{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; margin-top:14px; font-family:var(--f-m); font-size:11px; color:var(--text-3); }
.legend span{ gap:6px !important; }
.ley-tip{ flex-basis:100%; color:var(--text-2); }
.more-btn{ margin-top:12px; }
.tower-empty{ position:relative; }
.tower.ghost li{ display:grid; grid-template-columns:42px 1fr 60px; gap:12px; height:56px; padding-right:12px; align-items:center; background:var(--surface); border:1px solid var(--line); border-radius:3px; opacity:.5; }
.tower.ghost li span{ height:10px; background:rgba(255,255,255,.06); }
.tower.ghost li span:first-child{ height:100%; }
.tower-msg{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:20px; text-align:center; background:radial-gradient(ellipse at center, rgba(8,9,12,.92), rgba(8,9,12,.6)); }
.tower-msg .i{ width:30px; height:30px; color:var(--red); }
.tower-msg strong{ font-family:var(--f-d); font-weight:800; font-size:18px; text-transform:uppercase; max-width:22ch; }
.tower-msg p{ font-size:14px; color:var(--text-2); max-width:40ch; }

/* ==========================================================
   BOTÍN
   ========================================================== */
.loot-row{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 var(--gutter); scrollbar-width:none; margin:0 calc(var(--gutter) * -1); padding:0 var(--gutter) 4px; }
.loot-row::-webkit-scrollbar{ display:none; }
.lc{ flex:none; width:78%; max-width:300px; scroll-snap-align:start; display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.lc-media{ position:relative; }
.lc-media img, .lc-media .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; }
.lc-media .tagx{ position:absolute; left:10px; top:10px; }
.lc-body{ display:flex; flex-direction:column; flex:1; padding:12px 14px 14px; }
.lc-body > small{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.lc-win{ display:flex; align-items:center; gap:7px; margin-top:4px; min-width:0; }
.lc-win .i{ width:17px; height:17px; color:var(--gold); }
.lc-win b{ font-family:var(--f-d); font-weight:700; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lc-win span{ margin-left:auto; font-family:var(--f-m); font-size:12px; color:var(--text-2); white-space:nowrap; }
.lc-mark{ margin-top:6px; font-family:var(--f-m); font-size:11.5px; color:var(--text-3); }
.lc-mark b{ color:var(--text); }
.pf{ display:inline-block; padding:1px 7px; background:rgba(178,108,255,.18); color:var(--purple); font-family:var(--f-m); font-weight:700; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.lc-item{ display:flex; gap:10px; align-items:flex-start; margin-top:auto; padding:10px 12px; border:1px solid rgba(242,193,78,.45); background:rgba(242,193,78,.06); }
.lc-body .lc-item{ margin-top:12px; }
.lc-item .i{ width:20px; height:20px; color:var(--gold); margin-top:2px; }
.lc-item span{ min-width:0; }
.lc-item small{ display:block; font-family:var(--f-m); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.lc-item b{ display:block; font-size:14px; overflow-wrap:anywhere; }
.lc-item em{ display:block; font-style:normal; font-size:12px; color:var(--text-2); }
.lc-item.pend{ border-style:dashed; border-color:var(--line-2); background:none; }
.lc-item.pend .i, .lc-item.pend b{ color:var(--text-3); }
.loot-note{ display:flex; align-items:center; gap:8px; margin-top:12px; font-family:var(--f-m); font-size:11.5px; color:var(--text-3); }
.loot-note .i{ color:var(--gold); }
.loot-empty{ position:relative; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.lc.ghost{ width:auto; height:150px; opacity:.4; border-style:dashed; }
.loot-empty p{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:10px; padding:16px; text-align:center; font-size:14.5px; color:var(--text-2); }
.loot-empty p .i{ width:24px; height:24px; color:var(--gold); }

/* ==========================================================
   DADOS
   ========================================================== */
.sec-dice{ background:linear-gradient(180deg, var(--bg-2), var(--bg)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.rules4{ display:grid; gap:10px; }
.rule{ position:relative; padding:18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.rule-n{ display:block; font-family:var(--f-d); font-weight:900; font-size:52px; line-height:1; letter-spacing:-.03em; }
.rule h3{ margin-top:12px; font-family:var(--f-d); font-weight:700; font-size:15px; text-transform:uppercase; line-height:1.25; }
.rule p{ margin-top:8px; font-size:14px; color:var(--text-2); }
.rule p b{ color:var(--yellow); }
.rule-warn{ border:2px solid var(--yellow); padding-top:28px; background:linear-gradient(180deg, rgba(255,210,63,.09), var(--surface) 60%); }
.rule-warn::before{ content:""; position:absolute; inset:0 0 auto; height:7px; background:repeating-linear-gradient(-45deg, var(--yellow) 0 10px, #111 10px 20px); }
.rule-warn .rule-n{ color:var(--yellow); }
.rule-tag{ position:absolute; right:14px; top:18px; display:inline-flex; align-items:center; gap:6px; padding:3px 9px; transform:skewX(-12deg); background:var(--yellow); color:#141000; font-family:var(--f-m); font-weight:800; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.rule-tag .i{ width:13px; height:13px; }
.dice-foot{ display:grid; gap:10px; margin:12px 0 20px; }
.flow{ padding:18px; }
.flow h3{ font-family:var(--f-d); font-weight:700; font-size:15px; text-transform:uppercase; }
.flow-steps{ position:relative; display:grid; gap:12px; margin-top:16px; }
.flow-steps::before{ content:""; position:absolute; left:17px; top:18px; bottom:18px; width:2px; background:var(--line-2); }
.flow-steps li{ position:relative; display:grid; grid-template-columns:36px minmax(0,1fr); align-items:center; gap:12px; font-size:14px; color:var(--text-2); }
.f-ico{ width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:var(--surface-2); border:2px solid var(--line-2); font-family:var(--f-m); font-weight:800; }
.f-ico .i{ width:17px; height:17px; }
.f-use .f-ico{ background:var(--text); color:var(--bg); border-color:var(--text); }
.f-try .f-ico{ border-color:var(--red); color:var(--red); }
.f-yes .f-ico{ border-color:var(--green); color:var(--green); }
.f-yes{ color:var(--text) !important; }
.f-no .f-ico{ border-color:var(--yellow); color:var(--yellow); background:rgba(255,210,63,.1); }
.f-no{ color:var(--yellow) !important; font-weight:700; }
.pool{ padding:18px; }
.pool-n{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; margin-top:8px; }
.pool-n b{ font-family:var(--f-d); font-weight:900; font-size:46px; line-height:1; }
.pool-n span{ font-size:13.5px; color:var(--text-2); }
.dice-row{ display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.die{ width:34px; height:34px; display:grid; place-items:center; border-radius:6px; background:var(--text); color:var(--bg); }
.die .i{ width:22px; height:22px; }
.die.extra{ background:var(--red); color:#fff; }
.pool-thx{ margin-top:12px; font-family:var(--f-m); font-size:12px; color:var(--text-3); }

/* ---------- juegos ---------- */
.selection{ margin-bottom:18px; padding:16px; border-left:3px solid var(--red); }
.selection.pend{ border-style:dashed; border-left:3px solid var(--purple); }
.sel-h{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.sel-h b{ font-family:var(--f-d); font-weight:700; font-size:14px; text-transform:uppercase; }
.selection.pend .tagx{ background:var(--purple); }
.selection p:last-child{ margin-top:8px; font-size:14px; color:var(--text-2); }
.rail{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 var(--gutter); scrollbar-width:none; margin:0 calc(var(--gutter) * -1); padding:0 var(--gutter) 4px; }
.rail::-webkit-scrollbar{ display:none; }
.rail .gc{ flex:none; width:44%; max-width:220px; scroll-snap-align:start; }
.gc{ display:flex; flex-direction:column; align-self:start; padding:0; border:0; background:none; text-align:left; cursor:pointer; }
.gc-img{ position:relative; display:block; border-radius:var(--r); overflow:hidden; background:var(--surface-2); }
.gc-img img{ width:100%; aspect-ratio:1.6; object-fit:cover; transition:transform .25s; }
.gc:hover .gc-img img{ transform:scale(1.04); }
.gc-img .tagx{ position:absolute; left:8px; top:8px; font-size:9.5px; padding:2px 8px; }
.gc b{ margin-top:8px; font-family:var(--f-d); font-weight:700; font-size:12.5px; text-transform:uppercase; line-height:1.2; }
.gc small{ margin-top:3px; font-family:var(--f-m); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.gc small.on{ color:var(--red); }
.games-tools{ display:grid; gap:10px; margin-bottom:18px; }
.filters{ display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
.fchip{ flex:none; display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 13px; border:1px solid var(--line-2); border-radius:3px; background:none; cursor:pointer; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-2); }
.fchip b{ color:var(--text-3); }
.fchip[aria-pressed="true"]{ background:var(--text); border-color:var(--text); color:var(--bg); }
.ggrid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px 12px; }

/* ---------- inscripción ---------- */
.entry{ display:grid; gap:20px; }
.entry .sec-head{ margin-bottom:0; }
.pass{ padding:20px; border-top:3px solid var(--red); }
.pass-req{ display:flex; flex-direction:column; gap:6px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.pass-req b{ font-family:var(--f-d); font-weight:800; font-size:20px; text-transform:uppercase; }
.pass-code{ padding:16px 0; }
.code-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.code-row b{ font-family:var(--f-m); font-weight:800; font-size:34px; letter-spacing:.14em; }
.code-pronto{ margin-top:6px; font-size:13px; color:var(--text-3); }
.plazas{ margin-top:10px; text-align:center; font-family:var(--f-m); font-size:12px; color:var(--text-3); }
.steps{ display:grid; gap:14px; }
.steps li{ display:grid; grid-template-columns:44px minmax(0,1fr); gap:12px; }
.steps li > b{ font-family:var(--f-m); font-weight:800; font-size:20px; color:var(--red); }
.steps h3{ font-family:var(--f-d); font-weight:700; font-size:14px; text-transform:uppercase; }
.steps p{ margin-top:4px; font-size:14px; color:var(--text-2); }

/* ---------- preguntas ---------- */
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{ display:flex; justify-content:space-between; gap:14px; padding:18px 0; cursor:pointer; list-style:none; font-family:var(--f-d); font-weight:700; font-size:14.5px; line-height:1.35; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; flex:none; font-family:var(--f-m); font-weight:800; color:var(--red); font-size:18px; line-height:1; }
.faq details[open] summary::after{ content:"–"; }
.faq details p{ padding:0 0 18px; color:var(--text-2); font-size:14.5px; }

/* ==========================================================
   PÁGINAS INTERIORES
   ========================================================== */
.phero{ padding:30px 0 6px; }
.phero h1{ margin-top:12px; font-family:var(--f-d); font-weight:900; text-transform:uppercase; font-size:clamp(40px, 12vw, 84px); line-height:.95; letter-spacing:-.03em; }
.phero .status{ margin-top:16px; }
.psec{ padding:24px 0 64px; }

/* jornadas */
.days-sum{ margin-bottom:14px; padding:16px; }
.days-sum p{ font-family:var(--f-m); font-size:13px; color:var(--text-2); }
.days-sum p b{ font-size:22px; color:var(--text); }
.days{ display:grid; gap:10px; }
.day{ display:grid; grid-template-columns:118px minmax(0,1fr); gap:14px; align-items:start; padding:10px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); }
.day-media img, .day-media .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; border-radius:3px; }
.day-b{ min-width:0; }
.day-b > small{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.day-b h3{ margin-top:2px; font-family:var(--f-d); font-weight:800; font-size:16px; text-transform:uppercase; line-height:1.1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.day-meta{ display:flex; flex-wrap:wrap; gap:4px 10px; margin-top:6px; font-family:var(--f-m); font-size:11px; color:var(--text-3); }
.day .lc-item{ margin-top:10px; padding:8px 10px; }
.day-live{ display:flex; align-items:center; gap:8px; margin-top:6px; font-family:var(--f-m); font-weight:700; font-size:12px; color:var(--green); text-transform:uppercase; letter-spacing:.1em; }
.day.live{ border-color:rgba(43,214,123,.45); }
.day.locked{ grid-template-columns:44px minmax(0,1fr) auto; align-items:center; padding:12px 14px; opacity:.6; border-style:dashed; }
.day-n{ font-family:var(--f-d); font-weight:900; font-size:24px; color:var(--text-3); }
.day.locked .day-b b{ font-size:13.5px; color:var(--text-2); }
.day.locked > .i{ color:var(--text-3); }

/* dados: planificador */
.plan-grid{ display:grid; gap:12px; margin-top:12px; }
.plan-side{ display:grid; gap:12px; align-content:start; }
.value{ padding:18px; }
.value-sub{ margin-top:8px; font-size:14px; color:var(--text-2); }
.vbars{ display:grid; grid-template-columns:repeat(var(--n,21), minmax(0,1fr)); align-items:end; gap:3px; height:150px; margin-top:16px; }
.vb{ background:rgba(255,255,255,.14); border-radius:2px 2px 0 0; }
.vb.past{ background:rgba(255,255,255,.35); }
.vb.now{ background:var(--red); box-shadow:0 0 12px rgba(255,46,67,.7); }
.vx{ display:flex; justify-content:space-between; margin-top:6px; font-family:var(--f-m); font-size:11px; color:var(--text-3); }
.value-txt{ margin-top:14px; font-size:14.5px; }
.value-txt b{ color:var(--red); font-family:var(--f-m); }
.tips{ display:grid; gap:8px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.tips li{ display:flex; gap:10px; font-size:14px; color:var(--text-2); }
.tips li::before{ content:""; flex:none; width:6px; height:6px; margin-top:8px; background:var(--red); transform:rotate(45deg); }

/* normas */
.rules{ display:grid; gap:10px; }
.art{ padding:20px 18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); }
.art-n{ font-family:var(--f-m); font-weight:800; font-size:13px; color:var(--red); }
.art h2{ margin-top:6px; font-family:var(--f-d); font-weight:800; font-size:20px; text-transform:uppercase; }
.art p{ margin-top:10px; color:var(--text-2); font-size:15px; }
.art-list{ display:grid; gap:8px; margin-top:12px; }
.art-list li{ display:flex; gap:10px; color:var(--text-2); font-size:15px; }
.art-list li::before{ content:""; flex:none; width:6px; height:6px; margin-top:9px; background:var(--red); transform:rotate(45deg); }
.art-list li.warn-li{ padding:8px 10px; border-left:3px solid var(--yellow); background:rgba(255,210,63,.07); color:#FFE79A; }
.art-list li.warn-li::before{ display:none; }

/* ficha de juego */
dialog.sheet{ position:fixed; inset:0; margin:auto 0 0; padding:0; width:100%; max-width:100%; max-height:94dvh; border:0; background:none; color:inherit; overflow:visible; }
dialog.sheet::backdrop{ background:rgba(0,0,0,.78); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.sheet-in{ position:relative; max-height:94dvh; overflow-y:auto; padding:16px 16px calc(20px + env(safe-area-inset-bottom)); background:var(--surface); border-top:3px solid var(--red); animation:menuIn .25s ease; }
.sheet-x{ position:absolute; top:12px; right:12px; z-index:2; width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--line-2); border-radius:3px; background:rgba(8,9,12,.85); cursor:pointer; }
.sheet-x .i{ width:18px; height:18px; }
.sheet-img img, .sheet-img .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; border-radius:3px; }
.sheet h3{ margin-top:14px; font-family:var(--f-d); font-weight:800; font-size:26px; text-transform:uppercase; }
.sheet-tip{ margin-top:8px; color:var(--text-2); font-size:15px; }
.sheet-tip.muted{ color:var(--text-3); }
.sheet .btn{ margin-top:16px; }

/* ---------- pie ---------- */
.ftr{ margin-top:20px; padding:44px 0 calc(40px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:rgba(0,0,0,.35); }
.ftr-in{ display:grid; gap:28px; }
.ftr-about{ margin-top:14px; max-width:52ch; font-size:13.5px; color:var(--text-2); }
.ftr h4{ margin-bottom:12px; font-family:var(--f-m); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-3); }
.ftr-links{ display:grid; grid-template-columns:1fr 1fr; gap:10px 16px; }
.ftr-links a{ font-size:14.5px; color:var(--text-2); }
.ftr-links a:hover{ color:var(--text); }
.ftr-legal{ grid-column:1 / -1; padding-top:18px; border-top:1px solid var(--line); font-size:12px; color:var(--text-3); }

/* ==========================================================
   PANTALLAS MÁS GRANDES
   ========================================================== */
@media (max-width:359px){
  :root{ --gutter:14px; }
  .brand-t b{ font-size:14px; }
  .cu b{ font-size:36px; }
  .tw-main{ grid-template-columns:36px 4px minmax(0,1fr) auto; gap:0 8px; }
  .code-row b{ font-size:28px; }
}
@media (min-width:480px){
  .hdr .lang{ display:flex !important; }
}
@media (min-width:640px){
  :root{ --gutter:24px; }
  .spec{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .rules4{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .ggrid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .tower-tools{ grid-template-columns:auto minmax(0,320px); justify-content:space-between; align-items:center; }
  .tel{ padding-left:56px; }
  .tel-stats{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .day{ grid-template-columns:150px minmax(0,1fr); }
  .games-tools{ grid-template-columns:auto minmax(0,300px); justify-content:space-between; align-items:center; }
  .dice-foot{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .ftr-in{ grid-template-columns:1.5fr 1fr; }
  .sec-head.split{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
  .sec-head.split .more{ margin-top:0; flex:none; }
  .ctas .btn{ flex:0 0 auto; }
}
@media (min-width:900px){
  .sec{ padding:96px 0; }
  .hero{ padding-top:40px; }
  .hero-in{ grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:center; }
  .dial{ display:block; }
  .live{ grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:start; }
  .loot-row{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); margin:0; padding:0; overflow:visible; }
  .lc{ width:auto; max-width:none; }
  .ggrid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .entry{ grid-template-columns:minmax(0,1fr) minmax(0,420px); grid-template-areas:"head pass" "steps pass"; gap:20px 56px; align-items:start; }
  .entry .sec-head{ grid-area:head; }
  .entry .pass{ grid-area:pass; }
  .entry .steps{ grid-area:steps; }
  .rules4{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .plan-grid{ grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); align-items:start; }
  .rules{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  dialog.sheet{ margin:auto; width:min(560px, calc(100% - 48px)); }
  .sheet-in{ padding:22px; border:1px solid var(--line-2); border-top:3px solid var(--red); }
}
@media (min-width:1080px){
  :root{ --hdr:68px; }
  .nav{ display:flex !important; gap:2px; margin-right:8px; }
  .nav a{ padding:8px 11px; border-radius:2px; font-family:var(--f-m); font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-2); }
  .nav a:hover{ color:var(--text); }
  .nav a.on{ color:var(--text); box-shadow:inset 0 -2px 0 var(--red); }
  .hdr-cta{ display:inline-flex !important; }
  .menu-btn{ display:none; }
  .menu{ display:none !important; }
  .ggrid{ grid-template-columns:repeat(5, minmax(0,1fr)); }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .dial-arc{ stroke-dasharray:22 528; }
}

/* ==========================================================
   AVATARES, REGALOS Y TIKTOK
   ========================================================== */
.ava{ position:relative; display:inline-grid; place-items:center; flex:none; width:28px; height:28px; border-radius:50%; overflow:hidden; background:var(--surface-2); vertical-align:middle; }
.ava img{ width:100%; height:100%; object-fit:cover; }
.ava.mono{ background:linear-gradient(135deg, hsl(var(--h,350) 55% 34%), hsl(calc(var(--h,350) + 40) 55% 22%)); color:#fff; font-family:var(--f-d); font-weight:800; font-size:11px; letter-spacing:.02em; }
.ava.xs{ width:22px; height:22px; font-size:9px; }
.ava.sm{ width:26px; height:26px; font-size:10px; }
.ava.md{ width:44px; height:44px; font-size:15px; }
.ava.lg{ width:58px; height:58px; font-size:19px; }
.ava.xl{ width:84px; height:84px; font-size:26px; }
.ava.xxl{ width:112px; height:112px; font-size:34px; }
.lc-win .ava{ margin-right:2px; box-shadow:0 0 0 2px var(--gold); }

/* varios ganadores en una jornada: todos con su avatar y su nombre */
.wins{ margin-top:8px; padding:12px 8px 14px; border-radius:var(--r); background:linear-gradient(180deg, rgba(242,193,78,.11), rgba(242,193,78,.02) 70%); border:1px solid rgba(242,193,78,.26); }
.wins-h{ display:flex; align-items:center; gap:7px; min-width:0; font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
.wins-h .i{ width:15px; height:15px; flex:none; }
.wins-h > span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wins-h > span + span{ flex:none; margin-left:auto; font-weight:500; font-size:12px; letter-spacing:0; text-transform:none; color:var(--text-2); }
.wins ul{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:14px 8px; }
.wins li{ flex:0 0 calc((100% - (var(--c, 4) - 1) * 8px) / var(--c, 4)); min-width:0; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.wins li .ava{ box-shadow:0 0 0 2px var(--gold), 0 12px 24px -12px rgba(0,0,0,.95); }
.wins li b{ max-width:100%; font-family:var(--f-b); font-weight:700; font-size:13px; line-height:1.2; letter-spacing:-.01em; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.lc .wins li b{ font-size:12.5px; }
.wins li.mas .ava{ background:var(--surface-2); color:var(--text-2); font-family:var(--f-d); font-weight:800; box-shadow:0 0 0 2px var(--line-2); }
.wins li.mas b{ font-weight:500; color:var(--text-3); }
.wins.uno ul{ margin-top:10px; }

/* ---------- botín: la última jornada en grande ---------- */
.lf{ display:grid; background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--gold); }
.lf-side{ display:grid; align-content:start; min-width:0; }
.lf-media{ position:relative; }
.lf-media img, .lf-media .noimg{ width:100%; aspect-ratio:2.1; object-fit:cover; display:grid; place-items:center; font-size:46px; background:var(--surface-2); }
.lf-media .tagx{ position:absolute; left:12px; top:12px; }
.lf-info{ padding:14px 16px 0; min-width:0; }
.lf-info small{ font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
.lf-info h3{ margin-top:4px; font-family:var(--f-d); font-weight:800; font-size:22px; text-transform:uppercase; line-height:1.05; overflow-wrap:anywhere; }
.lf-main{ display:grid; gap:12px; padding:14px 16px 16px; align-content:start; min-width:0; }
.lf-main .wins, .dd-in .wins{ margin-top:0; }
.lf-main .lc-tt, .dd-in .lc-tt{ margin-top:0; }

/* objetos del botín (uno o varios), con la foto en grande */
.items{ padding:12px 10px 14px; border-radius:var(--r); border:1px solid rgba(242,193,78,.26); background:linear-gradient(180deg, rgba(242,193,78,.08), rgba(242,193,78,.01) 70%); min-width:0; }
.items-h{ display:flex; align-items:center; gap:7px; font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
.items-h .i{ width:15px; height:15px; flex:none; }
/* tamaño fijo y proporcionado: 3 por fila en el móvil, como mucho 108 px (al tocar se ven en grande) */
.items-g{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 10px; }
.items-g li{ flex:1 1 84px; max-width:108px; display:grid; gap:6px; justify-items:center; align-content:start; min-width:0; text-align:center; }
.items-g.n1 li{ max-width:140px; }
.it-img{ position:relative; display:block; width:100%; aspect-ratio:1; padding:0; border:1px solid var(--line-2); border-radius:var(--r); background:radial-gradient(circle at 50% 35%, rgba(255,255,255,.07), transparent 70%), var(--bg-2); overflow:hidden; cursor:zoom-in; }
.it-img img{ width:100%; height:100%; object-fit:cover; transition:transform .25s; }
.it-img:hover img{ transform:scale(1.04); }
.it-img.vacio{ display:grid; place-items:center; cursor:default; color:var(--text-3); }
.it-img.vacio .i{ width:34px; height:34px; }
.it-lupa{ position:absolute; right:4px; bottom:4px; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:rgba(8,9,12,.78); color:#fff; }
.it-lupa .i{ width:12px; height:12px; }
.items-g b{ max-width:100%; font-family:var(--f-b); font-weight:700; font-size:12.5px; line-height:1.25; overflow-wrap:anywhere; }
.it-para{ display:inline-flex; align-items:center; gap:6px; max-width:100%; margin-top:-2px; font-size:12px; color:var(--text-2); }
.it-para span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.items-nota{ margin-top:12px; font-size:13px; color:var(--text-2); text-align:center; }

/* foto de un objeto a pantalla completa */
dialog.zoom{ position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:24px 16px; border:0; background:rgba(5,6,9,.94); color:var(--text); cursor:zoom-out; }
dialog.zoom[open]{ display:grid; place-items:center; }
dialog.zoom::backdrop{ background:rgba(0,0,0,.6); }
.zoom figure{ margin:0; display:grid; gap:14px; justify-items:center; width:min(100%, 620px); }
.zoom img{ width:100%; max-height:76dvh; object-fit:contain; border:1px solid var(--line-2); background:var(--bg-2); }
.zoom figcaption{ font-family:var(--f-d); font-weight:800; font-size:17px; text-transform:uppercase; text-align:center; }
.zoom-x{ position:absolute; top:calc(12px + env(safe-area-inset-top)); right:12px; width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--line-2); background:var(--surface); color:var(--text); cursor:pointer; }

/* jornadas anteriores: carrusel en el móvil, rejilla en el ordenador */
.lm-sec{ margin-top:18px; }
.lm-h{ margin-bottom:10px; font-family:var(--f-m); font-weight:700; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.lm-row{ display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 var(--gutter); scrollbar-width:none; margin:0 calc(var(--gutter) * -1); padding:0 var(--gutter) 4px; }
.lm-row::-webkit-scrollbar{ display:none; }
.lm{ flex:0 0 min(86%, 340px); scroll-snap-align:start; display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; align-items:center; padding:10px; background:var(--surface); border:1px solid var(--line); color:inherit; text-decoration:none; }
.lm:hover{ border-color:var(--line-2); }
.lm-img{ position:relative; display:block; min-width:0; }
.lm-img img, .lm-img .noimg{ width:100%; aspect-ratio:1.3; object-fit:cover; display:grid; place-items:center; font-size:26px; background:var(--surface-2); border-radius:3px; }
.lm-img em{ position:absolute; left:5px; top:5px; padding:1px 6px; background:rgba(8,9,12,.85); font-style:normal; font-family:var(--f-m); font-weight:800; font-size:10.5px; }
.lm-b{ display:grid; gap:6px; min-width:0; }
.lm-b > small{ font-family:var(--f-m); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lm-t{ font-family:var(--f-d); font-weight:800; font-size:15px; text-transform:uppercase; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lm-w{ display:flex; align-items:center; gap:8px; min-width:0; }
.lm-w b{ font-family:var(--f-b); font-weight:700; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pila{ display:inline-flex; flex:none; }
.pila .ava{ box-shadow:0 0 0 2px var(--surface); }
.pila .ava + .ava{ margin-left:-8px; }
.lm-o{ display:flex; align-items:center; gap:5px; min-width:0; }
.lm-o img, .lm-bag{ width:30px; height:30px; flex:none; object-fit:cover; border:1px solid var(--line-2); border-radius:3px; background:var(--bg-2); display:grid; place-items:center; }
.lm-bag .i{ width:15px; height:15px; color:var(--gold); }
.lm-o em{ font-style:normal; font-family:var(--f-m); font-size:11px; color:var(--text-2); }
.lm-o i{ min-width:0; margin-left:3px; font-style:normal; font-size:12.5px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lm-o.pend > .i{ width:16px; height:16px; color:var(--text-3); }
.lm-o.pend i{ color:var(--text-3); }

/* jornadas.html: una fila por jornada que se abre */
.dd{ background:var(--surface); border:1px solid var(--line); }
.dd[open]{ border-color:rgba(242,193,78,.42); }
.dd.live{ border-color:rgba(43,214,123,.45); }
.dd-sum{ display:grid; grid-template-columns:96px minmax(0,1fr) auto; gap:12px; align-items:center; padding:10px; cursor:pointer; list-style:none; }
.dd-sum::-webkit-details-marker{ display:none; }
.dd.live .dd-sum{ grid-template-columns:96px minmax(0,1fr); cursor:default; }
.dd-sum .day-live{ margin-top:0; }
.dd-nota{ font-family:var(--f-m); font-size:11px; color:var(--text-3); }
.dd-chev{ width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line-2); color:var(--text-2); transition:transform .2s; }
.dd-chev .i{ width:16px; height:16px; transform:rotate(90deg); }
.dd[open] .dd-chev{ transform:rotate(180deg); }
.dd-in{ display:grid; gap:12px; padding:0 10px 12px; min-width:0; }
.dd-in > .day-meta{ margin-top:0; padding-top:10px; border-top:1px solid var(--line); }
.dd-prox{ padding:12px 14px; border:1px dashed var(--line-2); }
.dd-prox small{ display:flex; align-items:center; gap:7px; font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); }
.dd-prox small .i{ width:14px; height:14px; }
.dd-prox div{ display:flex; flex-wrap:wrap; gap:5px; margin-top:9px; }
.dd-prox span{ min-width:30px; height:30px; padding:0 6px; display:grid; place-items:center; border:1px solid var(--line); font-family:var(--f-m); font-weight:700; font-size:12px; color:var(--text-3); }

@media (min-width:640px){
  .dd-sum, .dd.live .dd-sum{ grid-template-columns:128px minmax(0,1fr) auto; }
  .dd-in{ padding:0 14px 14px; }
  .dd-in .wins li{ flex-basis:calc((100% - (var(--cw, 4) - 1) * 8px) / var(--cw, 4)); }
  .lm{ grid-template-columns:110px minmax(0,1fr); }
}
@media (min-width:900px){
  .lf{ grid-template-columns:minmax(0,360px) minmax(0,1fr); }
  .lf-side{ border-right:1px solid var(--line); }
  .lf-media img, .lf-media .noimg{ aspect-ratio:1.6; }
  .lf-info{ padding:16px 18px 18px; }
  .lf-main{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:18px; gap:16px; align-items:start; }
  .lf-main .lc-tt{ grid-column:2; }
  .lm-row{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); overflow:visible; margin:0; padding:0; }
  .lm-row .lm:nth-child(n+7){ display:none; }
  .dd-in{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
  .dd-in > .day-meta{ grid-column:1 / -1; }
  .dd-in .lc-tt{ grid-column:2; }
}
.lc-item.foto{ align-items:center; }
.lc-gift{ width:52px; height:52px; flex:none; object-fit:cover; border-radius:3px; background:var(--bg-2); }
.day .lc-gift{ width:44px; height:44px; }
.lc-tt{ display:inline-flex; align-items:center; gap:7px; align-self:flex-start; margin-top:10px; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text); }
.lc-tt .i{ color:var(--red); }
.lc-tt:hover span{ text-decoration:underline; }
.tt-strip{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin:0 0 16px; padding:12px 14px; background:linear-gradient(90deg, rgba(255,46,67,.12), rgba(178,108,255,.06)); border:1px solid rgba(255,46,67,.3); border-radius:var(--r); }
.tt-h{ display:inline-flex; align-items:center; gap:8px; margin-right:auto; font-family:var(--f-m); font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.tt-h .i{ color:var(--red); }
.tt-chip{ display:inline-flex; align-items:center; min-height:36px; padding:0 13px; border-radius:18px; background:var(--text); color:var(--bg); font-family:var(--f-m); font-weight:800; font-size:12.5px; }
.tt-chip:hover{ background:#fff; }
.tel-ava{ display:flex; align-items:center; gap:10px; margin-top:14px; font-family:var(--f-d); font-size:15px; }
.tel-ava .ava{ box-shadow:0 0 0 2px var(--gold); }

/* dados: 5 tarjetas */
.rules5 .rule-ok{ border:2px solid var(--green); padding-top:28px; background:linear-gradient(180deg, rgba(43,214,123,.1), var(--surface) 60%); }
.rules5 .rule-ok .rule-n{ color:var(--green); }
.rules5 .rule-ok .rule-tag{ background:var(--green); color:#03140A; }
.rules5 .rule-ok p b{ color:var(--green); }
.rules5 .rule-ud{ border-color:rgba(178,108,255,.45); }
.rules5 .rule-ud .rule-n{ color:var(--purple); }
.f-keep .f-ico{ border-color:var(--green); color:var(--green); background:rgba(43,214,123,.1); }
.f-keep{ color:var(--text) !important; font-weight:700; }
.art-list li.ok-li{ padding:8px 10px; border-left:3px solid var(--green); background:rgba(43,214,123,.07); color:#B8F5D3; }
.art-list li.ok-li::before{ display:none; }

/* ==========================================================
   SALÓN DE LA FAMA
   ========================================================== */
.kpis{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.kp{ display:flex; flex-direction:column; gap:4px; min-width:0; padding:14px; background:var(--surface); }
.kp .i{ width:18px; height:18px; color:var(--red); }
.kp b{ font-family:var(--f-d); font-weight:800; font-size:26px; line-height:1.05; white-space:nowrap; }
.kp b small{ font-size:14px; color:var(--text-3); }
.kp span{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); line-height:1.3; overflow:hidden; text-overflow:ellipsis; }
.fsec{ margin-top:40px; }
.fsec > .eyebrow{ margin-bottom:14px; }
.fsec > .sub{ margin:-4px 0 16px; }
.fpod{ display:grid; grid-template-columns:1fr 1.15fr 1fr; align-items:end; gap:8px; max-width:640px; margin:0 auto; }
.fpod-c{ display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; padding:0; border:0; background:none; cursor:pointer; text-align:center; }
.fpod-c.empty{ visibility:hidden; }
.fpod-ava{ position:relative; }
.fpod-c .ava{ box-shadow:0 0 0 3px var(--bronze), 0 18px 40px -16px rgba(0,0,0,.9); }
.fpod-c.p2 .ava{ box-shadow:0 0 0 3px var(--silver), 0 18px 40px -16px rgba(0,0,0,.9); }
.fpod-c.p1 .ava{ box-shadow:0 0 0 4px var(--gold), 0 0 50px rgba(242,193,78,.35); }
.fpod-c:not(.p1) .ava.xxl{ width:82px; height:82px; font-size:26px; }
.fpod-c.p1 .fpod-ava::before{ content:""; position:absolute; left:50%; top:-26px; width:34px; height:24px; margin-left:-17px; background:var(--gold); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M1 4l5.5 5L12 0l5.5 9L23 4l-2.5 14h-17z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M1 4l5.5 5L12 0l5.5 9L23 4l-2.5 14h-17z'/%3E%3C/svg%3E") center/contain no-repeat; filter:drop-shadow(0 0 8px rgba(242,193,78,.7)); }
.fpod-c b{ max-width:100%; margin-top:6px; font-family:var(--f-d); font-weight:800; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fpod-c small{ font-family:var(--f-m); font-size:11px; color:var(--text-2); }
.fpod-step{ display:grid; place-items:center; width:100%; margin-top:6px; border-radius:3px 3px 0 0; background:linear-gradient(180deg, var(--surface-2), var(--surface)); border:1px solid var(--line-2); border-bottom:0; }
.fpod-step em{ font-style:normal; font-family:var(--f-d); font-weight:900; font-size:30px; color:var(--text-3); }
.fpod-c.p1 .fpod-step{ height:110px; border-color:rgba(242,193,78,.5); background:linear-gradient(180deg, rgba(242,193,78,.22), var(--surface)); }
.fpod-c.p1 .fpod-step em{ color:var(--gold); font-size:40px; }
.fpod-c.p2 .fpod-step{ height:78px; }
.fpod-c.p3 .fpod-step{ height:58px; }
.fpod.ghost{ opacity:.35; pointer-events:none; }
.fama-empty{ position:relative; margin-top:36px; }
.fama-empty > p{ display:flex; align-items:center; justify-content:center; gap:10px; margin-top:18px; text-align:center; color:var(--text-2); }
.fama-empty > p .i{ color:var(--gold); width:22px; height:22px; }
.champs{ display:grid; gap:10px; }
.champ-c{ display:flex; align-items:center; gap:14px; padding:14px; background:linear-gradient(135deg, rgba(242,193,78,.12), var(--surface) 55%); border:1px solid rgba(242,193,78,.35); border-radius:var(--r); }
.champ-c .ava{ box-shadow:0 0 0 3px var(--gold); }
.champ-c.live{ background:linear-gradient(135deg, rgba(43,214,123,.1), var(--surface) 55%); border-color:rgba(43,214,123,.35); }
.champ-c.live .ava{ box-shadow:0 0 0 3px var(--green); }
.champ-c div{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:0; }
.champ-c b{ font-family:var(--f-d); font-weight:800; font-size:18px; }
.champ-c small{ font-size:12.5px; color:var(--text-2); }
.tagx.gold{ background:var(--gold); color:#1C1400; }
.champ-c.live .tagx{ background:var(--green); color:#03140A; }
.fgrid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
.fc{ position:relative; display:flex; flex-direction:column; align-items:center; gap:8px; min-width:0; padding:18px 10px 14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); cursor:pointer; text-align:center; transition:border-color .15s, transform .15s; }
.fc:hover{ border-color:var(--line-2); transform:translateY(-2px); }
.fc.r1{ border-color:rgba(242,193,78,.6); background:linear-gradient(180deg, rgba(242,193,78,.1), var(--surface) 50%); }
.fc.r2{ border-color:rgba(217,222,231,.4); }
.fc.r3{ border-color:rgba(217,144,87,.45); }
.fc-rank{ position:absolute; left:10px; top:10px; font-family:var(--f-m); font-weight:800; font-size:12px; color:var(--text-3); }
.fc.r1 .fc-rank{ color:var(--gold); }
.fc-ava{ position:relative; }
.fc .ava{ box-shadow:0 0 0 3px var(--line-2); }
.fc.r1 .ava{ box-shadow:0 0 0 3px var(--gold); }
.fc-crown{ position:absolute; right:-4px; top:-4px; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--gold); color:#1C1400; }
.fc-crown .i{ width:16px; height:16px; }
.fc-name{ max-width:100%; font-family:var(--f-d); font-weight:800; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fc-n{ display:flex; align-items:baseline; gap:6px; }
.fc-n b{ font-family:var(--f-d); font-weight:900; font-size:30px; line-height:1; color:var(--gold); }
.fc-n small{ font-family:var(--f-m); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.fc-tit{ display:inline-flex; align-items:center; gap:6px; font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold); }
.fc-tit .i{ width:14px; height:14px; }
.fc-wins{ display:flex; flex-wrap:wrap; justify-content:center; gap:4px; }
.fw{ display:inline-flex; align-items:center; gap:4px; padding:2px 6px; border-radius:2px; background:rgba(255,255,255,.06); font-family:var(--f-m); font-size:10px; color:var(--text-2); white-space:nowrap; }
.fw i{ font-style:normal; font-size:11px; }
.fc-gift{ display:flex; align-items:center; gap:6px; max-width:100%; font-size:12px; color:var(--text-2); }
.fc-gift .i{ width:15px; height:15px; color:var(--gold); }
.fc-gift span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ftl{ display:grid; gap:8px; }
.ftl button{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; width:100%; padding:10px 12px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); cursor:pointer; text-align:left; }
.ftl button:hover{ border-color:var(--line-2); }
.ftl .ava{ box-shadow:0 0 0 2px var(--gold); }
.ftl-b{ display:flex; flex-direction:column; min-width:0; }
.ftl-b small{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ftl-b b{ font-family:var(--f-d); font-weight:800; font-size:14.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ftl-b em{ font-style:normal; font-size:12.5px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ftl-gift{ width:48px; height:48px; border-radius:3px; object-fit:cover; background:var(--bg-2); }
.ftl-gift.none{ display:grid; place-items:center; color:var(--text-3); border:1px dashed var(--line-2); }
.leg-top{ display:flex; align-items:center; gap:16px; padding-right:40px; }
.leg-top .ava{ box-shadow:0 0 0 3px var(--gold); }
.leg-top h3{ margin:0; font-family:var(--f-d); font-weight:800; font-size:22px; text-transform:none; }
.leg-top p{ margin-top:4px; font-family:var(--f-m); font-size:12px; color:var(--gold); }
.leg-pods{ display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.pod{ padding:3px 9px; border-radius:2px; font-family:var(--f-m); font-weight:700; font-size:11px; background:rgba(255,255,255,.07); }
.pod.p1{ background:rgba(242,193,78,.18); color:var(--gold); }
.leg-wins{ display:grid; gap:8px; margin:16px 0; }
.leg-wins li{ display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; padding:8px; background:var(--bg-2); border-radius:3px; }
.leg-img img, .leg-img .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; border-radius:2px; font-size:24px; }
.leg-b{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.leg-b small{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.leg-b b{ font-family:var(--f-d); font-weight:700; font-size:14px; }
.leg-b em{ font-style:normal; font-family:var(--f-m); font-size:11.5px; color:var(--text-2); }
.leg-gift{ display:flex; align-items:center; gap:8px; margin-top:4px; font-size:13px; }
.leg-gift img{ width:30px; height:30px; border-radius:2px; object-fit:cover; }
.leg-gift .i{ color:var(--gold); }
.leg .lc-tt{ margin-top:4px; }
/* adelanto en la portada */
.sec-fama{ background:radial-gradient(600px 300px at 50% 0%, rgba(242,193,78,.08), transparent 70%); }
.ft-row{ display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; margin:0 calc(var(--gutter) * -1); padding:6px var(--gutter); }
.ft-row::-webkit-scrollbar{ display:none; }
.ft{ position:relative; flex:none; display:flex; flex-direction:column; align-items:center; gap:6px; width:88px; padding:0; border:0; background:none; cursor:pointer; }
.ft .ava{ box-shadow:0 0 0 3px var(--line-2); transition:transform .15s; }
.ft:first-child .ava{ box-shadow:0 0 0 3px var(--gold); }
.ft:hover .ava{ transform:scale(1.06); }
.ft b{ max-width:100%; font-family:var(--f-d); font-weight:700; font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ft small{ font-family:var(--f-m); font-weight:800; font-size:12px; color:var(--gold); }
.ft-crown{ position:absolute; top:-6px; right:10px; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:var(--gold); color:#1C1400; }
.ft-crown .i{ width:14px; height:14px; }
.ft-empty{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.ft-empty .ava{ opacity:.35; border:1px dashed var(--line-2); background:none; color:var(--text-3); }
.ft-empty p{ flex-basis:100%; margin-top:6px; color:var(--text-2); font-size:14px; }
.fama-cta{ margin-top:18px; }

/* ==========================================================
   LA TORRE · ANÁLISIS
   ========================================================== */
.an-pulse{ margin-top:18px; }
.an-previa{ display:flex; align-items:center; gap:10px; margin-top:12px; padding:10px 12px; border-left:3px solid var(--purple); background:rgba(178,108,255,.08); font-size:13.5px; color:#D9BCFF; }
.an-previa .i{ color:var(--purple); }
.an-tabs{ position:sticky; top:var(--hdr); z-index:30; display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; margin:22px calc(var(--gutter) * -1) 16px; padding:8px var(--gutter); background:rgba(8,9,12,.92); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.an-tabs::-webkit-scrollbar{ display:none; }
.an-tabs button{ flex:none; display:inline-flex; align-items:center; gap:7px; height:40px; padding:0 13px; border:1px solid var(--line-2); border-radius:3px; background:none; cursor:pointer; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-2); }
.an-tabs button .i{ width:16px; height:16px; }
.an-tabs button[aria-selected="true"]{ background:var(--text); border-color:var(--text); color:var(--bg); }
.an-panel{ animation:menuIn .2s ease; }
.an-panel > .sec-head{ margin-bottom:14px; }
.an-box{ padding:16px; margin-bottom:12px; overflow:hidden; }
.an-box > .lbl{ display:flex; margin-bottom:12px; }
.an-note{ margin-top:10px; font-size:12.5px; color:var(--text-3); }
.an-intro{ margin-bottom:14px; color:var(--text-2); font-size:14.5px; max-width:70ch; }
.an-bar{ display:grid; gap:10px; margin-bottom:12px; }
.an-pick{ position:relative; }
.an-hits{ position:absolute; z-index:25; left:0; right:0; top:calc(100% + 4px); max-height:320px; overflow-y:auto; padding:4px; background:var(--surface-2); border:1px solid var(--line-2); border-radius:3px; box-shadow:0 20px 50px -10px rgba(0,0,0,.8); }
.an-hits button{ display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border:0; border-radius:2px; background:none; cursor:pointer; text-align:left; font-size:14px; }
.an-hits button:hover, .an-hits button:focus-visible{ background:rgba(255,255,255,.06); }
.an-hits button span{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.an-hits small{ font-family:var(--f-m); font-size:11px; color:var(--text-3); }
.an-hits .muted{ padding:10px; font-size:13.5px; color:var(--text-3); }
.quick{ display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
.quick::-webkit-scrollbar{ display:none; }
.quick button{ flex:none; display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 12px 0 6px; border:1px solid var(--line-2); border-radius:19px; background:none; cursor:pointer; font-size:13px; }
.quick button span{ max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.quick small{ font-family:var(--f-m); font-size:10px; color:var(--text-3); text-transform:uppercase; }
.who{ display:inline-flex; align-items:center; gap:9px; min-width:0; max-width:100%; padding:0; border:0; background:none; cursor:pointer; text-align:left; }
.who > span{ display:flex; flex-direction:column; min-width:0; }
.who b{ font-family:var(--f-d); font-weight:700; font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.who small{ font-family:var(--f-m); font-size:10.5px; color:var(--text-3); }
.who:hover b{ text-decoration:underline; text-underline-offset:3px; }

/* gráficas */
.chart{ position:relative; padding:8px 0 0; overflow:hidden; }
.ch{ display:block; max-width:100%; height:auto; overflow:visible; }
.ch-g{ stroke:rgba(255,255,255,.07); stroke-width:1; }
.ch-g.z{ stroke:rgba(255,255,255,.3); }
.ch-t{ fill:var(--text-3); font-family:var(--f-m); font-size:10px; }
.ch-l{ fill:none; stroke-width:2.2; stroke-linejoin:round; stroke-linecap:round; transition:opacity .2s; }
.ch-l.dim, .ch-d.dim, .ch-e.dim{ opacity:.14; }
.ch-l.on{ stroke-width:3.6; }
.ch-e{ font-family:var(--f-m); font-weight:800; font-size:10.5px; }
.ch-cur{ stroke:rgba(255,255,255,.4); stroke-width:1; stroke-dasharray:3 3; }
.ch-hit{ fill:transparent; cursor:crosshair; touch-action:pan-y; }
.ch-b{ fill:rgba(255,255,255,.2); }
.ch-b.s-win{ fill:var(--purple); }
.ch-b.s-top{ fill:var(--green); }
.ch-b.s-mid{ fill:rgba(255,255,255,.55); }
.ch-b.s-low{ fill:rgba(255,255,255,.2); }
.ch-b.ba{ fill:#FF2E43; }
.ch-b.bb{ fill:#4FC3F7; }
.ch-b.bp{ fill:rgba(255,46,67,.75); }
.tip{ position:absolute; top:12px; z-index:5; min-width:170px; max-width:min(260px, 70%); padding:10px 12px; background:rgba(12,14,19,.96); border:1px solid var(--line-2); border-radius:3px; box-shadow:0 18px 40px -12px rgba(0,0,0,.8); pointer-events:none; font-size:12.5px; }
.tip p{ margin-bottom:6px; font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.tip span{ display:flex; align-items:center; gap:7px; padding:1px 0; }
.tip i{ width:8px; height:8px; flex:none; border-radius:50%; }
.tip b{ margin-left:auto; padding-left:10px; font-family:var(--f-m); }
.chips{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.chips .chip{ display:inline-flex; align-items:center; border:1px solid var(--line-2); border-radius:17px; background:var(--surface); }
.chips .chip.on{ border-color:var(--c); box-shadow:0 0 0 1px var(--c) inset; }
.chips .chip button{ display:inline-flex; align-items:center; gap:7px; height:32px; padding:0 4px 0 11px; border:0; background:none; cursor:pointer; font-size:12.5px; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chips .chip button i{ width:9px; height:9px; flex:none; border-radius:50%; background:var(--c); }
.chips .chip .x{ padding:0 9px 0 4px; color:var(--text-3); }
.chips .chip .x .i{ width:13px; height:13px; }
.chip-reset{ height:32px; padding:0 10px; border:0; background:none; cursor:pointer; font-family:var(--f-m); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); text-decoration:underline; text-underline-offset:3px; }

/* tablas */
.tbl-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tbl{ width:100%; border-collapse:collapse; font-size:13px; white-space:nowrap; }
.tbl th{ padding:10px 8px; text-align:right; font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); border-bottom:1px solid var(--line-2); }
.tbl th.sortable{ padding:0; }
.tbl th button{ width:100%; padding:10px 8px; border:0; background:none; cursor:pointer; text-align:inherit; font:inherit; letter-spacing:inherit; text-transform:inherit; color:inherit; white-space:nowrap; }
.tbl th button.on{ color:var(--text); }
.tbl th.l, .tbl td.l, .tbl th.sticky, .tbl td.sticky{ text-align:left; }
.tbl td{ padding:9px 8px; border-bottom:1px solid var(--line); text-align:right; font-variant-numeric:tabular-nums; }
.tbl td.n{ font-family:var(--f-m); }
.tbl tbody tr[data-ver]{ cursor:pointer; }
.tbl tbody tr:hover td{ background:rgba(255,255,255,.03); }
.tbl tr.me td{ background:rgba(242,193,78,.07); }
.tbl tr.off td{ color:var(--text-3); }
.tbl .muted{ color:var(--text-3); }
.sticky{ position:sticky; left:0; z-index:1; background:var(--bg); }
.panel .sticky{ background:var(--surface); }
.tn{ display:inline-flex; align-items:center; gap:8px; max-width:190px; }
.tn b{ font-weight:700; overflow:hidden; text-overflow:ellipsis; }
.nota{ display:inline-grid; place-items:center; min-width:34px; height:24px; padding:0 6px; border-radius:2px; font-weight:800; color:#0B0C10; background:hsl(calc(var(--v) * 1.25) 70% 55%); }
.pu{ display:inline-grid; place-items:center; min-width:30px; height:22px; padding:0 5px; border-radius:2px; font-weight:800; font-size:11.5px; }
.pu.s-win{ color:#fff; } .pu.s-top{ color:#04140B; } .pu.s-mid{ color:#0B0C10; } .pu.s-low{ color:var(--text); }

/* ficha de jugador */
.pl{ display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
.pl-card{ padding:18px; background:linear-gradient(160deg, rgba(255,46,67,.14), var(--surface) 45%); border:1px solid var(--line-2); border-radius:var(--r); }
.pl-top{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:14px; }
.pl-top .ava{ box-shadow:0 0 0 3px var(--red); }
.pl-pos{ font-family:var(--f-m); font-weight:800; font-size:12px; color:var(--red); }
.pl-top h3{ font-family:var(--f-d); font-weight:800; font-size:18px; line-height:1.15; overflow-wrap:anywhere; }
.pl-sub{ margin-top:3px; font-family:var(--f-m); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); }
.pl-ovr{ display:grid; place-items:center; width:62px; height:62px; border-radius:3px; font-family:var(--f-d); font-weight:900; font-size:28px; color:#0B0C10; background:hsl(calc(var(--v) * 1.25) 72% 56%); box-shadow:0 10px 30px -10px hsl(calc(var(--v) * 1.25) 72% 50%); }
.radar{ display:block; max-width:100%; height:auto; margin:10px auto 4px; }
.rd-g{ fill:none; stroke:rgba(255,255,255,.1); }
.rd-t{ fill:var(--text-2); font-family:var(--f-m); font-size:10px; letter-spacing:.04em; text-transform:uppercase; }
.rd-s{ fill-opacity:.2; stroke-width:2; stroke-linejoin:round; }
.pl-at{ display:grid; gap:10px; margin-top:6px; }
.pl-at li{ display:grid; grid-template-columns:94px minmax(0,1fr) 28px; align-items:center; gap:4px 10px; }
.pl-at li > span{ font-family:var(--f-m); font-weight:700; font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.pl-at li > i{ height:6px; border-radius:3px; background:linear-gradient(90deg, var(--red) calc(var(--v) * 1%), rgba(255,255,255,.08) 0); }
.pl-at li > b{ font-family:var(--f-m); font-size:13px; text-align:right; }
.pl-at li > small{ grid-column:1 / -1; font-size:11.5px; color:var(--text-3); line-height:1.35; }
.pl-acc{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.pl-acc .btn[aria-pressed="true"] .i{ color:var(--gold); fill:currentColor; }
.kps{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1px; margin-bottom:12px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.kps > div{ display:flex; flex-direction:column; gap:3px; min-width:0; padding:12px 10px; background:var(--surface); }
.kps b{ font-family:var(--f-m); font-weight:800; font-size:19px; line-height:1.15; white-space:nowrap; }
.kps b em{ font-style:normal; font-size:11px; }
.kps em.up{ color:var(--green); } .kps em.down{ color:var(--down); }
.kps span{ font-family:var(--f-m); font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); line-height:1.3; }
.stack{ display:flex; height:14px; border-radius:2px; overflow:hidden; background:rgba(255,255,255,.06); }
.stack i{ display:block; height:100%; }
.stack-l{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:12.5px; color:var(--text-2); }
.stack-l li{ display:inline-flex; align-items:center; gap:6px; }
.stack-l i{ width:9px; height:9px; border-radius:2px; }
.tp-r{ background:rgba(255,255,255,.6); } .tp-d{ background:var(--red); } .tp-u{ background:var(--purple); }
.tp-p{ background:#4FC3F7; } .tp-c{ background:var(--yellow); } .tp-l{ background:var(--green); } .tp-o{ background:var(--text-3); }
.pm{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.pm > div{ display:flex; flex-direction:column; gap:3px; }
.pm b{ font-family:var(--f-d); font-weight:800; font-size:24px; line-height:1.1; }
.pm span{ font-family:var(--f-m); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.pm i{ height:4px; margin-top:4px; border-radius:2px; background:linear-gradient(90deg, var(--red) calc(var(--v) * 1%), rgba(255,255,255,.08) 0); }
.pm-pos{ margin-top:14px; font-size:14px; color:var(--text-2); }
.pm-pos b{ color:var(--text); font-family:var(--f-m); }
.need{ margin-top:10px; padding:10px 12px; border-left:3px solid var(--yellow); background:rgba(255,210,63,.07); font-size:13.5px; color:#FFE79A; }
.hist{ display:flex; align-items:flex-end; gap:2px; height:80px; margin-top:12px; padding-bottom:16px; }
.hist span{ position:relative; flex:1; height:100%; display:flex; align-items:flex-end; }
.hist i{ display:block; width:100%; background:var(--red); border-radius:1px 1px 0 0; opacity:.85; }
.hist small{ position:absolute; left:50%; bottom:-16px; transform:translateX(-50%); font-family:var(--f-m); font-size:9px; color:var(--text-3); }
.sim-load p{ font-size:13.5px; color:var(--text-2); }
.sim-bar{ height:6px; margin-top:10px; border-radius:3px; background:rgba(255,255,255,.08); overflow:hidden; }
.sim-bar i{ display:block; height:100%; background:var(--red); transition:width .15s; }

/* duelo */
.duel-pick{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:8px; margin-bottom:12px; }
.vs{ font-family:var(--f-d); font-weight:900; font-size:15px; color:var(--red); }
.duel-head{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:8px; padding:16px 10px; margin-bottom:12px; }
.dh{ display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; text-align:center; }
.dh.a .ava{ box-shadow:0 0 0 3px #FF2E43; }
.dh.b .ava{ box-shadow:0 0 0 3px #4FC3F7; }
.dh b{ max-width:100%; font-family:var(--f-d); font-weight:800; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dh small{ font-family:var(--f-m); font-size:10.5px; color:var(--text-3); }
.dh-sc{ display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; }
.dh-sc .lbl{ font-size:9.5px; }
.dh-sc b{ font-family:var(--f-d); font-weight:900; font-size:34px; line-height:1; }
.dh-sc em{ font-style:normal; }
em.a, b.a{ color:#FF2E43; } em.b, b.b{ color:#4FC3F7; }
.dh-sc small{ max-width:120px; font-size:11px; color:var(--text-3); }
.dp{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; }
.dp b{ font-family:var(--f-d); font-weight:800; font-size:20px; }
.dp-bar{ height:12px; border-radius:6px; background:#4FC3F7; overflow:hidden; }
.dp-bar i{ display:block; height:100%; background:#FF2E43; }
.duel-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:0 12px; }
.vsl{ display:grid; gap:10px; }
.vsl li{ display:grid; grid-template-columns:minmax(52px,auto) minmax(0,1fr) auto minmax(0,1fr) minmax(52px,auto); align-items:center; gap:8px; }
.vsl b{ font-family:var(--f-m); font-size:13px; color:var(--text-2); }
.vsl li > b:first-child{ text-align:left; }
.vsl li > b:last-child{ text-align:right; }
.vsl b.win{ color:var(--text); font-weight:800; }
.vsl em{ font-style:normal; font-family:var(--f-m); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); text-align:center; max-width:90px; line-height:1.2; }
.vb-a, .vb-b{ display:flex; height:6px; border-radius:3px; background:rgba(255,255,255,.06); overflow:hidden; }
.vb-a{ justify-content:flex-end; }
.vb-a i{ background:#FF2E43; } .vb-b i{ background:#4FC3F7; }
.dl{ display:grid; gap:4px; max-height:420px; overflow-y:auto; }
.dl li{ display:grid; grid-template-columns:52px minmax(0,1fr) 52px; align-items:center; gap:8px; padding:7px 10px; border-radius:2px; background:var(--bg-2); font-size:13px; }
.dl li.muted{ display:block; color:var(--text-3); }
.dl-a, .dl-b{ font-family:var(--f-m); font-weight:700; color:var(--text-3); }
.dl-b{ text-align:right; }
.dl-d{ text-align:center; font-size:12px; color:var(--text-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dl li.a .dl-a{ color:#FF2E43; } .dl li.b .dl-b{ color:#4FC3F7; }
.dl li.a{ box-shadow:inset 3px 0 0 #FF2E43; } .dl li.b{ box-shadow:inset -3px 0 0 #4FC3F7; }

/* predicción */
.pred-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:0 12px; }
.fav{ display:grid; gap:10px; }
.fav li{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 48px; align-items:center; gap:10px; }
.fav-bar{ height:8px; border-radius:4px; background:rgba(255,255,255,.06); overflow:hidden; }
.fav-bar i{ display:block; height:100%; background:linear-gradient(90deg, var(--red), var(--gold)); border-radius:4px; }
.fav li > b{ font-family:var(--f-m); font-weight:800; text-align:right; }
.cortes{ display:grid; gap:12px; align-content:start; }
.cortes > div{ display:flex; flex-direction:column; gap:2px; }
.cortes b{ font-family:var(--f-d); font-weight:800; font-size:28px; line-height:1.1; }
.cortes span{ font-size:13px; color:var(--text-2); }
.pred-me{ margin-bottom:12px; }
.an-how{ margin-top:6px; border-top:1px solid var(--line); }
.an-how summary{ padding:14px 0; cursor:pointer; font-family:var(--f-m); font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-2); }
.an-how p{ margin-bottom:10px; font-size:13.5px; color:var(--text-2); max-width:75ch; }

/* récords y mapa */
.rec-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.rec{ position:relative; display:flex; flex-direction:column; gap:8px; min-width:0; padding:14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); }
.rec-i{ width:34px; height:34px; display:grid; place-items:center; border-radius:3px; background:var(--red-soft); color:var(--red); }
.rec-i .i{ width:18px; height:18px; }
.rec .lbl{ color:var(--text-2); font-size:10.5px; }
.rec-v{ font-size:12.5px; color:var(--text-2); line-height:1.4; }
.rec-big{ font-family:var(--f-d); font-weight:900; font-size:30px; line-height:1; }
.heat{ border-collapse:separate; border-spacing:2px; font-family:var(--f-m); font-size:10.5px; }
.heat th{ padding:2px; font-weight:700; color:var(--text-3); text-align:center; }
.heat thead th span{ display:block; font-size:12px; }
.heat td{ min-width:30px; height:26px; text-align:center; border-radius:2px; font-weight:700; }
.heat td.s-win{ color:#fff; } .heat td.s-top{ color:#04140B; }
.heat td.s-mid{ background:rgba(255,255,255,.2); color:var(--text); }
.heat td.s-low{ background:rgba(255,255,255,.07); color:var(--text-3); }
.heat td.s-no{ box-shadow:none; background:transparent; }
.heat tbody tr{ cursor:pointer; }
.heat tbody th.sticky{ text-align:left; padding-right:8px; background:var(--surface); }
.heat .tn{ gap:6px; max-width:none; color:var(--text); }
.heat .tn em{ font-style:normal; min-width:18px; color:var(--text-3); }
.heat .tn small{ display:none; font-family:var(--f-b); font-size:12px; color:var(--text-2); max-width:130px; overflow:hidden; text-overflow:ellipsis; }
.heat tr.me th.sticky{ color:var(--gold); }
.heat tr:hover td{ outline:1px solid rgba(255,255,255,.25); }
.an-empty{ margin-top:18px; }

@media (min-width:640px){
  .kpis{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .an-pulse .kpis{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .fgrid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .champs{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .rules5{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .rules5 .rule:last-child{ grid-column:1 / -1; }
  .an-bar{ grid-template-columns:minmax(0,320px) minmax(0,1fr); align-items:center; }
  .rec-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .heat .tn small{ display:inline; }
}
@media (min-width:900px){
  .rules5{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .rules5 .rule{ grid-column:span 2; }
  .rules5 .rule:nth-child(n+4){ grid-column:span 3; }
  .an-pulse .kpis{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .fgrid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .pl{ grid-template-columns:340px minmax(0,1fr); align-items:start; }
  .pl-card{ position:sticky; top:calc(var(--hdr) + 70px); }
  .duel-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); }
  .pred-grid{ grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); }
  .rec-grid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
}
.tower-cta{ margin-top:16px; max-width:100%; white-space:normal; line-height:1.2; text-align:center; padding-top:10px; padding-bottom:10px; }
.tower-cta span{ min-width:0; }

/* ==========================================================
   SALÓN DE LA FAMA · campeones de temporada
   ========================================================== */
.rey{ position:relative; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:18px; width:100%; padding:22px 18px; overflow:hidden; text-align:left; cursor:pointer;
  background:radial-gradient(420px 220px at 0% 0%, rgba(242,193,78,.28), transparent 70%), linear-gradient(135deg, #1A160B, var(--surface) 60%);
  border:1px solid rgba(242,193,78,.55); border-radius:var(--r); box-shadow:0 30px 70px -40px rgba(242,193,78,.6); }
.rey::after{ content:""; position:absolute; right:-40px; bottom:-60px; width:220px; height:220px; opacity:.06; background:var(--gold);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M1 4l5.5 5L12 0l5.5 9L23 4l-2.5 14h-17z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M1 4l5.5 5L12 0l5.5 9L23 4l-2.5 14h-17z'/%3E%3C/svg%3E") center/contain no-repeat; pointer-events:none; }
.rey-ava{ position:relative; }
.rey-ava .ava{ box-shadow:0 0 0 4px var(--gold), 0 0 60px rgba(242,193,78,.45); }
.rey-crown{ position:absolute; left:50%; top:-20px; transform:translateX(-50%); color:var(--gold); filter:drop-shadow(0 0 8px rgba(242,193,78,.8)); }
.rey-crown .i{ width:34px; height:34px; fill:var(--gold); }
.rey-b{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:flex-start; gap:6px; min-width:0; }
.rey-b > b{ max-width:100%; font-family:var(--f-d); font-weight:900; font-size:clamp(22px, 6vw, 36px); line-height:1.05; overflow-wrap:anywhere; }
.rey-n{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; }
.rey-n em{ font-style:normal; font-family:var(--f-d); font-weight:900; font-size:clamp(34px, 9vw, 54px); line-height:1; color:var(--gold); }
.rey-n small{ font-family:var(--f-m); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-2); }
.rey-txt{ font-size:13.5px; color:#F7DC9A; }
.rey-vivo{ display:flex; align-items:flex-start; gap:8px; margin-top:4px; padding:8px 10px; border-left:3px solid var(--green); background:rgba(43,214,123,.09); font-size:13.5px; font-weight:700; color:#B8F5D3; }
.rey-vivo .i{ width:17px; height:17px; flex:none; margin-top:1px; color:var(--green); }
.rey-vivo.off{ border-color:var(--line-2); background:rgba(255,255,255,.04); color:var(--text-2); font-weight:500; }
.rey-vivo.off .i{ color:var(--text-3); }
.vivo{ padding:16px; border-color:rgba(43,214,123,.35); }
.vivo-t{ font-size:13.5px; color:var(--text-2); }
.vivo-l{ display:grid; gap:8px; margin:12px 0 14px; }
.vivo-l li{ display:grid; grid-template-columns:22px auto minmax(0,1fr); align-items:center; gap:10px; padding:8px 10px; background:var(--bg-2); border-radius:3px; }
.vivo-l em{ font-style:normal; font-family:var(--f-d); font-weight:900; font-size:18px; color:var(--text-3); text-align:center; }
.vivo-l li.p1 em{ color:var(--gold); } .vivo-l li.p2 em{ color:var(--silver); } .vivo-l li.p3 em{ color:var(--bronze); }
.vivo-l li.p1 .ava{ box-shadow:0 0 0 2px var(--gold); }
.vivo-l span{ display:flex; flex-direction:column; min-width:0; }
.vivo-l b{ font-family:var(--f-d); font-weight:800; font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vivo-l small{ font-family:var(--f-m); font-size:11px; color:var(--text-2); }
.fc .fc-crown .i{ fill:currentColor; }
.fw.gold{ background:rgba(242,193,78,.16); color:var(--gold); font-weight:700; }
.fw .i{ width:11px; height:11px; }
.ftl-s{ display:flex; flex-direction:column; align-items:center; min-width:46px; }
.ftl-s small{ font-family:var(--f-m); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); }
.ftl-s b{ font-family:var(--f-d); font-weight:900; font-size:24px; line-height:1; color:var(--gold); }
.ftl button{ grid-template-columns:auto auto minmax(0,1fr); }
.ftl-b small{ display:flex; align-items:center; gap:6px; }
.ftl-b small .i{ width:12px; height:12px; color:var(--gold); }
.pal{ grid-template-columns:44px minmax(0,1fr) !important; align-items:center; }
.pal-pos{ display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.06); font-family:var(--f-d); font-weight:900; font-size:15px; color:var(--text-2); }
.pal.p1 .pal-pos{ background:rgba(242,193,78,.18); color:var(--gold); }
.pal.vivo .pal-pos{ background:rgba(43,214,123,.14); color:var(--green); }
.pal-pos .i{ width:20px; height:20px; }
.ft small{ display:inline-flex; align-items:center; gap:3px; }
.ft small .i{ width:12px; height:12px; }
.ft-vivo{ display:flex; align-items:center; gap:8px; margin-top:14px; font-size:14px; font-weight:700; color:#B8F5D3; }
.ft-vivo .i{ width:18px; height:18px; flex:none; color:var(--green); }
.tw-crown{ display:inline-flex; align-items:center; gap:1px; flex:none; color:var(--gold); }
.tw-crown .i{ width:14px; height:14px; fill:currentColor; }
.tw-crown small{ font-family:var(--f-m); font-weight:800; font-size:10px; }
.pl-tit{ display:flex; align-items:center; gap:6px; margin-top:6px; font-family:var(--f-m); font-weight:700; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold); }
.pl-tit .i{ width:15px; height:15px; fill:currentColor; }
@media (min-width:640px){
  .rey{ gap:28px; padding:30px 28px; }
}
.vivo-l .ava{ display:inline-grid; flex-direction:row; }

/* ==========================================================
   PON TU AVATAR (avatar.html) y recorte de fotos
   ========================================================== */
.avp-card{ padding:18px; margin-bottom:12px; }
.avp-card.dim{ opacity:.45; }
.avp-paso{ display:flex; align-items:center; gap:10px; margin-bottom:14px; font-family:var(--f-d); font-weight:800; font-size:15px; text-transform:uppercase; }
.avp-paso b{ display:grid; place-items:center; width:28px; height:28px; flex:none; border-radius:50%; background:var(--surface-2); border:1px solid var(--line-2); font-family:var(--f-m); font-size:13px; color:var(--text-2); }
.avp-paso.on b{ background:var(--red); border-color:var(--red); color:#fff; }
.avp-card:not(.dim) .avp-paso:not(.on){ margin-bottom:10px; color:var(--text-2); }
.avp-hint{ margin-top:12px; font-size:13.5px; color:var(--text-3); }
.avp-hits{ display:grid; gap:4px; margin-top:10px; }
.avp-hits button{ display:flex; align-items:center; gap:10px; width:100%; min-height:52px; padding:8px 12px; border:1px solid var(--line); border-radius:3px; background:var(--bg-2); cursor:pointer; text-align:left; font-size:15px; }
.avp-hits button:hover{ border-color:var(--line-2); }
.avp-hits button > span:not(.ava){ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:700; }
.avp-hits small{ flex:none; font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--green); }
.avp-hits small.pend{ color:var(--yellow); }
.avp-hits .i{ color:var(--text-3); }
.avp-yo{ display:flex; align-items:center; gap:12px; }
.avp-yo b{ flex:1; min-width:0; font-family:var(--f-d); font-weight:800; font-size:17px; overflow-wrap:anywhere; }
.avp-link{ flex:none; padding:6px 0; border:0; background:none; cursor:pointer; font-family:var(--f-m); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-2); text-decoration:underline; text-underline-offset:3px; }
.avp-nota{ display:flex; align-items:flex-start; gap:8px; margin-bottom:12px; padding:10px 12px; border-left:3px solid var(--yellow); background:rgba(255,210,63,.07); font-size:13.5px; color:#FFE79A; }
.avp-nota .i{ flex:none; margin-top:2px; width:16px; height:16px; }
.avp-reglas{ display:grid; gap:8px; margin-bottom:16px; }
.avp-reglas li{ display:flex; align-items:flex-start; gap:9px; font-size:14px; color:var(--text-2); }
.avp-reglas .i{ flex:none; margin-top:2px; width:17px; height:17px; }
.avp-reglas .si .i{ color:var(--green); } .avp-reglas .no .i{ color:var(--red); } .avp-reglas .ia .i{ color:var(--purple); }
.avp-foto{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin:6px 0 16px; }
.avp-prev{ width:112px; height:112px; flex:none; display:grid; place-items:center; overflow:hidden; border-radius:50%; background:var(--surface-2); box-shadow:0 0 0 3px var(--gold); }
.avp-prev img{ width:100%; height:100%; object-fit:cover; }
.avp-prev.vacia{ box-shadow:0 0 0 2px var(--line-2) inset; color:var(--text-3); }
.avp-prev.vacia .i{ width:38px; height:38px; }
.avp-check{ display:flex; align-items:flex-start; gap:10px; margin-bottom:14px; font-size:14.5px; cursor:pointer; }
.avp-check input{ width:20px; height:20px; margin:1px 0 0; flex:none; accent-color:var(--red); }
.avp-aviso{ display:flex; align-items:center; gap:10px; margin-bottom:12px; padding:12px 14px; border-left:3px solid var(--purple); background:rgba(178,108,255,.08); font-size:14px; color:#D9BCFF; }
.avp-aviso.err{ border-color:var(--red); background:var(--red-soft); color:#FF9AA5; }
.avp-aviso .i{ flex:none; }
.avp-res{ display:flex; flex-direction:column; align-items:center; gap:12px; padding:30px 18px; text-align:center; }
.avp-res h3{ font-family:var(--f-d); font-weight:800; font-size:22px; text-transform:uppercase; }
.avp-res p{ max-width:44ch; color:var(--text-2); }
.avp-res .avp-sub{ font-size:13.5px; color:var(--text-3); }
.avp-res.ok{ border-color:rgba(43,214,123,.45); }
.avp-res.no{ border-color:rgba(255,46,67,.45); }
.avp-res.rev{ border-color:rgba(255,210,63,.4); }
.avp-big .ava{ box-shadow:0 0 0 4px var(--gold), 0 0 50px rgba(242,193,78,.35); }
.avp-ico{ display:grid; place-items:center; width:72px; height:72px; border-radius:50%; background:rgba(255,210,63,.12); color:var(--yellow); }
.avp-res.no .avp-ico{ background:var(--red-soft); color:var(--red); }
.avp-ico .i{ width:34px; height:34px; }
.avp-acc{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:6px; }
.avp-spin{ width:48px; height:48px; border-radius:50%; border:4px solid rgba(255,255,255,.12); border-top-color:var(--red); animation:avGira .8s linear infinite; }
@keyframes avGira{ to{ transform:rotate(360deg); } }
.fama-av{ margin-top:18px; }
.ft-cta{ margin-top:16px; }
/* hoja de recorte */
.crop-in h3{ margin:0 44px 0 0; font-family:var(--f-d); font-weight:800; font-size:20px; text-transform:uppercase; }
.crop-ayuda{ margin:6px 0 14px; font-size:13.5px; color:var(--text-2); }
.crop-view{ position:relative; width:min(100%, 360px); aspect-ratio:1; margin:0 auto; overflow:hidden; border-radius:var(--r); background:#000; touch-action:none; cursor:grab; }
.crop-view canvas{ position:absolute; inset:0; width:100%; height:100%; }
.crop-mask{ position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.25); }
.crop-view.circ .crop-mask{ background:radial-gradient(circle at center, transparent 49.6%, rgba(0,0,0,.6) 50%); }
.crop-zoom{ display:flex; align-items:center; gap:12px; margin-top:14px; font-family:var(--f-m); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-3); }
.crop-zoom input{ flex:1; height:32px; accent-color:var(--red); }
.crop-fit{ display:flex; justify-content:center; gap:8px; margin-top:8px; }
.crop-acc{ display:flex; gap:8px; margin-top:16px; }
.crop-acc .btn{ flex:1; }

/* ==========================================================
   PÁGINA DE JUEGOS
   ========================================================== */
.jhero{ position:relative; overflow:hidden; padding:34px 0 30px; border-bottom:1px solid var(--line); }
.jmosaico{ position:absolute; inset:-40px -10%; display:flex; flex-direction:column; justify-content:center; gap:10px; opacity:.2; transform:rotate(-7deg); pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 45%, #000 100%); mask-image:linear-gradient(90deg, transparent 0%, #000 45%, #000 100%); }
.jm-fila{ display:flex; gap:10px; width:max-content; animation:ticker 90s linear infinite; }
.jm-fila:nth-child(2){ animation-direction:reverse; animation-duration:110s; margin-left:-90px; }
.jm-fila img{ width:180px; height:113px; flex:none; object-fit:cover; border-radius:3px; filter:grayscale(.3); }
.jhero::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(90deg, var(--bg) 0%, rgba(8,9,12,.92) 40%, rgba(8,9,12,.55) 100%), linear-gradient(0deg, var(--bg), transparent 40%); }
.jhero-in{ position:relative; z-index:1; }
.jh{ display:flex; flex-direction:column; margin-top:10px; font-family:var(--f-d); text-transform:uppercase; line-height:.86; }
.jh b{ font-weight:900; font-size:clamp(108px, 34vw, 210px); letter-spacing:-.05em; color:transparent; -webkit-text-stroke:2px var(--text); text-shadow:0 0 60px rgba(255,46,67,.25); }
.jh span{ margin-top:10px; font-family:var(--f-m); font-weight:800; font-size:clamp(13px, 3.8vw, 18px); letter-spacing:.42em; color:var(--red); }
.jhero .sub{ margin-top:16px; }
.jstats{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); margin-top:26px; border-top:1px solid var(--line-2); border-left:1px solid var(--line-2); background:rgba(8,9,12,.6); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.jstats li{ display:flex; flex-direction:column; gap:5px; padding:14px; border-right:1px solid var(--line-2); border-bottom:1px solid var(--line-2); }
.jstats b{ font-family:var(--f-d); font-weight:800; font-size:30px; line-height:1; }
.jstats li:nth-child(2) b{ color:var(--red); }
.jstats span{ font-size:12.5px; line-height:1.35; color:var(--text-2); }

/* el juego de hoy */
.jhoy{ display:grid; gap:0; overflow:hidden; margin-bottom:14px; border-color:rgba(43,214,123,.45); }
.jhoy-img{ display:block; padding:0; border:0; background:none; cursor:pointer; }
.jhoy-img img, .jhoy-img .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; }
.jhoy-b{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; padding:18px; }
.jhoy-b h2{ font-family:var(--f-d); font-weight:900; font-size:clamp(26px, 7vw, 40px); text-transform:uppercase; line-height:1; }
.jhoy-b p{ color:var(--text-2); font-size:14.5px; max-width:52ch; }
.jhoy .tagx{ display:inline-flex; align-items:center; gap:8px; background:var(--green); color:#03140A; }
.jhoy .led, .jc-sal .led{ width:7px; height:7px; background:currentColor; animation:led 1.6s ease-out infinite; }
.jhoy-acc{ display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }

/* el bombo */
.bombo{ position:relative; display:grid; gap:18px; align-items:center; margin-bottom:28px; padding:20px; overflow:hidden;
  background:radial-gradient(420px 260px at 100% 50%, rgba(255,46,67,.16), transparent 70%), var(--surface); border-color:rgba(255,46,67,.3); }
.bombo h2{ margin-top:10px; font-family:var(--f-d); font-weight:900; font-size:clamp(24px, 6.4vw, 38px); text-transform:uppercase; line-height:1.02; }
.bombo .sub{ margin-bottom:16px; }
.bombo-v{ display:flex; flex-direction:column; align-items:center; gap:12px; }
.bombo-win{ position:relative; display:grid; place-items:center; width:100%; max-width:340px; aspect-ratio:1.6; overflow:hidden; border-radius:var(--r); background:var(--bg-2);
  border:2px solid var(--line-2); box-shadow:inset 0 0 40px rgba(0,0,0,.6); }
.bombo-win img, .bombo-win .noimg{ width:100%; height:100%; object-fit:cover; }
.bombo-win > b{ font-family:var(--f-d); font-weight:900; font-size:72px; color:var(--red); text-shadow:0 0 40px rgba(255,46,67,.6); }
.bombo-win::before, .bombo-win::after{ content:""; position:absolute; left:0; right:0; z-index:1; height:22%; pointer-events:none; }
.bombo-win::before{ top:0; background:linear-gradient(var(--bg), transparent); }
.bombo-win::after{ bottom:0; background:linear-gradient(transparent, var(--bg)); }
.bombo-win.rueda img{ filter:blur(1.5px) saturate(1.2); }
.bombo-win.win{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(242,193,78,.25), 0 0 50px rgba(242,193,78,.35); animation:bomboPop .45s cubic-bezier(.2,1.6,.4,1); }
.bombo-win.win::before, .bombo-win.win::after{ display:none; }
@keyframes bomboPop{ from{ transform:scale(.92); } }
.bombo-res{ display:flex; flex-direction:column; align-items:center; gap:4px; min-height:62px; text-align:center; }
.bombo-res small{ font-family:var(--f-m); font-weight:700; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.bombo-res b{ font-family:var(--f-d); font-weight:800; font-size:22px; text-transform:uppercase; }
.bombo-res .more{ border:0; background:none; cursor:pointer; padding:4px 0; }
.bombo-cd{ margin-top:6px; font-family:var(--f-m); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-2); }
.bombo-cd b{ font-weight:800; font-size:14px; color:var(--text); font-variant-numeric:tabular-nums; }
.bombo-ult{ display:flex; align-items:flex-start; gap:8px; margin:-4px 0 14px; padding:10px 12px; border-left:3px solid var(--line-2); background:rgba(255,255,255,.04); font-size:14px; color:var(--text-2); }
.bombo-ult .i{ flex:none; width:17px; height:17px; margin-top:1px; color:var(--text-3); }
.bombo-ult.ok{ border-color:var(--green); background:rgba(43,214,123,.09); color:#B8F5D3; font-weight:700; }
.bombo-ult.ok .i{ color:var(--green); }
.bombo-cuenta{ margin:-6px 0 14px; font-family:var(--f-m); font-size:11.5px; letter-spacing:.06em; color:var(--gold); }

/* rejilla de juegos */
.jgrid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
.jc{ position:relative; display:flex; flex-direction:column; padding:0; overflow:hidden; text-align:left; cursor:pointer; background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  transition:transform .18s, border-color .18s, box-shadow .18s; }
.jc::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.jc:hover{ transform:translateY(-3px); border-color:rgba(255,46,67,.45); box-shadow:0 18px 40px -22px rgba(255,46,67,.6); }
.jc:hover::after{ transform:scaleX(1); }
.jc-img{ position:relative; display:flex; flex-direction:column; }
.jc-img > img, .jc-img > .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; transition:transform .35s, filter .25s; }
.jc:hover .jc-img > img{ transform:scale(1.05); }
.jc-sh{ position:absolute; left:0; right:0; top:0; aspect-ratio:1.6; background:linear-gradient(180deg, rgba(0,0,0,.45), transparent 35%); pointer-events:none; }
.jc-n{ position:absolute; left:8px; top:8px; padding:2px 7px; transform:skewX(-12deg); background:rgba(8,9,12,.85); border-left:3px solid var(--red); font-family:var(--f-m); font-weight:800; font-size:11px; letter-spacing:.06em; color:var(--text); }
.jc-sal{ position:absolute; right:8px; top:8px; display:inline-flex; align-items:center; gap:5px; padding:3px 8px; border-radius:2px; background:var(--gold); color:#1C1400; font-family:var(--f-m); font-weight:800; font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
.jc-sal .i{ width:12px; height:12px; stroke-width:3; }
.jc.hoy .jc-sal{ background:var(--green); color:#03140A; }
.jc-sal.nuevo{ background:var(--red); color:#fff; transform:skewX(-12deg); }
.jc.hoy{ border-color:rgba(43,214,123,.55); }
.jc.hecho .jc-img > img{ filter:grayscale(.75) brightness(.6); }
.jc.hecho:hover .jc-img > img{ filter:none; }
.jc-b{ display:flex; flex-direction:column; gap:5px; padding:10px 12px 13px; }
.jc-b b{ font-family:var(--f-d); font-weight:800; font-size:13.5px; text-transform:uppercase; line-height:1.15; }
.jc-b small{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.jc-b small.on{ color:var(--red); }
.jc-b small .i{ width:11px; height:11px; }

/* ficha de juego */
.jsheet .sheet-img{ position:relative; }
.jsheet .sheet-img .jc-n{ left:10px; top:10px; font-size:13px; }
.js-k{ margin-top:14px; }
.jsheet h3{ margin-top:8px; }
.js-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.js-chips span{ display:inline-flex; align-items:center; gap:5px; padding:4px 9px; border-radius:2px; background:rgba(255,255,255,.06); font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-2); }
.js-chips span.on{ background:var(--red-soft); color:var(--red); }
.js-chips span.sal{ background:rgba(242,193,78,.16); color:var(--gold); }
.js-chips .i{ width:12px; height:12px; }
.js-sec{ margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.js-sec .sheet-tip{ margin-top:6px; }
.js-torneo p:last-child{ display:flex; align-items:flex-start; gap:8px; margin-top:6px; font-size:14.5px; }
.js-torneo .i{ flex:none; margin-top:2px; color:var(--gold); }
.js-nav{ display:flex; justify-content:space-between; gap:8px; margin-top:14px; }

@media (min-width:640px){
  .jstats{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .jgrid{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; }
  .bombo{ grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); padding:26px; }
}
@media (min-width:900px){
  .jhero{ padding:46px 0 40px; }
  .jgrid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .jhoy{ grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); align-items:center; }
  .jhoy-b{ padding:24px 28px; }
}
@media (min-width:1080px){
  .jgrid{ grid-template-columns:repeat(5, minmax(0,1fr)); }
}
@media (prefers-reduced-motion:reduce){ .jm-fila{ animation:none; } }

/* ============================================================
   HISTÓRICO (historico.js): récords, clasificación de siempre
   y trayectoria de cada jugador
   ============================================================ */
/* récord del grupo en el juego de hoy */
.hrec{ display:flex; align-items:flex-start; gap:8px; margin-top:12px; padding:10px 12px; border:1px solid rgba(242,193,78,.28); border-radius:var(--r); background:rgba(242,193,78,.07); font-size:13.5px; line-height:1.45; color:var(--text-2); }
.hrec .i{ flex:none; width:16px; height:16px; margin-top:1px; color:var(--gold); }
.hrec span{ min-width:0; overflow-wrap:anywhere; }
.hrec.nuevo{ border-color:rgba(178,108,255,.3); background:rgba(178,108,255,.08); }
.hrec.nuevo .i{ color:var(--purple); }
.jhoy-b .hrec{ margin:14px 0 0; max-width:52ch; }
/* ficha de un juego */
.hj-rec{ display:flex; align-items:center; gap:12px; margin-top:8px; }
.hj-rec .ava{ box-shadow:0 0 0 2px var(--gold); }
.hj-rec .ava + .ava{ margin-left:-22px; }
.hj-rec > span{ display:flex; flex-direction:column; min-width:0; }
.hj-rec b{ font-family:var(--f-d); font-weight:800; font-size:20px; line-height:1.15; color:var(--gold); }
.hj-rec small{ font-size:13px; color:var(--text-2); overflow-wrap:anywhere; }
.hj-n{ margin-top:12px; font-size:13px; color:var(--text-3); }
.hj-l{ display:grid; gap:4px; margin-top:8px; }
.hj-l li{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:7px 10px; border-radius:3px; background:rgba(255,255,255,.04); font-size:13.5px; }
.hj-l small{ font-family:var(--f-m); font-size:11px; color:var(--text-3); white-space:nowrap; }
.hj-l b{ font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hj-l em{ font-style:normal; font-family:var(--f-m); font-size:12px; color:var(--text-2); white-space:nowrap; }
.hj-l li.on{ background:rgba(242,193,78,.1); }
.hj-l li.on em{ color:var(--gold); }

/* trayectoria */
.ht-k{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.ht-k span{ display:flex; align-items:baseline; gap:6px; padding:6px 10px; border-radius:3px; background:rgba(255,255,255,.05); }
.ht-k b{ font-family:var(--f-d); font-weight:800; font-size:15px; }
.ht-k small{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); }
.ht{ display:flex; gap:6px; margin-top:14px; overflow-x:auto; scrollbar-width:none; }
.ht li{ flex:1 0 64px; display:flex; flex-direction:column; align-items:center; gap:2px; min-width:64px; text-align:center; }
.ht-bar{ position:relative; display:block; width:100%; height:96px; border-radius:3px; background:rgba(255,255,255,.04); overflow:hidden; }
.ht-bar i{ position:absolute; left:0; right:0; bottom:0; height:max(4px, calc(var(--v) * 100%)); background:linear-gradient(180deg, var(--text-3), rgba(107,115,131,.35)); border-radius:3px 3px 0 0; }
.ht li.t10 .ht-bar i{ background:linear-gradient(180deg, var(--red), rgba(255,46,67,.3)); }
.ht li.p3 .ht-bar i{ background:linear-gradient(180deg, var(--silver), rgba(217,222,231,.3)); }
.ht li.p1 .ht-bar i{ background:linear-gradient(180deg, var(--gold), rgba(242,193,78,.3)); }
.ht li.hv .ht-bar{ outline:1px dashed var(--line-2); outline-offset:-1px; }
.ht li.no .ht-bar i{ display:none; }
.ht li b{ margin-top:6px; font-family:var(--f-d); font-weight:800; font-size:16px; line-height:1.1; }
.ht li.p1 b{ color:var(--gold); }
.ht li.no b{ color:var(--text-3); }
.ht li small{ font-family:var(--f-m); font-weight:700; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-2); }
.ht li.hv small{ color:var(--red); }
.ht li em{ font-style:normal; font-size:11.5px; color:var(--text-3); }
.hoja-tray{ margin-top:18px; }

/* clasificación de siempre */
.hh-tools{ display:grid; gap:10px; margin-bottom:12px; }
.hh-l{ display:grid; gap:6px; }
.hh{ display:grid; grid-template-columns:28px auto minmax(0,1fr) auto; align-items:center; gap:10px; width:100%; padding:9px 12px 9px 8px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); cursor:pointer; text-align:left; }
.hh:hover{ border-color:var(--line-2); }
.hh.me{ border-color:var(--red); }
.hh-pos{ font-style:normal; font-family:var(--f-m); font-weight:800; font-size:13px; text-align:center; color:var(--text-3); }
.hh.r1 .hh-pos{ color:var(--gold); } .hh.r2 .hh-pos{ color:var(--silver); } .hh.r3 .hh-pos{ color:var(--bronze); }
.hh.r1 .ava{ box-shadow:0 0 0 2px var(--gold); }
.hh-b{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.hh-b b{ font-family:var(--f-d); font-weight:800; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hh-t{ display:flex; flex-wrap:wrap; gap:4px; }
.hh-t span{ padding:1px 6px; border-radius:2px; background:rgba(255,255,255,.06); font-family:var(--f-m); font-size:10.5px; color:var(--text-2); white-space:nowrap; }
.hh-t span.p1{ background:rgba(242,193,78,.16); color:var(--gold); }
.hh-t span.p3{ background:rgba(217,222,231,.1); color:var(--silver); }
.hh-t span.hv{ background:var(--red-soft); color:var(--red); }
.hh-v{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; max-width:34vw; }
.hh-v b{ font-family:var(--f-d); font-weight:800; font-size:16px; line-height:1.1; white-space:nowrap; }
.hh-v small{ font-family:var(--f-m); font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-3); line-height:1.3; }

/* récords de cada juego */
.hr-rey{ display:flex; align-items:center; gap:14px; width:100%; margin-bottom:12px; padding:12px 14px; background:var(--surface); border:1px solid rgba(242,193,78,.3); border-radius:var(--r); cursor:pointer; text-align:left; }
.hr-rey .ava{ box-shadow:0 0 0 2px var(--gold); }
.hr-rey > span{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:0; }
.hr-rey b{ font-family:var(--f-d); font-weight:800; font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.hr-rey small{ font-size:13px; color:var(--text-2); }
.hr-g{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.hr{ display:flex; flex-direction:column; min-width:0; padding:0; overflow:hidden; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); cursor:pointer; text-align:left; }
.hr:hover{ border-color:var(--line-2); }
.hr-img{ display:block; background:var(--surface-2); }
.hr-img img, .hr-img .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; }
.hr-img .noimg{ display:grid; place-items:center; font-size:30px; }
.hr-b{ display:flex; flex-direction:column; gap:3px; min-width:0; padding:9px 10px 11px; }
.hr-b > small{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hr-b > b{ font-family:var(--f-d); font-weight:800; font-size:16px; line-height:1.15; color:var(--gold); }
.hr-who{ display:flex; align-items:center; gap:6px; min-width:0; font-size:13px; }
.hr-who > span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hr-b > em{ font-style:normal; font-family:var(--f-m); font-size:10.5px; color:var(--text-3); }
/* cara a cara histórico */
.hd-top{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; margin-top:12px; }
.hd-k{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:12px 8px; border-radius:3px; background:var(--bg-2); text-align:center; }
.hd-k b{ font-family:var(--f-d); font-weight:900; font-size:28px; line-height:1; }
.hd-k em, .hd-l b em{ font-style:normal; }
.hd-k em.a, .hd-l em.a{ color:#FF2E43; }
.hd-k em.b, .hd-l em.b{ color:#4FC3F7; }
.hd-k small{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); line-height:1.3; }
.hd-bar{ display:flex; height:10px; margin-top:12px; border-radius:5px; overflow:hidden; background:var(--bg-2); }
.hd-bar i{ display:block; height:100%; }
.hd-bar i.a{ background:#FF2E43; } .hd-bar i.b{ background:#4FC3F7; } .hd-bar i.e{ background:var(--text-3); }
.hd-l{ display:grid; gap:4px; margin-top:12px; }
.hd-l li{ display:grid; grid-template-columns:minmax(0,1fr) 70px minmax(0,1.3fr); align-items:center; gap:8px; padding:7px 10px; border-radius:2px; background:var(--bg-2); font-size:13px; }
.hd-l li.hd-h{ padding-top:0; padding-bottom:0; background:none; }
.hd-l li.hd-h small{ font-size:9.5px; letter-spacing:.1em; color:var(--text-3); }
.hd-l li > small{ font-family:var(--f-m); font-weight:700; font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-2); }
.hd-l li.hv > small{ color:var(--red); }
.hd-l li > small:nth-child(2), .hd-l li > b{ text-align:center; }
.hd-l li > small:nth-child(3), .hd-g{ text-align:right; }
.hd-l li > b{ font-family:var(--f-d); font-weight:800; font-size:15px; }
.hd-g{ font-family:var(--f-m); font-size:12px; color:var(--text-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hd-g i{ font-style:normal; margin:0 5px; }
.hd-g .win{ font-weight:800; }
.hd-g .a.win{ color:#FF2E43; } .hd-g .b.win{ color:#4FC3F7; }
.hd-g .no{ font-family:var(--f-b); font-size:11.5px; }
@media (min-width:640px){
  .hh-tools{ grid-template-columns:auto minmax(220px, 320px); justify-content:space-between; align-items:center; }
  .hr-g{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
  .hh-v{ max-width:none; }
}
@media (min-width:900px){
  .hr-g{ grid-template-columns:repeat(4, minmax(0,1fr)); }
}


/* ================================================================
   TEMA NUBOT
   ----------------------------------------------------------------
   Estilo de Geometry Dash con la esencia de PlayUs: títulos en
   Titan One (la alternativa libre más parecida a Pusab, la letra
   del juego) con contorno negro, texto en Nunito (redondeada,
   como la app de PlayUs), tarjetas tipo bloque (borde negro
   grueso y sombra abajo), portada como pantalla de título con el
   botón de Play, la torre como una tabla del juego y el fondo con
   pinchos, bloques, sierras, orbes y portales.
   Va al final para mandar sobre lo de arriba.
   ================================================================ */
:root{
  --bg:#13060B; --bg-2:#1B0811; --surface:#241019; --surface-2:#311624; --surface-3:#42203A;
  --line:rgba(255,130,150,.16); --line-2:rgba(255,150,165,.3);
  --text:#FFF6F7; --text-2:#F2C9CF; --text-3:#BE909A;
  --red:#FF2D46; --red-2:#E0142F; --red-soft:rgba(255,45,70,.18);
  --purple:#FF6FD8; --green:#5BEA6A; --yellow:#FFD23F; --orange:#FF9E1F; --down:#FF7A6B; --cyan:#4FE3FF; --blue:#3C8CFF;
  --gold:#FFC93D; --silver:#E6E9F0; --bronze:#E39A5E;
  --f-d:"Titan One","Arial Black",system-ui,sans-serif;
  --f-b:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-m:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:16px;
  --bloque:0 5px 0 rgba(0,0,0,.55);
}
html{ font-synthesis-weight:none; }
body{ background:var(--bg); font-size:15.5px; }
h1,h2,h3{ -webkit-hyphens:manual; hyphens:manual; }
body::before{ background-image:radial-gradient(rgba(255,140,155,.12) 1px, transparent 1.4px); }
body::after{
  background:radial-gradient(600px 440px at 100% 0%, rgba(255,45,70,.22), transparent 70%),
             radial-gradient(640px 460px at 0% 50%, rgba(79,227,255,.05), transparent 70%),
             radial-gradient(760px 520px at 50% 115%, rgba(255,45,70,.14), transparent 70%);
}
/* los objetos de Geometry Dash, muy suaves, detrás de todo */
.gd-fondo{
  position:fixed; inset:-40px; z-index:-1; pointer-events:none; opacity:.075;
  background:url("assets/gd-fondo.svg") 0 0 / 520px 520px repeat;
  animation:gdFondo 120s linear infinite;
}
@keyframes gdFondo{ to{ background-position:-520px 0; } }

/* ---------- letras: sin el aire de "retransmisión" del 1% ---------- */
.eyebrow, .lbl, .kicker, .more, .meta, .fchip, .seg button, .tagx, .status, .legend, .tel-h, .follow-h, .laps-f, .laps-h,
.cu small, .tw-val small, .tw-l2, .tel-stats span, .brand-t small, .menu-lbl, .ftr h4, .gc small, .jc-sal, .js-chips span,
.an-tabs button, .kp span, .leader, .steps li > b, .lang button, .tw-code{ letter-spacing:.03em !important; }
.eyebrow, .lbl{ font-weight:900; font-size:12.5px; }
.eyebrow{ color:var(--yellow); }
.eyebrow::before{ width:10px; height:10px; border-radius:2px; transform:rotate(45deg); background:var(--red); box-shadow:0 0 0 2px #000; }
.lbl{ color:var(--text-3); }
/* títulos como los del juego: blancos con contorno negro */
.h2, .phero h1, .jh, .hero-t, .poll-msg strong, .clock-txt, .pz h3, .dz-c h3, .faq summary, .dc-box b{ font-weight:400; }
.h2{
  font-size:clamp(30px, 8.6vw, 54px); line-height:1.02; letter-spacing:.01em; text-wrap:balance;
  -webkit-text-stroke:.09em #000; paint-order:stroke fill; text-shadow:0 .08em 0 rgba(0,0,0,.6);
}
.phero h1{ font-size:clamp(42px, 12vw, 86px); line-height:.98; -webkit-text-stroke:.08em #000; paint-order:stroke fill; text-shadow:0 .07em 0 rgba(0,0,0,.6); }
.sub{ font-size:16px; }
.tagx{ border-radius:8px; transform:none; border:2px solid #000; font-family:var(--f-d); font-weight:400; font-size:12.5px; letter-spacing:.04em; box-shadow:0 3px 0 rgba(0,0,0,.5); }
/* cabeceras de sección: centradas, con una fila de pinchos debajo */
.sec-head{ text-align:center; margin-bottom:26px; }
.sec-head .eyebrow{ justify-content:center; }
.sec-head .sub{ margin-left:auto; margin-right:auto; }
.sec-head::after{
  content:""; display:block; width:150px; height:16px; margin:16px auto 0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M3 15L15 2l12 13z' fill='%23FF2D46' stroke='%23000' stroke-width='2.4' stroke-linejoin='round'/%3E%3C/svg%3E") 0 0 / 30px 16px repeat-x;
}
.sec-head.split{ display:flex; flex-direction:column; align-items:center; }
.sec-head.split > div{ display:flex; flex-direction:column; align-items:center; }
.sec-head.split .more{ order:3; margin-top:14px; }
.more{ padding:8px 14px; border-radius:12px; border:2px solid #000; background:var(--surface-2); box-shadow:0 3px 0 rgba(0,0,0,.5); font-family:var(--f-d); font-weight:400; font-size:14px; text-transform:uppercase; }
.more .i{ color:var(--yellow); }

/* ---------- botones con relieve, como los del juego ---------- */
.btn{ border-radius:14px; border:2px solid #000; font-family:var(--f-d); font-weight:400; font-size:16px; letter-spacing:.03em; text-shadow:0 2px 0 rgba(0,0,0,.4); }
.btn-red{ background:linear-gradient(180deg, #FF5A6C, var(--red) 52%, #D80F2A); color:#fff; box-shadow:inset 0 2px 0 rgba(255,255,255,.35), 0 5px 0 #000; }
.btn-red:hover{ background:linear-gradient(180deg, #FF6B7B, #FF3851 52%, #E5142F); }
.btn-red:active{ transform:translateY(4px); box-shadow:inset 0 2px 0 rgba(255,255,255,.35), 0 1px 0 #000; }
.btn-ghost{ background:linear-gradient(180deg, #4A2234, #2D121D); color:#fff; box-shadow:inset 0 2px 0 rgba(255,255,255,.12), 0 5px 0 #000; }
.btn-ghost:hover{ border-color:#000; background:linear-gradient(180deg, #5A2A40, #351523); }
.btn-ghost:active{ transform:translateY(4px); box-shadow:0 1px 0 #000; }
.btn-lg{ min-height:58px; font-size:18px; }
.btn-sm{ min-height:42px; border-radius:12px; font-size:13.5px; box-shadow:0 3px 0 #000; }
.btn-verde{ background:linear-gradient(180deg, #8CFF7A, var(--green) 52%, #2FB940); color:#062B0E; text-shadow:0 1px 0 rgba(255,255,255,.4); box-shadow:inset 0 2px 0 rgba(255,255,255,.5), 0 5px 0 #000; }

/* ---------- cabecera ---------- */
.hdr{ background:rgba(19,6,11,.9); border-bottom:3px solid #000; box-shadow:0 2px 0 rgba(255,45,70,.25); }
.brand-logo{ width:44px; height:44px; flex:none; border-radius:12px; object-fit:cover; border:3px solid #000; box-shadow:0 0 0 2px var(--yellow), 0 4px 0 #000; }
.brand-t b{ font-family:var(--f-d); font-weight:400; font-size:23px; letter-spacing:.02em; -webkit-text-stroke:.12em #000; paint-order:stroke fill; }
.brand-t small{ font-weight:900; font-size:11px; color:var(--yellow); }
.menu{ background:rgba(19,6,11,.98); }
.menu nav a{ font-family:var(--f-d); font-weight:400; font-size:26px; -webkit-text-stroke:.08em #000; paint-order:stroke fill; }
.menu nav a::after{ content:"▶"; font-size:14px; color:var(--yellow); }
.menu .js-discord{ margin-bottom:12px; }
.lang{ border:2px solid #000; border-radius:12px; background:var(--surface); }
.lang button{ border-radius:8px; font-weight:900; }
.lang button.on{ background:var(--yellow); color:#2B1700; }
.menu-btn{ border:2px solid #000; border-radius:12px; background:var(--surface-2); box-shadow:0 3px 0 #000; }
@media (min-width:1080px){
  .nav a{ padding:8px 12px; border-radius:12px; font-family:var(--f-d); font-weight:400; font-size:14px; letter-spacing:.02em; }
  .nav a.on{ background:var(--red); color:#fff; box-shadow:0 0 0 2px #000, 0 3px 0 #000; }
}

/* ================================================================
   PORTADA: pantalla de título
   ================================================================ */
.hero{
  padding:22px 0 0; isolation:isolate; text-align:center;
  background:linear-gradient(180deg, #FF6A6F 0%, #F2364B 34%, #C9112E 66%, #6E0619 100%);
  border-bottom:4px solid #000;
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.16;
  background-image:linear-gradient(rgba(255,255,255,.5) 2px, transparent 2px), linear-gradient(90deg, rgba(255,255,255,.5) 2px, transparent 2px);
  background-size:60px 60px;
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 35%, transparent 92%); mask-image:linear-gradient(180deg, transparent, #000 35%, transparent 92%);
}
.hero-fx{ position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:hidden; }
.gd-escena{ position:absolute; left:0; right:0; bottom:56px; width:100%; height:300px; opacity:.55; }
.gd-gira{ transform-box:fill-box; transform-origin:center; animation:gdGira 3s linear infinite; }
@keyframes gdGira{ to{ transform:rotate(360deg); } }
.gd-orbe{ transform-box:fill-box; transform-origin:center; animation:gdOrbe 1.8s ease-in-out infinite; }
.gd-orbe.d2{ animation-delay:-.9s; }
@keyframes gdOrbe{ 50%{ transform:scale(1.14); opacity:.75; } }
.gd-portal{ animation:gdPortal 2.4s ease-in-out infinite; }
@keyframes gdPortal{ 50%{ stroke-opacity:.35; } }
.hero-in{ position:relative; display:flex; flex-direction:column; align-items:center; gap:0; max-width:880px; }
.hero .status{ order:2; margin-top:16px; color:#fff; border:2px solid #000; border-radius:12px; background:rgba(0,0,0,.28); box-shadow:0 3px 0 rgba(0,0,0,.45); }
.hero-logo{ order:1; position:relative; width:136px; aspect-ratio:1; animation:gdFlota 4s ease-in-out infinite; }
.hero-logo img{ position:relative; width:100%; height:100%; object-fit:cover; border-radius:24%; border:4px solid #000; box-shadow:0 0 0 4px var(--yellow), 0 8px 0 #000; }
.hl-aro{ position:absolute; inset:-15%; border-radius:50%; border:3px dashed rgba(255,255,255,.6); animation:gdGira 14s linear infinite; }
@keyframes gdFlota{ 50%{ transform:translateY(-8px) rotate(-2deg); } }
.hero-t{ order:3; display:flex; flex-direction:column; align-items:center; margin-top:14px; line-height:.86; text-transform:uppercase; }
.ht-top{
  font-family:var(--f-d); font-size:clamp(26px, 7.5vw, 46px); letter-spacing:.14em; margin-right:-.14em; color:#fff;
  -webkit-text-stroke:.14em #000; paint-order:stroke fill; text-shadow:0 .1em 0 rgba(0,0,0,.45);
}
/* NUBOT como el logo del juego: degradado amarillo-naranja con contorno negro */
.ht-name{
  position:relative; display:block; white-space:nowrap;
  font-family:var(--f-d); font-size:clamp(70px, 23vw, 200px); line-height:1; letter-spacing:.01em; margin-top:.04em;
  color:#000; -webkit-text-stroke:.16em #000; text-shadow:0 .09em 0 #000, 0 .14em 30px rgba(0,0,0,.35);
}
/* el degradado va encima, en una copia del texto sin contorno */
.ht-name::after{
  content:attr(data-t); position:absolute; inset:0; white-space:nowrap; text-transform:uppercase;
  color:transparent; -webkit-text-stroke:0; text-shadow:none;
  background:linear-gradient(180deg, #FFF59A 0%, #FFE04A 34%, #FFB21E 70%, #FF8A00 100%);
  -webkit-background-clip:text; background-clip:text;
}
.kicker{ order:4; margin-top:16px; padding:6px 14px; border-radius:20px; background:rgba(0,0,0,.25); color:#FFE3E6; font-weight:900; font-size:13px; text-transform:uppercase; }
.lead{ order:5; margin:16px auto 0; color:#FFE9EB; font-size:17px; max-width:52ch; }
.lead b{ color:#fff; }
.ctas{ order:6; display:flex; flex-direction:column; align-items:center; gap:14px; margin-top:22px; width:100%; }
.ctas .btn{ flex:none; }
.hero-me{ order:7; justify-content:center; color:#FFE3E6; }
.hero-me b{ color:#fff; }
/* el botón de Play del menú del juego */
.gd-play{ display:flex; flex-direction:column; align-items:center; gap:10px; text-decoration:none; }
.gd-play-btn{
  position:relative; display:grid; place-items:center; width:118px; height:118px; border-radius:50%;
  background:radial-gradient(circle at 50% 35%, #B4FF9E, var(--green) 55%, #23A733 100%);
  border:5px solid #000; box-shadow:inset 0 -8px 0 rgba(0,0,0,.18), inset 0 5px 0 rgba(255,255,255,.45), 0 7px 0 #000;
  transition:transform .12s;
}
.gd-play-btn::before{ content:""; position:absolute; inset:-14px; border-radius:50%; border:4px solid rgba(255,255,255,.55); animation:gdLatido 1.6s ease-out infinite; }
@keyframes gdLatido{ from{ transform:scale(.88); opacity:1; } to{ transform:scale(1.18); opacity:0; } }
.gd-play-btn svg{ width:50px; height:50px; margin-left:8px; fill:#fff; stroke:#000; stroke-width:2.6; stroke-linejoin:round; filter:drop-shadow(0 3px 0 rgba(0,0,0,.35)); }
.gd-play:hover .gd-play-btn{ transform:scale(1.05); }
.gd-play:active .gd-play-btn{ transform:translateY(4px); box-shadow:inset 0 -8px 0 rgba(0,0,0,.18), inset 0 5px 0 rgba(255,255,255,.45), 0 2px 0 #000; }
.gd-play b{ font-family:var(--f-d); font-weight:400; font-size:21px; color:#fff; -webkit-text-stroke:.12em #000; paint-order:stroke fill; text-shadow:0 3px 0 rgba(0,0,0,.45); }
.hero .btn-ghost{ min-height:46px; font-size:15px; }
/* contadores como los del perfil del juego */
.spec{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; margin:28px auto 0; max-width:880px; border:0; }
.spec li{ display:grid; grid-template-columns:46px minmax(0,1fr); grid-template-rows:auto auto; align-items:center; gap:0 10px; padding:10px 12px; text-align:left;
  border:3px solid #000; border-radius:16px; background:rgba(40,0,10,.5); box-shadow:inset 0 2px 0 rgba(255,255,255,.12), 0 4px 0 #000; }
.sp-i{ grid-row:1 / 3; display:grid; place-items:center; width:46px; height:46px; border-radius:12px; border:2px solid #000; box-shadow:inset 0 -4px 0 rgba(0,0,0,.2); }
.sp-i .i{ width:26px; height:26px; stroke-width:2.4; }
.sp-i.am{ background:var(--yellow); color:#5A3A00; }
.sp-i.ro{ background:#fff; color:var(--red); }
.sp-i.ve{ background:var(--green); color:#063010; }
.sp-i.na{ background:var(--orange); color:#4A2500; }
.spec b{ font-family:var(--f-d); font-weight:400; font-size:28px; line-height:1; color:#fff; -webkit-text-stroke:.1em #000; paint-order:stroke fill; text-shadow:0 3px 0 rgba(0,0,0,.4); }
.spec li > span:last-child{ font-size:12.5px; line-height:1.25; color:#FFD9DE; font-weight:700; }
/* el suelo: rejilla, pinchos que pasan y el cubo saltando */
.gd-suelo{ position:relative; height:56px; margin-top:110px; overflow:visible; border-top:4px solid #000; background:linear-gradient(180deg, #5A0618, #2A020B); }
.gd-suelo::before{ content:""; position:absolute; inset:0; opacity:.35; background-image:linear-gradient(90deg, rgba(255,140,155,.45) 2px, transparent 2px); background-size:56px 100%; animation:gdSuelo 1.2s linear infinite; }
.gd-suelo::after{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:rgba(255,255,255,.6); }
@keyframes gdSuelo{ to{ background-position:-56px 0; } }
.gd-pista{ position:absolute; left:0; right:0; top:-31px; height:31px; }
.gd-pinchos{ position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='31' viewBox='0 0 360 31'%3E%3Cpath d='M165 31l15-29 15 29z' fill='%23110005' stroke='%23fff' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") 114px 0 / 360px 31px repeat-x; animation:gdPinchos 1.2s linear infinite; }
@keyframes gdPinchos{ to{ background-position:-246px 0; } }
.gd-cubo{ position:absolute; left:96px; bottom:100%; width:36px; height:36px; animation:gdSalto 1.2s linear infinite; }
.gd-cubo span{ position:absolute; inset:0; border:3px solid #000; border-radius:4px; background:#FFD23F; box-shadow:inset 0 0 0 5px #FF2D46; }
.gd-cubo span::before{ content:""; position:absolute; left:6px; right:6px; top:9px; height:6px; background:linear-gradient(90deg, #000 0 6px, transparent 6px calc(100% - 6px), #000 calc(100% - 6px)); }
.gd-cubo span::after{ content:""; position:absolute; left:8px; right:8px; bottom:6px; height:4px; background:#000; border-radius:2px; }
@keyframes gdSalto{
  0%, 22%{ transform:translateY(0) rotate(0); animation-timing-function:cubic-bezier(.25,.6,.45,1); }
  50%{ transform:translateY(-66px) rotate(45deg); animation-timing-function:cubic-bezier(.55,0,.75,.4); }
  78%, 100%{ transform:translateY(0) rotate(90deg); }
}

/* ---------- páginas interiores: cabecera centrada como la portada ---------- */
.phero{ text-align:center; padding:34px 0 10px; }
.phero .eyebrow{ justify-content:center; }
.phero .sub{ margin-left:auto; margin-right:auto; }
.phero .status{ margin-left:auto; margin-right:auto; }
.phero .fama-av{ margin-left:auto; margin-right:auto; }
.phero::after{ content:""; display:block; width:150px; height:16px; margin:18px auto 0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M3 15L15 2l12 13z' fill='%23FF2D46' stroke='%23000' stroke-width='2.4' stroke-linejoin='round'/%3E%3C/svg%3E") 0 0 / 30px 16px repeat-x; }
.jhero{ text-align:center; border-bottom:3px solid #000; }
.jhero::after{ background:linear-gradient(0deg, var(--bg), rgba(19,6,11,.78) 45%, rgba(19,6,11,.6)); }
.jh{ align-items:center; }
.jh b{ font-weight:400; color:var(--yellow); -webkit-text-stroke:.07em #000; paint-order:stroke fill; text-shadow:0 .06em 0 #000; letter-spacing:.01em; }
.jh span{ font-weight:900; letter-spacing:.06em; color:#fff; }
.jhero .eyebrow{ justify-content:center; }
.jhero .sub{ margin-left:auto; margin-right:auto; }
.jstats{ gap:10px; border:0; background:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
.jstats li{ align-items:center; text-align:center; border:3px solid #000; border-radius:16px; background:var(--surface); box-shadow:inset 0 2px 0 rgba(255,255,255,.08), 0 4px 0 #000; }
.jstats b{ font-family:var(--f-d); font-weight:400; font-size:30px; line-height:1; color:#fff; -webkit-text-stroke:.09em #000; paint-order:stroke fill; }
.jstats li > span{ font-weight:800; font-size:12.5px; color:var(--text-2); }
.mk-stats{ grid-template-columns:repeat(3, minmax(0,1fr)); }

/* ---------- tarjetas tipo bloque ---------- */
.panel{ background:linear-gradient(180deg, rgba(255,255,255,.05), transparent 55%), var(--surface); border:3px solid #000; border-radius:var(--r); box-shadow:inset 0 0 0 1px var(--line), var(--bloque); }
.sec{ padding:56px 0; }
.sec-dice{ background:linear-gradient(180deg, #1E0811, var(--bg)); border-top:3px solid #000; border-bottom:3px solid #000; }

/* ---------- en directo: como la tarjeta de un nivel ---------- */
#directo > .wrap > .eyebrow{ display:flex; justify-content:center; margin-bottom:16px; }
.tower-cta{ display:flex; width:max-content; max-width:100%; margin:20px auto 0; }
.legend{ justify-content:center; }
.game-hero{ border:3px solid #000; border-radius:var(--r); box-shadow:var(--bloque); }
.game-hero figcaption .tagx{ background:var(--green); color:#062B0E; text-shadow:none; }
.game-hero b{ font-family:var(--f-d); font-weight:400; font-size:30px; -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.game-tip{ font-size:15.5px; }
.live-side{ border-top:3px solid #000; text-align:center; }
.live-side .lbl{ justify-content:center; }
.clock{ justify-content:center; }
.cu b{ font-family:var(--f-d); font-weight:400; font-size:46px; color:#fff; -webkit-text-stroke:.08em #000; paint-order:stroke fill; text-shadow:0 4px 0 rgba(0,0,0,.45); }
.cu small{ font-weight:900; }
.clock .sep{ font-family:var(--f-d); font-weight:400; color:var(--yellow); }
.laps{ border-top:2px dashed var(--line-2); }
.laps-h b{ font-family:var(--f-d); font-weight:400; }
/* la barra de la temporada como la de progreso de un nivel */
.lapbar{ gap:0; height:22px; padding:3px; border:3px solid #000; border-radius:12px; background:#0C0306; box-shadow:inset 0 2px 0 rgba(255,255,255,.08), 0 3px 0 rgba(0,0,0,.5); overflow:hidden; }
.lap{ height:100%; background:transparent; border-radius:0; }
.lap.done{ background:linear-gradient(180deg, #A6FF8F, var(--green) 55%, #2AAE3A); }
.lap.now{ background:linear-gradient(180deg, #FFF080, var(--yellow)); box-shadow:none; animation:gdParpadeo 1.2s ease-in-out infinite; }
.lap:first-child{ border-radius:7px 0 0 7px; }
.lap:last-child{ border-radius:0 7px 7px 0; }
@keyframes gdParpadeo{ 50%{ opacity:.55; } }
.leader{ justify-content:center; border-left:0; border-radius:12px; border:2px solid #000; background:var(--bg-2); }
.mystery-grid{ border:3px solid #000; border-radius:var(--r); }
.mystery-grid > b{ font-family:var(--f-d); font-weight:400; color:var(--yellow); -webkit-text-stroke:.08em #000; paint-order:stroke fill; text-shadow:0 6px 0 #000; }

/* ---------- la torre: tabla de clasificación del juego ---------- */
.tower{ gap:7px; }
.tw{ border:3px solid #000; border-radius:16px; background:linear-gradient(180deg, #3A1424, #261019); box-shadow:inset 0 2px 0 rgba(255,255,255,.07), 0 4px 0 rgba(0,0,0,.6); }
.tw.p1{ background:linear-gradient(180deg, #6B4A07, #3E2A05); }
.tw.p2{ background:linear-gradient(180deg, #4E5566, #2E333F); }
.tw.p3{ background:linear-gradient(180deg, #6A3A1C, #3D210F); }
.tw.me{ box-shadow:0 0 0 3px var(--yellow), 0 4px 0 rgba(0,0,0,.6); }
.tw.open{ background:linear-gradient(180deg, #44182B, #2B111C); }
.tw-main{ grid-template-columns:44px 0 minmax(0,1fr) auto; min-height:62px; gap:0 10px; }
.tw-pos{ background:transparent !important; font-family:var(--f-d); font-weight:400; font-size:22px; color:#fff; -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.tw.p1 .tw-pos{ color:var(--gold); }
.tw.p2 .tw-pos{ color:var(--silver); }
.tw.p3 .tw-pos{ color:#FFB27A; }
.tw-bar{ width:0; margin:0; }
.tw-l1{ align-items:center; }
.tw-l1 .ava{ box-shadow:0 0 0 2px #000; }
.tw-name{ font-weight:900; font-size:15px; color:var(--text); }
.tw-l2{ font-weight:800; }
.tw-val{ flex-direction:row; align-items:center; gap:6px; }
.tw-val b{ font-family:var(--f-d); font-weight:400; font-size:18px; color:#fff; -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.tw-val .i{ width:20px; height:20px; color:var(--cyan); stroke-width:2.2; filter:drop-shadow(0 2px 0 #000); }
.tw-val small{ display:none; }
.tw.p1 .tw-val b{ color:var(--gold); }
.tw-val b.lead{ font-size:14px; color:var(--yellow); }
.tel-stats{ border:2px solid #000; border-radius:12px; overflow:hidden; }
.seg{ border:2px solid #000; border-radius:12px; background:var(--surface); }
.seg button{ border-radius:9px; font-weight:900; }
.seg button[aria-pressed="true"]{ background:var(--yellow); color:#2B1700; }
.find input{ border:2px solid #000; border-radius:14px; background:var(--surface); box-shadow:inset 0 2px 0 rgba(0,0,0,.25); }
.find input:focus{ border-color:var(--yellow); }
.fchip{ border:2px solid #000; border-radius:12px; background:var(--surface); font-weight:900; box-shadow:0 3px 0 #000; }
.fchip[aria-pressed="true"]{ background:var(--yellow); color:#2B1700; border-color:#000; }
.fchip[aria-pressed="true"] b{ color:#5A3A00; }

/* ---------- juegos (tarjetas) ---------- */
.gc-img, .jc-img, .sheet-img img{ border:3px solid #000; border-radius:14px; box-shadow:0 4px 0 #000; }
.gc b, .jc-b b{ font-family:var(--f-d); font-weight:400; letter-spacing:.02em; }
.gc{ position:relative; }
.m1{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:10px; background:#110307; border:2px solid #000; box-shadow:0 0 0 1.5px var(--yellow); color:#fff; font-family:var(--f-d); font-weight:400; font-size:12px; line-height:1.3; white-space:nowrap; }
.m1 small{ font-size:10px; color:var(--yellow); }
.m1 b{ font-weight:400; font-size:13px; }
.m1-dir{ font-style:normal; color:var(--green); }
.m1-dir.menos{ color:var(--cyan); }
.m1-new{ font-style:normal; color:var(--yellow); }
.gc-img, .jc-img, .game-hero{ position:relative; }
.m1.on-img{ position:absolute; right:8px; top:8px; z-index:2; }
.game-hero > .m1.on-img{ top:12px; right:12px; padding:5px 11px; font-size:13px; }
.game-hero > .m1.on-img b{ font-size:15px; }
.m1-blk .m1-big{ display:flex; align-items:center; gap:14px; margin-top:8px; }
.m1-big > b{ font-family:var(--f-d); font-weight:400; font-size:44px; line-height:1; color:var(--yellow); -webkit-text-stroke:.09em #000; paint-order:stroke fill; text-shadow:0 4px 0 #000; }
.m1-big > span{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.m1-big em{ font-style:normal; font-weight:900; font-size:13px; color:var(--green); }
.m1-big em.menos{ color:var(--cyan); }
.m1-big small{ font-size:13px; color:var(--text-3); }
.m1-meta{ display:grid; gap:8px; margin:12px 0; }
.m1-meta > span{ display:grid; grid-template-columns:18px 78px auto minmax(0,1fr); align-items:center; gap:8px; font-size:13.5px; }
.m1-meta .i{ width:16px; height:16px; color:var(--text-3); }
.m1-meta b{ font-weight:900; font-size:11.5px; text-transform:uppercase; color:var(--text-3); }
.m1-meta small{ color:var(--text-2); }
.segs5, .pips5{ display:inline-flex; gap:3px; }
.segs5 i{ width:14px; height:8px; border-radius:3px; background:rgba(255,255,255,.12); border:1px solid rgba(0,0,0,.6); }
.segs5 i.on{ background:var(--cyan); }
.pips5 i{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.12); border:1px solid rgba(0,0,0,.6); }
.pips5 i.on{ background:var(--purple); }
.jhoy-b .m1-blk{ margin-top:14px; padding-top:12px; }
.mk-cta{ display:flex; width:max-content; max-width:100%; margin:22px auto 0; }

/* ---------- encuesta ---------- */
.poll{ padding:16px; border-top:3px solid #000; }
.poll-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; }
.poll-head b{ font-family:var(--f-d); font-weight:400; font-size:18px; text-transform:uppercase; color:var(--yellow); -webkit-text-stroke:.08em #000; paint-order:stroke fill; }
.poll-head b.ok{ color:var(--green); }
.poll-head span{ font-size:13px; font-weight:700; color:var(--text-3); white-space:nowrap; }
.opts{ display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.opt{ display:grid; grid-template-columns:36px auto minmax(0,1fr) auto; align-items:center; gap:10px; width:100%; padding:9px 10px; border:2px solid #000; border-radius:14px; background:var(--surface-2); cursor:pointer; text-align:left; box-shadow:0 3px 0 #000; transition:transform .12s; }
.opt:hover{ background:#3B1A2B; }
.opt:active{ transform:translateY(2px); }
.opt:disabled{ opacity:.6; cursor:wait; }
.opt-rk{ width:36px; height:36px; display:grid; place-items:center; border-radius:10px; border:2px solid #000; background:rgba(255,255,255,.08); font-family:var(--f-d); font-size:17px; color:#fff; }
.opt-rk.m1{ background:linear-gradient(180deg,#FFE9A0,#F2B233); color:#2B1D00; box-shadow:none; padding:0; }
.opt-rk.m2{ background:linear-gradient(180deg,#F7F9FD,#AAB5CA); color:#1A1F2B; }
.opt-rk.m3{ background:linear-gradient(180deg,#FFD0AA,#C97944); color:#2A1406; }
.opt-who{ min-width:0; }
.opt-who b{ display:block; font-weight:900; font-size:15.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.opt-who span{ display:block; margin-top:1px; font-size:12.5px; color:var(--text-3); }
.opt-go{ display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:10px; border:2px solid #000; background:var(--green); color:#062B0E; font-family:var(--f-d); font-size:13px; text-transform:uppercase; white-space:nowrap; }
.opt-go .i{ width:15px; height:15px; }
.opt.is-sel{ box-shadow:0 0 0 3px var(--yellow), 0 3px 0 #000; }
.opt.is-sel .opt-go{ background:var(--yellow); color:#2B1700; }
.opt.is-mine{ box-shadow:0 0 0 3px var(--yellow), 0 3px 0 #000; }
.poll-confirm{ margin:-2px 0 4px; padding:14px; border-radius:14px; border:2px dashed var(--yellow); background:rgba(255,210,63,.07); }
.poll-confirm p{ display:flex; gap:8px; align-items:flex-start; margin-bottom:12px; font-size:14px; color:#FFE3A0; }
.poll-confirm p .i{ width:17px; height:17px; margin-top:1px; color:var(--yellow); }
.poll-search{ margin-top:14px; }
#pollSearchRes .opts{ margin-top:8px; }
.results{ display:grid; gap:8px; }
.res{ position:relative; overflow:hidden; padding:12px 14px; border-radius:14px; border:2px solid #000; background:#0E0306; }
.res-fill{ position:absolute; left:0; top:0; bottom:0; width:0; background:linear-gradient(180deg, #FF6B7B, #C9112E); transition:width 1s cubic-bezier(.2,.8,.2,1); }
.res.lead .res-fill{ background:linear-gradient(180deg, #A6FF8F, #2AAE3A); }
.res.others .res-fill{ background:rgba(255,255,255,.12); }
.res.is-mine{ box-shadow:0 0 0 3px var(--yellow); }
.res-in{ position:relative; display:flex; align-items:center; gap:10px; }
.res-nm{ display:flex; align-items:center; gap:8px; min-width:0; margin-right:auto; }
.res-nm b{ font-weight:900; font-size:15.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 2px 0 rgba(0,0,0,.6); }
.res-tag{ flex:none; padding:1px 7px; border-radius:7px; border:2px solid #000; background:var(--yellow); color:#2B1700; font-weight:900; font-size:10.5px; text-transform:uppercase; }
.res-c{ font-size:12px; font-weight:700; color:var(--text-2); white-space:nowrap; text-shadow:0 1px 0 rgba(0,0,0,.6); }
.res-p{ font-family:var(--f-d); font-weight:400; font-size:24px; min-width:54px; text-align:right; color:#fff; -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.poll-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; padding-top:12px; border-top:2px dashed var(--line-2); font-size:13px; color:var(--text-3); }
.poll-done{ display:inline-flex; align-items:center; gap:7px; font-weight:800; color:var(--text-2); }
.poll-done .i{ width:17px; height:17px; color:var(--green); }
.poll-empty{ padding:18px 10px; text-align:center; font-size:14px; color:var(--text-2); }
.poll-err{ display:flex; gap:8px; align-items:flex-start; margin-top:12px; padding:11px 13px; border-radius:12px; background:rgba(255,107,129,.12); border:2px solid #000; font-size:13.5px; color:#FFC2CC; }
.poll-err .i{ width:17px; height:17px; color:var(--red); margin-top:1px; }
.poll-winner{ display:flex; gap:10px; align-items:flex-start; margin-bottom:12px; padding:12px 14px; border-radius:14px; background:rgba(255,210,63,.1); border:2px solid #000; font-size:14px; color:var(--text-2); }
.poll-winner .i{ width:19px; height:19px; color:var(--yellow); }
.poll-winner b{ color:var(--text); }
.poll-msg{ display:flex; flex-direction:column; align-items:center; text-align:center; padding:24px 10px; }
.poll-msg .ico{ width:62px; height:62px; display:grid; place-items:center; margin-bottom:14px; border-radius:18px; color:#2B1700; background:var(--yellow); border:3px solid #000; box-shadow:0 5px 0 #000; }
.poll-msg .ico .i{ width:30px; height:30px; }
.poll-msg strong{ font-family:var(--f-d); font-size:26px; line-height:1.05; text-transform:uppercase; max-width:22ch; -webkit-text-stroke:.08em #000; paint-order:stroke fill; }
.poll-msg p{ margin-top:8px; font-size:14.5px; color:var(--text-2); max-width:42ch; }
.link-btn{ padding:0; border:0; background:none; cursor:pointer; font:inherit; font-weight:800; font-size:13.5px; color:var(--text-2); text-decoration:underline; text-underline-offset:3px; }
.link-btn:hover{ color:var(--text); }
.h2 em{ font-style:normal; color:var(--yellow); }

/* ---------- premios ---------- */
.pz-grid{ display:grid; gap:16px; }
.pz{ position:relative; overflow:hidden; padding:20px; border-radius:20px; border:3px solid #000; box-shadow:var(--bloque); text-align:center; }
.pz h3{ margin-top:12px; font-family:var(--f-d); font-weight:400; font-size:clamp(30px, 9vw, 44px); line-height:1; -webkit-text-stroke:.08em #000; paint-order:stroke fill; text-shadow:0 4px 0 rgba(0,0,0,.5); }
.pz p{ margin:8px auto 0; font-size:15px; color:var(--text-2); max-width:46ch; }
.pz-k{ display:inline-flex; align-items:center; gap:7px; padding:6px 12px; border-radius:10px; border:2px solid #000; font-family:var(--f-d); font-size:13.5px; text-transform:uppercase; box-shadow:0 3px 0 #000; }
.pz-k .i{ width:16px; height:16px; }
.pz-torneo{ background:radial-gradient(420px 220px at 50% 0%, rgba(255,210,63,.22), transparent 70%), linear-gradient(170deg, #451022, #1E060E); }
.pz-torneo .pz-k{ background:var(--yellow); color:#2B1700; }
.pz-torneo h3{ color:var(--yellow); }
.pz-pod{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); align-items:end; gap:8px; margin-top:20px; }
.pz-pod li{ display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.pz-pod b{ font-family:var(--f-d); font-weight:400; font-size:24px; color:#fff; -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.pz-pod small{ font-weight:900; font-size:11px; text-transform:uppercase; color:var(--text-3); }
.pz-step{ display:grid; place-items:center; width:100%; border:3px solid #000; border-radius:12px 12px 4px 4px; box-shadow:inset 0 3px 0 rgba(255,255,255,.4); }
.pz-step em{ font-style:normal; font-family:var(--f-d); font-size:28px; color:#fff; -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.pz-pod .p1 .pz-step{ height:96px; background:linear-gradient(180deg, #FFE27A, #F2B233); }
.pz-pod .p2 .pz-step{ height:72px; background:linear-gradient(180deg, #F7F9FD, #AAB5CA); }
.pz-pod .p3 .pz-step{ height:56px; background:linear-gradient(180deg, #FFD0AA, #C97944); }
.pz-temp{ background:linear-gradient(170deg, #2C0C18, #170409); }
.pz-temp .pz-k{ background:var(--red); color:#fff; }
.pz-coins{ display:grid; gap:8px; margin-top:20px; text-align:left; }
.pz-coins li{ display:grid; grid-template-columns:46px auto minmax(0,1fr); align-items:center; gap:12px; padding:10px 12px; border-radius:14px; background:rgba(0,0,0,.3); border:2px solid #000; }
.pz-coins .coin{ width:46px; height:46px; display:grid; place-items:center; border-radius:50%; border:3px solid #000; background:radial-gradient(circle at 35% 30%, #FFF1A8, #FFC93D 55%, #D18E00); color:#5A3A00; box-shadow:0 3px 0 #000; }
.pz-coins .coin .i{ width:24px; height:24px; stroke-width:2.2; }
.pz-coins b{ font-family:var(--f-d); font-weight:400; font-size:28px; color:var(--yellow); -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.pz-coins small{ font-weight:700; font-size:12.5px; color:var(--text-2); }
.pz-coins .p2 .coin{ background:radial-gradient(circle at 35% 30%, #fff, #D9DEE7 55%, #8F99AE); color:#2A3040; }
.pz-coins .p3 .coin{ background:radial-gradient(circle at 35% 30%, #FFE0C2, #E39A5E 55%, #9C5A26); color:#3A1A04; }

/* ---------- dados del torneo ---------- */
.dz{ display:grid; gap:14px; }
.dz-c{ position:relative; padding:22px 20px; border-radius:20px; border:3px solid #000; background:linear-gradient(180deg, rgba(255,255,255,.05), transparent), var(--surface); box-shadow:var(--bloque); text-align:center; }
.dz-n{ display:inline-flex; align-items:center; justify-content:center; min-width:70px; height:70px; padding:0 12px; border-radius:16px; border:3px solid #000; background:var(--red); color:#fff; font-family:var(--f-d); font-size:36px; -webkit-text-stroke:.08em #000; paint-order:stroke fill; box-shadow:inset 0 -6px 0 rgba(0,0,0,.25), inset 0 3px 0 rgba(255,255,255,.3), 0 5px 0 #000; }
.dz-ok .dz-n{ background:var(--green); }
.dz-c h3{ margin-top:16px; font-family:var(--f-d); font-weight:400; font-size:22px; text-transform:uppercase; -webkit-text-stroke:.08em #000; paint-order:stroke fill; }
.dz-c p{ margin-top:6px; font-size:15px; color:var(--text-2); }

/* ---------- inscripción: código en grande ---------- */
.entry{ text-align:center; }
.pass{ border:3px solid #000; box-shadow:var(--bloque); }
.code-big{ position:relative; display:flex; flex-direction:column; align-items:center; gap:10px; width:100%; padding:22px 14px 20px; border:3px dashed var(--yellow); border-radius:18px; background:rgba(255,210,63,.06); cursor:pointer; text-align:center; color:inherit; font:inherit; }
.code-big b{ font-family:var(--f-d); font-weight:400; font-size:clamp(56px, 18vw, 86px); line-height:1; letter-spacing:.04em; color:transparent;
  background:linear-gradient(180deg, #FFF59A, #FFE04A 35%, #FFB21E 72%, #FF8A00); -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 0 0 #000) drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(0 5px 0 #000); transition:filter .35s, opacity .35s; }
.code-big:not(.abierto) b{ filter:blur(12px); opacity:.7; }
.cb-hint{ display:inline-flex; align-items:center; gap:6px; padding:7px 14px; border-radius:12px; border:2px solid #000; background:var(--green); color:#062B0E; font-family:var(--f-d); font-size:15px; text-transform:uppercase; box-shadow:0 4px 0 #000; }
.code-big.abierto{ border-style:solid; }
.code-big.abierto .cb-hint{ display:none; }
.code-acc{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; margin-top:16px; }
.steps{ text-align:left; }
.steps li > b{ display:grid; place-items:center; width:44px; height:44px; border-radius:12px; border:2px solid #000; background:var(--red); color:#fff; font-family:var(--f-d); font-weight:400; font-size:18px; box-shadow:0 3px 0 #000; }
.steps h3{ font-family:var(--f-d); font-weight:400; font-size:17px; }
/* barra fija con el código (solo móvil) */
.sticky-cta{ position:fixed; left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom)); z-index:55; display:flex; align-items:center; gap:8px; padding:8px 8px 8px 14px; border-radius:18px; border:3px solid #000; background:rgba(36,12,20,.96); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 5px 0 #000, 0 16px 34px -10px rgba(0,0,0,.8); transform:translateY(160%); transition:transform .3s ease; }
.sticky-cta.on{ transform:none; }
.sc-code{ display:flex; flex-direction:column; min-width:0; margin-right:auto; line-height:1.1; text-align:left; }
.sc-code span{ font-weight:900; font-size:10.5px; text-transform:uppercase; color:var(--text-3); }
.sc-code b{ font-family:var(--f-d); font-weight:400; font-size:23px; letter-spacing:.04em; color:var(--yellow); -webkit-text-stroke:.1em #000; paint-order:stroke fill; }
.sc-copy{ width:46px; height:46px; flex:none; display:grid; place-items:center; border:2px solid #000; border-radius:12px; background:var(--surface-2); color:var(--text); cursor:pointer; box-shadow:0 3px 0 #000; }
.sticky-cta .btn{ min-height:46px; padding:0 18px; }
body.menu-open .sticky-cta{ display:none; }

/* ---------- preguntas frecuentes ---------- */
.faq{ display:grid; gap:10px; }
.faq details{ border:3px solid #000; border-radius:16px; background:var(--surface); box-shadow:0 4px 0 rgba(0,0,0,.55); overflow:hidden; }
.faq summary{ padding:16px 16px; font-family:var(--f-d); font-weight:400; font-size:16.5px; letter-spacing:.01em; }
.faq summary::after{ content:"▼"; font-family:var(--f-b); font-size:13px; color:var(--yellow); transition:transform .2s; }
.faq details[open] summary::after{ content:"▼"; transform:rotate(180deg); }
.faq details p{ padding:0 16px 16px; font-size:15px; }

/* ---------- Discord ---------- */
.dc-box{ display:grid; grid-template-columns:52px minmax(0,1fr); gap:12px 14px; align-items:center; margin-top:28px; padding:16px; border-radius:20px; border:3px solid #000; background:linear-gradient(135deg, #4A52C7, #2E2A78); box-shadow:var(--bloque); text-align:left; }
.dc-ico{ width:52px; height:52px; display:grid; place-items:center; border-radius:16px; background:#5865F2; color:#fff; border:3px solid #000; box-shadow:0 3px 0 #000; }
.dc-ico .i{ width:28px; height:28px; }
.dc-box b{ font-family:var(--f-d); font-weight:400; font-size:20px; -webkit-text-stroke:.08em #000; paint-order:stroke fill; }
.dc-box p{ margin-top:3px; font-size:14.5px; color:#DCDDFB; }
.dc-box .btn{ grid-column:1 / -1; background:linear-gradient(180deg, #fff, #E3E6FF); color:#2E2A78; text-shadow:none; }
.ftr-dc{ margin-top:16px; }

/* ---------- salón de la fama e histórico ---------- */
.kpis{ border:3px solid #000; border-radius:var(--r); box-shadow:var(--bloque); }
.kp b{ font-family:var(--f-d); font-weight:400; -webkit-text-stroke:.07em #000; paint-order:stroke fill; }
.hh{ border:3px solid #000; border-radius:16px; box-shadow:0 4px 0 rgba(0,0,0,.55); }
.hh-b b, .hh-v b, .hr-b > b, .hr-rey b, .ht li b, .ht-k b{ font-family:var(--f-d); font-weight:400; }
.hr, .hr-rey, .dd, .lm{ border:3px solid #000 !important; border-radius:16px; box-shadow:0 4px 0 rgba(0,0,0,.55); }
.hrec{ border:2px solid #000; border-radius:14px; }

/* ---------- marcas del 1% ---------- */
.mk-hero h1{ color:var(--yellow); }
.mk-stats{ margin-top:22px; }
.mk-tools{ display:grid; gap:10px; margin-bottom:12px; }
.mk-ley{ margin-bottom:12px; font-weight:700; font-size:12.5px; color:var(--text-3); }
.mk-l{ display:grid; gap:9px; }
.mk{ display:grid; grid-template-columns:78px minmax(0,1fr) auto; align-items:center; gap:12px; width:100%; padding:8px 12px 8px 8px; border-radius:16px; border:3px solid #000; background:linear-gradient(180deg, #3A1424, #261019); cursor:pointer; text-align:left; box-shadow:0 4px 0 rgba(0,0,0,.6); transition:transform .12s; }
.mk:active{ transform:translateY(2px); }
.mk-l li.flash .mk{ box-shadow:0 0 0 3px var(--yellow), 0 4px 0 rgba(0,0,0,.6); }
.mk-img{ display:block; border-radius:10px; overflow:hidden; border:2px solid #000; background:var(--surface-2); }
.mk-img img, .mk-img .noimg{ width:100%; aspect-ratio:1.6; object-fit:cover; display:block; }
.mk-b{ display:flex; flex-direction:column; gap:5px; min-width:0; }
.mk-n{ display:flex; align-items:center; gap:7px; min-width:0; font-family:var(--f-d); font-weight:400; font-size:17px; line-height:1.1; }
.mk-tag{ flex:none; padding:1px 6px; border-radius:6px; border:1.5px solid #000; background:var(--green); color:#062B0E; font-style:normal; font-family:var(--f-b); font-weight:900; font-size:9.5px; text-transform:uppercase; }
.mk-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; }
.mk-meta > span{ display:inline-flex; align-items:center; gap:5px; }
.mk-meta .i{ width:14px; height:14px; color:var(--text-3); }
.mk-meta em{ font-style:normal; font-weight:900; font-size:11px; color:var(--purple); }
.mk-tt{ font-weight:900; font-size:11px; text-transform:uppercase; color:#FF8D9B; }
.mk-tt .i{ color:#FF8D9B; width:12px; height:12px; }
.mk-rec{ display:flex; align-items:center; gap:5px; min-width:0; font-size:12.5px; color:var(--text-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mk-rec .i{ width:13px; height:13px; color:var(--gold); flex:none; }
.mk-v{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; }
.mk-v b{ font-family:var(--f-d); font-weight:400; font-size:28px; line-height:1; color:var(--yellow); -webkit-text-stroke:.1em #000; paint-order:stroke fill; text-shadow:0 3px 0 #000; white-space:nowrap; }
.mk-v b i{ font-style:normal; font-size:14px; margin-left:3px; vertical-align:top; }
.mk-v small{ margin-top:5px; font-weight:800; font-size:11px; color:var(--text-3); white-space:nowrap; }
.mk-v.nd b{ color:var(--text-3); }

/* ---------- jornadas ---------- */
.lm-o{ font-weight:700; font-size:12.5px; color:var(--text-3); }
.lm-o b{ color:var(--text-2); }

/* ---------- pie ---------- */
.ftr{ border-top:3px solid #000; background:rgba(0,0,0,.4); }

@media (min-width:480px){
  .hero-logo{ width:150px; }
  .mk{ grid-template-columns:112px minmax(0,1fr) auto; }
}
@media (min-width:640px){
  .pz-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .dz{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .spec{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .mk-tools{ grid-template-columns:minmax(220px, 320px) minmax(0,1fr); align-items:center; }
  .mk-tools .mk-orden{ grid-column:2; }
  .dc-box{ grid-template-columns:56px minmax(0,1fr) auto; }
  .dc-box .btn{ grid-column:auto; }
  .ctas{ flex-direction:row; justify-content:center; gap:28px; }
  .gd-cubo{ left:160px; }
  .gd-pinchos{ background-position:178px 0; animation-name:gdPinchosM; }
  @keyframes gdPinchosM{ to{ background-position:-182px 0; } }
}
@media (min-width:900px){
  .hero{ padding-top:30px; }
  .hero-in{ display:flex; grid-template-columns:none; }
  .hero-logo{ width:170px; }
  .ht-name{ font-size:clamp(120px, 15vw, 196px); }
  .gd-escena{ height:78%; }
  .sticky-cta{ display:none; }
  .entry{ text-align:left; }
  .entry .sec-head{ text-align:left; }
  .entry .sec-head .eyebrow{ justify-content:flex-start; }
  .entry .sec-head::after{ margin-left:0; }
}
@media (prefers-reduced-motion:reduce){
  .gd-fondo, .gd-gira, .gd-orbe, .gd-portal, .hero-logo, .hl-aro, .gd-suelo::before, .gd-pinchos, .gd-cubo, .gd-play-btn::before, .lap.now{ animation:none !important; }
}

/* torneo en marcha sin resultados publicados */
.tower-msg.dd-espera{ position:relative; display:flex; flex-direction:column; align-items:center; gap:8px; padding:30px 18px; text-align:center; border:3px solid #000; border-radius:var(--r); background:var(--surface); box-shadow:var(--bloque); }
.tower-msg.dd-espera .i{ width:34px; height:34px; color:var(--yellow); }
.an-empty .an-espera-t{ display:block; margin-bottom:8px; font-family:var(--f-d); font-weight:400; font-size:24px; color:#fff; -webkit-text-stroke:.08em #000; paint-order:stroke fill; }
.an-empty .more{ margin-top:14px; }
.status.is-live .led{ background:var(--green); }