/* v222: Sadrano developer-brand launch splash shared by desktop and mobile. */
#hm221Splash { display: none; }
html.hm221-splash-active { background: #01050e; }
html.hm221-splash-active body { overflow: hidden; }
html.hm221-splash-active #hm221Splash {
  display: flex;
  position: fixed;
  inset: 0;
  width: 100%;
  min-height: 100%;
  z-index: 2147483646;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: max(24px, env(safe-area-inset-top, 0px)) 16px max(24px, env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  overflow: hidden;
  background: #01050e;
  color: #f8db83;
  direction: rtl;
  isolation: isolate;
  animation: hm221-splash-enter .2s ease-out both;
}
#hm221Splash .hm221-splash__art {
  position: relative;
  width: min(400px, 85vw);
  aspect-ratio: 358 / 357;
  flex: 0 0 auto;
}
#hm221Splash .hm221-splash__logo,
#hm221Splash .hm221-splash__fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: opacity 170ms ease-out;
}
#hm221Splash .hm221-splash__logo { display: block; }
#hm221Splash .hm221-splash__logo--poster { opacity: 0; }
#hm221Splash.hm221-splash--poster-ready .hm221-splash__logo--poster { opacity: 1; }
#hm221Splash .hm221-splash__logo--animated { opacity: 0; }
#hm221Splash.hm221-splash--playing .hm221-splash__logo--animated { opacity: 1; }
#hm221Splash.hm221-splash--playing .hm221-splash__logo--poster { opacity: 0; }
#hm221Splash .hm221-splash__fallback {
  display: grid;
  place-items: center;
  font-weight: 850;
  font-size: clamp(34px, 11vw, 60px);
  color: #f6cd67;
  text-shadow: 0 0 18px rgba(242, 175, 51, .32);
}
#hm221Splash.hm221-splash--poster-ready .hm221-splash__fallback,
#hm221Splash.hm221-splash--playing .hm221-splash__fallback { opacity: 0; }
#hm221Splash .hm221-splash__subtext {
  margin: 8px 0 0;
  color: #b1bed3;
  font-size: 12px;
  font-weight: 550;
  text-align: center;
  letter-spacing: 0;
}
#hm221Splash .hm221-splash__skip {
  position: absolute;
  left: max(15px, env(safe-area-inset-left, 0px));
  bottom: max(20px, env(safe-area-inset-bottom, 0px));
  min-height: 44px;
  min-width: 84px;
  padding: 8px 16px;
  border: 1px solid #52647d;
  border-radius: 12px;
  background: rgba(255,255,255,.07);
  color: #eff4ff;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
#hm221Splash .hm221-splash__skip:focus-visible {
  outline: 2px solid #eeca67;
  outline-offset: 3px;
}
#hm221Splash.hm221-splash--closing { opacity: 0; pointer-events: none; transition: opacity 210ms ease; animation: none; }
@keyframes hm221-splash-enter { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  #hm221Splash, #hm221Splash *, #hm221Splash *::before, #hm221Splash *::after {
    animation: none !important;
    transition: none !important;
  }
}

@media screen and (max-width: 900px) {
  #hm221Splash .hm221-splash__art { width: min(358px, 83vw); }
}
