/* Final interview avatar lock.
   This file is loaded after all legacy overrides so portrait frames cannot drift. */
html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interview-training-avatar {
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  min-height: 72px !important;
  max-width: 72px !important;
  max-height: 72px !important;
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background-color: #e9e4ff !important;
  background-size: 108% 108% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  flex: 0 0 72px !important;
  transform: none !important;
}

html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interview-training-avatar-img {
  position: absolute !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 999px !important;
  transform: none !important;
  margin: 0 !important;
}

html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interviewer-question-avatar,
html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interview-question-avatar,
html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interviewer-avatar {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background-color: #e9e4ff !important;
  background-position: center center !important;
  background-size: cover !important;
  transform: none !important;
}

html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interviewer-question-avatar img,
html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interview-question-avatar img,
html:not(.react-student-embedded) :is(body[data-active-panel="interview"], body:has(.panel[data-panel="interview"].active)) .interviewer-avatar img {
  position: absolute !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 999px !important;
  margin: 0 !important;
}