diff --git a/app/public/scripts/fetch-prompts.js b/app/public/scripts/fetch-prompts.js
index 8936f84..e0cd7a6 100644
--- a/app/public/scripts/fetch-prompts.js
+++ b/app/public/scripts/fetch-prompts.js
@@ -22,16 +22,19 @@ if (!dateStr) return "–";
 };
 
 function renderPromptCard(prompt) {
-  const tagSpans = (prompt.tags ?? []).map(tag =>
+  const sortedTags = (prompt.tags ?? []).slice().sort((a, b) =>
+    a.toLowerCase().localeCompare(b.toLowerCase())
+  );
+  const tagSpans = sortedTags.map(tag =>
     `<span class="text-sm bg-gray-200 text-gray-800 px-2 py-1 pt-0 rounded">${tag}</span>`
   ).join('');
   const escapedDescription = (prompt.description ?? '').replace(/\n/g, '<br />');
   const notes = prompt.notes ?? '';
 
   return `
-    <div class="prompt-card border border-gray-400 rounded p-4 bg-gray-700 text-gray-200 shadow-sm flex flex-col gap-2 min-h-[12rem]"
+    <div class="prompt-card border border-gray-400 rounded p-4 bg-gray-700 text-gray-200 shadow-sm flex flex-col gap-2 min-h-[12rem] max-h-fit"
          data-type="${prompt.type}" data-tags="${(prompt.tags ?? []).join(',')}">
-      <div class="flex items-center justify-between">
+      <div class="flex items-center justify-between mb-2">
         <h3 class="text-xl font-semibold">${prompt.title}</h3>
         <span class="text-sm font-medium px-2 py-1 rounded ${
           prompt.type === 'System'
@@ -39,8 +42,8 @@ function renderPromptCard(prompt) {
             : 'bg-green-100 text-green-700'
         }">${prompt.type}</span>
       </div>
-      <p class="text-md">${notes}</p>
-      <div class="flex flex-wrap gap-2 mt-2">${tagSpans}</div>
+      <p class="text-md mb-4">${notes}</p>
+      <div class="flex flex-wrap gap-2 mt-2 mb-4">${tagSpans}</div>
       <details name="prompt-details">
         <summary class="cursor-pointer font-semibold mt-2 text-lg">View Details</summary>
         <div class="text-md border-t mt-2 pt-2">
@@ -61,7 +64,10 @@ function renderPromptCard(prompt) {
 }
 
 function updateFiltersFromTags(prompts) {
-  const tagSet = new Set(prompts.flatMap(p => p.tags ?? []));
+  const sortedTags = Array.from(new Set(
+    prompts.flatMap(p => p.tags ?? [])
+  )).sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()));
+  const tagSet = new Set(sortedTags);
   const tagContainer = document.querySelector('#filters fieldset > div');
   if (!tagContainer) return;
 
diff --git a/app/src/pages/index.astro b/app/src/pages/index.astro
index e35f08e..0f9c5eb 100644
--- a/app/src/pages/index.astro
+++ b/app/src/pages/index.astro
@@ -31,7 +31,7 @@ const supabaseKey = import.meta.env.PUBLIC_SUPABASE_ANON_KEY;
           <a href="#filters" class="block lg:hidden bg-blue-600 text-white px-2 py-0 pb-1 mb-2 rounded cursor-pointer hover:bg-blue-700 transition-colors duration-300">Filters &downarrow;</a>
         </div>
 
-        <div id="prompt-container" class="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3">Loading prompts…</div>
+        <div id="prompt-container" class="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3 items-start">Loading prompts…</div>
       </div>
     </div>
   </main>