/* HR Navigation 2.4.5: Progressive media loading, entirely decorative.
   No content is hidden and missing images never keep a loading animation. */
.hrnav-media-pending{
  --hrnav-skeleton-base:#eceef1;--hrnav-skeleton-glint:#f9fafb;
  background:linear-gradient(100deg,var(--hrnav-skeleton-base) 10%,var(--hrnav-skeleton-glint) 42%,var(--hrnav-skeleton-base) 74%)!important;
  background-size:220% 100%!important;
  animation:hrnav-media-shimmer 1.35s ease-in-out infinite;
}
.hrnav-shimmer-host{position:relative;isolation:isolate}
.hrnav-shimmer-host.hrnav-shimmer-pending::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(100deg,var(--hrnav-skeleton-base,#eceef1) 10%,var(--hrnav-skeleton-glint,#f9fafb) 42%,var(--hrnav-skeleton-base,#eceef1) 74%);
  background-size:220% 100%;animation:hrnav-media-shimmer 1.35s ease-in-out infinite;
}
html[data-reader-theme="dark"] .hrnav-shimmer-host,
html[data-reader-theme="dark"] .hrnav-media-pending,
:root[data-hr-theme="dark"] .hrnav-shimmer-host,
:root[data-hr-theme="dark"] .hrnav-media-pending{
  --hrnav-skeleton-base:#253244;--hrnav-skeleton-glint:#34455a;
}
@media(prefers-color-scheme:dark){
  html[data-reader-theme="system"] .hrnav-shimmer-host,
  html[data-reader-theme="system"] .hrnav-media-pending{--hrnav-skeleton-base:#253244;--hrnav-skeleton-glint:#34455a}
}
@keyframes hrnav-media-shimmer{to{background-position-x:-220%}}
@media(prefers-reduced-motion:reduce){
  .hrnav-shimmer-host.hrnav-shimmer-pending::after,.hrnav-media-pending{animation:none!important}
}
html[data-reader-motion="reduce"] .hrnav-shimmer-host.hrnav-shimmer-pending::after,
html[data-reader-motion="reduce"] .hrnav-media-pending{animation:none!important}