html,
body {
  box-sizing: border-box;
  font-family: sans-serif;
}

body {
  margin: 0 1em 1em 1em;
}

table {
  table-layout: fixed;
  border-collapse: collapse;
  border: 1px solid black;
}

tr {
  border-bottom: 1px solid black;
}

th,
td {
  text-align: left;
  padding: 0.25rem 0.5rem;
}

th.number,
td.number {
  text-align: right;
}

th:not(:last-child),
td:not(:last-child) {
  border-right: 1px solid #bbb;
}

tbody tr:nth-child(even) {
  background-color: #eee;
}

@media (prefers-color-scheme: dark) {
  html,
  body {
    background-color: #000;
    color: #fff;
  }
  table {
    border-color: #fff;
  }
  tr {
    border-bottom-color: #fff;
  }
  th:not(:last-child),
  td:not(:last-child) {
    border-right-color: #444;
  }
  tbody tr:nth-child(even) {
    background-color: #222;
  }
  a {
    color: #66f;
  }
  a:visited {
    color: #b6f;
  }
  a:active {
    color: #f66;
  }
}