.substitution_cipher {
  pre { display: inline-block; border: 1px solid black; padding: 1ch; background-color: lightgray; }
  span { display: inline-block; font-family: monospace; width: 2ch; font-size: larger; line-height: 2; text-align: center; color: #500000; }
  .mapped { color: blue; font-weight: bold; }
  .revealed { color: darkgreen; font-weight: bold; }
  .selected { background: cyan; }
  .highlighted { background: lightblue; }
  .solved span { color: green; }
  input { position: absolute; opacity: 0; pointer-events: none;  }
}