updates on the ai bot and assigned by chatbot

src/components/nearle_components/PageLayout.js

@@ -5,6 +5,8 @@ import { VStack } from '@astryxdesign/core/VStack';
 import { Card } from '@astryxdesign/core/Card';
 import { Divider } from '@astryxdesign/core/Divider';
 
+import { DT } from 'themes/dt/tokens';
+
 // ==============================|| PAGE LAYOUT PRIMITIVES ||============================== //
 //
 // The operator-page design language, in one place.
@@ -169,12 +171,29 @@ FilterToolbar.propTypes = {
 // bottom of the screen. A table inside then only needs `maxHeight="100%"` —
 // no viewport arithmetic, and it re-measures on every resize for free.
 // ---------------------------------------------------------------------------
+// The one place the table container's outline is decided, for all 17 pages
+// that use DataCard. It is stated explicitly rather than inherited so the
+// result is deterministic: Astryx has two neutral border tokens
+// (`--color-border` at ~10% alpha and `--color-border-emphasized` at #CCD3DB)
+// and which one a Card resolves to depends on its elevation and variant. A
+// table frame that changes weight depending on that is exactly the
+// inconsistency this is meant to remove.
+//
+// DT.borderSubtle (#e2e8f0) is the existing design-system neutral — no new
+// colour is introduced, and it is the same value the sticky table header and
+// the row separators use, so no internal line is ever darker than the frame.
+export const TABLE_FRAME = `1px solid ${DT.borderSubtle}`;
+
 export function DataCard({ toolbar, tabs, children, fill = false }) {
   return (
     <Card
       padding={0}
       elevation="none"
-      style={fill ? { overflow: 'hidden', display: 'flex', flexDirection: 'column', flex: 1, minHeight: 0 } : { overflow: 'hidden' }}
+      style={
+        fill
+          ? { border: TABLE_FRAME, overflow: 'hidden', display: 'flex', flexDirection: 'column', flex: 1, minHeight: 0 }
+          : { border: TABLE_FRAME, overflow: 'hidden' }
+      }
     >
       {toolbar}
       {toolbar && <Divider />}