:root{
  --neon-cyan:#00ffff;
  --neon-pink:#ff0080;
  --neon-yellow:#ffff00;
  --party-purple:#8b00ff;
  --electric-blue:#0080ff;
}

html, body {
  background: radial-gradient(1200px 600px at 50% -10%, rgba(0,255,255,.18), transparent 60%),
              radial-gradient(1000px 500px at 90% 10%, rgba(255,0,128,.15), transparent 55%),
              radial-gradient(900px 500px at 10% 25%, rgba(139,0,255,.12), transparent 55%),
              #070712;
  color: #e9e9ff;
}

.neon-title{
  text-shadow:
    0 0 10px rgba(0,255,255,.7),
    0 0 24px rgba(0,255,255,.35);
}

.neon-card{
  position: relative;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 12px 40px rgba(0,0,0,.45);
  overflow: hidden;
}

.neon-card::before{
  content:"";
  position:absolute; inset:-2px;
  background: linear-gradient(90deg, rgba(0,255,255,.45), rgba(255,0,128,.35), rgba(0,128,255,.35));
  filter: blur(18px);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events:none;
}

.neon-card:hover::before{ opacity: 1; }

.shine{
  position:absolute; inset:0;
  pointer-events:none;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.18) 25%, transparent 50%);
  transform: translateX(-120%) skewX(-18deg);
  animation: shineSweep 3.2s ease-in-out infinite;
  opacity:.55;
}

@keyframes shineSweep{
  0% { transform: translateX(-140%) skewX(-18deg); }
  45% { transform: translateX(140%) skewX(-18deg); }
  100% { transform: translateX(140%) skewX(-18deg); }
}

.glow-hover{
  transition: transform .2s ease, box-shadow .2s ease;
}
.glow-hover:hover{
  transform: scale(1.05);
  box-shadow:
    0 0 0 1px rgba(0,255,255,.25),
    0 0 22px rgba(0,255,255,.20),
    0 0 28px rgba(255,0,128,.12),
    0 20px 50px rgba(0,0,0,.55);
}

.badge{
  background: linear-gradient(90deg, var(--neon-cyan), var(--neon-pink));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

.btn-neon{
  background: linear-gradient(90deg, rgba(0,255,255,.18), rgba(255,0,128,.14));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 0 22px rgba(0,255,255,.12);
}
.btn-neon:hover{
  box-shadow: 0 0 26px rgba(0,255,255,.18), 0 0 18px rgba(255,0,128,.12);
}