diff --git a/extension/src/popup/styles.css b/extension/src/popup/styles.css
index 350a6e1..897ceb9 100644
--- a/extension/src/popup/styles.css
+++ b/extension/src/popup/styles.css
@@ -1494,3 +1494,17 @@ textarea {
   position: relative;
   z-index: 1;
 }
+
+/* Phase 2B: glass card. Translucent panel with backdrop blur for the
+   unlock card, setup step card, and form section panels. Falls back
+   gracefully on browsers without backdrop-filter (just stays translucent). */
+.glass {
+  background: var(--bg-card);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  border: 1px solid var(--border-soft);
+  border-radius: 10px;
+  box-shadow:
+    0 1px 0 rgba(255, 255, 255, 0.03) inset,
+    0 6px 18px rgba(0, 0, 0, 0.35);
+}
diff --git a/extension/src/vault/vault.css b/extension/src/vault/vault.css
index 42a3f46..2d63e40 100644
--- a/extension/src/vault/vault.css
+++ b/extension/src/vault/vault.css
@@ -1524,3 +1524,17 @@ textarea {
   position: relative;
   z-index: 1;
 }
+
+/* Phase 2B: glass card. Translucent panel with backdrop blur for the
+   unlock card, setup step card, and form section panels. Falls back
+   gracefully on browsers without backdrop-filter (just stays translucent). */
+.glass {
+  background: var(--bg-card);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  border: 1px solid var(--border-soft);
+  border-radius: 10px;
+  box-shadow:
+    0 1px 0 rgba(255, 255, 255, 0.03) inset,
+    0 6px 18px rgba(0, 0, 0, 0.35);
+}