/* ========== KEYFRAMES ========== */
@keyframes pulse-dot { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.5; transform:scale(0.8); } }
@keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes fade-in-up { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@keyframes skeleton { 0% { background-position:-200% 0; } 100% { background-position:200% 0; } }

/* Legacy keyframes (used by existing CSS/JS) */
@keyframes si { from { opacity:0; transform:translateX(30px); } to { opacity:1; } }
@keyframes su { from { opacity:0; transform:translateX(-50%) translateY(16px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }
@keyframes aispin { to { transform:rotate(360deg); } }
@keyframes bpulse { 0% { transform:scale(1); } 50% { transform:scale(1.08); } 100% { transform:scale(1); } }
@keyframes blink { 0%,100% { opacity:1; } 50% { opacity:.5; } }
@keyframes vspin { to { transform:rotate(360deg); } }
@keyframes ppulse { 0%,100% { opacity:0; } 50% { opacity:1; } }

.fade-in { animation: fade-in-up 200ms ease forwards; }

/* ========== NEON THEME ========== */
body.neon {
  --bg-base:#050510; --bg-surface:#0a0a1a; --bg-card:#0f0f24; --bg-elevated:#141430; --bg-hover:#1a1a3a;
  --accent:#bf5af2; --accent-dim:rgba(191,90,242,0.15); --accent-glow:rgba(191,90,242,0.3);
  --cyan:#00f0ff; --cyan-dim:rgba(0,240,255,0.15);
  --pink:#ff69b4; --pink-dim:rgba(255,105,180,0.15);
  --green:#39ff14; --yellow:#ffd60a; --red:#ff2d55;
  --text-primary:#f0f0ff; --text-secondary:#8888bb; --text-muted:#4a4a70;
  --border:#1a1a3a; --border-bright:#2a2a50;
  --shadow:0 4px 24px rgba(0,0,0,0.5);
  /* Legacy aliases */
  --bg:#050510; --s1:#0a0a1a; --s2:#0f0f24; --bd:#1a1a3a;
  --ac:#bf5af2; --cy:#00f0ff; --gn:#39ff14; --rd:#ff2d55; --yw:#ffd60a; --or:#ff6b2b; --pk:#ff69b4;
  --tx:#f0f0ff; --m1:#8888bb; --m2:#4a4a70;
}
body.neon .app-header { background:rgba(10,10,26,.95); border-color:rgba(0,240,255,.15); }
body.neon .app-logo { background:linear-gradient(135deg,#00f0ff,#ff69b4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
body.neon .player-bar { background:rgba(10,10,26,.95); border-color:rgba(0,240,255,.15); }
body.neon .deck { box-shadow:0 0 15px rgba(0,240,255,.08); }
body.neon .stab.on { border-bottom-color:var(--cyan); }
body.neon table { border:1px solid rgba(0,240,255,.1); }
body.neon thead { background:rgba(0,240,255,.04); }
body.neon .cd { border-color:rgba(0,240,255,.08); }