Harlowe default responsiveness of text = too small, too narrow!

Hi all, my game in Harlowe looks great on desktops, but when the screen is narrowed for mobile:

1. The text size goes ridiculously small.
2. There is a lot of wasted blank space on both sides of the passage.
3. The undo/redo button takes up a bunch of space, reducing text size/passage space further.

How do I solve these 3 problems? In particular I want to get rid of the undo/redo buttons.

In a Twine 1.x game I made, I used the below code to control this issue, but it doesn't seem to work with Harlowe:

/* Shrink the page when viewed on devices with a low screen width */
@media screen and (max-width: 960px) {
  .passage { font-size: 100%;}
  #passages { width: 70%; }
}
@media screen and (max-width: 840px) {
  .passage {  font-size: 100%; }
  #passages { width: 80%; }
}
@media screen and (max-width: 720px) {
  .passage { font-size: 100%; }
  #passages { width: 90%; }
}