diff --git a/public/pages/birthdays.js b/public/pages/birthdays.js
index 70e8c79..cbb2f23 100644
--- a/public/pages/birthdays.js
+++ b/public/pages/birthdays.js
@@ -276,9 +276,20 @@ function openBirthdayModal({ mode, birthday = null }) {
     content: `
       <div class="birthday-modal">
         <div class="birthday-modal__identity">
-          <button type="button" class="birthday-avatar-editor" id="birthday-preview" aria-label="${t('birthdays.photoLabel')}">
-            ${birthdayPreviewHtml(birthday?.name || '', photoData)}
-          </button>
+          <div class="birthday-modal__photo-wrap">
+            <button type="button" class="birthday-avatar-editor" id="birthday-preview" aria-label="${t('birthdays.photoLabel')}">
+              ${birthdayPreviewHtml(birthday?.name || '', photoData)}
+            </button>
+            <input class="sr-only" id="bd-photo" type="file" accept="image/png,image/jpeg,image/webp,image/gif">
+            <div class="birthday-modal__photo-actions">
+              <button type="button" class="birthday-modal__photo-action" id="bd-photo-edit" aria-label="${t('birthdays.photoLabel')}" title="${t('birthdays.photoLabel')}">
+                <i data-lucide="pencil" aria-hidden="true"></i>
+              </button>
+              <button type="button" class="birthday-modal__photo-action birthday-modal__photo-action--danger" id="bd-remove-photo" aria-label="${t('birthdays.removePhoto')}" title="${t('birthdays.removePhoto')}">
+                <i data-lucide="trash-2" aria-hidden="true"></i>
+              </button>
+            </div>
+          </div>
           <div class="birthday-modal__fields">
             <div class="form-group">
               <label class="form-label" for="bd-name">${t('birthdays.nameLabel')}</label>
@@ -290,15 +301,6 @@ function openBirthdayModal({ mode, birthday = null }) {
             </div>
           </div>
         </div>
-        <input class="sr-only" id="bd-photo" type="file" accept="image/png,image/jpeg,image/webp,image/gif">
-        <div class="birthday-modal__photo-actions">
-          <button type="button" class="birthday-modal__photo-action" id="bd-photo-edit" aria-label="${t('birthdays.photoLabel')}" title="${t('birthdays.photoLabel')}">
-            <i data-lucide="pencil" aria-hidden="true"></i>
-          </button>
-          <button type="button" class="birthday-modal__photo-action birthday-modal__photo-action--danger" id="bd-remove-photo" aria-label="${t('birthdays.removePhoto')}" title="${t('birthdays.removePhoto')}">
-            <i data-lucide="trash-2" aria-hidden="true"></i>
-          </button>
-        </div>
         <div class="form-group">
           <label class="form-label" for="bd-notes">${t('birthdays.notesLabel')}</label>
           <textarea class="form-input" id="bd-notes" rows="3" placeholder="${t('birthdays.notesPlaceholder')}">${esc(birthday?.notes || '')}</textarea>
diff --git a/public/styles/birthdays.css b/public/styles/birthdays.css
index 05c48e7..ed08ea5 100644
--- a/public/styles/birthdays.css
+++ b/public/styles/birthdays.css
@@ -349,6 +349,14 @@
   gap: var(--space-4);
 }
 
+.birthday-modal__photo-wrap {
+  width: 84px;
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
 .birthday-modal__fields {
   flex: 1;
   min-width: 0;