/* ==========================================
   V85.2 顶部重新整理
========================================== */


/* ---------- 顶部左侧：饱食 / 心情 ---------- */

.page-play .play-status{
  position:absolute !important;
  z-index:30 !important;

  top:calc(env(safe-area-inset-top) + 12px) !important;
  left:18px !important;

  display:flex !important;
  align-items:center !important;
  gap:10px !important;

  margin:0 !important;
  padding:0 !important;
}


.page-play .play-status > span{
  box-sizing:border-box !important;

  width:92px !important;
  height:46px !important;

  padding:0 10px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;

  border-radius:17px !important;

  background:rgba(148,160,151,.80) !important;

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

  box-shadow:
    0 6px 16px rgba(45,57,49,.10) !important;

  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;

  color:#fff !important;

  font-size:14px !important;
  line-height:1 !important;
}


.page-play .play-status > span b{
  font-size:16px !important;
  font-weight:800 !important;
  line-height:1 !important;
}


/* ---------- 顶部右侧：只留两个图标 ---------- */

.page-play [data-action="switch-pet"],
.page-play [data-action="scene"],
.page-play .scene-btn{
  box-sizing:border-box !important;

  position:absolute !important;
  z-index:31 !important;

  top:calc(env(safe-area-inset-top) + 12px) !important;

  width:46px !important;
  min-width:46px !important;
  max-width:46px !important;

  height:46px !important;
  min-height:46px !important;
  max-height:46px !important;

  padding:0 !important;
  margin:0 !important;

  overflow:hidden !important;

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

  border-radius:17px !important;

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

  background:rgba(148,160,151,.80) !important;

  box-shadow:
    0 6px 16px rgba(45,57,49,.10) !important;

  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;

  color:#36463f !important;
}


/* 换伙伴位置 */
.page-play [data-action="switch-pet"]{
  right:76px !important;

  /* 把“换伙伴”三个字彻底隐藏 */
  font-size:0 !important;
  color:transparent !important;
}


/* 自己重新放脚印 */
.page-play [data-action="switch-pet"]::before{
  content:"🐾" !important;

  display:block !important;

  font-size:21px !important;
  line-height:1 !important;

  color:#3d4a43 !important;
}


/* 防止旧CSS里的文字、小标签露出来 */
.page-play [data-action="switch-pet"] span,
.page-play [data-action="switch-pet"] small,
.page-play [data-action="switch-pet"] b{
  display:none !important;
}


/* 场景按钮位置 */
.page-play [data-action="scene"],
.page-play .scene-btn{
  right:18px !important;

  font-size:0 !important;
  color:transparent !important;
}


/* 场景按钮重新绘制简单图标 */
.page-play [data-action="scene"]::before,
.page-play .scene-btn::before{
  content:"◐" !important;

  display:block !important;

  font-size:23px !important;
  font-weight:400 !important;
  line-height:1 !important;

  color:#fff !important;
}


.page-play .scene-btn small{
  display:none !important;
}


/* ---------- 旧顶部标题整个退出布局 ---------- */

.page-play .play-top{
  pointer-events:none !important;
}


.page-play .play-top .glass-title{
  display:none !important;
}


/* ---------- 生命状态不显示 ---------- */

.page-play #v80LifeBadge{
  display:none !important;
}


/* ==========================================
   团团名字
========================================== */

.page-play .play-v71-name{
  position:absolute !important;
  z-index:25 !important;

  top:calc(env(safe-area-inset-top) + 78px) !important;
  left:50% !important;

  transform:translateX(-50%) !important;

  width:auto !important;
  min-width:76px !important;

  height:36px !important;

  padding:0 17px !important;
  margin:0 !important;

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

  white-space:nowrap !important;

  border-radius:999px !important;

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

  background:rgba(255,253,248,.91) !important;

  color:#385044 !important;

  font-size:15px !important;
  font-weight:850 !important;
  line-height:1 !important;

  box-shadow:
    0 7px 18px rgba(48,67,55,.08),
    inset 0 1px 0 rgba(255,255,255,.92) !important;

  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;

  animation:v852NameFloat 3s ease-in-out infinite !important;
}


/* 可爱小闪光 */
.page-play .play-v71-name::after{
  content:"✦" !important;

  position:absolute !important;

  right:-5px !important;
  top:-5px !important;

  width:17px !important;
  height:17px !important;

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

  border-radius:50% !important;

  background:#f4dda1 !important;
  color:#fff !important;

  font-size:9px !important;

  animation:v852Spark 2.2s ease-in-out infinite !important;
}


@keyframes v852NameFloat{
  0%,100%{
    transform:
      translateX(-50%)
      translateY(0);
  }

  50%{
    transform:
      translateX(-50%)
      translateY(-3px);
  }
}


@keyframes v852Spark{
  0%,100%{
    opacity:.6;
    transform:scale(.8);
  }

  50%{
    opacity:1;
    transform:scale(1.08);
  }
}


/* ==========================================
   对话框
========================================== */

