/* =========================================================
   Iberail — sorteo.html v16.6
   Panel de tarjetas en el mismo lenguaje que el «Inicio» de la cuenta (v16.css · .gh-*):
   titulares en Unbounded 800 a tamaño contenido, etiquetas en Geist Mono, cajas de cristal.
   - Intro (.sx-boot): anillo que carga, persiana hacia arriba y las tarjetas entran en cascada (.sx-in).
   - Cuenta atrás (.sx > .sx-hero, cuenta-atras.js): cifras que ruedan, chispas y confeti en canvas.
   - La luz sigue al ratón en cada tarjeta (--px / --py desde sorteo-pagina.js).
   Va después de v16.css en sorteo.html y en el panel (simulador de la cuenta atrás).
   ========================================================= */

/* letras (el panel no carga v16.css) */
@font-face{font-family:'Unbounded';font-style:normal;font-display:swap;font-weight:200 900;src:url(fonts/unbounded-latin-wght-normal.woff2) format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Geist';font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/geist-latin-wght-normal.woff2) format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Geist Mono';font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/geist-mono-latin-wght-normal.woff2) format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212}

.sx-page,.sx,.sx-boot{
  --sx-t1:#F3F5FB; --sx-t2:#B3B9CC; --sx-t3:#80869C; --sx-soft:#DADEEA;
  --sx-disp:'Unbounded','Geist',ui-sans-serif,system-ui,sans-serif;
  --sx-body:'Geist',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --sx-mono:'Geist Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --sx-ease:cubic-bezier(.22,.9,.24,1);
  --sx-warm:linear-gradient(100deg,#FFC23D 0%,#FF7A2E 38%,#FF3D7F 72%,#FF7A2E 100%);
  --sx-spec:linear-gradient(100deg,#FFB81C 0%,#FF5A36 24%,#FF2E88 48%,#8C5CFF 74%,#33E1FF 100%);
  --sx-ig:linear-gradient(110deg,#F9CE34 0%,#EE2A7B 50%,#6228D7 100%);
  --sx-glass:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
}

/* ============ página ============ */
.srt-page.sx-page{position:relative;isolation:isolate;overflow:hidden;background:transparent;padding:calc(74px + clamp(26px,5vh,54px)) 0 clamp(70px,9vw,110px);font-family:var(--sx-body);color:var(--sx-t2)}
.sx-stage{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.sx-stage-a,.sx-stage-b{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.sx-stage-a{width:60vw;height:44vw;left:-14vw;top:-10vw;background:radial-gradient(closest-side,rgba(140,92,255,.55),transparent);animation:sx-drift 18s ease-in-out infinite alternate}
.sx-stage-b{width:50vw;height:40vw;right:-12vw;top:8vw;background:radial-gradient(closest-side,rgba(255,46,136,.4),transparent);animation:sx-drift 22s -6s ease-in-out infinite alternate-reverse}
@keyframes sx-drift{to{transform:translate(6vw,4vw) scale(1.12)}}
.sx-stage-floor{position:absolute;left:-30%;right:-30%;top:0;height:720px;perspective:420px;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%,transparent 95%);mask-image:linear-gradient(180deg,transparent 0,#000 30%,transparent 95%)}
.sx-stage-floor::before{content:"";position:absolute;inset:0;transform:rotateX(64deg) translateY(30%);transform-origin:50% 100%;opacity:.35;
  background-image:linear-gradient(rgba(140,92,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(51,225,255,.35) 1px,transparent 1px);background-size:64px 64px;animation:sx-floor 3s linear infinite}
@keyframes sx-floor{to{background-position:0 64px}}

/* cabecera, como la de «Inicio» */
.sx-head{display:flex;align-items:center;gap:16px}
.sx-head-ic{flex:none;display:grid;place-items:center;width:54px;height:54px;border-radius:17px;border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(150deg,rgba(255,184,28,.28),rgba(255,46,136,.18) 50%,rgba(140,92,255,.22));box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 40px -16px rgba(255,90,54,.7)}
.sx-head-ic svg{width:25px;height:25px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sx-head h1{margin:0;font:800 clamp(1.6rem,3.4vw,2.4rem)/1.08 var(--sx-disp);letter-spacing:-.04em;color:var(--sx-t1)}
.sx-head h1 em,.sx-t em,.sx-h3 em,.sx-me-h em{font-style:normal;color:transparent;background:var(--sx-warm);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:sx-shimmer 8s linear infinite}
@keyframes sx-shimmer{to{background-position:-200% 0}}
.sx-head p{margin:6px 0 0;font-size:clamp(.92rem,1.2vw,1rem);line-height:1.45;color:var(--sx-t2)}

/* rejilla */
.sx-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;margin-top:clamp(20px,3vw,28px);perspective:1400px}
.sx-a{grid-column:span 8}
.sx-me{grid-column:span 4}
.sx-prize{grid-column:span 7}
.sx-nums{grid-column:span 5}
.sx-list{grid-column:span 5}
.sx-x2{grid-column:span 7}
.sx-faq{grid-column:span 8}
.sx-split{grid-column:span 4}

/* tarjeta base + luz que sigue al ratón */
.sx-card{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:14px;padding:clamp(18px,2.2vw,24px);border-radius:24px;
  background:var(--sx-glass);border:1px solid rgba(255,255,255,.1);color:var(--sx-t2);text-decoration:none;transition:border-color .3s,transform .5s var(--sx-ease),box-shadow .4s}
.sx-card::before,.sx-hero::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(380px circle at var(--px,50%) var(--py,50%),rgba(255,255,255,.075),transparent 45%)}
.sx-card::after,.sx-hero>.sx-rim{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(260px circle at var(--px,50%) var(--py,50%),rgba(255,214,107,.75),rgba(255,46,136,.35) 40%,transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.sx-card:hover::before,.sx-card:hover::after,.sx:hover .sx-hero::before{opacity:1}
.sx-card:hover{border-color:rgba(255,255,255,.16)}
.sx-k{display:block;font:600 .72rem/1.2 var(--sx-mono);letter-spacing:.13em;text-transform:uppercase;color:var(--sx-t2)}
.sx-ct{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sx-pill{flex:none;display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:99px;background:rgba(255,255,255,.08);color:var(--sx-soft);font:700 .68rem/1 var(--sx-mono);letter-spacing:.1em;text-transform:uppercase}
.sx-pill i{width:7px;height:7px;border-radius:50%;background:currentColor;animation:sx-live 2s infinite}
.sx-pill--ok{background:rgba(61,255,180,.12);color:#5DFFC2}
.sx-pill--gold{background:rgba(255,184,28,.14);color:#FFD27A}
@keyframes sx-live{0%{box-shadow:0 0 0 0 currentColor}70%,100%{box-shadow:0 0 0 7px transparent}}
.sx-h3{display:block;margin:0;font:800 clamp(1.15rem,2.1vw,1.5rem)/1.14 var(--sx-disp);letter-spacing:-.035em;color:var(--sx-t1)}
.sx-card p{margin:0;font-size:.95rem;line-height:1.5;color:var(--sx-t2)}
.sx-card p b{color:var(--sx-t1)}

/* ============ cuenta atrás ============ */
.sx{position:relative}
.sx-hero{position:relative;isolation:isolate;overflow:hidden;height:100%;padding:clamp(20px,3vw,30px);border-radius:26px;color:var(--sx-t1);font-family:var(--sx-body);border:1px solid rgba(255,255,255,.12);
  background:radial-gradient(70% 120% at 100% 0%,rgba(255,46,136,.32),transparent 60%),radial-gradient(70% 120% at 0% 100%,rgba(140,92,255,.32),transparent 62%),linear-gradient(160deg,#1a1230,#0b0b18);
  transition:background .8s,border-color .6s,box-shadow .6s}
.sx-hero::after{content:"";position:absolute;inset:-40%;z-index:-2;background:conic-gradient(from 0deg,transparent,rgba(255,184,28,.13),transparent 30%,rgba(51,225,255,.13),transparent 60%);animation:sx-spin 18s linear infinite}
@keyframes sx-spin{to{transform:rotate(1turn)}}
.sx.is-soon .sx-hero{background:radial-gradient(70% 120% at 100% 0%,rgba(255,184,28,.26),transparent 60%),radial-gradient(70% 120% at 0% 100%,rgba(140,92,255,.34),transparent 62%),linear-gradient(160deg,#1c1530,#0b0b18)}
.sx.is-final .sx-hero{border-color:rgba(255,90,90,.4);box-shadow:0 0 70px -20px rgba(255,46,90,.8);
  background:radial-gradient(70% 120% at 100% 0%,rgba(255,46,90,.45),transparent 60%),radial-gradient(70% 120% at 0% 100%,rgba(255,90,54,.3),transparent 62%),linear-gradient(160deg,#2a0d18,#10060a)}
.sx.is-final .sx-hero::after{animation-duration:4s}
.sx.is-zero .sx-hero{border-color:rgba(255,214,107,.45)}
.sx-fx{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.sx-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.sx-top small{font:600 .74rem/1.2 var(--sx-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sx-soft)}
.sx-live{flex:none;display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:99px;background:rgba(61,255,180,.12);color:#5DFFC2;font:700 .68rem/1 var(--sx-mono);letter-spacing:.1em;text-transform:uppercase}
.sx-live i{width:7px;height:7px;border-radius:50%;background:currentColor;animation:sx-live 2s infinite}
.sx.is-soon .sx-live{background:rgba(255,184,28,.14);color:#FFD27A}
.sx.is-final .sx-live{background:rgba(255,46,90,.18);color:#FF8FA3}
.sx-t{margin:14px 0 18px;font:800 clamp(1.45rem,3.3vw,2.3rem)/1.06 var(--sx-disp);letter-spacing:-.04em;color:var(--sx-t1)}

.sx-cd{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}
.sx-u{display:grid;justify-items:center;gap:7px;padding:16px 4px 12px;border-radius:18px;background:rgba(0,0,0,.36);border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.sx-u b{display:flex;font:800 clamp(1.7rem,4.6vw,2.9rem)/1 var(--sx-disp);letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:#fff}
.sx-u small{font:600 .7rem/1 var(--sx-mono);letter-spacing:.1em;text-transform:uppercase;color:#C9CEDD}
.sx-cd--final .sx-u b{font-size:clamp(2.6rem,8vw,4.6rem);color:#FFE9E4;text-shadow:0 0 26px rgba(255,46,90,.65)}
.sx-cd--final .sx-u{border-color:rgba(255,90,90,.3);background:rgba(40,0,10,.4)}
/* cifras que ruedan */
.sx-dg{display:inline-grid;clip-path:inset(0 -.2em)}
.sx-dg>i{grid-area:1/1;font-style:normal}
.sx-dg>i.is-in{animation:sx-dgin .5s var(--sx-ease) both}
.sx-dg>i.is-out{animation:sx-dgout .5s var(--sx-ease) both}
@keyframes sx-dgin{from{transform:translateY(75%);opacity:0;filter:blur(5px)}}
@keyframes sx-dgout{to{transform:translateY(-75%);opacity:0;filter:blur(5px)}}
/* últimos 10 segundos y el 0 */
.sx-big,.sx-now{display:block;text-align:center;font:800 clamp(4.6rem,15vw,9rem)/1 var(--sx-disp);letter-spacing:-.05em;color:transparent;
  background-image:var(--sx-warm);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 34px rgba(255,46,90,.55));animation:sx-pop .9s var(--sx-ease) both}
.sx-now{background-image:var(--sx-spec);background-size:200% 100%;animation:sx-pop .9s var(--sx-ease) both,sx-shimmer 3s linear infinite}
@keyframes sx-pop{0%{opacity:0;transform:scale(1.7);filter:blur(14px)}60%{opacity:1}100%{transform:none}}
.sx.is-last .sx-hero{animation:sx-shake .5s linear infinite}
@keyframes sx-shake{25%{transform:translate(1px,-1px)}50%{transform:translate(-1px,1px)}75%{transform:translate(1px,1px)}}

.sx-msg{margin:16px 0 0;font-size:.98rem;line-height:1.5;color:var(--sx-soft)}
.sx-msg b{color:#fff}
.sx-wait{display:grid;gap:8px;margin-top:16px}
.sx-wait:empty{display:none}
.sx-wait span{display:block;height:8px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
.sx-wait span i{position:relative;display:block;height:100%;border-radius:inherit;background:var(--sx-warm);overflow:hidden}
.sx-wait span i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);transform:translateX(-100%);animation:sx-sweep 2.4s 1s ease-in-out infinite}
@keyframes sx-sweep{60%,100%{transform:translateX(100%)}}
.sx-wait small{font-size:.84rem;color:#C9CEDD}
.sx-snd{margin-top:16px;display:inline-flex;align-items:center;gap:10px;padding:9px 15px;border-radius:999px;cursor:pointer;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:var(--sx-t1);font:600 .86rem var(--sx-body)}
.sx-snd:hover{background:rgba(255,255,255,.1)}
.sx-eq{display:inline-flex;align-items:flex-end;gap:2px;height:13px}
.sx-eq i{width:3px;height:30%;border-radius:2px;background:#3DFFB4}
.sx-snd.is-on{border-color:rgba(61,255,180,.45)}
.sx-snd.is-on .sx-eq i{animation:sx-eq .9s ease-in-out infinite}
.sx-snd.is-on .sx-eq i:nth-child(2){animation-delay:-.3s}.sx-snd.is-on .sx-eq i:nth-child(3){animation-delay:-.6s}.sx-snd.is-on .sx-eq i:nth-child(4){animation-delay:-.15s}
@keyframes sx-eq{50%{height:100%}}
.sx-st{margin-top:18px;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.sx-st:empty{display:none}
.sx-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.sx-in-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 15px;border-radius:99px;background:rgba(61,255,180,.12);border:1px solid rgba(61,255,180,.3);color:#5DFFC2;font-weight:600;font-size:.9rem}
.sx-in-chip svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6}
.sx-ok{padding:12px 16px;border-radius:14px;border:1px solid rgba(61,255,180,.35);background:rgba(61,255,180,.1);color:#CFFFEA;font-weight:600;font-size:.92rem}
.sx-note{margin:0;font-size:.92rem;line-height:1.5;color:var(--sx-soft)}
.sx-note--wait{display:inline-flex;align-items:center;gap:10px}
.sx-note--wait i{width:15px;height:15px;border-radius:50%;border:2px solid rgba(255,255,255,.2);border-top-color:#FFD66B;animation:sx-spin .8s linear infinite}

/* botones */
.sx-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:0 20px;border-radius:999px;border:0;cursor:pointer;
  font:700 .92rem/1.1 var(--sx-body);color:#07080D;text-decoration:none;transition:transform .3s var(--sx-ease),box-shadow .3s,background-color .3s}
.sx-btn svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sx-btn:hover{transform:translateY(-2px)}
.sx-btn:disabled{opacity:.7;cursor:progress}
.sx-btn--go{background:var(--sx-warm);background-size:200% 100%;box-shadow:0 14px 34px -14px rgba(255,90,54,.9),inset 0 1px 0 rgba(255,255,255,.4)}
.sx-btn--go::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%);transform:translateX(-120%);animation:sx-sweep 3.4s ease-in-out infinite}
.sx-btn--go span,.sx-btn--go svg{position:relative;z-index:1}
.sx-btn.is-glow{animation:sx-glow 1.4s ease-in-out infinite}
@keyframes sx-glow{50%{box-shadow:0 0 0 7px rgba(255,90,54,.16),0 0 60px 4px rgba(255,46,136,.55)}}
.sx-btn--line{background:rgba(255,255,255,.06);color:var(--sx-t1);border:1px solid rgba(255,255,255,.16);font-weight:600}
.sx-btn--line:hover{background:rgba(255,255,255,.11)}
.sx-btn--ig{color:#fff;background:var(--sx-ig);box-shadow:0 14px 34px -14px rgba(238,42,123,.9)}

/* ============ tu participación ============ */
.sx-me-n{display:flex;align-items:flex-end;gap:14px;margin-top:4px}
.sx-me-n>b{font:800 clamp(3rem,5.4vw,4rem)/.86 var(--sx-disp);letter-spacing:-.05em;color:transparent;background:linear-gradient(180deg,#fff 20%,#3DFFB4);-webkit-background-clip:text;background-clip:text}
.sx-me-n>span{display:grid;gap:8px;padding-bottom:4px;font-size:.92rem;color:var(--sx-t2)}
.sx-me-tk{display:flex;gap:4px}
.sx-me-tk i{position:relative;width:18px;height:11px;border-radius:3px;background:linear-gradient(125deg,#FFF0C2,#FFD66B 40%,#E9A53A);box-shadow:0 2px 8px rgba(255,184,28,.35);animation:sx-tk .6s calc(var(--i) * .09s + .3s) var(--sx-ease) both}
.sx-me-tk i::after{content:"";position:absolute;top:2px;bottom:2px;right:5px;border-left:1px dashed rgba(42,22,17,.5)}
.sx-me-tk em{font:700 .72rem/11px var(--sx-mono);font-style:normal;color:#FFD66B}
@keyframes sx-tk{from{opacity:0;transform:translateY(-10px) rotate(-25deg)}}
.sx-me-dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
.sx-me-dl div{display:flex;flex-direction:column-reverse;gap:4px;padding:11px 13px;border-radius:15px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06)}
.sx-me-dl dt{font-size:.8rem;color:var(--sx-t2)}
.sx-me-dl dd{margin:0;font:800 1.25rem/1 var(--sx-disp);letter-spacing:-.03em;color:var(--sx-t1)}
.sx-me-h{display:block;font:800 clamp(1.2rem,2vw,1.45rem)/1.15 var(--sx-disp);letter-spacing:-.035em;color:var(--sx-t1)}
.sx-card .sx-me-p{font-size:.9rem}
.sx-me>.sx-btn{margin-top:auto;width:100%}
/* participación extra: se explica, no se «pulsa» (la revisa el equipo) */
.sx-xtra{margin-top:auto;display:grid;gap:10px;padding:14px 15px;border-radius:16px;background:rgba(255,255,255,.035);border:1px dashed rgba(255,255,255,.16)}
.sx-xtra>b{font-size:.92rem;color:var(--sx-t1)}
.sx-xtra ol{margin:0;padding-left:20px;display:grid;gap:5px;font-size:.84rem;line-height:1.4;color:var(--sx-t2)}
.sx-xtra ol strong{color:var(--sx-t1);font-weight:600}
.sx-xtra small{font-size:.78rem;color:var(--sx-t3)}
.sx-xtra-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sx-xtra-acts .sx-btn{min-height:40px;padding:0 10px;font-size:.8rem;gap:7px}
.sx-x2 ol{margin:0;padding-left:22px;display:grid;gap:6px;font-size:.93rem;line-height:1.45;color:rgba(255,255,255,.88)}
.sx-x2 ol b{color:#fff}
.sx-x2-acts{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px}
.sx-x2-acts .sx-x2-go{margin-top:0}
.sx-x2 .sx-x2-go--line{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.3);text-decoration:none}

/* ============ premio ============ */
.sx-prize-in{display:grid;grid-template-columns:1fr 1.05fr;gap:18px;align-items:center}
.sx-prize-txt{display:flex;flex-direction:column;gap:12px}
.sx-tags{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.sx-tags li{padding:6px 11px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);font-size:.8rem;font-weight:600;color:var(--sx-soft)}
.sx-card .sx-fine{font-size:.8rem;color:var(--sx-t3)}
.sx-tk-wrap{position:relative;display:grid;place-items:center;padding:14px 0;perspective:900px;touch-action:pan-y}
.sx-tk-wrap::before{content:"";position:absolute;inset:10% 6%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,184,28,.4),rgba(255,46,136,.16) 55%,transparent);filter:blur(24px);z-index:-1}
.sx-tk{--rx:0deg;--ry:0deg;--gx:50%;--gy:50%;position:relative;width:min(340px,100%);aspect-ratio:2.05/1;display:grid;grid-template-columns:1fr 28%;
  border-radius:16px;transform-style:preserve-3d;transition:transform .7s var(--sx-ease);transform:rotateX(var(--rx)) rotateY(var(--ry)) rotate(-4deg);
  background:linear-gradient(125deg,#FFF3CF 0%,#FFD66B 28%,#F2B23E 52%,#E39A2E 70%,#FFE39A 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),inset 0 -8px 24px rgba(140,60,10,.25);
  -webkit-mask:radial-gradient(circle 11px at 72% 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 72% 100%,#0000 97%,#000) bottom/100% 51% no-repeat;
  mask:radial-gradient(circle 11px at 72% 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 72% 100%,#0000 97%,#000) bottom/100% 51% no-repeat}
.sx-tk-wrap.is-on .sx-tk{transition:transform .12s linear}
.sx-tk-wrap:not(.is-on) .sx-tk{animation:sx-float 6s ease-in-out infinite}
@keyframes sx-float{50%{transform:rotateX(8deg) rotateY(-12deg) rotate(-2deg) translateY(-6px)}}
.sx-tk b,.sx-tk small,.sx-tk span{color:#2A1611}
.sx-tk-main{position:relative;z-index:1;padding:14px 16px;display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.sx-tk-k{font:600 .5rem/1 var(--sx-mono);letter-spacing:.18em;text-transform:uppercase;opacity:.7}
.sx-tk-h{display:block;margin-top:4px;font:800 clamp(1rem,2vw,1.3rem)/1 var(--sx-disp);letter-spacing:-.04em}
.sx-tk .sx-tk-y{font:800 .9rem/1 var(--sx-disp);color:#9A2E14}
.sx-tk-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:7px;border-top:1.5px dashed rgba(42,22,17,.3)}
.sx-tk-meta small{display:block;font:600 .45rem/1 var(--sx-mono);letter-spacing:.16em;text-transform:uppercase;opacity:.6}
.sx-tk-meta b{display:block;margin-top:3px;font-size:.66rem;font-weight:700}
.sx-tk-stub{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-left:1.5px dashed rgba(42,22,17,.35)}
.sx-tk-stub small{font:600 .5rem/1 var(--sx-mono);letter-spacing:.2em;opacity:.6}
.sx-tk-stub b{font:800 .95rem/1 var(--sx-disp);letter-spacing:-.02em}
.sx-tk-bar{width:62%;height:22px;margin-top:4px;background:repeating-linear-gradient(90deg,#2A1611 0 2px,transparent 2px 4px,#2A1611 4px 6px,transparent 6px 8px,#2A1611 8px 9px,transparent 9px 11px)}
.sx-tk-holo{position:absolute;inset:0;z-index:2;pointer-events:none;mix-blend-mode:color-dodge;opacity:.6;
  background:linear-gradient(115deg,transparent 20%,rgba(255,46,136,.55) 36%,rgba(51,225,255,.55) 46%,rgba(140,92,255,.55) 56%,rgba(61,255,180,.45) 64%,transparent 78%);
  background-size:260% 260%;background-position:var(--gx) var(--gy);transition:background-position .12s linear}
.sx-tk-glare{position:absolute;inset:0;z-index:3;pointer-events:none;mix-blend-mode:overlay;background:radial-gradient(circle at var(--gx) var(--gy),rgba(255,255,255,.75),transparent 46%)}

/* ============ en cifras ============ */
.sx-nums dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;flex:1}
.sx-nums dl>div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:6px;padding:14px;border-radius:18px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06);transition:transform .4s var(--sx-ease),border-color .3s}
.sx-nums dl>div:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.16)}
.sx-nums dt{font-size:.86rem;line-height:1.3;color:var(--sx-t2)}
.sx-nums dd{margin:0;display:flex;align-items:baseline;gap:6px}
.sx-nums dd b{font:800 clamp(1.6rem,3vw,2.1rem)/1 var(--sx-disp);letter-spacing:-.04em;color:var(--sx-t1)}
.sx-nums dd i{font-style:normal;font-size:1rem;color:var(--sx-t2)}
.sx-nums b.is-warm{color:transparent;background:var(--sx-warm);-webkit-background-clip:text;background-clip:text}
.sx-nums b.is-ig{color:transparent;background:var(--sx-ig);-webkit-background-clip:text;background-clip:text}

/* ============ checklist ============ */
.sx-li-h{display:block;margin-top:6px;font-size:1.05rem;color:var(--sx-t1)}
.sx-bar{flex:0 1 150px;height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;align-self:flex-end;margin-bottom:5px}
.sx-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3DFFB4,#33E1FF);transition:width .6s var(--sx-ease)}
.sx-li{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sx-li li{display:flex;align-items:center;gap:12px;padding:11px 12px 11px 14px;border-radius:15px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--sx-t1);font-size:.94rem;font-weight:500;line-height:1.3}
.sx-chk{flex:none;width:26px;height:26px;border-radius:9px;display:grid;place-items:center;border:2px solid rgba(255,255,255,.35);transition:background-color .3s,border-color .3s,transform .4s var(--sx-ease)}
.sx-chk svg{width:15px;height:15px;fill:none;stroke:transparent;stroke-width:3}
.sx-li li.is-ok .sx-chk{background:#3DFFB4;border-color:#3DFFB4;transform:scale(1.05)}
.sx-li li.is-ok .sx-chk svg{stroke:#07080D}
.sx-li-t{flex:1;min-width:0;display:grid;gap:2px}
.sx-li-t small{font-size:.78rem;font-weight:400;color:var(--sx-t2)}
.sx-li li.is-ok .sx-li-t small{color:#5DFFC2}
.sx-li-go{flex:none;display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:99px;border:0;cursor:pointer;background:#fff;color:#07080D;font:700 .78rem/1 var(--sx-body);transition:transform .3s var(--sx-ease)}
.sx-li-go:hover{transform:translateX(3px)}
.sx-li-go svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.4}

/* ============ ×2 (story) ============ */
.sx-x2{min-height:270px;padding-right:clamp(18px,34%,230px);color:#fff;border-color:rgba(238,42,123,.3);
  background:radial-gradient(90% 120% at 100% 0%,rgba(238,42,123,.5),transparent 60%),radial-gradient(70% 90% at 0% 100%,rgba(249,206,52,.14),transparent 60%),linear-gradient(150deg,#2b0a3d,#0d0620)}
.sx-x2 .sx-k{color:rgba(255,255,255,.85)}
.sx-x2 .sx-h3 em{background-image:linear-gradient(100deg,#FFD66B,#FF7AB6 55%,#C9A6FF);background-size:100% 100%;animation:none}
.sx-x2 p{color:rgba(255,255,255,.86)}
.sx-x2-go,.sx-split .sx-x2-go{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:99px;border:0;cursor:pointer;background:#fff;color:#07080D;font:700 .88rem/1 var(--sx-body);transition:transform .3s var(--sx-ease)}
.sx-x2-go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2}
.sx-x2-go:hover,.sx-split:hover .sx-x2-go{transform:translateX(4px)}
.sx-x2-rays{position:absolute;z-index:-1;right:-90px;bottom:-110px;width:340px;height:340px;border-radius:50%;
  background:repeating-conic-gradient(from 200deg,rgba(238,42,123,.5) 0 4deg,transparent 4deg 18deg);-webkit-mask:radial-gradient(circle,#000 20%,transparent 70%);mask:radial-gradient(circle,#000 20%,transparent 70%);animation:sx-spin 30s linear infinite}
.sx-x2-phone{position:absolute;right:clamp(16px,4vw,40px);top:22px;width:clamp(118px,13vw,150px);aspect-ratio:9/17;padding:12px 10px;border-radius:22px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;
  background:radial-gradient(90% 50% at 90% 10%,rgba(240,83,47,.5),transparent 70%),#140B08;border:4px solid #1d1f2c;box-shadow:0 30px 60px -24px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.1);
  transform:rotate(7deg);transition:transform .6s var(--sx-ease)}
.sx-x2:hover .sx-x2-phone{transform:rotate(2deg) translateY(-8px) scale(1.03)}
.sx-x2-phone i{align-self:flex-start;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#F0532F;font:800 7px var(--sx-body);font-style:normal;color:#fff}
.sx-x2-phone b{margin-top:8px;font:800 .66rem/1.2 var(--sx-disp);letter-spacing:-.02em;color:#fff}
.sx-x2-phone b em{font-style:normal;color:#FFD66B}
.sx-x2-phone u{width:74%;aspect-ratio:2/1;margin-top:6px;border-radius:6px;transform:rotate(-6deg);background:linear-gradient(125deg,#FFF0C2,#FFD66B 40%,#E9A53A);box-shadow:-7px -4px 0 -2px #8E5018}
.sx-x2-phone small{margin-top:auto;font:800 .62rem/1 var(--sx-disp);color:#FFD66B}

/* ============ dudas ============ */
.sx-link{display:inline-flex;align-items:center;gap:5px;color:#FFD27A;font-size:.85rem;font-weight:600;text-decoration:none}
.sx-link svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.sx-link:hover{text-decoration:underline;text-underline-offset:3px}
.sx-qs details{border-bottom:1px solid rgba(255,255,255,.08)}
.sx-qs details:last-child{border-bottom:0}
.sx-qs summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;font-weight:600;font-size:.98rem;color:var(--sx-t1)}
.sx-qs summary::-webkit-details-marker{display:none}
.sx-qs summary::after{content:"";flex:none;width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(currentColor,currentColor) center/10px 1.6px no-repeat,linear-gradient(currentColor,currentColor) center/1.6px 10px no-repeat;transition:transform .35s var(--sx-ease),background-color .3s,border-color .3s}
.sx-qs details[open] summary::after{transform:rotate(135deg);background-color:rgba(255,184,28,.16);border-color:rgba(255,184,28,.5)}
.sx-qs details p{padding:0 40px 16px 0;font-size:.92rem}
.sx-qs details[open] p{animation:sx-open .45s var(--sx-ease)}
@keyframes sx-open{from{opacity:0;transform:translateY(-6px)}}

/* ============ Split ============ */
.sx-split{min-height:260px;color:#fff;border-color:rgba(51,225,255,.25);
  background:radial-gradient(90% 120% at 100% 0%,rgba(51,225,255,.4),transparent 60%),linear-gradient(150deg,#121543,#070a20)}
.sx-split .sx-k{color:rgba(255,255,255,.85)}
.sx-split p{color:rgba(255,255,255,.86)}
.sx-split-sun{position:absolute;z-index:-1;right:-70px;bottom:-90px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(140,92,255,.65),transparent 65%);animation:sx-drift 9s ease-in-out infinite alternate}
.sx-foot{display:block;margin-top:22px;text-align:center;font-size:.8rem;color:var(--sx-t3)}
.sx-foot a{color:var(--sx-t2);text-decoration:underline;text-underline-offset:3px}

/* ============ intro ============ */
.sx-boot{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(60% 50% at 50% 50%,#17112e,#05060A 72%);clip-path:inset(0 0 0 0);transition:clip-path .8s cubic-bezier(.76,0,.24,1)}
.sx-boot.is-out{clip-path:inset(0 0 100% 0)}
.sx-boot-in{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;transition:transform .6s var(--sx-ease),opacity .5s,filter .5s}
.sx-boot.is-out .sx-boot-in{transform:translateY(-30px) scale(.96);opacity:0;filter:blur(8px)}
.sx-boot-ring{width:128px;height:128px;transform:rotate(-90deg)}
.sx-boot-ring circle{fill:none;stroke:rgba(255,255,255,.08);stroke-width:2.5}
.sx-boot-ring .is-run{stroke:#FFB81C;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;filter:drop-shadow(0 0 6px rgba(255,184,28,.8))}
.sx-boot-ic{position:absolute;top:0;left:50%;width:128px;height:128px;margin-left:-64px;display:grid;place-items:center}
.sx-boot-ic svg{width:38px;height:38px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;animation:sx-breath 1.2s ease-in-out infinite}
@keyframes sx-breath{50%{transform:scale(1.08);opacity:.75}}
.sx-boot-n{margin-top:20px;font:800 2.2rem/1 var(--sx-disp);letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:transparent;background:var(--sx-warm);-webkit-background-clip:text;background-clip:text}
.sx-boot-k{margin-top:12px;font:600 .7rem/1 var(--sx-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--sx-t3)}
.sx-boot-t{margin-top:8px;min-height:1.4em;font:500 .95rem/1.4 var(--sx-body);color:var(--sx-soft)}
.sx-boot-scan{position:absolute;left:0;right:0;top:-30%;height:30%;background:linear-gradient(180deg,transparent,rgba(140,92,255,.12),transparent);animation:sx-scan 1.5s linear infinite}
@keyframes sx-scan{to{top:100%}}

/* entrada en cascada (sx-pre lo pone el <head>, sorteo-pagina.js lo cambia por sx-go al acabar la intro) */
html.sx-pre .sx-in{opacity:0}
html.sx-go .sx-in{animation:sx-card-in 1s var(--sx-ease) both;animation-delay:calc(var(--i,0) * 90ms)}
@keyframes sx-card-in{from{opacity:0;transform:translateY(34px) scale(.97) rotateX(8deg);filter:blur(10px)}}
html.sx-go .sx-a .sx-u{animation:sx-card-in .8s var(--sx-ease) both;animation-delay:calc(var(--i,0) * 70ms + .35s)}
.sx-js [data-sx-reveal]{transition:opacity .9s var(--sx-ease),transform .9s var(--sx-ease),filter .9s var(--sx-ease)}
.sx-js [data-sx-reveal]:not(.is-in){opacity:0;transform:translateY(34px) scale(.98);filter:blur(8px)}
.sx-grid>[data-sx-reveal]:nth-child(odd){transition-delay:.08s}

/* ============ simulador del panel ============ */
.cta-sim{background:#05060A}
.cta-sim-in.sx{min-height:100svh;display:grid;place-items:center;padding:70px 16px 30px}
.cta-sim-in.sx .sx-hero{width:min(880px,100%);height:auto}

/* ============ tablet y móvil ============ */
@media (max-width:1020px){
  .sx-a,.sx-prize,.sx-x2,.sx-faq{grid-column:span 12}
  .sx-me,.sx-nums,.sx-list,.sx-split{grid-column:span 6}
}
@media (max-width:680px){
  .srt-page.sx-page{padding-top:calc(70px + 22px)}
  .sx-grid>*{grid-column:span 12!important}
  .sx-grid{gap:12px}
  .sx-head{align-items:flex-start;gap:12px}
  .sx-head-ic{width:46px;height:46px;border-radius:14px}
  .sx-hero{padding:18px;border-radius:22px}
  .sx-cd{gap:6px}
  .sx-u{padding:13px 2px 10px;border-radius:15px}
  .sx-u b{font-size:clamp(1.35rem,7.4vw,1.9rem)}
  .sx-u small{font-size:.6rem;letter-spacing:.06em}
  .sx-cd--final .sx-u b{font-size:clamp(2.4rem,14vw,3.4rem)}
  .sx-acts,.sx-acts .sx-btn,.sx-st>.sx-btn{width:100%}
  .sx-prize-in{grid-template-columns:1fr}
  .sx-x2{padding-right:18px;min-height:0}
  .sx-x2-phone{display:none}
  .sx-qs details p{padding-right:0}
  .sx-li li{flex-wrap:wrap}
}

/* ============ v16.8: cabecera con la ruta, barra del sorteo en el móvil y detalles de iPhone ============ */
.sx-page a,.sx-page button,.sx-page summary,.sx-mbar a,.sx-mbar button{-webkit-tap-highlight-color:transparent}
#srtPage,#sxExtra{scroll-margin-top:96px}
.sx-head-t{min-width:0}
.sx-head-k{display:inline-flex;align-items:center;gap:8px;margin-bottom:8px;font:600 .72rem/1 var(--sx-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--sx-t2)}
.sx-head-k i{width:7px;height:7px;border-radius:50%;background:#3DFFB4;color:#3DFFB4;animation:sx-live 2s infinite}
/* la ruta hasta Split: a la derecha en escritorio, arriba del todo en el móvil */
.sx-route{order:3;flex:none;width:min(360px,34vw);height:auto;margin-left:auto;overflow:visible}
.sx-route-red path{fill:none;stroke:rgba(214,220,240,.12);stroke-width:1}
.sx-route-l{fill:none;stroke:url(#sxRuta);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:6 5;animation:sx-ruta 1.2s linear infinite}
@keyframes sx-ruta{to{stroke-dashoffset:-11}}
.sx-route-n circle{fill:#F3F5FB}
.sx-route-split{fill:#FF2E88;filter:drop-shadow(0 0 6px rgba(255,46,136,.9))}
.sx-route-ring{fill:none;stroke:rgba(255,46,136,.7);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:sx-anillo 2s ease-out infinite}
@keyframes sx-anillo{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.9);opacity:0}}
.sx-route-tren{fill:#fff;filter:drop-shadow(0 0 5px rgba(255,214,107,.95))}
.sx-route-t rect{fill:rgba(8,9,16,.88)}
.sx-route-t text{font-family:var(--sx-mono);font-weight:600;font-size:7px;letter-spacing:1.1px;fill:rgba(214,220,240,.72)}
.sx-route-t text.is-split{font-size:8.5px;fill:#FF8FC0}
/* la entrada: aviso de «tócala» en pantallas táctiles y vuelta al tocarla */
.sx-tk-hint{position:absolute;left:50%;bottom:2px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:99px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font:600 .74rem/1 var(--sx-body);color:var(--sx-soft);white-space:nowrap;transition:opacity .5s;pointer-events:none}
.sx-tk-hint svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;animation:sx-inclina 2.4s ease-in-out infinite}
@keyframes sx-inclina{25%{transform:rotate(-16deg)}75%{transform:rotate(16deg)}}
.sx-tk-wrap.is-giro .sx-tk-hint{opacity:0}
.sx-tk-wrap .sx-tk.is-spin{animation:sx-vuelta .9s var(--sx-ease)}
@keyframes sx-vuelta{from{transform:rotateY(0) rotate(-4deg)}to{transform:rotateY(360deg) rotate(-4deg)}}
/* barra de abajo del sorteo (solo se ve en el móvil, como la .mbar de siempre) */
.sx-mbar{gap:8px}
.sx-mbar-t{flex:none;display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:52px;padding:0 13px;border-radius:16px;background:rgba(255,255,255,.07);text-decoration:none}
.sx-mbar-t small{font:600 .58rem/1 var(--mono,ui-monospace);letter-spacing:.12em;text-transform:uppercase;color:#B3B9CC;white-space:nowrap}
.sx-mbar-t b{font:800 .98rem/1 var(--orbit,system-ui);letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:#fff;white-space:nowrap}
.sx-mbar-go{flex:1;display:flex;min-width:0}
.sx-mbar-go .btn{flex:1;min-width:0;min-height:52px;border-radius:16px;box-shadow:none;white-space:nowrap;padding:0 12px;font-size:.9rem;justify-content:center;gap:7px}
.sx-mbar-go .btn svg{width:16px;height:16px;flex:none}

/* ============ v16.9: cuenta atrás más completa, «×2 · ver más» y la tarjeta de Split sin hueco ============ */
/* la tarjeta de la cuenta atrás reparte su altura: los botones van abajo y no queda hueco */
.sx-hero{display:flex;flex-direction:column}
.sx-hero .sx-st{margin-top:auto;padding-top:18px}
.sx-msg:empty{display:none}
/* barrita que se vacía en cada caja y «latido» de los segundos */
.sx-u{position:relative;overflow:hidden}
.sx-ub{position:absolute;left:14px;right:14px;bottom:7px;height:3px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.sx-ub i{display:block;height:100%;border-radius:inherit;background:var(--sx-warm);transition:width .9s linear}
.sx-u.is-beat{animation:sx-latido-u .6s var(--sx-ease)}
@keyframes sx-latido-u{0%{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 0 rgba(255,90,54,.0)}35%{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 2px rgba(255,90,54,.45),0 0 24px -4px rgba(255,90,54,.6)}100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 0 rgba(255,90,54,0)}}
.sx-u.is-beat b{animation:sx-latido-b .6s var(--sx-ease)}
@keyframes sx-latido-b{35%{transform:scale(1.05)}}
/* la noche del sorteo en una línea */
.sx-tl{--p:0;margin-top:22px}
.sx-tl:empty{display:none}
.sx-tl-l{position:relative;display:block;height:4px;margin:0 7px;border-radius:9px;background:rgba(255,255,255,.12)}
.sx-tl-l>b{position:absolute;top:50%;left:calc(var(--x) * 100%);width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#1d1830;border:2px solid rgba(255,255,255,.3)}
.sx-tl-f{position:absolute;left:0;top:0;bottom:0;width:calc(var(--p) * 100%);border-radius:inherit;background:var(--sx-warm);transition:width 1s linear}
.sx-tl-p{position:absolute;top:50%;left:calc(var(--p) * 100%);width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 5px rgba(255,90,54,.3),0 0 20px rgba(255,90,54,.9);transition:left 1s linear;animation:sx-tl-p 1.6s ease-in-out infinite}
@keyframes sx-tl-p{50%{box-shadow:0 0 0 9px rgba(255,90,54,.12),0 0 26px rgba(255,90,54,.9)}}
.sx-tl ol{position:relative;list-style:none;margin:12px 0 0;padding:0;height:40px}
.sx-tl li{position:absolute;top:0;left:calc(var(--x) * 100%);transform:translateX(-50%);display:grid;gap:3px;text-align:center;white-space:nowrap}
.sx-tl li:first-child{transform:none;text-align:left}
.sx-tl li:last-child{transform:translateX(-100%);text-align:right}
.sx-tl li b{font-size:.84rem;font-weight:700;color:var(--sx-t2)}
.sx-tl li small{font:600 .62rem/1 var(--sx-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sx-t3)}
.sx-tl li.is-done b{color:#fff}
.sx-tl li.is-done small{color:#FFB98A}
/* las entradas en juego */
.sx-prem{display:flex;align-items:center;gap:14px;margin-top:16px;padding:13px 16px;border-radius:18px;background:rgba(0,0,0,.28);border:1px solid rgba(255,214,107,.22)}
.sx-prem:empty{display:none}
.sx-prem-tk{display:flex;gap:5px;flex:none}
.sx-prem-tk i{position:relative;width:30px;height:18px;border-radius:4px;background:linear-gradient(125deg,#FFF0C2,#FFD66B 40%,#E9A53A);box-shadow:0 3px 10px rgba(255,184,28,.35);animation:sx-tk .6s calc(var(--i) * .1s + .4s) var(--sx-ease) both}
.sx-prem-tk i::after{content:"";position:absolute;top:3px;bottom:3px;right:8px;border-left:1.5px dashed rgba(42,22,17,.5)}
.sx-prem-tk em{font:700 .8rem/18px var(--sx-mono);font-style:normal;color:#FFD66B}
.sx-prem-t{display:grid;gap:3px;min-width:0}
.sx-prem-t b{font-size:.98rem;color:#fff}
.sx-prem-t small{font-size:.8rem;color:var(--sx-t2)}
/* «Tu resultado»: cerrado hasta la hora del sorteo */
.sx-me-res{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.035);border:1px dashed rgba(255,255,255,.18);color:inherit;font:inherit;text-align:left}
.sx-me-res-ic{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(255,184,28,.12)}
.sx-me-res-ic svg{width:18px;height:18px;fill:none;stroke:#FFD27A;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sx-me-res>span:last-child{display:grid;gap:2px;min-width:0}
.sx-me-res b{font-size:.92rem;color:var(--sx-t1)}
.sx-me-res small{font-size:.8rem;color:var(--sx-t2)}
.sx-me-res.is-on{cursor:pointer;border:1px solid rgba(255,90,54,.55);background:rgba(255,90,54,.1);animation:sx-glow 1.6s ease-in-out infinite}
.sx-me-res.is-on .sx-me-res-ic,.sx-me-res.is-done .sx-me-res-ic{background:rgba(61,255,180,.14)}
.sx-me-res.is-on .sx-me-res-ic svg,.sx-me-res.is-done .sx-me-res-ic svg{stroke:#5DFFC2;stroke-width:2.6}
/* «Participación extra ×2 · Ver más» dentro de tu participación */
.sx-x2t{flex-wrap:wrap;margin-top:auto;position:relative;overflow:hidden;display:flex;align-items:center;gap:10px 14px;padding:14px 16px;border-radius:18px;text-decoration:none;color:#fff;
  background:radial-gradient(120% 140% at 100% 0%,rgba(238,42,123,.45),transparent 60%),linear-gradient(135deg,#2b0a3d,#160a2a);border:1px solid rgba(238,42,123,.35);transition:transform .35s var(--sx-ease),border-color .3s}
.sx-x2t:hover{border-color:rgba(238,42,123,.6);transform:translateY(-2px)}
.sx-x2t-n{flex:none;font:900 2.3rem/1 var(--sx-disp);letter-spacing:-.06em;color:transparent;background:linear-gradient(160deg,#F9CE34,#EE2A7B 55%,#9A6BFF);-webkit-background-clip:text;background-clip:text}
.sx-x2t-t{flex:1 1 150px;min-width:0;display:grid;gap:3px}
.sx-x2t-go{margin-left:auto}
.sx-x2t-t b{font-size:.95rem}
.sx-x2t-t small{font-size:.8rem;line-height:1.35;color:rgba(255,255,255,.78)}
.sx-x2t-go{flex:none;display:inline-flex;align-items:center;gap:5px;padding:8px 11px;border-radius:99px;background:#fff;color:#07080D;font-weight:700;font-size:.78rem}
.sx-x2t-go svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.6}
/* Split: lo que incluye, sin hueco */
.sx-split-l{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:8px}
.sx-split-l li{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);font-size:.88rem;font-weight:600;color:#fff}
.sx-split-l svg{flex:none;width:18px;height:18px;fill:none;stroke:#7FE9FF;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sx-split .sx-x2-go{margin-top:auto}
@media (max-width:680px){
  .sx-tl li b{font-size:.74rem}
  .sx-tl li small{font-size:.55rem;letter-spacing:.06em}
  .sx-tl li:nth-child(2) small,.sx-tl li:nth-child(3) small{display:none}
  .sx-x2t{flex-wrap:wrap}
  .sx-x2t-go{margin-left:auto}
  .sx-ub{left:12px;right:12px;bottom:6px}
}

@media (max-width:680px){
  /* cabecera tipo cartel: la ruta arriba y «Ultra Europe» enorme */
  .sx-head{flex-direction:column;align-items:stretch;gap:4px}
  .sx-route{order:0;width:100%;margin:0 0 10px}
  .sx-head-ic{display:none}
  .sx-head h1{display:flex;flex-direction:column}
  .sx-head h1 span{font-size:1.2rem;letter-spacing:-.02em;margin-bottom:6px}
  .sx-head h1 em{font-size:clamp(3rem,15.6vw,4.4rem);line-height:.9;letter-spacing:-.055em;padding-bottom:.08em}
  .sx-head p{margin-top:12px;font-size:.95rem}
  /* cuenta atrás en 2×2, con números grandes */
  .sx-t{font-size:clamp(1.55rem,7.6vw,2rem);margin:12px 0 16px}
  .sx-cd{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .sx-cd .sx-u:last-child:nth-child(odd){grid-column:span 2}
  .sx-u{padding:18px 6px 14px;border-radius:18px}
  .sx-u b{font-size:clamp(2.6rem,14vw,3.5rem)}
  .sx-u small{font-size:.68rem;letter-spacing:.12em}
  .sx-cd--final .sx-u b{font-size:clamp(3rem,17vw,4.4rem)}
  .sx-big,.sx-now{font-size:clamp(5.5rem,34vw,8rem)}
  /* tarjetas y botones al tacto */
  .sx-card{border-radius:22px}
  .sx-xtra-acts{grid-template-columns:1fr}
  .sx-xtra-acts .sx-btn{min-height:46px;font-size:.9rem}
  .sx-btn:active,.sx-x2-go:active,.sx-li-go:active,.sx-mbar-go .btn:active{transform:scale(.97)}
  .sx-tk-wrap{padding:20px 0 46px}
  .sx-tk{width:min(330px,94%)}
  .sx-x2-acts{flex-direction:column}
  .sx-x2-acts .sx-x2-go{align-self:stretch;justify-content:center}
}
@media (hover:none){
  .sx-card:hover{border-color:rgba(255,255,255,.1)}
  .sx-nums dl>div:hover{transform:none}
}

@media (prefers-reduced-motion:reduce){
  .sx-page *,.sx *,.sx-boot *{animation:none!important;transition:none!important}
  .sx-js [data-sx-reveal]:not(.is-in){opacity:1;transform:none;filter:none}
}