.review {
  font-size: smaller;
  font-weight: bold;
  padding: .25em .5em;
  border: 1px solid rgb(0 0 0 / 10%);
  border-radius: .25rem;
}

.review.blocker {
  color: red;
  background-color: rgb(255 0 0 / 10%);
}

.review.suggestion {
  color: orange;
  background-color: rgb(255 165 0 / 10%);
}

.review.nit {
  color: rgb(0 102 0 / 100%);
  background-color: rgb(0 255 0 / 10%);
}

.review.question-label {
  color: blue;
  background-color: rgb(0 0 255 / 10%);
}

.must-fix {
  color: red;
  background-color: rgb(255 0 0 / 10%);
}

.should-fix {
  color: orange;
  background-color: rgb(255 165 0 / 10%);
}

.nice-to-have {
  color: green;
  background-color: rgb(0 255 0 / 10%);
}

.praise {
  color: blue;
  background-color: rgb(0 0 255 / 10%);
}

.checklist {
  margin: -1.25rem 0 2rem 1rem;
  list-style: ' □ ';
  /* Unicode character for an empty checkbox */
  /* list-style" '[ ] '; Alternative using a different Unicode character */

  &>li {
    margin-bottom: -1rem;
  }

  &>li::marker {
    font-size: 2em;
  }

  & ol {
    margin-top: .5rem;
  }
}