/* Unicorn brand loader — shown on the first page view of a session only.
   Pure CSS on <html> pseudo-elements so it paints on the first frame with no
   extra markup; assets/js/loader.js adds/removes the classes. */
html.ud-loading::before,
html.ud-loading::after {
  content: "";
  position: fixed;
  z-index: 2147483000;
  transition: opacity 320ms ease;
  pointer-events: none;
}
html.ud-loading::before {
  inset: 0;
  background-color: #fff;
  background-image: url("/assets/brand/optimized/uniydesignz-unicorn-192.png");
  background-image: image-set(
    url("/assets/brand/optimized/uniydesignz-unicorn-384.webp") type("image/webp"),
    url("/assets/brand/optimized/uniydesignz-unicorn-192.png") type("image/png")
  );
  background-repeat: no-repeat;
  background-position: center calc(50% - 20px);
  background-size: 128px 128px;
  pointer-events: auto;
}
/* Indeterminate progress: a soft gold segment gliding along a hairline track. */
html.ud-loading::after {
  top: calc(50% + 68px);
  left: 50%;
  width: 144px;
  height: 2px;
  margin-left: -72px;
  border-radius: 2px;
  background:
    linear-gradient(90deg, transparent, #C68A36 40%, #E3C08C 60%, transparent) no-repeat,
    #EEE9E1;
  background-size: 45% 100%, 100% 100%;
  animation: ud-loader-glide 1.4s cubic-bezier(.45, 0, .55, 1) infinite;
}
html.ud-loaded::before,
html.ud-loaded::after { opacity: 0; }

@keyframes ud-loader-glide {
  0%   { background-position: -120% 0, 0 0; }
  100% { background-position: 220% 0, 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.ud-loading::before,
  html.ud-loading::after { transition: none; }
  html.ud-loading::after {
    animation: none;
    background: #C68A36;
    opacity: .55;
  }
}