@import url('https://fonts.googleapis.com/css2?family=Mochiy+Pop+One&display=swap');  
* {  
 box-sizing: border-box;  
 padding: 0;  
 margin: 0;  
 font-family: 'Mochiy Pop One', sans-serif;  
}  
body {  
 display: flex;  
 justify-content: center;  
 align-items: center;  
 min-height: 100vh;  
 background: #252839;  
}  
ul {  
 position: relative;  
 display: flex;  
 flex-direction: column;  
 gap: 30px;  
}  
ul li {  
 position: relative;  
 list-style: none;  
}  
ul li a {  
 font-size: 4em;  
 text-decoration: none;  
 letter-spacing: 2px;  
 line-height: 1em;  
 text-transform: uppercase;  
 color: transparent;  
 -webkit-text-stroke: 1px rgba(255, 255, 255, 0.5);  
}  
ul li a::before {  
 content: attr(data-text);  
 position: absolute;  
 color: var(--clr);  
 width: 0;  
 overflow: hidden;  
 transition: 1s;  
 border-right: 8px solid var(--clr);  
 -webkit-text-stroke: 1px var(--clr);  
}  
ul li a:hover::before {  
 width: 100%;  
 filter: drop-shadow(0 0 25px var(--clr))  
}  
@media only screen and (min-width: 600px) {

...

}