diff --git a/design-system/packages/ui/src/components/Button/Button.module.css b/design-system/packages/ui/src/components/Button/Button.module.css
index 643869ff5d..519dbc413e 100644
--- a/design-system/packages/ui/src/components/Button/Button.module.css
+++ b/design-system/packages/ui/src/components/Button/Button.module.css
@@ -16,6 +16,9 @@
     --_button-trailing-icon-size: 14px;
 
     position: relative;
+    /* The component owns its surface; suppress native WebKit button highlights. */
+    -webkit-appearance: none;
+    appearance: none;
     display: inline-flex;
     align-items: center;
     justify-content: center;
@@ -293,6 +296,11 @@
   }
 
   @media (prefers-reduced-motion: reduce) {
+    .button,
+    .button::before {
+      transition: none;
+    }
+
     .button[data-loading="true"] .progress {
       animation: none;
       border-inline-end-color: currentColor;
diff --git a/design-system/packages/ui/src/components/IconButton/IconButton.module.css b/design-system/packages/ui/src/components/IconButton/IconButton.module.css
index 5de42e6f72..b59cd67b1d 100644
--- a/design-system/packages/ui/src/components/IconButton/IconButton.module.css
+++ b/design-system/packages/ui/src/components/IconButton/IconButton.module.css
@@ -8,6 +8,9 @@
     --_icon-button-size: var(--openbitfun-control-height-sm);
 
     position: relative;
+    /* Match Button: the pseudo-element owns hover feedback, not the native control. */
+    -webkit-appearance: none;
+    appearance: none;
     box-sizing: border-box;
     display: inline-flex;
     flex: 0 0 auto;
@@ -175,6 +178,7 @@
 
   @media (prefers-reduced-motion: reduce) {
     .button,
+    .button::before,
     .progress {
       transition: none;
     }