diff --git a/src/components/chat/chat.spec.ts b/src/components/chat/chat.spec.ts
index 5c9d3b033..d113fb675 100644
--- a/src/components/chat/chat.spec.ts
+++ b/src/components/chat/chat.spec.ts
@@ -1071,6 +1071,11 @@ describe('Chat', () => {
       const styles = document.createElement('style');
       styles.setAttribute('id', 'adopt-styles-test');
       styles.innerHTML = `
+        .custom-background {
+          background-color: rgb(255, 255, 0);
+        }
+
+        /* override */
         .custom-background {
           background-color: rgb(255, 0, 0);
         }
diff --git a/src/components/common/controllers/adopt-styles.ts b/src/components/common/controllers/adopt-styles.ts
index 5d52a0321..d2370cdb3 100644
--- a/src/components/common/controllers/adopt-styles.ts
+++ b/src/components/common/controllers/adopt-styles.ts
@@ -172,7 +172,8 @@ class AdoptedStylesController implements ReactiveController {
           }
 
           try {
-            constructed.insertRule(rule.cssText);
+            // insert last to keep rules/override order:
+            constructed.insertRule(rule.cssText, constructed.cssRules.length);
             hasRules = true;
           } catch {
             // Skip rules that cannot be cloned (e.g., invalid syntax)