/* Repeat in the open dialog's top layer so feedback remains visible there. */
.is-loading body::before,
.is-loading dialog[open]::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  z-index: 10000;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, #a0845d 25%, #cdb478 80%, transparent);
  background-size: 35% 100%;
  background-repeat: no-repeat;
  animation: loading-line 650ms ease-in-out infinite;
}

@keyframes loading-line {
  from { background-position: -54% 0; }
  to { background-position: 154% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .is-loading body::before,
  .is-loading dialog[open]::after {
    width: 100%;
    background: #a0845d;
    animation: none;
  }
}