html, body {
  margin: 0;
  background: #F3F4F8;
}
html[data-theme="dark"],
html[data-theme="dark"] body {
  background: #12131A;
}
#app-splash {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding:
    max(16px, env(safe-area-inset-top))
    max(16px, env(safe-area-inset-right))
    max(16px, env(safe-area-inset-bottom))
    max(16px, env(safe-area-inset-left));
  background: #F3F4F8;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}
html[data-theme="dark"] #app-splash {
  background: #12131A;
}
#app-splash.hide {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#app-splash .splash-logo {
  width: 65%;
  height: 65%;
  max-width: 100%;
  max-height: 100%;
  display: block;
  fill: #1C1D24;
}
html[data-theme="dark"] #app-splash .splash-logo {
  fill: #ECECF2;
}