Fix button alignment issue in three-layer architecture

- Move padding from .insertr-button-frame to .insertr-style-btn.insertr-style-preview
- Add align-items and justify-content to button container for proper centering
- Remove width: 100% from button frame to prevent unnecessary stretching
- Fix off-center text in default Bold, Italic, and Link buttons
- Maintain style isolation while ensuring consistent button alignment

internal/content/assets/insertr.css

@@ -376,14 +376,16 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     background: var(--insertr-bg-primary) !important;
     border: 1px solid var(--insertr-border-color) !important;
     border-radius: var(--insertr-border-radius) !important;
-    padding: 0 !important; /* Let frame handle padding */
+    padding: 6px 10px !important; /* Move padding to button level */
     font-size: var(--insertr-font-size-sm);
     cursor: pointer;
     transition: var(--insertr-transition);
     
-    /* Fixed button dimensions */
+    /* Fixed button dimensions and layout */
     min-height: 32px;
     display: inline-flex;
+    align-items: center;
+    justify-content: center;
     
     /* Reset button-level text properties to prevent inheritance */
     font-family: var(--insertr-font-family);
@@ -393,13 +395,11 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     color: var(--insertr-text-primary);
 }
 
-/* Button frame - consistent internal layout immune to content styling */
+/* Button frame - minimal layout container with no padding */
 .insertr-button-frame {
-    display: flex;
+    display: inline-flex;
     align-items: center;
     justify-content: center;
-    padding: 6px 10px;
-    width: 100%;
     
     /* Create style containment boundary */
     contain: layout style;
@@ -417,10 +417,6 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     text-overflow: ellipsis;
     white-space: nowrap;
     
-    /* Reset any browser default margins/padding that could cause inconsistency */
-    margin: 0;
-    padding: 0;
-    
     /* All other styling (color, weight, transform, decoration, etc.) 
        comes from applied classes - no interference */
 }
@@ -428,9 +424,6 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
 /* Fallback styling when no meaningful classes are detected */
 .insertr-style-sample.insertr-fallback-style {
     color: var(--insertr-text-primary);
-    /* Ensure consistent text appearance for action buttons */
-    font-size: inherit;
-    font-weight: inherit;
 }
 
 /* Hover state for preview buttons - subtle visual feedback */
@@ -495,7 +488,13 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     box-shadow: 0 1px 2px rgba(23, 162, 184, 0.2);
 }
 
-/* Legacy class - no longer used with three-layer button architecture */
+/* Default preview content styling */
+.insertr-default-preview {
+    font-size: var(--insertr-font-size-sm);
+    font-weight: 500;
+    padding: var(--insertr-spacing-xs) var(--insertr-spacing-sm);
+    display: inline-block;
+}
 
 /* Small indicator for default styles */
 .insertr-style-btn.insertr-default-style::after {

lib/src/styles/insertr.css

@@ -376,14 +376,16 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     background: var(--insertr-bg-primary) !important;
     border: 1px solid var(--insertr-border-color) !important;
     border-radius: var(--insertr-border-radius) !important;
-    padding: 0 !important; /* Let frame handle padding */
+    padding: 6px 10px !important; /* Move padding to button level */
     font-size: var(--insertr-font-size-sm);
     cursor: pointer;
     transition: var(--insertr-transition);
     
-    /* Fixed button dimensions */
+    /* Fixed button dimensions and layout */
     min-height: 32px;
     display: inline-flex;
+    align-items: center;
+    justify-content: center;
     
     /* Reset button-level text properties to prevent inheritance */
     font-family: var(--insertr-font-family);
@@ -393,13 +395,11 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     color: var(--insertr-text-primary);
 }
 
-/* Button frame - consistent internal layout immune to content styling */
+/* Button frame - minimal layout container with no padding */
 .insertr-button-frame {
-    display: flex;
+    display: inline-flex;
     align-items: center;
     justify-content: center;
-    padding: 6px 10px;
-    width: 100%;
     
     /* Create style containment boundary */
     contain: layout style;
@@ -417,10 +417,6 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     text-overflow: ellipsis;
     white-space: nowrap;
     
-    /* Reset any browser default margins/padding that could cause inconsistency */
-    margin: 0;
-    padding: 0;
-    
     /* All other styling (color, weight, transform, decoration, etc.) 
        comes from applied classes - no interference */
 }
@@ -428,9 +424,6 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
 /* Fallback styling when no meaningful classes are detected */
 .insertr-style-sample.insertr-fallback-style {
     color: var(--insertr-text-primary);
-    /* Ensure consistent text appearance for action buttons */
-    font-size: inherit;
-    font-weight: inherit;
 }
 
 /* Hover state for preview buttons - subtle visual feedback */
@@ -495,7 +488,13 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     box-shadow: 0 1px 2px rgba(23, 162, 184, 0.2);
 }
 
-/* Legacy class - no longer used with three-layer button architecture */
+/* Default preview content styling */
+.insertr-default-preview {
+    font-size: var(--insertr-font-size-sm);
+    font-weight: 500;
+    padding: var(--insertr-spacing-xs) var(--insertr-spacing-sm);
+    display: inline-block;
+}
 
 /* Small indicator for default styles */
 .insertr-style-btn.insertr-default-style::after {