diff --git a/.gitignore b/.gitignore
index bbe6c45d..22e616b9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -25,3 +25,5 @@ plan.md
 auto_loop.sh
 agentic_security/static/elm-stuff/
 agentic_security/static/node_modules/
+.venv/
+.cache/
diff --git a/agentic_security/routes/static.py b/agentic_security/routes/static.py
index 2abafd94..b5a838e0 100644
--- a/agentic_security/routes/static.py
+++ b/agentic_security/routes/static.py
@@ -115,7 +115,7 @@ async def serve_icon(icon_name: str) -> FileResponse:
 async def proxy_tailwindcss() -> FileResponse:
     """Proxy the Tailwind CSS script."""
     return proxy_external_resource(
-        "https://cdn.tailwindcss.com",
+        "https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4",
         STATIC_DIR / "tailwindcss.js",
         "application/javascript",
     )
diff --git a/agentic_security/static/index.html b/agentic_security/static/index.html
index fcdf046e..48a33fdd 100644
--- a/agentic_security/static/index.html
+++ b/agentic_security/static/index.html
@@ -154,13 +154,13 @@ <h2 class="text-2xl font-bold">LLM API Spec</h2>
 
             <!-- Error and Success Messages -->
             <div v-if="errorMsg"
-              class="bg-dark-accent-red bg-opacity-20 border border-dark-accent-red text-dark-accent-red px-4 py-3 rounded-lg relative"
+              class="bg-dark-accent-red/20 border border-dark-accent-red text-dark-accent-red px-4 py-3 rounded-lg relative"
               role="alert">
               <strong class="font-bold">Oops!</strong>
               <span class="block sm:inline">{{errorMsg}}</span>
             </div>
             <div v-if="okMsg"
-              class="bg-dark-accent-green bg-opacity-20 border border-dark-accent-green text-dark-accent-green px-4 py-3 rounded-lg relative"
+              class="bg-dark-accent-green/20 border border-dark-accent-green text-dark-accent-green px-4 py-3 rounded-lg relative"
               role="alert">
               <strong class="font-bold">></strong>
               <span class="block sm:inline">{{okMsg}}</span>
@@ -172,7 +172,7 @@ <h2 class="text-2xl font-bold">LLM API Spec</h2>
             <section class="flex justify-center space-x-4 mt-10">
               <button
                 @click="verifyIntegration"
-                class="bg-dark-accent-orange text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+                class="bg-dark-accent-orange text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-orange/80 transition-colors">
                 Verify Integration
               </button>
             </section>
@@ -219,7 +219,7 @@ <h2 class="text-2xl font-bold">Parameters</h2>
             <div class="flex items-center justify-end mt-4">
               <button
                 @click="confirmResetState"
-                class="flex items-center bg-dark-accent-red text-dark-bg rounded-lg px-4 py-2 text-sm font-medium hover:bg-opacity-80 transition-colors">
+                class="flex items-center bg-dark-accent-red text-dark-bg rounded-lg px-4 py-2 text-sm font-medium hover:bg-dark-accent-red/80 transition-colors">
                 <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2"
                   fill="none" viewBox="0 0 24 24" stroke="currentColor">
                   <path stroke-linecap="round" stroke-linejoin="round"
@@ -232,7 +232,7 @@ <h2 class="text-2xl font-bold">Parameters</h2>
             <!-- Confirmation Modal -->
             <div
               v-if="showResetConfirmation"
-              class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
+              class="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
               <div class="bg-dark-card rounded-lg p-6 max-w-sm w-full">
                 <h3 class="text-xl font-bold mb-4 text-dark-text">Confirm
                   Reset</h3>
@@ -242,12 +242,12 @@ <h3 class="text-xl font-bold mb-4 text-dark-text">Confirm
                 <div class="flex justify-end space-x-4">
                   <button
                     @click="showResetConfirmation = false"
-                    class="bg-gray-600 text-dark-text rounded-lg px-4 py-2 hover:bg-opacity-80 transition-colors">
+                    class="bg-gray-600 text-dark-text rounded-lg px-4 py-2 hover:bg-gray-600/80 transition-colors">
                     Cancel
                   </button>
                   <button
                     @click="resetState"
-                    class="bg-dark-accent-red text-dark-bg rounded-lg px-4 py-2 hover:bg-opacity-80 transition-colors">
+                    class="bg-dark-accent-red text-dark-bg rounded-lg px-4 py-2 hover:bg-dark-accent-red/80 transition-colors">
                     Reset
                   </button>
                 </div>
@@ -416,7 +416,7 @@ <h3 class="text-lg font-semibold">Enable Many-shot
             @click="package.is_active !== false && addPackage(index)"
             class="border rounded-lg p-3 cursor-pointer transition-all hover:shadow-md overflow-hidden"
             :class="{
