mw.special.preferences: Prevent invisible accessibility hint from affecting content

With the current styles, if there is some text before the preferences
form (it can be defined in the 'preferences-summary' message), the
`<div class="mw-navigation-hint">` somehow pushes the rest of the page
content down by a few pixels. I think it might be preventing some
margins from collapsing? This actually causes a tiny FOUC after the
styles load.

Instead, use a neat pure CSS technique borrowed from Vector:
b843094a2d8c27a17e2c2b2ba97fb4aeea1d95d4.

I'm only changing the OOUI version, since the old one doesn't have the
problem.

Bug: T195986
Change-Id: I21924dd13bb83a0cb75b337ae7439c8ad8357946