STKR26

STKR26

Tu álbum. Tu historia.

♛

STKR26

Tracker de cromos · Mundial 2026

De coleccionista a coleccionista.

Nombre

Correo

Contraseña

¿Ya tienes cuenta? Inicia sesión

♛

Acceso Completo · STKR26

$25

Pesos MXN · Un solo pago · Para siempre

⚡

980 estampas · 48 selecciones · 12 grupos reales

🎯

Modo escáner rápido — registra al abrir sobres

☁️

Historial en la nube · nunca pierdas tu álbum

💰

Contador de gasto real con equivalencias cotidianas

🔄

Intercambios · hoja para WhatsApp

🏆

Logros · estadísticas · perfil de coleccionista

💳 PAGAR CON MERCADO PAGO

Después de pagar regresa aquí y toca
"Ya pagué — verificar acceso"

ÁLBUM COMPLETADO

0%

TOTAL

0%

0 / 980 estampas

⚡ ¡Vas increíble!

0

PEGADAS

0

REPETIDAS

980

FALTAN

GASTO ESTIMADO

$0

0 sobres · 0 cajas

FALTANTES TOP

VER TODOS →

LOGROS

🏠

INICIO

🔍

FALTAN

📋

COLECCIÓN

🔄

CAMBIOS

👤

PERFIL

← SALIR

1/20

—

←

REP

↑

ESP

↓

SKIP

→

PEG

✓ 0 ↩ 0 — 0

#01

MEX-01

ESCUDO

—

PANEL ADMIN

STKR26 · luiscomercializadora31@gmail.com

MÉTRICAS

USUARIOS

PAGOS

STATS

