/* Shared animation catalog. Load immediately after tokens.css.
 * Definitions only: components own when and how long a motion runs.
 * Legacy names remain stable for existing HTML/JavaScript consumers.
 * Different entrance/background variants have explicit module names.
 * Reduced-motion rules remain in tokens.css and the final theme layer.
 */

/* ixi-theme.css */
@keyframes ixiSelectDropdownIn {
    from { opacity: 0; transform: translateY(-4px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ixi-theme.css */
@keyframes ixiSelectDropdownUpIn {
    from { opacity: 0; transform: translateY(4px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* mobile.css */
@keyframes slideDownBanner {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}

/* mobile.css, pages/dashboard.css */
@keyframes surfaceFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* mobile.css */
@keyframes slideUpSheet {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* pages/camera.css */
@keyframes pulseDot {
    0% { transform: scale(0.95); opacity: 0.8; }
    50% { transform: scale(1.3); opacity: 1; }
    100% { transform: scale(0.95); opacity: 0.8; }
}

/* pages/camera.css */
@keyframes fptzAuraPulse {
    0%, 100% {
        box-shadow: 0 12px 36px -4px rgba(0, 0, 0, 0.65), 0 0 18px rgba(56, 189, 248, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.25);
    }
    50% {
        box-shadow: 0 12px 36px -4px rgba(0, 0, 0, 0.65), 0 0 28px rgba(56, 189, 248, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    }
}

/* pages/camera.css */
@keyframes pulseRec {
    0% { transform: scale(1); filter: drop-shadow(0 0 2px var(--danger)); }
    50% { transform: scale(1.15); filter: drop-shadow(0 0 8px var(--danger)); }
    100% { transform: scale(1); filter: drop-shadow(0 0 2px var(--danger)); }
}

/* pages/camera.css */
@keyframes camera-feature-pulse {
    50% { opacity: .42; transform: scale(.92); }
}

/* pages/cameras.css, pages/dashboard.css */
@keyframes cameraCardRecPulse { 50% { opacity:.3; transform:scale(.72); } }

/* pages/cloud.css, pages/ftp.css, screens/login.css, style.css */
@keyframes spin{to{transform:rotate(360deg)}}

/* pages/cloud.css */
@keyframes pulsate{
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.4); }
    70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(var(--accent-rgb), 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
}

/* pages/cloud.css */
@keyframes cloudFadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* pages/dashboard.css */
@keyframes slideInAlert {
    from { transform: translateY(100px) scale(0.9); opacity: 0; }
    to { transform: translateY(0) scale(1); opacity: 1; }
}

/* pages/dashboard.css */
@keyframes pulse-white-dot {
    from { opacity: 0.3; transform: scale(0.8); }
    to { opacity: 1; transform: scale(1.2); }
}

/* pages/dashboard.css */
@keyframes dot-pulse {
    0% { box-shadow: 0 0 0 0 rgba(var(--danger-rgb),0.7); }
    70% { box-shadow: 0 0 0 6px rgba(var(--danger-rgb),0); }
    100% { box-shadow: 0 0 0 0 rgba(var(--danger-rgb),0); }
}

/* pages/dashboard.css */
@keyframes modalZoomIn {
    from { transform: scale(0.9) translateY(20px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}

/* pages/faces.css */
@keyframes voiceWave {
    from { height: 6px; }
    to { height: 26px; }
}

/* pages/map.css */
@keyframes popoverFadeIn {
    from { opacity: 0; transform: scale(0.96); }
    to { opacity: 1; transform: scale(1); }
}

/* pages/turret.css */
@keyframes pulse-status {
    0%, 100% { opacity: 1; } 50% { opacity: .5; }
}

/* pages/turret.css */
@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%       { opacity: .6; transform: scale(1.3); }
}

/* pages/turret.css */
@keyframes ping-pulse {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(2.2); opacity: 0; }
}

/* pages/turret.css */
@keyframes border-flash {
    0%, 100% { border-color: var(--border); }
    50% { border-color: var(--danger); box-shadow: 0 0 15px rgba(var(--danger-rgb),0.4); }
}

/* pages/turret.css */
@keyframes flow2-ripple {
    0% { transform: scale(0.2); opacity: 1; }
    100% { transform: scale(1.6); opacity: 0; }
}

/* pages/turret.css */
@keyframes flow2-pulse-glow {
    0%, 100% { opacity: 0.15; }
    50% { opacity: 0.35; }
}

/* pages/turret.css */
@keyframes flow2-mesh-glow {
    0%, 100% { stroke-width: 1.5; opacity: 0.4; }
    50% { stroke-width: 2.5; opacity: 0.85; stroke: var(--accent); }
}

/* pages/users.css */
@keyframes userMenuPopIn {
    from {
        opacity: 0;
        transform: scale(0.96) translateY(-4px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* screens/loading.css */
@keyframes cardEntrance {
    from { opacity: 0; transform: scale(0.95) translateY(20px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* screens/loading.css */
@keyframes logoPulse {
    0% { transform: translateY(0) scale(1); box-shadow: 0 8px 32px rgba(4, 119, 191, 0.3); }
    100% { transform: translateY(-4px) scale(1.02); box-shadow: 0 12px 40px rgba(102, 63, 147, 0.5), 0 0 20px rgba(4, 119, 191, 0.3); }
}

/* screens/loading.css, screens/offline.css */
@keyframes spinFromZero {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* screens/loading.css */
@keyframes textFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* screens/loading.css */
@keyframes statusPulse { 50% { opacity: .45; transform: scale(.82); } }

/* screens/login.css */
@keyframes loginBackgroundFloat {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, 30px) scale(1.1); }
}

/* screens/login.css */
@keyframes loginMessageIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* screens/offline.css */
@keyframes offlineBackgroundFloat {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, 30px) scale(1.15); }
}

/* screens/offline.css */
@keyframes offlinePanelIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* screens/offline.css */
@keyframes pulse-red {
    0% { box-shadow: 0 0 0 0 rgba(var(--danger-rgb), 0.4); }
    70% { box-shadow: 0 0 0 15px rgba(var(--danger-rgb), 0); }
    100% { box-shadow: 0 0 0 0 rgba(var(--danger-rgb), 0); }
}

/* style.css */
@keyframes engineFadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* style.css */
@keyframes enginePulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* style.css */
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* style.css */
@keyframes appDialogShake { 0%,100%{transform:translateX(0)} 35%{transform:translateX(-4px)} 70%{transform:translateX(4px)} }

/* style.css */
@keyframes toastEnter {
    from { transform: translate3d(18px, -4px, 0); opacity: 0; }
    to { transform: translate3d(0, 0, 0); opacity: 1; }
}

/* style.css */
@keyframes toastLeave {
    to { transform: translate3d(12px, 0, 0); opacity: 0; }
}

/* style.css */
@keyframes toastRefresh {
    50% { transform: scale(.98); opacity: .78; }
}

/* style.css */
@keyframes skeleton-pulse {
    0% { opacity: 0.6; }
    50% { opacity: 1; }
    100% { opacity: 0.6; }
}

/* style.css */
@keyframes detFlash {
    0% { opacity: 1; border-width: 4px; }
    50% { opacity: 0.7; border-width: 3px; }
    100% { opacity: 0; border-width: 0px; }
}

/* style.css */
@keyframes recPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--danger-rgb), 0.5); }
    50% { box-shadow: 0 0 0 6px rgba(var(--danger-rgb), 0); }
}

/* style.css */
@keyframes audioPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.4); }
    50% { box-shadow: 0 0 0 5px rgba(var(--accent-rgb), 0); }
}

/* style.css */
@keyframes sonarPulse {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(2.5); opacity: 0; }
}

/* style.css */
@keyframes markerPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--danger-rgb), 0.6); }
    50% { box-shadow: 0 0 0 16px rgba(var(--danger-rgb), 0); }
}

