diff --git a/backend/internal/web/ui/button.css b/backend/internal/web/ui/button.css
index 637caea..c581bf6 100644
--- a/backend/internal/web/ui/button.css
+++ b/backend/internal/web/ui/button.css
@@ -45,3 +45,49 @@
   outline: 2px solid #1d4ed8;
   outline-offset: 2px;
 }
+
+/* Phase 3: Danger (solid) and Neutral-soft button variants. */
+/* Codex concern #7: no CSS nesting — all pseudo-class rules are top-level. */
+
+.ui-button-solid-danger-md {
+  display: inline-flex;
+  align-items: center;
+  border-radius: 0.375rem;
+  background-color: #b91c1c;
+  padding: 0.5rem 1rem;
+  font-size: 1rem;
+  font-weight: 600;
+  color: #ffffff;
+  min-height: 44px;
+}
+
+.ui-button-solid-danger-md:hover {
+  background-color: #991b1b;
+}
+
+.ui-button-solid-danger-md:focus-visible {
+  outline: 2px solid #b91c1c;
+  outline-offset: 2px;
+}
+
+.ui-button-soft-neutral-md {
+  display: inline-flex;
+  align-items: center;
+  border-radius: 0.375rem;
+  background-color: #f1f5f9;
+  padding: 0.5rem 1rem;
+  font-size: 1rem;
+  font-weight: 400;
+  color: #334155;
+  border: 1px solid #e2e8f0;
+  min-height: 44px;
+}
+
+.ui-button-soft-neutral-md:hover {
+  background-color: #e2e8f0;
+}
+
+.ui-button-soft-neutral-md:focus-visible {
+  outline: 2px solid #64748b;
+  outline-offset: 2px;
+}