/* Earliest paint — pure black before Next CSS chunk arrives. */
html,
body {
  background: #000000 !important;
  background-color: #000000 !important;
  color-scheme: dark !important;
}

/* Explore stays hidden until explicitly ready (under the black plate). */
html:not(.vibeup-app-ready) #vibeup-app-shell {
  visibility: hidden !important;
}

html.vibeup-splash-skip .vibeup-splash {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Demote only with this class — never tie it to splash-skip (white flash). */
html.vibeup-paint-demoted #vibeup-critical-paint {
  z-index: -1 !important;
  pointer-events: none !important;
}

#vibeup-critical-paint {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9990 !important;
  background: #000000 !important;
  background-color: #000000 !important;
  pointer-events: none !important;
}

.vibeup-splash {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  background: #000000 !important;
  background-color: #000000 !important;
  pointer-events: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
  transition: none !important;
}

.vibeup-splash--exit {
  opacity: 1 !important;
  pointer-events: none !important;
  transition: none !important;
}

#vibeup-app-shell {
  position: relative;
  z-index: 1;
  min-height: 100dvh;
  background-color: #000000;
}