.resultActions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.answerCard { padding: 18px; margin-bottom: 12px; }
.answerHeading { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #d1b179; font-size: 13px; }
.answerCard h2 { margin: 10px 0 8px; font-size: 21px; }
.answerCard > p { margin: 0; white-space: pre-wrap; line-height: 1.7; }
.confidence { padding: 5px 8px; border-radius: 999px; background: #183657; color: #dce8f4; font-size: 11px; }
.confidence.high { background: #173e31; color: #a8ebc8; }
.confidence.medium { background: #4a3719; color: #ffe0a2; }
.confidence.low, .confidence.none { background: #4b2529; color: #ffc2c7; }
.followUp { margin-top: 12px; padding: 10px 12px; border-left: 3px solid #d1b179; background: rgba(209,177,121,.08); color: #cbd4df; font-size: 13px; line-height: 1.6; }
.feedbackActions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.feedbackActions button { padding: 8px 11px; font-size: 12px; background: #183657; color: #edf3f8; }
.correction { margin-top: 10px; min-height: 82px; }
.feedbackStatus { min-height: 1.4em; margin: 7px 0 0 !important; color: #d1b179; font-size: 12px; }
.sources { margin-top: 10px; }
.sources > summary { cursor: pointer; padding: 14px 16px; border: 1px solid rgba(209,177,121,.24); border-radius: 14px; color: #d1b179; background: rgba(8,22,42,.84); }
.sources[open] > summary { margin-bottom: 10px; }
.context { margin-top: 12px; padding: 10px; border-radius: 10px; background: #061426; color: #aeb9c7; }
.context strong { color: #d1b179; font-size: 12px; }
.context p { margin: 6px 0 0; font-size: 12px; line-height: 1.55; }

.stopSpeech:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.digitalHuman {
  position: relative;
  width: 92px;
  height: 112px;
  overflow: hidden;
  border: 1px solid rgba(209, 177, 121, .5);
  border-radius: 18px;
  background: #07111f;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .3);
}

.digitalHuman img,
.digitalHuman video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 28%;
}

.digitalHuman video {
  position: absolute;
  inset: 0;
  opacity: 0;
}

.digitalHuman.speaking video { opacity: 1; }
.digitalHuman.speaking img { opacity: 0; }

.avatarLive {
  position: absolute;
  right: 5px;
  bottom: 5px;
  z-index: 3;
  padding: 3px 5px;
  border-radius: 6px;
  background: rgba(3, 10, 20, .78);
  color: #ead4aa;
  font-size: 9px;
  line-height: 1;
}

.humanHalo {
  position: absolute;
  width: 64px;
  height: 64px;
  border: 1px solid rgba(209, 177, 121, .45);
  border-radius: 50%;
  box-shadow: 0 0 22px rgba(209, 177, 121, .2);
}

.humanHead {
  position: absolute;
  top: 7px;
  width: 39px;
  height: 44px;
  border-radius: 46% 46% 44% 44%;
  background: linear-gradient(155deg, #e2c49a, #9b6f49);
  box-shadow: inset -5px -5px 10px rgba(38, 24, 15, .28);
  z-index: 2;
}

.eye {
  position: absolute;
  top: 17px;
  width: 3px;
  height: 3px;
  background: #132136;
  border-radius: 50%;
}

.eye.left { left: 10px; }
.eye.right { right: 10px; }

.mouth {
  position: absolute;
  left: 15px;
  bottom: 9px;
  width: 10px;
  height: 2px;
  border-radius: 0 0 8px 8px;
  background: #4d211d;
}

.humanBody {
  position: absolute;
  bottom: 1px;
  width: 58px;
  height: 34px;
  border: 1px solid rgba(209, 177, 121, .35);
  border-radius: 28px 28px 10px 10px;
  background: linear-gradient(145deg, #173b63, #08172c);
}

.voiceWave {
  position: absolute;
  right: 0;
  width: 5px;
  border-radius: 4px;
  background: #d1b179;
  opacity: .25;
}

.w1 { height: 15px; }
.w2 { right: -7px; height: 27px; }
.w3 { right: -14px; height: 39px; }
.digitalHuman.speaking .mouth { animation: talk .22s infinite alternate; }
.digitalHuman.speaking .eye { animation: blink 2.4s infinite; }
.digitalHuman.speaking .voiceWave { animation: wave .65s infinite alternate; }
.digitalHuman.speaking .w2 { animation-delay: .14s; }
.digitalHuman.speaking .w3 { animation-delay: .28s; }

@keyframes talk {
  to { height: 8px; transform: translateY(3px); }
}

@keyframes blink {
  0%, 94%, 100% { transform: scaleY(1); }
  96% { transform: scaleY(.15); }
}

@keyframes wave {
  to { opacity: 1; transform: scaleY(.45); }
}
