fix: show profile picture in the FileSidebar bottom bar

The home page's bottom-left settings button is FileSidebar's bottom
bar, which hardcoded an initials circle - the avatar work in
useConfigButtonIcon only affects the QuickAccessBar rail, which the
home page doesn't render. Add a layered useProfilePictureUrl hook
(core stub returns null; saas returns the auth context URL) and render
the picture inside the existing avatar circle, falling back to the
initial when absent or on image load failure.

frontend/editor/src/core/components/shared/FileSidebar.css

@@ -396,6 +396,14 @@
   justify-content: center;
   flex-shrink: 0;
   user-select: none;
+  overflow: hidden;
+}
+
+.file-sidebar-bottom-avatar-img {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  object-fit: cover;
 }
 
 .file-sidebar-bottom-name {

frontend/editor/src/core/components/shared/FileSidebar.tsx

@@ -20,6 +20,7 @@ import {
 import { useViewer } from "@app/contexts/ViewerContext";
 import { useFileHandler } from "@app/hooks/useFileHandler";
 import { useAuth } from "@app/auth/UseSession";
+import { useProfilePictureUrl } from "@app/hooks/useProfilePictureUrl";
 import {
   useIndexedDB,
   useIndexedDBRevision,
@@ -184,6 +185,11 @@ const FileSidebar = forwardRef<HTMLDivElement, FileSidebarProps>(
     const displayName =
       authDisplayName ?? accountUsername ?? t("auth.displayName.user", "User");
 
+    const profilePictureUrl = useProfilePictureUrl();
+    const [pictureFailed, setPictureFailed] = useState(false);
+    useEffect(() => setPictureFailed(false), [profilePictureUrl]);
+    const showProfilePicture = !!profilePictureUrl && !pictureFailed;
+
     useEffect(() => {
       if (!config?.enableLogin) {
         setAccountUsername(null);
@@ -941,7 +947,16 @@ const FileSidebar = forwardRef<HTMLDivElement, FileSidebarProps>(
               className="file-sidebar-bottom-avatar"
               aria-label={displayName}
             >
-              {displayName.charAt(0).toUpperCase()}
+              {showProfilePicture ? (
+                <img
+                  src={profilePictureUrl}
+                  alt=""
+                  className="file-sidebar-bottom-avatar-img"
+                  onError={() => setPictureFailed(true)}
+                />
+              ) : (
+                displayName.charAt(0).toUpperCase()
+              )}
             </div>
             {!collapsed && (
               <span className="file-sidebar-bottom-name sidebar-content-fade">

frontend/editor/src/core/hooks/useProfilePictureUrl.ts

@@ -0,0 +1,6 @@
+/**
+ * Core stub — no profile picture source; auth-aware layers override this.
+ */
+export function useProfilePictureUrl(): string | null {
+  return null;
+}

frontend/editor/src/saas/hooks/useProfilePictureUrl.ts

@@ -0,0 +1,5 @@
+import { useAuth } from "@app/auth/UseSession";
+
+export function useProfilePictureUrl(): string | null {
+  return useAuth().profilePictureUrl;
+}