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

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

@keyframes sparkle-burst {
  0% { transform: scale(0) rotate(0deg); opacity: 1; }
  100% { transform: scale(1.5) rotate(180deg) translateX(var(--sx)) translateY(var(--sy)); opacity: 0; }
}

.sparkle-particle {
  position: absolute; width: 6px; height: 6px; pointer-events: none;
  background: var(--agent-primary, #4caf50);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  animation: sparkle-burst 600ms ease-out forwards;
  z-index: 100;
}

@keyframes card-appear {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes slide-in-right {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

@keyframes slide-out-right {
  from { transform: translateX(0); }
  to { transform: translateX(100%); }
}

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

@keyframes status-glow-pulse { 0%,100% { transform:scale(0.8); opacity:0.3; } 50% { transform:scale(1.2); opacity:0.8; } }
@keyframes status-ring-spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }

@keyframes tab-enter {
  from { opacity: 0; transform: translateX(-5px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes log-line-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.log-line { animation: log-line-in 150ms ease-out both; }

@keyframes modal-backdrop {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes modal-card {
  from { transform: scale(0.9); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

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

.view-container.tab-exit {
  display: flex;
  opacity: 0;
  transform: translateX(5px);
  transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .status-dot { animation: none !important; }
  .progress-shimmer { background-image: none !important; }
  .persona-svg * { animation: none !important; }
  .thachan-rotate, .sirpi-float, .ayvalar-scan, .pulse-dot, .rotate-ring, .pulse-center { animation: none !important; }
  .sparkle, .sparkle-container { display: none !important; }
  .agent-card { animation: none !important; }
  .kanban-task-card { animation: none !important; }
  .activity-item { animation: none !important; }
  .detail-panel { animation: none !important; }
  .modal-card { animation: none !important; opacity: 1 !important; transform: none !important; }
  .modal-overlay { animation: none !important; opacity: 1 !important; }
  #view-dashboard.active .agent-grid { animation: none !important; }
  .ticker-item { animation: none !important; }
  .chat-typing-indicator .typing-dot { animation: none !important; }
}
