function MainComponent() { const [gameState, setGameState] = useState("waiting"); const [multiplier, setMultiplier] = useState(1.0); const [crashPoint, setCrashPoint] = useState(null); const [gameHistory, setGameHistory] = useState([]); const [rocketPosition, setRocketPosition] = useState({ x: 50, y: 85, rotation: 0 }); const [gameStartTime, setGameStartTime] = useState(null); const [playerEjected, setPlayerEjected] = useState(false); const [ejectionMultiplier, setEjectionMultiplier] = useState(null); const [showResult, setShowResult] = useState(false); const [stars, setStars] = useState([]); const [planets, setPlanets] = useState([]); const [fuelLevel, setFuelLevel] = useState(100); const [currentZone, setCurrentZone] = useState("Earth"); const [error, setError] = useState(null); // Initialize cosmic background elements useEffect(()=>{ const initialStars = Array.from({ length: 150 }, (_, i)=>({ id: i, x: Math.random() * 100, y: Math.random() * 100, size: 0.5 + Math.random() * 2, brightness: 0.3 + Math.random() * 0.7, twinkleSpeed: 1 + Math.random() * 3 })); setStars(initialStars); const initialPlanets = [ { id: 1, x: 15, y: 25, size: 8, color: "from-red-500 to-orange-600", name: "Mars" }, { id: 2, x: 75, y: 40, size: 12, color: "from-yellow-400 to-orange-500", name: "Jupiter" }, { id: 3, x: 25, y: 70, size: 6, color: "from-blue-400 to-cyan-500", name: "Neptune" } ]; setPlanets(initialPlanets); }, []); // Fetch crash point when game starts const fetchCrashPoint = async ()=>{ try { const response = await fetch("/api/crash-point", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ serverSeed: "rocket-rush-" + Date.now(), clientSeed: "cosmic-" + Math.random(), nonce: gameHistory.length }) }); if (!response.ok) { throw new Error(`When fetching /api/crash-point, the response was [${response.status}] ${response.statusText}`); } const data = await response.json(); return data.crashPoint; } catch (error) { console.error(error); setError("Failed to fetch crash point"); return 2.0 + Math.random() * 8; } }; // Start rocket launch const startLaunch = async ()=>{ const newCrashPoint = await fetchCrashPoint(); setCrashPoint(newCrashPoint); setGameState("launching"); setMultiplier(1.0); setRocketPosition({ x: 50, y: 85, rotation: 0 }); setGameStartTime(Date.now()); setPlayerEjected(false); setEjectionMultiplier(null); setShowResult(false); setError(null); setFuelLevel(100); setCurrentZone("Earth"); }; // Launch escape pod const launchEscapePod = ()=>{ if (gameState !== "launching" || playerEjected) return; setPlayerEjected(true); setEjectionMultiplier(multiplier); setGameState("escaped"); setTimeout(()=>{ setShowResult(true); setGameHistory((prev)=>[ { multiplier: multiplier, crashPoint: crashPoint, won: true, zone: currentZone, timestamp: Date.now() }, ...prev.slice(0, 9) ]); }, 1500); }; // Game loop useEffect(()=>{ if (gameState !== "launching" || !gameStartTime || !crashPoint) return; const interval = setInterval(()=>{ const elapsed = Date.now() - gameStartTime; const newMultiplier = 1.0 + elapsed / 1000 * 0.6; setMultiplier(newMultiplier); // Update rocket position and fuel const progress = Math.min((newMultiplier - 1) / (crashPoint - 1), 1); const newY = 85 - progress * 75; const newX = 50 + Math.sin(progress * Math.PI * 2) * 5; const newRotation = Math.sin(progress * Math.PI * 4) * 3; const newFuel = Math.max(0, 100 - progress * 95); setRocketPosition({ x: newX, y: newY, rotation: newRotation }); setFuelLevel(newFuel); // Update current zone if (newMultiplier < 1.5) { setCurrentZone("Atmosphere"); } else if (newMultiplier < 3.0) { setCurrentZone("Low Orbit"); } else if (newMultiplier < 6.0) { setCurrentZone("High Orbit"); } else { setCurrentZone("Deep Space"); } // Check if crashed if (newMultiplier >= crashPoint && !playerEjected) { setGameState("exploded"); setGameHistory((prev)=>[ { multiplier: newMultiplier, crashPoint: crashPoint, won: false, zone: currentZone, timestamp: Date.now() }, ...prev.slice(0, 9) ]); setTimeout(()=>{ setShowResult(true); }, 2500); } }, 50); return ()=>clearInterval(interval); }, [ gameState, gameStartTime, crashPoint, playerEjected, currentZone ]); // Reset game const resetGame = ()=>{ setGameState("waiting"); setShowResult(false); setMultiplier(1.0); setCrashPoint(null); setRocketPosition({ x: 50, y: 85, rotation: 0 }); setFuelLevel(100); setCurrentZone("Earth"); }; // Calculate space theme darkness const spaceDarkness = Math.min((multiplier - 1) / 5, 0.9); const earthVisibility = Math.max(0, 1 - (multiplier - 1) / 3); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-black relative overflow-hidden", __source: { fileName: "", lineNumber: 205, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0", __source: { fileName: "", lineNumber: 207, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-radial from-purple-900/30 via-blue-900/20 to-black transition-opacity duration-300", style: { opacity: spaceDarkness }, __source: { fileName: "", lineNumber: 209, columnNumber: 9 }, __self: this }), stars.map((star)=>/*#__PURE__*/ React.createElement("div", { key: star.id, className: "absolute bg-white rounded-full animate-pulse", style: { left: `${star.x}%`, top: `${star.y}%`, width: `${star.size}px`, height: `${star.size}px`, opacity: star.brightness, animationDuration: `${star.twinkleSpeed}s` }, __source: { fileName: "", lineNumber: 216, columnNumber: 11 }, __self: this })), multiplier > 1.5 && planets.map((planet)=>/*#__PURE__*/ React.createElement("div", { key: planet.id, className: `absolute rounded-full opacity-60 bg-gradient-to-br ${planet.color}`, style: { left: `${planet.x}%`, top: `${planet.y}%`, width: `${planet.size * 4}px`, height: `${planet.size * 4}px`, boxShadow: `0 0 ${planet.size * 2}px ${planet.color.includes('red') ? '#ff6b6b' : planet.color.includes('yellow') ? '#ffd93d' : '#4ecdc4'}` }, __source: { fileName: "", lineNumber: 232, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 left-1/2 transform -translate-x-1/2 translate-y-1/2 w-96 h-96 rounded-full bg-gradient-to-br from-blue-500 via-green-500 to-blue-600 shadow-2xl", style: { opacity: earthVisibility, boxShadow: `0 0 60px rgba(34, 197, 94, ${earthVisibility * 0.5})` }, __source: { fileName: "", lineNumber: 246, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-4 rounded-full bg-gradient-to-br from-green-600 to-green-700 opacity-80", __source: { fileName: "", lineNumber: 254, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-8 left-12 w-16 h-12 rounded-full bg-green-600 opacity-60", __source: { fileName: "", lineNumber: 255, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-20 right-8 w-20 h-16 rounded-full bg-green-600 opacity-60", __source: { fileName: "", lineNumber: 256, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-16 left-16 w-24 h-20 rounded-full bg-green-600 opacity-60", __source: { fileName: "", lineNumber: 257, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 h-screen flex flex-col", __source: { fileName: "", lineNumber: 262, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center pt-4 pb-2", __source: { fileName: "", lineNumber: 264, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl sm:text-4xl font-bold bg-gradient-to-r from-purple-400 via-pink-400 to-cyan-400 bg-clip-text text-transparent mb-2 font-orbitron", __source: { fileName: "", lineNumber: 265, columnNumber: 11 }, __self: this }, "🚀 ROCKET RUSH"), gameState === "launching" && /*#__PURE__*/ React.createElement("div", { className: "text-3xl sm:text-5xl font-bold text-yellow-400 font-mono animate-pulse", __source: { fileName: "", lineNumber: 269, columnNumber: 13 }, __self: this }, multiplier.toFixed(2), "x")), /*#__PURE__*/ React.createElement("div", { className: "flex-1 relative", __source: { fileName: "", lineNumber: 276, columnNumber: 9 }, __self: this }, (gameState === "launching" || gameState === "escaped") && /*#__PURE__*/ React.createElement("div", { className: "absolute transition-all duration-75 ease-linear z-20", style: { left: `${rocketPosition.x}%`, top: `${rocketPosition.y}%`, transform: `rotate(${rocketPosition.rotation}deg)` }, __source: { fileName: "", lineNumber: 279, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 288, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl sm:text-6xl", __source: { fileName: "", lineNumber: 289, columnNumber: 17 }, __self: this }, "🚀"), gameState === "launching" && /*#__PURE__*/ React.createElement("div", { className: "absolute top-8 left-1/2 transform -translate-x-1/2", __source: { fileName: "", lineNumber: 293, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-2 h-8 bg-gradient-to-b from-orange-400 via-red-500 to-yellow-600 rounded-full animate-pulse", __source: { fileName: "", lineNumber: 294, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute -left-1 top-4 w-4 h-12 bg-gradient-to-b from-orange-300/70 via-red-400/70 to-transparent rounded-full animate-pulse", __source: { fileName: "", lineNumber: 295, columnNumber: 21 }, __self: this })), playerEjected && /*#__PURE__*/ React.createElement("div", { className: "absolute -top-12 -right-8 text-2xl animate-bounce", __source: { fileName: "", lineNumber: 301, columnNumber: 19 }, __self: this }, "🛸"))), gameState === "exploded" && /*#__PURE__*/ React.createElement("div", { className: "absolute z-20", style: { left: `${rocketPosition.x}%`, top: `${rocketPosition.y}%` }, __source: { fileName: "", lineNumber: 311, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-6xl sm:text-8xl animate-pulse", __source: { fileName: "", lineNumber: 318, columnNumber: 15 }, __self: this }, "💥"), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-orange-500 rounded-full opacity-50 animate-ping", __source: { fileName: "", lineNumber: 319, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute -inset-4 bg-red-500 rounded-full opacity-30 animate-ping", style: { animationDelay: '0.2s' }, __source: { fileName: "", lineNumber: 320, columnNumber: 15 }, __self: this })), gameState === "launching" && /*#__PURE__*/ React.createElement("div", { className: "absolute left-4 top-4 bg-black/70 backdrop-blur-sm rounded-lg p-3 text-white border border-purple-500/30", __source: { fileName: "", lineNumber: 326, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm opacity-75", __source: { fileName: "", lineNumber: 327, columnNumber: 15 }, __self: this }, "Current Zone"), /*#__PURE__*/ React.createElement("div", { className: "text-xl font-bold text-purple-400", __source: { fileName: "", lineNumber: 328, columnNumber: 15 }, __self: this }, currentZone), /*#__PURE__*/ React.createElement("div", { className: "text-xs opacity-60", __source: { fileName: "", lineNumber: 329, columnNumber: 15 }, __self: this }, "Altitude: ", Math.round((multiplier - 1) * 10000), "km")), gameState === "launching" && /*#__PURE__*/ React.createElement("div", { className: "absolute right-4 top-4 bg-black/70 backdrop-blur-sm rounded-lg p-3 text-white border border-cyan-500/30", __source: { fileName: "", lineNumber: 337, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm opacity-75 mb-2", __source: { fileName: "", lineNumber: 338, columnNumber: 15 }, __self: this }, "Fuel"), /*#__PURE__*/ React.createElement("div", { className: "w-24 h-3 bg-gray-800 rounded-full overflow-hidden", __source: { fileName: "", lineNumber: 339, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `h-full transition-all duration-300 ${fuelLevel > 50 ? 'bg-green-500' : fuelLevel > 25 ? 'bg-yellow-500' : 'bg-red-500'}`, style: { width: `${fuelLevel}%` }, __source: { fileName: "", lineNumber: 340, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-xs opacity-60 mt-1", __source: { fileName: "", lineNumber: 348, columnNumber: 15 }, __self: this }, Math.round(fuelLevel), "%"))), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 354, columnNumber: 9 }, __self: this }, gameState === "waiting" && /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 356, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black/70 backdrop-blur-sm rounded-2xl p-6 mb-4 border border-purple-500/30", __source: { fileName: "", lineNumber: 357, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-3", __source: { fileName: "", lineNumber: 358, columnNumber: 17 }, __self: this }, "🚀 Ready for Launch?"), /*#__PURE__*/ React.createElement("p", { className: "text-white/80 mb-4", __source: { fileName: "", lineNumber: 361, columnNumber: 17 }, __self: this }, "Launch your rocket into deep space! Watch the multiplier increase as you travel further from Earth. Launch your escape pod before the rocket explodes!"), /*#__PURE__*/ React.createElement("button", { onClick: startLaunch, className: "w-full px-8 py-4 bg-gradient-to-r from-purple-600 to-pink-700 hover:from-purple-700 hover:to-pink-800 text-white font-bold rounded-xl text-lg transition-all duration-300 shadow-lg hover:scale-105 active:scale-95", __source: { fileName: "", lineNumber: 364, columnNumber: 17 }, __self: this }, "🚀 LAUNCH ROCKET"))), gameState === "launching" && /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 375, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: launchEscapePod, className: "w-full px-8 py-6 bg-gradient-to-r from-orange-600 to-red-700 hover:from-orange-700 hover:to-red-800 text-white font-bold rounded-xl text-xl transition-all duration-300 shadow-lg hover:scale-105 active:scale-95 animate-pulse", __source: { fileName: "", lineNumber: 376, columnNumber: 15 }, __self: this }, "🛸 LAUNCH ESCAPE POD!"), /*#__PURE__*/ React.createElement("div", { className: "mt-2 text-white/60 text-sm", __source: { fileName: "", lineNumber: 382, columnNumber: 15 }, __self: this }, "Current: ", multiplier.toFixed(2), "x • Zone: ", currentZone)), gameState === "escaped" && /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 389, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-green-900/50 backdrop-blur-sm rounded-xl p-4 border border-green-500/30", __source: { fileName: "", lineNumber: 390, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl mb-2", __source: { fileName: "", lineNumber: 391, columnNumber: 17 }, __self: this }, "🛸"), /*#__PURE__*/ React.createElement("div", { className: "text-white font-bold", __source: { fileName: "", lineNumber: 392, columnNumber: 17 }, __self: this }, "Escape Pod Launched at ", ejectionMultiplier?.toFixed(2), "x"), /*#__PURE__*/ React.createElement("div", { className: "text-green-400 text-sm", __source: { fileName: "", lineNumber: 395, columnNumber: 17 }, __self: this }, "Safe in ", currentZone, "..."))), gameState === "exploded" && !showResult && /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 403, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-red-900/50 backdrop-blur-sm rounded-xl p-4 border border-red-500/30", __source: { fileName: "", lineNumber: 404, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl mb-2", __source: { fileName: "", lineNumber: 405, columnNumber: 17 }, __self: this }, "💥"), /*#__PURE__*/ React.createElement("div", { className: "text-white font-bold", __source: { fileName: "", lineNumber: 406, columnNumber: 17 }, __self: this }, "ROCKET EXPLODED at ", multiplier.toFixed(2), "x"), /*#__PURE__*/ React.createElement("div", { className: "text-red-400 text-sm", __source: { fileName: "", lineNumber: 409, columnNumber: 17 }, __self: this }, playerEjected ? "Escape pod deployed!" : "No escape pod launched!")))), /*#__PURE__*/ React.createElement("div", { className: "px-4 pb-4", __source: { fileName: "", lineNumber: 418, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black/50 backdrop-blur-sm rounded-xl p-3 border border-purple-500/20", __source: { fileName: "", lineNumber: 419, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold text-sm mb-2", __source: { fileName: "", lineNumber: 420, columnNumber: 13 }, __self: this }, "Mission History"), /*#__PURE__*/ React.createElement("div", { className: "space-y-1 max-h-20 overflow-y-auto", __source: { fileName: "", lineNumber: 423, columnNumber: 13 }, __self: this }, gameHistory.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "text-white/50 text-xs text-center py-2", __source: { fileName: "", lineNumber: 425, columnNumber: 17 }, __self: this }, "No missions yet") : gameHistory.map((mission, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `flex justify-between items-center text-xs p-2 rounded ${mission.won ? "bg-green-900/30 text-green-400" : "bg-red-900/30 text-red-400"}`, __source: { fileName: "", lineNumber: 430, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 438, columnNumber: 21 }, __self: this }, mission.won ? "🛸" : "💥", " Mission #", gameHistory.length - index), /*#__PURE__*/ React.createElement("span", { className: "font-mono", __source: { fileName: "", lineNumber: 441, columnNumber: 21 }, __self: this }, mission.won ? `+${mission.multiplier.toFixed(2)}x` : `${mission.multiplier.toFixed(2)}x`), /*#__PURE__*/ React.createElement("span", { className: "text-xs opacity-75", __source: { fileName: "", lineNumber: 446, columnNumber: 21 }, __self: this }, mission.zone))))))), showResult && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/90 backdrop-blur-sm flex items-center justify-center z-50 p-4", __source: { fileName: "", lineNumber: 459, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black/80 backdrop-blur-xl rounded-2xl p-6 border border-purple-500/30 text-center max-w-sm w-full", __source: { fileName: "", lineNumber: 460, columnNumber: 11 }, __self: this }, playerEjected ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "text-6xl mb-4", __source: { fileName: "", lineNumber: 463, columnNumber: 17 }, __self: this }, "🎉"), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-green-400 mb-2", __source: { fileName: "", lineNumber: 464, columnNumber: 17 }, __self: this }, "MISSION SUCCESS!"), /*#__PURE__*/ React.createElement("div", { className: "text-white mb-2", __source: { fileName: "", lineNumber: 467, columnNumber: 17 }, __self: this }, "Escape pod launched at", " ", /*#__PURE__*/ React.createElement("span", { className: "font-bold text-yellow-400", __source: { fileName: "", lineNumber: 469, columnNumber: 19 }, __self: this }, ejectionMultiplier?.toFixed(2), "x")), /*#__PURE__*/ React.createElement("div", { className: "text-white/60 text-sm mb-2", __source: { fileName: "", lineNumber: 473, columnNumber: 17 }, __self: this }, "Reached: ", currentZone), /*#__PURE__*/ React.createElement("div", { className: "text-white/60 text-sm mb-4", __source: { fileName: "", lineNumber: 476, columnNumber: 17 }, __self: this }, "Rocket exploded at ", crashPoint?.toFixed(2), "x")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "text-6xl mb-4", __source: { fileName: "", lineNumber: 482, columnNumber: 17 }, __self: this }, "💥"), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-red-400 mb-2", __source: { fileName: "", lineNumber: 483, columnNumber: 17 }, __self: this }, "MISSION FAILED!"), /*#__PURE__*/ React.createElement("div", { className: "text-white mb-2", __source: { fileName: "", lineNumber: 486, columnNumber: 17 }, __self: this }, "Rocket exploded at", " ", /*#__PURE__*/ React.createElement("span", { className: "font-bold text-red-400", __source: { fileName: "", lineNumber: 488, columnNumber: 19 }, __self: this }, multiplier.toFixed(2), "x")), /*#__PURE__*/ React.createElement("div", { className: "text-white/60 text-sm mb-4", __source: { fileName: "", lineNumber: 492, columnNumber: 17 }, __self: this }, "No escape pod launched in time!")), /*#__PURE__*/ React.createElement("button", { onClick: resetGame, className: "w-full px-6 py-3 bg-gradient-to-r from-purple-600 to-pink-700 hover:from-purple-700 hover:to-pink-800 text-white font-bold rounded-xl transition-all duration-300 hover:scale-105 active:scale-95", __source: { fileName: "", lineNumber: 498, columnNumber: 13 }, __self: this }, "🚀 LAUNCH AGAIN"))), error && /*#__PURE__*/ React.createElement("div", { className: "absolute top-4 left-4 right-4 bg-red-900/80 backdrop-blur-sm text-white p-3 rounded-lg border border-red-500/30 text-center z-50", __source: { fileName: "", lineNumber: 510, columnNumber: 9 }, __self: this }, error), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 515, columnNumber: 7 }, __self: this }, ` .bg-gradient-radial { background: radial-gradient(circle at center, var(--tw-gradient-stops)); } @keyframes float-rocket { 0%, 100% { transform: translateY(0px) rotate(0deg); } 25% { transform: translateY(-2px) rotate(1deg); } 50% { transform: translateY(0px) rotate(0deg); } 75% { transform: translateY(-1px) rotate(-1deg); } } .animate-float-rocket { animation: float-rocket 3s ease-in-out infinite; } `)); }