You’re applying a background-color to an inline element, which causes succeeding lines to partially cover preceding lines. You can add box-shadow: inset 0 0 10px; to make the overlaps visible:
Add the following to avoid overlaps:
code {
line-height: calc(1.2em + 12px);
}
As a general rule, don’t try to format <pre> and <code> with the same declaration. Be aware of the different uses and default styles of both elements. Use selector specificity to set styles that should apply to <code> when used inline (e.g. in paragraphs or list items), and use a more specific selector pre > code to reset or override these styles when <code> is used inside a <pre><code> code block combo.