.page-play #playSpeech{
  position:absolute !important;
  z-index:24 !important;

  top:calc(env(safe-area-inset-top) + 130px) !important;
  left:50% !important;

  bottom:auto !important;

  transform:translateX(-50%) !important;

  width:max-content !important;
  max-width:72vw !important;

  min-height:42px !important;

  padding:10px 17px !important;

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

  border-radius:
    18px 18px 18px 7px !important;

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

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

  color:#37342f !important;

  font-size:14px !important;
  font-weight:780 !important;

  text-align:center !important;

  white-space:normal !important;

  box-shadow:
    0 8px 20px rgba(45,60,50,.09) !important;

  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
}


/* 箭头指向狗狗 */
.page-play #playSpeech::after{
  content:"" !important;

  position:absolute !important;

  left:50% !important;
  bottom:-8px !important;

  width:16px !important;
  height:16px !important;

  transform:
    translateX(-50%)
    rotate(45deg) !important;

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

  border-right:
    1px solid rgba(255,255,255,.85) !important;

  border-bottom:
    1px solid rgba(255,255,255,.85) !important;
}


/* 小屏 */
@media(max-height:760px){

  .page-play .play-status{
    top:calc(env(safe-area-inset-top) + 8px) !important;
  }

  .page-play [data-action="switch-pet"],
  .page-play [data-action="scene"],
  .page-play .scene-btn{
    top:calc(env(safe-area-inset-top) + 8px) !important;
  }

  .page-play .play-v71-name{
    top:calc(env(safe-area-inset-top) + 70px) !important;
  }

  .page-play #playSpeech{
    top:calc(env(safe-area-inset-top) + 118px) !important;
  }

}

/* ==========================================
   V85.3 名字重新定位
========================================== */

/* 名字按钮绝对不能继承右上角“换伙伴”的脚印图标 */
.page-play .play-v71-name[data-action="switch-pet"]::before{
  content:none !important;
  display:none !important;
}

/* 恢复名字本身颜色和字体 */
.page-play .play-v71-name[data-action="switch-pet"]{
  color:#365044 !important;
  font-size:15px !important;

  width:auto !important;
  min-width:72px !important;
  max-width:140px !important;

  height:36px !important;

  right:auto !important;

  overflow:visible !important;
}


/* 名字移到宠物头顶上方 */
.page-play .play-v71-name{
  top:calc(env(safe-area-inset-top) + 148px) !important;

  min-width:72px !important;
  height:36px !important;

  padding:0 16px !important;

  background:rgba(255,253,248,.90) !important;

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

  border-radius:18px !important;

  box-shadow:
    0 6px 16px rgba(45,62,50,.08) !important;

  font-size:15px !important;
}


/* 小闪光放右上角 */
.page-play .play-v71-name::after{
  content:"✦" !important;

  right:-5px !important;
  top:-6px !important;

  width:17px !important;
  height:17px !important;

  font-size:9px !important;
}


/* 右上角真正的换伙伴按钮才显示脚印 */
.page-play .play-v71-hud [data-action="switch-pet"]::before,
.page-play .play-top > [data-action="switch-pet"]::before{
  content:"🐾" !important;

  display:block !important;

  font-size:21px !important;
  line-height:1 !important;

  color:#3d4a43 !important;
}


/* 对话气泡放在名字下面、狗狗耳朵上方 */
.page-play #playSpeech{
  top:calc(env(safe-area-inset-top) + 196px) !important;
}


/* 小屏稍微收紧 */
@media(max-height:760px){

  .page-play .play-v71-name{
    top:calc(env(safe-area-inset-top) + 136px) !important;
  }

  .page-play #playSpeech{
    top:calc(env(safe-area-inset-top) + 180px) !important;
  }

}

/* ==========================================
   V85.4 对话框移到宠物右上角
========================================== */

.page-play #playSpeech{
  top:32% !important;
  left:auto !important;
  right:22px !important;
  bottom:auto !important;

  transform:none !important;

  width:auto !important;
  max-width:175px !important;
  min-height:42px !important;

  padding:10px 15px !important;

  border-radius:18px 18px 18px 7px !important;

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

  color:#37342f !important;

  font-size:13px !important;
  font-weight:780 !important;
  line-height:1.4 !important;

  text-align:center !important;

  box-shadow:
    0 8px 22px rgba(45,60,50,.10) !important;

  animation:v854SpeechFloat 3s ease-in-out infinite !important;
}


/* 箭头从左下角指向宠物 */
.page-play #playSpeech::after{
  content:"" !important;

  position:absolute !important;

  left:18px !important;
  right:auto !important;

  bottom:-8px !important;

  width:16px !important;
  height:16px !important;

  transform:rotate(45deg) !important;

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

  border-right:1px solid rgba(255,255,255,.86) !important;
  border-bottom:1px solid rgba(255,255,255,.86) !important;
}


/* 很轻的悬浮感 */
@keyframes v854SpeechFloat{
  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-3px);
  }
}


/* 小屏 */
@media(max-height:760px){

  .page-play #playSpeech{
    top:30% !important;
    right:15px !important;

    max-width:155px !important;

    padding:9px 13px !important;

    font-size:12px !important;
  }

}
