body {
  font-family: sans-serif;
}

div {
  padding: 5px;
}

label {
  width: 60px;
  display: inline-block;
  padding-left: 4px;
}

label[for],
button {
  cursor: pointer;
}

button {
  margin-left: 4px;
  padding: 3px 6px;
}

input[type="text"] {
  padding: 3px 6px;
  width: 80px;
}

input[type="radio"],
input[type="checkbox"] {
  padding: 0;
  margin: 0;
  cursor: pointer;
}

input[type="text"]::placeholder {
  color: darkgrey;
}

#result {
  font-weight: bold;
  margin: 12px 8px;
  padding: 5px 0;
}

#result:empty {
  display: none;
}

#error {
  border: 2px solid darkred;
  background: lightpink;
  display: inline-block;
  color: darkred;
  margin: 10px 8px;
  white-space: pre;
}

#error:empty {
  display: none;
}