/* GRAVE background family. Two transparent SVG masks, no layout or input effects. */
.grave-sigil {
  position: relative;
  display: block;
  width: var(--sigil-size, 40rem);
  max-width: none;
  aspect-ratio: 1;
  color: var(--sigil-ink, #b79c93);
  opacity: var(--sigil-opacity, .13);
  pointer-events: none;
  user-select: none;
  contain: layout paint;
  --sigil-art: url("./assets/sigils/orbit.svg");
  --sigil-rim: url("./assets/sigils/rims/orbit.svg");
}
.grave-sigil::before, .grave-sigil::after {
  content: "";
  position: absolute;
  inset: 0;
  background: currentColor;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  transform-origin: center;
  animation: grave-sigil-turn var(--sigil-speed, 180s) linear infinite;
  animation-delay: var(--sigil-phase, 0s);
}
.grave-sigil::before {
  -webkit-mask-image: var(--sigil-rim);
  mask-image: var(--sigil-rim);
}
.grave-sigil::after {
  -webkit-mask-image: var(--sigil-art);
  mask-image: var(--sigil-art);
  animation-duration: calc(var(--sigil-speed, 180s) * .72);
  animation-direction: reverse;
}
.grave-sigil[data-sigil="vesica"] { --sigil-art: url("./assets/sigils/vesica.svg"); --sigil-rim: url("./assets/sigils/rims/vesica.svg"); }
.grave-sigil[data-sigil="compass"] { --sigil-art: url("./assets/sigils/compass.svg"); --sigil-rim: url("./assets/sigils/rims/compass.svg"); }
.grave-sigil[data-sigil="eclipse"] { --sigil-art: url("./assets/sigils/eclipse.svg"); --sigil-rim: url("./assets/sigils/rims/eclipse.svg"); }
.grave-sigil[data-sigil="ember"] { --sigil-art: url("./assets/sigils/ember.svg"); --sigil-rim: url("./assets/sigils/rims/ember.svg"); }
.grave-sigil[data-sigil="seed"] { --sigil-art: url("./assets/sigils/seed.svg"); --sigil-rim: url("./assets/sigils/rims/seed.svg"); }
.grave-sigil[data-sigil="halo"] { --sigil-art: url("./assets/sigils/halo.svg"); --sigil-rim: url("./assets/sigils/rims/halo.svg"); }
.grave-sigil[data-sigil-still],
[data-sigil-motion="paused"] .grave-sigil,
[data-sigil-document="hidden"] .grave-sigil,
.grave-sigil[data-sigil-in-view="false"] { --sigil-play-state: paused; }
.grave-sigil::before, .grave-sigil::after { animation-play-state: var(--sigil-play-state, running); }
@keyframes grave-sigil-turn { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .grave-sigil::before, .grave-sigil::after { animation: none !important; }
}
@media print { .grave-sigil { display: none !important; } }
