created energy and set component (a la rarity) and added to CardModal.astro

src/components/EnergyIcon.astro

@@ -0,0 +1,33 @@
+---
+import grass from "/src/svg/energy/grass.svg?raw";
+import fairy from "/src/svg/energy/fairy.svg?raw";
+import dark from "/src/svg/energy/dark.svg?raw";
+import dragon from "/src/svg/energy/dragon.svg?raw";
+import fire from "/src/svg/energy/fire.svg?raw";
+import water from "/src/svg/energy/water.svg?raw";
+import electric from "/src/svg/energy/electric.svg?raw";
+import steel from "/src/svg/energy/steel.svg?raw";
+import colorless from "/src/svg/energy/colorless.svg?raw";
+import fighting from "/src/svg/energy/fighting.svg?raw";
+import psychic from "/src/svg/energy/psychic.svg?raw";
+
+const { energy } = Astro.props;
+
+const energyMap = {
+  "Grass": grass,
+  "Fairy": fairy,
+  "Dark": dark,
+  "Dragon": dragon,
+  "Fire": fire,
+  "Water": water,
+  "Steel": steel,
+  "Colorless": colorless,
+  "Fighting": fighting,
+  "Psychic": psychic,
+  "Electric": electric,
+};
+
+const svg = energyMap[energy as keyof typeof energyMap] ?? "";
+---
+
+<div class="energy-icon shadow-filter" set:html={svg}></div>