Update: I figured out how to inspect CSS in browser…right-click the “print invoice” or “print delivery notes” link/icon to open in a new tab. There the inspector works as usual.
However, I still haven’t been able to find a full-proof solution to the page break mid-line in Chrome. Though I found if opening in a new tab and printing from there, the following fix works (placed in @media print):
tr {page-break-inside: avoid;}
In Firefox, this is also working (even when clicking the icon directly).
I don’t know about any other browsers, but these solutions will be good enough for me.