/* ---------------------------
ESTILOS GENERALES
---------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');
body { overflow-x: hidden; font-family: "Quicksand", sans-serif; }
:root { --album-color-principal: #03BCF4; --album-color-texto: #007ca2; --tilt-left-near: 45deg; --tilt-left-far: 45deg; --tilt-right-near: 30deg; --tilt-right-far: 25deg; }
.btnU30 { color: var(--album-color-principal); padding: 8px 15px; font-size: 17px; font-weight: 900; text-transform: uppercase; border: 3px solid var(--album-color-principal); border-radius: 5px; transition: all 0.4s!important; text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em var(--album-color-principal); box-shadow: inset 0 0 0.5em 0 var(--album-color-principal), 0 0 10px 2px var(--album-color-principal); }
.btnU30:hover, 
.btnU30:focus, 
.btnU30:active { color: white; text-shadow: 0 0 0.125em #ffffff, 0 0 0.6em #fff; background-color: var(--album-color-principal)!important; box-shadow: 0 0 25px 10px hsla(193.9, 100%, 50%, 0.5); }

/* ---------------------------
ALBUM
---------------------------- */

#pgAlbum { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; padding: 0 5%; position: relative; flex-direction: column; }
#pgAlbum .cerrarFlipbook { position: absolute; top: -15px; left: 0; font-size: 14px; z-index: 1; cursor: pointer; }
#album-wrapper { overflow: visible; display: flex; justify-content: center; align-items: center; width: 100%; height: 50vw; max-width: 1800px; position: relative; }
#album { height: fit-content; display: flex; align-items: center; user-select: none; gap: 15px; }
#album .arrow { background: transparent; border: none; padding: 0; cursor: pointer; width: 65px; height: 60px; filter: drop-shadow(0 0 5px #03bcf4) drop-shadow(0 0 10px #03bcf4); display: flex; justify-content: center; align-items: center; transition: filter 0s; }
#album .arrow#prev { transform: rotate(-90deg); }
#album .arrow { transform: rotate(90deg); }
#album .arrow:hover { background: transparent; filter: drop-shadow(0 0 15px #03bcf4) drop-shadow(0 0 30px #03bcf4); }
#album .arrow:focus { background: transparent; }
#album .arrow:hover .triangle { background-color: #3ac2ec; }
#album .triangle-wrapper { width: 100%; height: 100%; clip-path: polygon(50% 0%, 0% 100%, 100% 100%); background-color: #03bcf4; display: flex; justify-content: center; align-items: center; border-radius: 5px; }
#album .triangle { width: 50px; height: 50px; clip-path: polygon(50% 0%, 0% 100%, 100% 100%); background-color: hsl(210, 50%, 14%); filter: blur(7px); }
#album .figurita .figlabel { display: none !important; }

/* -------------------  --------
FLIPBOOK
---------------------------- */

#flipbook { width: 100%; max-width: 1800px; height: auto; aspect-ratio: 2 / 1; }
#flipbook .hard {  border: none; }
#flipbook .hard small { font-style: italic; font-weight: lighter; opacity: 0.7; font-size: 14px; }
#flipbook .page { display: flex; background-color: #ffffff; flex-direction: column; justify-content: center; align-items: center; gap: 10px; }
#flipbook .page .cnt { box-shadow: inset 0 0 10px rgba(0,0,0,0.15); width: 100%; height: 100%; padding: 20px; }

/* ---------------------------
FIGURITAS
---------------------------- */

