small adjustments to skill

.gitignore

@@ -22,3 +22,4 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+/dist.zip

package-lock.json

@@ -8,8 +8,11 @@
       "name": "dsa5e-character-sheet-symbiote",
       "version": "0.0.0",
       "dependencies": {
+        "i18next": "^25.2.1",
+        "i18next-browser-languagedetector": "^8.2.0",
         "react": "^19.1.0",
         "react-dom": "^19.1.0",
+        "react-i18next": "^15.5.3",
         "react-icons": "^5.5.0"
       },
       "devDependencies": {
@@ -264,6 +267,15 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/@babel/runtime": {
+      "version": "7.27.6",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.6.tgz",
+      "integrity": "sha512-vbavdySgbTTrmFE+EsiqUTzlOr5bzlnJtUv9PynGCAKvfQqjIXbvFdumPM/GxMDfyuGMJaJAU6TO4zc1Jf1i8Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/template": {
       "version": "7.27.2",
       "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
@@ -1984,6 +1996,18 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/detect-libc": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "peer": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.5.167",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.167.tgz",
@@ -2426,6 +2450,55 @@
         "node": ">=8"
       }
     },
+    "node_modules/html-parse-stringify": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz",
+      "integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==",
+      "license": "MIT",
+      "dependencies": {
+        "void-elements": "3.1.0"
+      }
+    },
+    "node_modules/i18next": {
+      "version": "25.2.1",
+      "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.2.1.tgz",
+      "integrity": "sha512-+UoXK5wh+VlE1Zy5p6MjcvctHXAhRwQKCxiJD8noKZzIXmnAX8gdHX5fLPA3MEVxEN4vbZkQFy8N0LyD9tUqPw==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://locize.com"
+        },
+        {
+          "type": "individual",
+          "url": "https://locize.com/i18next.html"
+        },
+        {
+          "type": "individual",
+          "url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.27.1"
+      },
+      "peerDependencies": {
+        "typescript": "^5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/i18next-browser-languagedetector": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/i18next-browser-languagedetector/-/i18next-browser-languagedetector-8.2.0.tgz",
+      "integrity": "sha512-P+3zEKLnOF0qmiesW383vsLdtQVyKtCNA9cjSoKCppTKPQVfKd2W8hbVo5ZhNJKDqeM7BOcvNoKJOjpHh4Js9g==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.23.2"
+      }
+    },
     "node_modules/ignore": {
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -2503,6 +2576,18 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/jiti": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
+      "integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "bin": {
+        "jiti": "lib/jiti-cli.mjs"
+      }
+    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -2594,6 +2679,257 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/lightningcss": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.1.tgz",
+      "integrity": "sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==",
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "peer": true,
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-darwin-arm64": "1.30.1",
+        "lightningcss-darwin-x64": "1.30.1",
+        "lightningcss-freebsd-x64": "1.30.1",
+        "lightningcss-linux-arm-gnueabihf": "1.30.1",
+        "lightningcss-linux-arm64-gnu": "1.30.1",
+        "lightningcss-linux-arm64-musl": "1.30.1",
+        "lightningcss-linux-x64-gnu": "1.30.1",
+        "lightningcss-linux-x64-musl": "1.30.1",
+        "lightningcss-win32-arm64-msvc": "1.30.1",
+        "lightningcss-win32-x64-msvc": "1.30.1"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.30.1.tgz",
+      "integrity": "sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.30.1.tgz",
+      "integrity": "sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.30.1.tgz",
+      "integrity": "sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.30.1.tgz",
+      "integrity": "sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.30.1.tgz",
+      "integrity": "sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.30.1.tgz",
+      "integrity": "sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.30.1.tgz",
+      "integrity": "sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.30.1.tgz",
+      "integrity": "sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.30.1.tgz",
+      "integrity": "sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.30.1.tgz",
+      "integrity": "sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
     "node_modules/locate-path": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -2808,9 +3144,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.5.5",
+      "version": "8.5.6",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.5.tgz",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
-      "integrity": "sha512-d/jtm+rdNT8tpXuHY5MMtcbJFBkhXE6593XVR9UoGCH8jSFGci7jGvMGH5RYd5PBJW+00NZQt6gf7CbagJCrhg==",
+      "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
       "dev": true,
       "funding": [
         {
@@ -2898,6 +3234,32 @@
         "react": "^19.1.0"
       }
     },
+    "node_modules/react-i18next": {
+      "version": "15.5.3",
+      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-15.5.3.tgz",
+      "integrity": "sha512-ypYmOKOnjqPEJZO4m1BI0kS8kWqkBNsKYyhVUfij0gvjy9xJNoG/VcGkxq5dRlVwzmrmY1BQMAmpbbUBLwC4Kw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.27.6",
+        "html-parse-stringify": "^3.0.1"
+      },
+      "peerDependencies": {
+        "i18next": ">= 23.2.3",
+        "react": ">= 16.8.0",
+        "typescript": "^5"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        },
+        "react-native": {
+          "optional": true
+        },
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/react-icons": {
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.5.0.tgz",
@@ -3172,7 +3534,7 @@
       "version": "5.8.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
       "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
@@ -3349,6 +3711,15 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/void-elements": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
+      "integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",

package.json

@@ -10,8 +10,11 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "i18next": "^25.2.1",
+    "i18next-browser-languagedetector": "^8.2.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
+    "react-i18next": "^15.5.3",
     "react-icons": "^5.5.0"
   },
   "devDependencies": {

src/assets/react.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>

src/classes/DSACharacter.ts

@@ -0,0 +1,97 @@
+import type {DSAAttributes, DSAExperienceLevel, DSAPersonalData, DSAStats} from "../types/baseCharacter.ts";
+import type {DSACalculatedValue} from "../types/baseDSA.ts";
+import type {DSABaseEquiment} from "../types/baseEquiment.ts";
+import type {DSAArmor, DSAMeleeWeapon, DSARangedWeapon, DSAShieldParryWeapon} from "../types/equiment.ts";
+import type {DSASpell} from "../types/character.ts";
+import type DSASkill from "./DSASkill.ts";
+// TODO
+// === LOGIC ===
+// Skillpoint <-> QualityLevel
+
+export default class DSACharacter {
+  public id: string
+
+  personalData: DSAPersonalData
+  attributes: DSAAttributes
+  stats: DSAStats
+  fatePoints: DSACalculatedValue
+  experienceLevel: DSAExperienceLevel
+  advantanges: string[] // TODO
+  disadvantanges: string[] // TODO
+  generalSpecialAbilities: string[] // TODO
+
+  skills: DSASkill[] // TODO: {physical, social, nature, knowledge, craft} generated by GPT
+  languages: string[]
+  scripts: string[]
+
+  combatTechniques: string[] // TODO
+  combatSpecialAbilities: string[] // TODO
+  
+  public inventory: {
+    closeCombatWeapons: DSAMeleeWeapon[] // TODO
+    rangedWeapons: DSARangedWeapon[] // TODO
+    armor: DSAArmor[] // TODO
+    shieldParryWeapon: DSAShieldParryWeapon[] // TODO
+    belongings: DSABaseEquiment[]
+    totalWeight: number // TODO Calculated
+    carryingCapacity: number // TODO Calculated
+    purse: {
+      ducats: number
+      silverthalers: number
+      halers: number
+      kreutzers: number
+    }
+  }
+  
+  public animal?: {
+    name: string
+    sizeCategory: 'winzig' | 'klein' | 'mittel' | 'groß' | 'riesig'
+    type: string
+    stats: DSAStats
+    attributes: DSAAttributes
+    attack: {
+      attack: number
+      defence: number
+      damagePoints: number
+      armor: number
+    }
+    actions: string[]
+    specialAbilities: string[]
+    image?: string
+  }
+  
+  public spellsAndRituals?: { // TODO
+    properties: string[]
+    primaryAttribute: string[]
+    tradition: string[]
+    magicalSpecialAbilities: string[]
+    cantrips: string[]
+    spells?: DSASpell[]
+  }
+  
+  public liturgicalChantsAndCeremonies?: { // TODO
+    aspects: string[]
+    primaryAttribute: string[]
+    tradition: string[]
+    blessedSpecialAbilities: string[]
+    blessings: string[]
+    spells?: DSASpell[]
+  }
+  
+  constructor() {
+    this.id = crypto.randomUUID()
+    this.personalData = {
+      name: "", age: "", culture: "", family: "", hometown: "", profession: "", socialStanding: "", species: ""
+    }
+    this.attributes = {
+      agility: 8,
+      charisma: 8,
+      cleverness: 8,
+      constitution: 8,
+      courage: 8,
+      dexterity: 8,
+      intuition: 8,
+      strength: 8
+    }
+  }
+}

src/classes/DSAImprovementsTable.ts

@@ -0,0 +1,26 @@
+import improvementCostTable from '../data/improvementcosttable.json'
+import type {DSAImprovements} from "../types/baseDSA.ts";
+
+export default class DSAImprovementsTable {
+
+    private static readonly improvementCostTable = improvementCostTable;
+
+
+    static getCost(improvement: DSAImprovements, level: number) : number{
+        if(improvement === 'other') {
+            //TODO
+            return 0
+        }
+        else {
+            return improvementCostTable[improvement][this.getKey(level)]
+        }
+    }
+
+    private static getKey(level : number) : string {
+        if(level >= 1 && level <= 12) {
+            return '1-12'
+        } else {
+            return level.toString()
+        }
+    }
+}

src/classes/DSASkill.ts

@@ -0,0 +1,47 @@
+import type {DSAAttributes} from "../types/baseCharacter.ts";
+import type {DSAImprovements} from "../types/baseDSA.ts";
+import DSAImprovementsTable from "./DSAImprovementsTable.ts";
+
+export class DSABaseSkill {
+    skillName: string
+    improvement: DSAImprovements
+    skillLevel: number
+
+    constructor(skillName: string, improvement: DSAImprovements, skillLevel: number) {
+        this.skillName = skillName
+        this.improvement = improvement
+        this.skillLevel = skillLevel
+    }
+
+    improvementCost(): number {
+        return DSAImprovementsTable.getCost(this.improvement, this.skillLevel)
+    }
+
+    improve() {
+        this.skillLevel++
+    }
+}
+
+export class DSASkill extends DSABaseSkill {
+    skillName: string;
+    improvement: DSAImprovements;
+    attributes: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes]
+    encumbrance: "YES" | "NO" | "MAYBE"
+    comment: string
+
+    constructor(skillName: string, improvement: DSAImprovements,
+                attributes: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes],
+                encumbrance: "YES" | "NO" | "MAYBE", skillLevel: number, comment: string) {
+        super(skillName, improvement, skillLevel)
+        this.skillName = skillName
+        this.improvement = improvement
+        this.attributes = attributes
+        this.encumbrance = encumbrance
+        this.skillLevel = skillLevel
+        this.comment = comment
+    }
+
+    routineCheck(): number {
+        return this.skillLevel >= 13 ? this.skillLevel / 2 : 0
+    }
+}

