diff --git a/.storybook/storybook.css b/.storybook/storybook.css
index ffbe714..5a92c1f 100644
--- a/.storybook/storybook.css
+++ b/.storybook/storybook.css
@@ -1,4 +1,4 @@
-:root {
+:root:not(.MuiTypography-root) {
   --sb-ds-font-body:
     "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
     Helvetica, Arial, sans-serif;
@@ -33,14 +33,14 @@
 
 /* Applied to all of Storybook, including the UI and Docs */
 
-body .sbdocs {
+body .sbdocs:not(.MuiTypography-root) {
   background-color: var(--sb-ds-background) !important;
 }
 
 /* Base font */
-.sbdocs,
-.sbdocs p,
-.sbdocs li {
+.sbdocs:not(.MuiTypography-root),
+.sbdocs p:not(.MuiTypography-root),
+.sbdocs li:not(.MuiTypography-root) {
   font-family: var(--sb-ds-font-body);
 }
 
@@ -51,22 +51,22 @@ body .sbdocs {
   font-family: var(--sb-ds-font-heading);
 }
 
-.sbdocs h2,
-.sbdocs h3,
-.sbdocs h4,
-.sbdocs h5,
-.sbdocs h6,
-table th,
-table td {
+.sbdocs h2:not(.MuiTypography-root),
+.sbdocs h3:not(.MuiTypography-root),
+.sbdocs h4:not(.MuiTypography-root),
+.sbdocs h5:not(.MuiTypography-root),
+.sbdocs h6:not(.MuiTypography-root),
+table th:not(.MuiTypography-root),
+table td:not(.MuiTypography-root) {
   font-family: var(--sb-ds-font-body);
 }
 /* Code uses IBM Plex Mono */
-code,
-.sbdocs code,
-.sbdocs pre,
-.sbdocs kbd,
-.sbdocs samp,
-.token {
+code:not(.MuiTypography-root),
+.sbdocs code:not(.MuiTypography-root),
+.sbdocs pre:not(.MuiTypography-root),
+.sbdocs kbd:not(.MuiTypography-root),
+.sbdocs samp:not(.MuiTypography-root),
+.token:not(.MuiTypography-root) {
   font-family: var(--sb-ds-font-mono);
 }
 
diff --git a/src/storybook/PracticalGuidance.mdx b/src/storybook/PracticalGuidance.mdx
index 42a5619..ff1230b 100644
--- a/src/storybook/PracticalGuidance.mdx
+++ b/src/storybook/PracticalGuidance.mdx
@@ -84,16 +84,18 @@ styles.
 
 Build with existing components and patterns before creating new ones.
 
-Components should keep interfaces predictable, readable, and consistent.
+Components should keep interfaces <strong>predictable, efficient, readable, and consistent</strong>. Users should be able to understand how an interface behaves, complete common tasks with minimal effort, and recognise the meaning of visual cues without additional explanation.
 
 <div className="ds-dos">
   <div className="ds-card">
     <h3>✅ Do</h3>
     <ul>
-      <li>Reuse established layouts and behaviours.</li>
+      <li>Reuse established layouts, behaviours, and interaction patterns.</li>
       <li>Use standard component variants consistently.</li>
-      <li>Keep disabled and error states visually clear.</li>
-      <li>Use spacing and typography for hierarchy.</li>
+      <li>Minimise unnecessary steps for common tasks.</li>
+      <li>Use spacing, typography, and colour to create clear hierarchy.</li>
+      <li>Keep disabled, read-only, selected, and error states visually distinct.</li>
+      <li>Use visual styling that matches the meaning being communicated.</li>
     </ul>
   </div>
 
@@ -103,6 +105,8 @@ Components should keep interfaces predictable, readable, and consistent.
       <li>Don’t restyle components screen by screen.</li>
       <li>Don’t introduce custom colours unnecessarily.</li>
       <li>Don’t create multiple patterns for the same interaction.</li>
+      <li>Don't require extra interactions when a direct action would be expected.</li>
+      <li>Don't use error or warning styling for normal states.</li>
       <li>Don’t override the theme without a reusable reason.</li>
     </ul>
   </div>
diff --git a/src/styles/diamondDS/DiamondDSTokens.css b/src/styles/diamondDS/DiamondDSTokens.css
index c21d6db..9325806 100644
--- a/src/styles/diamondDS/DiamondDSTokens.css
+++ b/src/styles/diamondDS/DiamondDSTokens.css
@@ -2,7 +2,7 @@
   /* Neutral primitives */
   --ds-grey-50: #f8f8fa;
   --ds-grey-100: #eef1f5;
-  --ds-grey-200: #e6e9f0;
+  --ds-grey-200: #eaedf3;
   --ds-grey-300: #dde1e8;
   --ds-grey-400: #bcc2cd;
   --ds-grey-500: #a5acb8;
@@ -55,8 +55,6 @@
   --ds-elevation-23: #eef1f5;
   --ds-elevation-24: #eef1f5;
 
-
-
   /* Neutral roles */
   --ds-background: #f6f6f9;
   --ds-background-channel: 246 246 249;
@@ -297,7 +295,6 @@
   --ds-elevation-23: #2a3140;
   --ds-elevation-24: #2c3140;
 
-
   /* Neutral roles */
   --ds-background: var(--ds-grey-dark-800);
   --ds-background-channel: 14 16 23;