/* Ghost Wire cinematic boot — intro, glow, progress bar */
.gw-boot,
.gw-intro {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  min-height: 180px;
  overflow: hidden;
  background: #05060a;
  color: #e8eef5;
}

.gw-boot--full,
.gw-intro {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  min-height: 100vh !important;
}

.gw-boot-fx,
.gw-intro .gw-boot-fx {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(900px 520px at 50% -8%, rgba(0, 162, 255, 0.2), transparent 58%),
    radial-gradient(640px 380px at 88% 112%, rgba(0, 70, 140, 0.22), transparent 55%),
    #05060a;
}

.gw-boot-fx::before,
.gw-intro .gw-boot-fx::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(0, 162, 255, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 162, 255, 0.05) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(ellipse at center, black 18%, transparent 72%);
  animation: gw-grid 22s linear infinite;
}

.gw-boot-fx::after,
.gw-intro .gw-boot-fx::after {
  content: "";
  position: absolute;
  inset: -25%;
  background: radial-gradient(circle at 50% 42%, rgba(0, 180, 255, 0.16), transparent 42%);
  filter: blur(36px);
  animation: gw-pulse 5.5s ease-in-out infinite;
}

.gw-boot-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(42px);
  opacity: 0.42;
  pointer-events: none;
  animation: gw-float 12s ease-in-out infinite;
}

.gw-boot-orb-a {
  width: 280px;
  height: 280px;
  left: -70px;
  top: 16%;
  background: #0077cc;
}

.gw-boot-orb-b {
  width: 340px;
  height: 340px;
  right: -90px;
  bottom: 6%;
  background: #00a2ff;
  animation-delay: -4.5s;
}

.gw-scan {
  position: absolute;
  left: 0;
  right: 0;
  height: 140px;
  background: linear-gradient(180deg, transparent, rgba(0, 162, 255, 0.08), transparent);
  animation: gw-scan 3.6s ease-in-out infinite;
  pointer-events: none;
}

.gw-boot-stage {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 24px;
  animation: gw-rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.gw-boot-logo {
  width: min(260px, 72vw);
  height: auto;
  display: block;
  filter: drop-shadow(0 0 28px rgba(0, 162, 255, 0.4));
  animation:
    gw-logo-in 1.05s cubic-bezier(0.16, 1, 0.3, 1) both,
    gw-glow 2.6s ease-in-out 1.05s infinite;
}

.gw-boot-kicker {
  margin: 18px 0 0;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-size: 11px;
  color: rgba(180, 200, 220, 0.72);
  animation: gw-rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.12s both;
}

.gw-bar {
  width: min(280px, 72vw);
  height: 4px;
  margin-top: 26px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(0, 162, 255, 0.12) inset;
  animation: gw-rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.gw-bar-fill {
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #006bb3, #00a2ff, #7ad4ff);
  box-shadow: 0 0 16px rgba(0, 162, 255, 0.75);
  animation: gw-bar 2.4s cubic-bezier(0.16, 1, 0.3, 1) 0.25s forwards;
  position: relative;
}

.gw-bar-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  animation: gw-shimmer 1.1s linear infinite;
}

.gw-bar-pct {
  margin: 12px 0 0;
  font-size: 11px;
  letter-spacing: 0.18em;
  color: rgba(160, 188, 214, 0.7);
  font-variant-numeric: tabular-nums;
  animation: gw-rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.28s both;
}

.gw-intro-out {
  animation: gw-out 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  pointer-events: none;
}

@keyframes gw-rise {
  from { opacity: 0; transform: translateY(22px) scale(0.98); }
  to { opacity: 1; transform: none; }
}

@keyframes gw-logo-in {
  0% { opacity: 0; transform: scale(0.82) translateY(18px); filter: drop-shadow(0 0 0 rgba(0, 162, 255, 0)); }
  70% { opacity: 1; transform: scale(1.04); }
  100% { opacity: 1; transform: scale(1); filter: drop-shadow(0 0 28px rgba(0, 162, 255, 0.4)); }
}

@keyframes gw-glow {
  0%, 100% { filter: drop-shadow(0 0 22px rgba(0, 162, 255, 0.32)); }
  50% { filter: drop-shadow(0 0 42px rgba(0, 162, 255, 0.7)); }
}

@keyframes gw-bar {
  0% { width: 0%; }
  70% { width: 78%; }
  100% { width: 100%; }
}

@keyframes gw-shimmer {
  from { transform: translateX(-120%); }
  to { transform: translateX(120%); }
}

@keyframes gw-grid {
  from { transform: translateY(0); }
  to { transform: translateY(52px); }
}

@keyframes gw-pulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 0.95; transform: scale(1.08); }
}

@keyframes gw-float {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(26px, -20px, 0); }
}

@keyframes gw-scan {
  0% { top: -20%; opacity: 0; }
  20% { opacity: 1; }
  80% { opacity: 0.4; }
  100% { top: 90%; opacity: 0; }
}

@keyframes gw-out {
  to { opacity: 0; transform: scale(1.03); filter: blur(8px); }
}

svg[viewBox="0 0 135 140"] {
  display: none !important;
}
