| * { | |
| margin: 0; | |
| padding: 0; | |
| box-sizing: border-box; | |
| } | |
| body { | |
| background-color: #121212; | |
| font-family: 'Arial', sans-serif; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| height: 100vh; | |
| } | |
| .game-container { | |
| position: relative; | |
| width: 100vw; | |
| height: 100vh; | |
| overflow: hidden; | |
| } | |
| .player { | |
| position: absolute; | |
| bottom: 20px; | |
| left: 50%; | |
| width: 50px; | |
| height: 50px; | |
| background-color: #00ff00; | |
| border-radius: 50%; | |
| transform: translateX(-50%); | |
| } | |
| .falling-ball { | |
| position: absolute; | |
| top: -50px; | |
| left: 50%; | |
| width: 30px; | |
| height: 30px; | |
| background-color: #ff007f; | |
| border-radius: 50%; | |
| animation: fall 3s linear infinite; | |
| } | |
| @keyframes fall { | |
| 0% { | |
| top: -50px; | |
| } | |
| 100% { | |
| top: 100vh; | |
| } | |
| } |