feat: mobile-optimize admin section

- Layout: sidebar hidden on mobile, replaced with horizontal top nav strip
- Tables: overflow-x-auto + hide secondary columns (email/category/dates/
  plays/likes) on small screens; show email inline under name on mobile
- Forms: grid-cols-2 → grid-cols-1 sm:grid-cols-2 on all admin forms
- Markdown editor: Write/Preview tab toggle on mobile, side-by-side on sm+
- Padding: p-3 sm:p-6 on all admin pages for tighter mobile layout

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

packages/frontend/src/routes/admin/+layout.svelte

@@ -16,9 +16,31 @@
 
 <div class="min-h-screen bg-background">
   <div class="container mx-auto px-4">
+
+    <!-- Mobile top nav -->
+    <div class="lg:hidden flex items-center gap-2 py-3 border-b border-border/40">
+      <a href="/" class="text-xs text-muted-foreground hover:text-foreground transition-colors shrink-0 mr-2">
+        ← Back
+      </a>
+      {#each navLinks as link (link.href)}
+        <a
+          href={link.href}
+          class={`flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm font-medium transition-colors ${
+            isActive(link.href)
+              ? "bg-primary/10 text-primary"
+              : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
+          }`}
+        >
+          <span class={`${link.icon} h-4 w-4`}></span>
+          {link.name}
+        </a>
+      {/each}
+    </div>
+
+    <!-- Desktop layout -->
     <div class="flex min-h-screen">
-      <!-- Sidebar -->
-      <aside class="w-56 shrink-0 flex flex-col">
+      <!-- Sidebar (desktop only) -->
+      <aside class="hidden lg:flex w-56 shrink-0 flex-col border-r border-border/40">
         <div class="px-4 py-5 border-b border-border/40">
           <a href="/" class="text-xs text-muted-foreground hover:text-foreground transition-colors">
             ← Back to site
@@ -44,7 +66,7 @@
       </aside>
 
       <!-- Main content -->
-      <main class="flex-1 overflow-auto">
+      <main class="flex-1 min-w-0">
         {@render children()}
       </main>
     </div>