body {
    background: radial-gradient(circle at top, #19003a 0%, #000020 100%);
    margin: 0;
    font-family: 'Orbitron', 'Arial', sans-serif;
    color: #fff;
    min-height: 100vh;
    overflow-x: hidden;
}

.dashboard-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
}

/* ---------- HEADER ---------- */
header {
    margin-top: 40px;
    margin-bottom: 30px;
}

.neon-text {
    font-size: 3em;
    color: #19fffa;
    text-shadow:
        0 0 15px #19fffa,
        0 0 40px #19fffa,
        0 0 80px #19fffa;
    letter-spacing: 3px;
    animation: flicker 3s infinite alternate;
}

.subtitle {
    font-size: 1.3em;
    color: #ffdefc;
    text-shadow: 0 0 10px #d426e3;
    margin-bottom: 25px;
    animation: glow-pulse 2.5s infinite alternate;
}

/* ---------- NAVIGATION ---------- */
.nav-links {
    margin-bottom: 30px;
    display: flex;
    gap: 25px;
    justify-content: center;
}

.neon-link {
    color: #19fffa;
    text-decoration: none;
    font-size: 1.1em;
    text-shadow: 0 0 10px #19fffa;
    transition: 0.3s;
}

.neon-link:hover {
    color: #fa25b2;
    text-shadow: 0 0 20px #fa25b2;
    transform: scale(1.1);
}

/* ---------- GAME CARDS ---------- */
.games-list {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.game-card {
    background: rgba(25, 5, 60, 0.8);
    padding: 35px 50px;
    margin: 40px 15px;
    border-radius: 20px;
    box-shadow: 0 0 25px 8px #28fdd3,
                0 0 6px 3px #19fffa inset;
    transition: 0.4s;
}

.game-card:hover {
    box-shadow: 0 0 50px 20px #fa25b2,
                0 0 15px 10px #fff08e inset;
    transform: translateY(-8px) scale(1.05);
}

.game-card h2 {
    color: #fa25b2;
    text-shadow: 0 0 15px #fa25b2;
    margin: 0 0 15px 0;
    font-size: 2em;
}

.game-card p {
    color: #fff08e;
    text-shadow: 0 0 10px #fff08e;
    font-size: 1.2em;
    margin-bottom: 25px;
}

/* ---------- BUTTON ---------- */
.neon-button {
    background: linear-gradient(90deg, #19fffa 0%, #fa25b2 100%);
    color: #fff;
    font-size: 1.1em;
    padding: 14px 40px;
    border: none;
    border-radius: 50px;
    box-shadow: 0 0 15px #19fffa;
    text-transform: uppercase;
    letter-spacing: 2px;
    cursor: pointer;
    transition: 0.3s;
}

.neon-button:hover {
    background: linear-gradient(90deg, #fa25b2 0%, #19fffa 100%);
    box-shadow: 0 0 35px #fa25b2;
    transform: scale(1.08);
}

/* ---------- FOOTER ---------- */
footer {
    margin: 50px 0 20px 0;
    color: #ffffff88;
    font-size: 0.9em;
}

/* ---------- ANIMATIONS ---------- */
@keyframes flicker {
    0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
        opacity: 1;
    }
    20%, 24%, 55% {
        opacity: 0.5;
    }
}

@keyframes glow-pulse {
    from { text-shadow: 0 0 10px #19fffa; }
    to { text-shadow: 0 0 25px #fa25b2; }
}

.float {
    animation: float 4s ease-in-out infinite;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 600px) {
    .neon-text {
        font-size: 2.2em;
    }

    .game-card {
        padding: 25px;
        margin: 20px;
    }

    .nav-links {
        flex-direction: column;
        gap: 10px;
    }
}

