body {
  font-size: 1.2em;
}

thead th {
  background-color: #eee;
  position: sticky;
  top: -1px;
  z-index: 2;
  
  &:first-of-type {
    left: 0;
    z-index: 3;
  }
}

tr > *:first-of-type {
  padding: 0.5em;
  text-align: center;
}

tbody tr td:first-of-type {
  background-color: #eee;
  position: sticky;
  left: -1px;
  z-index: 1;
}

tfoot tr td {
  background-color: #eee;
  position: sticky;
  bottom: -1px;
  text-align: right;
  padding: 0.5em;
  border: 1px solid transparent;
}

thead input {
  padding: 0.5em;
  font-size: inherit;
  font-family: inherit;
  background: none;
  border: 0;
  width: 10ch;
}

tbody input {
  padding: 0.5em;
  font-size: inherit;
  font-family: inherit;
  background: none;
  border: 0;
  text-align: right;
  max-width: 10ch;
}

input[type=number] {
  appearance: textfield;
}