body {
    font-family: Arial, sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100vh;
    background-color: #121212;
    margin: 0;
}
.header {
    text-align: center;
    color: #f9f6f2;
    margin-bottom: 20px;
}
.score-container {
    font-size: 24px;
    font-weight: bold;
    margin-top: 10px;
}
.game-container {
    width: 400px;
    height: 400px;
    background: #333;
    padding: 10px;
    border-radius: 15px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 10px;
    position: relative;
}
.tile {
    width: 90px;
    height: 90px;
    background: rgba(238, 228, 218, 0.35);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: bold;
    position: absolute;
    transition: all 0.3s ease;
    color: #eee;
}
.tile-2 { background: #e0dbd7; color: #776e65; }
.tile-4 { background: #e1c9b7; color: #776e65; }
.tile-8 { background: #f2a365; color: #f9f6f2; }
.tile-16 { background: #ff9b85; color: #f9f6f2; }
.tile-32 { background: #ff8474; color: #f9f6f2; }
.tile-64 { background: #e63946; color: #f9f6f2; }
.tile-128 { background: #ffa62b; color: #f9f6f2; }
.tile-256 { background: #e76f51; color: #f9f6f2; }
.tile-512 { background: #d62828; color: #f9f6f2; }
.tile-1024 { background: #f77f00; color: #f9f6f2; }
.tile-2048 { background: #fcbf49; color: #f9f6f2; }
.game-over {
    color: #ff4c4c;
    font-size: 32px;
    margin-top: 20px;
}
.restart-button {
    margin-top: 10px;
    padding: 10px 20px;
    font-size: 18px;
    cursor: pointer;
    border: none;
    background-color: #8f7a66;
    color: #f9f6f2;
    border-radius: 5px;
}