.page-play.play-v71{
  padding:0!important;
  overflow:hidden
}

.page-play.play-v71 .play-stage{
  isolation:isolate
}

.page-play.play-v71 .play-stage:after{
  background:
    linear-gradient(
      to bottom,
      rgba(8,28,20,.22),
      rgba(8,28,20,.02) 34%,
      rgba(7,28,20,.07) 63%,
      rgba(7,24,18,.36)
    )!important
}


/* ========== 顶部 HUD ========== */

.play-v71-hud{
  position:absolute;
  z-index:18;

  top:calc(14px + env(safe-area-inset-top));
  left:16px;
  right:16px;

  display:flex;
  justify-content:space-between;
  align-items:flex-start;

  pointer-events:none
}

.play-v71-left,
.play-v71-right{
  display:flex;
  gap:10px;
  pointer-events:auto
}

.play-v71-right{
  align-items:center
}


/* 左边只留饱腹 + 心情 */

.play-v71-left .play-status{
  position:static!important;
  display:flex!important;
  gap:10px!important
}

.play-v71-left .play-status span{
  min-width:72px;
  height:38px;

  padding:0 12px!important;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;

  border-radius:15px!important;

  background:rgba(25,47,38,.38)!important;

  border:
    1px solid
    rgba(255,255,255,.25)!important;

  color:#fff;

  backdrop-filter:
    blur(18px)
    saturate(125%);

  -webkit-backdrop-filter:
    blur(18px)
    saturate(125%);

  box-shadow:
    0 7px 18px
    rgba(10,24,18,.11)!important;

  font-size:12px!important
}

.play-v71-left .play-status span b{
  font-size:12px
}

.play-v71-left .play-status span.v71-pop{
  animation:
    v71StatusPop .6s
    cubic-bezier(.2,.85,.25,1.35)
}

@keyframes v71StatusPop{

  0%,100%{
    transform:scale(1)
  }

  40%{
    transform:scale(1.13)
  }

  70%{
    transform:scale(.97)
  }

}


/* ========== 右上两个按钮 ========== */

.play-v71-right .glass-btn,
.play-v71-right .scene-btn{

  position:relative!important;

  inset:auto!important;

  width:42px!important;
  height:42px!important;

  padding:0!important;

  border-radius:15px!important;

  display:grid!important;
  place-items:center!important;

  background:
    rgba(25,47,38,.38)!important;

  border:
    1px solid
    rgba(255,255,255,.25)!important;

  color:#fff!important;

  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);

  box-shadow:
    0 7px 18px
    rgba(10,24,18,.11)!important
}

.play-v71-right .v71-switch{
  font-size:0!important
}

.play-v71-right .v71-switch:before{
  content:"🐾";
  font-size:18px
}

.play-v71-right .v71-scene{
  font-size:0!important
}

.play-v71-right .v71-scene span{
  font-size:18px!important;
  line-height:1
}

.play-v71-right .v71-scene small{
  display:none!important
}

.play-v71-right button:active{
  transform:scale(.91)
}


/* ========== 中间伙伴名字 ========== */

.play-v71-name{

  position:absolute;
  z-index:17;

  top:
    calc(
      63px +
      env(safe-area-inset-top)
    );

  left:50%;

  transform:
    translateX(-50%);

  border:0;
  background:transparent;
  padding:0
}

.play-v71-name .glass-title{

  padding:
    7px 13px!important;

  border-radius:
    999px!important;

  background:
    rgba(255,255,255,.78)!important;

  border:
    1px solid
    rgba(255,255,255,.88)!important;

  color:
    #3a4d43!important;

  box-shadow:
    0 7px 22px
    rgba(19,40,30,.10)!important;

  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px)
}

.play-v71-name .eyebrow{
  display:none!important
}

.play-v71-name h2{

  margin:0!important;

  font-size:
    13px!important;

  font-weight:
    800!important;

  white-space:nowrap
}

