/* Neyyi customer loading: soft glass, candy-pink motion and lightweight CSS-only details. */
#initialSplash[hidden],
#internalLoading[hidden],
#loadingError[hidden] {
  display: none !important;
}

#initialSplash,
#internalLoading {
  position: fixed;
  inset: 0;
  z-index: 20000;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
}

#initialSplash {
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 221, 235, .92) 0 8%, transparent 32%),
    radial-gradient(circle at 84% 75%, rgba(246, 190, 217, .56) 0 9%, transparent 34%),
    linear-gradient(145deg, #fffdfd 0%, #fff7fb 47%, #fffafb 100%);
  opacity: 1;
  transition: opacity .38s ease, visibility .38s ease;
}

#initialSplash.is-leaving {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.loading-ambient {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.loading-ambient span {
  position: absolute;
  display: block;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .72), rgba(246, 184, 214, .22));
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .85), 0 16px 36px rgba(211, 116, 157, .08);
  filter: blur(.2px);
  animation: neyyiBubbleFloat 7s ease-in-out infinite;
}

.loading-ambient span:nth-child(1) {
  top: 12%;
  left: 10%;
  width: 72px;
  height: 72px;
}

.loading-ambient span:nth-child(2) {
  right: 8%;
  bottom: 13%;
  width: 108px;
  height: 108px;
  animation-delay: -2.4s;
}

.loading-ambient span:nth-child(3) {
  right: 13%;
  top: 17%;
  width: 34px;
  height: 34px;
  animation-delay: -4.2s;
}

#initialSplash .loading-content {
  position: relative;
  width: min(294px, calc(100vw - 52px));
  min-height: 338px;
  padding: 27px 27px 25px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  border: 1px solid rgba(255, 255, 255, .88);
  border-radius: 38px;
  background: linear-gradient(150deg, rgba(255, 255, 255, .82), rgba(255, 245, 250, .66));
  box-shadow:
    0 28px 70px rgba(187, 93, 134, .13),
    inset 0 1px 0 rgba(255, 255, 255, .96),
    inset 0 -1px 0 rgba(221, 131, 171, .08);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  backdrop-filter: blur(18px) saturate(1.15);
  text-align: center;
  animation: neyyiCardArrive .72s cubic-bezier(.2, .82, .28, 1) both;
}

#initialSplash .loading-content::before {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(231, 106, 160, .10);
  border-radius: 31px;
  pointer-events: none;
}

.loading-logo-stage {
  position: relative;
  width: 174px;
  height: 174px;
  display: grid;
  place-items: center;
  margin-top: -5px;
}

.loading-logo-glow {
  position: absolute;
  inset: 31px;
  border-radius: 50%;
  background: rgba(247, 178, 210, .52);
  filter: blur(19px);
  animation: neyyiGlow 2.4s ease-in-out infinite;
}

#initialSplash .loading-logo {
  position: relative;
  z-index: 2;
  width: 132px;
  height: 132px;
  object-fit: contain;
  filter: drop-shadow(0 11px 15px rgba(179, 64, 112, .13));
  animation: neyyiLogoFloat 2.4s ease-in-out infinite;
}

.loading-orbit {
  position: absolute;
  inset: 7px;
  z-index: 1;
  border: 1px dashed rgba(216, 77, 137, .26);
  border-radius: 50%;
  animation: neyyiOrbit 8s linear infinite;
}

.loading-orbit i {
  position: absolute;
  display: block;
  width: 7px;
  height: 7px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #e76aa0;
  box-shadow: 0 3px 9px rgba(194, 57, 117, .28);
}

.loading-orbit i:nth-child(1) { top: 11px; left: 35px; }
.loading-orbit i:nth-child(2) { right: 4px; top: 76px; width: 9px; height: 9px; background: #bd183f; }
.loading-orbit i:nth-child(3) { bottom: 12px; left: 38px; width: 5px; height: 5px; background: #f5a8c9; }

.loading-sparkle {
  position: absolute;
  z-index: 3;
  width: 13px;
  height: 13px;
  color: #e76aa0;
  animation: neyyiSparkle 1.9s ease-in-out infinite;
}

.loading-sparkle::before,
.loading-sparkle::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  border-radius: 999px;
  background: currentColor;
}

.loading-sparkle::before { width: 3px; height: 13px; }
.loading-sparkle::after { width: 13px; height: 3px; }
.loading-sparkle--one { top: 32px; right: 38px; }
.loading-sparkle--two { top: 107px; left: 31px; width: 9px; height: 9px; color: #bd183f; animation-delay: -.7s; }
.loading-sparkle--three { top: 153px; right: 25px; width: 7px; height: 7px; color: #f09aba; animation-delay: -1.25s; }
.loading-sparkle--two::before { height: 9px; }
.loading-sparkle--two::after { width: 9px; }
.loading-sparkle--three::before { height: 7px; width: 2px; }
.loading-sparkle--three::after { width: 7px; height: 2px; }

.loading-copy {
  position: relative;
  z-index: 2;
  margin-top: 5px;
}

.loading-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 11px;
  border: 1px solid rgba(217, 71, 135, .16);
  border-radius: 999px;
  background: rgba(255, 255, 255, .68);
  color: #bc315f;
  box-shadow: 0 5px 14px rgba(193, 64, 119, .06);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1;
}

#initialSplash .loading-text {
  margin: 11px 0 0;
  color: #806d75;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: .01em;
}

.loading-progress {
  position: relative;
  width: 126px;
  height: 6px;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid rgba(226, 127, 169, .14);
  border-radius: 999px;
  background: rgba(239, 196, 215, .34);
  box-shadow: inset 0 1px 2px rgba(174, 73, 117, .07);
}

.loading-progress span {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 44%;
  border-radius: inherit;
  background: linear-gradient(90deg, #f29aba, #df5e95 58%, #bd183f);
  box-shadow: 0 0 10px rgba(223, 94, 149, .34);
  animation: neyyiProgress 1.45s cubic-bezier(.65, 0, .35, 1) infinite;
}

#internalLoading {
  background: rgba(255, 250, 252, .62);
  -webkit-backdrop-filter: blur(9px) saturate(1.08);
  backdrop-filter: blur(9px) saturate(1.08);
  animation: neyyiOverlayIn .2s ease both;
}

.internal-loading-card {
  width: min(258px, calc(100vw - 44px));
  min-height: 78px;
  padding: 13px 16px 13px 13px;
  display: grid;
  grid-template-columns: 46px 1fr auto;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, .90);
  border-radius: 25px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(255, 240, 247, .88));
  box-shadow: 0 20px 50px rgba(175, 71, 116, .17), inset 0 1px 0 #fff;
  animation: neyyiMiniCardIn .36s cubic-bezier(.2, .82, .28, 1) both;
}