/* style.css */
@keyframes bubbleIn {
    from { opacity: 0; transform: translateX(-50%) translateY(8px); }
    to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

/* style.css */
@keyframes popoverIn {
    from { opacity: 0; transform: scale(0.92) translateY(6px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* style.css */
@keyframes livePulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.35; }
}

/* style.css */
@keyframes pipSlideIn {
    from { transform: translate(20px, 20px) scale(0.9); opacity: 0; }
    to { transform: translate(0, 0) scale(1); opacity: 1; }
}

/* style.css */
@keyframes active-glow {
    0% { box-shadow: 0 0 4px rgba(var(--accent-rgb), 0.4); }
    50% { box-shadow: 0 0 16px rgba(var(--accent-rgb), 0.8); }
    100% { box-shadow: 0 0 4px rgba(var(--accent-rgb), 0.4); }
}

/* style.css */
@keyframes alert-pulse-border {
    0% { border-color: rgba(var(--danger-rgb), 0.6); box-shadow: 0 0 4px rgba(var(--danger-rgb), 0.4); }
    50% { border-color: var(--danger); box-shadow: 0 0 20px rgba(var(--danger-rgb), 0.8); }
    100% { border-color: rgba(var(--danger-rgb), 0.6); box-shadow: 0 0 4px rgba(var(--danger-rgb), 0.4); }
}