Moved action buttons on mobile cards.

frontend/src/pages/Departments.svelte

@@ -100,7 +100,7 @@
   {#if showAdd && canCreate}
     <div class="card" style="margin-bottom:1.5rem">
       <form onsubmit={addDept}>
-        <div style="display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:end">
+        <div class="form-grid" style="display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:end">
           <div class="form-group" style="margin-bottom:0">
             <label for="d-name">Name *</label>
             <input id="d-name" bind:value={newName} required placeholder="e.g. Security" />
@@ -142,8 +142,8 @@
         <tbody>
           {#each $allDepts ?? [] as d (d.id)}
             {#if editID === d.id}
-              <tr>
+              <tr class="edit-row">
-                <td>
+                <td class="td-name">
                   <div style="display:flex;align-items:center;gap:0.5rem">
                     <input type="color" bind:value={editColor} style="width:36px;height:36px;padding:0.1rem;border-radius:4px;cursor:pointer;flex-shrink:0" />
                     <input bind:value={editName} required placeholder="Name" style="margin:0" />
@@ -153,7 +153,7 @@
                   <input bind:value={editDesc} placeholder="Description" style="margin:0" />
                 </td>
                 {#if canCreate}
-                  <td>
+                  <td class="td-actions">
                     <div class="actions">
                       <button class="btn btn-primary btn-sm" onclick={() => saveDept(d)} disabled={saving}>
                         {saving ? '…' : 'Save'}
@@ -165,13 +165,13 @@
               </tr>
             {:else}
               <tr>
-                <td>
+                <td class="td-name">
                   <span class="dept-dot" style="background:{d.color};margin-right:0.5rem"></span>
                   <strong>{d.name}</strong>
                 </td>
-                <td class="text-muted">{d.description || '—'}</td>
+                <td class="td-desc text-muted">{d.description || '—'}</td>
                 {#if canCreate}
-                  <td>
+                  <td class="td-actions">
                     <div class="actions">
                       <button class="btn btn-ghost btn-sm" onclick={() => startEdit(d)}>Edit</button>
                       {#if canDelete}
@@ -188,3 +188,12 @@
     </div>
   {/if}
 </div>
+
+<style>
+  @media (max-width: 640px) {
+    .td-name { width: 100%; }
+    .td-desc { width: 100%; }
+    .td-actions { width: 100%; display: flex; justify-content: flex-end; }
+    .edit-row td { width: 100%; }
+  }
+</style>

frontend/src/pages/Participants.svelte

@@ -506,7 +506,7 @@
 
   @media (max-width: 640px) {
     .td-name { width: 100%; }
-    .td-actions { width: 100%; }
+    .td-actions { width: 100%; display: flex; justify-content: flex-end; }
     .ticket-rows { padding: 0; border: none; border-radius: 0; margin-top: -0.5rem; }
     .ticket-rows td { width: 100%; }
     .ticket-row { flex-direction: column; gap: 0.35rem; }

frontend/src/pages/Users.svelte

@@ -278,7 +278,7 @@
 <style>
   @media (max-width: 640px) {
     .td-name { width: 100%; }
-    .td-actions { width: 100%; }
+    .td-actions { width: 100%; display: flex; justify-content: flex-end; }
     .edit-row td { width: 100%; }
   }
 </style>

frontend/src/pages/Volunteers.svelte

@@ -271,6 +271,6 @@
   @media (max-width: 640px) {
     .td-name { width: 100%; }
     .td-ready { width: 100%; }
-    .td-actions { width: 100%; }
+    .td-actions { width: 100%; display: flex; justify-content: flex-end; }
   }
 </style>