body{

    font-family:Arial,sans-serif;

    line-height:1.7;

    margin:0;

    padding:0;

    background:
    linear-gradient(
        180deg,
        #020617 0%,
        #07152b 100%
    );

    color:#e2e8f0;
}

/* Header */

header{

    background:#07111f;

    padding:28px 20px;

    text-align:center;

    border-bottom:
    1px solid #1e293b;
}

header h1{

    color:#ffffff;

    margin:0;

    font-size:42px;

    letter-spacing:1px;

    text-shadow:
    0 0 15px rgba(34,197,94,0.25);
}

nav{

    margin-top:18px;
}

nav a{

    color:#4ade80;

    text-decoration:none;

    font-weight:bold;

    transition:0.25s;
}

nav a:hover{

    color:#86efac;
}

/* Main */

main{

    padding:50px 20px;

    max-width:1000px;

    margin:0 auto;
}

/* Section */

section{

    margin-bottom:60px;
}

section h2{

    color:#ffffff;

    font-size:36px;

    margin-bottom:25px;

    text-shadow:
    0 0 12px rgba(34,197,94,0.25);
}

/* Articles */

article{

    margin-bottom:50px;
}

article h2{

    color:#ffffff;
}

/* Links */

a{

    color:#4ade80;

    transition:0.25s;
}

a:hover{

    color:#86efac;
}

/* Paragraph */

p{

    color:#cbd5e1;

    font-size:18px;
}

/* Lists */

ul{

    line-height:2;
}

/* Buttons */

button{

    background:#22c55e;

    color:white;

    border:none;

    padding:14px 28px;

    border-radius:10px;

    cursor:pointer;

    font-size:16px;

    font-weight:bold;

    transition:0.25s;
}

button:hover{

    background:#16a34a;

    transform:translateY(-2px);

    box-shadow:
    0 0 18px rgba(34,197,94,0.35);
}

/* Footer */

footer{

    margin-top:80px;

    background:#07111f;

    text-align:center;

    padding:30px;

    color:#94a3b8;

    border-top:
    1px solid #1e293b;
}

/* Leaderboard */

.leaderboard{

    margin-top:40px;

    background:#111827;

    padding:30px;

    border-radius:16px;

    max-width:500px;

    margin-left:auto;

    margin-right:auto;

    border:
    1px solid #1e293b;

    box-shadow:
    0 0 25px rgba(0,0,0,0.35);
}

.leaderboard h2{

    text-align:center;

    margin-top:0;
}

#leaderboardList{

    margin-top:20px;

    line-height:2.2;

    font-size:20px;

    text-align:center;
}

/* Game Canvas */

canvas{

    border:
    4px solid #4ade80;

    border-radius:12px;

    background:#0f172a;

    box-shadow:
    0 0 30px rgba(34,197,94,0.35);

    display:block;

    margin:30px auto;
}

/* Score */

.scoreboard{

    text-align:center;

    margin-top:25px;

    font-size:28px;

    font-weight:bold;

    color:#ffffff;
}

/* Ad Space */

.ad-placeholder{

    margin:40px auto;

    padding:30px;

    max-width:700px;

    text-align:center;

    background:#111827;

    border:
    1px dashed #334155;

    border-radius:12px;

    color:#94a3b8;
}

/* Mobile */

@media (max-width:768px){

    header h1{

        font-size:32px;
    }

    section h2{

        font-size:28px;
    }

    canvas{

        width:100%;

        height:auto;
    }

    button{

        width:100%;
    }

    .leaderboard{

        padding:20px;
    }

    #leaderboardList{

        font-size:18px;
    }
}