fixed spacing on add maintenance banner

Author: TheQuantifier

web/src/pages/AdminPage.jsx

@@ -896,7 +896,7 @@ export default function AdminPage() {
         </div>
 
         <div id="maintenanceMessageModal" className="modal hidden" role="dialog" aria-modal="true" aria-labelledby="maintenanceMessageModalTitle">
-          <div className="modal-content admin-modal">
+          <div className="modal-content admin-modal admin-maintenance-modal">
             <div className="modal-header">
               <h3 id="maintenanceMessageModalTitle">Maintenance Message</h3>
               <button className="modal-close" type="button" data-close-modal>&times;</button>

web/styles/admin.css

@@ -429,13 +429,25 @@
 }
 
 .admin-checklist-grid--modal {
+  box-sizing: border-box;
+  width: 100%;
+  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
   max-height: 300px;
   overflow: auto;
   padding: var(--space-2);
   border: 1px solid var(--border);
   border-radius: var(--radius-sm);
 }
 
+.admin-checklist-grid--modal .checkbox-row {
+  min-width: 0;
+}
+
+.admin-checklist-grid--modal .checkbox-row span {
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
 .admin-page-pill {
   padding: 0.4rem 0.55rem;
   border: 1px solid var(--border);
@@ -1028,6 +1040,12 @@
   max-width: 520px;
 }
 
+.admin-maintenance-modal {
+  max-width: min(760px, calc(100vw - 2rem));
+  max-height: calc(100vh - 3rem);
+  overflow: auto;
+}
+
 .admin-main .modal-header {
   display: flex;
   justify-content: space-between;