Programming Nearest neighbor Sprites scaling

[F-00]

Have you ever thought that the sprites on Showdown looked a bit too blurry and that 100% zoom was too small, and found 200% zoom to be too big?
if that applies to you, then this is what you are looking for!

this simple UserScript makes the Pokémon sprites during battle use Nearest neighbor scaling!

Here's a few screenshots to compare (before and after):
(all of the screenshots are taken on a 1920x1080 display at 175% zoom)

here's the UserScript:
in order to use it you'll need either Violentmonkey or Tampermonkey installed on your browser.

UserScript

// ==UserScript==
// @name         Showdown pixelated render
// @description Applies Nearest neighbor scaling to Pokémon sprites
// @version       1.0
// @match        *pokemonshowdown.com/*
// @match        *replay.pokemonshowdown.com/*
// @match        *psim.us/*
// @match        ps.*
// @author       F-00
// @source      https://www.smogon.com/forums/threads/nearest-neighbor-sprites-scaling.3772597/
// @icon          https://play.pokemonshowdown.com/favicon.ico
// @run-at       document-end
// ==/UserScript==

(() => {
  const applyStyles = () => {
    // Background images
    document.querySelectorAll('*').forEach(el => {
      const bg = getComputedStyle(el).backgroundImage;

      if (bg.includes('/sprites/types/')) {
        el.style.imageRendering = 'auto';
      } else if (bg.includes('/sprites/')) {
        el.style.imageRendering = 'crisp-edges';
      }
    });

    // <img> elements
    document.querySelectorAll('img[src*="/sprites/"]').forEach(img => {
      if (img.src.includes('/sprites/types/')) {
        img.style.imageRendering = 'auto';
      } else {
        img.style.imageRendering = 'pixelated';
      }
    });
  };

  applyStyles();
  new MutationObserver(applyStyles).observe(document.body, { childList: true, subtree: true });
})();

enjoy!
(shamelessly made using ChatGPT)