#links {
    margin-top: 4px;
    margin-bottom: 4px;
}

#buttons {
    margin-top: 8px;
    margin-bottom: 8px;
}

#stats {
    margin-top: 4px;
    margin-bottom: 4px;
}

#settings {
    margin-top: 4px;
    margin-bottom: 4px;
}

#boardSize {
    width: 5em;
}

#cellSize {
    width: 5em;
}

#ticks {
    width: 5em;
}


/* Light mode defaults */
:root {
    --conway-dead: #ffffff;
    --conway-live: #000000;
    --conway-grid: #d3d3d3;
    --conway-bg: #ffffff;
}

@media (prefers-color-scheme: dark) {
    :root {
        --conway-dead: #0d1117;      /* page background shade */
        --conway-live: #2fa8ff;      /* cyan accent for live cells */
        --conway-grid: #364a59;      /* subtle grid lines */
        --conway-bg: #1a222a;        /* canvas background */
    }
}

body {
    background: var(--conway-dead);
}

#grid {
    border: 1px solid var(--conway-grid);
    padding: 0;
    margin: 0;
    cursor: crosshair;
}

#start {
    font-size: x-large;
}

#stop {
    font-size: x-large;
}

#step {
    font-size: x-large;
}