/* Global styles and animations for CryptoPulse */
:root {
  --brand: #0EA5E9;
  --brand-dark: #0894d0;
  --green: #10B981;
  --red: #EF4444;
}

html { scroll-behavior: smooth; }

/* Animations */
@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(6px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes shimmer {
  0% { background-position: -468px 0; }
  100% { background-position: 468px 0; }
}

.fade-in-up { animation: fadeInUp 420ms ease-out both; }

.skeleton {
  background: #f6f7f8;
  background-image: linear-gradient(90deg, #f6f7f8 0px, #edeef1 40px, #f6f7f8 80px);
  background-size: 600px 100%;
  animation: shimmer 1.2s infinite linear;
}

.table-row-hover:hover { background-color: rgba(14, 165, 233, 0.05); transition: background-color .2s ease; }

.token-avatar {
  width: 24px; height: 24px; border-radius: 9999px; box-shadow: 0 1px 2px rgba(0,0,0,.08);
}

.watch-btn { transition: transform .15s ease, opacity .2s ease; }
.watch-btn:active { transform: scale(0.96); }

/* Prevent overlap on small screens */
* { min-width: 0; }

/* Accessibility focus ring for elements not using Tailwind focus */
:focus-visible { outline: 2px solid rgba(14, 165, 233, 0.4); outline-offset: 2px; }