/* G-Pulse Welcome Screen Overlay */

.gp-welcome {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: radial-gradient(ellipse 80% 70% at 50% 40%, #0a1e4a 0%, #030b1f 55%, #010612 100%);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.gp-welcome--exit {
  opacity: 0;
  transform: translateY(-24px);
  pointer-events: none;
}

.gp-welcome--hidden {
  display: none;
}

/* Background atmosphere */
.gp-welcome__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.gp-welcome__bg-glow {
  position: absolute;
  top: 15%;
  left: 50%;
  transform: translateX(-50%);
  width: 60vw;
  max-width: 700px;
  height: 50vh;
  background: radial-gradient(ellipse, rgba(11, 99, 246, 0.18) 0%, transparent 70%);
}

.gp-welcome__particles {
  position: absolute;
  inset: 0;
}

.gp-welcome__particle {
  position: absolute;
  border-radius: 50%;
  opacity: 0;
  animation: gp-particle-float 6s ease-in-out infinite;
}

@keyframes gp-particle-float {
  0%, 100% { opacity: 0; transform: translateY(0) scale(0.5); }
  20% { opacity: 0.7; }
  50% { opacity: 0.4; transform: translateY(-30px) scale(1); }
  80% { opacity: 0.2; }
}

.gp-welcome__floor {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 120%;
  height: 35%;
  background:
    radial-gradient(ellipse 50% 40% at 50% 100%, rgba(11, 99, 246, 0.15) 0%, transparent 70%),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 39px,
      rgba(11, 99, 246, 0.06) 39px,
      rgba(11, 99, 246, 0.06) 40px
    ),
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 39px,
      rgba(11, 99, 246, 0.06) 39px,
      rgba(11, 99, 246, 0.06) 40px
    );
  mask-image: linear-gradient(to top, black 30%, transparent 100%);
  -webkit-mask-image: linear-gradient(to top, black 30%, transparent 100%);
}

/* Main content */
.gp-welcome__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 720px;
  padding: 2rem 1.5rem 3rem;
  text-align: center;
}

/* Logo and branding */
.gp-welcome__brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 1.5rem;
}

.gp-welcome__brand img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  filter: drop-shadow(0 0 20px rgba(11, 99, 246, 0.5));
  margin-bottom: 0.75rem;
}

.gp-welcome__brand h1 {
  margin: 0;
  font-size: 2.25rem;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: -0.02em;
  text-shadow: 0 0 30px rgba(116, 179, 255, 0.3);
}

.gp-welcome__tagline {
  margin: 0.35rem 0 0;
  font-size: 1.125rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.85);
}

.gp-welcome__desc {
  margin: 0.75rem 0 0;
  font-size: 0.9rem;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.55);
  max-width: 420px;
}

