diff --git a/web/logic/interactive.py b/web/logic/interactive.py
index 89881a3..077844b 100644
--- a/web/logic/interactive.py
+++ b/web/logic/interactive.py
@@ -31,6 +31,12 @@ class BridgeHandler(http.server.SimpleHTTPRequestHandler):
           # Read last 50 lines for better context during errors
           self.wfile.write("".join(f.readlines()[-50:]).encode())
       return
+
+    # Restrict static file access to specific directories only
+    if not any(self.path.startswith(prefix) for prefix in ['/pages', '/media']):
+        self.send_error(403, "Access Denied: Resource is restricted.")
+        return
+
     return http.server.SimpleHTTPRequestHandler.do_GET(self)
 
   def do_POST(self):
diff --git a/web/pages/configuration.html b/web/pages/configuration.html
index 4b9e17f..c12eb32 100644
--- a/web/pages/configuration.html
+++ b/web/pages/configuration.html
@@ -13,7 +13,7 @@
     <!-- Material Design Icons -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@7.4.47/css/materialdesignicons.min.css">
     <!-- Favicon -->
-    <link rel="icon" href="../media/favicon.ico" type="image/x-icon">
+    <link rel="icon" href="/media/favicon.ico" type="image/x-icon">
 </head>
 
 
@@ -36,7 +36,7 @@
   <nav class="bg-[#1e293b] border border-slate-700 rounded-2xl relative">
     <div class="mx-auto relative flex h-16 items-center justify-between">
       <div class="absolute inset-y-0 left-0 flex items-center">
-        <a href="https://numbus.eu"><img class="w-auto h-10 pr-5 pl-8" src="../media/logo.png" aria-label="The numbus logo"></a>
+        <a href="https://numbus.eu"><img class="w-auto h-10 pr-5 pl-8" src="/media/logo.png" aria-label="The numbus logo"></a>
         <a class="font-bold text-2xl tracking-tight bg-gradient-to-r from-sky-400 to-fuchsia-500 bg-clip-text text-transparent uppercase" href="https://numbus.eu">NUMBUS</a>
       </div>
       <div class="flex flex-1 items-center justify-center">
@@ -70,21 +70,21 @@
           </div>
         </button>
         <button class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left bg-slate-900 border-slate-700 hover:bg-fuchsia-600/20 hover:border-fuchsia-500 focus:bg-fuchsia-600/20 focus:border-fuchsia-500">
-          <img class="w-12 h-12 flex-shrink-0" src="../media/light/numbus-backup-server-light.svg" alt="Numbus Server icon">
+          <img class="w-12 h-12 flex-shrink-0" src="/media/light/numbus-backup-server-light.svg" alt="Numbus Server icon">
           <div> 
             <h1 class="font-bold text-2xl mb-1">Numbus Backup Server</h1>
             <p class="text-sm transition-colors">Backup all Numbus devices and monitor your servers.</p>
           </div>
         </button>
         <button class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left bg-slate-900 border-slate-700 hover:bg-fuchsia-600/20 hover:border-fuchsia-500 focus:bg-fuchsia-600/20 focus:border-fuchsia-500">
-          <img class="w-12 h-12 flex-shrink-0" src="../media/light/numbus-computer-light.svg" alt="Numbus Server icon">
+          <img class="w-12 h-12 flex-shrink-0" src="/media/light/numbus-computer-light.svg" alt="Numbus Server icon">
           <div> 
             <h1 class="font-bold text-2xl mb-1">Numbus Computer</h1>
             <p class="text-sm transition-colors">Backup all Numbus devices and monitor your servers.</p>
           </div>
         </button>
         <button class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left bg-slate-900 border-slate-700 hover:bg-fuchsia-600/20 hover:border-fuchsia-500 focus:bg-fuchsia-600/20 focus:border-fuchsia-500">
-          <img class="w-12 h-12 flex-shrink-0" src="../media/light/numbus-tv-light.svg" alt="Numbus Server icon">
+          <img class="w-12 h-12 flex-shrink-0" src="/media/light/numbus-tv-light.svg" alt="Numbus Server icon">
           <div> 
             <h1 class="font-bold text-2xl mb-1">Numbus TV</h1>
             <p class="text-sm transition-colors">Your TV, your way. No spying on you.</p>
diff --git a/web/pages/index.html b/web/pages/index.html
index 4c81cbf..da0b3d0 100644
--- a/web/pages/index.html
+++ b/web/pages/index.html
@@ -12,7 +12,7 @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/js-yaml/4.1.0/js-yaml.min.js"></script>
     <!-- Material Design Icons -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@7.4.47/css/materialdesignicons.min.css">
-    <link rel="icon" href="../media/favicon.ico" type="image/x-icon">
+    <link rel="icon" href="/media/favicon.ico" type="image/x-icon">
 </head>
 
 <style>
@@ -41,7 +41,7 @@
     </div>
 
       <span class="animate-pulse-slow drop-shadow-2xl p-12">
-        <a class="text-shadow-glow px-10 py-4 bg-fuchsia-600 hover:bg-fuchsia-500 rounded-full text-xl font-bold transition-all transform hover:scale-105 shadow-lg shadow-fuchsia-600/20" href="./preparation.html">Get Started</a>
+        <a class="text-shadow-glow px-10 py-4 bg-fuchsia-600 hover:bg-fuchsia-500 rounded-full text-xl font-bold transition-all transform hover:scale-105 shadow-lg shadow-fuchsia-600/20" href="/pages/preparation.html">Get Started</a>
       </span>
   </div>
 
diff --git a/web/pages/preparation.html b/web/pages/preparation.html
index dad8682..e5fe3c6 100644
--- a/web/pages/preparation.html
+++ b/web/pages/preparation.html
@@ -13,7 +13,7 @@
     <!-- Material Design Icons -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@7.4.47/css/materialdesignicons.min.css">
     <!-- Favicon -->
-    <link rel="icon" href="../media/favicon.ico" type="image/x-icon">
+    <link rel="icon" href="/media/favicon.ico" type="image/x-icon">
 </head>
 
 <body x-data="numbusPreparation()" class="p-4 bg-[#0f172a] text-slate-100 min-h-screen font-sans selection:bg-fuchsia-500/30">
@@ -61,7 +61,7 @@
   <nav class="bg-[#1e293b] border border-slate-700 rounded-2xl relative">
     <div class="mx-auto relative flex h-16 items-center justify-between">
       <div class="absolute inset-y-0 left-0 flex items-center">
-        <a href="https://numbus.eu"><img class="w-auto h-10 pr-5 pl-8" src="../media/logo.png" aria-label="The numbus logo"></a>
+        <a href="https://numbus.eu"><img class="w-auto h-10 pr-5 pl-8" src="/media/logo.png" aria-label="The numbus logo"></a>
         <a class="font-bold text-2xl tracking-tight bg-gradient-to-r from-sky-400 to-fuchsia-500 bg-clip-text text-transparent uppercase" href="https://numbus.eu">NUMBUS</a>
       </div>
       <div class="flex flex-1 items-center justify-center">