style: Consistent backdrop and create server in server-rail

wider server rail with larger icons ans slightly animated.

toju-app/src/app/domains/profile-avatar/feature/profile-avatar-editor/profile-avatar-editor.component.html

@@ -1,12 +1,8 @@
-<div
-  class="fixed inset-0 z-[112] bg-black/70 backdrop-blur-sm"
-  (click)="cancelled.emit(undefined)"
-  (keydown.enter)="cancelled.emit(undefined)"
-  (keydown.space)="cancelled.emit(undefined)"
-  role="button"
-  tabindex="0"
-  aria-label="Close profile image editor"
-></div>
+<app-modal-backdrop
+  [zIndex]="112"
+  ariaLabel="Close profile image editor"
+  (dismissed)="cancelled.emit(undefined)"
+/>
 
 <div class="fixed inset-0 z-[113] flex items-center justify-center p-4 pointer-events-none">
   <div

toju-app/src/app/domains/profile-avatar/feature/profile-avatar-editor/profile-avatar-editor.component.ts

@@ -9,6 +9,7 @@ import {
 } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ProfileAvatarFacade } from '../../application/services/profile-avatar.facade';
+import { ModalBackdropComponent } from '../../../../shared';
 import {
   EditableProfileAvatarSource,
   ProcessedProfileAvatar,
@@ -21,7 +22,7 @@ import {
 @Component({
   selector: 'app-profile-avatar-editor',
   standalone: true,
-  imports: [CommonModule],
+  imports: [CommonModule, ModalBackdropComponent],
   templateUrl: './profile-avatar-editor.component.html'
 })
 export class ProfileAvatarEditorComponent {