feat(sprint1-step5): migration Tailwind v4 + Zustand — suppression WildCoinContext

- Install tailwindcss @tailwindcss/vite zustand
- useGameStore.ts : Zustand store wrappant economy.ts (tick, click, buy, prestige, buyNode, loadFromServer)
- GameTick.tsx : composant timer 1s
- GeneratorShop.tsx : boutique générateurs Tailwind (remplace Amelioration.jsx)
- EvolutionTree, PrestigePanel, MilestoneBar : rewrite Zustand + Tailwind
- Hud.jsx : rewrite Zustand + Tailwind (suppression Hud.scss)
- BoutiqueCard, Achievements : migrés vers Zustand
- Supprimé : WildCoin/ (4 fichiers), timer/Timer.jsx, useEconomy.ts, Hud.scss
- WildCoinProvider retiré de main.jsx

Frontend/src/components/EvolutionTree.tsx

@@ -0,0 +1,99 @@
+// EvolutionTree.tsx — Arbre d'Évolution permanent (jamais reset)
+// Visible après le premier prestige (prestigeCount >= 1)
+
+import React from "react";
+import { useGameStore } from "../store/useGameStore";
+import { canBuyEvolutionNode } from "../core/economy";
+import type { EvolutionNode } from "../core/economy";
+
+const EFFECT_DESCRIPTIONS: Record<string, (value: number) => string> = {
+  click_multiplier: (v) => `x${v} puissance de Ponte`,
+  production_multiplier: (v) => `x${v} production tous générateurs`,
+  start_bonus: (v) => `+${v} têtards au début de chaque run`,
+  unlock_generator: () => `Débloque le Lac Mystique dès le début`,
+  achievement_scaling: (v) => `+${(v * 100).toFixed(0)}% production par succès`,
+};
+
+function NodeCard({
+  node,
+  canBuy,
+  onBuy,
+}: {
+  node: EvolutionNode;
+  canBuy: boolean;
+  onBuy: () => void;
+}) {
+  return (
+    <div
+      className={`flex flex-col gap-2 p-3 rounded-lg border text-sm transition-colors ${
+        node.unlocked
+          ? "border-emerald-500/50 bg-emerald-950/30"
+          : canBuy
+          ? "border-amber-500/50 bg-amber-950/20"
+          : "border-gray-700/50 bg-gray-800/30 opacity-50"
+      }`}
+    >
+      <div className="flex justify-between items-center">
+        <span className="text-white font-semibold">{node.name}</span>
+        <span className="text-xs text-gray-400">
+          {node.unlocked ? "Débloqué" : `${node.cost} ADN`}
+        </span>
+      </div>
+      <p className="text-xs text-gray-300">
+        {EFFECT_DESCRIPTIONS[node.effect](node.value)}
+      </p>
+      {!node.unlocked && (
+        <button
+          disabled={!canBuy}
+          onClick={onBuy}
+          className={`px-3 py-1 rounded text-xs font-medium transition-colors cursor-pointer ${
+            canBuy
+              ? "bg-amber-600 hover:bg-amber-500 text-white"
+              : "bg-gray-700 text-gray-500 cursor-not-allowed"
+          }`}
+        >
+          {canBuy ? "Débloquer" : "Verrouillé"}
+        </button>
+      )}
+    </div>
+  );
+}
+
+export function EvolutionTree() {
+  const state = useGameStore((s) => s.state);
+  const buyNode = useGameStore((s) => s.buyNode);
+  const { evolutionTree, prestigeCount } = state;
+
+  if (prestigeCount < 1) return null;
+
+  return (
+    <div className="flex flex-col gap-3 p-4 rounded-xl bg-gray-900/80 backdrop-blur-sm max-w-md w-full">
+      <div className="flex justify-between items-center">
+        <h3 className="text-lg font-bold text-white">Arbre d'Évolution</h3>
+        <span className="text-sm text-amber-300">{state.ancestralDna} ADN</span>
+      </div>
+      <div className="flex flex-col gap-2">
+        {evolutionTree.map((node, index) => (
+          <React.Fragment key={node.id}>
+            {index > 0 && (
+              <div
+                className={`text-center text-xs ${
+                  evolutionTree[index - 1].unlocked
+                    ? "text-emerald-400"
+                    : "text-gray-600"
+                }`}
+              >
+                |
+              </div>
+            )}
+            <NodeCard
+              node={node}
+              canBuy={canBuyEvolutionNode(state, node.id)}
+              onBuy={() => buyNode(node.id)}
+            />
+          </React.Fragment>
+        ))}
+      </div>
+    </div>
+  );
+}