@media (prefers-color-scheme: dark)
{
    body {
            background-color: #282a36;
            color: #ff79c6;
            font-family: Arial, Helvetica, sans-serif;
            text-align: center;
        }
    
        p {
            font-size: 3em;
        }
    
        table {
            text-align: center;
            margin: auto;
            border-collapse: collapse;
        }
    
        td,
        tr {
            width: 20vw;
            height: 20vh;
            border: 1vh solid #6272a4;
            font-size: 2.2em;
        }
}

@media(prefers-color-scheme: light)
{
    body {
        background-color: #FDEBED;
        color: #191825;
        font-family: Arial, Helvetica, sans-serif;
        text-align: center;
    }

    p {
        font-size: 3em;
    }

    table {
        text-align: center;
        margin: auto;
        border-collapse: collapse;
    }

    td,
    tr {
        width: 20vw;
        height: 20vh;
        border: 1vh solid #865DFF;
        font-size: 2.2em;
    }
}