/* Only JavaScript-enhanced figures get a state layer; no-JS images stay visible. */
body.research-ui .research-media-frame { position: relative; }
body.research-ui .research-media-frame > img[data-research-media] { transition: opacity .22s ease; }
body.research-ui .research-media-frame[data-media-state="loading"] > img[data-research-media],
body.research-ui .research-media-frame[data-media-state="slow"] > img[data-research-media],
body.research-ui .research-media-frame[data-media-state="error"] > img[data-research-media] { opacity: 0; }
body.research-ui .research-media-state {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 7px; padding: 18px;
  color: var(--brand, #0c4578); background: #f5f8fd; text-align: center;
  pointer-events: auto; border-radius: inherit; overflow: hidden;
}
body.research-ui .research-media-state[hidden],
body.research-ui .research-media-state [hidden] { display: none !important; }
body.research-ui .research-media-state strong {
  font: 550 12px/1.4 var(--sans, sans-serif); letter-spacing: -.1px;
}
body.research-ui .research-media-note {
  max-width: 30ch; color: #72829a; font: 10px/1.6 var(--sans, sans-serif);
}
body.research-ui .research-media-progress { display: flex; gap: 4px; height: 21px; align-items: center; margin-bottom: 5px; }
body.research-ui .research-media-progress i {
  display: block; width: 4px; height: 14px; border-radius: 3px; background: #91abd0;
  animation: research-media-wait 1.25s ease-in-out infinite;
}
body.research-ui .research-media-progress i:nth-child(2) { animation-delay: .14s; background: #718bc2; }
body.research-ui .research-media-progress i:nth-child(3) { animation-delay: .28s; background: #6366f1; }
body.research-ui .research-media-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin-top: 4px; font: 500 10px/1.5 var(--sans, sans-serif); }
body.research-ui .research-media-retry {
  appearance: none; background: #fff; color: var(--brand, #0c4578); border: 1px solid #ccd9ed;
  border-radius: 5px; min-height: 32px; padding: 5px 10px; font: inherit; cursor: pointer;
}
body.research-ui .research-media-actions a { color: var(--brand, #0c4578); text-decoration: underline; text-underline-offset: 3px; }
body.research-ui figure.research-media-frame[data-media-state="loading"],
body.research-ui figure.research-media-frame[data-media-state="slow"],
body.research-ui figure.research-media-frame[data-media-state="error"] { min-height: 210px; }
body.research-ui figure.research-media-frame[data-media-state="loading"] > img[data-research-media],
body.research-ui figure.research-media-frame[data-media-state="slow"] > img[data-research-media],
body.research-ui figure.research-media-frame[data-media-state="error"] > img[data-research-media] { min-height: 210px; }
body.research-ui figure.research-media-frame .research-media-state { inset: 0 0 auto; min-height: 210px; }
body.research-ui figure.research-media-frame > figcaption { position: relative; z-index: 1; }
@keyframes research-media-wait { 0%, 100% { transform: scaleY(.55); opacity: .55; } 50% { transform: scaleY(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  body.research-ui .research-media-progress i { animation: none; }
  body.research-ui .research-media-frame > img[data-research-media] { transition: none; }
}