Navbar title shifts from center to right when page is reloaded

Using the ios theme (svelte), and browserHistory set to true (due to a requirement keep the page if the user reloads browser), reloading the browser causes the title of the navbar to shift from the center to the right-end of the navbar, only when deployed on the webserver, (but not during tests on localhost) as shown in the gif screen recording.


I can’t figure out why, but could these css selectors be what’s messing it up?

.ios .navbar-inner {
justify-content: space-between;

.navbar-inner, .navbars>.navbar, .page>.navbar, .view>.navbar, .views>.navbar {
position: absolute;

.navbar-inner {
left: 0;
bottom: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
box-sizing: border-box;
padding: var(–f7-safe-area-top) calc(var(–f7-navbar-inner-padding-right) + var(–f7-safe-area-right)) 0 calc(var(–f7-navbar-inner-padding-left) + var(–f7-safe-area-left));
transform: translateZ(0);
z-index: 10;