/* Floating tech icons */
.gp-welcome__icons {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.gp-welcome__icon {
  position: absolute;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(11, 99, 246, 0.12);
  border: 1px solid rgba(116, 179, 255, 0.25);
  border-radius: 12px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 0 20px rgba(11, 99, 246, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  animation: gp-icon-float 4s ease-in-out infinite;
}

.gp-welcome__icon svg {
  width: 26px;
  height: 26px;
  color: rgba(116, 179, 255, 0.9);
  filter: drop-shadow(0 0 6px rgba(116, 179, 255, 0.5));
}

.gp-welcome__icon--tl {
  top: 18%;
  left: 8%;
  animation-delay: 0s;
}

.gp-welcome__icon--tr {
  top: 14%;
  right: 8%;
  animation-delay: 1s;
}

.gp-welcome__icon--bl {
  bottom: 32%;
  left: 10%;
  animation-delay: 2s;
}

.gp-welcome__icon--br {
  bottom: 28%;
  right: 10%;
  animation-delay: 0.5s;
}

.gp-welcome__icon-line {
  position: absolute;
  background: linear-gradient(90deg, transparent, rgba(116, 179, 255, 0.3), transparent);
  height: 1px;
  transform-origin: left center;
  opacity: 0.5;
}

@keyframes gp-icon-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

.gp-welcome__content--actions {
  padding-top: 0;
}

/* Ribbon and scissors scene - full viewport width, single natural ribbon */
.gp-welcome__ribbon-scene {
  position: relative;
  width: 100vw;
  height: clamp(96px, 14vw, 132px);
  margin: 0.25rem 0 3.25rem;
  transform: translateY(-1.35rem);
  flex-shrink: 0;
}

.gp-welcome__ribbon-svg {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.gp-welcome__ribbon-bow {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 18;
  width: clamp(104px, 5.5vw, 160px);
  height: auto;
  transform: translate(-50%, -36%);
  filter:
    drop-shadow(0 8px 18px rgba(0, 0, 0, 0.38))
    drop-shadow(0 0 18px rgba(255, 80, 80, 0.18));
  pointer-events: none;
  transition: opacity 0.95s ease, transform 0.95s cubic-bezier(0.34, 1.05, 0.64, 1), filter 0.95s ease;
}

.gp-welcome__ribbon-uncut {
  opacity: 1;
  transition: opacity 0.95s ease;
}

.gp-welcome__ribbon-sheen {
  animation: gp-ribbon-sheen-breathe 4.8s ease-in-out infinite;
}

.gp-welcome__ribbon-cut-pieces {
  opacity: 0;
  transition: opacity 0.12s ease;
}

.gp-welcome__ribbon-half {
  transition:
    transform 1.15s cubic-bezier(0.34, 1.05, 0.64, 1),
    opacity 0.85s ease 0.1s;
}

.gp-welcome__ribbon-half--left {
  transform-origin: 100% 56%;
}

.gp-welcome__ribbon-half--right {
  transform-origin: 0% 56%;
}

.gp-welcome--ribbon-cut .gp-welcome__ribbon-uncut {
  opacity: 0;
}

.gp-welcome--ribbon-cut .gp-welcome__ribbon-cut-pieces {
  opacity: 1;
}

.gp-welcome--ribbon-cut .gp-welcome__ribbon-bow {
  opacity: 0;
  transform: translate(-50%, -36%) translateY(14px) scale(0.82) rotate(-5deg);
  filter:
    drop-shadow(0 4px 10px rgba(0, 0, 0, 0.2))
    drop-shadow(0 0 8px rgba(255, 80, 80, 0.08));
}

@keyframes gp-ribbon-sheen-breathe {
  0%, 100% {
    opacity: 0.46;
  }
  50% {
    opacity: 0.68;
  }
}

/* Ribbon cut */
.gp-welcome--ribbon-cut .gp-welcome__ribbon-half--left {
  transform: translateX(-8vw) translateY(14px) rotate(-8deg);
  opacity: 0;
}

.gp-welcome--ribbon-cut .gp-welcome__ribbon-half--right {
  transform: translateX(8vw) translateY(14px) rotate(8deg);
  opacity: 0;
  transition-delay: 0.08s;
}

/* Scissors in front of ribbon - natural ceremonial style */
.gp-welcome__scissors {
  position: absolute;
  top: 56%;
  left: 62%;
  z-index: 20;
  width: clamp(116px, 13vw, 154px);
  height: clamp(88px, 10vw, 118px);
  opacity: 0;
  transform: translate(-92vw, 48vh) rotate(-34deg) scale(0.82);
  transition:
    opacity 0.25s ease,
    transform 1.3s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.gp-welcome--cutting .gp-welcome__scissors {
  opacity: 1;
  transform: translate(-50%, -50%) rotate(-7deg) scale(1);
}

.gp-welcome__scissors svg {
  width: 100%;
  height: 100%;
  overflow: visible;
  filter: drop-shadow(0 4px 14px rgba(0, 0, 0, 0.4)) drop-shadow(0 2px 8px rgba(212, 168, 67, 0.55));
}

.gp-welcome__scissor-arm {
  transform-box: view-box;
  transform-origin: 42px 48px;
  transition: transform 0.65s cubic-bezier(0.34, 1.1, 0.64, 1);
}

/* Resting: slightly open */
.gp-welcome__scissor-arm--top {
  transform: rotate(-8deg);
}

.gp-welcome__scissor-arm--bottom {
  transform: rotate(8deg);
}

/* Phase 1: open wide slowly */
.gp-welcome--cutting .gp-welcome__scissor-arm--top {
  transform: rotate(-22deg);
  transition-duration: 0.7s;
}

.gp-welcome--cutting .gp-welcome__scissor-arm--bottom {
  transform: rotate(22deg);
  transition-duration: 0.7s;
}

/* Phase 2: slow close on ribbon */
.gp-welcome--scissors-close .gp-welcome__scissor-arm--top {
  transform: rotate(1deg);
  transition-duration: 1.15s;
  transition-timing-function: cubic-bezier(0.42, 0, 0.22, 1);
}

.gp-welcome--scissors-close .gp-welcome__scissor-arm--bottom {
  transform: rotate(-1deg);
  transition-duration: 1.15s;
  transition-timing-function: cubic-bezier(0.42, 0, 0.22, 1);
}

.gp-welcome--scissors-close .gp-welcome__scissors {
  opacity: 1;
  transform: translate(-50%, -50%) rotate(-7deg) scale(1);
}

/* Cut effects container */
.gp-welcome__cut-fx {
  position: absolute;
  top: 56%;
  left: 62%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  z-index: 25;
  pointer-events: none;
}

.gp-welcome__glow-burst {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
}

.gp-welcome__glow-burst--inner {
  width: 60px;
  height: 60px;
  background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(255, 220, 100, 0.8) 25%, rgba(116, 179, 255, 0.5) 50%, transparent 70%);
  box-shadow: 0 0 30px rgba(255, 255, 255, 0.9), 0 0 60px rgba(116, 179, 255, 0.6);
}

.gp-welcome__glow-burst--outer {
  width: 140px;
  height: 140px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.5) 0%, rgba(11, 99, 246, 0.3) 40%, transparent 70%);
  box-shadow: 0 0 80px rgba(11, 99, 246, 0.4);
}

.gp-welcome--ribbon-cut .gp-welcome__glow-burst--inner {
  animation: gp-glow-inner 0.85s ease forwards;
}

.gp-welcome--ribbon-cut .gp-welcome__glow-burst--outer {
  animation: gp-glow-outer 1s ease 0.05s forwards;
}

@keyframes gp-glow-inner {
  0% { transform: translate(-50%, -50%) scale(0); opacity: 1; }
  35% { transform: translate(-50%, -50%) scale(1.8); opacity: 1; }
  100% { transform: translate(-50%, -50%) scale(3); opacity: 0; }
}

@keyframes gp-glow-outer {
  0% { transform: translate(-50%, -50%) scale(0); opacity: 0.8; }
  40% { transform: translate(-50%, -50%) scale(1.4); opacity: 0.6; }
  100% { transform: translate(-50%, -50%) scale(2.5); opacity: 0; }
}

/* Cut sparkle burst */
.gp-welcome__cut-spark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(255, 240, 150, 0.7) 20%, rgba(116, 179, 255, 0.4) 45%, transparent 70%);
  opacity: 0;
  pointer-events: none;
}

