:root{
    font-family: Inter, sans-serif;
    font-size:18px;
}

*{
    margin: 0;
    padding: 0;
    font: inherit;
    vertical-align: baseline;
}

main{
    padding: 2rem 2ch;
}
h1{
    font-size: 1.5rem;
    font-weight: 700;
    padding-bottom: 0.1lh;
}

h2{
    font-size: 1.25rem;
    font-weight: 400;
    padding-bottom: 0.1lh;
}

.button-wrapper{
    margin-top: 10px;
    display: flex;
    gap: 1ch;
}

.button-wrapper button{
    flex: 1;
    height: 2em;
}
.score-sheet{
    margin-top: 2rem;
    padding: 1ch;
    border: solid black 1px;
}

#score-table{
    table-layout: auto;
    border-collapse: collapse;
    width: 100%;
    font-size: clamp(0.5rem, 2.073vw + -0.036rem, 1rem);
}

.table-heading-row{
    font-weight: 700;
    text-align: left;
    
}
tr{
    padding: 10px;
}

td{
    text-transform: capitalize;
}

@media screen and (max-width: 700px){
    td:nth-child(3), th:nth-child(3){
        display: none;
    }
    /* body{
        background-color: pink;
    } */
}