HTML5-Schieber verschwinden im Chrome-Gerätemodus

Das könnte einfach ein Chrome-Bug sein, aber ich habe noch nirgendwo erwähnt, dass es hier erwähnt wird.

Ich arbeite an einer einfachen Übung als Teil der JavaScript30.com-Übungen. Die Übung verwendet einige HTML5-Bereichseingaben, um CSS-Variablen über Javascript zu aktualisieren.

Ich habe festgestellt, dass die Bereichseingaben von der Seite verschwinden, wenn ich die Chrome-Entwicklungstools im reaktionsfähigen Anzeigemodus verwende. Die Überprüfung zeigt, dass sie sich tatsächlich im DOM befinden, aber ihre Höhe wurde auf 0 px festgelegt. Es gibt nichts im CSS, das ich als Täter sehen kann, und wenn ich den reagierenden Anzeigemodus beende, werden die Eingaben wie erwartet angezeigt.

Ist das eine Eigenart mit den Tools von Chrome oder gibt es einige CSS, um dies zu verhindern?

Entschlüsselter Code folgt.