Fix: crop transparent padding from fade flags

The fade flag images are 2:1 but the flag only fills the left part, with the rest transparent. That made `cover` + `center` in the tech tree node crop and offset the visible flag.

- Trim the transparent border from the fade flag in the `/flags/fade/[id].webp` route using `sharp`
- Revert the tech tree node back to `cover` + `center`, since the image is now just the flag

packages/website/src/pages/[...chunk_api]/flags/fade/[id].webp.ts

@@ -1,3 +1,4 @@
+import sharp from "sharp";
 import type { APIContext, GetStaticPathsItem } from "astro";
 import { mixStaticPaths } from "../../../../core/blitzkit/mixStaticPaths";
 import { vfs } from "../../../../core/blitzkit/vfs";
@@ -29,7 +30,10 @@ export const getStaticPaths = mixStaticPaths(_getStaticPaths, async () => {
 });
 
 export async function GET({ props }: APIContext<{ path: string }>) {
-  const bytes = new Uint8Array(await vfs.file(props.path));
+  const bytes = await sharp(new Uint8Array(await vfs.file(props.path)))
+    .trim({ background: { r: 0, g: 0, b: 0, alpha: 0 }, threshold: 1 })
+    .webp()
+    .toBuffer();
 
-  return new Response(bytes);
+  return new Response(new Uint8Array(bytes));
 }