.internal-loading-mark {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(229, 111, 162, .20);
  border-radius: 17px;
  background: linear-gradient(145deg, #fff, #ffe5f0);
  box-shadow: 0 8px 18px rgba(207, 77, 134, .10);
}

.internal-loading-mark i {
  position: relative;
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 3px 3px 4px 3px;
  background: linear-gradient(145deg, #ef8bb6, #d74f88);
  transform: rotate(-45deg);
  animation: neyyiHeartBeat 1.1s ease-in-out infinite;
}

.internal-loading-mark i::before,
.internal-loading-mark i::after {
  content: "";
  position: absolute;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: inherit;
}

.internal-loading-mark i::before { top: -8px; left: 0; }
.internal-loading-mark i::after { top: 0; right: -8px; }

.internal-loading-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-align: left;
}

.internal-loading-copy strong {
  color: #9f315f;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.internal-loading-copy span {
  overflow: hidden;
  color: #9c8991;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.internal-loading-dots {
  display: flex;
  align-items: center;
  gap: 3px;
}

.internal-loading-dots i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #df679a;
  animation: neyyiDot 1s ease-in-out infinite;
}

.internal-loading-dots i:nth-child(2) { animation-delay: .14s; }
.internal-loading-dots i:nth-child(3) { animation-delay: .28s; }

.neyyi-booting body > :not(#initialSplash):not(#internalLoading):not(#loadingError):not(script),
.neyyi-loading-failed body > :not(#loadingError):not(script) {
  visibility: hidden !important;
}

#loadingError {
  position: fixed;
  inset: 0;
  z-index: 20001;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #fffafb;
  color: #806d75;
  text-align: center;
  padding: 24px;
}

#loadingError p { margin: 0 0 16px; font-size: 13px; }

#loadingError button {
  border: 0;
  border-radius: 14px;
  padding: 12px 21px;
  background: linear-gradient(135deg, #ed82b0, #d94f8b);
  color: #fff;
  box-shadow: 0 10px 22px rgba(201, 63, 123, .20);
  cursor: pointer;
  font-weight: 700;
}

@keyframes neyyiCardArrive {
  from { opacity: 0; transform: translateY(14px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes neyyiMiniCardIn {
  from { opacity: 0; transform: translateY(8px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes neyyiOverlayIn { from { opacity: 0; } to { opacity: 1; } }

@keyframes neyyiLogoFloat {
  0%, 100% { transform: translateY(2px) scale(.985); }
  50% { transform: translateY(-4px) scale(1.015); }
}

@keyframes neyyiGlow {
  0%, 100% { opacity: .54; transform: scale(.91); }
  50% { opacity: .82; transform: scale(1.08); }
}

@keyframes neyyiOrbit { to { transform: rotate(360deg); } }

@keyframes neyyiSparkle {
  0%, 100% { opacity: .35; transform: scale(.72) rotate(0); }
  50% { opacity: 1; transform: scale(1.08) rotate(45deg); }
}

@keyframes neyyiProgress {
  0% { transform: translateX(-115%); }
  55%, 100% { transform: translateX(285%); }
}

@keyframes neyyiBubbleFloat {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -14px, 0); }
}

@keyframes neyyiHeartBeat {
  0%, 100% { transform: rotate(-45deg) scale(.90); }
  45% { transform: rotate(-45deg) scale(1.08); }
}

@keyframes neyyiDot {
  0%, 100% { opacity: .35; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(-3px); }
}

@media (max-width: 380px) {
  #initialSplash .loading-content {
    width: min(278px, calc(100vw - 40px));
    min-height: 322px;
    border-radius: 34px;
  }

  .loading-logo-stage { width: 164px; height: 164px; }
  #initialSplash .loading-logo { width: 124px; height: 124px; }
}

@media (prefers-reduced-motion: reduce) {
  #initialSplash *,
  #internalLoading * {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }

  #initialSplash,
  #internalLoading {
    scroll-behavior: auto !important;
  }
}
