diff --git a/webui/index.html b/webui/index.html
index f9c2507a..e9791098 100644
--- a/webui/index.html
+++ b/webui/index.html
@@ -651,7 +651,7 @@
diff --git a/webui/static/style.css b/webui/static/style.css
index cea5ca67..42325850 100644
--- a/webui/static/style.css
+++ b/webui/static/style.css
@@ -64905,6 +64905,7 @@ body.reduce-effects .dash-card::after {
background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.9), rgba(var(--accent-rgb), 0.55));
box-shadow: 0 0 12px rgba(var(--accent-rgb), 0.5);
}
+.em-manage-btn-logo { width: 22px; height: 22px; object-fit: contain; display: block; }
.em-manage-btn-label { background: linear-gradient(90deg, #fff, rgba(255,255,255,0.85)); -webkit-background-clip: text; background-clip: text; }
.enrichment-manager-modal {
diff --git a/webui/static/worker-orbs.js b/webui/static/worker-orbs.js
index ad91a09d..1901a129 100644
--- a/webui/static/worker-orbs.js
+++ b/webui/static/worker-orbs.js
@@ -591,12 +591,16 @@
ctx.fill();
if (hubImageReady) {
- // SoulSync logo as the nucleus — sized to the pulsing radius,
- // brightness lifts a touch with energy
- const imgSize = hubR * 3.2;
+ // SoulSync logo as the nucleus — fit to the pulsing radius while
+ // preserving the image's natural aspect ratio (no stretch)
+ const natW = hubImage.naturalWidth || 1;
+ const natH = hubImage.naturalHeight || 1;
+ const fit = (hubR * 3.2) / Math.max(natW, natH);
+ const dw = natW * fit;
+ const dh = natH * fit;
ctx.save();
ctx.globalAlpha = Math.min(1, 0.85 + energy * 0.15 + slow * 0.1);
- ctx.drawImage(hubImage, orb.x - imgSize / 2, orb.y - imgSize / 2, imgSize, imgSize);
+ ctx.drawImage(hubImage, orb.x - dw / 2, orb.y - dh / 2, dw, dh);
ctx.restore();
} else {
// Fallback while the logo loads: solid bright core + highlight