/* 贝加尔湖50径 · 环境音播放器
   设计原则：点击才播，绝不自动播；黑白极简；不干扰 AI 爬虫。
   音频来自项目实地素材（贝加尔湖西岸），零版权风险。 */

.baikal-amb {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px 9px 11px;
  background: rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 0, 0, .14);
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  font-size: 11px;
  letter-spacing: 2px;
  color: #111;
  opacity: .72;
  transition: opacity .28s ease, border-color .28s ease, transform .28s ease;
  -webkit-tap-highlight-color: transparent;
}
.baikal-amb:hover { opacity: 1; border-color: rgba(0,0,0,.34); }
.baikal-amb:active { transform: scale(.97); }
.baikal-amb:focus-visible { outline: 2px solid #111; outline-offset: 3px; }

/* 按钮内部 */
.baikal-amb__icon { width: 15px; height: 15px; flex: 0 0 auto; display: block; }
.baikal-amb__label { white-space: nowrap; }

/* 播放中的律动小点（安静，不抢眼） */
.baikal-amb__bars { display: none; align-items: flex-end; gap: 2px; height: 11px; }
.baikal-amb__bars i {
  display: block; width: 2px; background: #111; border-radius: 1px;
  animation: amb-bounce 1.15s ease-in-out infinite;
}
.baikal-amb__bars i:nth-child(2) { animation-delay: .19s; }
.baikal-amb__bars i:nth-child(3) { animation-delay: .38s; }
.baikal-amb__bars i:nth-child(4) { animation-delay: .57s; }
.baikal-amb.is-playing .baikal-amb__bars { display: flex; }
.baikal-amb.is-playing .baikal-amb__label { opacity: .55; }
@keyframes amb-bounce {
  0%, 100% { height: 3px; }
  50%      { height: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .baikal-amb__bars i { animation: none; height: 6px; }
}

/* 移动端：缩小、靠边、避开拇指区 */
@media (max-width: 640px) {
  .baikal-amb { left: 14px; bottom: 14px; padding: 8px 12px 8px 10px; font-size: 10px; letter-spacing: 1.5px; }
  .baikal-amb__label { display: none; }   /* 手机只留图标，省地方 */
}