refactor: resolve structural inconsistencies and dead code

- Fix broken barrel exports in components/game/index.ts
- Remove skill system from stores (gameStore, gameActions, gameLoopActions, gameHooks, craftingStore, combat)
- Remove skill system from components (page.tsx, LeftPanel, StatsTab, SpellsTab, EnchantmentDesigner, EnchantmentPreparer, GameContext/Provider)
- Delete dead code: stats/ directory, attunements/ directory, layout/ Header+TabBar, shared/ StudyProgress+UpgradeDialog duplicates, effects.ts.fix, study-slice.ts, navigation-slice.ts
- Delete legacy store/ and store-modules/ directories, redirect remaining callers
- Merge root formatting.ts into utils/formatting.ts
- Move effects files (dynamic-compute, upgrade-effects, special-effects, upgrade-effects.types) into effects/ directory
- Move debug-context.tsx into components/game/debug/
- Create tabs/index.ts barrel for tab components
- Fix page.tsx lazy imports to use tabs barrel
- Fix all broken import paths across codebase
- Remove SKILLS_DEF and skill-evolution references
- Trim store.ts to under 400 lines by removing dead skill actions

src/components/game/UpgradeDialog.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import { SKILLS_DEF } from '@/lib/game/constants';
 import type { SkillUpgradeChoice } from '@/lib/game/types';
 import { Button } from '@/components/ui/button';
 import { Badge } from '@/components/ui/badge';
@@ -32,35 +31,34 @@ export function UpgradeDialog({
   onOpenChange,
 }: UpgradeDialogProps) {
   if (!skillId) return null;
-  
-  const skillDef = SKILLS_DEF[skillId];
+
   const currentSelections = pendingSelections.length > 0 ? pendingSelections : alreadySelected;
-  
+
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="bg-gray-900 border-gray-700 max-w-lg">
         <DialogHeader>
           <DialogTitle className="text-amber-400">
-            Choose Upgrade - {skillDef?.name || skillId}
+            Choose Upgrade - {skillId}
           </DialogTitle>
           <DialogDescription className="text-gray-400">
             Level {milestone} Milestone - Select 2 upgrades ({currentSelections.length}/2 chosen)
           </DialogDescription>
         </DialogHeader>
-        
+
         <div className="space-y-2 mt-4">
           {available.map((upgrade) => {
             const isSelected = currentSelections.includes(upgrade.id);
             const canToggle = currentSelections.length < 2 || isSelected;
-            
+
             return (
               <div
                 key={upgrade.id}
                 className={`p-3 rounded border cursor-pointer transition-all ${
-                  isSelected 
-                    ? 'border-amber-500 bg-amber-900/30' 
-                    : canToggle 
-                      ? 'border-gray-600 bg-gray-800/50 hover:border-amber-500/50 hover:bg-gray-800' 
+                  isSelected
+                    ? 'border-amber-500 bg-amber-900/30'
+                    : canToggle
+                      ? 'border-gray-600 bg-gray-800/50 hover:border-amber-500/50 hover:bg-gray-800'
                       : 'border-gray-700 bg-gray-800/30 opacity-50 cursor-not-allowed'
                 }`}
                 onClick={() => {
@@ -93,15 +91,15 @@ export function UpgradeDialog({
             );
           })}
         </div>
-        
+
         <div className="flex justify-end gap-2 mt-4">
-          <Button 
-            variant="outline" 
+          <Button
+            variant="outline"
             onClick={onCancel}
           >
             Cancel
           </Button>
-          <Button 
+          <Button
             variant="default"
             onClick={onConfirm}
             disabled={currentSelections.length !== 2}