src/components/Attributes.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
-import type {DSACharacter, DSAAttributes} from '../types/character';
+import { useTranslation } from 'react-i18next';
+import type {DSACharacter} from '../types/character';
+import type {DSAAttributes} from "../types/baseCharacter.ts";
 
 interface AttributesProps {
     character: DSACharacter;
@@ -7,6 +9,7 @@ interface AttributesProps {
 }
 
 const Attributes: React.FC<AttributesProps> = ({ character, setCharacter }) => {
+    const { t } = useTranslation();
     const updateAttribute = (attr: keyof DSAAttributes, value: number) => {
         // Input validation - clamp between 1 and 20
         const clampedValue = Math.min(20, Math.max(1, value));
@@ -20,25 +23,18 @@ const Attributes: React.FC<AttributesProps> = ({ character, setCharacter }) => {
         }));
     };
 
-    const attributeDisplayNames: Record<keyof DSAAttributes, string> = {
+    const getAttributeDisplayName = (attr: keyof DSAAttributes): string => {
-        courage: "CO - Courage",
+        return t(`attributes.${attr}`);
-        cleverness: "CL - Cleverness",
-        intuition: "IN - Intuition",
-        charisma: "CH - Charisma",
-        dexterity: "DE - Dexterity",
-        agility: "AG - Agility",
-        constitution: "CN - Constitution",
-        strength: "ST - Strength"
     };
 
     return (
         <div className="attributes section">
-            <h2>Attributes</h2>
+            <h2>{t('attributes.title')}</h2>
             <div className="attributes-grid">
                 {Object.entries(character.attributes).map(([key, value]) => (
                     <div key={key} className="attribute">
                         <label htmlFor={key}>
-                            {attributeDisplayNames[key as keyof DSAAttributes]}
+                            {getAttributeDisplayName(key as keyof DSAAttributes)}
                         </label>
                         <input
                             id={key}

src/components/BasicInfo.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import type {DSACharacter} from '../types/character';
+import type {DSAPersonalData} from "../types/baseCharacter.ts";
 
 interface BasicInfoProps {
     character: DSACharacter;
@@ -7,7 +9,8 @@ interface BasicInfoProps {
 }
 
 const BasicInfo: React.FC<BasicInfoProps> = ({ character, setCharacter }) => {
-    const updateField = (field: keyof DSACharacter, value: string) => {
+    const { t } = useTranslation();
+    const updateField = (field: keyof DSACharacter | keyof DSAPersonalData, value: string) => {
         setCharacter(prev => ({
             ...prev,
             [field]: value
@@ -16,50 +19,50 @@ const BasicInfo: React.FC<BasicInfoProps> = ({ character, setCharacter }) => {
 
     return (
         <div className="basic-info section">
-            <h2>Basic Information</h2>
+            <h2>{t('basicInfo.title')}</h2>
             <div className="form-grid">
                 <div className="form-group">
-                    <label htmlFor="name">Name</label>
+                    <label htmlFor="name">{t('basicInfo.name')}</label>
                     <input
                         id="name"
                         type="text"
-                        value={character.name}
+                        value={character.personalData.name}
                         onChange={(e) => updateField('name', e.target.value)}
-                        placeholder="Enter character name"
+                        placeholder={t('basicInfo.namePlaceholder')}
                     />
                 </div>
                 <div className="form-group">
-                    <label htmlFor="species">Species</label>
+                    <label htmlFor="species">{t('basicInfo.species')}</label>
                     <input
                         id="species"
                         type="text"
-                        value={character.species}
+                        value={character.personalData.species}
                         onChange={(e) => updateField('species', e.target.value)}
-                        placeholder="e.g., Human, Elf, Dwarf"
+                        placeholder={t('basicInfo.speciesPlaceholder')}
                     />
                 </div>
                 <div className="form-group">
-                    <label htmlFor="culture">Culture</label>
+                    <label htmlFor="culture">{t('basicInfo.culture')}</label>
                     <input
                         id="culture"
                         type="text"
-                        value={character.culture}
+                        value={character.personalData.culture}
                         onChange={(e) => updateField('culture', e.target.value)}
-                        placeholder="e.g., Middenrealmish, Thorwalian"
+                        placeholder={t('basicInfo.culturePlaceholder')}
                     />
                 </div>
                 <div className="form-group">
-                    <label htmlFor="profession">Profession</label>
+                    <label htmlFor="profession">{t('basicInfo.profession')}</label>
                     <input
                         id="profession"
                         type="text"
-                        value={character.profession}
+                        value={character.personalData.profession}
                         onChange={(e) => updateField('profession', e.target.value)}
-                        placeholder="e.g., Warrior, Mage, Scout"
+                        placeholder={t('basicInfo.professionPlaceholder')}
                     />
                 </div>
                 <div className="form-group">
-                    <label htmlFor="experience-level">Experience Level</label>
+                    <label htmlFor="experience-level">{t('basicInfo.experienceLevel')}</label>
                     <select
                         id="experience-level"
                         value={character.experienceLevel}

src/components/CharacterSheet.tsx

@@ -1,107 +1,254 @@
 // src/components/CharacterSheet.tsx
-import React, { useState } from 'react';
+import React, {useState} from 'react';
-import type { DSACharacter } from '../types/character';
+import {useTranslation} from 'react-i18next';
+import type {DSACharacter} from '../types/character';
 import BasicInfo from './BasicInfo';
 import Attributes from './Attributes';
 import Skills from './Skills';
 import Spells from './Spells';
 import CombatValues from './CombatValues';
 import ThemeToggle from './ThemeToggle';
-import DSADiceRoller from "./DSADiceRoller.tsx";
+import LanguageSelector from './LanguageSelector';
 import iconUrl from '/icon.png';
-import './CharacterSheet.css';
+import '../styles/CharacterSheet.css';
 
 // Erweiterte Initial-Daten mit Astralenergie und Zaubern
 const initialCharacter: DSACharacter = {
-    id: crypto.randomUUID(),
+  id: crypto.randomUUID(),
+  personalData: {
     name: '',
     species: '',
     culture: '',
     profession: '',
-    experienceLevel: 'Experienced',
+    socialstatus: '',
-    attributes: {
+    hometown: '',
-        courage: 8,
+    family: '',
-        cleverness: 8,
+    looks: {
-        intuition: 8,
+      age: '',
-        charisma: 8,
+      haircolor: '',
-        dexterity: 8,
+      eyecolor: '',
-        agility: 8,
+      height: '',
-        constitution: 8,
+      weight: '',
-        strength: 8
+      characteristics: ''
+    }
+  },
+  experienceLevel: 'Experienced',
+  health: {
+    lifePoints: {
+      max: 30,
+      current: 30,
+      base: 30,
+      modifier: 0,
+      purchased: 0
     },
-    skills: {},
+    conditions: [],
-    spells: {}, // ← Neu hinzugefügt
+    fatigue: 0,
-    combat: {
+    pain: 0
-        lifePoints: { max: 30, current: 30 },
+  },
-        stamina: { max: 30, current: 30 },
+  attributes: {
-        initiative: 10,
+    courage: 8,
-        speed: 8
+    cleverness: 8,
+    intuition: 8,
+    charisma: 8,
+    dexterity: 8,
+    agility: 8,
+    constitution: 8,
+    strength: 8
+  },
+  skills: {},
+  astral: {
+    spells: {
+      'test': {
+        id: '',
+        name: '',
+        tradition: [''],
+        attributes: ['courage', 'agility', 'charisma'],
+        skillValue: 0,
+        aspCost: '',
+        castingTime: '',
+        range: '',
+        duration: '',
+        difficulty: 0,
+        description: '',
+        effect: '',
+      }
     },
-    astralEnergy: { // ← Neu hinzugefügt für Zauberer
+    traditions: [],
-        max: 0,
+    astralEnergy: {
-        current: 0
+      max: 0,
+      current: 0
+    }
+  },
+  karmal: {
+    spells: {
+      'test': {
+        id: '',
+        name: '',
+        tradition: [''],
+        attributes: ['courage', 'agility', 'charisma'],
+        skillValue: 0,
+        aspCost: '',
+        castingTime: '',
+        range: '',
+        duration: '',
+        difficulty: 0,
+        description: '',
+        effect: '',
+      }
     },
-    magicalTraditions: [], // ← Neu hinzugefügt
+    traditions: [],
-    advantages: [],
+    karmalEnergy: {
-    disadvantages: [],
+      max: 0,
-    equipment: []
+      current: 0
+    }
+  },
+  hasKarmal: false,
+  hasMagic: false,
+  combat: {
+    initiative: 10,
+    speed: 8,
+    armor: {
+      'leather': {
+        encumbrance: 0,
+        equip: {
+          name: 'hello',
+          weight: 0
+        },
+        penalties: 0,
+        protection: 0
+      }
+    },
+    combatAbilities: {
+      'test': {
+        name: 'test'
+      }
+    },
+    dodge: 0,
+    meleeWeapons: {
+      'test': {
+        weapon: {
+          equip: {
+            name: 'test',
+            weight: 0
+          },
+          range: 0,
+          technique: 'test',
+          tp: 0
+        },
+        atpamod: 0,
+        at: 0,
+        damagebonus: 0,
+        pa: 0
+      }
+    },
+    rangedWeapons: {
+      'javelin': {
+        weapon: {
+          equip: {
+            name: '',
+            weight: 0
+          },
+          technique: '',
+          tp: 0,
+          range: 0,
+        },
+        reloaddur: 0,
+        ammo: {
+          equip: {
+            name: '',
+            weight: 0
+          },
+          perUse: 0,
+          count: 0
+        },
+        rangedCombat: 0,
+      }
+    },
+    unarmedAttack: 0,
+    unarmedParry: 0
+  },
+  advantages: [],
+  disadvantages: [],
+  equipment: [],
+  resistances: {
+    spirit: {
+      base: 0,
+      modifier: 0,
+      purchased: 0,
+      max: 0,
+      current: 0
+    },
+    thoughness: {
+      base: 0,
+      modifier: 0,
+      purchased: 0,
+      max: 0,
+      current: 0,
+    },
+    dodge: {
+      base: 0,
+      modifier: 0,
+      purchased: 0,
+      max: 0,
+      current: 0
+    }
+  }
 };
 
 const CharacterSheet: React.FC = () => {
-    const [character, setCharacter] = useState<DSACharacter>(initialCharacter);
+  const {t} = useTranslation();
-
+  const [character, setCharacter] = useState<DSACharacter>(initialCharacter);
-    // Hilfsfunktion um zu prüfen ob Charakter Zauberer ist
+  
-    const isSpellcaster = character.astralEnergy && character.astralEnergy.max > 0;
+  // Hilfsfunktion um zu prüfen ob Charakter Zauberer ist
-
+  const isSpellcaster = character.astral.astralEnergy && character.astral.astralEnergy.max > 0;
-    return (
+  
-        <div className="character-sheet">
+  return (
-            <ThemeToggle />
+      <div className="character-sheet">
-
+        <ThemeToggle/>
-            <header className="character-sheet-header">
+        <LanguageSelector/>
-                <img
+        
-                    src={iconUrl}
+        <header className="character-sheet-header">
-                    alt="DSA 5e Character Sheet"
+          <img
-                    className="character-sheet-icon"
+              src={iconUrl}
-                />
+              alt={t('app.iconAlt')}
-                <h1>DSA 5 Character Sheet</h1>
+              className="character-sheet-icon"
-            </header>
+          />
-
+          <h1>{t('app.title')}</h1>
-            {/* Grundinformationen */}
+        </header>
-            <BasicInfo character={character} setCharacter={setCharacter} />
+        
-
+        {/* Grundinformationen */}
-            {/* Eigenschaften */}
+        <BasicInfo character={character} setCharacter={setCharacter}/>
-            <Attributes character={character} setCharacter={setCharacter} />
+        
-
+        {/* Eigenschaften */}
-            {/* Kampfwerte */}
+        <Attributes character={character} setCharacter={setCharacter}/>
-            <CombatValues character={character} setCharacter={setCharacter} />
+        
-
+        {/* Kampfwerte */}
-            {/* Fertigkeiten */}
+        <CombatValues character={character} setCharacter={setCharacter}/>
-            <Skills character={character} setCharacter={setCharacter} />
+        
-
+        {/* Fertigkeiten */}
-            {/* Würfel-Integration - kommt nach Skills */}
+        <Skills character={character} setCharacter={setCharacter}/>
-            <DSADiceRoller character={character} />
+        
-
+        {/* Zauber - nur anzeigen wenn Astralenergie > 0 oder explizit gewünscht */}
-            {/* Zauber - nur anzeigen wenn Astralenergie > 0 oder explizit gewünscht */}
+        {(isSpellcaster || Object.keys(character.astral.spells).length > 0) && (
-            {(isSpellcaster || Object.keys(character.spells).length > 0) && (
+            <Spells character={character} setCharacter={setCharacter}/>
-                <Spells character={character} setCharacter={setCharacter} />
+        )}
-            )}
+        
-
+        {/* Button zum Hinzufügen von Zaubern falls noch kein Zauberer */}
-            {/* Button zum Hinzufügen von Zaubern falls noch kein Zauberer */}
+        {!isSpellcaster && Object.keys(character.astral.spells).length === 0 && (
-            {!isSpellcaster && Object.keys(character.spells).length === 0 && (
+            <div className="add-magic-section">
-                <div className="add-magic-section">
+              <button
-                    <button
+                  className="add-magic-button"
-                        className="add-magic-button"
+                  onClick={() => setCharacter(prev => ({
-                        onClick={() => setCharacter(prev => ({
+                    ...prev,
-                            ...prev,
+                    astralEnergy: {max: 20, current: 20}
-                            astralEnergy: { max: 20, current: 20 }
+                  }))}
-                        }))}
+              >
-                    >
+                {t('spells.addMagic')}
-                        🪄 Zauberfähigkeiten hinzufügen
+              </button>
-                    </button>
+            </div>
-                </div>
+        )}
-            )}
+      </div>
-        </div>
+  );
-    );
 };
 
 export default CharacterSheet;

src/components/CombatValues.tsx

@@ -7,7 +7,7 @@ interface CombatValuesProps {
 }
 
 const CombatValues: React.FC<CombatValuesProps> = ({ character, setCharacter }) => {
-    const updateCombatValue = (category: 'lifePoints' | 'stamina' | 'astralEnergy',
+    const updateCombatValue = (category: 'lifePoints' | 'astralEnergy',
                                field: 'max' | 'current',
                                value: number) => {
         setCharacter(prev => ({
@@ -62,32 +62,6 @@ const CombatValues: React.FC<CombatValuesProps> = ({ character, setCharacter })
                     </div>
                 </div>
 
-                <div className="combat-group">
-                    <h3>Stamina</h3>
-                    <div className="value-pair">
-                        <div>
-                            <label htmlFor="stamina-current">Current</label>
-                            <input
-                                id="stamina-current"
-                                type="number"
-                                value={character.combat.stamina.current}
-                                onChange={(e) => updateCombatValue('stamina', 'current', parseInt(e.target.value) || 0)}
-                                min="0"
-                            />
-                        </div>
-                        <div>
-                            <label htmlFor="stamina-max">Maximum</label>
-                            <input
-                                id="stamina-max"
-                                type="number"
-                                value={character.combat.stamina.max}
-                                onChange={(e) => updateCombatValue('stamina', 'max', parseInt(e.target.value) || 0)}
-                                min="0"
-                            />
-                        </div>
-                    </div>
-                </div>
-
                 <div className="combat-simple">
                     <div>
                         <label htmlFor="initiative">Initiative</label>

src/components/DSADiceRoller.tsx

@@ -1,199 +0,0 @@
-import React, { useState } from 'react';
-import type { DSACharacter, DSASkill, DSASpell } from '../types/character';
-import { useTaleSpireDice } from '../hooks/useTaleSpireDice';
-
-interface DSADiceRollerProps {
-    character: DSACharacter;
-}
-
-const DSADiceRoller: React.FC<DSADiceRollerProps> = ({ character }) => {
-    const { rollDSACheck, rollSimpleDice, isAvailable } = useTaleSpireDice();
-    const [modifier, setModifier] = useState(0);
-    const [lastResult, setLastResult] = useState<any>(null);
-
-    const rollAttributeCheck = async (attributeKey: keyof typeof character.attributes) => {
-        const attributeValue = character.attributes[attributeKey];
-        try {
-            const result = await rollDSACheck(
-                [attributeValue, attributeValue, attributeValue],
-                0,
-                modifier,
-                `${attributeKey.toUpperCase()} Probe`
-            );
-            setLastResult(result);
-        } catch (error) {
-            console.error('Dice roll failed:', error);
-        }
-    };
-
-    const rollSkillCheck = async (skill: DSASkill) => {
-        const [attr1, attr2, attr3] = skill.attributes;
-        const attributes: [number, number, number] = [
-            character.attributes[attr1],
-            character.attributes[attr2],
-            character.attributes[attr3]
-        ];
-
-        try {
-            const result = await rollDSACheck(
-                attributes,
-                skill.value,
-                modifier,
-                `${skill.name} Probe`
-            );
-            setLastResult(result);
-        } catch (error) {
-            console.error('Skill roll failed:', error);
-        }
-    };
-
-    const rollSpellCheck = async (spell: DSASpell) => {
-        const [attr1, attr2, attr3] = spell.attributes;
-        const attributes: [number, number, number] = [
-            character.attributes[attr1],
-            character.attributes[attr2],
-            character.attributes[attr3]
-        ];
-
-        try {
-            const result = await rollDSACheck(
-                attributes,
-                spell.skillValue,
-                modifier + spell.difficulty,
-                `${spell.name} Zauberprobe`
-            );
-            setLastResult(result);
-        } catch (error) {
-            console.error('Spell roll failed:', error);
-        }
-    };
-
-    const rollInitiative = async () => {
-        try {
-            const result = await rollSimpleDice('1d6', 'Initiative');
-            const total = result.total + character.combat.initiative;
-            setLastResult({ ...result, total, type: 'initiative' });
-        } catch (error) {
-            console.error('Initiative roll failed:', error);
-        }
-    };
-
-    return (
-        <div className="dsa-dice-roller section">
-            <h2>🎲 Würfelproben</h2>
-
-            {!isAvailable && (
-                <div className="dice-warning">
-                    ⚠️ TaleSpire Dice API nicht verfügbar - Development Mode aktiv
-                </div>
-            )}
-
-            {/* Modifikator */}
-            <div className="modifier-section">
-                <label htmlFor="modifier">Modifikator:</label>
-                <input
-                    id="modifier"
-                    type="number"
-                    value={modifier}
-                    onChange={(e) => setModifier(parseInt(e.target.value) || 0)}
-                    min="-10"
-                    max="10"
-                    className="modifier-input"
-                />
-            </div>
-
-            {/* Letztes Ergebnis */}
-            {lastResult && (
-                <div className={`last-result ${lastResult.success ? 'success' : 'failure'}`}>
-                    <h3>Letztes Ergebnis:</h3>
-                    <div className="result-details">
-                        <div>Würfel: {lastResult.dice?.join(', ')}</div>
-                        {lastResult.type === 'initiative' ? (
-                            <div>Initiative: {lastResult.total}</div>
-                        ) : (
-                            <>
-                                <div>{lastResult.success ? '✅ Erfolg' : '❌ Fehlschlag'}</div>
-                                {lastResult.success && (
-                                    <div>Qualitätsstufe: {lastResult.qualityLevel}</div>
-                                )}
-                            </>
-                        )}
-                    </div>
-                </div>
-            )}
-
-            {/* Eigenschaften */}
-            <div className="dice-section">
-                <h3>Eigenschaftsproben</h3>
-                <div className="dice-buttons">
-                    {Object.entries(character.attributes).map(([key, value]) => (
-                        <button
-                            key={key}
-                            onClick={() => rollAttributeCheck(key as keyof typeof character.attributes)}
-                            className="dice-button attribute-button"
-                        >
-                            {key.substring(0, 2).toUpperCase()} ({value})
-                        </button>
-                    ))}
-                </div>
-            </div>
-
-            {/* Fertigkeiten */}
-            {Object.keys(character.skills).length > 0 && (
-                <div className="dice-section">
-                    <h3>Fertigkeitsproben</h3>
-                    <div className="dice-buttons">
-                        {Object.values(character.skills).slice(0, 6).map((skill) => (
-                            <button
-                                key={skill.name}
-                                onClick={() => rollSkillCheck(skill)}
-                                className="dice-button skill-button"
-                            >
-                                {skill.name} (FW {skill.value})
-                            </button>
-                        ))}
-                    </div>
-                </div>
-            )}
-
-            {/* Zauberproben */}
-            {Object.keys(character.spells).length > 0 && (
-                <div className="dice-section">
-                    <h3>Zauberproben</h3>
-                    <div className="dice-buttons">
-                        {Object.values(character.spells).slice(0, 4).map((spell) => (
-                            <button
-                                key={spell.name}
-                                onClick={() => rollSpellCheck(spell)}
-                                className="dice-button spell-button"
-                            >
-                                {spell.name} (FW {spell.skillValue})
-                            </button>
-                        ))}
-                    </div>
-                </div>
-            )}
-
-            {/* Kampf */}
-            <div className="dice-section">
-                <h3>Kampfwürfe</h3>
-                <div className="dice-buttons">
-                    <button
-                        onClick={rollInitiative}
-                        className="dice-button combat-button"
-                    >
-                        Initiative (INI {character.combat.initiative})
-                    </button>
-                    <button
-                        onClick={() => rollSimpleDice('1d6', 'Schaden')}
-                        className="dice-button combat-button"
-                    >
-                        Schaden (1W6)
-                    </button>
-                </div>
-            </div>
-        </div>
-    );
-};
-
-export default DSADiceRoller;

src/components/LanguageSelector.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import '../styles/LanguageSelector.css';
+
+const LanguageSelector: React.FC = () => {
+  const { i18n } = useTranslation();
+  
+  const changeLanguage = (lng: string) => {
+    i18n.changeLanguage(lng);
+  };
+
+  return (
+    <div className="language-selector">
+      <button 
+        className={`language-btn ${i18n.language === 'en' ? 'active' : ''}`}
+        onClick={() => changeLanguage('en')}
+      >
+        🇬🇧 EN
+      </button>
+      <button 
+        className={`language-btn ${i18n.language === 'de' ? 'active' : ''}`}
+        onClick={() => changeLanguage('de')}
+      >
+        🇩🇪 DE
+      </button>
+    </div>
+  );
+};
+
+export default LanguageSelector;

src/components/ThemeToggle.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import {FaMoon, FaSun} from "react-icons/fa";
 import {useTheme} from '../contexts/ThemeContext';
+import '../styles/ThemeToggle.css';
 
 const ThemeToggle: React.FC = () => {
     const {theme, toggleTheme} = useTheme();

src/data/combattechniques.json

@@ -0,0 +1,91 @@
+{
+  "combat_techniques": {
+    "page_ref": "p. 214-231",
+    "techniques": [
+      {
+        "name": "Bows",
+        "primary": ["DEX"],
+        "improvement": "C",
+        "type": "ranged"
+      },
+      {
+        "name": "Brawling",
+        "primary": ["AGI", "STR"],
+        "improvement": "B",
+        "type": "melee"
+      },
+      {
+        "name": "Chain Weapons",
+        "primary": ["STR"],
+        "improvement": "B",
+        "type": "melee"
+      },
+      {
+        "name": "Crossbows",
+        "primary": ["DEX"],
+        "improvement": "B",
+        "type": "ranged"
+      },
+      {
+        "name": "Daggers",
+        "primary": ["AGI"],
+        "improvement": "B",
+        "type": "melee"
+      },
+      {
+        "name": "Fencing Weapons",
+        "primary": ["AGI"],
+        "improvement": "C",
+        "type": "melee"
+      },
+      {
+        "name": "Impact Weapons",
+        "primary": ["STR"],
+        "improvement": "C",
+        "type": "melee"
+      },
+      {
+        "name": "Lances",
+        "primary": ["STR"],
+        "improvement": "B",
+        "type": "melee"
+      },
+      {
+        "name": "Pole Weapons",
+        "primary": ["AGI", "STR"],
+        "improvement": "C",
+        "type": "melee"
+      },
+      {
+        "name": "Shields",
+        "primary": ["STR"],
+        "improvement": "C",
+        "type": "defensive"
+      },
+      {
+        "name": "Swords",
+        "primary": ["AGI", "STR"],
+        "improvement": "C",
+        "type": "melee"
+      },
+      {
+        "name": "Thrown Weapons",
+        "primary": ["DEX"],
+        "improvement": "B",
+        "type": "ranged"
+      },
+      {
+        "name": "Two-Handed Impact Weapons",
+        "primary": ["STR"],
+        "improvement": "C",
+        "type": "melee"
+      },
+      {
+        "name": "Two-Handed Swords",
+        "primary": ["STR"],
+        "improvement": "C",
+        "type": "melee"
+      }
+    ]
+  }
+}

src/data/improvementcosttable.json

@@ -0,0 +1,87 @@
+{
+  "A": {
+    "0": 1,
+    "1-12": 1,
+    "13": 2,
+    "14": 3,
+    "15": 4,
+    "16": 5,
+    "17": 6,
+    "18": 7,
+    "19": 8,
+    "20": 9,
+    "21": 10,
+    "22": 11,
+    "23": 12,
+    "24": 13,
+    "25": 14
+  },
+  "B": {
+    "0": 2,
+    "1-12": 2,
+    "13": 4,
+    "14": 6,
+    "15": 8,
+    "16": 10,
+    "17": 12,
+    "18": 14,
+    "19": 16,
+    "20": 18,
+    "21": 20,
+    "22": 22,
+    "23": 24,
+    "24": 26,
+    "25": 28
+  },
+  "C": {
+    "0": 3,
+    "1-12": 3,
+    "13": 6,
+    "14": 9,
+    "15": 12,
+    "16": 15,
+    "17": 18,
+    "18": 21,
+    "19": 24,
+    "20": 27,
+    "21": 30,
+    "22": 33,
+    "23": 36,
+    "24": 39,
+    "25": 42
+  },
+  "D": {
+    "0": 4,
+    "1-12": 4,
+    "13": 8,
+    "14": 12,
+    "15": 16,
+    "16": 20,
+    "17": 24,
+    "18": 28,
+    "19": 32,
+    "20": 36,
+    "21": 40,
+    "22": 44,
+    "23": 48,
+    "24": 52,
+    "25": 56
+  },
+  "E": {
+    "0": null,
+    "1-12": 15,
+    "13": 15,
+    "14": 15,
+    "15": 30,
+    "16": 45,
+    "17": 60,
+    "18": 75,
+    "19": 90,
+    "20": 105,
+    "21": 120,
+    "22": 135,
+    "23": 150,
+    "24": 165,
+    "25": 180
+  }
+}

src/data/skills.json

@@ -0,0 +1,381 @@
+{
+  "physical_skills": {
+    "page_ref": "p. 188-192",
+    "skills": [
+      {
+        "name": "Body Control",
+        "check": ["AGI", "AGI", "CON"],
+        "enc": "yes",
+        "improvement": "D"
+      },
+      {
+        "name": "Carousing",
+        "check": ["SGC", "CON", "STR"],
+        "enc": "no",
+        "improvement": "A"
+      },
+      {
+        "name": "Climbing",
+        "check": ["COU", "AGI", "STR"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Dancing",
+        "check": ["SGC", "CHA", "AGI"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Feat of Strength",
+        "check": ["COU", "STR", "STR"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Flying",
+        "check": ["COU", "INT", "AGI"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Gaukelei",
+        "check": ["COU", "CHA", "DEX"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Perception",
+        "check": ["SGC", "INT", "INT"],
+        "enc": "maybe",
+        "improvement": "D"
+      },
+      {
+        "name": "Pickpocket",
+        "check": ["COU", "DEX", "AGI"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Riding",
+        "check": ["CHA", "AGI", "STR"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Self-Control",
+        "check": ["COU", "COU", "CON"],
+        "enc": "no",
+        "improvement": "D"
+      },
+      {
+        "name": "Singing",
+        "check": ["SGC", "CHA", "CON"],
+        "enc": "maybe",
+        "improvement": "A"
+      },
+      {
+        "name": "Stealth",
+        "check": ["COU", "INT", "AGI"],
+        "enc": "yes",
+        "improvement": "C"
+      },
+      {
+        "name": "Swimming",
+        "check": ["AGI", "CON", "STR"],
+        "enc": "yes",
+        "improvement": "B"
+      }
+    ]
+  },
+  "social_skills": {
+    "page_ref": "p. 193-197",
+    "skills": [
+      {
+        "name": "Disguise",
+        "check": ["INT", "CHA", "AGI"],
+        "enc": "maybe",
+        "improvement": "B"
+      },
+      {
+        "name": "Empathy",
+        "check": ["SGC", "INT", "CHA"],
+        "enc": "no",
+        "improvement": "C"
+      },
+      {
+        "name": "Etiquette",
+        "check": ["SGC", "INT", "CHA"],
+        "enc": "maybe",
+        "improvement": "B"
+      },
+      {
+        "name": "Fast-Talk",
+        "check": ["COU", "INT", "CHA"],
+        "enc": "no",
+        "improvement": "C"
+      },
+      {
+        "name": "Intimidation",
+        "check": ["COU", "INT", "CHA"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Persuasion",
+        "check": ["COU", "SGC", "CHA"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Seduction",
+        "check": ["COU", "CHA", "CHA"],
+        "enc": "maybe",
+        "improvement": "B"
+      },
+      {
+        "name": "Streetwise",
+        "check": ["SGC", "INT", "CHA"],
+        "enc": "maybe",
+        "improvement": "C"
+      },
+      {
+        "name": "Willpower",
+        "check": ["COU", "INT", "CHA"],
+        "enc": "no",
+        "improvement": "D"
+      }
+    ]
+  },
+  "knowledge_skills": {
+    "page_ref": "p. 201-205",
+    "skills": [
+      {
+        "name": "Astronomy",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "A"
+      },
+      {
+        "name": "Gambling",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "A"
+      },
+      {
+        "name": "Geography",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "History",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Law",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "A"
+      },
+      {
+        "name": "Magical Lore",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "C"
+      },
+      {
+        "name": "Math",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "A"
+      },
+      {
+        "name": "Mechanics",
+        "check": ["SGC", "SGC", "DEX"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Myths & Legends",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Religions",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Sphere Lore",
+        "check": ["SGC", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Warfare",
+        "check": ["COU", "SGC", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      }
+    ]
+  },
+  "nature_skills": {
+    "page_ref": "p. 198-200",
+    "skills": [
+      {
+        "name": "Animal Lore",
+        "check": ["COU", "COU", "CHA"],
+        "enc": "yes",
+        "improvement": "C"
+      },
+      {
+        "name": "Fishing",
+        "check": ["DEX", "AGI", "CON"],
+        "enc": "maybe",
+        "improvement": "A"
+      },
+      {
+        "name": "Orienting",
+        "check": ["SGC", "INT", "INT"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Plant Lore",
+        "check": ["SGC", "DEX", "CON"],
+        "enc": "maybe",
+        "improvement": "C"
+      },
+      {
+        "name": "Ropes",
+        "check": ["SGC", "DEX", "STR"],
+        "enc": "maybe",
+        "improvement": "A"
+      },
+      {
+        "name": "Survival",
+        "check": ["COU", "AGI", "CON"],
+        "enc": "yes",
+        "improvement": "C"
+      },
+      {
+        "name": "Tracking",
+        "check": ["COU", "INT", "AGI"],
+        "enc": "yes",
+        "improvement": "C"
+      }
+    ]
+  },
+  "craft_skills": {
+    "page_ref": "p. 206-213",
+    "skills": [
+      {
+        "name": "Alchemy",
+        "check": ["COU", "SGC", "DEX"],
+        "enc": "yes",
+        "improvement": "C"
+      },
+      {
+        "name": "Artistic Ability",
+        "check": ["INT", "DEX", "DEX"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Clothworking",
+        "check": ["SGC", "DEX", "DEX"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Commerce",
+        "check": ["SGC", "INT", "CHA"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Driving",
+        "check": ["CHA", "DEX", "CON"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Earthencraft",
+        "check": ["DEX", "DEX", "STR"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Leatherworking",
+        "check": ["DEX", "AGI", "CON"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Metalworking",
+        "check": ["DEX", "CON", "STR"],
+        "enc": "yes",
+        "improvement": "C"
+      },
+      {
+        "name": "Music",
+        "check": ["CHA", "DEX", "CON"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Pick Locks",
+        "check": ["INT", "DEX", "DEX"],
+        "enc": "yes",
+        "improvement": "C"
+      },
+      {
+        "name": "Prepare Food",
+        "check": ["INT", "DEX", "DEX"],
+        "enc": "yes",
+        "improvement": "A"
+      },
+      {
+        "name": "Sailing",
+        "check": ["DEX", "AGI", "STR"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Treat Disease",
+        "check": ["COU", "INT", "CON"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Treat Poison",
+        "check": ["COU", "SGC", "INT"],
+        "enc": "yes",
+        "improvement": "B"
+      },
+      {
+        "name": "Treat Soul",
+        "check": ["INT", "CHA", "CON"],
+        "enc": "no",
+        "improvement": "B"
+      },
+      {
+        "name": "Treat Wounds",
+        "check": ["SGC", "DEX", "DEX"],
+        "enc": "yes",
+        "improvement": "D"
+      },
+      {
+        "name": "Woodworking",
+        "check": ["DEX", "AGI", "STR"],
+        "enc": "yes",
+        "improvement": "B"
+      }
+    ]
+  }
+}

src/global.d.ts

@@ -0,0 +1,14 @@
+declare global {
+    interface Window {
+        TS: {
+            dice: {
+                putDiceInTray: (rollData: any[], showInTray: boolean) => Promise<string>;
+                onRollResults: (callback: (rollEvent: any) => void) => void;
+                sendDiceResult: (resultGroups: any[], rollId: string) => Promise<void>;
+                evaluateDiceResultsGroup: (group: any) => Promise<number>;
+            };
+        };
+    }
+}
+
+export {};

src/hooks/useTaleSpireDice.ts

@@ -1,44 +1,136 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState, useCallback } from 'react';
 
-interface DiceRollResult {
+interface DSAResult {
     dice: number[];
-    total: number;
+    success: boolean;
-    timestamp: number;
+    qualityLevel: number;
+    remainingPoints: number;
+    rollId?: string;
 }
 
-interface TaleSpireAPI {
+interface TrackedRoll {
-    rollDice: (diceString: string, label?: string) => Promise<DiceRollResult>;
+    type: 'dsa' | 'simple';
-    postToChat: (message: string) => void;
+    attributes?: [number, number, number];
-}
+    skillValue?: number;
-
+    modifier?: number;
-// TaleSpire API global verfügbar machen
+    label: string;
-declare global {
+    bonus?: number;
-    interface Window {
-        TS: TaleSpireAPI;
-    }
 }
 
 export const useTaleSpireDice = () => {
     const [isAvailable, setIsAvailable] = useState(false);
+    const [trackedRolls, setTrackedRolls] = useState<Record<string, TrackedRoll>>({});
+    const [rollResults, setRollResults] = useState<Record<string, any>>({});
 
     useEffect(() => {
-        // Prüfen ob TaleSpire API verfügbar ist
+        // Check if TaleSpire API is available
-        setIsAvailable(!!window.TS);
+        const available = typeof window !== 'undefined' &&
+            window.TS &&
+            window.TS.dice;
+        setIsAvailable(available);
+
+        if (available) {
+            // Set up event listener for roll results
+            window.TS.dice.onRollResults((rollEvent: any) => {
+                handleRollResult(rollEvent);
+            });
+        }
     }, []);
 
+    const handleRollResult = useCallback(async (rollEvent: any) => {
+        const rollId = rollEvent.payload.rollId;
+
+        if (!trackedRolls[rollId]) {
+            return; // Not our roll
+        }
+
+        if (rollEvent.kind === "rollResults") {
+            const roll = rollEvent.payload;
+            const rollData = trackedRolls[rollId];
+
+            let result;
+
+            if (rollData.type === 'dsa') {
+                result = await evaluateDSACheck(roll, rollData);
+            } else if (rollData.type === 'simple') {
+                result = await evaluateSimpleRoll(roll, rollData);
+            }
+
+            if (result) {
+                // Send result back to TaleSpire
+                await window.TS.dice.sendDiceResult([result.resultGroup], rollId);
+
+                // Store result locally
+                setRollResults(prev => ({
+                    ...prev,
+                    [rollId]: result
+                }));
+            }
+        } else if (rollEvent.kind === "rollRemoved") {
+            // Clean up when roll is removed
+            setTrackedRolls(prev => {
+                const updated = { ...prev };
+                delete updated[rollId];
+                return updated;
+            });
+        }
+    }, [trackedRolls]);
+
+    const evaluateDSACheck = async (roll: any, rollData: TrackedRoll) => {
+        if (!roll.resultsGroups || roll.resultsGroups.length < 1) {
+            return null;
+        }
+
+        const group = roll.resultsGroups[0];
+        const dice: number[] = [];
+
+        // Extract dice results
+        for (const result of group.results) {
+            for (const die of result.dice) {
+                dice.push(die.result);
+            }
+        }
+
+        // Calculate DSA result
+        const dsaResult = calculateDSAResult(
+            dice,
+            rollData.attributes!,
+            rollData.skillValue!,
+            rollData.modifier!
+        );
+
+        return {
+            ...dsaResult,
+            resultGroup: group,
+            type: 'dsa',
+            label: rollData.label
+        };
+    };
+
+    const evaluateSimpleRoll = async (roll: any, rollData: TrackedRoll) => {
+        if (!roll.resultsGroups || roll.resultsGroups.length < 1) {
+            return null;
+        }
+
+        const group = roll.resultsGroups[0];
+        const total = await window.TS.dice.evaluateDiceResultsGroup(group);
+
+        return {
+            resultGroup: group,
+            total: total + (rollData.bonus || 0),
+            type: 'simple',
+            label: rollData.label
+        };
+    };
+
     const rollDSACheck = async (
         attributes: [number, number, number],
         skillValue: number,
         modifier: number = 0,
         label: string = "DSA 5e Probe"
-    ): Promise<{
+    ): Promise<DSAResult> => {
-        dice: number[];
+        if (!isAvailable) {
-        success: boolean;
+            // Development fallback
-        qualityLevel: number;
-        remainingPoints: number;
-    }> => {
-        if (!window.TS) {
-            // Fallback für Development ohne TaleSpire
             const dice = [
                 Math.floor(Math.random() * 20) + 1,
                 Math.floor(Math.random() * 20) + 1,
@@ -48,40 +140,94 @@ export const useTaleSpireDice = () => {
         }
 
         try {
-            const result = await window.TS.rollDice("3d20", label);
+            const rollData = [{
-            const dsaResult = calculateDSAResult(result.dice, attributes, skillValue, modifier);
+                name: label,
+                roll: "3d20"
+            }];
 
-            // Ergebnis in TaleSpire Chat posten
+            const rollId = await window.TS.dice.putDiceInTray(rollData, true);
-            const chatMessage = formatDSAChatMessage(dsaResult, attributes, skillValue, modifier, label);
+
-            window.TS.postToChat(chatMessage);
+            // Track this roll
+            setTrackedRolls(prev => ({
+                ...prev,
+                [rollId]: {
+                    type: 'dsa',
+                    attributes,
+                    skillValue,
+                    modifier,
+                    label
+                }
+            }));
+
+            // Return a promise that resolves when we get the result
+            return new Promise((resolve) => {
+                const checkResult = () => {
+                    if (rollResults[rollId]) {
+                        resolve({ ...rollResults[rollId], rollId });
+                    } else {
+                        setTimeout(checkResult, 100);
+                    }
+                };
+                checkResult();
+            });
 
-            return dsaResult;
         } catch (error) {
-            console.error('TaleSpire Dice Roll failed:', error);
+            console.error('TaleSpire DSA roll failed:', error);
             throw error;
         }
     };
 
     const rollSimpleDice = async (diceString: string, label?: string) => {
-        if (!window.TS) {
+        if (!isAvailable) {
-            // Fallback für Development
+            // Development fallback
             const sides = parseInt(diceString.split('d')[1]) || 20;
             const count = parseInt(diceString.split('d')[0]) || 1;
             const dice = Array.from({ length: count }, () => Math.floor(Math.random() * sides) + 1);
             return { dice, total: dice.reduce((a, b) => a + b, 0), timestamp: Date.now() };
         }
 
-        return await window.TS.rollDice(diceString, label);
+        try {
+            const rollData = [{
+                name: label || 'Simple Roll',
+                roll: diceString
+            }];
+
+            const rollId = await window.TS.dice.putDiceInTray(rollData, true);
+
+            setTrackedRolls(prev => ({
+                ...prev,
+                [rollId]: {
+                    type: 'simple',
+                    label: label || 'Simple Roll'
+                }
+            }));
+
+            return new Promise((resolve) => {
+                const checkResult = () => {
+                    if (rollResults[rollId]) {
+                        resolve(rollResults[rollId]);
+                    } else {
+                        setTimeout(checkResult, 100);
+                    }
+                };
+                checkResult();
+            });
+
+        } catch (error) {
+            console.error('TaleSpire simple roll failed:', error);
+            throw error;
+        }
     };
 
     return {
         isAvailable,
         rollDSACheck,
-        rollSimpleDice
+        rollSimpleDice,
+        rollResults
     };
 };
 
-// DSA 5e Würfellogik
+// Keep your existing DSA calculation logic
 const calculateDSAResult = (
     dice: number[],
     attributes: [number, number, number],
@@ -91,7 +237,6 @@ const calculateDSAResult = (
     let remainingPoints = skillValue;
     const effectiveAttributes = attributes.map(attr => attr + modifier);
 
-    // Für jeden Würfel prüfen ob er das Attribut überschreitet
     dice.forEach((roll, index) => {
         if (roll > effectiveAttributes[index]) {
             remainingPoints -= (roll - effectiveAttributes[index]);
@@ -108,20 +253,3 @@ const calculateDSAResult = (
         remainingPoints: Math.max(0, remainingPoints)
     };
 };
-
-// Chat-Nachricht formatieren
-const formatDSAChatMessage = (
-    result: any,
-    attributes: [number, number, number],
-    skillValue: number,
-    modifier: number,
-    label: string
-) => {
-    const { dice, success, qualityLevel, remainingPoints } = result;
-    const modifierText = modifier !== 0 ? ` (${modifier > 0 ? '+' : ''}${modifier})` : '';
-
-    return `🎲 **${label}**
-📊 Würfel: ${dice.join(', ')} vs ${attributes.join('/')}${modifierText}
-⚔️ FW: ${skillValue} | Übrig: ${remainingPoints}
-${success ? `✅ **Erfolg** (QL ${qualityLevel})` : '❌ **Fehlschlag**'}`;
-};

src/i18n/i18n.ts

@@ -0,0 +1,38 @@
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
+
+// Import translations
+import enTranslation from './locales/en.json';
+import deTranslation from './locales/de.json';
+
+// Initialize i18next
+i18n
+  // Detect user language
+  .use(LanguageDetector)
+  // Pass the i18n instance to react-i18next
+  .use(initReactI18next)
+  // Initialize i18next
+  .init({
+    resources: {
+      en: enTranslation,
+      de: deTranslation
+    },
+    fallbackLng: 'en',
+    debug: import.meta.env.MODE === 'development',
+
+    interpolation: {
+      escapeValue: false, // React already escapes values
+    },
+
+    // Default namespace
+    defaultNS: 'translation',
+
+    // Detection options
+    detection: {
+      order: ['localStorage', 'navigator'],
+      caches: ['localStorage'],
+    }
+  });
+
+export default i18n;

src/i18n/locales/de.json

@@ -0,0 +1,121 @@
+{
+  "translation": {
+    "app": {
+      "title": "DSA 5 Charakterbogen",
+      "iconAlt": "DSA 5 Charakterbogen"
+    },
+    "basicInfo": {
+      "title": "Grundinformationen",
+      "name": "Name",
+      "namePlaceholder": "Charaktername eingeben",
+      "species": "Spezies",
+      "speciesPlaceholder": "z.B. Mensch, Elf, Zwerg",
+      "culture": "Kultur",
+      "culturePlaceholder": "z.B. Mittelländisch, Thorwalsch",
+      "profession": "Profession",
+      "professionPlaceholder": "z.B. Krieger, Magier, Kundschafter",
+      "socialstatus": "Sozialstatus",
+      "socialstatusPlaceholder": "z.B. Unfrei, Bürger, Adel",
+      "hometown": "Heimatort",
+      "hometownPlaceholder": "Geburts- oder Heimatort",
+      "family": "Familie",
+      "familyPlaceholder": "Familienstand und Verwandtschaft",
+      "experienceLevel": "Erfahrungsstufe",
+      "experienceLevels": {
+        "inexperienced": "Unerfahren",
+        "average": "Durchschnittlich",
+        "experienced": "Erfahren",
+        "competent": "Kompetent",
+        "masterful": "Meisterhaft",
+        "brilliant": "Brillant",
+        "legendary": "Legendär"
+      }
+    },
+    "appearance": {
+      "title": "Aussehen",
+      "age": "Alter",
+      "agePlaceholder": "Alter in Jahren",
+      "haircolor": "Haarfarbe",
+      "haircolorPlaceholder": "z.B. Braun, Blond, Schwarz",
+      "eyecolor": "Augenfarbe",
+      "eyecolorPlaceholder": "z.B. Braun, Blau, Grün",
+      "height": "Größe",
+      "heightPlaceholder": "Größe in cm",
+      "weight": "Gewicht",
+      "weightPlaceholder": "Gewicht in kg",
+      "characteristics": "Besondere Merkmale",
+      "characteristicsPlaceholder": "Narben, Tätowierungen, etc."
+    },
+    "attributes": {
+      "title": "Eigenschaften",
+      "courage": "MU - Mut",
+      "cleverness": "KL - Klugheit",
+      "intuition": "IN - Intuition",
+      "charisma": "CH - Charisma",
+      "dexterity": "FF - Fingerfertigkeit",
+      "agility": "GE - Gewandtheit",
+      "constitution": "KO - Konstitution",
+      "strength": "KK - Körperkraft"
+    },
+    "combat": {
+      "title": "Kampfwerte",
+      "lifePoints": "Lebenspunkte",
+      "astralEnergy": "Astralpunkte",
+      "initiative": "Initiative",
+      "speed": "Geschwindigkeit",
+      "max": "Max",
+      "current": "Aktuell"
+    },
+    "skills": {
+      "title": "Fertigkeiten",
+      "skillValue": "FW",
+      "addSkill": "Fertigkeit hinzufügen"
+    },
+    "advantages": {
+      "title": "Vorteile",
+      "addAdvantage": "Vorteil hinzufügen"
+    },
+    "disadvantages": {
+      "title": "Nachteile",
+      "addDisadvantage": "Nachteil hinzufügen"
+    },
+    "equipment": {
+      "title": "Ausrüstung",
+      "addEquipment": "Ausrüstung hinzufügen"
+    },
+    "spells": {
+      "title": "Zauber",
+      "addMagic": "Zauberfähigkeiten hinzufügen",
+      "addSpell": "Zauber hinzufügen",
+      "magicalTraditions": "Magische Traditionen",
+      "tradition": "Tradition",
+      "skillValue": "ZfW - Zauberfertigkeit",
+      "aspCost": "AsP-Kosten",
+      "castingTime": "Zauberdauer",
+      "range": "Reichweite",
+      "duration": "Wirkungsdauer",
+      "difficulty": "Erschwernis",
+      "description": "Beschreibung",
+      "effect": "Wirkung",
+      "traditions": {
+        "gildenmagier": "Gildenmagier",
+        "hexe": "Hexe",
+        "druide": "Druide",
+        "elf": "Elf",
+        "scharlatane": "Scharlatane",
+        "zauberbarde": "Zauberbarde",
+        "zaubertänzer": "Zaubertänzer",
+        "intuitivezauberer": "Intuitive Zauberer"
+      }
+    },
+    "common": {
+      "save": "Speichern",
+      "cancel": "Abbrechen",
+      "edit": "Bearbeiten",
+      "delete": "Löschen",
+      "add": "Hinzufügen",
+      "close": "Schließen",
+      "confirm": "Bestätigen"
+    }
+  }
+}

src/i18n/locales/en.json

@@ -0,0 +1,54 @@
+{
+  "translation": {
+    "app": {
+      "title": "DSA 5 Character Sheet",
+      "iconAlt": "DSA 5e Character Sheet"
+    },
+    "basicInfo": {
+      "title": "Basic Information",
+      "name": "Name",
+      "namePlaceholder": "Enter character name",
+      "species": "Species",
+      "speciesPlaceholder": "e.g., Human, Elf, Dwarf",
+      "culture": "Culture",
+      "culturePlaceholder": "e.g., Middenrealmish, Thorwalian",
+      "profession": "Profession",
+      "professionPlaceholder": "e.g., Warrior, Mage, Scout",
+      "experienceLevel": "Experience Level",
+      "experienceLevels": {
+        "inexperienced": "Inexperienced",
+        "average": "Average",
+        "experienced": "Experienced",
+        "competent": "Competent",
+        "masterful": "Masterful",
+        "brilliant": "Brilliant",
+        "legendary": "Legendary"
+      }
+    },
+    "attributes": {
+      "title": "Attributes",
+      "courage": "CO - Courage",
+      "cleverness": "CL - Cleverness",
+      "intuition": "IN - Intuition",
+      "charisma": "CH - Charisma",
+      "dexterity": "DE - Dexterity",
+      "agility": "AG - Agility",
+      "constitution": "CN - Constitution",
+      "strength": "ST - Strength"
+    },
+    "combat": {
+      "title": "Combat Values",
+      "lifePoints": "Life Points",
+      "stamina": "Stamina",
+      "initiative": "Initiative",
+      "speed": "Speed"
+    },
+    "skills": {
+      "title": "Skills"
+    },
+    "spells": {
+      "title": "Spells",
+      "addMagic": "Add Magic Abilities"
+    }
+  }
+}

src/main.tsx

@@ -3,6 +3,8 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
 import './index.css';
+// Import i18n configuration
+import './i18n/i18n';
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
     <React.StrictMode>

src/styles/CharacterSheet.css

@@ -20,10 +20,10 @@
 }
 
 .character-sheet {
-    max-width: 900px;
+    max-width: 599px;
     margin: 0 auto;
     padding: 20px;
-    font-family: 'Segoe UI', 'Roboto', -apple-system, BlinkMacSystemFont, sans-serif;
+    font-family: OptimusPrinceps;
     color: var(--ts-color-on-surface, var(--text-color));
     background-color: var(--ts-color-surface, var(--surface-color));
     line-height: 1.6;
@@ -519,39 +519,6 @@ button:active {
     --surface-variant-color: #f9f9f9;
 }
 
-/* Theme Toggle Button */
-.theme-toggle {
-    position: fixed;
-    top: 20px;
-    right: 20px;
-    width: 50px;
-    height: 50px;
-    border-radius: 25px;
-    background: var(--ts-color-primary);
-    color: white;
-    border: none;
-    font-size: 1.5rem;
-    cursor: pointer;
-    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
-    transition: all 0.3s ease;
-    z-index: 1000;
-}
-
-.theme-toggle:hover {
-    transform: scale(1.1);
-    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
-}
-
-.theme-icon {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    color: white;
-    font-size: 1.5rem;
-}
-
 body {
     background: var(--ts-background-primary, var(--background-color));
     transition: background-color 0.3s ease;

src/styles/LanguageSelector.css

@@ -0,0 +1,29 @@
+.language-selector {
+  display: flex;
+  gap: 8px;
+  margin: 10px;
+  position: absolute;
+  top: 10px;
+  right: 10px;
+}
+
+.language-btn {
+  background-color: var(--ts-color-primary, var(--primary-color));
+  color: var(--ts-color-on-primary, var(--on-primary-color));
+  border: 1px solid var(--border-color);
+  border-radius: 4px;
+  padding: 5px 10px;
+  cursor: pointer;
+  font-size: 14px;
+  transition: all 0.2s ease;
+}
+
+.language-btn:hover {
+  background-color: var(--bg-hover);
+}
+
+.language-btn.active {
+  background-color: var(--primary-color);
+  color: white;
+  border-color: var(--primary-color);
+}

src/styles/ThemeToggle.css

@@ -0,0 +1,17 @@
+.theme-toggle {
+    cursor: pointer;
+    display: flex;
+    position: fixed;
+    color: var(--ts-color-secondary);
+    background: var(--ts-background-tertiary);
+    bottom: 10px;
+    right: 10px;
+    padding: 10px;
+    border-radius: 50%;
+    z-index: 1000;
+}
+
+.theme-toggle:hover {
+    color: var(--ts-accent-hover);
+    background: var(--ts-accent-background);
+}

src/styles/talespire-variables.css

@@ -1,16 +0,0 @@
-/* src/styles/talespire-variables.css */
-:root {
-    /* TaleSpire Color Variables */
-    --ts-color-surface: #ffffff;
-    --ts-color-on-surface: #000000;
-    --ts-color-surface-variant: #f9f9f9;
-    --ts-color-primary: #7b2cbf;
-    --ts-color-secondary: #3a0ca3;
-    --ts-color-outline: #cccccc;
-    --ts-color-error: #ff4444;
-
-    /* Add other TaleSpire variables as you discover them */
-    --ts-color-background: #f5f5f5;
-    --ts-color-on-background: #222222;
-    --ts-background-primary: #1a1a1a,
-}

src/types/abilities.ts

@@ -0,0 +1,36 @@
+import type {DSAAttributes} from "./baseCharacter.ts";
+import type {DSABelastungen, DSAImprovements} from "./baseDSA.ts";
+
+export interface DSABaseAbility {
+  name: string
+  steigerungsfaktor: DSAImprovements
+}
+
+export interface DSASkill extends DSABaseAbility {
+  attributes: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes]
+  fertigkeitswert: number
+  belastung: DSABelastungen
+  anmerkung: string
+  routineProbe: number
+}
+
+export interface DSACombatTechnique extends DSABaseAbility {
+  primaryAttribute: keyof DSAAttributes
+  kampftechnikwert: number
+  hitcheck: number
+  paradecheck: number
+}
+
+export interface DSASpell {
+  name: string
+  check: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes]
+  skilllevel: number
+  cost: number
+  timeInSec: number
+  range: number
+  duration: number
+  property: string
+  improvement: DSAImprovements
+  effect: string[]
+  special: boolean
+}

src/types/baseCharacter.ts

@@ -0,0 +1,55 @@
+import type {DSABelastungen, DSACalculatedValue} from "./baseDSA.ts";
+
+export interface DSAAttributes {
+    courage: number;
+    cleverness: number;
+    intuition: number;
+    charisma: number;
+    dexterity: number;
+    agility: number;
+    constitution: number;
+    strength: number;
+}
+
+export interface DSAPersonalData {
+    name: string;
+    sex?: 'm' | 'w' | 'd';
+    species: string;
+    culture: string;
+    profession: string;
+    socialStanding: string;
+    hometown: string;
+    placeOfBirth?: string;
+    family: string;
+    age: string;
+    birthdate?: string;
+    hairColor?: string;
+    eyeColor?: string;
+    height?: string;
+    weight?: string;
+    characteristics?: string[];
+    image?: string;
+}
+
+export interface DSAStats {
+    lifePoints: {
+        value: DSACalculatedValue;
+        pain: number;
+        fatigue: number;
+    }
+    conditions?: string[];
+    astralEnergy?: DSACalculatedValue;
+    karmaEnergy?: DSACalculatedValue;
+    spirit: DSACalculatedValue;
+    thoughness: DSACalculatedValue;
+    dodge: DSACalculatedValue;
+    initiative: number; //TODO function?
+    movement: number;
+}
+
+export interface DSAExperienceLevel {
+    current: "Unerfahren" | "Durchschnittlich" | "Erfahren" | "Kompetent" | "Meisterlich" | "Brillant" | "Legendär"
+    apTotal: number
+    apAvailable: number
+    apSpent: number
+}

src/types/baseDSA.ts

@@ -0,0 +1,11 @@
+export interface DSACalculatedValue {
+    base: number;
+    modifier: number;
+    purchased?: number;
+    max: number;
+    current: number;
+}
+
+export type DSAImprovements = 'A' | 'B' | 'C' | 'D' | 'E' | 'other'
+
+export type DSABelastungen = 'JA' | 'NEIN' | 'EVTL';

src/types/baseEquiment.ts

@@ -0,0 +1,11 @@
+export interface DSABaseEquiment {
+    name: string;
+    weight: number;
+    carriedWhere: string;
+}
+
+export interface DSABaseWeapon extends DSABaseEquiment {
+    technique: string;
+    tp: number;
+    range: number;
+}

src/types/character.ts

@@ -1,69 +1,80 @@
-export interface DSAAttributes {
+import type {DSAAttributes, DSAHealth, DSAPersonalData, DSAResistances} from "./baseCharacter.ts";
-    courage: number;        // Mut
+import type {DSAArmor, DSAMeleeWeapon, DSARangedWeapon, DSAShield} from "./equiment.ts";
-    cleverness: number;     // Klugheit
+import type {DSACombatTechnique} from "./abilities.ts";
-    intuition: number;      // Intuition
+import type {DSAFatePoints} from "./fatepoints.ts";
-    charisma: number;       // Charisma
+import type {DSABelastungen, DSAImprovements} from "./baseDSA.ts";
-    dexterity: number;      // Fingerfertigkeit
-    agility: number;        // Gewandtheit
-    constitution: number;   // Konstitution
-    strength: number;       // Körperkraft
-}
 
 export interface DSASkill {
-    name: string;
+    name: string
-    attributes: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes];
+    attributes: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes]
-    value: number;
+    fertigkeitswert: number
+    belastung: DSABelastungen
+    steigerungsfaktor: DSAImprovements
+    anmerkung: string
+    routineProbe: number
 }
 
 export interface DSACombatValues {
-    lifePoints: {
+    initiative: number;
-        max: number;
+    speed: number;
-        current: number;
+    dodge: number;
-    };
+    unarmedAttack: number;
-    stamina: {
+    unarmedParry: number;
-        max: number;
+    meleeWeapons: DSAMeleeWeapon[];
-        current: number;
+    rangedWeapons: DSARangedWeapon[];
-    };
+    armor: DSAArmor[];
+    shield: DSAShield[];
+    combatAbilities: Record<string, DSACombatTechnique>;
+}
+
+export interface DSAAstral {
     astralEnergy?: {
         max: number;
         current: number;
     };
-    initiative: number;
+    spells: Record<string, DSASpell>;
-    speed: number;
+    traditions: string[];
+}
+
+export interface DSAKarmal {
+    karmalEnergy?: {
+        max: number;
+        current: number;
+    }
+    spells: Record<string, DSASpell>;
+    traditions: string[];
 }
 
 export interface DSASpell {
     id: string;
     name: string;
-    tradition: string[];                // Gildenmagier, Hexe, Druide, etc.
+    tradition: string[];
     attributes: [keyof DSAAttributes, keyof DSAAttributes, keyof DSAAttributes];
-    skillValue: number;                 // FW - Fertigkeitswert
+    skillValue: number;
-    aspCost: string;                   // "4 AsP", "2 AsP pro Stufe"
+    aspCost: string;
-    castingTime: string;               // "2 Aktionen", "5 Minuten"
+    castingTime: string;
-    range: string;                     // "Berührung", "7 Meter"
+    range: string;
-    duration: string;                  // "Sofort", "5 Minuten"
+    duration: string;
-    difficulty: number;                // Erschwernis/Erleichterung
+    difficulty: number;
     description: string;
     effect: string;
 }
 
 export interface DSACharacter {
     id: string;
-    name: string;
+    personalData: DSAPersonalData;
-    species: string;         // Spezies
+    experienceLevel: string;
-    culture: string;         // Kultur
-    profession: string;      // Profession
-    experienceLevel: string; // Erfahrungsgrad
     attributes: DSAAttributes;
+    health: DSAHealth;
+    resistances: DSAResistances;
     skills: Record<string, DSASkill>;
     combat: DSACombatValues;
-    advantages: string[];    // Vorteile
+    advantages: string[];
-    disadvantages: string[]; // Nachteile
+    disadvantages: string[];
-    equipment: string[];     // Ausrüstung
+    equipment: string[];
-    astralEnergy?: {
+    hasMagic: boolean;
-        max: number;
+    astral: DSAAstral;
-        current: number;
+    hasKarmal: boolean;
-    };
+    karmal: DSAKarmal;
-    spells: Record<string, DSASpell>;
+    fatepoints: DSAFatePoints;
-    magicalTraditions: string[];
 }

src/types/condition.ts

@@ -0,0 +1,4 @@
+export interface DSACondition {
+    condition: "confusion" | "encumbrance" | "fear" | "pain" | "paralysis" | "rapture" | "stupor";
+    level: 1 | 2 | 3 | 4;
+}

src/types/equiment.ts

@@ -0,0 +1,32 @@
+import type {DSABaseEquiment, DSABaseWeapon} from "./baseEquiment.ts";
+import type {DSACalculatedValue} from "./baseDSA.ts";
+
+
+export interface DSAAmmonution extends DSABaseEquiment {
+    perUse: number;
+    count: number;
+}
+
+export interface DSAMeleeWeapon extends DSABaseWeapon{
+    atpamod: number;
+    damagebonus: number;
+    at: number;
+    pa: number;
+}
+
+export interface DSARangedWeapon extends DSABaseWeapon{
+    reloaddur: number;
+    ammo: DSAAmmonution;
+    rangedCombat: number;
+}
+
+export interface DSAArmor extends DSABaseEquiment{
+    protection: number;
+    encumbrance: number;
+    penalties: number;
+}
+
+export interface DSAShieldParryWeapon extends DSABaseEquiment {
+    structure: DSACalculatedValue;
+    atpamod: number;
+}

src/types/fatepoints.ts

@@ -0,0 +1,6 @@
+export interface DSAFatePoints {
+    stats: number;
+    bonus: number;
+    max: number;
+    current: number;
+}

vite.config.ts

@@ -2,7 +2,9 @@ import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 
 export default defineConfig({
-  plugins: [react()],
+  plugins: [
+      react(),
+  ],
   base: './',
   build: {
     minify: 'esbuild', // ← Statt terser