@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } } .cursor { animation: blink 1s step-end infinite; } @keyframes flow { from { stroke-dashoffset: 24; } to { stroke-dashoffset: 0; } } .flow-line { animation: flow 1.5s linear infinite; } @keyframes pulse { 0%, 100% { transform: scale(1); opacity: 0.8; } 50% { transform: scale(1.3); opacity: 1; filter: brightness(1.2); } } .node { animation: pulse 2s ease-in-out infinite; transform-box: fill-box; transform-origin: center; } .node-delay-1 { animation-delay: 0.6s; } .node-delay-2 { animation-delay: 1.2s; } @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } } .float { animation: float 4s ease-in-out infinite; } .float-delay-1 { animation-delay: 1s; } .float-delay-2 { animation-delay: 2s; } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .gear { animation: spin 10s linear infinite; transform-origin: 0 0; } @keyframes bar-bob { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(0.7); } } .bar { animation: bar-bob 3s ease-in-out infinite; transform-box: fill-box; transform-origin: bottom; } .bar-d1 { animation-delay: 0.2s; } .bar-d2 { animation-delay: 0.5s; } .bar-d3 { animation-delay: 0.8s; } .bar-d4 { animation-delay: 1.1s; } .bar-d5 { animation-delay: 1.4s; } .bar-d6 { animation-delay: 1.7s; }