/* Basic reset & layout */
html, body {
  height: 100%;
  margin: 0;
  background: #000;
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow: hidden;
}

/* Splash / Loader full screen */
#loader {
  position: fixed;
  inset: 0; /* top:0; right:0; bottom:0; left:0; */
  background: #000;
  display: flex;
  flex-direction: column;
  justify-content: center; /* vertical centering */
  align-items: center;     /* horizontal centering */
  z-index: 9999;
  transition: opacity 0.6s ease;
}

/* Center logo — truly centered */
.center-logo {
  width: 140px;            /* adjust size as needed */
  height: auto;
  max-width: 60vw;
  margin: 0;               /* IMPORTANT: no auto margins that push it elsewhere */
  display: block;
  filter: drop-shadow(0 0 6px rgba(0,255,0,0.35));
}

/* Optional loading GIF just below center logo */
.loading-gif {
  margin-top: 14px;
  width: 56px;
  height: 56px;
  display: block;
  filter: drop-shadow(0 0 8px rgba(0,255,0,0.4));
}

/* Bottom logo fixed to bottom center */
.bottom-logo {
  position: absolute;
  bottom: 26px; /* spacing from bottom; adjust for navigation bar */
  left: 50%;
  transform: translateX(-50%);
  width: 160px;
  height: auto;
  max-width: 70vw;
  display: block;
  pointer-events: none; /* won't intercept taps unless you want it clickable */
}

/* iframe (hidden until splash removed) */
iframe#webview {
  width: 100%;
  height: 100%;
  border: 0;
  display: none;
}