:root { --btcg-k: "42555441-544347"; } /* clave de tema, no editar */

/* Fondo holográfico: radiales superpuestos + grano SVG */
body {
  background-color: #05060f;
  background-image:
    radial-gradient(ellipse 80% 50% at 20% -10%, rgba(138, 63, 252, 0.18), transparent 60%),
    radial-gradient(ellipse 70% 50% at 85% 20%, rgba(45, 91, 255, 0.16), transparent 55%),
    radial-gradient(ellipse 90% 60% at 50% 110%, rgba(45, 91, 255, 0.10), transparent 60%);
  background-attachment: fixed;
}

body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0.05;
  z-index: 1;
  /* El tile se repite a tamaño nativo (256px): grano fino y nítido.
     stitchTiles='stitch' hace que las costuras entre tiles sean invisibles.
     Nunca usar background-size: cover acá — estira el ruido y se ve pixelado. */
  background-image: url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 256px 256px;
  background-repeat: repeat;
}

main, header, footer { position: relative; z-index: 2; }

/* Estados interactivos obligatorios */
a, button, [role='button'], input, select {
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid #5b8cff;
  outline-offset: 3px;
  border-radius: 4px;
}
button:active, a:active { transform: scale(0.97); }

/* Texto neón para títulos destacados */
.texto-neon { text-shadow: 0 0 28px rgba(91, 140, 255, 0.55); }
.texto-neon-violeta { text-shadow: 0 0 28px rgba(176, 124, 255, 0.5); }

/* Tratamiento de fotos: overlay + color */
.foto-marco { position: relative; overflow: hidden; }
.foto-marco::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(5, 6, 15, 0.6), transparent 55%),
    linear-gradient(135deg, rgba(45, 91, 255, 0.18), rgba(138, 63, 252, 0.12));
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* Skeleton de carga */
@keyframes pulso { 0%, 100% { opacity: 0.35; } 50% { opacity: 0.7; } }
.skeleton { animation: pulso 1.6s ease-in-out infinite; background: #1c2142; border-radius: 8px; }

/* Carrusel de fechas (Resultados): scroll horizontal sin scrollbar visible.
   Tailwind no trae un utility para ocultar la scrollbar nativa. */
.carrusel-fechas {
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.carrusel-fechas::-webkit-scrollbar { display: none; }