.user-input {
  color: #007F00;
}
.hint {
  --shadow-color: rgba(0, 112, 255, 0.35);
  background-color: #FFFFF0;
  border-radius: 5px;
  padding: 10px;
  margin-top: 1em;
  width: fit-content;
  /* x, y, blur, and color */
  box-shadow: -3px 5px 9px var(--shadow-color);
}
.hint h4 {
  margin-top: 0.1em;
}
@media (prefers-color-scheme: dark) {
  .hint{
    background-color: #2D2D35;
    --shadow-color: rgba(255, 227, 0, 0.5);
  }
  .user-input {
    color: #6AAB73;
  }
}
table {
  margin: 0.5em;
  border-collapse: collapse;
}
table th {
  text-align: left;
  padding-right: 1em;
  padding-left: 0.5em;
  border: 1px #ccc solid;
}
table td {
  padding: 0.5em;
  border: 1px #ccc solid;
}