diff --git a/frontend/src/App.css b/frontend/src/App.css
index 95806f97..e9e09ffa 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -411,6 +411,10 @@ body[data-theme='light'] .redis-viewer-workbench .ant-radio-button-wrapper-check
}
/* Custom Title Bar Close Button Hover */
+body[data-platform='windows'] .titlebar-window-controls {
+ gap: 4px;
+}
+
.titlebar-close-btn:hover {
background-color: #ff4d4f !important;
color: #fff !important;
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 673ddfcc..3b334359 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -7111,6 +7111,7 @@ function App() {
) : (
e.stopPropagation()}
style={{ display: 'flex', height: '100%', WebkitAppRegion: 'no-drag', '--wails-draggable': 'no-drag' } as any}
diff --git a/frontend/src/App.window-controls-spacing.test.ts b/frontend/src/App.window-controls-spacing.test.ts
new file mode 100644
index 00000000..37ce25d9
--- /dev/null
+++ b/frontend/src/App.window-controls-spacing.test.ts
@@ -0,0 +1,15 @@
+import { readFileSync } from 'node:fs';
+import { describe, expect, it } from 'vitest';
+
+const appSource = readFileSync(new URL('./App.tsx', import.meta.url), 'utf8');
+const appCssSource = readFileSync(new URL('./App.css', import.meta.url), 'utf8');
+
+describe('Windows titlebar window controls spacing', () => {
+ it('adds a small platform-scoped gap between the custom window buttons', () => {
+ expect(appSource).toContain('className="titlebar-window-controls"');
+ expect(appSource).toContain("document.body.setAttribute('data-platform', runtimePlatform || '')");
+ expect(appCssSource).toMatch(
+ /body\[data-platform='windows'\]\s+\.titlebar-window-controls\s*\{[^}]*gap:\s*4px;/s,
+ );
+ });
+});