.page .figurita { width: 100%; aspect-ratio: 10/7; max-width: 260px; display: flex; height: fit-content; background-color: rgba(222,222,222,0.15); z-index: 1; position: relative; }
.page .figurita::before { content: attr(data-num); display: flex; position: absolute; left: 0; right: 0; top: 0; bottom: 0; justify-content: center; align-items: center; font-size: 32px; font-weight: bold; border: 6px solid #032f6b; color: rgba(0,0,0,0.3); width: 100%; height: 100%; }
.page .figurita img { display: block; width: 100%; height: 100%; object-fit: contain; position: relative; }
.page .figurita.disponible { box-shadow: inset 0 0 0.5em 0 var(--album-color-principal), 0 0 20px 5px var(--album-color-principal); cursor: pointer; }
.page .figurita.disponible::before { border-color: var(--album-color-principal); }
.figuritas-salientes .figcard img[data-rareza="rara"],
.figuritas-salientes .figcard img[data-rareza="legendaria"] { animation: salirFigurita 0.5s forwards, ring-spin 2.5s linear infinite; }
.figuritas-salientes img[data-rareza="rara"],
.figuritas-salientes img[data-rareza="legendaria"],
.dropzone img[data-rareza="rara"],
.dropzone img[data-rareza="legendaria"],
.carousel-track img[data-rareza="rara"],
.carousel-track img[data-rareza="legendaria"]{ border: 4px solid transparent; border-radius: 0; background-clip: padding-box; --glow-rgb: 255 255 255; --glowA: .65; box-shadow: 0 0 12px rgba(var(--glow-rgb) / calc(var(--glowA) * .9)), 0 0 28px rgba(var(--glow-rgb) / calc(var(--glowA) * .45));}
.figlabel[data-rareza="rara"] { color: #b517ff; text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em #b517ff; }
.figlabel[data-rareza="legendaria"] { color: #ffd54a; text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em #ffd54a; }
/* LEGENDARIA: dorados → naranjas con mucho glow */
.figuritas-salientes img[data-rareza="legendaria"],
.dropzone             img[data-rareza="legendaria"],
.carousel-track       img[data-rareza="legendaria"]{
  --ring-angle: 0deg;
  /* paleta dorada */
  --c1: #fff3b0; /* highlight */
  --c2: #ffd54a; /* gold */
  --c3: #ffb300; /* orange */
  --c4: #ff8c00; /* deep orange */
  border-image: conic-gradient(
    from var(--ring-angle),
    var(--c1) 0deg,
    var(--c2) 60deg,
    var(--c3) 180deg,
    var(--c4) 300deg,
    var(--c1) 360deg
  ) 1;
  animation: ring-spin 2.5s linear infinite;
  --glow-rgb: 255 180 40;  /* glow amarillo/naranja */
}

/* RARA: violeta → magenta → rosa con mucho glow */
.figuritas-salientes img[data-rareza="rara"],
.dropzone             img[data-rareza="rara"],
.carousel-track       img[data-rareza="rara"]{
  --ring-angle: 0deg;
  /* paleta violeta/rosa */
  --c1: #6a00ff; /* violeta */
  --c2: #b517ff; /* violeta claro */
  --c3: #a4258a; /* magenta */
  --c4: #ce8fff; /* rosa */
  border-image: conic-gradient(
    from var(--ring-angle),
    var(--c1) 0deg,
    var(--c2) 90deg,
    var(--c3) 210deg,
    var(--c4) 300deg,
    var(--c1) 360deg
  ) 1;
  animation: ring-spin 2.5s linear infinite;
  --glow-rgb: 170 0 220;   /* glow violeta */
}

/* ---------------------------
PAGINA JUGADOR
---------------------------- */

.page.jugador.page1 { background-image: url("/wp-content/uploads/figuritas/pag1.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page.jugador.page2 { background-image: url("/wp-content/uploads/figuritas/pag2.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page.jugador .cnt { display: flex; flex-direction: row; }
.page.jugador .cnt.odd { flex-direction: column; justify-content: center; gap: 25px; padding-left: 30px; }
.page.jugador .cnt.odd .wrapper1 { flex-direction: row; display: flex; gap: 25px; }
.page.jugador .cnt.odd .wrapper1 .col1 { width: max-content; }
.page.jugador .cnt.odd .wrapper1 .col1 h2 { color: #ffffff; font-size: 35px; font-weight: 700; text-align: center; }
.page.jugador .cnt.odd .wrapper1 .col1 h3 { color: #ffffff; font-size: 13px; font-weight: 500; text-align: center; }
.page.jugador .cnt.odd .wrapper1 .col1 .triple { width: 260px; }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita:not(:has(img)) { width: 260px; height: 182px; }
.page.jugador .cnt.odd .wrapper1 .col2 { display: flex; flex-direction: column; justify-content: flex-end; gap: 25px; width: 545px; }
.page.jugador .cnt.odd .wrapper1 .col2 p { font-size: 16px; color: #ffffff; text-align: center; font-weight: 500; }
.page.jugador .cnt.odd .wrapper1 .col2 .vertical .figurita { aspect-ratio: 7/10; width: unset; height: 260px; }
.page.jugador .cnt.odd .wrapper1 .col2 .vertical { display: flex; flex-direction: row; justify-content: space-evenly; width: 100%; margin-bottom: 20px; }
.page.jugador .cnt.odd .wrapper1 .col2 .horizontal { display: flex; flex-direction: row; gap: 25px; }
.page.jugador .cnt.odd .wrapper2 { display: flex; flex-direction: row; gap: 25px; width: 100%; }
.page.jugador .cnt.pair { gap: 120px; }
.page.jugador .cnt.pair .col { width: 50%; gap: 40px; align-items: center; justify-content: center; height: 100%; display: flex; flex-direction: column; }
.page.jugador .cnt.pair .col1 { align-items: flex-end; }
.page.jugador .cnt.pair .col2 { align-items: flex-start; }


.page .figurita.transparente:not(:has(img)) { background-size: cover; background-position: center; background-repeat: no-repeat; }
.page .figurita.transparente.disponible:not(:has(img)) { mask-size: cover; mask-position: center; mask-repeat: no-repeat; background-image: none; }
.page .figurita.transparente { background: none; }
.page .figurita.transparente.disponible { box-shadow: none; background-color: var(--album-color-principal); background-image: none!important; }
.page .figurita.transparente:has(img) { background: none!important; }
.page .figurita.transparente.disponible:has(img) { display: none!important; }
.page .figurita.transparente::before { border: none; }

/* ---------------------------
HISTORIA
---------------------------- */
.page.historia { background-size: cover; background-position: center; background-repeat: no-repeat; background-color: #032f6b!important; }
.page.historia.his1 { background-image: url("/wp-content/uploads/figuritas/historia1.png")!important; }
.page.historia.his2 { background-image: url("/wp-content/uploads/figuritas/historia2.png")!important; }
.page.historia.his3 { background-image: url("/wp-content/uploads/figuritas/historia3.png")!important; }
.page.historia.his4 { background-image: url("/wp-content/uploads/figuritas/historia4.png")!important; }
.page.historia.his5 { background-image: url("/wp-content/uploads/figuritas/historia5.png")!important; }
.page.historia.his6 { background-image: url("/wp-content/uploads/figuritas/historia6.png")!important; }
.page.historia.his7 { background-image: url("/wp-content/uploads/figuritas/historia7.png")!important; }

/* ---------------------------
JUGADORES
---------------------------- */

/* AGUS */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="57"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/57b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="58"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/58b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="59"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/59b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="57"].disponible { mask-image: url("/wp-content/uploads/figuritas/57b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="58"].disponible { mask-image: url("/wp-content/uploads/figuritas/58b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="59"].disponible { mask-image: url("/wp-content/uploads/figuritas/59b-sm.webp"); }

/* BENJI */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="75"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/75b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="76"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/76b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="77"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/77b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="75"].disponible { mask-image: url("/wp-content/uploads/figuritas/75b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="76"].disponible { mask-image: url("/wp-content/uploads/figuritas/76b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="77"].disponible { mask-image: url("/wp-content/uploads/figuritas/77b-sm.webp"); }

/* CAVE */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="93"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/93b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="94"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/94b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="95"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/95b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="93"].disponible { mask-image: url("/wp-content/uploads/figuritas/93b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="94"].disponible { mask-image: url("/wp-content/uploads/figuritas/94b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="95"].disponible { mask-image: url("/wp-content/uploads/figuritas/95b-sm.webp"); }

/* CHELO */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="111"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/111b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="112"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/112b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="113"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/113b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="111"].disponible { mask-image: url("/wp-content/uploads/figuritas/111b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="112"].disponible { mask-image: url("/wp-content/uploads/figuritas/112b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="113"].disponible { mask-image: url("/wp-content/uploads/figuritas/113b-sm.webp"); }

/* DINO */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="129"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/129b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="130"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/130b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="131"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/131b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="129"].disponible { mask-image: url("/wp-content/uploads/figuritas/129b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="130"].disponible { mask-image: url("/wp-content/uploads/figuritas/130b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="131"].disponible { mask-image: url("/wp-content/uploads/figuritas/131b-sm.webp"); }

/* EZE */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="147"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/147b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="148"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/148b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="149"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/149b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="147"].disponible { mask-image: url("/wp-content/uploads/figuritas/147b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="148"].disponible { mask-image: url("/wp-content/uploads/figuritas/148b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="149"].disponible { mask-image: url("/wp-content/uploads/figuritas/149b-sm.webp"); }

/* FEFO */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="165"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/165b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="166"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/166b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="167"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/167b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="165"].disponible { mask-image: url("/wp-content/uploads/figuritas/165b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="166"].disponible { mask-image: url("/wp-content/uploads/figuritas/166b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="167"].disponible { mask-image: url("/wp-content/uploads/figuritas/167b-sm.webp"); }

/* FEDE */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="183"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/183b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="184"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/184b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="185"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/185b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="183"].disponible { mask-image: url("/wp-content/uploads/figuritas/183b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="184"].disponible { mask-image: url("/wp-content/uploads/figuritas/184b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="185"].disponible { mask-image: url("/wp-content/uploads/figuritas/185b-sm.webp"); }

/* JONA */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="201"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/201b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="202"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/202b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="203"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/203b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="201"].disponible { mask-image: url("/wp-content/uploads/figuritas/201b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="202"].disponible { mask-image: url("/wp-content/uploads/figuritas/202b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="203"].disponible { mask-image: url("/wp-content/uploads/figuritas/203b-sm.webp"); }

/* LALO */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="219"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/219b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="220"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/220b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="221"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/221b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="219"].disponible { mask-image: url("/wp-content/uploads/figuritas/219b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="220"].disponible { mask-image: url("/wp-content/uploads/figuritas/220b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="221"].disponible { mask-image: url("/wp-content/uploads/figuritas/221b-sm.webp"); }

/* NANDY */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="237"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/237b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="238"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/238b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="239"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/239b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="237"].disponible { mask-image: url("/wp-content/uploads/figuritas/237b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="238"].disponible { mask-image: url("/wp-content/uploads/figuritas/238b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="239"].disponible { mask-image: url("/wp-content/uploads/figuritas/239b-sm.webp"); }

/* PABLO */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="255"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/255b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="256"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/256b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="257"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/257b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="255"].disponible { mask-image: url("/wp-content/uploads/figuritas/255b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="256"].disponible { mask-image: url("/wp-content/uploads/figuritas/256b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="257"].disponible { mask-image: url("/wp-content/uploads/figuritas/257b-sm.webp"); }

/* PANDITA */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="273"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/273b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="274"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/274b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="275"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/275b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="273"].disponible { mask-image: url("/wp-content/uploads/figuritas/273b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="274"].disponible { mask-image: url("/wp-content/uploads/figuritas/274b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="275"].disponible { mask-image: url("/wp-content/uploads/figuritas/275b-sm.webp"); }

/* RAUKEN */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="291"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/291b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="292"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/292b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="293"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/293b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="291"].disponible { mask-image: url("/wp-content/uploads/figuritas/291b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="292"].disponible { mask-image: url("/wp-content/uploads/figuritas/292b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="293"].disponible { mask-image: url("/wp-content/uploads/figuritas/293b-sm.webp"); }

/* SANTINO */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="309"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/309b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="310"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/310b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="311"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/311b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="309"].disponible { mask-image: url("/wp-content/uploads/figuritas/309b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="310"].disponible { mask-image: url("/wp-content/uploads/figuritas/310b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="311"].disponible { mask-image: url("/wp-content/uploads/figuritas/311b-sm.webp"); }

/* YASON */
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="327"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/327b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="328"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/328b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="329"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/329b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="327"].disponible { mask-image: url("/wp-content/uploads/figuritas/327b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="328"].disponible { mask-image: url("/wp-content/uploads/figuritas/328b-sm.webp"); }
.page.jugador .cnt.odd .wrapper1 .col1 .triple .figurita[data-num="329"].disponible { mask-image: url("/wp-content/uploads/figuritas/329b-sm.webp"); }
.page.jugador .cnt p.ajusteFuente { font-size: 15px!important; margin-bottom: 0; }

/* ---------------------------
PAGINA PARTIDOS
---------------------------- */

.page.partidos .cnt { display: flex; flex-direction: row; flex-wrap: wrap; row-gap: 30px; padding: 40px; align-content: center; justify-content: center; align-items: center; }
.page.partidos.page1 .cnt { align-content: flex-end; }

/* ---------------------------
PAGINAS MUNDIAL U30
---------------------------- */

.page.mundial .cnt { display: flex; flex-direction: row; flex-wrap: wrap; gap: 50px 20px; padding: 60px 40px!important; align-content: flex-end; justify-content: center; align-items: center; }
.page.mundial.page1 h3 { font-size: 55px; font-weight: 700; color: #032f6b; width: 100%; text-align: center; }
.page.mundial.page2 .vertical { display: flex; flex-direction: row; width: 100%; justify-content: space-between; }
.page.mundial.page2 .vertical .figurita { aspect-ratio: 7/10; width: unset; height: 260px; }
.page.mundial.page3 .vertical { display: flex; flex-direction: row; width: 100%; justify-content: space-between; }
.page.mundial.page3 .vertical .figurita { aspect-ratio: 7/10; width: unset; height: 260px; }
.page.mundial.page3 .cnt { justify-content: space-between; gap: 60px; align-content: center; padding: 40px 100px!important; }
.page.mundial .figurita[data-num="10"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/10b-sm.webp"); }
.page.mundial .figurita[data-num="10"].disponible { mask-image: url("/wp-content/uploads/figuritas/10b-sm.webp"); }
.page.mundial .figurita[data-num="13"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/13b-sm.webp"); }
.page.mundial .figurita[data-num="13"].disponible { mask-image: url("/wp-content/uploads/figuritas/13b-sm.webp"); }
.page.mundial.page1 { background-image: url("/wp-content/uploads/figuritas/hojaMarmolIzq.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page.mundial.page2 { background-image: url("/wp-content/uploads/figuritas/hojaMarmolDer.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page.mundial.page3 { background-image: url("/wp-content/uploads/figuritas/hojaMarmolIzq.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }

/* ---------------------------
PAGINAS COPAS
---------------------------- */

.page.copas .cnt { display: flex; flex-direction: row; gap: 50px 20px; padding: 25px 60px!important; align-content: flex-end; justify-content: center; align-items: center; }
.page.copas .cnt .col1 { width: 35%; position: relative; display: flex; flex-direction: column; height: 100%; justify-content: flex-end; gap: 65px; padding-bottom: 55px; }
.page.copas .cnt .col2 { width: 65%; margin-bottom: 15px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; gap: 30px 75px; }
.page.copas .cnt .col2 .figurita { aspect-ratio: 7/10; width: unset; height: 260px; }
.page.copas.page2 .vertical { width: 100%; display: flex; justify-content: space-between; }
.page.copas.page2 .vertical .figurita { aspect-ratio: 7/10; width: unset; height: 260px; }
.page.copas.page2 .cnt { flex-direction: column; }
.page.copas h3 { position: absolute; top: 55px; font-size: 35px; font-weight: 700; color: #032f6b; }
.page.copas.page1 { background-image: url("/wp-content/uploads/figuritas/hojaMarmolDer.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page.copas.page2 { background-image: url("/wp-content/uploads/figuritas/hojaMarmolIzq.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }

/* ---------------------------
PAGINAS COMIENZOS
---------------------------- */

.page.comienzos .cnt { display: flex; flex-direction: row; gap: 50px 20px; padding: 50px 60px!important; align-content: flex-end; justify-content: center; align-items: center; }
.page.comienzos .cnt .col1 { width: 33%; justify-content: space-between; display: flex; height: 100%; flex-direction: column; }
.page.comienzos .cnt .col2 { width: 33%; justify-content: space-between; display: flex; height: 100%; flex-direction: column; align-items: center; }
.page.comienzos .cnt .col3 { width: 33%; justify-content: space-between; display: flex; height: 100%; flex-direction: column; }
.page.comienzos .figurita.vertical { aspect-ratio: 7/10; width: unset; height: 260px; max-width: fit-content; }
.page.comienzos .figurita[data-num="46"]::before { border: none; }
.page.comienzos .figurita[data-num="46"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/46b-sm.webp"); }
.page.comienzos .figurita[data-num="46"].disponible { mask-image: url("/wp-content/uploads/figuritas/46b-sm.webp"); }
.portadaComienzosU30 { background-image: url("/wp-content/uploads/figuritas/comienzosDer.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page.comienzos { background-image: url("/wp-content/uploads/figuritas/comienzosIzq.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.portadaComienzosU30 .cnt { padding: 60px 100px 80px!important; color: #fff; font-weight: 700; }
.portadaComienzosU30 .cnt h3 { font-size: 200px; line-height: 170px; text-align: center;font-weight: 700; }
.portadaComienzosU30 .cnt h4 { font-size: 100px; line-height: 70px; text-align: center; margin-bottom: 60px;font-weight: 700; }
.portadaComienzosU30 .cnt p { font-size: 16px; font-weight: 700; }

/* ---------------------------
PAGINA ESCUDO
---------------------------- */

.page.escudo .cnt { display: flex; flex-direction: row; padding: 185px!important; background-color: #232323!important; align-content: center; flex-wrap: wrap; justify-content: center; align-items: center; }
.page.escudo .figurita { aspect-ratio: 7/10; width: unset; height: 260px; }
.page.escudo .figurita::before { border: none; }
.page.escudo .figurita[data-num="53"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/53b-sm.webp"); }
.page.escudo .figurita[data-num="53"].disponible { mask-image: url("/wp-content/uploads/figuritas/53b-sm.webp"); }
.page.escudo .figurita[data-num="54"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/54b-sm.webp"); }
.page.escudo .figurita[data-num="54"].disponible { mask-image: url("/wp-content/uploads/figuritas/54b-sm.webp"); }
.page.escudo .figurita[data-num="55"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/55b-sm.webp"); }
.page.escudo .figurita[data-num="55"].disponible { mask-image: url("/wp-content/uploads/figuritas/55b-sm.webp"); }
.page.escudo .figurita[data-num="56"]:not(:has(img)) { background-image: url("/wp-content/uploads/figuritas/56b-sm.webp"); }
.page.escudo .figurita[data-num="56"].disponible { mask-image: url("/wp-content/uploads/figuritas/56b-sm.webp"); }

/* ---------------------------
PAGINAS EXTRA
---------------------------- */

.tapa { background-image: url("/wp-content/uploads/figuritas/tapa.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.contratapa { background-image: url("/wp-content/uploads/figuritas/contratapa.png")!important; background-color: #000!important; background-size: contain; background-position: center; background-repeat: no-repeat; }
.diarios { background-image: url("/wp-content/uploads/figuritas/diarios.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.medallas { background-image: url("/wp-content/uploads/figuritas/medallas.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.indice { background-color: #20201b!important; }
.indice2 { background-color: #20201b!important; }
.indice span { color: var(--album-color-principal); font-size: 14px; display: inline-block; cursor: pointer; position: relative; }
.indice .cnt { display: flex; flex-direction: column; gap: 7px; padding: 45px 70px!important; }
.indice .cnt h3 { font-size: 30px; text-align: center; width: 100%; color: var(--album-color-principal); margin-bottom: 30px; }
.indice .cnt .jugadores2025 { margin: 30px 0 15px; }
.agradecimientos { background-image: url("/wp-content/uploads/figuritas/agradecimientos.png")!important; background-size: cover; background-position: center; background-repeat: no-repeat; }
.tapaFinal { background-image: url("/wp-content/uploads/figuritas/tapaFinal.png")!important; background-color: #000!important; background-size: contain; background-position: center; background-repeat: no-repeat; }

.indice .cnt > span[data-target]{
  display: flex !important;      
  align-items: baseline;
  gap: 10px;
  white-space: nowrap;
}

/* Puntitos en el medio */
.indice .cnt > span[data-target]::before{
  content: "";
  order: 1;                      
  flex: 1 1 auto;               
  border-bottom: 2px dotted rgba(255, 255, 255, 0.2);
  height: 0.7em;
  transform: translateY(0.12em); 
  pointer-events: none;
}

/* Número al final: lee del data-page */
.indice .cnt > span[data-target]::after{
  content: attr(indice-page);
  order: 2;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
  padding-left: 6px;
}

/* ---------------------------
POPUP SOBRE
---------------------------- */

#popupSobre.hidden { display: none; }
#popupSobre { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 9999; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
#popupSobre .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); backdrop-filter: blur(5px); }
#popupSobre .popup-content { position: relative; display: flex; flex-direction: column; align-items: center; gap: 60px; }
#popupSobre .cnt-sobres { position: relative; display: flex; flex-direction: row; align-items: center; width: fit-content; z-index: 1; gap: 50px; padding: 0 30px; justify-content: center; }
#popupSobre .popup-content .sobres { display: flex; }
#popupSobre .sobre-img.cerrado, #popupSobre .sobre-img.abierto { cursor: pointer; transition: transform 0.3s; display: none; width: 100%; max-width: 250px; margin: 0 auto; }
#popupSobre .sobres.lateral { display: none; }
#popupSobre .sobres.lateral.lat1.mostrar, 
#popupSobre .sobres.lateral.lat2.mostrar { display: block; animation: moverHaciaIzquierda 0.5s ease forwards; }
#popupSobre .sobres.lateral.lat3.mostrar, 
#popupSobre .sobres.lateral.lat4.mostrar { display: block; animation: moverHaciaDerecha 0.5s ease forwards; }
#popupSobre .sobre-img.abierto { transition: opacity 0.6s; }
#popupSobre .sobre-img.abierto.desvanecer { opacity: 0; }
#popupSobre .sobre-img.cerrado:hover { transform: scale(1.05); }
#popupSobre #abrirMultiplesSobres { display: none; transition: opacity 0.3s, filter 0.3s; border: 3px solid var(--album-color-principal); }
#popupSobre #abrirMultiplesSobres.activo { display: block; }
#popupSobre.abrir-cinco-sobres .btnPegarFiguritas { position: fixed; bottom: 3vh; display: block; width: fit-content; }
#popupSobre.abrir-cinco-sobres .figuritas-salientes { bottom: 30px; }
#popupSobre.abrir-cinco-sobres .figuritas-salientes .figcard img { max-height: 135px; max-width: 135px; }
#popupSobre .figuritas-salientes .figlabel { opacity: 0; transition: opacity .35s ease; width: 100%; text-overflow: ellipsis; overflow: hidden; }
#contadorSobres { position: absolute; top: 0; right: -4px; background-color: rgb(64, 116, 189); color: white; font-size: 12px; font-weight: bold; width: 22px; height: 22px; padding: 5px; min-width: min-content; border-radius: 22px; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }
#contadorSobresPremium { position: absolute; top: 0; right: 12px; background-color: #2dceff; color: #4b4b4b; font-size: 12px; font-weight: bold; width: 22px; height: 22px; padding: 5px; min-width: min-content; border-radius: 22px; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }

/* ---------------------------
FIGURITAS SALIENTES SOBRES
---------------------------- */

.figuritas-salientes.mostrar { display: grid; }
.figuritas-salientes { grid-template-columns: repeat(5, 1fr); gap: 12px; width: 80vw; margin: auto; align-items: center; padding: 10px 0; position: fixed; top: 0; left: 0; right: 0; bottom: 30px; z-index: 2; border-radius: 8px; display: none; height: fit-content; max-width: 1200px; }
.figuritas-salientes .figcard img { max-width: 100%; width: fit-content; max-height: 240px; height: auto; object-fit: contain; opacity: 0; animation: salirFigurita 0.5s forwards; }
.figuritas-salientes .figcard:nth-child(1) img { animation-delay: 0.5s; }
.figuritas-salientes .figcard:nth-child(2) img { animation-delay: 1.5s; }
.figuritas-salientes .figcard:nth-child(3) img { animation-delay: 2.5s; }
.figuritas-salientes .figcard:nth-child(4) img { animation-delay: 3.5s; }
.figuritas-salientes .figcard:nth-child(5) img { animation-delay: 4.5s; }
.figuritas-salientes .figcard { position: relative; width: 100%; margin: 0 auto; overflow: hidden; } /* asegura anclaje para la cocarda */
.figuritas-salientes .cocarda-nueva { position: absolute; right: 5px; bottom: 5px; width: 50px!important; height: fit-content!important; opacity: 0; transform: scale(.9); pointer-events: none; z-index: 3; }

/* ---------------------------
KEYFRAMES
---------------------------- */

@keyframes moverHaciaIzquierda { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } }
@keyframes moverHaciaDerecha { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } }
@keyframes salirFigurita { to { transform: translateY(0); opacity: 1; } }
@keyframes aparecerLabel { to { opacity: 1; } }
@keyframes u30-pulse-dot { 0% { transform: scale(1); } 50% { transform: scale(1.35); } 100% { transform: scale(1); }}
@keyframes aparecerCocarda { to { opacity: 1; transform: scale(1); } }
@property --ring-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes ring-spin { to { --ring-angle: 360deg; } }

/* ---------------------------

---------------------------- */

#btnPegarNuevas { display: none; }
.btnPegarFiguritas { position: absolute; bottom: -80px; display: none; z-index: 3; }
#btnAbrirPopup { position: relative; width: auto; height: 50px; width: 50px; object-fit: contain; cursor: pointer; transition: transform 0.3s ease; }
#btnAbrirPopup:hover { transform: scale(1.1); }
#btnAbrirPopupPremium { position: relative; width: auto; height: 50px; width: 35px; filter: drop-shadow(0 0 13px #03bcf4) drop-shadow(0 0 23px #03bcf4) drop-shadow(0 0 33px #03bcf4) drop-shadow(0 0 38px #03bcf4); object-fit: contain; cursor: pointer; transition: transform 0.3s ease; }
#btnAbrirPopupPremium:hover { transform: scale(1.1); }
.botonesAlbum { position: absolute; width: fit-content; right: 0; top: -105px; z-index: 6; display: flex; flex-direction: row; gap: 20px; align-items: center; }
.botonesAlbum span { color: #3ac2ec; text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em #03bcf4; font-size: 13px; margin-top: 3px; }
.botonesAlbum .premium .texto-premium { color:#03bbf4; text-shadow: none; filter: drop-shadow(0 0 1px #03bcf4) drop-shadow(0 0 5px #03bcf4) drop-shadow(0 0 13px #03bcf4); }
.btn-mazo-wrapper { position: relative; display: flex; flex-direction: column; align-items: center; cursor: pointer; }
.btn-mazo-wrapper .icono { width: 50px; height: 50px; }
.btn-sobre-wrapper { position: relative; display: flex; align-items: center; flex-direction: column; }
.btn-disabled { position: relative; cursor: default; pointer-events: auto; user-select: none; font-size: 13px; }
.btn-disabled > * { filter: grayscale(60%); opacity: 0.4; pointer-events: none; user-select: none; }
.btn-disabled:hover::before, 
.btn-disabled:focus::before { content: attr(data-tooltip); position: absolute; bottom: -25px; left: 50%; transform: translateX(-50%); background: #ffffff; color: #007ca2; padding: 6px 10px; border-radius: 5px; white-space: nowrap; font-size: 14px; box-shadow: 0 2px 6px rgba(255, 255, 255, 0.3); opacity: 1; pointer-events: none; z-index: 1000; transition: opacity 0.2s ease-in-out; }
.btn-disabled:hover::after, 
.btn-disabled:focus::after { content: ""; position: absolute; bottom: 7px; left: 50%; transform: translateX(-50%); border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #ffffff; z-index: 1001; pointer-events: none; opacity: 1; transition: opacity 0.2s ease-in-out; }
.btn-disabled::after, 
.btn-disabled::before { opacity: 0; font-weight: bold; pointer-events: none; transition: opacity 0.2s ease-in-out; }

/* ---------------------------
POPUP MAZO
---------------------------- */

#popupMazo.hidden { display: none; }
#popupMazo { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 9999; user-select: none; }
#popupMazo .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); backdrop-filter: blur(5px); }
#popupMazo .popup-content { position: relative; z-index: 10000; display: flex; flex-direction: column; align-items: center; }
#contadorFiguritas { position: absolute; top: 0; right: -4px; background-color: rgb(64, 116, 189); color: white; font-size: 12px; font-weight: bold; width: 22px; height: 22px; padding: 5px; min-width: min-content; border-radius: 22px; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }

/* ---------------------------
CARROUSEL
---------------------------- */

.carousel-container { position: relative; -webkit-perspective: 1500px; perspective: 1500px; width: 100%; height: 500px; overflow: visible; display: flex; justify-content: center; align-items: center; perspective: 1500px; flex-direction: column; }
.carousel-track { position: relative; width: 100%; display: flex; justify-content: center; align-items: center; height: 100%; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; isolation: isolate; perspective: 1000px; }
.carousel-track img { position: absolute; will-change: transform, opacity; user-select: none; top: 50%; left: 50%; max-width: 20vw; width: fit-content; object-fit: contain; max-height: 250px; max-width: 250px; backface-visibility: hidden; transition: transform 0.6s ease, opacity 0.6s ease; opacity: 0; transform-origin: center center; }
.carousel-track img.center { opacity: 1; z-index: 50; -webkit-transform: translate(-50%, -50%) translateZ(64px) scale(1.5) rotateY(0deg); transform: translate(-50%, -50%) translateZ(64px) scale(1.5) rotateY(0deg); }
.carousel-track img.left1  { opacity: 1; z-index: 40; -webkit-transform: translate(calc(-50% - var(--spread-1, 20vw)), -50%) translateZ(32px) scale(1) rotateY(45deg); transform: translate(calc(-50% - var(--spread-1, 20vw)), -50%) translateZ(32px) scale(1) rotateY(45deg); }
.carousel-track img.right1 { opacity: 1; z-index: 40; -webkit-transform: translate(calc(-50% + var(--spread-1, 20vw)), -50%) translateZ(32px) scale(1) rotateY(var(--tilt-right-near)); transform: translate(calc(-50% + var(--spread-1, 20vw)), -50%) translateZ(32px) scale(1) rotateY(var(--tilt-right-near)); }
.carousel-track img.left2  { opacity: .8; z-index: 30; -webkit-transform: translate(calc(-50% - var(--spread-2, 38vw)), -50%) translateZ(0px) scale(.85) rotateY(45deg); transform: translate(calc(-50% - var(--spread-2, 38vw)), -50%) translateZ(0px) scale(.85) rotateY(45deg); }
.carousel-track img.right2 { opacity: .8; z-index: 30; -webkit-transform: translate(calc(-50% + var(--spread-2, 38vw)), -50%) translateZ(0px) scale(.85) rotateY(var(--tilt-right-far)); transform: translate(calc(-50% + var(--spread-2, 38vw)), -50%) translateZ(0px) scale(.85) rotateY(var(--tilt-right-far)); }
.carousel-track img.off-left  { opacity: 0; z-index: 10; -webkit-transform: translate(calc(-50% - var(--spread-2, 38vw)), -50%) translateZ(-32px) scale(.85) rotateY(45deg); transform: translate(calc(-50% - var(--spread-2, 38vw)), -50%) translateZ(-32px) scale(.85) rotateY(45deg); }
.carousel-track img.off-right { opacity: 0; z-index: 10; -webkit-transform: translate(calc(-50% + var(--spread-2, 38vw)), -50%) translateZ(-32px) scale(.85) rotateY(var(--tilt-right-far)); transform: translate(calc(-50% + var(--spread-2, 38vw)), -50%) translateZ(-32px) scale(.85) rotateY(var(--tilt-right-far)); }
.carousel-track img.off-left-initial { opacity: 0; z-index: 10; transform: translate(calc(-50% - 38vw), -50%) scale(0.85) rotateY(45deg); transition: none; }
.carousel-track img.off-right-initial { opacity: 0; z-index: 10; transform: translate(calc(-50% + 38vw), -50%) scale(0.85) rotateY(var(--tilt-right-far)); transition: none; }
.carousel-track p { color: #555; }
.flechasCarousel { display: flex; position: relative; column-gap: 20px; }
.flechasCarousel .carousel-btn { background: transparent; border: none; padding: 0; cursor: pointer; width: 50px; height: 45px; filter: drop-shadow(0 0 5px #03bcf4) drop-shadow(0 0 10px #03bcf4); display: flex; justify-content: center; align-items: center; transition: filter 0s; }
.flechasCarousel .carousel-btn.prev { transform: rotate(-90deg); }
.flechasCarousel .carousel-btn.next { transform: rotate(90deg); }
.flechasCarousel .triangle-wrapper { width: 100%; height: 100%; clip-path: polygon(50% 0%, 0% 100%, 100% 100%); background-color: #03bcf4; display: flex; justify-content: center; align-items: center; border-radius: 5px; }
.flechasCarousel .triangle { width: 35px; height: 35px; clip-path: polygon(50% 0%, 0% 100%, 100% 100%); background-color: hsl(210, 50%, 14%); filter: blur(7px); }
.flechasCarousel .carousel-btn:hover .triangle { background-color: #3ac2ec; }
.flechasCarousel .carousel-btn:hover { background: transparent; filter: drop-shadow(0 0 15px #03bcf4) drop-shadow(0 0 30px #03bcf4); }
.flechasCarousel .carousel-btn:focus { background: transparent; }

/* ---------------------------
SALA DE INTERCAMBIO
---------------------------- */

.btn-intercambio-wrapper { position: relative; display: inline-block; }
#btnIntercambio { appearance: none; display: flex; flex-direction: column; align-items: center; border: none; background: none!important; color: var(--album-color-principal); padding: 0; cursor: pointer; }
#btnIntercambio .icono { width: 50px; height: 50px; }
#intercambioMenu { display: none; position: absolute; top: calc(100% + 8px); left: 0; width: fit-content; background: #fff; border: none; border-radius: 0; z-index: 1000; }
.opcionIntercambio { position: relative; padding: 5px 25px 5px 10px; cursor: pointer; color: var(--album-color-texto); display: flex; width: 155px; align-items: center; box-shadow: inset 0 0 10px var(--album-color-principal); border: 1px solid var(--album-color-principal); user-select: none; transition: background .12s ease; font-size: 10px; font-weight: 900; white-space: nowrap; text-transform: uppercase; line-height: 20px; }
.opcionIntercambio:hover { color: #fff; background: var(--album-color-principal); }
.opcionIntercambio[data-tipo="online"]::after { content: "›"; margin-left: 10px; font-size: 16px; position: absolute; right: 15px; top: 3px; }
.btn-intercambio-wrapper.is-open #intercambioMenu { display: block; }
#usuariosOnline { display: none; position: absolute; top: -1px; left: calc(100% + 1px); width: 155px; min-height: 32px; color: var(--album-color-texto); text-align: center; max-height: 320px; overflow: auto; background: #fff; border: none; line-height: 30px; border-radius: 0; z-index: 1001; box-shadow: inset 0 0 10px var(--album-color-principal); border: 1px solid var(--album-color-principal); }
.opcionIntercambio.submenu-open #usuariosOnline { display: block; }
#usuariosOnline img { display: none; }
#usuariosOnline .usuario-item { display: flex; align-items: center; justify-content: center; border-radius: 0; text-align: center; color: var(--album-color-texto); position: relative; }
#usuariosOnline .usuario-item.invitado { color: #fff!important; background: var(--album-color-principal); }
#usuariosOnline button { display: none; position: absolute; left: 0; padding: 0; bottom: 0; top: 0; color: #fff; font-size: 12px; right: 0; border: none; background: var(--album-color-principal); border-radius: 0; cursor: pointer; font-size: 10px; font-weight: 900; text-transform: uppercase; }
#listaInvitaciones { position: absolute; z-index: 2; background-color: rgba(0,0,0,0.8); right: 0; margin: 0 auto; height: fit-content; left: 0; width: fit-content; top: -15px; padding: 15px; border-radius: 0; display: none; border: 3px solid var(--album-color-principal); box-shadow: inset 0 0 0.5em 0 var(--album-color-principal), 0 0 10px 2px var(--album-color-principal); border-radius: 5px; }
#listaInvitaciones .inv-item { display: flex; align-items: center; }
#listaInvitaciones .buttons { display: flex; gap: 6px; }
#listaInvitaciones .buttons .btnU30 { font-size: 12px; }
#listaInvitaciones .inv-item .usuario { flex: 1; margin-right: 15px; }
#listaInvitaciones .inv-item .usuario .nombre { font-weight: 700; font-size: 18px; color: var(--album-color-principal); }
#listaInvitaciones .inv-item .usuario .text { color: #fff; font-weight: 600; font-size: 12px; }
#listaInvitaciones .inv-item img { display: none; }
#listaInvitaciones .inv-item + .inv-item { margin-top: 20px; }
.caja-intercambio { margin: 20px 0; display: flex; align-items: center; }
.caja-intercambio .mitades { position: relative; width: 50%; height: fit-content; border: 2px solid var(--album-color-principal); }
.caja-intercambio .mitad { display: flex; position: relative; }
.caja-intercambio .mitad.inferior { border-top: 2px solid var(--album-color-principal); }
.caja-intercambio .acciones { display: flex; align-items: center; }
.caja-intercambio .dropzone img { width: auto; height: fit-content; max-height: 140px; object-fit: contain; pointer-events: none; }
.caja-intercambio .reglas { width: calc(25% - 60px); border-top: 5px solid var(--album-color-principal); padding: 30px; margin: 30px; background: linear-gradient(45deg,#4f4f4f,#000,#4f4f4f); border-radius: 0 0 10px 10px; }
.caja-intercambio .reglas p { font-size: 12px; color: #0090bb; font-weight: 700; }
.caja-intercambio .reglas .tit {font-size: 17px; font-weight: 900; color: var(--album-color-principal); }
.caja-intercambio .reglas .subtit {font-size: 14px; font-weight: 900; color: var(--album-color-principal); }
.caja-intercambio .reglas .usuario { font-size: 13px; color: var(--album-color-principal); }
.caja-intercambio .mensajes { width: 25%; padding: 30px; }
.dropzone { min-height: 180px; max-height: 180px; overflow-x: hidden; overflow-y: auto; padding: 20px 110px 20px 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; overscroll-behavior: contain; scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: var(--drop-scroll-thumb, #55C1FF) var(--drop-scroll-track, rgba(85, 193, 255, .15)); }
.dropzone { contain: layout paint; }
.dropzone::-webkit-scrollbar { width: 6px; height: 6px; }
.dropzone::-webkit-scrollbar-track { background: var(--drop-scroll-track, rgba(85,193,255,.15)); border-radius: 8px; }
.dropzone::-webkit-scrollbar-thumb { background: var(--drop-scroll-thumb, #55C1FF); border-radius: 8px; }
.dropzone::-webkit-scrollbar-thumb:hover { background: #30afff; }
.dropzone::-webkit-scrollbar-thumb:active { background: #149df4; }
.mitad.inferior .dropzone { background-color: #737373; opacity: 0.5; cursor: not-allowed; }
.album-sala-activa .elementor-location-header { display: none !important; }
.album-sala-salir { position: fixed; z-index: 9999; top: 50px; right: 30px; cursor: pointer; }
.album-sala-salir:hover { filter: brightness(0.98); }
#btnAceptarIntercambio { opacity: 0.5; background-color: white; color: var(--album-color-texto); white-space: normal; border: 2px solid var(--album-color-principal); pointer-events: none; font-weight: 700; border-radius: 5px; }
#btnAceptarIntercambio.btn-aceptar--enabled { opacity: 1; pointer-events: initial; }
#btnAceptarIntercambio.btn-aceptar--accepted { background-color: var(--album-color-principal); color: #fff; opacity: 1; pointer-events: initial; text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em var(--album-color-principal); box-shadow: 0 0 0.5em 0 var(--album-color-principal), 0 0 10px 2px var(--album-color-principal); }
#dropYo.locked { cursor: not-allowed; opacity: 0.5; background: #737373; }
#dropYo.locked img { filter: grayscale(); }
.mitad .btnListo { color: var(--album-color-principal); padding: 8px 15px; font-size: 17px; font-weight: 900; text-transform: uppercase; border: 3px solid var(--album-color-principal); border-radius: 5px; transition: all 0.4s!important; text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em var(--album-color-principal); box-shadow: inset 0 0 0.5em 0 var(--album-color-principal), 0 0 10px 2px var(--album-color-principal); position: absolute; right: 25px; top: 20px; }
.mitad .btnListo:focus, .mitad .btnListo:hover { background: transparent; }
#btnListoOtro { opacity: 0.5; pointer-events: none; }
.btnListo.is-ready { background-color: var(--album-color-principal)!important; color: #fff!important; }
#btnListoYo:disabled { opacity: 0.5; }
.balance-tip { position: absolute; left: calc(100% + 30px); top: 0; bottom: 0; margin: auto; display: none; font-size: 12px; color: #fff; font-weight: 700; line-height: 1; height: fit-content; padding: 6px 10px; width: 30%; max-width: 230px; line-height: 20px; border-radius: 3px; background: #490000; border-color: var(--album-color-principal); z-index: 5; }
.balance-tip.need { border-color: #6f0000; }
#dropYo .drop-item { position: relative; display: inline-block; margin: 0 6px; }
#dropYo .drop-item img { display: block; user-select: none; }
#dropYo .fig-close { position: absolute; top: 20px; right: -8px; width: 22px; height: 22px; border-radius: 50%; border: none; background: var(--album-color-texto); color: #fff; font-weight: 900; line-height: 22px; padding: 0; display: block; text-align: center; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
#dropYo.locked .fig-close { opacity: 1; pointer-events: auto; }
#salaIntercambio .carousel-track img { max-height: 120px; max-width: 150px; }
#salaIntercambio .carousel-container { height: 260px; margin-bottom: 20px; }
#salaIntercambio .flechasCarousel .carousel-btn { width: 40px; height: 35px; }
#salaIntercambio .flechasCarousel .triangle { width: 25px; height: 25px; }
#mazoOtroUsuario { opacity: 0; pointer-events: none; }
#mazoOtroUsuario.oponente-oculto { opacity: 0; pointer-events: none; transition: opacity .25s ease; }
#mazoOtroUsuario.oponente-visible { opacity: 1; pointer-events: auto; }
.dropzone .figcard .figlabel { font-size: 10px; width: 100%; padding: 5px 10px; overflow: hidden; text-overflow: ellipsis; }
.dropzone .figcard { max-width: 140px; }
.caja-intercambio.trading .balance-tip { display: none !important; }
.caja-intercambio.trading #dropYo { pointer-events: none; opacity: .5; }
.mazo-superior, .mazo-inferior { position: relative; }
.owner-tag { position: absolute; left: 30px; top: 0; bottom: 0; width: fit-content; display: flex; align-items: center; justify-content: flex-start; font-weight: 800; font-size: 15px; color: var(--album-color-principal); text-transform: uppercase; line-height: 1.2; }
#salaIntercambio #mazoPropio, #salaIntercambio #mazoOtroUsuario { --fig-w: 14vw; --spread-1: 14vw; --spread-2: 26vw; max-width: 900px; height: 320px; margin: 0 auto; }

/* ---------------------------
ZOOM FIGURITAS
---------------------------- */

#zoomFig { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 10000; }
#zoomFig.open { display: flex; }
#zoomFig .zoom-fig-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.85); backdrop-filter: blur(2px); }
#zoomFig #zoomFigImg { position: relative; max-width: min(80vw, 900px); max-height: 80vh; border-radius: 0; box-shadow: 0 20px 60px rgba(0, 0, 0, .6); user-select: none; -webkit-user-drag: none; }
#zoomFig .figlabel { top: 14px; transform: translateX(-50%); transition: none; font-size: 14px; margin-top: -25px; padding: 4px 8px; }

/* ---------------------------
ETIQUETA IMAGENES
---------------------------- */

.figlabel { position: absolute; left: 50%; transform: translate(-50%, -100%); font-family: "Quicksand", sans-serif; top: -6px; font-size: 10px; color: var(--album-color-principal); text-shadow: 0 0 0.125em rgba(255, 255, 255, 0.302), 0 0 0.6em var(--album-color-principal); padding: 2px 6px; pointer-events: none; white-space: nowrap; transition: transform .35s ease, opacity .35s ease; backface-visibility: hidden; transform-origin: center bottom; }
.figlabel { backface-visibility: hidden; transform-origin: center bottom; user-select: none; }
.figlabel.tilt-center { transform: translate(-50%, -100%) rotateY(0deg) scale(1.5); }
.figlabel.tilt-left.near  { transform: translate(-50%, -100%) rotateY(var(--tilt-left-near))  scale(1); }
.figlabel.tilt-left.far   { transform: translate(-50%, -100%) rotateY(var(--tilt-left-far))   scale(0.85); }
.figlabel.tilt-right.near { transform: translate(-50%, -100%) rotateY(var(--tilt-right-near)) scale(1); }
.figlabel.tilt-right.far  { transform: translate(-50%, -100%) rotateY(var(--tilt-right-far))  scale(0.85); }
.figcard { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; position: relative; }
.figcard > img { width: 100%; height: auto; display: block; object-fit: contain; }
.figcard .figlabel { position: static !important; inset: auto !important; transform: none !important; transition: none !important; text-align: center; font-weight: 900; font-size: 12px; line-height: 1.2; padding: 2px 6px; }

/* Alerta invitacion */
.u30-badge-dot { position: absolute; opacity: 0; right: -6px; top: -6px; width: 10px; height: 10px; border-radius: 50%; background: var(--album-color-principal); box-shadow: 0 0 0 2px #fff; display: inline-block; z-index: 9999; }
.u30-badge-dot.new-invite { animation: u30-pulse-dot 1s ease-in-out infinite !important; will-change: transform; opacity: 1; }
.u30-badge-parent.highlighted .u30-badge-dot { top: 214px; right: 7px; }

/* === ALERTA GENÉRICA (persistente, con botón Aceptar) === */
.u30-alert-stack { position: fixed; top: 140px; left: 0; right: 0; width: fit-content; margin: 0 auto; display: flex; flex-direction: column; gap: 10px; z-index: 10050; pointer-events: none; }
.u30-alert { pointer-events: auto; min-width: 260px; max-width: min(92vw, 420px); min-height: 70px; padding: 15px; border-radius: 10px; background: #fff; color: #0b2a33; font-weight: 600; line-height: 1.25; border-left: 4px solid var(--album-color-principal, #03bcf4); box-shadow: 0 10px 25px rgba(0,0,0,.18); }
.u30-alert .msg { font-size: 14px; line-height: 22px; margin-bottom: 20px; }
.u30-alert .actions { margin-top: 8px; display: flex; justify-content: flex-end; }
.u30-alert .btn { appearance: none; border: 0; border-radius: 8px; padding: 6px 10px; cursor: pointer; font-weight: 700; }
.u30-alert .ok { background: var(--album-color-principal, #03bcf4); color: #fff; }


/* ===== ZOOM DE PÁGINA (.zoomeable) ===== */
.zoom-page{position:fixed;inset:0;display:none;z-index:10010;}
.zoom-page.open{display:block;}
.zoom-page-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7);}
.zoom-page-box{
  position:absolute;
  inset:4vh 5vw;                
  width:auto; max-width:none;   
  height:auto;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  cursor:grab;
  scrollbar-width:none;
  touch-action:none;            
  overscroll-behavior:contain; 
}

.zoom-page-close{
  position:absolute;
  top: 50px;
  right:50px;
  z-index:10020;                 
  width:40px;
  height:40px;
  border-radius:999px;
  background:rgba(255,255,255,.15);
  color:#fff;
  border: none;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  backdrop-filter: blur(2px);
  -webkit-tap-highlight-color: transparent;
}
.zoom-page-close:hover{ background:rgba(255,255,255,.28); }
.zoom-page:not(.open) .zoom-page-close{ display:none; }

/* un poco más grande en touch-only */
@media (hover:none){
  .zoom-page-close{ width:48px;height:48px;font-size:26px; }
}

.zoom-page-inner{min-height:100%;display:flex;align-items:center;justify-content:center;position:relative;}
.zoom-page-inner .zoom-clone { box-shadow:0 10px 30px rgba(0,0,0,.35); will-change:transform; pointer-events:none; }
.zoom-page-box::-webkit-scrollbar { display: none; } 
.zoom-page .zoom-page-inner { user-select: none; }  
.zoom-page.zoom-dragging .zoom-page-box { cursor: grabbing; }

#album .page.zoomeable { cursor: zoom-in; }

/* ---------------------------
MEDIA QUERY
---------------------------- */

@media (max-width: 1800px){
  #pgAlbum { padding-top: 50px; }
  .botonesAlbum { top: -60px; z-index: 2; }
  #pgAlbum .cerrarFlipbook { top: -35px; }
}

@media (max-width: 1023px){
  .u30-badge-dot{ right:44px; top:14px; }
  .u30-badge-parent.highlighted .u30-badge-dot { top: 181px; right: 19px; }
  #listaInvitaciones { top: 100%; }
  #pgAlbum { padding-top: 60px; }
  .botonesAlbum { top: -70px; }
  #pgAlbum .cerrarFlipbook { top: -45px; font-size: 11px; }
  .botonesAlbum span { font-size: 11px; }
  .carousel-track img { max-width: 120px; max-height: 120px; }
}

/* por defecto, sin transición */
.carousel-container .figlabel{ transition:none!important; }

/* solo animan cuando el carrusel se mueve */
.carousel-container.labels-moving .figlabel{
  transition: transform .35s ease, opacity .35s ease!important;
}

/* pausa durante drag */
.carousel-container.labels-paused .figlabel{
  transition:none!important;
}

/* 0) Base segura por si no hay soporte de clip (fallback) */
:root {
  --gold-1:#b8892d; --gold-2:#d4af37; --gold-3:#f7e27e; --gold-4:#d6a24c; --gold-5:#fef8c3;
}

/* 4) Dorado con efecto “shine” animado (reflejo que pasa) */
.gold-shine{
  position:relative;
  color:#d4af37;
  -webkit-background-clip:text;
          background-clip:text;
  -webkit-text-fill-color:transparent;
  background-image: linear-gradient(90deg,
    var(--gold-1), var(--gold-2), var(--gold-3), var(--gold-4), var(--gold-1));
  overflow:hidden;
}

/* ===== Resumen final (tapaFinal) ===== */
.page.tapaFinal .cnt { display:flex; flex-direction:column; gap:14px; padding: 100px 160px!important; }

.tabla-tapa-final table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed; /* columnas parejas */
}

.tabla-tapa-final td {
  border: 1px solid #575757;;
  text-align: center;
  padding: 0;
  font-weight: 700;
  color: #575757;
  user-select: none;
  font-size: 13px;
  line-height: 15px;
  background: none!important;
  position: relative;
}

/* Cruz centrada encima del número cuando está pegada */
.tabla-tapa-final td.pegada::after {
  content: "✕";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  font-size: 18px;
  font-weight: 900;
  color: #000000;         /* rojo intenso */
  line-height: 1;
  pointer-events: none;    /* no bloquea clics */
}

.tabla-tapa-final td.pegada {
  opacity: .5;
}

.tabla-tapa-final td.empty {
  border: none;
}
.page.tapaFinal .cnt h3 { 
  text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: #575757;
    margin-bottom: 20px;
}