diff --git a/resources/css/app.css b/resources/css/app.css
index 7ab8274949..8bfb74a3cb 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -6159,8 +6159,15 @@ html.dark .canvas-zoom-max {
    tab strip, and settings rail float as framed panels over a dotted backdrop,
    like the canvas islands. Set on <html> by applyStoredTheme() from
    localStorage.navStyle; the default style keeps edge-to-edge bars. */
+/* Width of the collapsed desktop sidebar and the brand cell above it. */
+html {
+    --sidebar-collapsed-w: 4rem;
+}
+
 @media (min-width: 1024px) {
     html[data-nav-style="floating"] {
+        /* The framed rail needs no edge spacing: 1px border + 5px padding + 40px content. */
+        --sidebar-collapsed-w: 3.25rem;
         --floating-gap: 0.5rem;
         --floating-radius: 8px;
         --floating-line: oklch(0% 0 0 / 0.09);
@@ -6233,6 +6240,18 @@ html.dark .canvas-zoom-max {
         border-radius: 0 0 var(--floating-radius) var(--floating-radius);
     }
 
+    html[data-nav-style="floating"] .app-sidebar nav.sidebar-collapsed {
+        padding-left: 0.3125rem;
+        padding-right: 0.3125rem;
+    }
+
+    html[data-nav-style="floating"] .app-sidebar nav.sidebar-collapsed > .sidebar-footer {
+        margin-left: -0.3125rem;
+        margin-right: -0.3125rem;
+        padding-left: 0.3125rem;
+        padding-right: 0.3125rem;
+    }
+
     html[data-nav-style="floating"] .app-main {
         margin-left: calc(var(--sidebar-w, 14rem) + var(--floating-gap));
         /* The content top lines up with the sidebar and settings rail panels.
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 355618d79f..bfc7574762 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -33,7 +33,7 @@
                 localStorage.setItem('sidebarCollapsed', this.collapsed);
             }
         }" @open-global-search.window="open = false" @page-width-changed.window="pageWidth = $event.detail"
-            :style="{ '--sidebar-w': collapsed ? '4rem' : '14rem' }" x-cloak
+            :style="{ '--sidebar-w': collapsed ? 'var(--sidebar-collapsed-w)' : '14rem' }" x-cloak
             @class(['app-shell dark:text-inherit text-black', 'app-shell-canvas flex h-dvh flex-col' => $fullBleed ?? false])>
             {{-- ============ DESKTOP TOP BAR ============ --}}
             <header
@@ -46,7 +46,7 @@
                 class="app-topbar hidden lg:flex fixed top-0 inset-x-0 z-50 h-12 items-center bg-white/95 dark:bg-panel/95 backdrop-blur">
                 {{-- Brand (width tracks sidebar) --}}
                 <div class="app-topbar-brand flex items-center gap-2 h-full shrink-0 border-r border-black/[0.06] bg-neutral-50 dark:border-white/[0.04] dark:bg-app transition-[width] duration-200"
-                    :class="collapsed ? 'w-16 justify-center px-0 border-b' : 'w-56 px-4'">
+                    :class="collapsed ? 'w-(--sidebar-collapsed-w) justify-center px-0 border-b' : 'w-56 px-4'">
                     <div class="flex items-baseline gap-1.5 min-w-0">
                         <a href="/" {{ wireNavigate() }} title="Coolify"
                             class="flex shrink-0 items-center hover:opacity-80 transition-opacity">
@@ -128,7 +128,7 @@
 
             {{-- ============ DESKTOP SIDEBAR (below top bar) ============ --}}
             <div class="app-sidebar hidden lg:fixed lg:top-12 lg:bottom-0 lg:left-0 lg:z-40 lg:flex lg:flex-col min-w-0"
-                :class="[collapsed ? 'lg:w-16' : 'lg:w-56', sidebarReady ? 'transition-[width] duration-200' : '']">
+                :class="[collapsed ? 'lg:w-(--sidebar-collapsed-w)' : 'lg:w-56', sidebarReady ? 'transition-[width] duration-200' : '']">
                 <div class="flex min-h-0 grow min-w-0 flex-col overflow-visible">
                     <x-navbar desktop />
                 </div>
@@ -171,7 +171,7 @@
             @if ($fullBleed ?? false)
                 {{-- Full-bleed pages (canvases) fill the space between the top bar and the sidebar. --}}
                 <main class="app-main app-main-full relative min-h-0 flex-1 bg-neutral-50 dark:bg-app lg:pt-12"
-                    :class="[collapsed ? 'lg:ml-16' : 'lg:ml-56', sidebarReady ? 'transition-[margin] duration-200' : '']">
+                    :class="[collapsed ? 'lg:ml-(--sidebar-collapsed-w)' : 'lg:ml-56', sidebarReady ? 'transition-[margin] duration-200' : '']">
                     <div class="relative h-full">
                         {{ $slot }}
                     </div>
@@ -179,7 +179,7 @@
             @else
                 <main
                     class="app-main min-h-screen bg-neutral-50 dark:bg-app px-5 py-6 sm:px-8 lg:px-10 lg:pt-[calc(3rem+1.75rem)] lg:pb-10"
-                    :class="[collapsed ? 'lg:ml-16' : 'lg:ml-56', sidebarReady ? 'transition-[margin] duration-200' : '', pageWidth === 'centered' ? '' : 'app-main-wide']">
+                    :class="[collapsed ? 'lg:ml-(--sidebar-collapsed-w)' : 'lg:ml-56', sidebarReady ? 'transition-[margin] duration-200' : '', pageWidth === 'centered' ? '' : 'app-main-wide']">
                     <div class="w-full" :class="pageWidth === 'centered' ? 'mx-auto max-w-[1400px]' : 'max-w-none'">
                         {{ $slot }}
                     </div>