/* The 3D guide canvas fades in once it is ready. The SVG figure is only a fallback. */
[data-renderer] {
  isolation: isolate;
}
.exercise-art .figure,
.welcome-art .figure {
  position: relative;
}
[data-renderer] > .guide-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.guide-ready > .guide-canvas {
  opacity: 1;
}
.guide-cut > .guide-canvas {
  opacity: 0;
  transition: none;
}
.figure > .guide-still {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (prefers-reduced-motion: reduce) {
  [data-renderer] > .guide-canvas {
    transition: none;
  }
}