.play-top.v71-empty-top{
  pointer-events:none
}


/* ========== 宠物主体 ========== */

.play-v71 .play-pet{

  bottom:
    142px!important;

  width:
    min(72%,340px)!important;

  height:
    56%!important;

  object-position:
    center bottom!important;

  filter:
    drop-shadow(
      0 18px 16px
      rgba(13,29,21,.17)
    )!important;

  will-change:transform;
  cursor:pointer
}

.play-v71
.play-stage.v71-sheet-open
.play-pet{

  bottom:
    216px!important;

  height:
    49%!important
}


/* 点击宠物 */

.play-v71 .play-pet.v71-tap{

  animation:
    v71PetTap .72s
    cubic-bezier(.18,.9,.24,1.25)!important
}

@keyframes v71PetTap{

  0%,100%{

    transform:
      translateX(-50%)
      translateY(0)
      rotate(0)

  }

  32%{

    transform:
      translateX(-50%)
      translateY(-17px)
      rotate(-3deg)
      scale(1.045)

  }

  62%{

    transform:
      translateX(-50%)
      translateY(-5px)
      rotate(3deg)
      scale(1.02)

  }

}


/* 地面阴影 */

.play-v71-shadow{

  position:absolute;

  z-index:2;

  left:50%;

  bottom:137px;

  transform:
    translateX(-50%);

  width:
    min(45vw,190px);

  height:24px;

  border-radius:50%;

  background:
    radial-gradient(
      ellipse,
      rgba(20,35,27,.24),
      rgba(20,35,27,.03) 67%,
      transparent 72%
    );

  filter:blur(3px);

  animation:
    v71Shadow
    3.2s
    ease-in-out
    infinite;

  pointer-events:none
}

.play-stage.v71-sheet-open
.play-v71-shadow{

  bottom:209px
}

@keyframes v71Shadow{

  0%,100%{
    transform:
      translateX(-50%)
      scaleX(.92);
    opacity:.72
  }

  50%{
    transform:
      translateX(-50%)
      scaleX(1.04);
    opacity:.5
  }

}


/* ========== 场景漂浮光点 ========== */

.play-v71-ambient{

  position:absolute;
  z-index:1;

  inset:0;

  overflow:hidden;

  pointer-events:none
}

.play-v71-ambient i{

  position:absolute;

  left:var(--x);
  top:var(--y);

  width:var(--s);
  height:var(--s);

  border-radius:50%;

  background:
    rgba(255,255,255,.68);

  box-shadow:
    0 0 12px
    rgba(255,255,255,.5);

  animation:
    v71Ambient
    var(--d)
    ease-in-out
    infinite alternate;

  animation-delay:
    var(--delay)
}

@keyframes v71Ambient{

  from{
    opacity:.16;
    transform:
      translateY(7px)
      scale(.7)
  }

  to{
    opacity:.72;
    transform:
      translateY(-11px)
      scale(1.12)
  }

}


/* ========== 宠物说话 ========== */

.play-v71 .speech{

  top:24%!important;

  padding:
    9px 13px!important;

  border-radius:
    16px!important;

  max-width:76vw;

  overflow:hidden;

  text-overflow:
    ellipsis;

  transition:
    opacity .28s ease,
    transform .28s ease!important;

  transform:
    translateX(-50%)
    translateY(0)
    scale(1)!important
}

.play-v71 .speech.v71-hidden{

  opacity:0!important;

  pointer-events:none;

  transform:
    translateX(-50%)
    translateY(8px)
    scale(.96)!important
}

.play-v71 .speech.v71-show{

  opacity:1!important;

  transform:
    translateX(-50%)
    translateY(0)
    scale(1)!important
}


/* 爱心星星 */

