body {
  margin-block: 0;
  margin-inline: 2ch;
  display: flex;

  /* Flex Axis */
  justify-content: space-between;
  gap: 2ch;
  /* Cross Axis */
  align-items: flex-start;

  background-color: bisque;
}

main {
  /* Flex Axis */
  overflow-x: scroll;
}

#sidebar {
  /* Flex Axis */
  width: 40ch;
  flex-shrink: 0;
  /* Cross Axis */
  position: sticky;
  top: 0ch;
  height: 100vh;
  overflow-y: auto;

  background-color: blanchedalmond;
}

@media (width < 130ch) {
  #sidebar {
    display: none;
  }
}

h1,
h2,
h3 {
  text-decoration: underline double;
}

thead th {
  padding-inline-end: 1em;
  text-align: start;
}

td {
  vertical-align: top;
}

p,
li {
  max-width: 80ch;
}

img {
  max-width: 100%;
}

details details {
  margin-inline-start: 2ch;
}

details summary {
  font-size: 1.5em; /* Match h2 size. */
  font-weight: bold;
  text-decoration: underline double;
}

.utf-8000-bits,
.utf-8000-byte {
  /* font-family: monospace; */
  /* font-family: "Courier New", Courier, monospace; */
  background-color: dimgray;
  margin-inline: 0ch;
  padding-inline: 1ch;
  text-wrap-mode: nowrap;
}

.utf-8000-bits-self-sync-first {
  font-weight: bold;
  color: cyan;
}

.utf-8000-bits-self-sync-continuation {
  font-weight: bold;
  color: cyan;
}

.utf-8000-bits-z {
  color: orange;
}

.utf-8000-bits-start {
  font-weight: bold;
  color: magenta;
}

.utf-8000-bits-content-mandatory {
  font-weight: bold;
  color: lime;
}

.utf-8000-bits-content-optional {
  color: lime;
}

.utf-8000-bits-unknown {
  color: white;
}

.utf-16000-bits-surrogate-frame {
  font-weight: bold;
  color: pink;
}

.utf-16000-bits-surrogate-plane {
  font-weight: bold;
  color: crimson;
}

.byte-table {
  font-family: monospace;
  font-size: large;
  border-spacing: 0.5ch;
  text-align: center;
}

.byte-table th {
  width: 2ch;
}

.byte-table td {
  width: 2ch;
}

.table-byte-1 {
  background-color: gold;
}

.table-byte-2 {
  background-color: yellowgreen;
}

.table-byte-3 {
  background-color: olivedrab;
}

.table-byte-4 {
  background-color: lightseagreen;
}

.table-byte-5 {
  background-color: deepskyblue;
}

.table-byte-6 {
  background-color: royalblue;
}

.table-byte-7 {
  background-color: mediumpurple;
}

.table-byte-8 {
  background-color: violet;
}

.table-byte-continuation {
  background-color: sandybrown;
}

.table-byte-never {
  background-color: tomato;
}