diff --git a/modules/helpdesk/web/css/helpdesk.css b/modules/helpdesk/web/css/helpdesk.css
index d09cb0a..38bc5b2 100644
--- a/modules/helpdesk/web/css/helpdesk.css
+++ b/modules/helpdesk/web/css/helpdesk.css
@@ -126,6 +126,23 @@
     }
   }
 
+  /* Team workload — agent widget card */
+  .helpdesk-team-widget {
+    border: 1px solid var(--app-muted-border-color);
+    border-radius: var(--app-radius, 0.375rem);
+    padding: calc(var(--app-spacing) * 0.65) calc(var(--app-spacing) * 0.75);
+    margin-bottom: calc(var(--app-spacing) * 0.5);
+  }
+
+  .helpdesk-team-widget > .helpdesk-support-section-title {
+    margin-top: 0;
+  }
+
+  .helpdesk-team-widget > .helpdesk-team-ticket-table {
+    border: none;
+    border-radius: 0;
+  }
+
   /* Team workload — inline avatar for section titles */
   .helpdesk-team-avatar-inline {
     display: inline-flex;
diff --git a/modules/helpdesk/web/js/helpdesk-team.js b/modules/helpdesk/web/js/helpdesk-team.js
index 9f67d68..3898e35 100644
--- a/modules/helpdesk/web/js/helpdesk-team.js
+++ b/modules/helpdesk/web/js/helpdesk-team.js
@@ -75,7 +75,7 @@ if (container) {
    * Build a section widget for one agent — mirrors debitor dashboard section pattern.
    */
   function buildAgentWidget(m, isQueue) {
-    const section = h('section');
+    const section = h('section', 'helpdesk-team-widget');
 
     // Section title: "MM  Name   (count)" with line — same as helpdesk-support-section-title
     const title = h('h3', 'helpdesk-support-section-title');