svg {
    max-height: 100vh;
}

svg g.board {
    stroke: rgb(178,151,100);
    fill: rgb(250,210,148);
    stroke-width: 5px;
}

pattern rect.background {
    fill: rgb(250,210,148);
}

#disk1 circle {
    fill: black;
    stroke: black;
    stroke-width: 6;
}

#disk2 circle {
    fill: white;
    stroke: black;
    stroke-width: 6;
}

polygon[data-state="1"] {
    fill: url('#disk1');
}

polygon[data-state="2"] {
    fill: url('#disk2');
}

#flipbook .control-panel {
    display: flex;
    justify-content: space-between;
    padding-top: 0;
    padding-bottom: 0;
}

#flipbook {
    max-width: 100vh;
}

#flipbook .control-panel button {
    width: 70px;
    margin: 20px;
    padding: 20px;
}


#page-number {
    font-size: xx-large;
}