/* =================== BASE NEÓN (tuyo) =================== */
body{
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background: radial-gradient(ellipse at center, #1a002a 0%, #0d0018 100%);
  background-size:200% 200%;
  animation: animateBG 12s ease infinite;
  color:#fdf4ff;
}
@keyframes animateBG{
  0%{ background-position:0% 50% }
  50%{ background-position:100% 50% }
  100%{ background-position:0% 50% }
}
@keyframes glow{
  0%,100%{ box-shadow:0 0 20px #ff00cc, 0 0 30px #7e22ce }
  50%{ box-shadow:0 0 35px #00ffcc, 0 0 50px #ff00ff }
}
@keyframes flicker{
  0%,100%{ transform:scale(1) rotate(0deg); opacity:1 }
  50%{ transform:scale(1.1) rotate(-3deg); opacity:.85 }
  75%{ transform:scale(.95) rotate(3deg); opacity:.9 }
}
.animate-glow{ animation: glow 2.5s ease-in-out infinite alternate }
.animate-flame{ display:inline-block; animation:flicker 1.2s infinite }

.btn-neon{
  background:linear-gradient(90deg, #ff00cc 0%, #00ffcc 100%);
  color:#fff; font-weight:bold;
  box-shadow:0 0 25px #ff00ff, 0 0 40px #00ffc3;
  transition:all .3s ease-in-out; position:relative; overflow:hidden;
}
.btn-neon:hover{ filter:brightness(1.3); transform:scale(1.07) }
.btn-neon::before{
  content:""; position:absolute; top:0; left:-100%;
  width:100%; height:100%; background:rgba(255,255,255,.15);
  transform:skewX(-45deg); transition:left .5s ease-in-out;
}
.btn-neon:hover::before{ left:200% }

.input-neon{
  background:#1a002a; border:2px solid #ff00cc;
  box-shadow:0 0 15px #ff00cc, 0 0 20px #7e22ce; color:#fff;
}
.input-neon:focus{ box-shadow:0 0 20px #00ffcc, 0 0 30px #ff00ff; outline:none }

.popup{
  background:#2e003f; border:2px solid #ff31b6; border-radius:1rem; color:#fff;
  box-shadow:0 0 30px #ff00cc, 0 0 60px #00ffcc;
}
.line-clamp-1{ overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical }
.line-clamp-2{ overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.neon-glow{ box-shadow:0 0 10px #a855f7, 0 0 20px #f0abfc }

.glow-tag{
  box-shadow:0 0 8px #a21caf, 0 0 18px #f472b6;
  border:1.5px solid #a21caf !important;
  background:linear-gradient(90deg, rgba(236,72,153,.18) 0%, rgba(139,92,246,.18) 100%);
  transition: box-shadow .2s, background .2s, border .2s;
  animation: etiquetaNeonGlow 1.4s infinite alternate;
}
.glow-tag:hover{
  box-shadow:0 0 18px #f0abfc, 0 0 32px #a21caf;
  background:linear-gradient(90deg, rgba(168,85,247,.30) 0%, rgba(236,72,153,.30) 100%);
  border-color:#f0abfc !important;
}
@keyframes etiquetaNeonGlow{
  from{ box-shadow:0 0 7px #a21caf, 0 0 12px #f472b6; filter:brightness(.98) blur(.2px) }
  to{   box-shadow:0 0 18px #f0abfc, 0 0 26px #a21caf; filter:brightness(1.08) blur(.6px) }
}
@keyframes heartbeat{
  0%{ transform:scale(1) } 15%{ transform:scale(1.18) } 35%{ transform:scale(.90) }
  55%{ transform:scale(1.12) } 75%{ transform:scale(.98) } 100%{ transform:scale(1) }
}
.heartbeat{ animation: heartbeat .6s cubic-bezier(.4,0,.6,1.2) }

/* ====== BORDE VERIFICADO (cian) ====== */
@keyframes borderNeonMove{
  0%{ box-shadow: 0 0 24px #00fff2, 0 0 60px #40e3ff, 0 0 4px #0ff inset; border-color:#40e3ff }
  40%{ box-shadow: 0 0 32px #6f90ff, 0 0 100px #27e6ff, 0 0 10px #9bffb4 inset; border-color:#73f7ff }
  60%{ box-shadow: 0 0 48px #0099ff, 0 0 100px #41ffe7, 0 0 20px #00e5ff inset; border-color:#37e6ff }
  100%{ box-shadow: 0 0 24px #00fff2, 0 0 60px #40e3ff, 0 0 4px #0ff inset; border-color:#40e3ff }
}
.veri-glow-border{
  border:4px solid #40e3ff !important;
  animation: borderNeonMove 1.7s linear infinite alternate;
  box-shadow: 0 0 28px #00fff2, 0 0 44px #6f90ff, 0 0 6px #41ffe7 inset;
}

/* =================== TOP (nuevo) =================== */
@keyframes borderGoldMove{
  0%  { box-shadow: 0 0 20px rgba(255,215,0,.45), 0 0 60px rgba(255,150,0,.25), inset 0 0 6px rgba(255,230,120,.45); border-color:#ffd34d }
  50% { box-shadow: 0 0 34px rgba(255,210,40,.55), 0 0 90px rgba(255,120,0,.30), inset 0 0 10px rgba(255,240,150,.55); border-color:#ffb400 }
  100%{ box-shadow: 0 0 26px rgba(255,215,0,.55), 0 0 44px rgba(255,150,0,.35), inset 0 0 6px rgba(255,230,120,.45); border-color:#ffe17a }
}
.top-glow-border{
  border:4px solid #ffe17a;
  border-radius:1.35rem;
  animation: borderGoldMove 1.7s linear infinite alternate;
  box-shadow:
    0 0 26px rgba(255,215,0,.55),
    0 0 44px rgba(255,150,0,.35),
    inset 0 0 6px rgba(255,230,120,.45);
}

/* Chip “TOP” */
.top-chip{
  position:absolute; top:10px; left:10px;
  z-index:5;
  display:inline-flex; align-items:center; gap:.4rem;
  font-weight:900; text-transform:uppercase; letter-spacing:.4px;
  padding:.35rem .65rem; border-radius:999px;
  color:#3b1b00;
  border:1.6px solid #7a5200;
  background:linear-gradient(90deg,#ffdd66,#ffc23a,#ffd25c);
  box-shadow:0 6px 16px rgba(255,176,0,.35), inset 0 2px 6px rgba(255,255,255,.25);
}
.top-chip i{ filter:drop-shadow(0 0 6px #ffe58c) }

.card-inner{ position:relative; z-index:1; border-radius:1.35rem; overflow:hidden; }

/* Doble glow (TOP + Verificado) */
.top-glow-border.veri-glow-border{
  position: relative;
  border: 4px solid transparent !important;
  box-shadow: none !important;
  animation: none !important;
}
.top-glow-border.veri-glow-border::before,
.top-glow-border.veri-glow-border::after{
  content:""; position:absolute; border-radius: inherit; pointer-events: none; z-index: 0;
}
.top-glow-border.veri-glow-border::before{
  inset: -4px; border: 3px solid #ffcf40;
  box-shadow: 0 0 24px rgba(255,215,0,.60), 0 0 44px rgba(255,180,0,.45);
  animation: borderGoldMove 1.7s linear infinite alternate;
}
.top-glow-border.veri-glow-border::after{
  inset: 2px; border: 3px solid #40e3ff;
  box-shadow: 0 0 28px rgba(0,255,242,.65), 0 0 44px rgba(64,227,255,.45), inset 0 0 6px rgba(64,227,255,.35);
  animation: borderNeonMove 2s linear infinite alternate;
}

/* ========= AGE GATE (visible si NO hay verificación) ========= */
.age-gate{
  position:fixed; inset:0; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(ellipse at center, rgba(10,0,18,.95) 0%, rgba(5,0,12,.98) 100%);
  backdrop-filter: blur(3px);
}
html.age-ok .age-gate{ display:none; }
.age-card{
  width: min(94%, 720px);
  border-radius: 1.25rem;
  border: 2px solid #ff31b6;
  background: linear-gradient(180deg, rgba(46,0,63,.95), rgba(20,0,28,.98));
  box-shadow: 0 0 30px #ff00cc, 0 0 60px #00ffcc;
}
.age-title{
  font-weight: 900; letter-spacing: .3px;
  text-shadow: 0 0 12px #ff31b6, 0 0 28px #00ffc3;
}

/* ========= FOOTER ========= */
.footer-legal a{ text-decoration: none; }
.footer-legal a:hover{ text-decoration: underline; }

/* ======= MINI LOGO (footer) ======= */
.brand-mini{
  display:inline-flex; align-items:center; gap:.6rem;
  padding:.55rem 1rem; border-radius:999px;
  border:1px solid rgba(240,171,252,.25);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow:0 6px 24px rgba(160,64,253,.18), inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
  backdrop-filter: blur(3px);
}
.brand-mini:hover{
  transform:translateY(-1px);
  filter:brightness(1.1);
  box-shadow:0 10px 30px rgba(160,64,253,.28)
}
.brand-fire{
  font-size:1.25rem; line-height:1; 
  filter: drop-shadow(0 0 8px #ff7dd1) drop-shadow(0 0 10px #00ffd0);
}
.brand-text{
  font-weight:900; letter-spacing:.2px;
  color:#f8f0ff;
  text-shadow:0 0 8px rgba(240,171,252,.55), 0 0 16px rgba(0,255,210,.25);
}

/* ========== LOGOUT overlay (tuyo) ========== */
.logout-neon-glow {
  color: #00ffc3;
  text-shadow: 0 0 18px #ff31b6, 0 0 38px #00ffc3, 0 0 18px #a040fdcc;
  letter-spacing: 1.5px;
  filter: brightness(1.2);
  animation: logoutglow 1.2s infinite alternate;
}
@keyframes logoutglow {
  0% { text-shadow: 0 0 20px #00ffc3, 0 0 26px #ff31b6; }
  100% { text-shadow: 0 0 38px #ff31b6, 0 0 42px #a040fd, 0 0 30px #00ffc3; }
}