.gp-welcome--ribbon-cut .gp-welcome__cut-spark {
  animation: gp-spark-burst 0.9s ease forwards;
}

@keyframes gp-spark-burst {
  0% { transform: translate(-50%, -50%) scale(0); opacity: 1; }
  25% { transform: translate(-50%, -50%) scale(1.2); opacity: 1; }
  60% { transform: translate(-50%, -50%) scale(2); opacity: 0.7; }
  100% { transform: translate(-50%, -50%) scale(3.2); opacity: 0; }
}

/* Radiating sparkles */
.gp-welcome__sparkles {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
}

.gp-welcome__spark {
  position: absolute;
  top: 0;
  left: 0;
  width: var(--gp-spark-size, 6px);
  height: var(--gp-spark-size, 6px);
  margin: calc(var(--gp-spark-size, 6px) / -2) 0 0 calc(var(--gp-spark-size, 6px) / -2);
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 6px #fff, 0 0 12px rgba(255, 220, 100, 0.8), 0 0 20px rgba(116, 179, 255, 0.5);
  opacity: 0;
  animation: gp-spark-fly 0.9s ease-out forwards;
}

.gp-welcome__spark--star {
  width: 0;
  height: 0;
  margin: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.gp-welcome__spark--star::before,
.gp-welcome__spark--star::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: #ffffff;
  box-shadow: 0 0 8px #fff, 0 0 16px rgba(255, 220, 100, 0.9);
  border-radius: 1px;
}

.gp-welcome__spark--star::before {
  width: var(--gp-spark-size, 10px);
  height: 2px;
  margin: -1px 0 0 calc(var(--gp-spark-size, 10px) / -2);
}

.gp-welcome__spark--star::after {
  width: 2px;
  height: var(--gp-spark-size, 10px);
  margin: calc(var(--gp-spark-size, 10px) / -2) 0 0 -1px;
}

