/* ===============================
   V930 宠物声音设置
================================ */


/* 我的页面入口 */
.page[data-page="mine"] .v930-voice-entry{
  position:absolute;
  z-index:40;

  right:16px;
  top:82px;

  height:40px;
  padding:0 14px;

  display:flex;
  align-items:center;
  gap:6px;

  border:1px solid rgba(255,255,255,.75);
  border-radius:15px;

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

  box-shadow:
    0 8px 20px
    rgba(48,58,52,.10);

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

  color:#57645e;

  font-size:12px;
  font-weight:800;
}


/* 遮罩 */
.v930-voice-backdrop{
  position:fixed;
  z-index:9998;

  inset:0;

  background:
    rgba(28,36,32,.32);

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

  opacity:0;
  pointer-events:none;

  transition:.2s ease;
}


.v930-voice-backdrop.open{
  opacity:1;
  pointer-events:auto;
}


/* 设置面板 */
.v930-voice-panel{
  position:fixed;
  z-index:9999;

  left:50%;
  bottom:
    calc(
      14px +
      env(safe-area-inset-bottom)
    );

  transform:
    translate(-50%,110%);

  width:
    min(
      calc(100vw - 24px),
      430px
    );

  max-height:
    min(
      82dvh,
      720px
    );

  overflow:hidden;

  display:flex;
  flex-direction:column;

  border-radius:
    28px;

  background:
    #f8faf8;

  box-shadow:
    0 22px 70px
    rgba(22,32,27,.22);

  transition:
    transform .28s
    cubic-bezier(.2,.8,.2,1);
}


.v930-voice-panel.open{
  transform:
    translate(-50%,0);
}


/* 标题 */
.v930-voice-head{
  flex:none;

  padding:
    19px
    18px
    14px;

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

  border-bottom:
    1px solid
    rgba(222,228,224,.8);
}


.v930-voice-title{
  display:flex;
  align-items:center;
  gap:10px;
}


.v930-voice-icon{
  width:40px;
  height:40px;

  display:grid;
  place-items:center;

  border-radius:14px;

  background:#e4f3e9;

  font-size:20px;
}


.v930-voice-title b{
  display:block;
  font-size:17px;
}


.v930-voice-title span{
  display:block;
  margin-top:2px;

  color:#909a94;
  font-size:11px;
}


.v930-voice-close{
  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  border-radius:50%;

  background:#eef1ef;

  font-size:18px;
}


/* 内容 */
.v930-voice-body{
  flex:1;

  overflow:auto;

  padding:
    13px
    14px
    8px;

  -webkit-overflow-scrolling:touch;
}


.v930-pet-voice{
  margin-bottom:11px;

  padding:14px;

  border-radius:21px;

  background:white;

  border:
    1px solid
    #edf0ee;

  box-shadow:
    0 7px 20px
    rgba(51,67,59,.055);
}


/* 宠物标题 */
.v930-pet-head{
  margin-bottom:11px;

  display:flex;
  align-items:center;
  gap:10px;
}


.v930-pet-avatar{
  width:42px;
  height:42px;

  display:grid;
  place-items:center;

  border-radius:14px;

  background:#f0f7f2;

  font-size:25px;
}


.v930-pet-name{
  flex:1;
}


.v930-pet-name b{
  display:block;

  font-size:15px;
}


.v930-pet-name span{
  color:#96a09b;

  font-size:10px;
}


/* 音色选择 */
.v930-voice-select{
  width:100%;
  height:45px;

  padding:0 12px;

  border:
    1px solid
    #e4e9e6;

  border-radius:14px;

  outline:none;

  background:
    #f8faf8;

  color:#344039;

  font-size:13px;
}


/* 速度 */
.v930-speed-line{
  margin-top:11px;

  display:grid;

  grid-template-columns:
    42px
    1fr
    36px;

  align-items:center;

  gap:8px;

  color:#848e88;

  font-size:11px;
}


.v930-speed-line input{
  width:100%;
}


.v930-speed-value{
  text-align:right;

  color:#5f6c65;

  font-weight:800;
}


/* 试听 */
.v930-test-btn{
  width:100%;
  height:40px;

  margin-top:10px;

  border-radius:13px;

  background:#e9f5ed;

  color:#599370;

  font-size:12px;
  font-weight:800;
}


.v930-test-btn:disabled{
  opacity:.55;
}


/* 底部操作 */
.v930-voice-foot{
  flex:none;

  display:grid;

  grid-template-columns:
    105px
    1fr;

  gap:9px;

  padding:
    11px
    14px
    calc(
      12px +
      env(safe-area-inset-bottom)
    );

  background:
    rgba(248,250,248,.96);

  border-top:
    1px solid #e6ebe8;
}


.v930-reset{
  height:48px;

  border-radius:16px;

  background:#edf0ee;

  color:#6d7872;

  font-size:13px;
  font-weight:800;
}


.v930-save{
  height:48px;

  border-radius:16px;

  background:#70b38f;

  color:white;

  box-shadow:
    0 8px 18px
    rgba(80,145,108,.20);

  font-size:14px;
  font-weight:900;
}


.v930-voice-toast{
  position:fixed;
  z-index:10000;

  left:50%;
  bottom:
    calc(
      92px +
      env(safe-area-inset-bottom)
    );

  transform:
    translate(-50%,15px);

  padding:
    10px 16px;

  border-radius:14px;

  background:
    rgba(38,47,43,.9);

  color:white;

  white-space:nowrap;

  font-size:12px;

  opacity:0;
  pointer-events:none;

  transition:.2s ease;
}


.v930-voice-toast.show{
  opacity:1;

  transform:
    translate(-50%,0);
}



/* =========================================================
   V930 选择宠物 → 声音设置入口
========================================================= */

.v930-picker-voice-wrap{
  margin-top:12px;
  padding-top:11px;

  border-top:
    1px solid
    rgba(221,228,224,.9);
}


.v930-picker-voice-btn{
  width:100%;
  min-height:58px;

  padding:9px 12px;

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

  border:0;
  border-radius:17px;

  background:
    linear-gradient(
      135deg,
      #edf8f1,
      #f7fbf8
    );

  box-shadow:
    inset 0 0 0 1px
    rgba(99,165,128,.12);

  color:#425249;

  text-align:left;
}


.v930-picker-voice-btn:active{
  transform:scale(.985);
}


.v930-picker-voice-icon{
  width:39px;
  height:39px;

  flex:none;

  display:grid;
  place-items:center;

  border-radius:13px;

  background:#fff;

  box-shadow:
    0 5px 14px
    rgba(61,94,76,.08);

  font-size:18px;
}


.v930-picker-voice-text{
  flex:1;
  min-width:0;
}


.v930-picker-voice-text b{
  display:block;

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

  color:#45564c;
}


.v930-picker-voice-text small{
  display:block;

  margin-top:2px;

  color:#909b95;

  font-size:10px;
}


.v930-picker-voice-arrow{
  flex:none;

  color:#8e9b94;

  font-size:23px;
  line-height:1;
}