MENDELU: force a permanent scrollbar so reload really stops shifting (#1407)

PR #1406 reserved the scrollbar gutter with `scrollbar-gutter: stable` on
`html`, but on this theme that declaration is ignored: `body { overflow-x:
hidden }` makes BODY the propagated viewport scroll container, so a gutter
set on `html` is never held. Verified on the live build -- clientWidth still
toggled 1425<->1440 on every reload, and centred content plus the right-anchored
header chrome still jumped by the scrollbar width (the overlay can't hide it: it
lives in the page and shifts with it).

Force a permanent scrollbar via `overflow-y: scroll` on `html` (previously only
in the skipped `@supports not(...)` fallback). Measured per-rAF on the live dev
instance in the real-user condition: clientWidth now stays pinned at 1425 across
the whole reload (was 1425<->1440). scrollbar-gutter: stable is kept as a
progressive enhancement for browsers/themes where it does take effect.

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>

Author: milanmajchrak

src/styles/_global-styles.scss

@@ -2,22 +2,24 @@ html {
     position: relative;
     min-height: 100%;
 
-    // Always reserve the vertical scrollbar's width. While Angular boots it replaces the
+    // Keep the vertical scrollbar's width reserved at all times. While Angular boots it replaces the
     // server-rendered DOM, so the page is briefly too short to scroll: the scrollbar disappears and
-    // then comes back, widening and re-narrowing the viewport and sliding every centred container
-    // sideways by half the scrollbar width (~7.5px right, then back). The anti-flicker overlay cannot
-    // hide that, because the overlay lives in the page and shifts with it.
+    // then comes back, widening and re-narrowing the viewport and sliding centred content and every
+    // right-anchored element (search icon, login/user menu) sideways by the scrollbar width, then
+    // back. The anti-flicker overlay cannot hide that, because the overlay lives in the page and
+    // shifts with it.
+    //
+    // We force a permanent scrollbar with overflow-y: scroll. scrollbar-gutter: stable would be the
+    // tidier tool (it reserves the space without drawing a track on short pages), but it is IGNORED
+    // on this theme: `body { overflow-x: hidden }` below makes BODY the propagated viewport scroll
+    // container, so a gutter declared on `html` is never actually held -- verified on the live build,
+    // where clientWidth still toggled 1425<->1440 on every reload despite the stable gutter. Making
+    // `html` a definite scroll container is what pins the width. scrollbar-gutter is kept as a
+    // progressive enhancement for browsers/themes where it does take effect.
+    overflow-y: scroll;
     scrollbar-gutter: stable;
 }
 
-// scrollbar-gutter is unsupported before Chrome 94 / Firefox 97 / Safari 16; keeping the scrollbar
-// track permanently visible reserves the same width there.
-@supports not (scrollbar-gutter: stable) {
-    html {
-        overflow-y: scroll;
-    }
-}
-
 body {
     overflow-x: hidden;
 }