/* Saw spinning animation, reduced motion aware */
@media (prefers-reduced-motion: no-preference){
  .saw.spin { animation: spin linear both; animation-timeline: scroll(root block); animation-range: 0 100%; }
  @keyframes spin {
    from { transform: translateX(0) rotate(0deg); }
    to { transform: translateX(80vw) rotate(1440deg); }
  }
}

/* Saw flight: fixed, over content */
.saw-launchpad{
  position: fixed;
  top: 16px;
  left: -120px;            /* start just off-screen */
  z-index: 9999;
  pointer-events: none;
}
.saw{ width: 72px; height: 72px; opacity: 0; }

/* Reduced motion: show static blade, no flight */
@media (prefers-reduced-motion: reduce){
  .saw{ opacity: .85; }
}

/* Animate only when class is applied by JS */
@media (prefers-reduced-motion: no-preference){
  .saw.run{
    animation: saw-flight 2.8s linear forwards;
    opacity: 1;
  }
}

/* One keyframe handles both movement and spin */
@keyframes saw-flight{
  from { transform: translateX(0) rotate(0deg); }
  to   { transform: translateX(calc(100vw + 240px)) rotate(1080deg); }
}