Как организовать в pug/jade умное управление отступами внутри <pre><code>?

Question

[Павел]

Пишу документацию по проекту, которая представляет из себя простой HTML файлик с примерами разметки и source кодом к каждому примеру. Поскольку и сурс-код и пример - это один и тот же код, то HTML файлик компилируется из pug (jade), где для этого кода предусмотрен один миксин (для показа сурс-кода миксин оборачивается в <pre><code>).

Но есть проблема с выводом сурс-кода, которая касается юзабилити и эстетики. Из-за вложенности, которая получается в скомпилированном HTML, у сурс-кода очень большие отступы от левого края.

Демо: codepen.io/anon/pen/rjeBWL?editors=1010

Отсюда вопрос: можно ли как-то избавиться от лишних отступов, сохранив внутреннюю вложенность сурс-кода и возможность использования пре-процессора (главным образом, для миксинов)? Возможно, есть альтернативные пре-процессоры, где это можно реализовать "из коробки"?

Для наглядности, вот желаемый результат: codepen.io/anon/pen/MJyWxX?editors=1010