:root {
  --app-safe-area-color: #eef7ff;
  background-color: var(--app-safe-area-color);
}

html,
body,
#root {
  background-color: var(--app-safe-area-color);
}

#root::before {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  left: 0;
  height: var(--app-safe-top, env(safe-area-inset-top, 0px));
  background: var(--app-safe-area-color);
  content: "";
  pointer-events: none;
}

@media (display-mode: standalone) {
  html,
  body,
  #root {
    background-color: var(--app-safe-area-color);
  }
}