/* Perpkin 8-bit FX (see px-fx.js) */
.oven-fit { position: relative; }
.px-steam { position: absolute; left: 0; width: 100%; top: -38%; height: 75%; pointer-events: none; image-rendering: pixelated; image-rendering: crisp-edges; z-index: 4; }
.pie .steam { display: none; } /* replaced by the pixel steam canvas */
.pie.px-shiver { animation: pxShiver 0.5s steps(1) 1; }
.pie.px-shake { animation: pxShake 1.1s steps(1) 1; }
@keyframes pxShiver {
  0% { translate: 0 0; } 20% { translate: 2px 0; } 40% { translate: -2px 0; } 60% { translate: 2px 0; } 80% { translate: 0 0; }
}
@keyframes pxShake {
  0% { translate: 0 0; } 8% { translate: 4px -2px; } 16% { translate: -4px 2px; } 24% { translate: 4px 2px; } 32% { translate: -4px -2px; }
  40% { translate: 2px 0; } 50% { translate: -2px 0; } 60% { translate: 2px 2px; } 70% { translate: -2px 0; } 80% { translate: 0 2px; } 100% { translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .px-steam { display: none; }
  .pie.px-shiver, .pie.px-shake { animation: none; }
}
