feat(specials): add launch and end dates for scheduling

app/page.tsx

@@ -12,6 +12,18 @@ export default async function Home() {
   const genres = await prisma.genre.findMany({ orderBy: { name: 'asc' } });
   const specials = await prisma.special.findMany({ orderBy: { name: 'asc' } });
 
+  const now = new Date();
+
+  const activeSpecials = specials.filter(s => {
+    const isStarted = !s.launchDate || s.launchDate <= now;
+    const isEnded = s.endDate && s.endDate < now;
+    return isStarted && !isEnded;
+  });
+
+  const upcomingSpecials = specials.filter(s => {
+    return s.launchDate && s.launchDate > now;
+  });
+
   return (
     <>
       <div style={{ textAlign: 'center', padding: '1rem', background: '#f3f4f6' }}>
@@ -26,12 +38,12 @@ export default async function Home() {
           ))}
 
           {/* Separator if both exist */}
-          {genres.length > 0 && specials.length > 0 && (
+          {genres.length > 0 && activeSpecials.length > 0 && (
             <span style={{ color: '#d1d5db' }}>|</span>
           )}
 
-          {/* Specials */}
-          {specials.map(s => (
+          {/* Active Specials */}
+          {activeSpecials.map(s => (
             <Link
               key={s.id}
               href={`/special/${s.name}`}
@@ -45,6 +57,17 @@ export default async function Home() {
             </Link>
           ))}
         </div>
+
+        {/* Upcoming Specials */}
+        {upcomingSpecials.length > 0 && (
+          <div style={{ marginTop: '0.5rem', fontSize: '0.875rem', color: '#666' }}>
+            Coming soon: {upcomingSpecials.map(s => (
+              <span key={s.id} style={{ marginLeft: '0.5rem' }}>
+                ★ {s.name} ({s.launchDate?.toLocaleDateString()})
+              </span>
+            ))}
+          </div>
+        )}
       </div>
       <Game dailyPuzzle={dailyPuzzle} genre={null} />
     </>