diff --git a/apps/web/src/views/settings.ejs b/apps/web/src/views/settings.ejs
index 18a3c0b..7938549 100644
--- a/apps/web/src/views/settings.ejs
+++ b/apps/web/src/views/settings.ejs
@@ -11,13 +11,14 @@
     <h1 class="text-xl font-semibold text-white">Settings</h1>
 
     <% if (it.isSubKey) { %>
-    <div class="flex gap-3 items-start bg-blue-950/40 border border-blue-800/40 rounded-xl px-5 py-4">
-      <span class="text-blue-400 text-base mt-0.5">🔑</span>
-      <div>
-        <p class="text-sm font-medium text-blue-300">You're signed in with a sub-key</p>
-        <p class="text-xs text-blue-400/70 mt-1">Sub-keys are scoped API keys that can manage monitors but can't access or change account credentials. To manage your login key, email, or sub-keys, sign in with your main account key.</p>
+    <section class="bg-gray-900 rounded-xl border border-gray-800 p-6">
+      <div class="flex items-start gap-4">
+        <div class="flex-1">
+          <p class="text-sm font-semibold text-gray-200 mb-1">Signed in with a sub-key</p>
+          <p class="text-xs text-gray-500 leading-relaxed">Sub-keys can manage monitors but can't access account credentials. Sign in with your main account key to manage your login key, recovery email, and sub-keys.</p>
+        </div>
       </div>
-    </div>
+    </section>
     <% } %>
 
     <!-- Account info -->