html.preload, html.preload body { background: #000; }

.splash {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0;
  z-index: 2147483000;
  display: flex; align-items: center; justify-content: center;
  background: #000;
  overflow: hidden;
  transition: opacity .55s cubic-bezier(.4, 0, .2, 1), visibility 0s linear .55s;
}
.splash.out { opacity: 0; visibility: hidden; pointer-events: none; }

.splash-aurora { position: absolute; top: 0; right: 0; bottom: 0; left: 0; filter: blur(70px); animation: nfx-aurora-in 1.4s ease both .05s; }
.splash-aurora i {
  position: absolute; display: block; border-radius: 50%;
  width: 46vmax; height: 46vmax; left: 50%; top: 50%;
  margin-left: -23vmax; margin-top: -23vmax;
  will-change: transform;
}
.splash-aurora i:nth-child(1) { background: radial-gradient(circle, rgba(34, 211, 238, .30) 0%, rgba(34, 211, 238, 0) 62%); animation: nfx-drift-a 9s ease-in-out infinite alternate; }
.splash-aurora i:nth-child(2) { background: radial-gradient(circle, rgba(79, 70, 229, .36) 0%, rgba(79, 70, 229, 0) 60%); animation: nfx-drift-b 11s ease-in-out infinite alternate; }
.splash-aurora i:nth-child(3) { background: radial-gradient(circle, rgba(192, 38, 211, .26) 0%, rgba(192, 38, 211, 0) 60%); animation: nfx-drift-c 13s ease-in-out infinite alternate; }
.splash.out .splash-aurora { animation: none; transition: transform .7s ease, opacity .5s ease; transform: scale(1.25); opacity: 0; }

@keyframes nfx-aurora-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes nfx-drift-a { from { transform: translate(-18%, -10%) scale(1); } to { transform: translate(-4%, 6%) scale(1.15); } }
@keyframes nfx-drift-b { from { transform: translate(14%, 8%) scale(1.1); } to { transform: translate(2%, -8%) scale(.9); } }
@keyframes nfx-drift-c { from { transform: translate(6%, -16%) scale(.9); } to { transform: translate(18%, 4%) scale(1.12); } }

.splash-center { position: relative; display: flex; flex-direction: column; align-items: center; }

.splash-logo {
  position: relative; width: 132px; height: 132px;
  animation: nfx-logo-in .9s cubic-bezier(.16, 1, .3, 1) both .1s,
             nfx-logo-breath 3.2s ease-in-out infinite 1.1s;
  will-change: transform, opacity, filter;
}
.splash-logo img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 30px rgba(79, 70, 229, .45)); }
.splash-shine {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  background: linear-gradient(105deg, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, .85) 50%, rgba(255, 255, 255, 0) 62%);
  background-size: 300% 100%; background-repeat: no-repeat;
  background-position: 150% 0;
  mix-blend-mode: overlay;
  animation: nfx-shine 2.6s cubic-bezier(.45, 0, .25, 1) infinite 1s;
}
@keyframes nfx-logo-in { from { opacity: 0; transform: scale(.82); filter: blur(10px); } to { opacity: 1; transform: scale(1); filter: blur(0); } }
@keyframes nfx-logo-breath { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.035); } }
@keyframes nfx-shine { 0% { background-position: 150% 0; } 55%, 100% { background-position: -50% 0; } }

.splash.out .splash-logo { animation: none; opacity: 0; transform: scale(1.35); filter: blur(6px); transition: transform .6s cubic-bezier(.4, 0, .2, 1), opacity .45s ease, filter .45s ease; }

.splash-track {
  position: relative; margin-top: 38px; width: 168px; height: 3px; border-radius: 3px;
  background: rgba(255, 255, 255, .08); overflow: hidden;
  animation: nfx-fade-in .5s ease both .45s;
}
.splash-bar {
  position: absolute; top: 0; bottom: 0; left: 0; width: 100%;
  border-radius: 3px;
  background: linear-gradient(90deg, #22d3ee 0%, #4f8cff 45%, #8b5cf6 80%, #d946ef 100%);
  box-shadow: 0 0 14px rgba(99, 102, 241, .75);
  transform-origin: left center; transform: scaleX(0);
  transition: transform .45s cubic-bezier(.4, 0, .2, 1);
}
.splash.out .splash-track { opacity: 0; transition: opacity .25s ease; }
@keyframes nfx-fade-in { from { opacity: 0; } to { opacity: 1; } }

.splash-msg { margin-top: 22px; min-height: 20px; font: 500 14px/1.4 Inter, system-ui, sans-serif; color: rgba(235, 238, 255, .7); text-align: center; opacity: 0; transition: opacity .3s; }
.splash-msg.show { opacity: 1; }
.splash-retry { margin-top: 14px; padding: 10px 22px; border-radius: 12px; border: 0; background: #fff; color: #0b0b12; font: 700 14px Inter, system-ui, sans-serif; cursor: pointer; }

@media (max-width: 600px) {
  .splash-logo { width: 108px; height: 108px; }
  .splash-track { width: 140px; }
}
@media (prefers-reduced-motion: reduce) {
  .splash-aurora i, .splash-shine, .splash-logo { animation-duration: .01s !important; animation-iteration-count: 1 !important; }
}