@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

:root {
    --highlightColor: #6515dd;
    --backgroundColor: #222;
    --backgroundHighlight: #151515;
    --panelColor: #232323;
    --panelHighlight: #2f2f2f;
    
    --softTextColor: #aaaaaa;
    --textColor: #ffffff;

    --borderRadius: 10px;
}


* {
    font-family: 'Press Start 2P', cursive; /* Apply Google Font */
    padding: 0;
    margin: 0;
    color: var(--textColor);
}

body {
    background-color: var(--backgroundColor);
    display: flex;          /* Use Flexbox for centering */
    flex-direction: column; /* Align items vertically */
    align-items: center;   /* Center horizontally */
    justify-content: center; /* Center vertically */
    min-height: 100vh;     /* Ensure full viewport height */
    height: 100vh;
    margin: 0;
}




h1 {
    font-size: 2.85vw;
    margin-bottom: 1vw;; /* Space between title and game area */
}


h2 {
    font-size: 2.85vw;
    margin-bottom: 1vw;; /* Space between title and game area */
}



a {
    text-decoration: none;
}

p {
    font-size: 1.8vw;
    margin-bottom: 1vw;;
}

li {
    font-size: 1.8vw;
}

a {
    font-size: 1.8vw;
}

hr {
    border: 0;
    height: 1px;
    background-color: var(--panelHighlight);
}



input {
    background: none;
    height: 30px;
    width: 300px;
    font-size: 1.8vw;
    border: none;
    border-bottom: 5px solid white;
    margin-top: 1vw;;
    text-align: center;
    
}


button {
    font-size: 1.8vw;
    margin-bottom: 1vw;;
}

li {
    margin-bottom: 0.5vw;;
}