diff --git a/src/client/components/Modal.tsx b/src/client/components/Modal.tsx
index 203d1c5..e6855fa 100644
--- a/src/client/components/Modal.tsx
+++ b/src/client/components/Modal.tsx
@@ -25,14 +25,14 @@ export function Modal({
   }, [onClose]);
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
       <div
         role="dialog"
         aria-modal="true"
         aria-labelledby={labelledBy}
-        className={`card bg-base-100 border border-base-300 w-full ${maxWidth} shadow-xl`}
+        className={`card bg-base-100 border border-base-300 w-full ${maxWidth} max-h-full shadow-xl`}
       >
-        <div className="card-body gap-4">{children}</div>
+        <div className="card-body gap-4 overflow-y-auto">{children}</div>
       </div>
     </div>
   );