* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #0a0f1e;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(255,255,255,0.03) 1px, transparent 0);
  background-size: 40px 40px;
  overflow-x: hidden;
}

@keyframes pulse-live {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.8); }
}

@keyframes ticker-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes needle-swing {
  0% { transform: rotate(-90deg); }
  100% { transform: rotate(var(--needle-angle)); }
}

@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 15px var(--glow-color), inset 0 0 15px rgba(0,0,0,0.1); }
  50% { box-shadow: 0 0 25px var(--glow-color), inset 0 0 15px rgba(0,0,0,0.1); }
}

@keyframes num-pop {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

.glass-card {
  background: rgba(17, 24, 39, 0.55);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 16px;
  transition: all 0.3s ease;
}

.glass-card:hover {
  border-color: rgba(255, 255, 255, 0.12);
  transform: translateY(-2px);
}

.card-green { --glow-color: rgba(0,255,136,0.15); animation: glow-pulse 4s ease-in-out infinite; }
.card-blue { --glow-color: rgba(77,166,255,0.15); animation: glow-pulse 4s ease-in-out infinite 0.5s; }
.card-orange { --glow-color: rgba(255,170,51,0.15); animation: glow-pulse 4s ease-in-out infinite 1s; }
.card-red { --glow-color: rgba(255,68,102,0.15); animation: glow-pulse 4s ease-in-out infinite 1.5s; }
.card-purple { --glow-color: rgba(170,102,255,0.15); animation: glow-pulse 4s ease-in-out infinite 2s; }
.card-teal { --glow-color: rgba(51,221,204,0.15); animation: glow-pulse 4s ease-in-out infinite 2.5s; }

.ticker-strip {
  animation: ticker-scroll 40s linear infinite;
}

.ticker-strip:hover {
  animation-play-state: paused;
}

.stagger-1 { animation: fade-in-up 0.6s ease-out 0.1s both; }
.stagger-2 { animation: fade-in-up 0.6s ease-out 0.2s both; }
.stagger-3 { animation: fade-in-up 0.6s ease-out 0.3s both; }
.stagger-4 { animation: fade-in-up 0.6s ease-out 0.4s both; }
.stagger-5 { animation: fade-in-up 0.6s ease-out 0.5s both; }
.stagger-6 { animation: fade-in-up 0.6s ease-out 0.6s both; }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: rgba(255,255,255,0.02); }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }