/* CRITICAL ALERT BANNER */
.criticalAlert{
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  background: var(--bad); color: white; padding: 20px;
  text-align: center; font-size: 18px; font-weight: 900;
  letter-spacing: 1px; text-transform: uppercase;
  box-shadow: 0 4px 20px rgba(239,68,68,.6);
  animation: pulse 1s ease-in-out infinite;
  display: none;
}
.criticalAlert.show{ display: block; }

@keyframes pulse{
  0%, 100%{ opacity: 1; }
  50%{ opacity: .85; }
}

/* IDLH FLASHING ALERT SYSTEM */
.idlh-mode {
  position: relative;
}
.idlh-mode::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 8px solid #ef4444;
  pointer-events: none;
  z-index: 9998;
  animation: idlh-flash 1s ease-in-out infinite;
}

@keyframes idlh-flash {
  0%, 100% {
    border-color: #ef4444;
    box-shadow: inset 0 0 40px rgba(239, 68, 68, 0.4);
  }
  50% {
    border-color: #fca5a5;
    box-shadow: inset 0 0 60px rgba(239, 68, 68, 0.6);
  }
}

.idlh-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: #ef4444;
  color: white;
  padding: 20px;
  text-align: center;
  z-index: 9999;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  box-shadow: 0 4px 20px rgba(239, 68, 68, 0.8);
  animation: pulse 1s ease-in-out infinite;
  display: none;
}
.idlh-banner.show { display: block; }
.idlh-details {
  font-size: 14px;
  margin-top: 8px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: none;
}

/* Slide-in animation when card appears */
@keyframes slideDown{
  from{
    opacity: 0;
    transform: translateY(-20px);
    max-height: 0;
  }
  to{
    opacity: 1;
    transform: translateY(0);
    max-height: 500px;
  }
}

@keyframes pulse-border{
  0%, 100%{ border-color: rgba(34,197,94,.3); }
  50%{ border-color: rgba(34,197,94,.8); box-shadow: 0 0 20px rgba(34,197,94,.3); }
}

/* Right panel entrance animation */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Enhanced pulse for sidebar visibility */
@keyframes pulse-sidebar {
  0%, 100% {
    border-color: rgba(34,197,94,.3);
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
  }
  50% {
    border-color: rgba(34,197,94,.7);
    box-shadow: 0 0 30px rgba(34,197,94,.4), 0 10px 30px rgba(0,0,0,.35);
  }
}

/* ============================================
   HUD / TACTICAL OVERLAY ANIMATIONS
   ============================================ */

/* Horizontal scan sweep across result card */
@keyframes hud-scan-h {
  0%, 18%  { left: -60%; opacity: 0; }
  22%      { opacity: 1; }
  78%      { opacity: 0.7; }
  95%, 100% { left: 110%; opacity: 0; }
}

/* Logo ring pulse */
@keyframes ring-pulse {
  0%, 100% { box-shadow: 0 8px 24px rgba(0,0,0,.35); }
  50%      { box-shadow: 0 8px 24px rgba(0,0,0,.35), 0 0 0 5px rgba(0,212,255,0.12), 0 0 0 10px rgba(0,212,255,0.05); }
}

/* Confidence dot glow when high */
@keyframes dot-ping {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
  50%      { box-shadow: 0 0 10px 3px rgba(34,197,94,0.45); }
}

/* Corner bracket flicker on initial load */
@keyframes bracket-appear {
  0%   { opacity: 0; }
  60%  { opacity: 0.6; }
  80%  { opacity: 0.3; }
  100% { opacity: 1; }
}

/* Apply dot glow */
.dot.high { animation: dot-ping 2.2s ease-in-out infinite; }

/* Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}