/* ============================================================
   Animations
   ============================================================ */

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

@keyframes marquee-scroll {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

@keyframes tick-flash-up {
  0%   { background: rgba(34, 211, 163, 0.45); color: #fff; }
  100% { background: transparent; }
}

@keyframes tick-flash-down {
  0%   { background: rgba(255, 77, 109, 0.42); color: #fff; }
  100% { background: transparent; }
}

.flash-up   { animation: tick-flash-up 600ms ease-out; }
.flash-down { animation: tick-flash-down 600ms ease-out; }

@keyframes card-enter {
  0%   { opacity: 0; transform: translateY(-8px); }
  100% { opacity: 1; transform: translateY(0); }
}
.card-enter { animation: card-enter 260ms cubic-bezier(0.2, 0.9, 0.3, 1); }

@keyframes shimmer {
  0%   { background-position: -200px 0; }
  100% { background-position: 200px 0; }
}
.skeleton {
  background: linear-gradient(90deg,
    rgba(255,255,255,0.02) 0%,
    rgba(255,255,255,0.06) 50%,
    rgba(255,255,255,0.02) 100%);
  background-size: 400px 100%;
  animation: shimmer 1.6s infinite linear;
  border-radius: 6px;
}

@keyframes gauge-sweep {
  from { stroke-dashoffset: 283; }
}

@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34,211,163,0.0); }
  50%      { box-shadow: 0 0 18px 1px rgba(34,211,163,0.35); }
}

@keyframes glow-pulse-down {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,77,109,0.0); }
  50%      { box-shadow: 0 0 18px 1px rgba(255,77,109,0.4); }
}

@keyframes slide-in-right {
  0%   { transform: translateX(20px); opacity: 0; }
  100% { transform: translateX(0);    opacity: 1; }
}
.slide-in-right { animation: slide-in-right 220ms cubic-bezier(0.2, 0.9, 0.3, 1); }

@keyframes fade-in {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
.fade-in { animation: fade-in 240ms ease-out; }

@keyframes ripple {
  0%   { transform: scale(0.5); opacity: 0.6; }
  100% { transform: scale(2.8); opacity: 0; }
}
.ripple-layer {
  position: absolute; inset: 0;
  border-radius: inherit;
  pointer-events: none;
}
.ripple-layer::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  width: 12px; height: 12px;
  margin: -6px 0 0 -6px;
  border-radius: 50%;
  background: rgba(34, 211, 163, 0.4);
  transform: scale(0);
  opacity: 0;
}
.ripple-active .ripple-layer::after { animation: ripple 700ms ease-out; }

/* number odometer */
@keyframes number-nudge-up {
  0%   { transform: translateY(0); color: var(--up); }
  40%  { transform: translateY(-2px); }
  100% { transform: translateY(0); color: inherit; }
}
@keyframes number-nudge-down {
  0%   { transform: translateY(0); color: var(--down); }
  40%  { transform: translateY(2px); }
  100% { transform: translateY(0); color: inherit; }
}
.nudge-up   { animation: number-nudge-up 500ms ease-out; }
.nudge-down { animation: number-nudge-down 500ms ease-out; }

/* chip toggle */
@keyframes chip-pop {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.06); }
  100% { transform: scale(1); }
}
.chip-pop { animation: chip-pop 200ms ease-out; }

/* page-level subtle entry */
@keyframes workspace-in {
  0%   { opacity: 0; transform: translateY(6px); }
  100% { opacity: 1; transform: translateY(0); }
}
.workspace { animation: workspace-in 420ms cubic-bezier(0.2, 0.9, 0.3, 1); }

/* drawer backdrop */
@keyframes backdrop-fade {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

/* signal card entry */
@keyframes signal-in {
  0%   { opacity: 0; transform: translateX(-8px); }
  100% { opacity: 1; transform: translateX(0); }
}
.signal-in { animation: signal-in 260ms cubic-bezier(0.2, 0.9, 0.3, 1); }

/* heatmap tile hover */
@keyframes tile-glow-up {
  0%, 100% { box-shadow: 0 0 0 rgba(34,211,163,0); }
  50%      { box-shadow: 0 0 22px rgba(34,211,163,0.35); }
}
@keyframes tile-glow-down {
  0%, 100% { box-shadow: 0 0 0 rgba(255,77,109,0); }
  50%      { box-shadow: 0 0 22px rgba(255,77,109,0.4); }
}
.tile-glow-up   { animation: tile-glow-up 2.2s ease-in-out infinite; }
.tile-glow-down { animation: tile-glow-down 2.2s ease-in-out infinite; }

/* loading dots */
@keyframes loading-dots {
  0%, 20%   { content: ""; }
  40%       { content: "."; }
  60%       { content: ".."; }
  80%, 100% { content: "..."; }
}
.loading-dots::after {
  content: "";
  display: inline-block;
  min-width: 18px;
  animation: loading-dots 1.4s steps(4, end) infinite;
}