Add keyboard event listeners to close Terms of Service modal

Bump version to 2.4.2.

Adjust date input appearance and positioning.
Tighten spacing on dashboard stats cards.
Update footer padding.

frontend/src/app.css

@@ -32,7 +32,7 @@
 }
 
 .card {
-	@apply bg-white rounded-lg shadow-md p-6;
+ 	@apply bg-white rounded-lg shadow-md p-6;
 }
 
 .loading-spinner {
@@ -42,6 +42,29 @@
 	animation: spin 1s linear infinite;
 }
 
+input[type="date"] {
+	appearance: none;
+	-webkit-appearance: none;
+	background-color: #fff;
+	color: #111827;
+	padding-right: 2.5rem;
+	font-variant-numeric: tabular-nums;
+	position: relative;
+}
+
+input[type="date"]::-webkit-date-and-time-value {
+	text-align: left;
+}
+
+input[type="date"]::-webkit-calendar-picker-indicator {
+	position: absolute;
+	right: 0.75rem;
+	top: 50%;
+	transform: translateY(-50%);
+	cursor: pointer;
+	opacity: 0.7;
+}
+
 @keyframes spin {
 	0% {
 		transform: rotate(0deg);

frontend/src/lib/components/Footer.svelte

@@ -17,7 +17,7 @@
 </script>
 
 <footer class="bg-white border-t border-gray-200 mt-12 w-full">
-  <div class="container mx-auto px-4 py-6 text-center text-sm text-gray-600">
+  <div class="container mx-auto px-4 py-4 text-center text-sm text-gray-600">
     <p>EDH Stats • Track your Commander games</p>
     {#if version}
       <p class="text-xs text-gray-500 mt-1">v{version}</p>

frontend/src/routes/dashboard/+page.svelte

@@ -207,7 +207,7 @@
         </div>
       {:else}
         <!-- Stats Overview -->
-        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
+        <div class="grid grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-4 md:gap-6 mb-8">
           <!-- Total Games -->
           <div class="card">
             <div class="flex items-center justify-between">

frontend/src/routes/games/+page.svelte

@@ -429,7 +429,7 @@
                     type="date"
                     bind:value={formData.date}
                     required
-                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"
+                    class="w-full px-3 py-2 border border-gray-300 rounded-md bg-white text-gray-900 appearance-none focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"
                   />
                 </div>
 

frontend/src/routes/register/+page.svelte

@@ -434,7 +434,16 @@
   <div class="fixed inset-0 z-40 flex items-center justify-center">
     <div
       class="absolute inset-0 bg-gray-900 bg-opacity-50"
+      role="button"
+      tabindex="0"
+      aria-label="Close terms of service"
       on:click={() => (showTermsModal = false)}
+      on:keydown={(event) => {
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          showTermsModal = false;
+        }
+      }}
     ></div>
     <div
       class="relative z-50 w-full max-w-3xl mx-4 bg-white rounded-2xl shadow-2xl flex flex-col max-h-[90vh]"

frontend/static/version.txt

@@ -1 +1 @@
-2.4.1
+2.4.3