.v71-heart{

  position:absolute;

  z-index:21;

  font-style:normal;

  color:#fff;

  font-size:21px;

  pointer-events:none;

  text-shadow:
    0 3px 12px
    rgba(28,75,50,.22);

  animation:
    v71Heart
    1.35s
    ease-out
    forwards;

  animation-delay:
    var(--delay)
}

@keyframes v71Heart{

  0%{

    opacity:0;

    transform:
      translate(-50%,-50%)
      scale(.55)

  }

  18%{
    opacity:1
  }

  100%{

    opacity:0;

    transform:
      translate(
        calc(-50% + var(--drift)),
        -100px
      )
      scale(1.18)
      rotate(10deg)

  }

}


/* ========== 动作 / 喂食入口 ========== */

.play-v71-tools{

  position:absolute;

  z-index:19;

  left:50%;

  bottom:
    calc(
      88px +
      env(safe-area-inset-bottom)
    );

  transform:
    translateX(-50%);

  display:flex;

  gap:10px
}

.play-v71-tool{

  height:48px;

  min-width:112px;

  padding:0 18px;

  border:
    1px solid
    rgba(255,255,255,.72);

  border-radius:999px;

  background:
    rgba(255,252,247,.91);

  color:#35483e;

  display:flex;

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

  gap:8px;

  box-shadow:
    0 9px 25px
    rgba(24,39,30,.13);

  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px)
}

.play-v71-tool span{
  font-size:18px
}

.play-v71-tool b{
  font-size:13px
}

.play-v71-tool:active{
  transform:scale(.96)
}


/* 原操作区变底部弹层 */

.play-v71
.play-sheet.v71-sheet{

  z-index:25!important;

  left:12px!important;
  right:12px!important;

  bottom:
    calc(
      84px +
      env(safe-area-inset-bottom)
    )!important;

  height:auto!important;

  min-height:160px;

  max-height:228px;

  padding:
    13px 12px 12px!important;

  border-radius:
    27px!important;

  background:
    rgba(250,247,242,.97)!important;

  transform:
    translateY(
      calc(100% + 120px)
    );

  opacity:0;

  pointer-events:none;

  transition:
    transform .32s
    cubic-bezier(.22,.85,.28,1),
    opacity .2s ease
}

.play-v71
.play-sheet.v71-sheet.v71-open{

  transform:
    translateY(0);

  opacity:1;

  pointer-events:auto
}

.play-v71
.play-sheet.v71-sheet
.sheet-tabs{

  margin:
    0 44px 9px!important
}

.play-v71
.play-sheet.v71-sheet
.action-grid,

.play-v71
.play-sheet.v71-sheet
.feed-grid{

  height:
    104px!important
}

.v71-sheet-close{

  position:absolute;

  right:12px;
  top:10px;

  width:30px;
  height:30px;

  border:0;

  border-radius:50%;

  background:#eee8df;

  color:#746b62;

  font-size:21px;

  line-height:1
}


/* 动作按钮按压 */

.play-v71 .action-btn{

  box-shadow:
    0 4px 0
    #e4d9ce!important;

  transition:
    transform .15s ease,
    box-shadow .15s ease
}

.play-v71 .action-btn:active{

  transform:
    translateY(3px)
    scale(.96);

  box-shadow:
    0 1px 0
    #e4d9ce!important
}


/* 矮屏 */

@media(max-height:760px){

  .play-v71-hud{

    top:
      calc(
        10px +
        env(safe-area-inset-top)
      )

  }

  .play-v71-name{

    top:
      calc(
        55px +
        env(safe-area-inset-top)
      )

  }

  .play-v71 .play-pet{

    bottom:
      130px!important;

    height:
      52%!important

  }

  .play-v71-shadow{
    bottom:125px
  }

  .play-v71-tools{

    bottom:
      calc(
        82px +
        env(safe-area-inset-bottom)
      )

  }

}

.reduce-motion
.play-v71-ambient i,

.reduce-motion
.play-v71-shadow{

  animation:none!important
}