/* First-paint brand splash. This tiny blocking stylesheet keeps the native launch
   image and first WebView frame pixel-aligned without requiring inline CSS. */
#splash {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #181412;
  opacity: 1;
  transition: opacity .42s ease;
  -webkit-tap-highlight-color: transparent;
}
#splash.splash-hide { opacity: 0; pointer-events: none; }
#splash .splash-mark {
  width: 136px;
  height: 136px;
  color: #e8a33d;
  filter: drop-shadow(0 6px 20px rgba(0, 0, 0, .35));
}
#splash .splash-mark svg { width: 100%; height: 100%; display: block; }
#splash .splash-part { fill: currentColor; transform-box: fill-box; transform-origin: center; }
html:not(.standalone) #splash .splash-base { animation: muster-base-in .38s cubic-bezier(.2, .78, .2, 1) both; }
html:not(.standalone) #splash .splash-body { animation: muster-body-in .42s .06s cubic-bezier(.2, .78, .2, 1) both; }
html:not(.standalone) #splash .splash-head { animation: muster-head-in .36s .14s cubic-bezier(.2, .78, .2, 1) both; }
@keyframes muster-base-in { from { opacity: 0; transform: translateY(15px) scaleX(.82); } to { opacity: 1; transform: none; } }
@keyframes muster-body-in { from { opacity: 0; transform: translateY(-13px) rotate(-3deg); } to { opacity: 1; transform: none; } }
@keyframes muster-head-in { from { opacity: 0; transform: translateY(-18px) scale(.82); } 75% { transform: translateY(2px) scale(1.03); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  #splash { transition: opacity .2s ease; }
  #splash .splash-part { animation: none !important; }
}
