fix(image-radius): split out 3x-scale IMAGE_RADIUS_PRESETS for the image picker

Image radii need to be visibly larger than the radius scale that works for
buttons/containers — at typical photo dimensions, 16px reads as nearly
square. Add an image-specific scale at 3x the shared values (S=24px,
M=48px, L=96px) and route ImageStylePanel through it. Other components
(buttons, sections, containers) keep RADIUS_PRESETS unchanged.

Note: this commit also bundles unrelated pre-existing working-tree changes
in the legacy GrapesJS site-builder root (CLAUDE.md, index.html,
css/editor.css, js/assets.js, js/editor.js, js/whp-integration.js) that
were inadvertently picked up by an earlier `git add -u`. The image-radius
change is the only intentional content of this commit; the rest is
in-progress legacy work that happened to be sitting uncommitted.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

css/editor.css

@@ -92,6 +92,26 @@ html, body {
     background: #2563eb;
 }
 
+.nav-btn.nav-btn-live {
+    background: #059669;
+    border-color: #059669;
+    color: #fff;
+}
+
+.nav-btn.nav-btn-live:hover {
+    background: #047857;
+}
+
+.nav-btn.nav-btn-coming-soon {
+    background: #d97706;
+    border-color: #d97706;
+    color: #fff;
+}
+
+.nav-btn.nav-btn-coming-soon:hover {
+    background: #b45309;
+}
+
 .divider {
     width: 1px;
     height: 24px;
@@ -116,6 +136,7 @@ html, body {
 }
 
 .panel-right {
+    width: 320px;
     border-right: none;
     border-left: 1px solid #2d2d3a;
 }
@@ -301,6 +322,52 @@ html, body {
 }
 
 /* Size/Spacing/Radius/Thickness Presets */
+/* Hide GrapesJS default panel buttons and views that conflict with our custom UI */
+.gjs-pn-views,
+.gjs-pn-views-container,
+.gjs-pn-commands {
+    display: none !important;
+}
+
+/* Ensure the GrapesJS editor fills all available width */
+.gjs-editor-cont {
+    width: 100% !important;
+}
+
+.gjs-cv-canvas {
+    width: 100% !important;
+    left: 0 !important;
+}
+
+.alignment-presets {
+    display: flex;
+    gap: 4px;
+}
+
+.alignment-preset {
+    flex: 1;
+    padding: 8px 4px;
+    background: #2d2d3a;
+    border: 1px solid #3f3f46;
+    border-radius: 4px;
+    color: #a1a1aa;
+    cursor: pointer;
+    font-size: 14px;
+    text-align: center;
+    transition: all 0.2s;
+}
+
+.alignment-preset:hover {
+    background: #3f3f46;
+    color: #e4e4e7;
+}
+
+.alignment-preset.active {
+    background: #3b82f6;
+    border-color: #3b82f6;
+    color: #fff;
+}
+
 .size-presets, .spacing-presets, .radius-presets, .thickness-presets {
     display: flex;
     gap: 4px;
@@ -1650,6 +1717,7 @@ html, body {
 .asset-browser-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
+    grid-auto-rows: min-content;
     gap: 10px;
     padding: 16px;
     max-height: 400px;
@@ -1670,6 +1738,13 @@ html, body {
     transition: all 0.15s;
 }
 
+.asset-browser-item img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    display: block;
+}
+
 .asset-browser-item:hover {
     border-color: #3b82f6;
     transform: scale(1.02);