@keyframes gp-spark-fly {
  0% {
    opacity: 1;
    transform: translate(0, 0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(var(--gp-sx), var(--gp-sy)) scale(0.2);
  }
}

/* Continuous bottom sparkles and crackers */
.gp-bottom-fx {
  position: fixed;
  inset: auto 0 0 0;
  height: 44vh;
  pointer-events: none;
  z-index: 10001;
  overflow: hidden;
}

.gp-bottom__spark {
  position: absolute;
  bottom: 0;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 6px #fff, 0 0 14px rgba(255, 220, 100, 0.85);
  opacity: 0;
  animation: gp-bottom-rise var(--gp-rise-duration, 2.4s) ease-out forwards;
}

.gp-bottom__spark--gold {
  background: #f0c040;
  box-shadow: 0 0 8px #f0c040, 0 0 16px rgba(255, 200, 60, 0.75);
}

.gp-bottom__spark--blue {
  background: #74b3ff;
  box-shadow: 0 0 8px #74b3ff, 0 0 16px rgba(11, 99, 246, 0.65);
}

.gp-bottom__cracker {
  position: absolute;
  bottom: 0;
  border-radius: 1px;
  opacity: 0;
  animation: gp-bottom-burst var(--gp-rise-duration, 2s) ease-out forwards;
}

.gp-corner__spark,
.gp-corner__cracker {
  position: absolute;
  bottom: 0;
  opacity: 0;
  animation: gp-corner-blast var(--gp-corner-duration, 2.8s) cubic-bezier(0.18, 0.8, 0.22, 1) forwards;
}

.gp-corner__shockwave {
  position: absolute;
  bottom: -44px;
  width: 96px;
  height: 96px;
  border: 2px solid rgba(255, 220, 100, 0.75);
  border-radius: 50%;
  opacity: 0;
  box-shadow:
    0 0 22px rgba(255, 220, 100, 0.75),
    0 0 42px rgba(116, 179, 255, 0.45),
    inset 0 0 18px rgba(255, 255, 255, 0.28);
  animation: gp-corner-shockwave 1.15s ease-out forwards;
}

.gp-corner__spark {
  border-radius: 50%;
  background: #ffffff;
  box-shadow:
    0 0 8px #fff,
    0 0 18px rgba(255, 220, 100, 0.9),
    0 0 28px rgba(116, 179, 255, 0.45);
}

.gp-corner__cracker {
  border-radius: 2px;
}

.gp-corner__spark--left,
.gp-corner__cracker--left,
.gp-corner__shockwave--left {
  left: 0;
}

.gp-corner__spark--right,
.gp-corner__cracker--right,
.gp-corner__shockwave--right {
  right: 0;
}

@keyframes gp-bottom-rise {
  0% {
    opacity: 0;
    transform: translateY(0) translateX(0) scale(0.45);
  }
  15% {
    opacity: 1;
    transform: translateY(-24px) translateX(calc(var(--gp-dx, 0) * 0.25)) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(var(--gp-rise, -240px)) translateX(var(--gp-dx, 0)) scale(0.2);
  }
}

@keyframes gp-bottom-burst {
  0% {
    opacity: 1;
    transform: translateY(0) translateX(0) rotate(0deg) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(var(--gp-rise, -190px)) translateX(var(--gp-dx, 0)) rotate(var(--gp-rot, 180deg)) scale(0.3);
  }
}

@keyframes gp-corner-blast {
  0% {
    opacity: 1;
    transform: translate(0, 0) rotate(0deg) scale(0.7);
  }
  18% {
    opacity: 1;
    transform: translate(calc(var(--gp-cx, 120px) * 0.22), calc(var(--gp-cy, -160px) * 0.22)) rotate(calc(var(--gp-rot, 180deg) * 0.25)) scale(1.1);
  }
  72% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
    transform: translate(var(--gp-cx, 120px), var(--gp-cy, -160px)) rotate(var(--gp-rot, 360deg)) scale(0.25);
  }
}

@keyframes gp-corner-shockwave {
  0% {
    opacity: 0.9;
    transform: scale(0.2);
  }
  65% {
    opacity: 0.45;
  }
  100% {
    opacity: 0;
    transform: scale(2.9);
  }
}

