.fx-glitch { display: inline-block; text-shadow: 1px 0 rgba(255, 0, 80, 0.75), -1px 0 rgba(0, 255, 255, 0.75); animation: fxGlitch 1.4s infinite steps(2); } @keyframes fxGlitch { 0%, 100% { transform: translate(0, 0); } 20% { transform: translate(-1px, 1px); } 40% { transform: translate(1px, -1px); } 60% { transform: translate(-1px, 0); } 80% { transform: translate(1px, 1px); } } .fx-neon { color: #2ae1e8; text-shadow: 0 0 4px #2ae1e8, 0 0 10px #2ae1e8, 0 0 22px rgba(42, 225, 232, 0.65); } .fx-matrix { color: #00ff41; font-family: "Courier New", Courier, monospace; text-shadow: 0 0 6px rgba(0, 255, 65, 0.75); } .fx-pixel_edge, .fx-terminal_typing { display: inline-block; font-family: "Courier New", Courier, monospace; letter-spacing: 0.5px; text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.55); } .fx-wobble { display: inline-block; animation: fxWobble 1.5s ease-in-out infinite; } @keyframes fxWobble { 0%, 100% { transform: rotate(-2.5deg); } 50% { transform: rotate(2.5deg); } } .fx-gravur, .fx-patina { color: #cdbb90; letter-spacing: 0.3px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.22), 0 -1px 1px rgba(0, 0, 0, 0.6); } .fx-brass { background: linear-gradient(180deg, #fff2c4, #e7b84f 38%, #a9772a 66%, #6e4a18); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; } .fx-foil { background: linear-gradient(110deg, #eef3f8, #aab6c2 35%, #ffffff 50%, #8c98a6 65%, #d6dee7); background-size: 220% auto; -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; animation: fxSheen 4.5s linear infinite; } .fx-holo, .fx-shimmer { background: linear-gradient(110deg, #ff5ec4, #5ec8ff, #7dff8a, #ffe45e, #ff5ec4); background-size: 220% auto; -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; animation: fxSheen 3s linear infinite; } @keyframes fxSheen { to { background-position: 220% center; } } @media (prefers-reduced-motion: reduce) { .fx-glitch, .fx-wobble, .fx-foil, .fx-holo, .fx-shimmer { animation: none; } }