/* KIMA Academy — Page loader
   Two rotating arc rings around the KIMA node mark. Shown immediately on
   load, hidden once the page (and its images) finish loading. */

#kima-loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #F9FAFB;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
#kima-loader.kima-loader--hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#kima-loader .kima-loader-rings {
  position: relative;
  width: 220px;
  height: 220px;
}
#kima-loader .kima-loader-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
}
#kima-loader .kima-loader-ring svg {
  width: 100%;
  height: 100%;
  display: block;
}
#kima-loader .kima-loader-ring--outer {
  animation: kima-loader-spin 2.4s linear infinite;
}
#kima-loader .kima-loader-ring--inner {
  animation: kima-loader-spin-rev 1.8s linear infinite;
}
#kima-loader .kima-loader-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 92px;
  height: 92px;
}
@keyframes kima-loader-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes kima-loader-spin-rev {
  from { transform: rotate(0deg); }
  to   { transform: rotate(-360deg); }
}
@media (prefers-reduced-motion: reduce) {
  #kima-loader .kima-loader-ring--outer,
  #kima-loader .kima-loader-ring--inner {
    animation-duration: 6s;
  }
}