feat: obchod, černé můry, netopýr, pavouk a denní úkoly u chytání motýlků

- obchod s pomůckami a trvalými vylepšeními (větší síťka, strašák, zpevněná síťka) – mince mají trvalý smysl
- černé můry se míchají mezi motýly; chycení (i magnetem) ubere hodně úlovků
- ptáci silnější, plašič dražší a kratší, zloději chodí častěji podle bohatství
- denní úkol s odměnou + achievementy/odznaky
- netopýr v noci loví motýly, pavouk zamotá síťku pavučinou – oba na zaklikání
- nákupní hlášky rozlišují nedostatek mincí od jiné chyby; herní smyčka se pozastaví při skryté záložce

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

client/src/FlyingButterflies.scss

@@ -73,6 +73,17 @@
   }
 }
 
+// Černá můra – zlověstný tmavý nádech
+.butterfly-sprite.moth {
+  filter: drop-shadow(0 0 4px rgba(120, 60, 160, 0.6)) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4));
+  animation: butterfly-flap 0.5s ease-in-out infinite, butterfly-moth-pulse 1.6s ease-in-out infinite;
+}
+
+@keyframes butterfly-moth-pulse {
+  0%, 100% { filter: drop-shadow(0 0 4px rgba(120, 60, 160, 0.5)) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4)); }
+  50% { filter: drop-shadow(0 0 9px rgba(150, 40, 40, 0.8)) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4)); }
+}
+
 // --- Havěť (ptáci a vosy) ----------------------------------------------------
 
 .butterfly-critter {
@@ -93,6 +104,42 @@
     cursor: crosshair;
     touch-action: none;
   }
+
+  // Netopýr jde zahnat klikáním
+  &.bat {
+    pointer-events: auto;
+    cursor: crosshair;
+    touch-action: none;
+    z-index: 5;
+    filter: drop-shadow(0 0 6px rgba(60, 40, 90, 0.8));
+  }
+
+  &.hit {
+    animation: butterfly-stalker-hit 0.18s ease-out;
+  }
+}
+
+// Pavučina přes síťku – blokuje chytání, dokud ji hráč nestrhne
+.butterfly-web {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 120px;
+  height: 120px;
+  background-image: url(/spider.svg);
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+  pointer-events: auto;
+  cursor: crosshair;
+  touch-action: none;
+  z-index: 6;
+  opacity: 0.9;
+  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.4));
+
+  &.hit {
+    animation: butterfly-stalker-hit 0.15s ease-out;
+  }
 }
 
 // --- Síťka na chytání --------------------------------------------------------
@@ -139,6 +186,11 @@
     animation: butterfly-net-stung 0.4s ease-in-out;
   }
 
+  // Záblesk při chycení černé můry (chyba)
+  &.moth-hit {
+    animation: butterfly-net-moth 0.4s ease-out;
+  }
+
   // Omráčená síťka (po žihnutí vosou) – po celou dobu, kdy nejde chytat.
   // Má přednost před grabbed kurzorem.
   &.stunned {
@@ -215,6 +267,17 @@
     font-size: 1.35rem;
     text-shadow: 0 0 6px rgba(255, 220, 100, 0.9), 0 1px 2px rgba(0, 0, 0, 0.3);
   }
+
+  &.moth {
+    color: #c92a2a;
+    font-size: 1.35rem;
+    text-shadow: 0 0 6px rgba(120, 40, 160, 0.7), 0 1px 2px rgba(0, 0, 0, 0.3);
+  }
+}
+
+@keyframes butterfly-net-moth {
+  0%, 100% { filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25)) brightness(1); }
+  30% { filter: drop-shadow(0 0 9px rgba(150, 40, 160, 0.9)) brightness(0.8); }
 }
 
 .butterfly-tear-fx {
@@ -255,6 +318,24 @@
   pointer-events: none;
 }
 
+.butterfly-shop-open {
+  pointer-events: auto;
+  align-self: flex-start;
+  padding: 6px 12px;
+  border: none;
+  border-radius: 999px;
+  background: #f59e1e;
+  color: #fff;
+  font-weight: 700;
+  font-size: 0.85rem;
+  cursor: pointer;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
+  transition: background 0.15s ease, transform 0.08s ease;
+
+  &:hover { background: #e8890a; }
+  &:active { transform: scale(0.96); }
+}
+
 .butterfly-counter {
   display: inline-flex;
   flex-direction: column;