diff --git a/docs/release-control/v6/internal/subsystems/unified-resources.md b/docs/release-control/v6/internal/subsystems/unified-resources.md
index a8a8b1f9c..4b1edf2db 100644
--- a/docs/release-control/v6/internal/subsystems/unified-resources.md
+++ b/docs/release-control/v6/internal/subsystems/unified-resources.md
@@ -271,6 +271,9 @@ read as one first-screen answer rather than two adjacent mini-surfaces.
 That summary shell now reads as one linear current-state and identity column
 with a responsive two-column grid on wider screens, so the first read stays
 compact without making the operator scan a stack of nested cards.
+Each summary column keeps its own bordered card boundary, so the split read
+still has a clear visual container on both sides instead of feeling like loose
+label groups.
 The drawer header now stays focused on canonical identity and source/type
 badges only, while workload/service drill-down links and Kubernetes platform
 signals live with the summary shell, so the top strip does not compete with
diff --git a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx
index e5ee3c544..3bf3228eb 100644
--- a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx
+++ b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx
@@ -915,7 +915,10 @@ const DrawerContent: Component<ResourceDetailDrawerProps> = (props) => {
               Summary
             </div>
             <div class="mt-3 grid gap-4 sm:grid-cols-2">
-              <div data-testid="resource-current-state-section">
+              <div
+                data-testid="resource-current-state-section"
+                class="rounded border border-border bg-surface-hover p-3"
+              >
                 <div class="mb-2 text-[10px] font-medium uppercase tracking-wide text-base-content">
                   Current state
                 </div>
@@ -1104,7 +1107,10 @@ const DrawerContent: Component<ResourceDetailDrawerProps> = (props) => {
                 </div>
               </div>
 
-              <div data-testid="resource-identity-section">
+              <div
+                data-testid="resource-identity-section"
+                class="rounded border border-border bg-surface-hover p-3"
+              >
                 <div class="mb-2 text-[10px] font-medium uppercase tracking-wide text-base-content">
                   Identity
                 </div>
diff --git a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx
index e9045e150..0a493d8ef 100644
--- a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx
+++ b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx
@@ -198,6 +198,12 @@ describe('ResourceDetailDrawer change history section', () => {
     const summarySection = screen.getByTestId('resource-summary-section');
     expect(summarySection.querySelector('.mt-3.grid.gap-4')).toBeTruthy();
     expect(summarySection.querySelector('.mt-3.grid.gap-4')?.classList.contains('sm:grid-cols-2')).toBe(true);
+    expect(screen.getByTestId('resource-current-state-section').classList.contains('rounded')).toBe(
+      true,
+    );
+    expect(screen.getByTestId('resource-identity-section').classList.contains('rounded')).toBe(
+      true,
+    );
     expect(
       screen.getByTestId('resource-change-history-section').querySelector('.mt-3.grid.gap-2'),
     ).toBeNull();