/* Extra welcome effects. Kept separate so the visible base stays reliable. */
.v2-shell .welcome-overlay {
  perspective: 1200px !important;
}

.v2-shell .welcome-overlay::after {
  animation: welcomeSpeedLines 4.8s linear infinite !important;
  background:
    linear-gradient(100deg, transparent 0 18%, rgba(255, 255, 255, 0.06) 18% 19%, transparent 19% 36%, rgba(226, 34, 58, 0.12) 36% 37%, transparent 37% 100%),
    repeating-linear-gradient(100deg, transparent 0 80px, rgba(255, 255, 255, 0.035) 80px 82px, transparent 82px 150px) !important;
  content: "" !important;
  inset: -18% !important;
  opacity: 0.45 !important;
  pointer-events: none !important;
  position: absolute !important;
  transform: translateX(-4%) skewX(-10deg) !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-card {
  animation:
    welcomeUniqueIn 0.48s cubic-bezier(0.2, 0.85, 0.2, 1) both,
    welcomeCardBreath 5s ease-in-out 0.5s infinite !important;
}

.v2-shell .welcome-overlay-card::before {
  animation: welcomeBorderTrace 5s linear infinite !important;
  background:
    conic-gradient(from 0deg, transparent 0 20%, rgba(255, 255, 255, 0.75) 25%, #e2223a 32%, transparent 42% 100%) !important;
  content: "" !important;
  inset: -2px !important;
  opacity: 0.72 !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: 0 !important;
}

.v2-shell .welcome-overlay-card::after {
  animation: welcomeInnerGlow 2.6s ease-in-out infinite alternate !important;
  background:
    radial-gradient(ellipse at center, rgba(226, 34, 58, 0.2), transparent 58%) !important;
  content: "" !important;
  inset: 12% 8% 18% !important;
  opacity: 0.55 !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: 0 !important;
}

.v2-shell .welcome-overlay-card > * {
  position: relative !important;
  z-index: 1 !important;
}

.v2-shell .welcome-overlay-stage::before,
.v2-shell .welcome-overlay-stage::after {
  animation: welcomeNeedleSweep 2.4s ease-in-out infinite alternate !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.82), transparent) !important;
  content: "" !important;
  height: 2px !important;
  position: absolute !important;
  transform-origin: center !important;
  width: 136px !important;
  z-index: 0 !important;
}

.v2-shell .welcome-overlay-stage::after {
  animation-delay: -1.1s !important;
  opacity: 0.45 !important;
  transform: rotate(135deg) !important;
}

.v2-shell .welcome-overlay-avatar {
  animation: welcomeAvatarPulse 1.9s ease-in-out infinite !important;
}

.v2-shell .welcome-overlay-ring {
  filter: drop-shadow(0 0 16px rgba(226, 34, 58, 0.45)) !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-brand,
.v2-shell .welcome-overlay.is-visible .welcome-overlay-status,
.v2-shell .welcome-overlay.is-visible .welcome-overlay-card p,
.v2-shell .welcome-overlay.is-visible .welcome-overlay-card h2,
.v2-shell .welcome-overlay.is-visible .welcome-overlay-subtitle,
.v2-shell .welcome-overlay.is-visible .welcome-overlay-meta span {
  animation: welcomeTextRise 0.55s cubic-bezier(0.2, 0.85, 0.2, 1) both !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-status {
  animation-delay: 0.06s !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-card p {
  animation-delay: 0.12s !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-card h2 {
  animation-delay: 0.18s !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-subtitle {
  animation-delay: 0.24s !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-meta span:nth-child(1) {
  animation-delay: 0.3s !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-meta span:nth-child(2) {
  animation-delay: 0.36s !important;
}

.v2-shell .welcome-overlay.is-visible .welcome-overlay-meta span:nth-child(3) {
  animation-delay: 0.42s !important;
}

.v2-shell .welcome-overlay-progress {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 0 28px rgba(226, 34, 58, 0.22) !important;
}

@keyframes welcomeSpeedLines {
  from {
    background-position: 0 0, 0 0;
  }

  to {
    background-position: 520px 0, 420px 0;
  }
}

@keyframes welcomeCardBreath {
  0%,
  100% {
    box-shadow:
      0 46px 120px rgba(0, 0, 0, 0.66),
      0 0 0 rgba(226, 34, 58, 0),
      inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  }

  50% {
    box-shadow:
      0 50px 130px rgba(0, 0, 0, 0.72),
      0 0 42px rgba(226, 34, 58, 0.24),
      inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  }
}

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

@keyframes welcomeInnerGlow {
  from {
    opacity: 0.34;
    transform: scale(0.94);
  }

  to {
    opacity: 0.7;
    transform: scale(1.04);
  }
}

@keyframes welcomeNeedleSweep {
  from {
    opacity: 0.18;
    transform: rotate(18deg) scaleX(0.55);
  }

  to {
    opacity: 0.62;
    transform: rotate(160deg) scaleX(1);
  }
}

@keyframes welcomeAvatarPulse {
  0%,
  100% {
    box-shadow:
      0 24px 54px rgba(0, 0, 0, 0.46),
      0 0 0 0 rgba(226, 34, 58, 0.28) !important;
  }

  50% {
    box-shadow:
      0 26px 58px rgba(0, 0, 0, 0.52),
      0 0 0 10px rgba(226, 34, 58, 0.08) !important;
  }
}

@keyframes welcomeTextRise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .v2-shell .welcome-overlay *,
  .v2-shell .welcome-overlay::before,
  .v2-shell .welcome-overlay::after {
    animation: none !important;
  }
}