/* TKM — capa de efectos custom del master (generada por tools/build-master.php; el master manda). */
@layer base{html,body{margin:0;padding:0;}body{overscroll-behavior:none;}main>:first-child{margin-top:0!important;}main>:last-child{margin-bottom:0!important;}}::-webkit-scrollbar{display:none;}
@keyframes shimmerBorder { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.metric-card-glow { transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.metric-card-glow:hover { transform: translateY(-3px); box-shadow: 0 10px 30px -10px rgba(0, 230, 118, 0.25), inset 0 0 15px rgba(117, 255, 158, 0.05); }
.glow-halo-pulse { animation: neonHalo 2.5s infinite alternate ease-in-out; }
@keyframes neonHalo { 0% { text-shadow: 0 0 6px rgba(117,255,158,0.3); } 100% { text-shadow: 0 0 18px rgba(0,230,118,0.85), 0 0 28px rgba(117,255,158,0.5); } }

/* Hero Dynamic Fluid Motion & Color-Shift Glow */
@keyframes heroTitleFlow {
  0% {
    background-position: 0% 50%;
    filter: drop-shadow(0 0 14px rgba(0, 230, 118, 0.35));
  }
  33% {
    background-position: 50% 100%;
    filter: drop-shadow(0 0 24px rgba(0, 240, 255, 0.55));
  }
  66% {
    background-position: 100% 50%;
    filter: drop-shadow(0 0 20px rgba(160, 255, 218, 0.45));
  }
  100% {
    background-position: 0% 50%;
    filter: drop-shadow(0 0 14px rgba(0, 230, 118, 0.35));
  }
}

.hero-stream-gradient {
  background: linear-gradient(135deg, #00FF88 0%, #00e676 22%, #00f0ff 45%, #e0ffff 60%, #00c853 80%, #00f0ff 100%);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: heroTitleFlow 7s ease-in-out infinite;
}

.hero-kicker-glow {
  box-shadow: 0 0 20px -3px rgba(0, 230, 118, 0.35), inset 0 0 12px rgba(0, 230, 118, 0.12);
  animation: kickerPulse 3s ease-in-out infinite alternate;
}

@keyframes kickerPulse {
  0% { box-shadow: 0 0 16px -3px rgba(0, 230, 118, 0.3), inset 0 0 10px rgba(0, 230, 118, 0.1); }
  100% { box-shadow: 0 0 28px -1px rgba(0, 230, 118, 0.55), inset 0 0 16px rgba(0, 230, 118, 0.22); }
}

/* Tratamiento Holográfico de AURA */
.aura-holo-mask {
  mask-image: linear-gradient(to top, transparent 0%, black 18%, black 88%, transparent 100%), radial-gradient(circle at 50% 45%, black 65%, transparent 100%);
  -webkit-mask-image: linear-gradient(to top, transparent 0%, black 18%, black 88%, transparent 100%), radial-gradient(circle at 50% 45%, black 65%, transparent 100%);
  mask-composite: intersect;
  -webkit-mask-composite: source-in;
}

@keyframes holoBeamScan {
  0% { transform: translateY(-100%); opacity: 0; }
  50% { opacity: 0.6; }
  100% { transform: translateY(100%); opacity: 0; }
}

.holo-scanline {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, transparent, #00e5ff, #00ff88, transparent);
  box-shadow: 0 0 12px #00e5ff;
  animation: holoBeamScan 4s linear infinite;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .metric-card-glow { transition: none !important; transform: none !important; }
  .glow-halo-pulse { animation: none !important; }
  .hero-stream-gradient { animation: none !important; filter: none !important; }
  .hero-kicker-glow { animation: none !important; }
  .holo-scanline { animation: none !important; }
}

@keyframes titlePyramidShimmer { 0% { background-position: 0% 50%; text-shadow: 0 0 10px rgba(0, 255, 136, 0.4); } 50% { background-position: 100% 50%; text-shadow: 0 0 22px rgba(0, 204, 255, 0.7), 0 0 35px rgba(192, 132, 252, 0.5); } 100% { background-position: 0% 50%; text-shadow: 0 0 10px rgba(0, 255, 136, 0.4); } } .title-pyramid-shimmer { background: linear-gradient(120deg, #00FF88, #00CCFF, #c084fc, #ffd700, #00FF88); background-size: 300% 300%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: titlePyramidShimmer 6s ease infinite; } @keyframes tierGlowPulse { 0%, 100% { opacity: 0.95; transform: scale(1); } 50% { opacity: 1; transform: scale(1.01); } } .tier-apex-glow { animation: tierGlowPulse 4s ease-in-out infinite; animation-delay: 0s; box-shadow: 0 0 25px rgba(0, 230, 118, 0.35), inset 0 0 15px rgba(117, 255, 158, 0.15) !important; border-color: rgba(0, 230, 118, 0.8) !important; } .tier-l2-glow { animation: tierGlowPulse 4s ease-in-out infinite; animation-delay: 0.4s; box-shadow: 0 0 25px rgba(175, 198, 253, 0.35), inset 0 0 15px rgba(175, 198, 253, 0.15) !important; border-color: rgba(175, 198, 253, 0.8) !important; } .tier-l3-glow { animation: tierGlowPulse 4s ease-in-out infinite; animation-delay: 0.8s; box-shadow: 0 0 28px rgba(0, 230, 118, 0.45), inset 0 0 18px rgba(0, 230, 118, 0.2) !important; border-color: rgba(0, 230, 118, 0.9) !important; } .tier-l4-glow { animation: tierGlowPulse 4s ease-in-out infinite; animation-delay: 1.2s; box-shadow: 0 0 25px rgba(146, 251, 169, 0.35), inset 0 0 15px rgba(146, 251, 169, 0.15) !important; border-color: rgba(146, 251, 169, 0.8) !important; } .tier-l5-glow { animation: tierGlowPulse 4s ease-in-out infinite; animation-delay: 1.6s; box-shadow: 0 0 35px rgba(0, 230, 118, 0.5), inset 0 0 20px rgba(0, 230, 118, 0.25) !important; border-color: #00e676 !important; } @media (prefers-reduced-motion: reduce) { .title-pyramid-shimmer { animation: none !important; } .tier-apex-glow, .tier-l2-glow, .tier-l3-glow, .tier-l4-glow, .tier-l5-glow { animation: none !important; transform: none !important; } }

/* bg-radial: gradiente radial sobre los stops que definen from-/via-/to- (Stitch lo referencia sin definirlo) */
.bg-radial {
  background-image: radial-gradient(ellipse at center, var(--tw-gradient-stops));
}