fix(explore): make species tab bar horizontally scrollable

TabsList is inline-flex/w-fit with no overflow handling, so all 14+
species tabs squeezed into one line as the taxonomy grew instead of
scrolling. Wraps it in an overflow-x-auto container, scoped to the
Explore page only — the shared Tabs component is used elsewhere with
small, fixed tab counts that don't need this. Fixes Gitea #27.

src/app/(app)/explore/page.tsx

@@ -94,18 +94,20 @@ export default function ExplorePage() {
       <h1 className="text-xl font-semibold mb-4">{t("title")}</h1>
 
       <Tabs value={activeTab} onValueChange={handleTabChange} className="mb-4">
-        <TabsList>
+        <div className="overflow-x-auto">
-          <TabsTrigger value="trending" className="gap-1">
+          <TabsList className="w-max">
-            <TrendingUp className="h-3.5 w-3.5" />
+            <TabsTrigger value="trending" className="gap-1">
-            {t("trending")}
+              <TrendingUp className="h-3.5 w-3.5" />
-          </TabsTrigger>
+              {t("trending")}
-          <TabsTrigger value="all">{t("all")}</TabsTrigger>
-          {(speciesList ?? []).map((s) => (
-            <TabsTrigger key={s.id} value={s.id}>
-              {s.name}
             </TabsTrigger>
-          ))}
+            <TabsTrigger value="all">{t("all")}</TabsTrigger>
-        </TabsList>
+            {(speciesList ?? []).map((s) => (
+              <TabsTrigger key={s.id} value={s.id}>
+                {s.name}
+              </TabsTrigger>
+            ))}
+          </TabsList>
+        </div>
       </Tabs>
 
       {/* Breed filter — only when a species tab is active */}