/* ===== 钱包环境引导弹窗 ===== */
.wg-mask{
  position:fixed;inset:0;z-index:400;
  display:flex;align-items:center;justify-content:center;
  background:rgba(4,6,10,.88);backdrop-filter:blur(8px);
  padding:1.2rem;animation:wgFade .3s
}
@keyframes wgFade{from{opacity:0}to{opacity:1}}
.wg-card{
  width:100%;max-width:330px;
  background:linear-gradient(170deg,rgba(31,184,125,.13),rgba(10,13,19,.99) 45%);
  border:1px solid rgba(31,184,125,.42);
  border-radius:20px;padding:1.6rem 1.35rem 1.25rem;
  text-align:center;position:relative;
  box-shadow:0 0 0 1px rgba(255,255,255,.04) inset,
             0 30px 70px -20px rgba(0,0,0,.9),
             0 0 60px -25px rgba(31,184,125,.5);
  animation:wgPop .34s cubic-bezier(.22,1,.36,1)
}
@keyframes wgPop{from{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}
.wg-ico{
  width:52px;height:52px;margin:0 auto .85rem;
  border-radius:15px;
  background:linear-gradient(135deg,#1fb87d,#149468);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px -8px rgba(31,184,125,.8);
}
.wg-ico svg{width:26px;height:26px;color:#04170e}
.wg-title{font-size:1.02rem;font-weight:800;color:#eef3f9;margin-bottom:.35rem;letter-spacing:.01em}
.wg-sub{font-size:.72rem;color:#7d8fa9;line-height:1.6;margin-bottom:1.1rem}
.wg-steps{text-align:left;margin-bottom:1.1rem;display:flex;flex-direction:column;gap:.5rem}
.wg-step{
  display:flex;align-items:center;gap:.6rem;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;padding:.55rem .7rem;
  font-size:.72rem;color:#c3cdd9;line-height:1.5
}
.wg-step b{
  flex-shrink:0;width:19px;height:19px;border-radius:50%;
  background:linear-gradient(135deg,#1fb87d,#149468);
  color:#04170e;font-size:.62rem;font-weight:900;
  display:flex;align-items:center;justify-content:center
}
.wg-step code{
  font-family:var(--mono,monospace);font-size:.7rem;
  background:rgba(31,184,125,.13);color:#4ee0a4;
  padding:.05rem .35rem;border-radius:4px
}
.wg-btn{
  width:100%;padding:.75rem;border:none;border-radius:11px;
  background:linear-gradient(135deg,#1fb87d,#149468);
  color:#04170e;font-size:.85rem;font-weight:800;
  cursor:pointer;transition:.16s;
  display:flex;align-items:center;justify-content:center;gap:.4rem;
  box-shadow:0 6px 20px -8px rgba(31,184,125,.7);
  margin-bottom:.55rem
}
.wg-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.wg-btn:active{transform:scale(.985)}
.wg-close{
  width:100%;padding:.5rem;border:none;background:none;
  color:#5d6f85;font-size:.68rem;cursor:pointer;transition:.16s
}
.wg-close:hover{color:#8fa3ba}

/* ===== 领取结果弹窗 ===== */
.fp-mask{
  position:fixed;inset:0;z-index:420;
  display:flex;align-items:center;justify-content:center;
  background:rgba(4,6,10,.88);backdrop-filter:blur(8px);
  padding:1.2rem;animation:wgFade .25s
}
.fp-card{
  width:100%;max-width:320px;
  background:linear-gradient(170deg,rgba(255,255,255,.05),rgba(10,13,19,.99) 45%);
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;padding:1.4rem 1.25rem 1.1rem;
  text-align:center;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.9);
  animation:wgPop .3s cubic-bezier(.22,1,.36,1)
}
.fp-card.ok{
  background:linear-gradient(170deg,rgba(31,184,125,.14),rgba(10,13,19,.99) 45%);
  border-color:rgba(31,184,125,.42);
  box-shadow:0 0 60px -25px rgba(31,184,125,.6), 0 30px 70px -20px rgba(0,0,0,.9);
}
.fp-card.err{
  background:linear-gradient(170deg,rgba(229,72,77,.12),rgba(10,13,19,.99) 45%);
  border-color:rgba(229,72,77,.38);
  box-shadow:0 0 60px -25px rgba(229,72,77,.5), 0 30px 70px -20px rgba(0,0,0,.9);
}
.fp-title{font-size:.98rem;font-weight:800;color:#eef3f9;margin-bottom:.75rem}
.fp-card.ok .fp-title{color:#4ee0a4}
.fp-card.err .fp-title{color:#f28b8e}
.fp-body{
  font-size:.74rem;color:#c3cdd9;line-height:1.65;
  margin-bottom:1.05rem;text-align:left;
  word-break:break-all;
  background:rgba(0,0,0,.28);border-radius:9px;padding:.65rem .7rem;
  font-family:var(--mono,monospace)
}
.fp-btn{
  width:100%;padding:.68rem;border:none;border-radius:10px;
  background:rgba(255,255,255,.09);color:#dbe3ec;
  font-size:.82rem;font-weight:700;cursor:pointer;transition:.16s
}
.fp-btn:hover{background:rgba(255,255,255,.14)}
.fp-btn:active{transform:scale(.985)}

/* ===== 顶栏工具区（音效/速度）===== */
.top-tools{
  display:flex;align-items:center;gap:.35rem;
  margin-left:auto;margin-right:.4rem;flex-shrink:0
}
.top-tools .sound-toggle{
  padding:0 .45rem;height:30px;border-radius:8px;
  display:inline-flex;align-items:center;gap:.22rem;
  font-size:.64rem;white-space:nowrap
}
/* 「一键开始游戏」固定在右上角 */
.top-in .connect{flex-shrink:0}
@media(max-width:380px){
  .top-tools .sound-toggle span:last-child{display:none}
  .top-tools .sound-toggle{padding:0 .4rem}
}

/* ===== 连接按钮：显示钱包地址 ===== */
.connect .ca-addr{
  display:inline-flex;align-items:center;gap:.32rem;
  font-family:var(--mono,monospace);
  font-size:.68rem;letter-spacing:.01em;
}
.connect .ca-dot{
  width:6px;height:6px;border-radius:50%;
  background:#1fb87d;
  box-shadow:0 0 6px rgba(31,184,125,.9);
  animation:caPulse 2s ease-in-out infinite;
  flex-shrink:0;
}
@keyframes caPulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.55;transform:scale(.85)}
}
.connect.connected{
  border-color:rgba(31,184,125,.55);
  color:#4ee0a4;
  background:linear-gradient(135deg,rgba(31,184,125,.16),rgba(31,184,125,.06));
}
.connect.connected:hover{
  border-color:rgba(229,72,77,.5);
  color:#f28b8e;
  background:linear-gradient(135deg,rgba(229,72,77,.14),rgba(229,72,77,.05));
}
/* 悬停时提示"断开" */
.connect.connected:hover .ca-dot{background:#e5484d;box-shadow:0 0 6px rgba(229,72,77,.9)}
@media(max-width:380px){
  .connect .ca-addr{font-size:.62rem}
}

/* ===== 音效按钮（醒目版）===== */
#sound-toggle{
  padding:0 .6rem;height:32px;border-radius:9px;
  border:1px solid rgba(31,184,125,.45);
  background:linear-gradient(135deg,rgba(31,184,125,.18),rgba(58,169,212,.10));
  color:#4ee0a4;
  font-family:var(--sans);font-size:.68rem;font-weight:800;
  letter-spacing:.02em;
  cursor:pointer;transition:.18s;
  display:inline-flex;align-items:center;gap:.3rem;
  white-space:nowrap;flex-shrink:0;
  box-shadow:0 0 0 0 rgba(31,184,125,.45);
  animation:sndGlow 2.6s ease-in-out infinite;
}
@keyframes sndGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(31,184,125,0)}
  50%{box-shadow:0 0 14px -2px rgba(31,184,125,.65)}
}
#sound-toggle svg{width:15px;height:15px;flex-shrink:0}
#sound-toggle:hover{
  border-color:rgba(31,184,125,.8);
  background:linear-gradient(135deg,rgba(31,184,125,.3),rgba(58,169,212,.18));
  transform:translateY(-1px);
}
#sound-toggle:active{transform:scale(.96)}
/* 关闭态 */
#sound-toggle.off{
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.04);
  color:#5d6f85;
  animation:none;
  box-shadow:none;
}
#sound-toggle.off:hover{border-color:rgba(255,255,255,.25);color:#8fa3ba}
/* 播放中脉冲（开启时更明显）*/
#sound-toggle.on{animation:sndGlow 2.6s ease-in-out infinite}
@media(max-width:380px){
  #sound-toggle span:last-child{display:none}
  #sound-toggle{padding:0 .45rem}
}