/* =========================================================
   V946 小宠任务屋 · 进入动效
========================================================= */

.v946-entry{
  position:fixed;
  inset:0;
  z-index:999999;

  display:flex;
  align-items:center;
  justify-content:center;

  overflow:hidden;

  background:
    radial-gradient(
      circle at 72% 22%,
      rgba(190,232,163,.30),
      transparent 28%
    ),
    radial-gradient(
      circle at 18% 82%,
      rgba(255,213,163,.28),
      transparent 26%
    ),
    #f8f7f1;

  opacity:1;
  visibility:visible;

  transition:
    opacity .48s ease,
    visibility .48s ease;

  animation:
    v946Failsafe 3.4s forwards;

  animation-delay:0s;
}


/* JS 正常结束 */
.v946-entry.is-out{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}


/* 中心区域 */
.v946-entry-inner{
  position:relative;

  width:min(86vw,420px);

  display:flex;
  flex-direction:column;
  align-items:center;

  text-align:center;
}


/* 柔光 */
.v946-entry-glow{
  position:absolute;

  width:230px;
  height:230px;

  top:36px;
  left:50%;

  transform:translateX(-50%);

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(170,224,139,.32),
      rgba(170,224,139,0) 68%
    );

  animation:
    v946Glow 1.8s ease-in-out infinite;
}


/* 宠物容器 */
.v946-pet-wrap{
  position:relative;

  width:176px;
  height:176px;

  display:flex;
  align-items:flex-end;
  justify-content:center;

  margin-bottom:6px;

  animation:
    v946PetIn .70s
    cubic-bezier(.2,1.25,.38,1)
    both;
}


/* 宠物 */
.v946-pet{
  position:relative;
  z-index:3;

  width:148px;
  height:148px;

  object-fit:contain;

  filter:
    drop-shadow(
      0 18px 18px
      rgba(68,83,62,.12)
    );

  transform-origin:center bottom;

  animation:
    v946PetBob 1.45s
    .72s
    ease-in-out
    infinite;
}


/* 地面阴影 */
.v946-shadow{
  position:absolute;

  z-index:1;

  width:112px;
  height:22px;

  bottom:4px;

  border-radius:50%;

  background:
    rgba(69,83,66,.10);

  filter:blur(6px);

  animation:
    v946Shadow 1.45s
    .72s
    ease-in-out
    infinite;
}


/* 小爱心 */
.v946-heart{
  position:absolute;

  z-index:5;

  top:16px;
  right:5px;

  width:36px;
  height:36px;

  display:grid;
  place-items:center;

  border-radius:50%;

  background:#fff;

  box-shadow:
    0 8px 20px
    rgba(116,106,91,.10);

  font-size:18px;

  animation:
    v946Heart .9s
    .48s
    cubic-bezier(.2,1.4,.35,1)
    both;
}


/* 标题 */
.v946-entry-title{
  position:relative;
  z-index:4;

  margin-top:8px;

  color:#302c28;

  font-size:26px;
  line-height:1.2;
  font-weight:900;

  letter-spacing:.02em;

  animation:
    v946TextIn .48s
    .30s
    ease
    both;
}


.v946-entry-sub{
  position:relative;
  z-index:4;

  margin-top:8px;

  color:#958d82;

  font-size:13px;
  font-weight:650;

  animation:
    v946TextIn .48s
    .42s
    ease
    both;
}


/* 加载小点 */
.v946-dots{
  display:flex;
  align-items:center;
  justify-content:center;

  gap:7px;

  margin-top:18px;
}


.v946-dots i{
  width:7px;
  height:7px;

  border-radius:50%;

  background:#8bcf71;

  animation:
    v946Dot .9s
    ease-in-out
    infinite;
}


.v946-dots i:nth-child(2){
  animation-delay:.14s;
}


.v946-dots i:nth-child(3){
  animation-delay:.28s;
}


/* 漂浮爪印 */
.v946-paw{
  position:absolute;

  color:
    rgba(109,172,103,.34);

  font-size:18px;

  animation:
    v946Paw 2.2s
    ease-in-out
    infinite;
}


.v946-paw.p1{
  left:4%;
  top:17%;

  transform:rotate(-18deg);
}


.v946-paw.p2{
  right:8%;
  top:31%;

  font-size:14px;

  animation-delay:-.8s;
}


.v946-paw.p3{
  left:13%;
  bottom:17%;

  font-size:12px;

  animation-delay:-1.4s;
}


.v946-star{
  position:absolute;

  color:
    rgba(239,178,89,.65);

  font-size:15px;

  animation:
    v946Star 1.8s
    ease-in-out
    infinite;
}


.v946-star.s1{
  right:17%;
  top:12%;
}


.v946-star.s2{
  left:19%;
  top:37%;

  animation-delay:-.9s;
}


/* ================= 动画 ================= */

@keyframes v946PetIn{

  0%{
    opacity:0;

    transform:
      translateY(58px)
      scale(.72);
  }

  65%{
    opacity:1;

    transform:
      translateY(-7px)
      scale(1.05);
  }

  100%{
    transform:
      translateY(0)
      scale(1);
  }

}


@keyframes v946PetBob{

  0%,
  100%{
    transform:
      translateY(0)
      rotate(-1deg);
  }

  50%{
    transform:
      translateY(-7px)
      rotate(1.5deg);
  }

}


@keyframes v946Shadow{

  0%,
  100%{
    transform:scale(1);
    opacity:.8;
  }

  50%{
    transform:scale(.86);
    opacity:.55;
  }

}


@keyframes v946Heart{

  0%{
    opacity:0;

    transform:
      translateY(14px)
      scale(.3)
      rotate(-15deg);
  }

  100%{
    opacity:1;

    transform:
      translateY(0)
      scale(1)
      rotate(0);
  }

}


@keyframes v946TextIn{

  from{
    opacity:0;
    transform:translateY(12px);
  }

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

}


@keyframes v946Dot{

  0%,
  100%{
    transform:translateY(0);
    opacity:.35;
  }

  50%{
    transform:translateY(-5px);
    opacity:1;
  }

}


@keyframes v946Paw{

  0%,
  100%{
    transform:
      translateY(0)
      rotate(-12deg)
      scale(.9);

    opacity:.18;
  }

  50%{
    transform:
      translateY(-9px)
      rotate(7deg)
      scale(1.08);

    opacity:.55;
  }

}


@keyframes v946Star{

  0%,
  100%{
    transform:
      scale(.7)
      rotate(0);

    opacity:.3;
  }

  50%{
    transform:
      scale(1.25)
      rotate(25deg);

    opacity:1;
  }

}


@keyframes v946Glow{

  0%,
  100%{
    transform:
      translateX(-50%)
      scale(.9);

    opacity:.55;
  }

  50%{
    transform:
      translateX(-50%)
      scale(1.08);

    opacity:1;
  }

}


/*
  如果 JS 出问题，
  3.4 秒自动释放页面。
*/
@keyframes v946Failsafe{

  0%,
  88%{
    opacity:1;
    visibility:visible;
  }

  100%{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
  }

}


/* 桌面端稍大 */
@media (min-width:900px){

  .v946-pet-wrap{
    width:210px;
    height:210px;
  }

  .v946-pet{
    width:178px;
    height:178px;
  }

  .v946-entry-title{
    font-size:31px;
  }

  .v946-entry-sub{
    font-size:14px;
  }

}


/* 减少动态 */
@media (prefers-reduced-motion:reduce){

  .v946-entry *,
  .v946-entry{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }

}