diff --git a/packages/ui/components/Typography.wrn b/packages/ui/components/Typography.wrn
index c9ffb477..a94134a3 100644
--- a/packages/ui/components/Typography.wrn
+++ b/packages/ui/components/Typography.wrn
@@ -87,24 +87,30 @@ component Typography {
       break-after: avoid;
     }
 
-    .wrn-typography :where(h1) { font-size: clamp(2rem, 4vw, 3.5rem); margin: 0 0 1.5rem; }
-    .wrn-typography :where(h2) { font-size: clamp(1.5rem, 3vw, 2.25rem); margin: 2.5rem 0 1rem; }
-    .wrn-typography :where(h3) { font-size: 1.35rem; margin: 2rem 0 0.75rem; }
-    .wrn-typography :where(p, ul, ol, blockquote, pre, table) { margin: 1rem 0; }
-    .wrn-typography :where(p, li) { color: var(--wrn-color-text-muted); line-height: 1.8; }
-    .wrn-typography :where(a) { color: var(--wrn-color-primary); font-weight: 600; text-underline-offset: 0.2em; }
-    .wrn-typography :where(a:hover) { color: var(--wrn-color-primary-hover); text-decoration: underline; }
-    .wrn-typography :where(ul, ol) { padding-left: 1.4rem; }
-    .wrn-typography :where(ul) { list-style: disc; }
-    .wrn-typography :where(ol) { list-style: decimal; }
-    .wrn-typography :where(blockquote) {
+    /* Prose styles apply to raw markup only. Every nested UI component renders
+       inside a `.wrn-component` wrapper, so excluding that subtree stops these
+       element rules from doubling up on a component's own styling — a nested
+       <Blockquote> otherwise drew two left borders, its own plus this one.
+       The exclusion lives inside :where() so specificity stays at zero and an
+       application can still override any of these with a plain class. */
+    .wrn-typography :where(h1):not(:where(.wrn-typography .wrn-component *)) { font-size: clamp(2rem, 4vw, 3.5rem); margin: 0 0 1.5rem; }
+    .wrn-typography :where(h2):not(:where(.wrn-typography .wrn-component *)) { font-size: clamp(1.5rem, 3vw, 2.25rem); margin: 2.5rem 0 1rem; }
+    .wrn-typography :where(h3):not(:where(.wrn-typography .wrn-component *)) { font-size: 1.35rem; margin: 2rem 0 0.75rem; }
+    .wrn-typography :where(p, ul, ol, blockquote, pre, table):not(:where(.wrn-typography .wrn-component *)) { margin: 1rem 0; }
+    .wrn-typography :where(p, li):not(:where(.wrn-typography .wrn-component *)) { color: var(--wrn-color-text-muted); line-height: 1.8; }
+    .wrn-typography :where(a):not(:where(.wrn-typography .wrn-component *)) { color: var(--wrn-color-primary); font-weight: 600; text-underline-offset: 0.2em; }
+    .wrn-typography :where(a:hover):not(:where(.wrn-typography .wrn-component *)) { color: var(--wrn-color-primary-hover); text-decoration: underline; }
+    .wrn-typography :where(ul, ol):not(:where(.wrn-typography .wrn-component *)) { padding-left: 1.4rem; }
+    .wrn-typography :where(ul):not(:where(.wrn-typography .wrn-component *)) { list-style: disc; }
+    .wrn-typography :where(ol):not(:where(.wrn-typography .wrn-component *)) { list-style: decimal; }
+    .wrn-typography :where(blockquote):not(:where(.wrn-typography .wrn-component *)) {
       border-left: 4px solid var(--wrn-color-primary);
       background: var(--wrn-color-primary-soft);
       border-radius: 0 0.75rem 0.75rem 0;
       padding: 1rem 1.25rem;
       color: var(--wrn-color-text);
     }
-    .wrn-typography :where(code) {
+    .wrn-typography :where(code):not(:where(.wrn-typography .wrn-component *)) {
       border-radius: 0.35rem;
       background: var(--wrn-color-surface-soft);
       padding: 0.15rem 0.35rem;