-              'border-dark-accent-green bg-dark-accent-green bg-opacity-20': package.selected,
+              'border-dark-accent-green bg-dark-accent-green/20': package.selected,
               'border-gray-600': !package.selected,
               'opacity-30 pointer-events-none cursor-not-allowed': package.is_active === false
             }">
@@ -434,13 +434,13 @@ <h3 class="text-lg font-semibold">Enable Many-shot
 
         <!-- Error and Success Messages -->
         <div v-if="errorMsg"
-          class="bg-dark-accent-red bg-opacity-20 border border-dark-accent-red text-dark-accent-red px-4 py-3 rounded-lg relative"
+          class="bg-dark-accent-red/20 border border-dark-accent-red text-dark-accent-red px-4 py-3 rounded-lg relative"
           role="alert">
           <strong class="font-bold">Oops!</strong>
           <span class="block sm:inline">{{errorMsg}}</span>
         </div>
         <div v-if="okMsg"
-          class="bg-dark-accent-green bg-opacity-20 border border-dark-accent-green text-dark-accent-green px-4 py-3 rounded-lg relative"
+          class="bg-dark-accent-green/20 border border-dark-accent-green text-dark-accent-green px-4 py-3 rounded-lg relative"
           role="alert">
           <strong class="font-bold">></strong>
           <span class="block sm:inline">{{okMsg}}</span>
@@ -452,13 +452,13 @@ <h3 class="text-lg font-semibold">Enable Many-shot
         <section class="flex justify-center space-x-4">
           <button
             @click="verifyIntegration"
-            class="bg-dark-accent-orange text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+            class="bg-dark-accent-orange text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-orange/80 transition-colors">
             Verify Integration
           </button>
           <button
             @click="startScan"
             v-if="!scanRunning"
-            class="bg-dark-accent-green text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors flex items-center">
+            class="bg-dark-accent-green text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-green/80 transition-colors flex items-center">
             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
               viewBox="0 0 24 24" fill="none" stroke="currentColor"
               stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
@@ -468,7 +468,7 @@ <h3 class="text-lg font-semibold">Enable Many-shot
           <button
             @click="stopScan"
             v-if="scanRunning"
-            class="bg-dark-accent-red text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors flex items-center">
+            class="bg-dark-accent-red text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-red/80 transition-colors flex items-center">
             <!-- Stop Icon -->
             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
               viewBox="0 0 24 24" fill="none" stroke="currentColor"
@@ -519,7 +519,7 @@ <h2 class="text-2xl font-bold mb-4">Scan Results</h2>
         <!-- Download Button -->
         <button
           @click="downloadFailures"
-          class="bg-dark-accent-yellow text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+          class="bg-dark-accent-yellow text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-yellow/80 transition-colors">
           Download failures
         </button>
 
@@ -547,7 +547,7 @@ <h2 class="text-2xl font-bold">Logs</h2>
                 Math.min(logs.length, maxDisplayedLogs) }} of {{ logs.length }}
                 logs</span>
               <button @click="downloadLogs"
-                class="bg-dark-accent-green text-dark-bg rounded-lg px-4 py-2 text-sm font-medium hover:bg-opacity-80 transition-colors">
+                class="bg-dark-accent-green text-dark-bg rounded-lg px-4 py-2 text-sm font-medium hover:bg-dark-accent-green/80 transition-colors">
                 Download Logs
               </button>
             </div>
diff --git a/agentic_security/static/partials/concent.html b/agentic_security/static/partials/concent.html
index 5f938953..4e4313c6 100644
--- a/agentic_security/static/partials/concent.html
+++ b/agentic_security/static/partials/concent.html
@@ -1,5 +1,5 @@
  <div id="consent-modal" v-if="showConsentModal"
-    class="fixed inset-0 bg-black bg-opacity-75 flex justify-center items-center z-50">
+    class="fixed inset-0 bg-black/75 flex justify-center items-center z-50">
     <div
         class="bg-dark-card text-dark-text p-8 rounded-xl shadow-2xl max-w-xl w-full">
         <h2 class="text-2xl font-bold mb-6 text-center">AI Red Team Ethical
@@ -54,12 +54,12 @@ <h2 class="text-2xl font-bold mb-6 text-center">AI Red Team Ethical
         <div class="flex justify-center space-x-4 mt-8">
             <button
                 @click="declineConsent"
-                class="bg-dark-accent-red text-white rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+                class="bg-dark-accent-red text-white rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-red/80 transition-colors">
                 Decline
             </button>
             <button
                 @click="acceptConsent"
-                class="bg-dark-accent-green text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+                class="bg-dark-accent-green text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-green/80 transition-colors">
                 I Agree and Understand
             </button>
         </div>