/* Top-down celebration on login page */
.gp-celebrate-fx {
  position: fixed;
  inset: 0;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  pointer-events: none;
  z-index: 10000;
  overflow: hidden;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.gp-celebrate-fx--active {
  opacity: 1;
}

.gp-celebrate-fx--fade {
  opacity: 0;
}

.gp-celebrate__spark {
  position: absolute;
  top: -24px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 6px #fff, 0 0 14px rgba(255, 220, 100, 0.85);
  opacity: 0;
  animation: gp-celebrate-fall var(--gp-fall-duration, 5.6s) linear forwards;
}

.gp-celebrate__spark--gold {
  background: #f0c040;
  box-shadow: 0 0 8px #f0c040, 0 0 16px rgba(255, 200, 60, 0.7);
}

.gp-celebrate__spark--blue {
  background: #74b3ff;
  box-shadow: 0 0 8px #74b3ff, 0 0 14px rgba(11, 99, 246, 0.6);
}

.gp-celebrate__cracker {
  position: absolute;
  top: -32px;
  border-radius: 1px;
  opacity: 0;
  animation: gp-ribbon-fall var(--gp-fall-duration, 5.8s) ease-in forwards;
}

.gp-celebrate__balloon {
  position: absolute;
  top: -110px;
  width: calc(var(--gp-balloon-size, 28px) * 1.25);
  height: calc(var(--gp-balloon-size, 28px) * 2.25);
  transform-origin: 50% 18%;
  opacity: 0;
  animation: gp-balloon-fall var(--gp-fall-duration, 6s) ease-in forwards;
}

.gp-celebrate__balloon-body {
  position: absolute;
  top: 0;
  left: 50%;
  width: calc(var(--gp-balloon-size, 28px) * 1.08);
  height: calc(var(--gp-balloon-size, 28px) * 1.38);
  transform: translateX(-50%);
  border-radius: 48% 52% 50% 50% / 42% 42% 58% 58%;
  background:
    radial-gradient(ellipse at 32% 24%, rgba(255, 255, 255, 0.82) 0 9%, rgba(255, 255, 255, 0.24) 10% 18%, transparent 20%),
    radial-gradient(ellipse at 70% 78%, rgba(0, 0, 0, 0.22) 0 18%, transparent 42%),
    linear-gradient(145deg, var(--gp-balloon-color-top, #ff7474) 0%, var(--gp-balloon-color-bottom, #d92d2d) 78%);
  box-shadow:
    inset -8px -14px 18px rgba(0, 0, 0, 0.18),
    inset 7px 8px 16px rgba(255, 255, 255, 0.2),
    0 12px 22px rgba(0, 0, 0, 0.18);
}

.gp-celebrate__balloon-knot {
  position: absolute;
  top: calc(var(--gp-balloon-size, 28px) * 1.28);
  left: 50%;
  width: calc(var(--gp-balloon-size, 28px) * 0.22);
  height: calc(var(--gp-balloon-size, 28px) * 0.16);
  transform: translateX(-50%) rotate(45deg);
  border-radius: 45% 55% 50% 50%;
  background: var(--gp-balloon-color-bottom, #d92d2d);
  box-shadow: inset -2px -2px 4px rgba(0, 0, 0, 0.22);
}

.gp-celebrate__balloon-string {
  position: absolute;
  top: calc(var(--gp-balloon-size, 28px) * 1.42);
  left: 50%;
  width: calc(var(--gp-balloon-size, 28px) * 0.52);
  height: calc(var(--gp-balloon-size, 28px) * 0.78);
  transform: translateX(-50%);
  overflow: visible;
}

@keyframes gp-celebrate-fall {
  0% {
    opacity: 0;
    transform: translateY(-20px) translateX(0) scale(0.7);
  }
  12% {
    opacity: 1;
    transform: translateY(8vh) translateX(calc(var(--gp-dx, 0) * 0.25)) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(110vh) translateX(var(--gp-dx, 0)) scale(0.35);
  }
}

@keyframes gp-ribbon-fall {
  0% {
    opacity: 1;
    transform: translateY(-20px) translateX(0) rotate(0deg) scale(1);
  }
  45% {
    opacity: 1;
    transform: translateY(45vh) translateX(calc(var(--gp-dx, 0) * 0.45)) rotate(calc(var(--gp-rot, 180deg) * 0.5)) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(112vh) translateX(var(--gp-dx, 0)) rotate(var(--gp-rot, 360deg)) scale(0.45);
  }
}

@keyframes gp-balloon-fall {
  0% {
    opacity: 0;
    transform: translateY(-110px) translateX(0) rotate(var(--gp-start-rotate, -4deg));
  }
  10% {
    opacity: 1;
  }
  45% {
    opacity: 1;
    transform: translateY(42vh) translateX(calc(var(--gp-dx, 0) * 0.42 + var(--gp-sway, 16px))) rotate(calc(var(--gp-start-rotate, -4deg) * -0.6));
  }
  100% {
    opacity: 0;
    transform: translateY(112vh) translateX(var(--gp-dx, 0)) rotate(var(--gp-end-rotate, 8deg));
  }
}

/* CTA button */
.gp-welcome__cta {
  position: relative;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 240px;
  height: 52px;
  padding: 0 2rem;
  border: 1px solid rgba(116, 179, 255, 0.3);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(11, 99, 246, 0.35) 0%, rgba(6, 72, 200, 0.5) 100%);
  color: #ffffff;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow:
    0 0 24px rgba(11, 99, 246, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  transition: background 0.2s, box-shadow 0.2s, transform 0.2s, opacity 0.2s;
}

.gp-welcome__cta:hover:not(:disabled) {
  background: linear-gradient(180deg, rgba(11, 99, 246, 0.5) 0%, rgba(6, 72, 200, 0.65) 100%);
  box-shadow: 0 0 32px rgba(11, 99, 246, 0.45);
  transform: translateY(-1px);
}

.gp-welcome__cta:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.gp-welcome--cutting .gp-welcome__cta,
.gp-welcome--ribbon-cut .gp-welcome__cta {
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.gp-welcome__footer {
  margin: 1.25rem 0 0;
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.02em;
}

.gp-welcome--cutting .gp-welcome__footer,
.gp-welcome--ribbon-cut .gp-welcome__footer {
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Confetti container */
.gp-welcome__confetti {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 10;
}

.gp-welcome__confetti-piece {
  position: absolute;
  opacity: 0;
  animation: gp-confetti-fly 1.6s ease-out forwards;
}

@keyframes gp-confetti-fly {
  0% {
    opacity: 1;
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
  70% {
    opacity: 0.8;
  }
  100% {
    opacity: 0;
    transform: translate(var(--gp-cx), var(--gp-cy)) rotate(var(--gp-rot)) scale(0.2);
  }
}

/* Prevent body scroll while welcome is active */
body.gp-welcome-active {
  overflow: hidden;
}

/* Responsive */
@media (max-width: 767.98px) {
  .gp-welcome__brand h1 {
    font-size: 1.75rem;
  }

  .gp-welcome__tagline {
    font-size: 1rem;
  }

  .gp-welcome__desc {
    font-size: 0.85rem;
    padding: 0 0.5rem;
  }

  .gp-welcome__icon {
    width: 44px;
    height: 44px;
  }

  .gp-welcome__icon svg {
    width: 20px;
    height: 20px;
  }

  .gp-welcome__icon--tl { top: 12%; left: 4%; }
  .gp-welcome__icon--tr { top: 10%; right: 4%; }
  .gp-welcome__icon--bl { bottom: 38%; left: 5%; }
  .gp-welcome__icon--br { bottom: 34%; right: 5%; }

  .gp-welcome__ribbon-scene {
    height: clamp(80px, 16vw, 110px);
    margin: 0.75rem 0 2rem;
    transform: translateY(-1rem);
  }

  .gp-welcome__scissors {
    left: 64%;
    width: 98px;
    height: 74px;
  }

  .gp-welcome__cut-fx {
    left: 64%;
  }

  .gp-welcome__ribbon-bow {
    width: clamp(86px, 19vw, 124px);
  }

  .gp-welcome__cta {
    min-width: 200px;
    height: 48px;
    font-size: 0.9375rem;
  }
}

@media (max-width: 479.98px) {
  .gp-welcome__content {
    padding: 1.5rem 1rem 2.5rem;
  }

  .gp-welcome__brand img {
    width: 56px;
    height: 56px;
  }

  .gp-welcome__brand h1 {
    font-size: 1.5rem;
  }

  .gp-welcome__icon--tl,
  .gp-welcome__icon--tr {
    display: none;
  }

  .gp-welcome__ribbon-scene {
    height: 72px;
    margin: 0.5rem 0 1.75rem;
    transform: translateY(-0.8rem);
  }

  .gp-welcome__scissors {
    left: 66%;
    width: 84px;
    height: 64px;
  }

  .gp-welcome__cut-fx {
    left: 66%;
  }

  .gp-welcome__ribbon-bow {
    width: 76px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gp-welcome__icon,
  .gp-welcome__particle,
  .gp-welcome__scissors,
  .gp-welcome__scissor-arm,
  .gp-welcome__ribbon-half,
  .gp-welcome__cut-spark,
  .gp-welcome__glow-burst,
  .gp-welcome__spark,
  .gp-welcome__confetti-piece {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }

  .gp-welcome--exit {
    transition-duration: 0.2s;
  }
}