diff --git a/src/pages/index.astro b/src/pages/index.astro
index b6e42d6..545d34b 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -279,12 +279,18 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
     // Set up the canvas when the DOM loads
     document.addEventListener('DOMContentLoaded', () => {
       const canvas = document.getElementById('matrix-animation');
-      const ctx = canvas.getContext('2d');
+      if (!canvas) {
+        console.error('Canvas element not found');
+        return;
+      }
+      const ctx = (canvas as HTMLCanvasElement).getContext('2d');
       
       // Set canvas dimensions to match the viewport
       function resizeCanvas() {
-        canvas.width = window.innerWidth;
-        canvas.height = window.innerHeight;
+        if (canvas) {
+          (canvas as HTMLCanvasElement).width = window.innerWidth;
+          (canvas as HTMLCanvasElement).height = window.innerHeight;
+        }
       }
       
       resizeCanvas();
@@ -293,10 +299,10 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
       // Characters to display
       const chars = "SILICONPIN HOSTINNG";
       const charSize = 14;
-      const columns = canvas.width / charSize;
+      const columns = (canvas as HTMLCanvasElement).width / charSize;
       
       // Array to track the y position of each column
-      const drops = [];
+      const drops: number[] = [];
       for (let i = 0; i < columns; i++) {
         drops[i] = Math.random() * -100;
       }
@@ -304,8 +310,14 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
       // Draw function
       function draw() {
         // Semi-transparent black to create trail effect
+        if (!ctx) {
+          console.error('Canvas rendering context is null');
+          return;
+        }
         ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
-        ctx.fillRect(0, 0, canvas.width, canvas.height);
+        if (canvas) {
+          ctx.fillRect(0, 0, (canvas as HTMLCanvasElement).width, (canvas as HTMLCanvasElement).height);
+        }
         
         // Set text color
         ctx.fillStyle = "#6d9e37";
@@ -329,7 +341,7 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
           drops[i]++;
           
           // Randomly reset a column when it's past the screen
-          if (drops[i] * charSize > canvas.height && Math.random() > 0.975) {
+          if (canvas && drops[i] * charSize > (canvas as HTMLCanvasElement).height && Math.random() > 0.975) {
             drops[i] = 0;
           }
         }