*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}a{all:unset;cursor:pointer}body{font-family:Orbitron,sans-serif;min-height:100vh;background:#050111 url(../assets/images/space_background.png) repeat;animation:scrollBackground 13s linear infinite;background-size:auto;display:grid;grid-template-rows:auto 1fr auto;align-items:center;overflow-x:hidden;overflow-y:auto;position:relative}body:after{position:fixed;top:0;right:0;bottom:0;left:0;content:"";background-color:#00000073;z-index:1;pointer-events:none}.top-nav{grid-row:1;display:flex;justify-content:space-between;align-items:center;padding:20px 40px;width:100%;z-index:22}.nav-icon{width:100px;height:auto;cursor:pointer;transition:transform .3s ease;filter:drop-shadow(0 0 10px rgba(167,208,239,.5))}.nav-icon#settings{width:150px}.nav-icon:hover{transform:scale(1.1)}.game-container{grid-row:2;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8vh;z-index:22}.text{text-align:center;gap:0;cursor:pointer}h1{font-size:100px;font-weight:900;text-transform:uppercase;letter-spacing:5px;line-height:.9;position:relative}.gradient-text{color:transparent;background:linear-gradient(to right,#c388dc,#a7d0ef,#aafbfc,#a4f6fa,#dbfdf4,#f9fbac);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:3px transparent;filter:drop-shadow(0 0 15px rgba(167,208,239,.7));animation:glow 2s ease-in-out infinite alternate}.buttons{display:flex;flex-direction:column;align-items:center;gap:20px}.border-button{display:inline-block;background:linear-gradient(to right,#9dc,#bfff00);padding:4px;border-radius:68px;transition:all .3s ease-in-out}button{display:flex;justify-content:center;align-items:center;background:linear-gradient(to right,#9dc,#bfff00);color:#35013f;font-family:Orbitron,sans-serif;font-weight:900;text-transform:uppercase;border-radius:64px;border:3px solid #1a0535;transition:all .3s ease-in-out;cursor:pointer;outline:none}button.play{width:28vw;height:14vh;font-size:48px}button.instructions{width:20vw;height:10vh;font-size:20px}.border-button:hover{transform:scale(1.05);filter:drop-shadow(0 0 15px rgba(191,255,0,.6))}footer{grid-row:3;display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;padding:20px 40px;color:#fff;z-index:22}.others{display:flex;flex-direction:row;gap:40px;text-transform:uppercase;font-size:16px;text-align:center;cursor:pointer}.others p:hover{text-decoration:underline}.socials .icons{display:flex;align-items:center;gap:20px}.socials img{width:50px;height:auto;cursor:pointer;transition:transform .2s}.socials img:hover{transform:translateY(-5px)}@keyframes glow{0%{filter:drop-shadow(0 0 10px rgba(167,208,239,.5))}to{filter:drop-shadow(0 0 20px rgba(167,208,239,.9))}}@keyframes scrollBackground{0%{background-position:0 0}to{background-position:0 1024px}}.transition-ship{position:fixed;bottom:-100px;right:-100px;width:80px;z-index:9999;pointer-events:none;filter:drop-shadow(0 0 15px var(--color-teal, #aafbfc))}.ship-trail{position:fixed;width:50px;height:50px;background:linear-gradient(45deg,#c388dc,#a7d0ef,#f9fbac);border-radius:50%;filter:blur(40px);z-index:9998;opacity:.8;pointer-events:none;transform:translate(-50%,-50%)}.screen-wipe{position:fixed;top:0;right:0;bottom:0;left:0;background:#050111;z-index:10000;opacity:0;pointer-events:none;transition:opacity .5s ease-in}.screen-wipe.active{opacity:1}@keyframes flyPath{0%{transform:translate(0) rotate(-45deg)}25%{transform:translate(-25vw,-25vh) rotate(-35deg)}50%{transform:translate(-50vw,-40vh) rotate(-55deg)}75%{transform:translate(-75vw,-65vh) rotate(-40deg)}to{transform:translate(-120vw,-120vh) rotate(-45deg)}}@media(max-width:1024px){h1{font-size:80px}button.play{width:35vw;height:12vh;font-size:40px}button.instructions{width:25vw;height:9vh;font-size:18px}}@media(max-width:768px){.top-nav{padding:15px 25px}.nav-icon{width:70px}.nav-icon#settings{width:100px}h1{font-size:60px;letter-spacing:3px}button.play{width:50vw;height:10vh;font-size:32px}button.instructions{width:40vw;height:8vh;font-size:16px}footer{flex-direction:column;gap:20px;padding:20px}.others{gap:20px;font-size:14px}.socials img{width:40px}}@media(max-width:480px){.top-nav{padding:10px 15px}.nav-icon{width:50px}.nav-icon#settings{width:70px}.game-container{gap:5vh}h1{font-size:40px;letter-spacing:2px}button.play{width:70vw;min-width:200px;height:60px;font-size:24px}button.instructions{width:60vw;min-width:180px;height:50px;font-size:14px}.others{flex-direction:column;gap:10px;font-size:12px}.socials .icons{gap:15px}.socials img{width:35px}}
