diff --git a/frontend/src/components/child/RewardConfirmDialog.vue b/frontend/src/components/child/RewardConfirmDialog.vue
index 4e13e28..530e56c 100644
--- a/frontend/src/components/child/RewardConfirmDialog.vue
+++ b/frontend/src/components/child/RewardConfirmDialog.vue
@@ -4,6 +4,7 @@
     :imageUrl="reward.image_url"
     :title="reward.name"
     :subtitle="reward.points_needed === 0 ? 'Reward Ready!' : reward.points_needed + ' more points'"
+    dialogMaxWidth="760px"
     @backdrop-click="$emit('cancel')"
   >
     <div class="modal-message">
diff --git a/frontend/src/components/shared/ModalDialog.vue b/frontend/src/components/shared/ModalDialog.vue
index 1eeb024..8b6a3d1 100644
--- a/frontend/src/components/shared/ModalDialog.vue
+++ b/frontend/src/components/shared/ModalDialog.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="modal-backdrop" @click.self="$emit('backdrop-click')">
-    <div class="modal-dialog">
+    <div class="modal-dialog" :style="{ maxWidth: dialogMaxWidth }">
       <div class="modal-heading">
         <img v-if="imageUrl" :src="imageUrl" alt="Dialog Image" class="modal-image" />
         <div class="modal-details">
@@ -18,6 +18,7 @@ defineProps<{
   imageUrl?: string | null | undefined
   title?: string
   subtitle?: string | null | undefined
+  dialogMaxWidth?: string
 }>()
 
 defineEmits<{