.typewriter{width:21ch;white-space:nowrap;overflow:hidden;border-right:3px solid;animation:typing 4s steps(21) infinite,blink .5s step-end infinite alternate}@keyframes typing{0%,90%,to{width:0}30%,60%{width:21ch}}@keyframes blink{50%{border-color:transparent}}.smoke{font-size:4rem;font-weight:700}.smoke span{display:inline-block;text-shadow:0 0 0 whitesmoke;animation:smoke-effect 2s linear infinite;animation-delay:calc(.1s * var(--i))}@keyframes smoke-effect{0%{transform:rotate(0deg) translateY(0);opacity:1;text-shadow:0 0 0 whitesmoke}to{transform:rotate(45deg) translateY(-100px);opacity:0;text-shadow:0 0 50px whitesmoke}}.glitch{font-size:5rem;font-weight:700;position:relative;animation:glitch-animation 1s linear infinite alternate-reverse}.glitch:after,.glitch:before{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:var(--background);overflow:hidden}.glitch:before{left:2px;text-shadow:-2px 0 var(--primary);animation:glitch-before 1.5s linear infinite alternate-reverse}.glitch:after{left:-2px;text-shadow:-2px 0 var(--accent);animation:glitch-after 1.5s linear infinite alternate-reverse}@keyframes glitch-animation{0%{transform:translate(0)}20%{transform:translate(-5px,5px)}40%{transform:translate(-5px,-5px)}60%{transform:translate(5px,5px)}80%{transform:translate(5px,-5px)}to{transform:translate(0)}}@keyframes glitch-before{0%{clip-path:inset(10% 0 80% 0)}20%{clip-path:inset(50% 0 30% 0)}40%{clip-path:inset(20% 0 70% 0)}60%{clip-path:inset(90% 0 5% 0)}80%{clip-path:inset(40% 0 45% 0)}to{clip-path:inset(70% 0 20% 0)}}@keyframes glitch-after{0%{clip-path:inset(80% 0 10% 0)}20%{clip-path:inset(30% 0 50% 0)}40%{clip-path:inset(70% 0 20% 0)}60%{clip-path:inset(5% 0 90% 0)}80%{clip-path:inset(45% 0 40% 0)}to{clip-path:inset(20% 0 70% 0)}}@media (max-width:768px){.glitch,.smoke{font-size:3rem}}