diff --git a/www/src/components/pages/EmployeePortal.astro b/www/src/components/pages/EmployeePortal.astro
index 396c9b9..e95f709 100644
--- a/www/src/components/pages/EmployeePortal.astro
+++ b/www/src/components/pages/EmployeePortal.astro
@@ -47,6 +47,32 @@ const serialized = payload ? JSON.stringify(payload).replaceAll('<', '\\u003c')
   .employee-portal__content :global(:is(ul, ol)) { padding-inline-start: 1.5rem; margin-block: 1rem 1.5rem; }
   .employee-portal__content :global(li) { margin-block: .5rem; }
   .employee-portal__content :global(li::marker) { color: var(--color-accent, #ffbd59); }
+
+  /* Staff Management Templates: retain semantic list/DOM order, style as cards. */
+  .employee-portal__content :global(ul.portal-template-grid) {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: .8rem 1rem;
+    list-style: none;
+    margin-block: 1rem 2rem;
+    padding-inline-start: 0;
+  }
+  .employee-portal__content :global(ul.portal-template-grid > li) {
+    list-style: none;
+    margin: 0;
+    min-width: 0;
+  }
+  .employee-portal__content :global(ul.portal-template-grid > li p) { margin: 0; }
+  .employee-portal__content :global(ul.portal-template-grid a.portal-resource-button) {
+    align-items: center;
+    box-sizing: border-box;
+    display: flex;
+    height: 100%;
+    min-height: 2.75rem;
+    overflow-wrap: anywhere;
+    width: 100%;
+  }
+
   .employee-portal__content :global(:is(section, article) + :is(section, article)) { margin-block-start: 2.5rem; }
   .employee-portal__content :global(hr) { border: 0; border-top: 1px solid var(--color-border); margin-block: 2rem; }
   .employee-portal__content :global(a.portal-resource-button) {
@@ -69,5 +95,8 @@ const serialized = payload ? JSON.stringify(payload).replaceAll('<', '\\u003c')
   .employee-portal__content :global(th) { background: var(--color-tint); color: var(--color-primary); }
   .employee-portal__content :global(dt) { font-weight: 600; margin-top: 1rem; }
   .employee-portal__content :global(dd) { margin-inline-start: 1rem; }
+  @media (max-width: 767px) {
+    .employee-portal__content :global(ul.portal-template-grid) { grid-template-columns: minmax(0, 1fr); }
+  }
   @media (max-width: 500px) { .employee-portal__access { align-items: stretch; flex-direction: column; } }
 </style>