diff --git a/.github/playwright/impact-map.generated.json b/.github/playwright/impact-map.generated.json
index 54428d7b4eb6..ef9b099983eb 100644
--- a/.github/playwright/impact-map.generated.json
+++ b/.github/playwright/impact-map.generated.json
@@ -7611,14 +7611,6 @@
         "playwright/e2e/Pages/AppStopRunModal.spec.ts"
       ]
     },
-    {
-      "sources": [
-        "openmetadata-ui/src/main/resources/ui/src/components/Modals/StyleModal/StyleModal.component.tsx"
-      ],
-      "specs": [
-        "playwright/e2e/Pages/DomainUIInteractions.spec.ts"
-      ]
-    },
     {
       "sources": [
         "openmetadata-ui/src/main/resources/ui/src/components/Modals/TourEndModal/TourEndModal.tsx"
@@ -12448,6 +12440,22 @@
         "playwright/e2e/Pages/IntakeForm.spec.ts"
       ]
     },
+    {
+      "sources": [
+        "openmetadata-ui/src/main/resources/ui/src/pages/KPIPage/AddKPIPage.tsx"
+      ],
+      "specs": [
+        "playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts"
+      ]
+    },
+    {
+      "sources": [
+        "openmetadata-ui/src/main/resources/ui/src/pages/KPIPage/EditKPIPage.tsx"
+      ],
+      "specs": [
+        "playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts"
+      ]
+    },
     {
       "sources": [
         "openmetadata-ui/src/main/resources/ui/src/pages/KnowledgeCenterFilterPage/KnowledgeCenterFilterPage.tsx"
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts
index 70929d222a3f..4fa94050ca42 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts
@@ -48,6 +48,23 @@ test('Profiler settings survive a table reindex', async ({ browser }) => {
     await page.getByTestId('profiler-setting-btn').click();
     await page.getByTestId('profiler-settings-modal').waitFor();
 
+    // Body-portaled options are hidden by the modal's accessibility boundary.
+    // Check accessible options and keyboard selection inside the drawer.
+    const settings = page.getByRole('dialog', { name: 'Settings' });
+    const sampleType = settings.getByRole('combobox', {
+      name: 'Profile Sample type',
+    });
+    await settings.getByTestId('profile-sample').click();
+    await expect(
+      settings.getByRole('option', { name: 'Row Count', exact: true })
+    ).toBeAttached();
+    await sampleType.press('ArrowDown');
+    await sampleType.press('Enter');
+    await expect(settings.getByTestId('metric-number-input')).toBeVisible();
+    await settings.getByTestId('profile-sample').click();
+    await sampleType.press('ArrowUp');
+    await sampleType.press('Enter');
+
     await page.getByTestId('slider-input').clear();
     await page.getByTestId('slider-input').fill(PROFILE_SAMPLE);
     await page.getByTestId('sample-data-count-input').clear();
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Tasks/TaskCreation.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Tasks/TaskCreation.spec.ts
index bfd510f5bb36..de71f67fc954 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Tasks/TaskCreation.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Tasks/TaskCreation.spec.ts
@@ -175,7 +175,15 @@ test.describe('Task Creation - Request Description', () => {
     await expect(page.getByTestId('form-container')).toBeVisible();
 
     // Assignee field - search and select user
-    const assigneeInput = page.locator('[data-testid="select-assignee"] input');
+    const assigneeInput = page
+      .getByTestId('select-assignee')
+      .getByRole('combobox');
+    await expect(assigneeInput).toHaveAccessibleName(/^Assignees\b/);
+    await page
+      .locator('label')
+      .filter({ hasText: /^Assignees\b/ })
+      .click();
+    await expect(assigneeInput).toBeFocused();
     await assigneeInput.click();
 
     // Search for user
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/VisualRegression/__snapshots__/staticPages.spec.ts-snapshots/teams.png b/openmetadata-ui/src/main/resources/ui/playwright/e2e/VisualRegression/__snapshots__/staticPages.spec.ts-snapshots/teams.png
index 2d2988f597e1..943c077bd676 100644
Binary files a/openmetadata-ui/src/main/resources/ui/playwright/e2e/VisualRegression/__snapshots__/staticPages.spec.ts-snapshots/teams.png and b/openmetadata-ui/src/main/resources/ui/playwright/e2e/VisualRegression/__snapshots__/staticPages.spec.ts-snapshots/teams.png differ
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts
index 643a5266a182..437c442060b1 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts
@@ -1292,10 +1292,12 @@ export const createDescriptionTaskForGlossary = async (
     );
 
     await expect(
-      page.locator('[data-testid="select-assignee"] input')
+      page.getByTestId('select-assignee').getByRole('combobox')
     ).toBeDisabled();
   } else {
-    const assigneeField = page.locator('[data-testid="select-assignee"] input');
+    const assigneeField = page
+      .getByTestId('select-assignee')
+      .getByRole('combobox');
     await assigneeField.click();
 
     const userSearchResponse = page.waitForResponse(
@@ -1342,11 +1344,13 @@ export const createTagTaskForGlossary = async (
     );
 
     await expect(
-      page.locator('[data-testid="select-assignee"] input')
+      page.getByTestId('select-assignee').getByRole('combobox')
     ).toBeDisabled();
   } else {
     // select assignee
-    const assigneeField = page.locator('[data-testid="select-assignee"] input');
+    const assigneeField = page
+      .getByTestId('select-assignee')
+      .getByRole('combobox');
     await assigneeField.click();
     const userSearchResponse = page.waitForResponse(
       `/api/v1/search/query?q=*${value.assignee}**&index=user%2Cteam*`
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts
index 487e43df59de..b7fbe6c9caca 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts
@@ -189,7 +189,7 @@ export const addAssigneeFromPopoverWidget = async (data: {
 
     const assigneeModal = page.locator('.ant-modal-content').last();
     const assigneeSelect = assigneeModal.getByTestId('select-assignee');
-    const assigneeInput = assigneeSelect.locator('input');
+    const assigneeInput = assigneeSelect.getByRole('combobox');
     const assigneeOption = page.getByTestId(user.name).first();
     const normalizedAssigneeOption = page
       .getByTestId(user.name.toLowerCase())
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts
index 41a1dcc93526..82e65e92871a 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts
@@ -122,10 +122,12 @@ export const createDescriptionTask = async (
     );
 
     await expect(
-      page.locator('[data-testid="select-assignee"] input')
+      page.getByTestId('select-assignee').getByRole('combobox')
     ).toBeDisabled();
   } else {
-    const assigneeField = page.locator('[data-testid="select-assignee"] input');
+    const assigneeField = page
+      .getByTestId('select-assignee')
+      .getByRole('combobox');
     await assigneeField.click();
     await assigneeField.fill(value.assignee);
 
@@ -163,11 +165,13 @@ export const createTagTask = async (
     );
 
     await expect(
-      page.locator('[data-testid="select-assignee"] input')
+      page.getByTestId('select-assignee').getByRole('combobox')
     ).toBeDisabled();
   } else {
     // select assignee
-    const assigneeField = page.locator('[data-testid="select-assignee"] input');
+    const assigneeField = page
+      .getByTestId('select-assignee')
+      .getByRole('combobox');
     await assigneeField.click();
     await assigneeField.fill(value.assignee);
 
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts
index d83bbf392859..147b10a56285 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts
@@ -214,7 +214,9 @@ export const openTaskForm = async (page: Page, route: string) => {
 };
 
 export const selectAssignee = async (page: Page, assigneeName: string) => {
-  const assigneeInput = page.locator('[data-testid="select-assignee"] input');
+  const assigneeInput = page
+    .getByTestId('select-assignee')
+    .getByRole('combobox');
   const assigneeOption = page.getByTestId(assigneeName);
   const assigneeSearchResponse = page
     .waitForResponse(
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg
index a626260650fd..c7c176aa8a10 100644
--- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg
@@ -1,3 +1,3 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><script xmlns=""/>
-<path d="M11.5 13.375H7.81875C7.93491 12.6015 8.21112 11.8607 8.62974 11.1999C9.04837 10.5391 9.6002 9.97295 10.25 9.5375L11.3688 8.7875L10.6812 7.75L9.5625 8.5C8.6208 9.12755 7.84857 9.97785 7.31433 10.9755C6.7801 11.9731 6.50038 13.0871 6.5 14.2188V18.375C6.5 18.7065 6.6317 19.0245 6.86612 19.2589C7.10054 19.4933 7.41848 19.625 7.75 19.625H11.5C11.8315 19.625 12.1495 19.4933 12.3839 19.2589C12.6183 19.0245 12.75 18.7065 12.75 18.375V14.625C12.75 14.2935 12.6183 13.9755 12.3839 13.7411C12.1495 13.5067 11.8315 13.375 11.5 13.375ZM20.25 13.375H16.5688C16.6849 12.6015 16.9611 11.8607 17.3797 11.1999C17.7984 10.5391 18.3502 9.97295 19 9.5375L20.1188 8.7875L19.4375 7.75L18.3125 8.5C17.3708 9.12755 16.5986 9.97785 16.0643 10.9755C15.5301 11.9731 15.2504 13.0871 15.25 14.2188V18.375C15.25 18.7065 15.3817 19.0245 15.6161 19.2589C15.8505 19.4933 16.1685 19.625 16.5 19.625H20.25C20.5815 19.625 20.8995 19.4933 21.1339 19.2589C21.3683 19.0245 21.5 18.7065 21.5 18.375V14.625C21.5 14.2935 21.3683 13.9755 21.1339 13.7411C20.8995 13.5067 20.5815 13.375 20.25 13.375Z" fill="#212529"/>
+<path d="M11.5 13.375H7.81875C7.93491 12.6015 8.21112 11.8607 8.62974 11.1999C9.04837 10.5391 9.6002 9.97295 10.25 9.5375L11.3688 8.7875L10.6812 7.75L9.5625 8.5C8.6208 9.12755 7.84857 9.97785 7.31433 10.9755C6.7801 11.9731 6.50038 13.0871 6.5 14.2188V18.375C6.5 18.7065 6.6317 19.0245 6.86612 19.2589C7.10054 19.4933 7.41848 19.625 7.75 19.625H11.5C11.8315 19.625 12.1495 19.4933 12.3839 19.2589C12.6183 19.0245 12.75 18.7065 12.75 18.375V14.625C12.75 14.2935 12.6183 13.9755 12.3839 13.7411C12.1495 13.5067 11.8315 13.375 11.5 13.375ZM20.25 13.375H16.5688C16.6849 12.6015 16.9611 11.8607 17.3797 11.1999C17.7984 10.5391 18.3502 9.97295 19 9.5375L20.1188 8.7875L19.4375 7.75L18.3125 8.5C17.3708 9.12755 16.5986 9.97785 16.0643 10.9755C15.5301 11.9731 15.2504 13.0871 15.25 14.2188V18.375C15.25 18.7065 15.3817 19.0245 15.6161 19.2589C15.8505 19.4933 16.1685 19.625 16.5 19.625H20.25C20.5815 19.625 20.8995 19.4933 21.1339 19.2589C21.3683 19.0245 21.5 18.7065 21.5 18.375V14.625C21.5 14.2935 21.3683 13.9755 21.1339 13.7411C20.8995 13.5067 20.5815 13.375 20.25 13.375Z" fill="currentColor"/>
 </svg>
\ No newline at end of file
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg
index 293ccd4f7837..01e928ce546d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg
@@ -1,5 +1,5 @@
 <svg viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.375 11.5C9.41053 11.5 10.25 10.6605 10.25 9.625C10.25 8.58947 9.41053 7.75 8.375 7.75C7.33947 7.75 6.5 8.58947 6.5 9.625C6.5 10.6605 7.33947 11.5 8.375 11.5Z" fill="#212529"/>
-<path d="M8.375 20.25C9.41053 20.25 10.25 19.4105 10.25 18.375C10.25 17.3395 9.41053 16.5 8.375 16.5C7.33947 16.5 6.5 17.3395 6.5 18.375C6.5 19.4105 7.33947 20.25 8.375 20.25Z" fill="#212529"/>
-<path d="M14 17.75H22.75V19H14V17.75ZM14 9H22.75V10.25H14V9Z" fill="#212529"/>
+<path d="M8.375 11.5C9.41053 11.5 10.25 10.6605 10.25 9.625C10.25 8.58947 9.41053 7.75 8.375 7.75C7.33947 7.75 6.5 8.58947 6.5 9.625C6.5 10.6605 7.33947 11.5 8.375 11.5Z" fill="currentColor"/>
+<path d="M8.375 20.25C9.41053 20.25 10.25 19.4105 10.25 18.375C10.25 17.3395 9.41053 16.5 8.375 16.5C7.33947 16.5 6.5 17.3395 6.5 18.375C6.5 19.4105 7.33947 20.25 8.375 20.25Z" fill="currentColor"/>
+<path d="M14 17.75H22.75V19H14V17.75ZM14 9H22.75V10.25H14V9Z" fill="currentColor"/>
 </svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg
index 8daf6d5680a1..fb530149e7fa 100644
--- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg
@@ -1,3 +1,3 @@
 <svg viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M23.375 14L19 18.375L18.1187 17.4937L21.6063 14L18.1187 10.5062L19 9.625L23.375 14ZM4.625 14L9 9.625L9.88125 10.5062L6.39375 14L9.88125 17.4937L9 18.375L4.625 14ZM11.7625 19.9275L15.025 7.75L16.2325 8.07313L12.97 20.25L11.7625 19.9275Z" fill="#212529"/>
+<path d="M23.375 14L19 18.375L18.1187 17.4937L21.6063 14L18.1187 10.5062L19 9.625L23.375 14ZM4.625 14L9 9.625L9.88125 10.5062L6.39375 14L9.88125 17.4937L9 18.375L4.625 14ZM11.7625 19.9275L15.025 7.75L16.2325 8.07313L12.97 20.25L11.7625 19.9275Z" fill="currentColor"/>
 </svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg
index aeb9db3e5ad4..4e8045850efc 100644
--- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg
@@ -1,3 +1,3 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><script xmlns=""/>
-<rect x="6.5" y="13.375" width="15" height="1.25" fill="#212529"/>
+<rect x="6.5" y="13.375" width="15" height="1.25" fill="currentColor"/>
 </svg>
\ No newline at end of file
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg
index c67825ead370..cbaa84ac190c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg
@@ -1,4 +1,4 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><script xmlns=""/>
-<path d="M15.875 12.75C16.2458 12.75 16.6084 12.64 16.9167 12.434C17.225 12.228 17.4654 11.9351 17.6073 11.5925C17.7492 11.2499 17.7863 10.8729 17.714 10.5092C17.6416 10.1455 17.463 9.8114 17.2008 9.54917C16.9386 9.28695 16.6045 9.10837 16.2408 9.03603C15.8771 8.96368 15.5001 9.00081 15.1575 9.14273C14.8149 9.28464 14.522 9.52496 14.316 9.83331C14.11 10.1416 14 10.5042 14 10.875C14 11.3723 14.1975 11.8492 14.5492 12.2008C14.9008 12.5525 15.3777 12.75 15.875 12.75ZM15.875 10.25C15.9986 10.25 16.1195 10.2867 16.2222 10.3553C16.325 10.424 16.4051 10.5216 16.4524 10.6358C16.4997 10.75 16.5121 10.8757 16.488 10.9969C16.4639 11.1182 16.4044 11.2295 16.3169 11.3169C16.2295 11.4043 16.1182 11.4639 15.9969 11.488C15.8757 11.5121 15.75 11.4997 15.6358 11.4524C15.5216 11.4051 15.424 11.325 15.3553 11.2222C15.2867 11.1195 15.25 10.9986 15.25 10.875C15.25 10.7092 15.3158 10.5503 15.4331 10.4331C15.5503 10.3158 15.7092 10.25 15.875 10.25Z" fill="#212529"/>
-<path d="M20.25 6.5H7.75C7.41848 6.5 7.10054 6.6317 6.86612 6.86612C6.6317 7.10054 6.5 7.41848 6.5 7.75V20.25C6.5 20.5815 6.6317 20.8995 6.86612 21.1339C7.10054 21.3683 7.41848 21.5 7.75 21.5H20.25C20.5815 21.5 20.8995 21.3683 21.1339 21.1339C21.3683 20.8995 21.5 20.5815 21.5 20.25V7.75C21.5 7.41848 21.3683 7.10054 21.1339 6.86612C20.8995 6.6317 20.5815 6.5 20.25 6.5ZM20.25 20.25H7.75V16.5L10.875 13.375L14.3688 16.8687C14.603 17.1016 14.9198 17.2322 15.25 17.2322C15.5802 17.2322 15.897 17.1016 16.1313 16.8687L17.125 15.875L20.25 19V20.25ZM20.25 17.2312L18.0063 14.9875C17.772 14.7547 17.4552 14.624 17.125 14.624C16.7948 14.624 16.478 14.7547 16.2437 14.9875L15.25 15.9812L11.7562 12.4875C11.522 12.2547 11.2052 12.124 10.875 12.124C10.5448 12.124 10.228 12.2547 9.99375 12.4875L7.75 14.7312V7.75H20.25V17.2312Z" fill="#212529"/>
+<path d="M15.875 12.75C16.2458 12.75 16.6084 12.64 16.9167 12.434C17.225 12.228 17.4654 11.9351 17.6073 11.5925C17.7492 11.2499 17.7863 10.8729 17.714 10.5092C17.6416 10.1455 17.463 9.8114 17.2008 9.54917C16.9386 9.28695 16.6045 9.10837 16.2408 9.03603C15.8771 8.96368 15.5001 9.00081 15.1575 9.14273C14.8149 9.28464 14.522 9.52496 14.316 9.83331C14.11 10.1416 14 10.5042 14 10.875C14 11.3723 14.1975 11.8492 14.5492 12.2008C14.9008 12.5525 15.3777 12.75 15.875 12.75ZM15.875 10.25C15.9986 10.25 16.1195 10.2867 16.2222 10.3553C16.325 10.424 16.4051 10.5216 16.4524 10.6358C16.4997 10.75 16.5121 10.8757 16.488 10.9969C16.4639 11.1182 16.4044 11.2295 16.3169 11.3169C16.2295 11.4043 16.1182 11.4639 15.9969 11.488C15.8757 11.5121 15.75 11.4997 15.6358 11.4524C15.5216 11.4051 15.424 11.325 15.3553 11.2222C15.2867 11.1195 15.25 10.9986 15.25 10.875C15.25 10.7092 15.3158 10.5503 15.4331 10.4331C15.5503 10.3158 15.7092 10.25 15.875 10.25Z" fill="currentColor"/>
+<path d="M20.25 6.5H7.75C7.41848 6.5 7.10054 6.6317 6.86612 6.86612C6.6317 7.10054 6.5 7.41848 6.5 7.75V20.25C6.5 20.5815 6.6317 20.8995 6.86612 21.1339C7.10054 21.3683 7.41848 21.5 7.75 21.5H20.25C20.5815 21.5 20.8995 21.3683 21.1339 21.1339C21.3683 20.8995 21.5 20.5815 21.5 20.25V7.75C21.5 7.41848 21.3683 7.10054 21.1339 6.86612C20.8995 6.6317 20.5815 6.5 20.25 6.5ZM20.25 20.25H7.75V16.5L10.875 13.375L14.3688 16.8687C14.603 17.1016 14.9198 17.2322 15.25 17.2322C15.5802 17.2322 15.897 17.1016 16.1313 16.8687L17.125 15.875L20.25 19V20.25ZM20.25 17.2312L18.0063 14.9875C17.772 14.7547 17.4552 14.624 17.125 14.624C16.7948 14.624 16.478 14.7547 16.2437 14.9875L15.25 15.9812L11.7562 12.4875C11.522 12.2547 11.2052 12.124 10.875 12.124C10.5448 12.124 10.228 12.2547 9.99375 12.4875L7.75 14.7312V7.75H20.25V17.2312Z" fill="currentColor"/>
 </svg>
\ No newline at end of file
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg
index 09f774488a48..e8d236691e45 100644
--- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg
@@ -1,3 +1,3 @@
 <svg viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M14 17.75H22.75V19H14V17.75ZM14 9H22.75V10.25H14V9ZM9 11.5V6.5H7.75V7.125H6.5V8.375H7.75V11.5H6.5V12.75H10.25V11.5H9ZM10.25 21.5H6.5V19C6.5 18.6685 6.6317 18.3505 6.86612 18.1161C7.10054 17.8817 7.41848 17.75 7.75 17.75H9V16.5H6.5V15.25H9C9.33152 15.25 9.64946 15.3817 9.88388 15.6161C10.1183 15.8505 10.25 16.1685 10.25 16.5V17.75C10.25 18.0815 10.1183 18.3995 9.88388 18.6339C9.64946 18.8683 9.33152 19 9 19H7.75V20.25H10.25V21.5Z" fill="#212529"/>
+<path d="M14 17.75H22.75V19H14V17.75ZM14 9H22.75V10.25H14V9ZM9 11.5V6.5H7.75V7.125H6.5V8.375H7.75V11.5H6.5V12.75H10.25V11.5H9ZM10.25 21.5H6.5V19C6.5 18.6685 6.6317 18.3505 6.86612 18.1161C7.10054 17.8817 7.41848 17.75 7.75 17.75H9V16.5H6.5V15.25H9C9.33152 15.25 9.64946 15.3817 9.88388 15.6161C10.1183 15.8505 10.25 16.1685 10.25 16.5V17.75C10.25 18.0815 10.1183 18.3995 9.88388 18.6339C9.64946 18.8683 9.33152 19 9 19H7.75V20.25H10.25V21.5Z" fill="currentColor"/>
 </svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less
index 197438a46e6b..429fdfaba220 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less
@@ -15,17 +15,18 @@
 
 .activity-feed-card-new {
   border-radius: var(--om-radius-xl);
-  background: @grey-9;
+  background: var(--tw-color-bg-surface);
   display: flex;
   flex-direction: column;
   flex-wrap: wrap;
   width: inherit;
 
   &.ant-card {
-    background: @grey-9;
+    background: var(--tw-color-bg-surface);
     border-radius: var(--om-radius-xl);
     margin-bottom: var(--om-space-20);
-    border: 0.5px solid @grey-15;
+    border: 1px solid var(--tw-color-border-subtle);
+    box-shadow: var(--om-shadow-card);
   }
 
   .ant-card-body {
@@ -66,7 +67,7 @@
 .task-feed-card-v1-new {
   .header-link {
     word-wrap: break-word;
-    color: @primary-heading-color;
+    color: var(--tw-color-text-link);
     font-weight: var(--om-font-weight-semibold);
     display: inline;
   }
@@ -84,8 +85,8 @@
   border-radius: var(--om-radius-xl);
   padding: var(--om-space-16);
   margin: var(--om-space-20) 0 0 0;
-  background: @grey-9;
-  border: 0.5px solid @grey-15;
+  background: var(--tw-color-bg-surface);
+  border: 1px solid var(--tw-color-border-subtle);
   input.ant-input,
   textarea.ant-input {
     border-radius: var(--om-radius-20);
@@ -102,8 +103,8 @@
 
 .activity-feed-reply-button {
   border-radius: var(--om-radius-3xl);
-  border: 1px solid var(--om-legacy-color-d4d4d8);
-  color: var(--om-legacy-color-52525b);
+  border: 1px solid var(--tw-color-border-secondary);
+  color: var(--tw-color-text-secondary);
   font-size: var(--om-font-size-xs);
 }
 .comments-input-field {
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less
index 9cb86a68150a..3b0e44d7da9e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less
@@ -226,10 +226,10 @@
 
     &,
     & a {
-      color: @primary-heading-color;
+      color: var(--tw-color-text-link);
 
       &:hover {
-        color: @primary-heading-color;
+        color: var(--tw-color-text-link);
       }
     }
   }
@@ -244,33 +244,36 @@
 }
 
 .activity-feed-editor-container-new {
-  background-color: @grey-9;
-  border: 0.5px solid @grey-15;
+  background-color: var(--tw-color-bg-surface);
+  border: 1px solid var(--tw-color-border-subtle);
   border-radius: var(--om-radius-10);
   width: 100%;
 
   .ql-container {
-    background-color: @grey-9;
-    border: 1px solid @grey-15;
+    background-color: var(--tw-color-bg-surface);
+    border: none;
     width: 100%;
 
     &:focus-within {
-      border: 0.5px solid @grey-15;
+      outline: 1px solid var(--tw-color-border-brand);
+      outline-offset: -1px;
     }
   }
 
   .ql-toolbar {
-    background-color: @grey-9;
-    border: 1px solid @grey-15;
+    background-color: var(--tw-color-bg-surface);
+    border: none;
+    border-bottom: 1px solid var(--tw-color-border-subtle);
     flex-wrap: wrap;
 
     &:focus-within {
-      border: 0.5px solid @grey-15;
+      outline: 1px solid var(--tw-color-border-brand);
+      outline-offset: -1px;
     }
   }
 
   .ql-toolbar button {
-    color: var(--om-color-gray-true-800);
+    color: var(--tw-color-text-secondary);
   }
 }
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less
index e9f0410f24de..6344c0c92835 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less
@@ -506,19 +506,19 @@
 @media (pointer: coarse) {
   .ql-snow.ql-toolbar button:hover:not(.ql-active),
   .ql-snow .ql-toolbar button:hover:not(.ql-active) {
-    color: var(--om-legacy-color-444444);
+    color: var(--tw-color-text-secondary);
   }
   .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
   .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
   .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
   .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
-    fill: var(--om-legacy-color-444444);
+    fill: var(--tw-color-text-secondary);
   }
   .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
   .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
   .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
   .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
-    stroke: var(--om-legacy-color-444444);
+    stroke: var(--tw-color-text-secondary);
   }
 }
 .ql-snow {
@@ -556,20 +556,20 @@
 }
 .ql-snow .ql-stroke {
   fill: none;
-  stroke: var(--om-legacy-color-444444);
+  stroke: var(--tw-color-text-secondary);
   stroke-linecap: round;
   stroke-linejoin: round;
   stroke-width: 2;
 }
 .ql-snow .ql-stroke-miter {
   fill: none;
-  stroke: var(--om-legacy-color-444444);
+  stroke: var(--tw-color-text-secondary);
   stroke-miterlimit: 10;
   stroke-width: 2;
 }
 .ql-snow .ql-fill,
 .ql-snow .ql-stroke.ql-fill {
-  fill: var(--om-legacy-color-444444);
+  fill: var(--tw-color-text-secondary);
 }
 .ql-snow .ql-empty {
   fill: none;
@@ -643,7 +643,7 @@
   max-width: 100%;
 }
 .ql-snow .ql-picker {
-  color: var(--om-legacy-color-444444);
+  color: var(--tw-color-text-secondary);
   display: inline-block;
   font-size: var(--om-font-size-sm);
   font-weight: var(--om-font-weight-medium);
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less
index 86ea89949229..a1708b588e3b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less
@@ -38,10 +38,11 @@
 }
 .task-feed-card-v1-new {
   padding: var(--om-space-20);
-  background: @grey-9;
+  background: var(--tw-color-bg-surface);
+  box-shadow: var(--om-shadow-card);
   border-radius: var(--om-radius-xl);
   margin-bottom: var(--om-space-20);
-  border: 0.5px solid @grey-15;
+  border: 1px solid var(--tw-color-border-subtle);
 
   &.active {
     border-left: 4px solid @primary-color;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less
index 4598d16e979c..cefe096b44e9 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less
@@ -13,16 +13,16 @@
 @import (reference) '../../styles/variables.less';
 
 @border-radius: var(--om-radius-md);
-@border-color: var(--om-legacy-color-e8e8ed);
+@border-color: var(--tw-color-border-subtle);
 // Semantic surface so inline code, table headers and callouts follow dark mode
 // (the legacy #f8f8fa alias has no dark value).
 @markdown-bg-color: var(--om-color-bg-secondary);
-@hover-bg: var(--om-legacy-color-0-0-0-0-02);
+@hover-bg: var(--tw-color-bg-primary_hover);
 @callout-bg: var(--om-color-bg-secondary);
-@callout-warning-bg: var(--om-legacy-color-fff3dc);
-@callout-info-bg: @primary-1;
-@callout-danger-bg: var(--om-legacy-color-255-76-59-0-2);
-@callout-border: var(--om-legacy-color-afafc1);
+@callout-warning-bg: var(--tw-color-bg-warning-primary);
+@callout-info-bg: var(--tw-color-bg-brand-primary);
+@callout-danger-bg: var(--tw-color-bg-error-primary);
+@callout-border: var(--tw-color-border-subtle);
 
 .block-editor-wrapper {
   .om-block-editor > p:last-child {
@@ -94,7 +94,7 @@
     }
 
     a {
-      color: @primary-color;
+      color: var(--tw-color-text-link);
       text-decoration: none;
       line-height: 24px;
 
@@ -245,7 +245,8 @@
   }
 
   &.block-editor-wrapper--bar-menu {
-    border: 1px solid var(--tw-color-border-primary);
+    background: var(--tw-color-bg-surface);
+    border: 1px solid var(--tw-color-border-subtle);
     border-radius: var(--om-radius-sm);
 
     &:focus-within {
@@ -286,7 +287,7 @@
 }
 
 .menu-wrapper {
-  background-color: var(--tw-color-bg-primary);
+  background-color: var(--tw-color-bg-surface);
   display: flex;
   gap: var(--om-space-8);
   align-items: center;
@@ -304,7 +305,7 @@
 .slash-menu-wrapper {
   max-height: 300px;
   padding: var(--om-space-12) 0;
-  background-color: var(--tw-color-bg-primary);
+  background-color: var(--tw-color-bg-overlay-surface);
   border: @global-border;
   border-radius: @border-rad-base;
   overflow-y: auto;
@@ -329,7 +330,7 @@
   max-height: 300px;
   max-width: 300px;
   padding: var(--om-space-12) 0;
-  background-color: var(--tw-color-bg-primary);
+  background-color: var(--tw-color-bg-overlay-surface);
   border: @global-border;
   border-radius: @border-rad-base;
   overflow-y: auto;
@@ -449,10 +450,12 @@
 .is-format-active {
   .ant-typography,
   .format-label {
-    color: @primary-color;
+    color: var(--tw-color-text-link);
   }
   svg {
-    fill: @primary-color;
+    // Toolbar paths use currentColor, so the active state must set the foreground.
+    color: var(--tw-color-text-link);
+    fill: currentColor;
   }
 }
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx
index 33c4d587ad0b..de8c5c5f9855 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx
@@ -109,7 +109,7 @@ const ContextCenterLayout: React.FC<PropsWithChildren> = ({ children }) => {
   );
 
   return (
-    <div className="tw:flex tw:flex-col tw:h-full tw:overflow-auto">
+    <div className="tw:flex tw:flex-col tw:h-full tw:overflow-auto tw:bg-canvas">
       {/* Reloads the embedded page on a contextMemory/page change for the active CC route
           (registry → markRouteDirty); the layout, its modals and intents stay mounted. */}
       <LiveRefreshBoundary>{children}</LiveRefreshBoundary>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx
index ab48d4ee6a93..45f9f53034f2 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx
@@ -51,7 +51,7 @@ function RecentItem({
   return (
     <Box
       align="center"
-      className="tw:py-1.5 tw:cursor-pointer tw:rounded tw:hover:bg-primary_hover"
+      className="tw:px-2 tw:py-1.5 tw:cursor-pointer tw:rounded tw:hover:bg-primary_hover tw:focus-visible:bg-primary_hover"
       gap={2}
       role="button"
       tabIndex={0}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DashboardFoldersCard/DashboardFoldersCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DashboardFoldersCard/DashboardFoldersCard.component.tsx
index d5adc2f0f013..e19111a44083 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DashboardFoldersCard/DashboardFoldersCard.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DashboardFoldersCard/DashboardFoldersCard.component.tsx
@@ -160,7 +160,7 @@ const DashboardFoldersCard: FC<DashboardFoldersCardProps> = ({
                   justify="between">
                   <Box
                     align="center"
-                    className="tw:min-w-0 tw:flex-1 tw:cursor-pointer tw:rounded tw:hover:bg-primary_hover"
+                    className="tw:min-w-0 tw:flex-1 tw:cursor-pointer tw:rounded tw:px-2 tw:hover:bg-primary_hover tw:focus-visible:bg-primary_hover"
                     gap={2}
                     role="button"
                     tabIndex={0}
@@ -200,7 +200,7 @@ const DashboardFoldersCard: FC<DashboardFoldersCardProps> = ({
                   <Tree.ItemContent className="tw:ml-6!" showExpandIcon={false}>
                     <Box
                       align="center"
-                      className="tw:min-w-0 tw:flex-1 tw:cursor-pointer tw:rounded tw:hover:bg-primary_hover"
+                      className="tw:min-w-0 tw:flex-1 tw:cursor-pointer tw:rounded tw:px-2 tw:hover:bg-primary_hover tw:focus-visible:bg-primary_hover"
                       gap={2}
                       role="button"
                       tabIndex={0}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/MemoriesView/MemoriesView.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/MemoriesView/MemoriesView.component.tsx
index 649b1e4037b1..ac809e5c0da8 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/MemoriesView/MemoriesView.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/MemoriesView/MemoriesView.component.tsx
@@ -386,7 +386,10 @@ const MemoryRow: FC<MemoryRowProps> = ({
   return (
     <Box
       align="start"
-      className="tw:group tw:relative tw:px-5.5 tw:py-4.5 tw:border-b tw:border-secondary tw:last:border-b-0 tw:cursor-pointer tw:transition-colors tw:overflow-hidden"
+      className={[
+        'tw:group tw:relative tw:px-5.5 tw:py-4.5 tw:border-b tw:border-secondary tw:last:border-b-0',
+        'tw:cursor-pointer tw:transition-colors tw:overflow-hidden tw:hover:bg-primary_hover tw:focus-within:bg-primary_hover',
+      ].join(' ')}
       data-testid={`memory-row-${memory.id}`}
       gap={3}
       onClick={() => onViewMemory?.(memory)}>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx
index 92b1b216058b..7950a87fd824 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx
@@ -274,6 +274,7 @@ jest.mock('@openmetadata/ui-core-components', () => {
   });
 
   return {
+    ...jest.requireActual('@openmetadata/ui-core-components'),
     Owner: () => <div data-testid="owners-section">Owners Section</div>,
     Button: ({ children, onPress, onClick, ...rest }: any) => (
       <button onClick={onPress ?? onClick} {...rest}>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx
index 956128ff76c9..19f99dfb65ad 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx
@@ -17,6 +17,7 @@ import {
   Tabs,
   Typography,
 } from '@openmetadata/ui-core-components';
+import { Announcement02 as IconAnnouncementsBlack } from '@openmetadata/ui-core-components/icons';
 import { Button, Tooltip } from 'antd';
 import ButtonGroup from 'antd/lib/button/button-group';
 import { AxiosError } from 'axios';
@@ -25,7 +26,6 @@ import { toLower, toString } from 'lodash';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useNavigate } from 'react-router-dom';
-import { ReactComponent as IconAnnouncementsBlack } from '../../../assets/svg/announcements-black.svg';
 import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg';
 import { ReactComponent as DeleteIcon } from '../../../assets/svg/ic-delete.svg';
 import { ReactComponent as ExportIcon } from '../../../assets/svg/ic-export.svg';
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx
index 7223459f2bf1..f5013c0a9ee0 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx
@@ -165,7 +165,7 @@ const DataObservabilityTab = (props: TableProfilerProps) => {
   return (
     <TableProfilerProvider {...props}>
       <div
-        className="data-observability-tab-container tw:bg-surface"
+        className="data-observability-tab-container"
         data-testid="table-profiler-container"
         id="profilerDetails">
         <div className="tw:flex tw:items-center tw:justify-between">
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less
index 3d37dbde1db5..99e0f5aaeef0 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less
@@ -16,9 +16,9 @@
   height: 100%;
   flex-grow: 1;
   overflow-y: scroll;
-  border-radius: @border-rad-sm;
-  border: 1px solid @grey-15;
-  padding: @padding-lg;
+  // The entity tab already supplies the outer frame; only its child panels
+  // need card surfaces, otherwise the profiler becomes a card inside a card.
+  padding: 0;
 
   .data-observability-content-panel {
     margin-top: var(--om-space-30);
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx
index a358ac564aa0..49c3f31b4d7e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx
@@ -15,11 +15,13 @@ import { PlusOutlined } from '@ant-design/icons';
 import Icon from '@ant-design/icons/lib/components/Icon';
 import {
   Box,
+  Button as CoreButton,
   Grid,
+  SlideoutMenu,
   Toggle,
   Typography,
 } from '@openmetadata/ui-core-components';
-import { Button, Drawer, Input, InputNumber, Select, TreeSelect } from 'antd';
+import { Button, Input, InputNumber, Select, TreeSelect } from 'antd';
 import Form from 'antd/lib/form';
 import { FormProps, List } from 'antd/lib/form/Form';
 import { getLayoutGutter } from '../../../../../utils/common/layout.utils';
@@ -37,7 +39,6 @@ import {
   useState,
 } from 'react';
 import { useTranslation } from 'react-i18next';
-import { ReactComponent as CloseIcon } from '../../../../../assets/svg/close.svg';
 import { ReactComponent as IconDelete } from '../../../../../assets/svg/ic-delete.svg';
 import {
   DEFAULT_INCLUDE_PROFILE,
@@ -80,6 +81,10 @@ const SchemaEditor = withSuspenseFallback(
   lazy(() => import('../../../SchemaEditor/SchemaEditor'))
 );
 
+// Legacy dropdowns must stay inside the modal's focus and accessibility boundary.
+const getPopupContainer = (triggerNode: HTMLElement) =>
+  triggerNode.parentElement ?? document.body;
+
 const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
   tableId,
   columns,
@@ -479,16 +484,15 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
         className="layout-space layout-space-horizontal"
         gap={4}
         itemClassName="layout-space-item">
-        <Button type="link" onClick={handleCancel}>
+        <CoreButton color="secondary" onPress={handleCancel}>
           {t('label.cancel')}
-        </Button>
-        <Button
+        </CoreButton>
+        <CoreButton
           form="profiler-setting-form"
-          htmlType="submit"
-          loading={isLoading}
-          type="primary">
+          isLoading={isLoading}
+          type="submit">
           {t('label.save')}
-        </Button>
+        </CoreButton>
       </Box>
     </div>
   );
@@ -527,6 +531,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
                 autoFocus
                 className="w-full"
                 data-testid="profile-sample"
+                getPopupContainer={getPopupContainer}
                 options={PROFILE_SAMPLE_OPTIONS}
                 placeholder={t('label.please-select-entity', {
                   entity: t('label.profile-sample-type', {
@@ -614,6 +619,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
             className="w-full"
             data-testid="exclude-column-select"
             dropdownStyle={{ maxHeight: 200, overflowY: 'auto' }}
+            getPopupContainer={getPopupContainer}
             mode="multiple"
             options={columnOptions}
             placeholder={t('label.select-column-plural-to-exclude')}
@@ -673,6 +679,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
                               showSearch
                               className="w-full"
                               data-testid="include-column-select"
+                              getPopupContainer={getPopupContainer}
                               options={columnWithAllOption}
                               placeholder={t(
                                 'label.select-column-plural-to-include'
@@ -689,6 +696,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
                             <TreeSelect
                               treeCheckable
                               className="w-full"
+                              getPopupContainer={getPopupContainer}
                               maxTagCount={2}
                               placeholder={t('label.please-select')}
                               showCheckedStrategy="SHOW_PARENT"
@@ -756,6 +764,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
                     className="w-full"
                     data-testid="interval-type"
                     disabled={!state?.enablePartition}
+                    getPopupContainer={getPopupContainer}
                     options={INTERVAL_TYPE_OPTIONS}
                     placeholder={t('message.select-interval-type')}
                     size="middle"
@@ -790,6 +799,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
                     className="w-full"
                     data-testid="column-name"
                     disabled={!state?.enablePartition}
+                    getPopupContainer={getPopupContainer}
                     options={partitionColumnOptions}
                     placeholder={t('message.select-column-name')}
                     size="middle"
@@ -847,6 +857,7 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
                         className="w-full"
                         data-testid="select-interval-unit"
                         disabled={!state?.enablePartition}
+                        getPopupContainer={getPopupContainer}
                         options={INTERVAL_UNIT_OPTIONS}
                         placeholder={t('message.select-interval-unit')}
                         size="middle"
@@ -1006,28 +1017,26 @@ const ProfilerSettingsModal: React.FC<ProfilerSettingsModalProps> = ({
   );
 
   return (
-    <Drawer
-      destroyOnClose
-      className="custom-drawer-style profiler-settings-drawer"
-      closable={false}
+    <SlideoutMenu
+      aria-label={t('label.setting-plural')}
+      // Keep the overlay above positioned chart labels without covering form popovers.
+      className="profiler-settings-drawer tw:min-w-96 tw:z-50"
       data-testid="profiler-settings-modal"
-      extra={
-        <Button
-          className="drawer-close-icon flex-center"
-          icon={<CloseIcon />}
-          type="link"
-          onClick={handleCancel}
-        />
-      }
-      footer={drawerFooter}
-      maskClosable={false}
-      open={visible}
-      placement="right"
-      title={t('label.setting-plural')}
+      dialogClassName="tw:gap-0"
+      isDismissable={false}
+      isOpen={visible}
       width="40%"
-      onClose={handleCancel}>
-      {renderContent}
-    </Drawer>
+      onOpenChange={(isOpen) => !isOpen && handleCancel()}>
+      <SlideoutMenu.Header onClose={handleCancel}>
+        <Typography size="text-md" weight="semibold">
+          {t('label.setting-plural')}
+        </Typography>
+      </SlideoutMenu.Header>
+      <SlideoutMenu.Content className="tw:py-6">
+        {renderContent}
+      </SlideoutMenu.Content>
+      <SlideoutMenu.Footer>{drawerFooter}</SlideoutMenu.Footer>
+    </SlideoutMenu>
   );
 };
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less
index 9016ddd62459..e86a2d3bffca 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less
@@ -70,9 +70,8 @@
   .profiler-settings-drawer-content {
     flex: 1;
     overflow-y: auto;
-    padding-top: @padding-lg;
-    padding-right: @padding-sm;
-    padding-bottom: @padding-lg;
+    // The slideout content owns the gutters; nested padding narrows the form.
+    padding: 0;
 
     .delete-btn {
       &.ant-btn-icon-only {
@@ -83,7 +82,7 @@
   }
 
   .profiler-settings-form {
-    padding-right: @padding-sm;
+    padding-right: 0;
   }
 }
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx
index 019626243fa1..5afb5c95297f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx
@@ -11,12 +11,11 @@
  *  limitations under the License.
  */
 
-import { Card } from '@openmetadata/ui-core-components';
+import { ButtonUtility, Card } from '@openmetadata/ui-core-components';
+import { Copy01 } from '@openmetadata/ui-core-components/icons';
 import CodeMirror from '@uiw/react-codemirror';
-import { Button, Tooltip } from 'antd';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
-import { ReactComponent as CopyIcon } from '../../../assets/svg/copy-left.svg';
 import { JSON_TAB_SIZE } from '../../../constants/constants';
 import { CSMode } from '../../../enums/codemirror.enum';
 import { useClipboard } from '../../../hooks/useClipBoard';
@@ -75,10 +74,9 @@ const CodeEditor = ({
   const { onCopyToClipBoard, hasCopied } = useClipboard(internalValue);
 
   return (
-    // Light values reproduce the antd Card this replaced.
     <Card
       className={classNames(
-        'tw:overflow-visible tw:border-utility-gray-blue-100 tw:text-sm tw:leading-[1.5715] tw:text-primary tw:tabular-nums tw:dark:border-subtle',
+        'tw:overflow-visible tw:text-sm tw:leading-[1.5715] tw:text-primary tw:tabular-nums',
         className,
         'code-editor-new-style'
       )}
@@ -87,9 +85,8 @@ const CodeEditor = ({
         <div
           className={classNames(
             'tw:-mb-px tw:flex tw:min-h-7 tw:items-center tw:rounded-t-xl',
-            'tw:border-b tw:border-black/6 tw:bg-secondary tw:px-6 tw:text-base',
-            'tw:leading-[1.5715] tw:font-medium tw:text-black/85',
-            'tw:dark:border-secondary tw:dark:text-primary'
+            'tw:border-b tw:border-subtle tw:bg-secondary tw:px-6 tw:text-base',
+            'tw:leading-[1.5715] tw:font-medium tw:text-primary'
           )}>
           <div className="tw:inline-block tw:flex-1 tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap tw:[&_.ant-form-item-label]:p-0!">
             {title}
@@ -98,19 +95,17 @@ const CodeEditor = ({
             <div
               className="tw:ml-auto tw:text-sm tw:leading-[1.5715] tw:font-normal tw:text-primary"
               data-testid="copy-button-container">
-              <Tooltip
-                title={
+              <ButtonUtility
+                aria-label={t('message.copy-to-clipboard')}
+                color="tertiary"
+                data-testid="query-copy-button"
+                icon={Copy01}
+                size="sm"
+                tooltip={
                   hasCopied ? t('label.copied') : t('message.copy-to-clipboard')
-                }>
-                <Button
-                  className="flex-center"
-                  data-testid="query-copy-button"
-                  icon={<CopyIcon height={16} width={16} />}
-                  size="small"
-                  type="text"
-                  onClick={() => onCopyToClipBoard(internalValue)}
-                />
-              </Tooltip>
+                }
+                onClick={() => onCopyToClipBoard(internalValue)}
+              />
             </div>
           )}
         </div>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx
index eef1c45d76b4..32d3431dd919 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx
@@ -19,7 +19,10 @@ import {
   Tabs,
   Typography,
 } from '@openmetadata/ui-core-components';
-import { ChevronDown } from '@openmetadata/ui-core-components/icons';
+import {
+  Announcement02 as IconAnnouncementsBlack,
+  ChevronDown,
+} from '@openmetadata/ui-core-components/icons';
 import { Button, Tooltip } from 'antd';
 import ButtonGroup from 'antd/lib/button/button-group';
 import { AxiosError } from 'axios';
@@ -29,7 +32,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
-import { ReactComponent as IconAnnouncementsBlack } from '../../../assets/svg/announcements-black.svg';
 import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg';
 import { ReactComponent as DeleteIcon } from '../../../assets/svg/ic-delete.svg';
 import { ReactComponent as VersionIcon } from '../../../assets/svg/ic-version.svg';
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less b/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less
index e8db73d6de4f..6471fb90ba14 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less
@@ -13,14 +13,13 @@
 @import (reference) '../../styles/variables.less';
 
 .domain-page-container {
-  background-color: var(--tw-color-bg-primary);
-  border: 1px solid var(--tw-color-gray-blue-100);
+  background-color: var(--tw-color-bg-canvas);
   border-radius: var(--om-radius-md);
   margin-bottom: var(--om-space-20);
 
   .grid-container {
     background: none;
-    padding-right: var(--om-space-1);
+    padding-right: 0;
   }
 
   .resizable-panels-layout {
@@ -28,7 +27,7 @@
   }
 
   .assets-tab-container {
-    border: 1px solid var(--tw-color-gray-blue-100);
+    border: none;
   }
 
   .grid-container > #KnowledgePanel\.LeftPanel {
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx
index fe0526ca236b..0014fd62ab1e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx
@@ -330,11 +330,12 @@ const DomainListPage = ({ renderPageHeader }: DomainListPageProps) => {
 
       <Card
         className={classNames('tw:flex tw:min-h-0 tw:flex-1 tw:flex-col', {
+          'tw:bg-canvas': isAiMode,
           'tw:mb-5': !isAiMode,
           // Compact layout pads 8px; AI content sits on the 16px gutter.
           'tw:mx-2': isAiMode,
         })}
-        variant={isAiMode ? 'default' : 'elevated'}>
+        variant={isAiMode ? 'ghost' : 'elevated'}>
         <Box
           className="tw:px-6 tw:py-4 tw:border-b tw:border-secondary"
           direction="col"
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Entity/Task/TaskTab/task-tab-new.less b/openmetadata-ui/src/main/resources/ui/src/components/Entity/Task/TaskTab/task-tab-new.less
index e610c3cbe5df..ba0479a0424b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Entity/Task/TaskTab/task-tab-new.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Entity/Task/TaskTab/task-tab-new.less
@@ -47,7 +47,7 @@
   & a.ant-typography,
   & .ant-typography a,
   &.prose-typography {
-    color: @primary-heading-color;
+    color: var(--tw-color-text-link);
   }
 }
 .task-details-entity-link {
@@ -134,19 +134,19 @@
 .entity-type {
   font-size: var(--om-font-size-sm);
   font-weight: var(--om-font-weight-semibold);
-  color: @primary-heading-color;
+  color: var(--tw-color-text-link);
   line-height: 20px;
   &.ant-typography {
-    color: @primary-heading-color;
+    color: var(--tw-color-text-link);
   }
 }
 .entity-type.ant-typography {
-  color: @primary-heading-color;
+  color: var(--tw-color-text-link);
 }
 .entity-link {
   font-weight: var(--om-font-weight-semibold);
   line-height: 20px;
-  color: @primary-heading-color;
+  color: var(--tw-color-text-link);
 }
 .task-details {
   font-size: var(--om-font-size-sm);
@@ -157,15 +157,15 @@
 
 .diff-view-container-card {
   max-height: 200px;
-  border: 0.5px solid var(--om-color-gray-blue-100);
-  background: var(--om-color-bg-surface);
+  border: 0.5px solid var(--tw-color-border-secondary);
+  background: var(--tw-color-bg-surface);
   border-radius: var(--om-radius-lg);
 }
 .diff-view-container-card-right-panel {
   max-height: 400px;
-  background: @grey-9;
+  background: var(--tw-color-bg-surface);
   border-radius: var(--om-radius-xl);
-  border: 0.5px solid var(--om-color-gray-blue-100);
+  border: 0.5px solid var(--tw-color-border-secondary);
 }
 .task-tab-description-header {
   color: @text-color;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/entity-summary-panel.less b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/entity-summary-panel.less
index a45db1bcb6a3..6ed9fa9544bf 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/entity-summary-panel.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/entity-summary-panel.less
@@ -18,7 +18,7 @@
 .column-detail-panel-container {
   height: 100%;
   width: 100%;
-  background: var(--tw-color-bg-primary);
+  background: var(--tw-color-bg-canvas);
 
   &.explore {
     background: transparent;
@@ -27,7 +27,7 @@
   &.lineage,
   &.glossary-term-assets-tab,
   &.ontology-explorer {
-    background: var(--tw-color-utility-gray-blue-50);
+    background: var(--tw-color-bg-canvas);
   }
 
   &.explore,
@@ -53,7 +53,7 @@
     border-bottom: none !important;
     border-radius: var(--om-radius-lg) !important;
     display: flex;
-    border-color: @grey-38 !important;
+    border-color: var(--tw-color-border-subtle) !important;
     border-top: none !important;
 
     &.drawer-summary-panel-container {
@@ -155,8 +155,9 @@
   }
 
   .summary-panel-card {
-    background-color: @grey-9;
-    border: 0.5px solid @grey-15;
+    background-color: var(--tw-color-bg-surface);
+    border: 1px solid var(--tw-color-border-subtle);
+    box-shadow: var(--om-shadow-card);
   }
   .entity-icon {
     color: @primary-7;
@@ -182,7 +183,7 @@
     height: 49px;
     padding-left: var(--om-space-4);
     padding-right: var(--om-space-4);
-    background-color: @grey-9;
+    background-color: var(--tw-color-bg-surface);
     .d-flex {
       flex: 1;
       min-width: 0;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Modals/StyleModal/StyleModal.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Modals/StyleModal/StyleModal.component.tsx
index 537dbcbcc4ff..183904934e8b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/StyleModal/StyleModal.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/StyleModal/StyleModal.component.tsx
@@ -10,7 +10,14 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Form, FormProps, Input, Modal } from 'antd';
+import {
+  Button,
+  Dialog,
+  Input,
+  Modal,
+  ModalOverlay,
+} from '@openmetadata/ui-core-components';
+import { Form, FormProps } from 'antd';
 import { isUndefined, omit } from 'lodash';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
@@ -34,64 +41,77 @@ const StyleModal = ({ open, onCancel, onSubmit, style }: StyleModalProps) => {
   };
 
   return (
-    <Modal
-      cancelText={t('label.cancel')}
-      okButtonProps={{
-        form: 'style-modal',
-        htmlType: 'submit',
-        loading: saving,
-      }}
-      okText={t('label.save')}
-      open={open}
-      title={t('label.edit-entity', { entity: t('label.style') })}
-      onCancel={onCancel}>
-      <Form<StyleWithInput>
-        form={form}
-        id="style-modal"
-        initialValues={{
-          ...style,
-          colorInput: style?.color,
-        }}
-        layout="vertical"
-        onFinish={handleSubmit}
-        onValuesChange={(value) => {
-          if (!isUndefined(value.color)) {
-            form.setFieldValue('colorInput', value.color);
-          }
-          if (!isUndefined(value.colorInput)) {
-            form.setFieldValue('color', value.colorInput);
-          }
-        }}>
-        <Form.Item
-          label={
-            <FormItemLabel
-              align={{ targetOffset: [18, 0] }}
-              helperText={t('message.govern-url-size-message')}
-              label={t('label.icon-url')}
-              placement="topLeft"
-            />
-          }
-          name="iconURL">
-          <Input
-            data-testid="icon-url"
-            placeholder={t('label.enter-entity', {
-              entity: t('label.icon-url'),
-            })}
-          />
-        </Form.Item>
-        <Form.Item
-          label={t('label.color')}
-          name="color"
-          rules={[
-            {
-              pattern: HEX_COLOR_CODE_REGEX,
-              message: t('message.hex-color-validation'),
-            },
-          ]}>
-          <ColorPicker />
-        </Form.Item>
-      </Form>
-    </Modal>
+    <ModalOverlay
+      isDismissable={!saving}
+      isOpen={open}
+      onOpenChange={(isOpen) => !isOpen && !saving && onCancel()}>
+      <Modal>
+        <Dialog
+          showCloseButton
+          dividers="scroll"
+          title={t('label.edit-entity', { entity: t('label.style') })}
+          width={520}
+          onClose={() => !saving && onCancel()}>
+          <Dialog.Content>
+            <Form<StyleWithInput>
+              form={form}
+              id="style-modal"
+              initialValues={{
+                ...style,
+                colorInput: style?.color,
+              }}
+              layout="vertical"
+              onFinish={handleSubmit}
+              onValuesChange={(value) => {
+                if (!isUndefined(value.color)) {
+                  form.setFieldValue('colorInput', value.color);
+                }
+                if (!isUndefined(value.colorInput)) {
+                  form.setFieldValue('color', value.colorInput);
+                }
+              }}>
+              <Form.Item
+                label={
+                  <FormItemLabel
+                    align={{ targetOffset: [18, 0] }}
+                    helperText={t('message.govern-url-size-message')}
+                    label={t('label.icon-url')}
+                    placement="topLeft"
+                  />
+                }
+                name="iconURL">
+                <Input
+                  aria-label={t('label.icon-url')}
+                  inputDataTestId="icon-url"
+                  placeholder={t('label.enter-entity', {
+                    entity: t('label.icon-url'),
+                  })}
+                />
+              </Form.Item>
+              <Form.Item
+                label={t('label.color')}
+                name="color"
+                rules={[
+                  {
+                    pattern: HEX_COLOR_CODE_REGEX,
+                    message: t('message.hex-color-validation'),
+                  },
+                ]}>
+                <ColorPicker />
+              </Form.Item>
+            </Form>
+          </Dialog.Content>
+          <Dialog.Footer>
+            <Button color="secondary" isDisabled={saving} onPress={onCancel}>
+              {t('label.cancel')}
+            </Button>
+            <Button form="style-modal" isLoading={saving} type="submit">
+              {t('label.save')}
+            </Button>
+          </Dialog.Footer>
+        </Dialog>
+      </Modal>
+    </ModalOverlay>
   );
 };
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.test.tsx
index 5ad4a3dcc21c..f6338f441cbe 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.test.tsx
@@ -16,10 +16,6 @@ import { showErrorToast } from '../../utils/ToastUtils';
 import UploadFile from './UploadFile';
 import { UploadFileProps } from './UploadFile.interface';
 
-jest.mock('../../assets/svg/ic-drag-drop.svg', () => ({
-  ReactComponent: () => <div data-testid="import-icon">ImportIcon</div>,
-}));
-
 jest.mock('../common/Loader/Loader', () => {
   return jest.fn(() => <div data-testid="loader">Loading...</div>);
 });
@@ -42,7 +38,13 @@ describe('UploadFile Component', () => {
     render(<UploadFile {...defaultProps} />);
 
     expect(screen.getByTestId('upload-file-widget')).toBeInTheDocument();
-    expect(screen.getByTestId('import-icon')).toBeInTheDocument();
+
+    const uploadIcon = screen.getByRole('button').querySelector('svg');
+
+    expect(uploadIcon).toHaveClass('tw:text-fg-quaternary');
+    expect(uploadIcon).toHaveAttribute('stroke', 'currentColor');
+    expect(uploadIcon).toHaveAttribute('width', '86');
+    expect(uploadIcon).toHaveAttribute('height', '86');
     expect(
       await screen.findByText(/message.drag-and-drop-or-browse-csv-files-here/)
     ).toBeInTheDocument();
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.tsx b/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.tsx
index 27d1726ed85b..e8ecc107c881 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/UploadFile/UploadFile.tsx
@@ -19,7 +19,6 @@ import { AxiosError } from 'axios';
 import type { UploadRequestOption } from 'rc-upload/lib/interface';
 import { FC, useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { ReactComponent as ImportIcon } from '../../assets/svg/ic-drag-drop.svg';
 import { Transi18next } from '../../utils/i18next/LocalUtil';
 import { showErrorToast } from '../../utils/ToastUtils';
 import Loader from '../common/Loader/Loader';
@@ -110,7 +109,7 @@ const UploadFile: FC<UploadFileProps> = ({
             columnGap: 'var(--om-space-42)',
             rowGap: 'var(--om-space-42)',
           }}>
-          <ImportIcon height={86} width={86} />
+          <UploadCloud01 className="tw:text-fg-quaternary" size={86} />
           <Typography className="file-dragger-text">
             <Transi18next
               i18nKey="message.drag-and-drop-or-browse-csv-files-here"
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx
index b8564aff2fc6..c0692354e02b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx
@@ -138,7 +138,8 @@ export const CustomPropertyCard = ({
   return (
     <Card
       className={styles.card}
-      data-testid={`custom-property-${property.name}-card`}>
+      data-testid={`custom-property-${property.name}-card`}
+      variant="elevated">
       <Box
         className="tw:h-full"
         data-testid={property.name}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCardList.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCardList.tsx
index 5704d3677185..20dc5a51919f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCardList.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCardList.tsx
@@ -13,7 +13,6 @@
 import {
   Box,
   Button,
-  Card,
   Dropdown,
   Input,
   Typography,
@@ -78,7 +77,10 @@ export const CustomPropertyCardList = ({
   }, [properties, extension, searchText, sortMode, propertyLayout]);
 
   return (
-    <Card className="tw:p-4" data-testid="custom-properties-card">
+    <Box
+      className="tw:p-4"
+      data-testid="custom-properties-card"
+      direction="col">
       <Box direction="col" gap={4}>
         <Box align="center" gap={3} justify="between" wrap="wrap">
           <Input
@@ -165,6 +167,6 @@ export const CustomPropertyCardList = ({
           </Typography>
         )}
       </Box>
-    </Card>
+    </Box>
   );
 };
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/EntityDescription/Description.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/EntityDescription/Description.tsx
index cc647a8f6cd7..b917670dda9f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/EntityDescription/Description.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/EntityDescription/Description.tsx
@@ -303,7 +303,7 @@ const Description = ({
           className={
             isWidgetHeader
               ? 'tw:whitespace-nowrap tw:text-quaternary'
-              : 'tw:text-text-secondary'
+              : 'tw:text-secondary'
           }
           size="text-sm"
           weight="semibold">
@@ -325,7 +325,7 @@ const Description = ({
       <Box
         className={classNames(
           wrapInCard
-            ? 'tw:rounded-xl tw:border tw:border-secondary tw:bg-surface tw:p-[18px] tw:shadow-xs'
+            ? 'tw:rounded-xl tw:border tw:border-subtle tw:bg-surface tw:p-[18px] tw:shadow-card'
             : undefined,
           className
         )}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx
index bbcf923aa6e2..f9b198e2e9e5 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx
@@ -12,11 +12,13 @@
  */
 
 import {
+  Avatar,
   Button,
   CheckboxBase,
   Tooltip,
   TooltipTrigger,
 } from '@openmetadata/ui-core-components';
+import { XCircle } from '@openmetadata/ui-core-components/icons';
 import classNames from 'classnames';
 import { cloneDeep, isEmpty } from 'lodash';
 import VirtualList from 'rc-virtual-list';
@@ -28,7 +30,6 @@ import {
   useState,
 } from 'react';
 import { useTranslation } from 'react-i18next';
-import { ReactComponent as IconRemoveColored } from '../../../assets/svg/ic-remove-colored.svg';
 import {
   ADD_USER_CONTAINER_HEIGHT,
   pagingObject,
@@ -40,7 +41,6 @@ import { getEntityName } from '../../../utils/EntityNameUtils';
 import { isNearScrollBottom } from '../../../utils/ScrollUtils';
 import Loader from '../Loader/Loader';
 import Searchbar from '../SearchBarComponent/SearchBar.component';
-import { UserTag } from '../UserTag/UserTag.component';
 import { SelectableListProps } from './SelectableList.interface';
 
 const RemoveIcon = ({
@@ -69,7 +69,7 @@ const RemoveIcon = ({
             e.stopPropagation();
             removeOwner?.();
           }}>
-          <IconRemoveColored aria-hidden className="tw:size-4" />
+          <XCircle aria-hidden className="tw:size-4" />
         </button>
       </TooltipTrigger>
     </Tooltip>
@@ -326,11 +326,12 @@ export const SelectableList = ({
                   <button
                     className={classNames(
                       'selectable-list-item',
-                      'tw:flex tw:w-full tw:items-center tw:justify-between tw:px-2 tw:py-2 tw:rounded-md tw:cursor-pointer tw:select-none tw:bg-transparent tw:border-0 tw:text-left',
-                      'hover:tw:bg-secondary',
-                      'focus-visible:tw:outline-2 focus-visible:tw:outline-brand-500',
+                      'tw:flex tw:w-full tw:items-center tw:justify-between tw:px-2 tw:py-2 tw:rounded-md tw:cursor-pointer tw:select-none tw:border-0 tw:text-left',
+                      'tw:hover:bg-primary_hover',
+                      'tw:focus-visible:outline-2 tw:focus-visible:outline-focus-ring',
                       {
-                        'tw:bg-brand-50 active': checkActiveSelectedItem(item),
+                        'tw:bg-active active': checkActiveSelectedItem(item),
+                        'tw:bg-transparent': !checkActiveSelectedItem(item),
                       }
                     )}
                     data-testid="owner-option"
@@ -344,11 +345,17 @@ export const SelectableList = ({
                       {customTagRenderer ? (
                         customTagRenderer(item)
                       ) : (
-                        <UserTag
-                          avatarType="outlined"
-                          id={item.name ?? ''}
-                          name={getEntityName(item)}
-                        />
+                        <span className="tw:flex tw:min-w-0 tw:items-center tw:gap-2">
+                          <Avatar
+                            initials={getEntityName(item)
+                              .charAt(0)
+                              .toUpperCase()}
+                            size="xs"
+                          />
+                          <span className="tw:truncate tw:text-sm tw:text-primary">
+                            {getEntityName(item)}
+                          </span>
+                        </span>
                       )}
                     </div>
                     <div className="tw:flex tw:items-center tw:shrink-0 tw:ml-2">
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/SelectionCardGroup/selection-card-group.less b/openmetadata-ui/src/main/resources/ui/src/components/common/SelectionCardGroup/selection-card-group.less
index 32f50aa95f26..b2a9a1f0394d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/SelectionCardGroup/selection-card-group.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/SelectionCardGroup/selection-card-group.less
@@ -45,7 +45,7 @@
     border-radius: @border-rad-xs;
     cursor: pointer;
     transition: all var(--om-duration-300) ease;
-    background: var(--tw-color-bg-primary);
+    background: var(--tw-color-bg-surface);
     position: relative;
 
     .beta-badge {
@@ -140,25 +140,25 @@
     // Selected state styles
     &.selected,
     &:hover {
-      border-color: @primary-3;
-      background-color: @primary-50;
+      border-color: var(--tw-color-border-brand);
+      background-color: var(--tw-color-bg-brand-primary);
 
       .selection-content {
         .selection-icon {
-          background-color: @primary-1;
-          border: 6px solid @primary-50;
+          background-color: var(--tw-color-utility-brand-100);
+          border: 6px solid var(--tw-color-bg-brand-primary);
 
           svg {
-            color: @primary-6;
+            color: var(--tw-color-text-link);
           }
         }
 
         .selection-title {
-          color: @primary-8;
+          color: var(--tw-color-text-link);
         }
 
         .selection-description {
-          color: @primary-6;
+          color: var(--tw-color-text-link);
         }
 
         .custom-radio.unchecked {
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.test.ts b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.test.ts
index 4ab8e77c29b7..237683010565 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.test.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.test.ts
@@ -50,8 +50,12 @@ describe('resolveCellValue rawValue branch', () => {
 describe('sticky column background', () => {
   it('leaves body cells to the class so dark hover/selected can repaint them', () => {
     expect(getColumnStickyStyle('left', 1)).not.toHaveProperty('background');
-    expect(getStickyBodyCellClass('right')).toContain(
-      'tw:dark:group-hover:bg-secondary'
+    expect(getStickyBodyCellClass('right').split(' ')).toEqual(
+      expect.arrayContaining([
+        'tw:bg-surface',
+        'tw:group-hover:bg-secondary',
+        'tw:group-data-[selected]:bg-secondary',
+      ])
     );
     expect(getStickyBodyCellClass(undefined)).toBe('');
   });
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.ts b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.ts
index 6deae19ea7a8..2554c9fad89c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/TableV2Utils.ts
@@ -131,7 +131,7 @@ export function getStickyBodyCellClass(
   fixed: ColumnType<unknown>['fixed']
 ): string {
   return fixed === 'left' || fixed === 'right'
-    ? 'tw:bg-surface tw:dark:group-hover:bg-secondary tw:dark:group-data-[selected]:bg-secondary'
+    ? 'tw:bg-surface tw:group-hover:bg-secondary tw:group-data-[selected]:bg-secondary'
     : '';
 }
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx
index 8ff7392193b4..5573b483375e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx
@@ -10,7 +10,16 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Popover, Tabs } from '@openmetadata/ui-core-components';
+import {
+  Avatar,
+  ButtonUtility,
+  Popover,
+  Tabs,
+  Tag,
+  TagGroup,
+  TagList,
+} from '@openmetadata/ui-core-components';
+import { Edit02, Users01 } from '@openmetadata/ui-core-components/icons';
 import classNames from 'classnames';
 import { isArray, isEmpty, noop, toString } from 'lodash';
 import React, {
@@ -21,11 +30,8 @@ import React, {
   useState,
 } from 'react';
 import { useTranslation } from 'react-i18next';
-import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg';
-import { ReactComponent as IconTeamsGrey } from '../../../assets/svg/teams-grey.svg';
 import {
   ADD_USER_CONTAINER_HEIGHT,
-  DE_ACTIVE_COLOR,
   PAGE_SIZE_MEDIUM,
 } from '../../../constants/constants';
 import { EntityType } from '../../../enums/entity.enum';
@@ -39,16 +45,13 @@ import {
 import { getEntityName } from '../../../utils/EntityNameUtils';
 import { getEntityReferenceListFromEntities } from '../../../utils/EntityReferenceUtils';
 import { getTermQuery } from '../../../utils/SearchPureUtils';
-import { EditIconButton } from '../IconButtons/EditIconButton';
 import { SelectableList } from '../SelectableList/SelectableList.component';
-import { UserTag } from '../UserTag/UserTag.component';
-import { UserTagSize } from '../UserTag/UserTag.interface';
 import { UserSelectDropdownProps } from './UserTeamSelectableList.interface';
 
 export const TeamListItemRenderer = (props: EntityReference) => {
   return (
     <span className="tw:flex tw:items-center tw:gap-2">
-      <IconTeamsGrey aria-hidden className="tw:size-4" />
+      <Avatar placeholderIcon={Users01} size="xxs" />
       <span className="tw:text-sm">{getEntityName(props)}</span>
     </span>
   );
@@ -378,12 +381,12 @@ export const UserTeamSelectableList = ({
 
   const defaultTrigger = hasPermission ? (
     <span ref={triggerRef}>
-      <EditIconButton
-        newLook
+      <ButtonUtility
+        color="tertiary"
         data-testid={triggerDataTestId}
-        icon={<EditIcon color={DE_ACTIVE_COLOR} width="12px" />}
-        size="small"
-        title={getEditTriggerTitle()}
+        icon={Edit02}
+        size="xs"
+        tooltip={getEditTriggerTitle()}
         onClick={handleTriggerClick}
       />
     </span>
@@ -424,23 +427,26 @@ export const UserTeamSelectableList = ({
             entity: label ?? t('label.owner-plural'),
           })}
         </span>
-        <div className="tw:flex tw:flex-wrap tw:gap-1 tw:max-h-24 tw:overflow-y-auto">
-          {selectedUsers.map((user) => {
-            return (
-              <UserTag
-                closable
-                avatarType="outlined"
-                className="user-team-pills"
-                id={user.name ?? ''}
-                isTeam={user.type === EntityType.TEAM}
-                key={user.id}
-                name={getEntityName(user)}
-                size={UserTagSize.small}
-                onRemove={() => onRemove(user.id)}
-              />
-            );
-          })}
-        </div>
+        <TagGroup label={label ?? t('label.owner-plural')} size="sm">
+          <TagList className="tw:flex tw:max-h-24 tw:flex-wrap tw:gap-1 tw:overflow-y-auto">
+            {selectedUsers.map((user) => (
+              <Tag id={user.id} key={user.id} onClose={() => onRemove(user.id)}>
+                <Avatar
+                  initials={
+                    user.type === EntityType.TEAM
+                      ? undefined
+                      : getEntityName(user).charAt(0).toUpperCase()
+                  }
+                  placeholderIcon={
+                    user.type === EntityType.TEAM ? Users01 : undefined
+                  }
+                  size="xxs"
+                />
+                {getEntityName(user)}
+              </Tag>
+            ))}
+          </TagList>
+        </TagGroup>
       </div>
     ) : null;
 
@@ -514,7 +520,7 @@ export const UserTeamSelectableList = ({
       {triggerElement}
       <Popover
         containerClassName={classNames(
-          'tw:overflow-hidden tw:p-0',
+          'tw:max-h-[inherit] tw:overflow-y-auto tw:p-0',
           overlayClassName
         )}
         isOpen={isOpen}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx
index 345226ea300f..ec005b82ae12 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx
@@ -50,6 +50,7 @@ const ViewToggle: FC<ViewToggleProps> = ({
   return (
     <ButtonGroup
       disallowEmptySelection
+      className="tw:shrink-0"
       selectedKeys={new Set([value])}
       size="sm"
       onSelectionChange={(keys) => {
@@ -64,7 +65,7 @@ const ViewToggle: FC<ViewToggleProps> = ({
         return (
           <ButtonGroupItem
             aria-label={mode}
-            className={isActive ? '!tw:bg-brand-primary' : ''}
+            className={isActive ? 'tw:bg-brand-primary!' : ''}
             data-testid={`${mode}-view-toggle`}
             iconLeading={getIconElement(mode, isActive)}
             id={mode}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/observability/Alerts/AlertAiFormFields.constants.ts b/openmetadata-ui/src/main/resources/ui/src/components/observability/Alerts/AlertAiFormFields.constants.ts
index 873b884027d5..7e6420761987 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/observability/Alerts/AlertAiFormFields.constants.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/observability/Alerts/AlertAiFormFields.constants.ts
@@ -56,14 +56,14 @@ export const ALERT_AI_FORM_CLASS_NAMES = {
   removeButton:
     'tw:h-9 tw:w-9 tw:min-w-[36px] tw:shrink-0 tw:p-0 tw:hover:text-error-600 tw:hover:*:data-icon:text-error-600 tw:focus:text-error-600 tw:focus:*:data-icon:text-error-600',
   ruleArgumentsField: 'tw:mr-12 tw:w-auto',
-  ruleControlField: 'tw:w-full tw:max-w-[463px]',
-  ruleControlGroup: 'tw:w-full tw:max-w-[536px]',
+  ruleControlField: 'tw:w-full',
+  ruleControlGroup: 'tw:w-full',
   ruleControlGroupFull: 'tw:w-full',
   ruleControlRow: 'tw:w-full tw:items-end',
   sectionCard: 'tw:rounded-lg tw:bg-secondary tw:px-4 tw:py-3',
   sectionHeader: 'tw:gap-0.5',
   sectionRequiredMarker: 'tw:ml-0.5 tw:text-error-primary',
-  sectionRoot: 'tw:gap-1.5',
+  sectionRoot: 'tw:w-full tw:items-stretch tw:gap-1.5',
   teamUserHint: 'tw:mt-1 tw:text-sm tw:text-fg-error-secondary',
   teamUserSelectDropdown:
     'tw:absolute tw:z-50 tw:mt-1 tw:w-full tw:rounded-xl tw:border tw:border-secondary tw:bg-overlay-surface tw:p-2 tw:shadow-lg',
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/observability/IncidentManager/IncidentGroups/IncidentGroupsView.tsx b/openmetadata-ui/src/main/resources/ui/src/components/observability/IncidentManager/IncidentGroups/IncidentGroupsView.tsx
index 7c475bf8a5dc..70e4fe5081cf 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/observability/IncidentManager/IncidentGroups/IncidentGroupsView.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/observability/IncidentManager/IncidentGroups/IncidentGroupsView.tsx
@@ -422,7 +422,7 @@ const IncidentGroupsView = ({ canEditIncidents }: IncidentGroupsViewProps) => {
       direction="col">
       {detailKey === undefined ? (
         <>
-          <Box className="tw:items-center tw:justify-between tw:gap-2">
+          <Box className="tw:items-center tw:justify-between tw:gap-2 tw:py-2">
             {/* Kept when empty, so the dimension picker stays on the right. */}
             <Box align="center" gap={3}>
               {hasStats && (
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less b/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less
index 836f1e3e1085..0a06101c4e97 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less
@@ -1446,9 +1446,20 @@
       background: @ask-bg-active;
       color: @ask-brand-active;
 
+      // Visited links must keep the selected icon's foreground instead of
+      // inheriting the browser/legacy link accent through currentColor.
+      &:link,
+      &:visited,
+      &:focus,
       &:hover {
         color: @ask-brand-active;
       }
+
+      // Match expanded navigation: the icon owns its foreground so link-state
+      // colors cannot change a currentColor glyph when the pointer leaves.
+      svg {
+        color: @ask-brand-active;
+      }
     }
 
     svg {
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx
index 1bd73c306674..9e6ce0fbf114 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx
@@ -63,7 +63,7 @@ const ContextCenterAIContextDetailPage = () => {
 
   return (
     <div
-      className={`tw:flex tw:flex-col tw:w-full tw:h-full tw:overflow-hidden tw:bg-secondary ${contextCenterClassBase.getContainerClassName()}`}
+      className={`tw:flex tw:flex-col tw:w-full tw:h-full tw:overflow-hidden tw:bg-canvas ${contextCenterClassBase.getContainerClassName()}`}
       data-testid="context-center-ai-context-detail-page">
       <DocumentTitle title={personaName} />
       <PageLayout
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextPage.tsx
index 4342e8ee3d53..fb37ffe54d2e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextPage.tsx
@@ -131,7 +131,7 @@ const ContextCenterAIContextPage = () => {
 
   return (
     <div
-      className={`tw:flex tw:flex-col tw:w-full tw:h-full tw:overflow-hidden tw:bg-secondary ${contextCenterClassBase.getContainerClassName()}`}
+      className={`tw:flex tw:flex-col tw:w-full tw:h-full tw:overflow-hidden tw:bg-canvas ${contextCenterClassBase.getContainerClassName()}`}
       data-testid="context-center-ai-context-page">
       <DocumentTitle title={t('label.ai-context')} />
       <PageLayout
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx
index 2bc417109982..30a4684c51c8 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx
@@ -233,7 +233,7 @@ const ContextCenterArchivePage: FC = () => {
 
   return (
     <div
-      className={`tw:flex tw:flex-col tw:w-full tw:h-full tw:overflow-hidden tw:bg-secondary ${contextCenterClassBase.getContainerClassName()}`}
+      className={`tw:flex tw:flex-col tw:w-full tw:h-full tw:overflow-hidden tw:bg-canvas ${contextCenterClassBase.getContainerClassName()}`}
       data-testid="context-center-archive-page">
       <DocumentTitle title={t('label.archive')} />
       <PageLayout
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx
index f24e413f093a..d9e5abe72d41 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx
@@ -416,7 +416,7 @@ const ContextCenterDashboardPage: FC = () => {
 
   return (
     <div
-      className={`tw:flex tw:flex-col tw:w-full tw:bg-secondary tw:h-full ${contextCenterClassBase.getContainerClassName()}`}
+      className={`tw:flex tw:flex-col tw:w-full tw:bg-canvas tw:h-full ${contextCenterClassBase.getContainerClassName()}`}
       data-testid="context-center-dashboard-page">
       <DocumentTitle title={t('label.context-center')} />
       <PageLayout
@@ -602,7 +602,7 @@ const ContextCenterDashboardPage: FC = () => {
                     {recentlyViewedItems.map((item) => (
                       <Box
                         align="center"
-                        className="tw:cursor-pointer tw:rounded tw:py-1.5 tw:hover:bg-primary_hover"
+                        className="tw:cursor-pointer tw:rounded tw:px-2 tw:py-1.5 tw:hover:bg-primary_hover tw:focus-visible:bg-primary_hover"
                         gap={2}
                         key={item.id}
                         role="button"
@@ -671,7 +671,7 @@ const ContextCenterDashboardPage: FC = () => {
                     {mostCitedItems.map((item) => (
                       <Box
                         align="center"
-                        className="tw:cursor-pointer tw:rounded tw:py-1.5 tw:hover:bg-primary_hover"
+                        className="tw:cursor-pointer tw:rounded tw:px-2 tw:py-1.5 tw:hover:bg-primary_hover tw:focus-visible:bg-primary_hover"
                         gap={2}
                         key={item.id}
                         role="button"
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx
index 06221ef53086..056997786ead 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx
@@ -875,7 +875,7 @@ const ContextCenterDocumentsPage: FC = () => {
 
   return (
     <Box
-      className={`tw:w-full tw:h-full tw:bg-secondary ${contextCenterClassBase.getContainerClassName()}`}
+      className={`tw:w-full tw:h-full tw:bg-canvas ${contextCenterClassBase.getContainerClassName()}`}
       data-testid="context-center-documents-page"
       direction="col">
       <DocumentTitle title={t('label.document-plural')} />
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx
index e702e658debd..8395e4e28b02 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx
@@ -781,7 +781,7 @@ const ContextCenterMemoriesPage: FC = () => {
 
   return (
     <Box
-      className={`tw:w-full tw:h-full tw:bg-secondary tw:overflow-scroll ${contextCenterClassBase.getContainerClassName()}`}
+      className={`tw:w-full tw:h-full tw:bg-canvas tw:overflow-scroll ${contextCenterClassBase.getContainerClassName()}`}
       data-testid="context-center-memories-page"
       direction="col">
       <DocumentTitle title={t('label.memory-plural')} />
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DescriptionTabs.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DescriptionTabs.tsx
index 0c4d08c81b7e..028c215346d8 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DescriptionTabs.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DescriptionTabs.tsx
@@ -77,7 +77,7 @@ export const DescriptionTabs = ({
       </Tabs.List>
       <Tabs.Panel id="1">
         <Box
-          className="tw:mt-3 tw:rounded-md tw:border tw:border-primary tw:p-3"
+          className="tw:mt-3 tw:rounded-md tw:border tw:border-primary tw:bg-surface tw:p-3"
           direction="col">
           {description?.trim() ? (
             <RichTextEditorPreviewerV1
@@ -93,7 +93,7 @@ export const DescriptionTabs = ({
       </Tabs.Panel>
       <Tabs.Panel id="2">
         <DiffView
-          className="tw:mt-3 tw:rounded-md tw:border tw:border-primary tw:p-3"
+          className="tw:mt-3 tw:rounded-md tw:border tw:border-primary tw:bg-surface tw:p-3"
           diffArr={diffs}
         />
       </Tabs.Panel>
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DiffViewNew.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DiffViewNew.tsx
index b3e43bb9497e..e5d6c522dcda 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DiffViewNew.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/DiffViewNew.tsx
@@ -146,13 +146,11 @@ export const DiffViewNew = ({
       style={{
         ...(showDescTitle
           ? {
-              background: 'rgba(239, 244, 250, 0.25)',
               borderRadius: '12px',
             }
           : {
               padding: '20px',
               borderRadius: '8px',
-              background: 'white',
               margin: '16px 0px',
             }),
       }}>
diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/app.less b/openmetadata-ui/src/main/resources/ui/src/styles/app.less
index b3d9ef718bc4..97089e31f35d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/styles/app.less
+++ b/openmetadata-ui/src/main/resources/ui/src/styles/app.less
@@ -684,12 +684,10 @@ a[href].link-text-grey,
 /* Diff style */
 
 .diff-added {
-  // background: @success-background-color;
   width: fit-content;
-  color: @success-color;
 
   * {
-    color: @success-color;
+    color: var(--tw-color-utility-success-700);
   }
 }
 
@@ -702,7 +700,7 @@ a[href].link-text-grey,
   font-weight: var(--om-font-weight-regular);
   line-height: 20px;
   width: fit-content;
-  color: var(--om-legacy-color-027a48);
+  color: var(--tw-color-utility-success-700);
 }
 
 .diff-removed-new,
@@ -715,9 +713,9 @@ a[href].link-text-grey,
   width: fit-content;
   text-decoration: line-through;
   text-decoration-thickness: 1.5px;
-  text-decoration-color: var(--om-color-error-400);
+  text-decoration-color: var(--tw-color-utility-error-700);
   text-decoration-skip-ink: auto;
-  color: var(--om-color-error-400);
+  color: var(--tw-color-utility-error-700);
 }
 
 .diff-normal-new {
@@ -731,8 +729,7 @@ a[href].link-text-grey,
 
 .diff-normal-new strong {
   font-weight: var(--om-font-weight-semibold);
-  color: var(--om-color-black);
-  /* Adjust color if needed */
+  color: var(--tw-color-text-primary);
 }
 
 .clamp-text-2 {
diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/components/code-mirror.less b/openmetadata-ui/src/main/resources/ui/src/styles/components/code-mirror.less
index f3414f82a9e9..f21487a6381d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/styles/components/code-mirror.less
+++ b/openmetadata-ui/src/main/resources/ui/src/styles/components/code-mirror.less
@@ -52,7 +52,7 @@
   height: auto !important;
 }
 .custom-query-editor {
-  border: @global-border;
+  border: 1px solid var(--tw-color-border-subtle);
   border-radius: @border-rad-base;
   .cm-editor {
     border-radius: @border-rad-base;
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/TestCaseUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/TestCaseUtils.tsx
index 7b2f78813a3c..d51f4f00b044 100644
--- a/openmetadata-ui/src/main/resources/ui/src/utils/TestCaseUtils.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/TestCaseUtils.tsx
@@ -12,13 +12,13 @@
  */
 
 import { Typography } from '@openmetadata/ui-core-components';
+import { Upload01 as ImportIcon } from '@openmetadata/ui-core-components/icons';
 import { ItemType } from 'antd/lib/menu/hooks/useItems';
 import { lowerCase } from 'lodash';
 import type { ReactElement, ReactNode } from 'react';
 import { NavigateFunction } from 'react-router-dom';
 import { ReactComponent as IconEdit } from '../assets/svg/edit-new.svg';
 import { ReactComponent as ExportIcon } from '../assets/svg/ic-export.svg';
-import { ReactComponent as ImportIcon } from '../assets/svg/ic-import.svg';
 import { ManageButtonItemLabel } from '../components/common/ManageButtonContentItem/ManageButtonContentItem.component';
 import { ManageMenuItem } from '../components/common/ManageMenuButton/ManageMenuButton.component';
 import { ExportData } from '../components/Entity/EntityExportModalProvider/EntityExportModalProvider.interface';