better first enc

src/lib/components/Pages/Encounters.svelte

@@ -103,26 +103,7 @@
   }
   
   async function handleEncounterTap(encounter: Encounter) {
-    if (encounter.type === EncounterType.FIRST_PICLET) {
-      // Your First Piclet - auto catch and show special detail page
-      try {
-        isLoading = true;
-        const caughtPiclet = await EncounterService.catchFirstPiclet(encounter);
-        await incrementCounter('picletsCapured');
-        await addProgressPoints(100);
-        
-        // Show the special newly caught detail page
-        newlyCaughtPiclet = caughtPiclet;
-        showNewlyCaught = true;
-        
-        // Force refresh encounters to remove the first piclet encounter
-        await forceEncounterRefresh();
-      } catch (error) {
-        console.error('Error catching first piclet:', error);
-        alert(`Error catching your first Piclet: ${error.message}`);
-      }
-      isLoading = false;
-    } else if (encounter.type === EncounterType.WILD_PICLET && encounter.picletTypeId) {
+    if (encounter.type === EncounterType.WILD_PICLET && encounter.picletTypeId) {
       // Regular wild encounter - start battle
       await startBattle(encounter);
     } else if (encounter.type === EncounterType.SHOP) {
@@ -354,12 +335,7 @@
           disabled={isRefreshing}
         >
           <div class="encounter-icon">
-            {#if encounter.type === EncounterType.FIRST_PICLET}
-              <div class="first-piclet-icon">
-                <div class="golden-glow-effect">✨</div>
-                <div class="mystery-silhouette">?</div>
-              </div>
-            {:else if encounter.type === EncounterType.WILD_PICLET && encounter.picletTypeId}
+            {#if encounter.type === EncounterType.WILD_PICLET && encounter.picletTypeId}
               {#if monsterImages.has(encounter.picletTypeId)}
                 <img 
                   src={monsterImages.get(encounter.picletTypeId)}
@@ -547,39 +523,4 @@
     margin: 0;
   }
 
-  /* First Piclet encounter styles */
-  .first-piclet-icon {
-    position: relative;
-    width: 64px;
-    height: 64px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: linear-gradient(135deg, #FFD700, #FFA500);
-    border-radius: 16px;
-    overflow: hidden;
-  }
-
-  .golden-glow-effect {
-    position: absolute;
-    top: 0;
-    left: 0;
-    font-size: 1.5rem;
-    animation: sparkleRotate 2s ease-in-out infinite;
-  }
-
-  .mystery-silhouette {
-    font-size: 2rem;
-    font-weight: bold;
-    color: white;
-    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
-    z-index: 2;
-  }
-
-  @keyframes sparkleRotate {
-    0%, 100% { transform: rotate(0deg) scale(1); opacity: 0.8; }
-    25% { transform: rotate(-10deg) scale(1.1); opacity: 1; }
-    50% { transform: rotate(0deg) scale(1.2); opacity: 0.9; }
-    75% { transform: rotate(10deg) scale(1.1); opacity: 1; }
-  }
 </style>

src/lib/components/PicletGenerator/PicletResult.svelte

@@ -69,7 +69,11 @@
       <div class="success-icon">✨</div>
       <h2>Success!</h2>
       <p class="success-message">
-        You can now encounter <strong>{picletInstance?.nickname || 'this creature'}</strong>!
+        {#if picletInstance?.caught}
+          <strong>{picletInstance?.nickname || 'This creature'}</strong> has been caught and added to your roster!
+        {:else}
+          You can now encounter <strong>{picletInstance?.nickname || 'this creature'}</strong>!
+        {/if}
       </p>
     </div>
     

src/lib/db/encounterService.ts

@@ -37,41 +37,6 @@ export class EncounterService {
     await db.encounters.clear();
   }
 
-  // Create a "Your First Piclet" encounter from an uncaught Piclet
-  static async createFirstPicletEncounter(picletId: number): Promise<Encounter> {
-    const piclet = await db.picletInstances.get(picletId);
-    if (!piclet) {
-      throw new Error(`Piclet with ID ${picletId} not found`);
-    }
-
-    const encounter: Omit<Encounter, 'id'> = {
-      type: EncounterType.FIRST_PICLET,
-      title: '✨ Your First Piclet! ✨',
-      description: `${piclet.nickname} wants to join your team! This special encounter will automatically catch them for you.`,
-      picletInstanceId: picletId,
-      createdAt: new Date()
-    };
-
-    const id = await db.encounters.add(encounter);
-    return { ...encounter, id };
-  }
-
-  // Check if the player should get a "Your First Piclet" encounter
-  static async shouldCreateFirstPicletEncounter(): Promise<number | null> {
-    const caughtPiclets = await getCaughtPiclets();
-    if (caughtPiclets.length > 0) {
-      return null; // Player already has caught Piclets
-    }
-
-    const uncaughtPiclets = await getUncaughtPiclets();
-    if (uncaughtPiclets.length === 0) {
-      return null; // No uncaught Piclets available
-    }
-
-    // Return the ID of the most recently created uncaught Piclet
-    const mostRecent = uncaughtPiclets.sort((a, b) => (b.id || 0) - (a.id || 0))[0];
-    return mostRecent.id || null;
-  }
 
   // Generate new encounters
   static async generateEncounters(): Promise<Encounter[]> {
@@ -81,30 +46,9 @@ export class EncounterService {
     const caughtPiclets = await getCaughtPiclets();
     const uncaughtPiclets = await getUncaughtPiclets();
     
-    if (caughtPiclets.length === 0 && uncaughtPiclets.length > 0) {
-      // Player has no caught piclets but has uncaught ones - create/return ONLY first piclet encounters
-      console.log('Player has uncaught piclets but no caught ones - creating first piclet encounters');
-      
-      // Clear existing encounters first
-      await db.encounters.clear();
-      
-      // Create first piclet encounters for all uncaught piclets
-      const newEncounters: Encounter[] = [];
-      for (const uncaughtPiclet of uncaughtPiclets) {
-        if (uncaughtPiclet.id) {
-          const encounter = await this.createFirstPicletEncounter(uncaughtPiclet.id);
-          newEncounters.push(encounter);
-        }
-      }
-      
-      await markEncountersRefreshed();
-      console.log('Created', newEncounters.length, 'first piclet encounters');
-      return newEncounters;
-    }
-    
-    if (caughtPiclets.length === 0 && uncaughtPiclets.length === 0) {
-      // No piclets at all - return empty encounters
-      console.log('No piclets found - returning empty encounters');
+    if (caughtPiclets.length === 0) {
+      // Player has no caught piclets - return empty encounters (no shop/heal until first piclet is caught)
+      console.log('Player has no caught piclets - returning empty encounters');
       await db.encounters.clear();
       await markEncountersRefreshed();
       return [];
@@ -226,39 +170,6 @@ export class EncounterService {
     return Math.round(totalLevel / rosterPiclets.length);
   }
 
-  // Catch your first Piclet (marks an existing uncaught Piclet as caught)
-  static async catchFirstPiclet(encounter: Encounter): Promise<PicletInstance> {
-    if (!encounter.picletInstanceId) {
-      throw new Error('No piclet instance ID specified for first Piclet encounter');
-    }
-
-    const piclet = await db.picletInstances.get(encounter.picletInstanceId);
-    if (!piclet) {
-      throw new Error(`Piclet with ID ${encounter.picletInstanceId} not found`);
-    }
-
-    if (piclet.caught) {
-      throw new Error('This Piclet has already been caught');
-    }
-
-    // Mark the Piclet as caught and put it in roster position 0 (first Piclet)
-    const updatedPiclet: PicletInstance = {
-      ...piclet,
-      caught: true,
-      caughtAt: new Date(),
-      isInRoster: true,
-      rosterPosition: 0
-    };
-
-    await db.picletInstances.update(encounter.picletInstanceId, {
-      caught: true,
-      caughtAt: new Date(),
-      isInRoster: true,
-      rosterPosition: 0
-    });
-
-    return updatedPiclet;
-  }
 
   // Catch a wild piclet (creates a new instance based on existing piclet type)
   static async catchWildPiclet(encounter: Encounter): Promise<PicletInstance> {

src/lib/db/piclets.ts

@@ -83,6 +83,10 @@ export async function generatedDataToPicletInstance(data: GeneratedPicletData, l
   
   const bst = baseHp + baseAttack + baseDefense + baseFieldAttack + baseFieldDefense + baseSpeed;
   
+  // Check if this is the first piclet (no existing piclets in database)
+  const existingPiclets = await db.picletInstances.count();
+  const isFirstPiclet = existingPiclets === 0;
+  
   return {
     // Type Info
     typeId: data.name.toLowerCase().replace(/\s+/g, '-'),
@@ -116,12 +120,12 @@ export async function generatedDataToPicletInstance(data: GeneratedPicletData, l
     specialAbilityUnlockLevel: abilityUnlockLevel,
     
     // Roster
-    isInRoster: false,
-    rosterPosition: undefined,
+    isInRoster: isFirstPiclet,
+    rosterPosition: isFirstPiclet ? 0 : undefined,
     
     // Metadata
-    caught: false, // Scanned Piclets start as uncaught
-    caughtAt: undefined, // Will be set when caught
+    caught: isFirstPiclet, // First piclet is automatically caught
+    caughtAt: isFirstPiclet ? new Date() : undefined,
     bst,
     tier: stats.tier, // Use tier from stats
     role: 'balanced', // Could be enhanced based on stat distribution