feat: implement Phase 3 container transformation with CLASSES.md compliance

- Add backend container transformation in engine.go following syntactic sugar specification
- Containers with .insertr get class removed and viable children get .insertr added
- Remove incorrect frontend container expansion - frontend only finds enhanced elements
- Fix StyleAwareEditor hasMultiPropertyElements runtime error
- Add addClass/removeClass methods to ContentEngine for class manipulation
- Update frontend to match HTML-first approach with no runtime container logic
- Test verified: container <section class='insertr'> transforms to individual h1.insertr, p.insertr, button.insertr

This completes the container expansion functionality per CLASSES.md:
Developer convenience (one .insertr enables section editing) + granular control (individual element editing)

lib/src/styles/insertr.css

@@ -370,16 +370,16 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     transform: translateY(1px);
 }
 
-/* Style preview buttons - styled dynamically via JavaScript */
+/* Style preview buttons - new approach using CSS isolation */
 .insertr-style-btn.insertr-style-preview {
-    /* Preserve button structure */
-    background: var(--insertr-bg-primary) !important;
-    border: 1px solid var(--insertr-border-color) !important;
-    border-radius: var(--insertr-border-radius) !important;
-    padding: var(--insertr-spacing-xs) var(--insertr-spacing-sm) !important;
-    font-size: var(--insertr-font-size-sm) !important;
-    cursor: pointer !important;
-    transition: var(--insertr-transition) !important;
+    /* Clean button container - minimal styling */
+    background: var(--insertr-bg-primary);
+    border: 1px solid var(--insertr-border-color);
+    border-radius: var(--insertr-border-radius);
+    padding: 0; /* Remove padding - let preview content handle it */
+    font-size: var(--insertr-font-size-sm);
+    cursor: pointer;
+    transition: var(--insertr-transition);
     
     /* Button layout */
     min-height: 28px;
@@ -387,37 +387,59 @@ body:not(.insertr-edit-mode) .insertr-editing-hover::after {
     align-items: center;
     justify-content: center;
     
-    /* Ensure button remains clickable */
-    position: relative;
+    /* Reset any inherited text styles on the button container only */
+    font-family: var(--insertr-font-family);
+    text-decoration: none;
+    font-weight: normal;
+    text-transform: none;
     
-    /* Styles will be applied dynamically via JavaScript */
+    /* Don't set color here - let the preview content inherit naturally */
+    
+    /* Ensure content fits */
+    overflow: hidden;
 }
 
-/* Add subtle background to preview buttons to ensure they remain clickable-looking */
-.insertr-style-btn.insertr-style-preview::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background: var(--insertr-bg-primary);
-    opacity: 0.9;
-    border-radius: inherit;
-    z-index: -1;
+/* Preview content container - minimal interference with original styling */
+.insertr-preview-content {
+    /* Allow the original classes to style this element completely naturally */
+    display: inline-block;
+    
+    /* Only set essential layout properties */
+    box-sizing: border-box;
+    
+    /* Ensure text fits within button */
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 120px;
+    
+    /* Inherit font size from button container */
+    font-size: inherit;
+    
+    /* Remove browser defaults that might interfere - but don't override intentional styling */
+    border: none;
+    margin: 0;
+    
+    /* NO background, color, padding defaults - let the classes handle everything */
 }
 
-/* Hover state for preview buttons */
+/* Minimal fallback styling when no meaningful classes are detected */
+.insertr-preview-content.insertr-fallback-style {
+    padding: var(--insertr-spacing-xs) var(--insertr-spacing-sm);
+    color: var(--insertr-text-primary);
+}
+
+/* Hover state for preview buttons - subtle visual feedback */
 .insertr-style-btn.insertr-style-preview:hover {
-    background: var(--insertr-bg-secondary) !important;
-    border-color: var(--insertr-text-muted) !important;
-    transform: none !important;
+    border-color: var(--insertr-text-muted);
+    transform: translateY(-1px);
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 
 /* Active state for preview buttons */
 .insertr-style-btn.insertr-style-preview:active {
-    background: var(--insertr-border-color) !important;
-    transform: translateY(1px) !important;
+    transform: translateY(0);
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
 }
 
 /* Editor components */