+g.toLocaleString(); document.getElementById('shRepC').textContent=repC.length?repC.slice(0,24).join(' · '):'Ninguna aún'; document.getElementById('shFaltC').textContent=faltC.length?faltC.slice(0,20).join(' · '):'♛ COMPLETO'; document.getElementById('shareOv').classList.add('open'); } function closeShare(){document.getElementById('shareOv').classList.remove('open');} async function generateSharePNG(){ const name=user?user._name||user.email?.split('@')[0]:'crack'; let peg=0,rep=0;const repC=[],faltC=[]; allC().forEach(c=>{const d=col[c];if(!d)faltC.push(c);else if(d.e==='p')peg++;else{rep++;repC.push(d.c>1?`${c}(${d.c}x)`:c);}}); const pct=Math.round(peg/980*100),gasto=(sob.s*25)+(sob.c*2500); const W=1080,H=1920; const cv=document.createElement('canvas'); cv.width=W;cv.height=H; const ctx=cv.getContext('2d'); // fondo negro ctx.fillStyle='#080808'; ctx.fillRect(0,0,W,H); // línea top neón const grad=ctx.createLinearGradient(0,0,W,0); grad.addColorStop(0,'transparent'); grad.addColorStop(.5,'#C6FF00'); grad.addColorStop(1,'transparent'); ctx.fillStyle=grad; ctx.fillRect(0,0,W,4); // helper texto const txt=(text,x,y,size,color,align='left',weight='normal',font='Inter')=>{ ctx.font=`${weight} ${size}px ${font}, sans-serif`; ctx.fillStyle=color; ctx.textAlign=align; ctx.fillText(text,x,y); }; // LOGO txt('STKR',100,120,96,'#F0F0F0','left','900','Arial Black'); ctx.font='900 96px Arial Black'; ctx.fillStyle='#C6FF00'; ctx.fillText('26',460,120); // corona txt('♛',640,120,72,'#C6FF00','left','bold'); // tagline txt('TU ÁLBUM. TU HISTORIA.',100,160,28,'#555','left','700'); // línea separador ctx.fillStyle='#1a1a1a'; ctx.fillRect(100,180,W-200,1); // usuario txt('@'+name.toUpperCase(),100,240,36,'#888','left','700'); // % grande ctx.font='900 200px Arial Black, sans-serif'; ctx.fillStyle='#C6FF00'; ctx.textAlign='left'; ctx.fillText(pct+'%',100,480); txt('ÁLBUM COMPLETADO',100,520,32,'#555','left','700'); // barra de progreso const bx=100,by=560,bw=W-200,bh=16; ctx.fillStyle='#1a1a1a'; ctx.beginPath();ctx.roundRect(bx,by,bw,bh,8);ctx.fill(); ctx.fillStyle='#C6FF00'; ctx.shadowColor='#C6FF00';ctx.shadowBlur=12; ctx.beginPath();ctx.roundRect(bx,by,Math.max(bw*pct/100,8),bh,8);ctx.fill(); ctx.shadowBlur=0; // stats 3 col const cols3=[ {val:peg,lbl:'PEGADAS',color:'#C6FF00'}, {val:rep,lbl:'REPETIDAS',color:'#FF4444'}, {val:Math.max(0,980-peg),lbl:'FALTAN',color:'#F0F0F0'}, ]; const cw3=Math.floor((W-200)/3); cols3.forEach((s,i)=>{ const cx=100+i*cw3; // card bg ctx.fillStyle='#141414'; ctx.beginPath();ctx.roundRect(cx,620,cw3-12,160,14);ctx.fill(); ctx.fillStyle='#222'; ctx.beginPath();ctx.roundRect(cx,620,cw3-12,4,2);ctx.fill(); // top border color ctx.fillStyle=s.color; ctx.beginPath();ctx.roundRect(cx,620,cw3-12,4,2);ctx.fill(); txt(String(s.val),cx+(cw3-12)/2,720,72,s.color,'center','900','Arial Black'); txt(s.lbl,cx+(cw3-12)/2,755,22,'#555','center','700'); }); // separador ctx.fillStyle='#1a1a1a';ctx.fillRect(100,820,W-200,1); // TENGO PARA DAR txt('🔄 TENGO PARA DAR',100,880,30,'#C6FF00','left','700'); const repShow=repC.slice(0,40); let ry=920,rx=100; repShow.forEach((code,i)=>{ const cw=140,ch=44; if(rx+cw>W-100){rx=100;ry+=54;} ctx.fillStyle='rgba(255,68,68,.12)'; ctx.strokeStyle='rgba(255,68,68,.3)'; ctx.lineWidth=1; ctx.beginPath();ctx.roundRect(rx,ry,cw,ch,8);ctx.fill();ctx.stroke(); txt(code,rx+cw/2,ry+ch/2+8,20,'#FF8888','center','700'); rx+=cw+8; }); if(!repC.length){txt('Sin repetidas aún',100,960,24,'#444','left','500');} // separador const sepY=Math.max(ry+70,1020); ctx.fillStyle='#1a1a1a';ctx.fillRect(100,sepY,W-200,1); // ME FALTAN const faltY=sepY+50; txt('🔍 ME FALTAN',100,faltY,30,'#C6FF00','left','700'); const faltShow=faltC.slice(0,40); let fy=faltY+40,fx=100; faltShow.forEach((code)=>{ const cw=140,ch=44; if(fx+cw>W-100){fx=100;fy+=54;} ctx.fillStyle='rgba(198,255,0,.06)'; ctx.strokeStyle='rgba(198,255,0,.2)'; ctx.lineWidth=1; ctx.beginPath();ctx.roundRect(fx,fy,cw,ch,8);ctx.fill();ctx.stroke(); txt(code,fx+cw/2,fy+ch/2+8,20,'#C6FF00','center','700'); fx+=cw+8; }); // gasto const gastoY=Math.max(fy+80,1550); ctx.fillStyle='#141414'; ctx.beginPath();ctx.roundRect(100,gastoY,W-200,120,14);ctx.fill(); ctx.fillStyle='#C6FF00'; ctx.beginPath();ctx.roundRect(100,gastoY,W-200,4,2);ctx.fill(); txt('💰 HAS GASTADO',140,gastoY+44,28,'#888','left','700'); txt(' // ══ TOAST ══ function showToast(msg){const t=document.getElementById('toast');t.textContent=msg;t.classList.add('show');clearTimeout(t._t);t._t=setTimeout(()=>t.classList.remove('show'),2400);} // ══ BOOT ══ (async()=>{ const ok=await initSB(); if(!ok){hideSplash();showScreen('s-auth');showErr('Error de conexión. Recarga la página.');return;} try{ const{data:{session}}=await sb.auth.getSession(); if(session?.user){ user=session.user; user._name=user.user_metadata?.name||user.email?.split('@')[0]; await afterLogin(); }else{hideSplash();showScreen('s-auth');} }catch(e){hideSplash();showScreen('s-auth');} })(); +gasto.toLocaleString()+' MXN',140,gastoY+90,52,'#F0F0F0','left','900','Arial Black'); txt(sob.s+' sobres · '+sob.c+' cajas',W-140,gastoY+90,24,'#555','right','600'); // CTA bottom const ctaY=H-200; ctx.fillStyle='#0f0f0f'; ctx.beginPath();ctx.roundRect(100,ctaY,W-200,140,16);ctx.fill(); ctx.strokeStyle='rgba(198,255,0,.2)';ctx.lineWidth=1; ctx.beginPath();ctx.roundRect(100,ctaY,W-200,140,16);ctx.stroke(); txt('¿ME ALCANZAS?',W/2,ctaY+50,32,'#C6FF00','center','900'); txt('Descarga STKR26 gratis',W/2,ctaY+90,26,'#888','center','600'); txt('sktr26.pages.dev',W/2,ctaY+124,24,'#C6FF00','center','700'); // línea bottom neón ctx.fillStyle=grad; ctx.fillRect(0,H-4,W,4); // descargar const link=document.createElement('a'); link.download='stkr26-intercambios.png'; link.href=cv.toDataURL('image/png'); link.click(); showToast('PNG descargado — mándalo por WhatsApp 📋'); closeShare(); } function copyShare(){ const name=user?user._name||user.email?.split('@')[0]:'crack'; let peg=0,rep=0;const repC=[],faltC=[]; allC().forEach(c=>{const d=col[c];if(!d)faltC.push(c);else if(d.e==='p')peg++;else{rep++;repC.push(d.c>1?`${c}(${d.c}x)`:c);}}); const g=(sob.s*25)+(sob.c*2500); const repGroups={}; repC.forEach(c=>{const tid=c.split('-')[0];if(!repGroups[tid])repGroups[tid]=[];repGroups[tid].push(c);}); const faltGroups={}; faltC.slice(0,60).forEach(c=>{const tid=c.split('-')[0];if(!faltGroups[tid])faltGroups[tid]=[];faltGroups[tid].push(c);}); const repTxt=Object.entries(repGroups).map(([t,cs])=>`${TD[t]?.f||''} ${t}: ${cs.join(' ')}`).join('\n'); const faltTxt=Object.entries(faltGroups).map(([t,cs])=>`${TD[t]?.f||''} ${t}: ${cs.join(' ')}`).join('\n'); const txt=`♛ STKR26 — ÁLBUM MUNDIAL 2026 👤 @${name} — ${Math.round(peg/980*100)}% completado 📊 MI PROGRESO: ✅ Pegadas: ${peg} 🔁 Repetidas: ${rep} ❌ Faltan: ${Math.max(0,980-peg)} 🔄 TENGO PARA DAR (${rep} repetidas): ${repTxt||'Ninguna aún'} 🔍 ME FALTAN (${faltC.length} estampas): ${faltTxt||'¡Álbum completo! ♛'} 💰 HE GASTADO: ${g.toLocaleString()} MXN 📦 ${sob.s} sobres · ${sob.c} cajas ¿ME ALCANZAS? 👊 📱 sktr26.pages.dev`; navigator.clipboard.writeText(txt).catch(()=>{const ta=document.createElement('textarea');ta.value=txt;document.body.appendChild(ta);ta.select();document.execCommand('copy');document.body.removeChild(ta);}); showToast('Copiado — pégalo en WhatsApp 📋');closeShare(); } // ══ TOAST ══ function showToast(msg){const t=document.getElementById('toast');t.textContent=msg;t.classList.add('show');clearTimeout(t._t);t._t=setTimeout(()=>t.classList.remove('show'),2400);} // ══ BOOT ══ (async()=>{ const ok=await initSB(); if(!ok){hideSplash();showScreen('s-auth');showErr('Error de conexión. Recarga la página.');return;} try{ const{data:{session}}=await sb.auth.getSession(); if(session?.user){ user=session.user; user._name=user.user_metadata?.name||user.email?.split('@')[0]; await afterLogin(); }else{hideSplash();showScreen('s-auth');} }catch(e){hideSplash();showScreen('s-auth');} })();