/* 全驱数字人 · 「直接录一段」录音控件
   为什么独立成文件：style.css 是全站公共文件，多会话并发改它的风险远大于收益。
   本文件在 index.html 里**排在 style.css 之后**加载，同特异性时后出现者胜出。
   🔴 .fa-rec-ing 用了 display:flex → 必须补 [hidden] 兜底，否则 hidden 属性会被盖掉（本项目老坑）。 */

.fa-rec-ing {
  border: 1px solid rgba(226, 75, 74, .3);
  background: #FFF7F7;
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.fa-rec-ing[hidden] { display: none !important; }

.fa-rec-hd { display: flex; align-items: center; gap: 10px; }

.fa-rec-live {
  width: 9px; height: 9px; border-radius: 50%;
  background: #E24B4A; flex: none;
  animation: faRecBlink 1.1s ease-in-out infinite;
}
@keyframes faRecBlink { 0%, 100% { opacity: 1; } 50% { opacity: .22; } }
@media (prefers-reduced-motion: reduce) { .fa-rec-live { animation: none; } }

.fa-rec-time {
  font-variant-numeric: tabular-nums;
  font-size: 15px;
  font-weight: 500;
  color: #A32D2D;
  min-width: 44px;
}

.fa-rec-wave {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 28px;
  flex: 1;
}
.fa-rec-wave i {
  display: block;
  width: 4px;
  height: 6px;
  border-radius: 2px;
  background: #E24B4A;
  opacity: .7;
  transition: height .08s linear;
}

.fa-rec-ing .fa-mini { width: 100%; }

.fa-or {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 10px;
  color: #888780;
  font-size: 12px;
}
.fa-or::before, .fa-or::after {
  content: '';
  flex: 1;
  height: 0.5px;
  background: rgba(0, 0, 0, .12);
}