diff --git a/frontend/src/App.css b/frontend/src/App.css
index 06bbf3a..98cca68 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -696,3 +696,41 @@ body {
 .auth-sub { font-size: 0.82rem; color: var(--color-secondary); margin-top: 0.15rem; }
 .auth-url-link { font-size: 0.85rem; color: var(--color-primary); margin-top: 0.25rem; display: inline-block; }
 .btn-sm { padding: 0.3rem 0.75rem; font-size: 0.82rem; margin-left: auto; }
+
+/* ====== MCP Servers ====== */
+.mcp-panel { display: flex; flex-direction: column; gap: 0.75rem; }
+.mcp-list { display: flex; flex-direction: column; gap: 0.5rem; }
+.mcp-row {
+  display: flex; align-items: center; gap: 0.75rem;
+  padding: 0.65rem 0.85rem; border-radius: 6px;
+  background: var(--color-background); font-size: 0.9rem;
+}
+.mcp-status-dot {
+  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
+}
+.mcp-status-dot.connected { background: var(--color-success); }
+.mcp-status-dot.disconnected { background: var(--color-danger); }
+.mcp-name { font-weight: 600; color: var(--color-text); }
+.mcp-details { color: var(--color-secondary); font-size: 0.82rem; flex: 1; }
+.btn-icon {
+  background: none; border: none; color: var(--color-secondary);
+  cursor: pointer; font-size: 0.9rem; padding: 0.2rem 0.4rem;
+  border-radius: 4px; transition: all 0.15s;
+}
+.btn-icon:hover { background: #fee2e2; color: var(--color-danger); }
+.mcp-empty { color: var(--color-secondary); font-size: 0.9rem; }
+.mcp-empty p { margin-bottom: 0.5rem; }
+.mcp-raw { font-size: 0.78rem; background: var(--color-background); padding: 0.5rem; border-radius: 4px; }
+.mcp-add-btn { align-self: flex-start; margin-top: 0.25rem; }
+.mcp-add-form {
+  display: flex; flex-direction: column; gap: 0.5rem;
+  padding: 0.75rem; border-radius: 8px;
+  background: var(--color-background); border: 1px solid var(--color-border);
+}
+.mcp-form-row { display: flex; gap: 0.5rem; }
+.mcp-form-row input, .mcp-form-row select { flex: 1; }
+.mcp-add-form input, .mcp-add-form select {
+  padding: 0.45rem 0.65rem; border: 1px solid var(--color-border);
+  border-radius: 6px; font-size: 0.88rem;
+}
+.mcp-form-actions { display: flex; gap: 0.5rem; }