/* GSAP-анимации и маскоты «Моя Кафета» */

.candy-anim-layer {
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  overflow: hidden;
}

.candy-anim-layer--interactive {
  pointer-events: auto;
}

.candy-mascot-runner {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 480;
  width: 56px;
  height: 68px;
  pointer-events: none;
  will-change: transform, opacity;
}

.candy-mascot-runner svg {
  width: 100%;
  height: 100%;
  display: block;
  filter: drop-shadow(0 4px 10px rgba(157, 23, 77, 0.18));
}

.candy-cart-baby,
#baby.candy-mascot-runner {
  width: 88px;
  height: 106px;
}

.candy-auth-mascot {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 200;
  width: 64px;
  height: 78px;
  pointer-events: none;
  transition: opacity 0.25s ease;
  filter: drop-shadow(0 4px 12px rgba(157, 23, 77, 0.15));
  will-change: transform, opacity;
}

.candy-auth-mascot svg {
  width: 100%;
  height: 100%;
  display: block;
}

.candy-auth-mascot.is-hidden {
  opacity: 0;
}

.candy-auth-mascot .mascot-head {
  transform-origin: 50px 42px;
}

.auth-hero-icon {
  width: 4.5rem;
  height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  background: linear-gradient(145deg, #fff5f7 0%, #ffe4ec 100%);
  border: 1px solid rgba(253, 164, 191, 0.55);
  box-shadow: 0 8px 22px rgba(236, 72, 153, 0.14);
  color: #db2777;
}

.auth-hero-icon .candy-icon {
  width: 2.35rem;
  height: 2.35rem;
}

.auth-hero-mascot {
  width: 96px;
  height: 116px;
  filter: drop-shadow(0 6px 16px rgba(236, 72, 153, 0.18));
}

.auth-hero-mascot svg {
  width: 100%;
  height: 100%;
  display: block;
}

.auth-hero-mascot .mascot-candy {
  transform-origin: 86px 66px;
  animation: auth-candy-wiggle 2.5s ease-in-out infinite;
}

@keyframes auth-candy-wiggle {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(6deg); }
}

.candy-offline-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  padding: 2rem;
  background: linear-gradient(165deg, #fff5f7 0%, #ffe4ec 50%, #fecdd9 100%);
  text-align: center;
}

.candy-offline-overlay.is-hidden {
  display: none;
}

.candy-offline-baby {
  width: min(280px, 70vw);
  height: auto;
}

.candy-offline-title {
  font-size: clamp(1.25rem, 4vw, 1.75rem);
  font-weight: 700;
  color: #9d174d;
  letter-spacing: -0.02em;
}

.candy-offline-sub {
  font-size: clamp(0.95rem, 3vw, 1.125rem);
  color: #831843;
  opacity: 0.85;
  max-width: 22rem;
  line-height: 1.6;
}

.candy-birthday-scene {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: min(210px, 34vh);
  z-index: 470;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 0.5rem;
  pointer-events: none;
  background: transparent;
  opacity: 0;
}

.candy-birthday-scene.is-hidden {
  display: none;
}

.candy-birthday-stage {
  position: relative;
  width: min(520px, 94vw);
  height: 200px;
}

.candy-birthday-kid {
  position: absolute;
  bottom: 0;
  width: 80px;
  height: 96px;
  filter: drop-shadow(0 6px 14px rgba(157, 23, 77, 0.18));
}

.candy-birthday-kid svg {
  width: 100%;
  height: 100%;
}

.candy-birthday-kid--center {
  left: 50%;
  transform: translateX(-50%);
  width: 90px;
  height: 108px;
}

.candy-birthday-kid--left {
  left: 8%;
}

.candy-birthday-kid--right {
  right: 8%;
}

.candy-birthday-kid--juggler {
  left: 50%;
  transform: translateX(-50%);
  bottom: 20px;
}

.candy-juggle-pop {
  position: absolute;
  font-size: 1.25rem;
  pointer-events: none;
}

.candy-mascot-runner--with-lollipop {
  width: 88px;
  height: 96px;
  overflow: visible;
}

.candy-mascot-runner--with-lollipop > svg.candy-mascot-svg {
  width: 64px;
  height: 78px;
}

.candy-mascot-runner--with-lollipop .mascot-candy {
  display: none;
}

.candy-run-lollipop {
  position: absolute;
  right: -6px;
  top: 8px;
  width: 46px;
  height: 62px;
  pointer-events: none;
  filter: drop-shadow(0 4px 10px rgba(219, 39, 119, 0.35));
  transform: rotate(18deg);
  transform-origin: 50% 90%;
  z-index: 2;
}

.candy-run-lollipop svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.candy-run-candy {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 481;
  font-size: 1.35rem;
  pointer-events: none;
  will-change: transform, opacity;
}

@media (max-width: 639px) {
  .candy-mascot-runner {
    width: 58px;
    height: 72px;
  }

  .candy-cart-baby,
  #baby.candy-mascot-runner {
    width: 72px;
    height: 88px;
  }

  .candy-auth-mascot {
    width: 54px;
    height: 66px;
  }

  .candy-birthday-stage {
    height: 170px;
  }

  .candy-birthday-kid {
    width: 64px;
    height: 78px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-hero-mascot .mascot-candy {
    animation: none;
  }

  .candy-mascot-runner,
  .candy-auth-mascot,
  .candy-birthday-scene,
  .candy-juggle-pop,
  .candy-run-candy {
    transition: none !important;
    animation: none !important;
  }
}