最新

2025-09-20 14:32:23 +08:00
parent a9ee899cc5
commit f1ff72a105
35 changed files with 1023861 additions and 137 deletions
--- a/.DS_Store
+++ b/.DS_Store
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "idf.pythonInstallPath": "/Applications/miniconda3/bin/python"
+}
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,10 +8,13 @@
      "name": "ai-company-website",
      "version": "0.1.0",
      "dependencies": {
+        "@react-three/drei": "9.88",
+        "@react-three/fiber": "8.15",
        "framer-motion": "^10.16.4",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
-        "react-scripts": "5.0.1"
+        "react-scripts": "5.0.1",
+        "three": "^0.158.0"
      }
    },
    "node_modules/@alloc/quick-lru": {
@@ -2356,6 +2359,13 @@
        "postcss-selector-parser": "^6.0.10"
      }
    },
+    "node_modules/@dimforge/rapier3d-compat": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmmirror.com/@dimforge/rapier3d-compat/-/rapier3d-compat-0.12.0.tgz",
+      "integrity": "sha512-uekIGetywIgopfD97oDL5PfeezkFpNhwlzlaEYNOA0N6ghdsOvh/HYjSMek5Q2O1PYvRSDFcqFVJl4r4ZBwOow==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
    "node_modules/@emotion/is-prop-valid": {
      "version": "0.8.8",
      "resolved": "https://registry.npmmirror.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
@@ -2955,6 +2965,12 @@
      "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==",
      "license": "MIT"
    },
+    "node_modules/@mediapipe/tasks-vision": {
+      "version": "0.10.8",
+      "resolved": "https://registry.npmmirror.com/@mediapipe/tasks-vision/-/tasks-vision-0.10.8.tgz",
+      "integrity": "sha512-Rp7ll8BHrKB3wXaRFKhrltwZl1CiXGdibPxuWXvqGnKTnv8fqa/nvftYNuSbf+pbJWKYCXdBtYTITdAUTGGh0Q==",
+      "license": "Apache-2.0"
+    },
    "node_modules/@nicolo-ribaudo/eslint-scope-5-internals": {
      "version": "5.1.1-v1",
      "resolved": "https://registry.npmmirror.com/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz",
@@ -3079,6 +3095,194 @@
        }
      }
    },
+    "node_modules/@react-spring/animated": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmmirror.com/@react-spring/animated/-/animated-9.6.1.tgz",
+      "integrity": "sha512-ls/rJBrAqiAYozjLo5EPPLLOb1LM0lNVQcXODTC1SMtS6DbuBCPaKco5svFUQFMP2dso3O+qcC4k9FsKc0KxMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/shared": "~9.6.1",
+        "@react-spring/types": "~9.6.1"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
+    "node_modules/@react-spring/core": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmmirror.com/@react-spring/core/-/core-9.6.1.tgz",
+      "integrity": "sha512-3HAAinAyCPessyQNNXe5W0OHzRfa8Yo5P748paPcmMowZ/4sMfaZ2ZB6e5x5khQI8NusOHj8nquoutd6FRY5WQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/animated": "~9.6.1",
+        "@react-spring/rafz": "~9.6.1",
+        "@react-spring/shared": "~9.6.1",
+        "@react-spring/types": "~9.6.1"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/react-spring/donate"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
+    "node_modules/@react-spring/rafz": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmmirror.com/@react-spring/rafz/-/rafz-9.6.1.tgz",
+      "integrity": "sha512-v6qbgNRpztJFFfSE3e2W1Uz+g8KnIBs6SmzCzcVVF61GdGfGOuBrbjIcp+nUz301awVmREKi4eMQb2Ab2gGgyQ==",
+      "license": "MIT"
+    },
+    "node_modules/@react-spring/shared": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmmirror.com/@react-spring/shared/-/shared-9.6.1.tgz",
+      "integrity": "sha512-PBFBXabxFEuF8enNLkVqMC9h5uLRBo6GQhRMQT/nRTnemVENimgRd+0ZT4yFnAQ0AxWNiJfX3qux+bW2LbG6Bw==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/rafz": "~9.6.1",
+        "@react-spring/types": "~9.6.1"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
+    "node_modules/@react-spring/three": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmmirror.com/@react-spring/three/-/three-9.6.1.tgz",
+      "integrity": "sha512-Tyw2YhZPKJAX3t2FcqvpLRb71CyTe1GvT3V+i+xJzfALgpk10uPGdGaQQ5Xrzmok1340DAeg2pR/MCfaW7b8AA==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/animated": "~9.6.1",
+        "@react-spring/core": "~9.6.1",
+        "@react-spring/shared": "~9.6.1",
+        "@react-spring/types": "~9.6.1"
+      },
+      "peerDependencies": {
+        "@react-three/fiber": ">=6.0",
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+        "three": ">=0.126"
+      }
+    },
+    "node_modules/@react-spring/types": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmmirror.com/@react-spring/types/-/types-9.6.1.tgz",
+      "integrity": "sha512-POu8Mk0hIU3lRXB3bGIGe4VHIwwDsQyoD1F394OK7STTiX9w4dG3cTLljjYswkQN+hDSHRrj4O36kuVa7KPU8Q==",
+      "license": "MIT"
+    },
+    "node_modules/@react-three/drei": {
+      "version": "9.88.17",
+      "resolved": "https://registry.npmmirror.com/@react-three/drei/-/drei-9.88.17.tgz",
+      "integrity": "sha512-WEYAkikzw0juG3F1aMy1AEeuRmsGmKytb8ETZARd4E6Q61Z1ceoL7fRvrnrXE/A2MHKgSzJgkckMEhKlbbJlyw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.11.2",
+        "@mediapipe/tasks-vision": "0.10.8",
+        "@react-spring/three": "~9.6.1",
+        "@use-gesture/react": "^10.2.24",
+        "camera-controls": "^2.4.2",
+        "cross-env": "^7.0.3",
+        "detect-gpu": "^5.0.28",
+        "glsl-noise": "^0.0.0",
+        "lodash.clamp": "^4.0.3",
+        "lodash.omit": "^4.5.0",
+        "lodash.pick": "^4.4.0",
+        "maath": "^0.9.0",
+        "meshline": "^3.1.6",
+        "react-composer": "^5.0.3",
+        "react-merge-refs": "^1.1.0",
+        "stats-gl": "^1.0.4",
+        "stats.js": "^0.17.0",
+        "suspend-react": "^0.1.3",
+        "three-mesh-bvh": "^0.6.7",
+        "three-stdlib": "^2.28.0",
+        "troika-three-text": "^0.47.2",
+        "utility-types": "^3.10.0",
+        "uuid": "^9.0.1",
+        "zustand": "^3.5.13"
+      },
+      "peerDependencies": {
+        "@react-three/fiber": ">=8.0",
+        "react": ">=18.0",
+        "react-dom": ">=18.0",
+        "three": ">=0.137"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@react-three/drei/node_modules/uuid": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmmirror.com/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
+    "node_modules/@react-three/fiber": {
+      "version": "8.15.19",
+      "resolved": "https://registry.npmmirror.com/@react-three/fiber/-/fiber-8.15.19.tgz",
+      "integrity": "sha512-WbFU7T6485v8Onnp+JJnrzKFvvGP7OFyJmHlqXiXc2RcXl9Sax+ykJxiNwEXWjGjcgF9/KTfv0+pAVkP0vZlKg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.17.8",
+        "@types/react-reconciler": "^0.26.7",
+        "@types/webxr": "*",
+        "base64-js": "^1.5.1",
+        "buffer": "^6.0.3",
+        "its-fine": "^1.0.6",
+        "react-reconciler": "^0.27.0",
+        "react-use-measure": "^2.1.1",
+        "scheduler": "^0.21.0",
+        "suspend-react": "^0.1.3",
+        "zustand": "^3.7.1"
+      },
+      "peerDependencies": {
+        "expo": ">=43.0",
+        "expo-asset": ">=8.4",
+        "expo-file-system": ">=11.0",
+        "expo-gl": ">=11.0",
+        "react": ">=18.0",
+        "react-dom": ">=18.0",
+        "react-native": ">=0.64",
+        "three": ">=0.133"
+      },
+      "peerDependenciesMeta": {
+        "expo": {
+          "optional": true
+        },
+        "expo-asset": {
+          "optional": true
+        },
+        "expo-file-system": {
+          "optional": true
+        },
+        "expo-gl": {
+          "optional": true
+        },
+        "react-dom": {
+          "optional": true
+        },
+        "react-native": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@react-three/fiber/node_modules/scheduler": {
+      "version": "0.21.0",
+      "resolved": "https://registry.npmmirror.com/scheduler/-/scheduler-0.21.0.tgz",
+      "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
+    },
    "node_modules/@rollup/plugin-babel": {
      "version": "5.3.1",
      "resolved": "https://registry.npmmirror.com/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -3445,6 +3649,13 @@
        "node": ">=10.13.0"
      }
    },
+    "node_modules/@tweenjs/tween.js": {
+      "version": "23.1.3",
+      "resolved": "https://registry.npmmirror.com/@tweenjs/tween.js/-/tween.js-23.1.3.tgz",
+      "integrity": "sha512-vJmvvwFxYuGnF2axRtPYocag6Clbb5YS7kLL+SO/TeVFzHqDIWrNKYtcsPMibjDx9O+bu+psAy9NKfWklassUA==",
+      "license": "MIT",
+      "peer": true
+    },
    "node_modules/@types/babel__core": {
      "version": "7.20.5",
      "resolved": "https://registry.npmmirror.com/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -3524,6 +3735,12 @@
        "@types/node": "*"
      }
    },
+    "node_modules/@types/draco3d": {
+      "version": "1.4.10",
+      "resolved": "https://registry.npmmirror.com/@types/draco3d/-/draco3d-1.4.10.tgz",
+      "integrity": "sha512-AX22jp8Y7wwaBgAixaSvkoG4M/+PlAcm3Qs4OW8yT9DM4xUpWKeFhLueTAyZF39pviAdcDdeJoACapiAceqNcw==",
+      "license": "MIT"
+    },
    "node_modules/@types/eslint": {
      "version": "8.56.12",
      "resolved": "https://registry.npmmirror.com/@types/eslint/-/eslint-8.56.12.tgz",
@@ -3676,6 +3893,12 @@
        "@types/node": "*"
      }
    },
+    "node_modules/@types/offscreencanvas": {
+      "version": "2019.7.3",
+      "resolved": "https://registry.npmmirror.com/@types/offscreencanvas/-/offscreencanvas-2019.7.3.tgz",
+      "integrity": "sha512-ieXiYmgSRXUDeOntE1InxjWyvEelZGP63M+cGuquuRLuIKKT1osnkXjxev9B7d1nXSug5vpunx+gNlbVxMlC9A==",
+      "license": "MIT"
+    },
    "node_modules/@types/parse-json": {
      "version": "4.0.2",
      "resolved": "https://registry.npmmirror.com/@types/parse-json/-/parse-json-4.0.2.tgz",
@@ -3706,6 +3929,24 @@
      "integrity": "sha512-hKormJbkJqzQGhziax5PItDUTMAM9uE2XXQmM37dyd4hVM+5aVl7oVxMVUiVQn2oCQFN/LKCZdvSM0pFRqbSmQ==",
      "license": "MIT"
    },
+    "node_modules/@types/react": {
+      "version": "19.1.13",
+      "resolved": "https://registry.npmmirror.com/@types/react/-/react-19.1.13.tgz",
+      "integrity": "sha512-hHkbU/eoO3EG5/MZkuFSKmYqPbSVk5byPFa3e7y/8TybHiLMACgI8seVYlicwk7H5K/rI2px9xrQp/C+AUDTiQ==",
+      "license": "MIT",
+      "dependencies": {
+        "csstype": "^3.0.2"
+      }
+    },
+    "node_modules/@types/react-reconciler": {
+      "version": "0.26.7",
+      "resolved": "https://registry.npmmirror.com/@types/react-reconciler/-/react-reconciler-0.26.7.tgz",
+      "integrity": "sha512-mBDYl8x+oyPX/VBb3E638N0B7xG+SPk/EAMcVPeexqus/5aTpTphQi0curhhshOqRrc9t6OPoJfEUkbymse/lQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/react": "*"
+      }
+    },
    "node_modules/@types/resolve": {
      "version": "1.17.1",
      "resolved": "https://registry.npmmirror.com/@types/resolve/-/resolve-1.17.1.tgz",
@@ -3772,12 +4013,41 @@
      "integrity": "sha512-9aEbYZ3TbYMznPdcdr3SmIrLXwC/AKZXQeCf9Pgao5CKb8CyHuEX5jzWPTkvregvhRJHcpRO6BFoGW9ycaOkYw==",
      "license": "MIT"
    },
+    "node_modules/@types/stats.js": {
+      "version": "0.17.4",
+      "resolved": "https://registry.npmmirror.com/@types/stats.js/-/stats.js-0.17.4.tgz",
+      "integrity": "sha512-jIBvWWShCvlBqBNIZt0KAshWpvSjhkwkEu4ZUcASoAvhmrgAUI2t1dXrjSL4xXVLB4FznPrIsX3nKXFl/Dt4vA==",
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/@types/three": {
+      "version": "0.180.0",
+      "resolved": "https://registry.npmmirror.com/@types/three/-/three-0.180.0.tgz",
+      "integrity": "sha512-ykFtgCqNnY0IPvDro7h+9ZeLY+qjgUWv+qEvUt84grhenO60Hqd4hScHE7VTB9nOQ/3QM8lkbNE+4vKjEpUxKg==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@dimforge/rapier3d-compat": "~0.12.0",
+        "@tweenjs/tween.js": "~23.1.3",
+        "@types/stats.js": "*",
+        "@types/webxr": "*",
+        "@webgpu/types": "*",
+        "fflate": "~0.8.2",
+        "meshoptimizer": "~0.22.0"
+      }
+    },
    "node_modules/@types/trusted-types": {
      "version": "2.0.7",
      "resolved": "https://registry.npmmirror.com/@types/trusted-types/-/trusted-types-2.0.7.tgz",
      "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
      "license": "MIT"
    },
+    "node_modules/@types/webxr": {
+      "version": "0.5.23",
+      "resolved": "https://registry.npmmirror.com/@types/webxr/-/webxr-0.5.23.tgz",
+      "integrity": "sha512-GPe4AsfOSpqWd3xA/0gwoKod13ChcfV67trvxaW2krUbgb9gxQjnCx8zGshzMl8LSHZlNH5gQ8LNScsDuc7nGQ==",
+      "license": "MIT"
+    },
    "node_modules/@types/ws": {
      "version": "8.18.1",
      "resolved": "https://registry.npmmirror.com/@types/ws/-/ws-8.18.1.tgz",
@@ -4037,6 +4307,24 @@
      "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==",
      "license": "ISC"
    },
+    "node_modules/@use-gesture/core": {
+      "version": "10.3.1",
+      "resolved": "https://registry.npmmirror.com/@use-gesture/core/-/core-10.3.1.tgz",
+      "integrity": "sha512-WcINiDt8WjqBdUXye25anHiNxPc0VOrlT8F6LLkU6cycrOGUDyY/yyFmsg3k8i5OLvv25llc0QC45GhR/C8llw==",
+      "license": "MIT"
+    },
+    "node_modules/@use-gesture/react": {
+      "version": "10.3.1",
+      "resolved": "https://registry.npmmirror.com/@use-gesture/react/-/react-10.3.1.tgz",
+      "integrity": "sha512-Yy19y6O2GJq8f7CHf7L0nxL8bf4PZCPaVOCgJrusOeFHY1LvHgYXnmnXg6N5iwAnbgbZCDjo60SiM6IPJi9C5g==",
+      "license": "MIT",
+      "dependencies": {
+        "@use-gesture/core": "10.3.1"
+      },
+      "peerDependencies": {
+        "react": ">= 16.8.0"
+      }
+    },
    "node_modules/@webassemblyjs/ast": {
      "version": "1.14.1",
      "resolved": "https://registry.npmmirror.com/@webassemblyjs/ast/-/ast-1.14.1.tgz",
@@ -4183,6 +4471,13 @@
        "@xtuc/long": "4.2.2"
      }
    },
+    "node_modules/@webgpu/types": {
+      "version": "0.1.65",
+      "resolved": "https://registry.npmmirror.com/@webgpu/types/-/types-0.1.65.tgz",
+      "integrity": "sha512-cYrHab4d6wuVvDW5tdsfI6/o6vcLMDe6w2Citd1oS51Xxu2ycLCnVo4fqwujfKWijrZMInTJIKcXxteoy21nVA==",
+      "license": "BSD-3-Clause",
+      "peer": true
+    },
    "node_modules/@xtuc/ieee754": {
      "version": "1.2.0",
      "resolved": "https://registry.npmmirror.com/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
@@ -5065,6 +5360,26 @@
      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
      "license": "MIT"
    },
+    "node_modules/base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmmirror.com/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
    "node_modules/baseline-browser-mapping": {
      "version": "2.8.3",
      "resolved": "https://registry.npmmirror.com/baseline-browser-mapping/-/baseline-browser-mapping-2.8.3.tgz",
@@ -5096,6 +5411,15 @@
        "node": ">= 8.0.0"
      }
    },
+    "node_modules/bidi-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmmirror.com/bidi-js/-/bidi-js-1.0.3.tgz",
+      "integrity": "sha512-RKshQI1R3YQ+n9YJz2QQ147P66ELpa1FQEg20Dk8oW9t2KgLbpDLLp9aGZ7y8WHSshDknG0bknqGw5/tyCs5tw==",
+      "license": "MIT",
+      "dependencies": {
+        "require-from-string": "^2.0.2"
+      }
+    },
    "node_modules/big.js": {
      "version": "5.2.2",
      "resolved": "https://registry.npmmirror.com/big.js/-/big.js-5.2.2.tgz",
@@ -5260,6 +5584,30 @@
        "node-int64": "^0.4.0"
      }
    },
+    "node_modules/buffer": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmmirror.com/buffer/-/buffer-6.0.3.tgz",
+      "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "base64-js": "^1.3.1",
+        "ieee754": "^1.2.1"
+      }
+    },
    "node_modules/buffer-from": {
      "version": "1.1.2",
      "resolved": "https://registry.npmmirror.com/buffer-from/-/buffer-from-1.1.2.tgz",
@@ -5374,6 +5722,15 @@
        "node": ">= 6"
      }
    },
+    "node_modules/camera-controls": {
+      "version": "2.10.1",
+      "resolved": "https://registry.npmmirror.com/camera-controls/-/camera-controls-2.10.1.tgz",
+      "integrity": "sha512-KnaKdcvkBJ1Irbrzl8XD6WtZltkRjp869Jx8c0ujs9K+9WD+1D7ryBsCiVqJYUqt6i/HR5FxT7RLASieUD+Q5w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "three": ">=0.126.1"
+      }
+    },
    "node_modules/caniuse-api": {
      "version": "3.0.0",
      "resolved": "https://registry.npmmirror.com/caniuse-api/-/caniuse-api-3.0.0.tgz",
@@ -5876,6 +6233,24 @@
        "node": ">=10"
      }
    },
+    "node_modules/cross-env": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmmirror.com/cross-env/-/cross-env-7.0.3.tgz",
+      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
+      "license": "MIT",
+      "dependencies": {
+        "cross-spawn": "^7.0.1"
+      },
+      "bin": {
+        "cross-env": "src/bin/cross-env.js",
+        "cross-env-shell": "src/bin/cross-env-shell.js"
+      },
+      "engines": {
+        "node": ">=10.14",
+        "npm": ">=6",
+        "yarn": ">=1"
+      }
+    },
    "node_modules/cross-spawn": {
      "version": "7.0.6",
      "resolved": "https://registry.npmmirror.com/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -6268,6 +6643,12 @@
      "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==",
      "license": "MIT"
    },
+    "node_modules/csstype": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+      "license": "MIT"
+    },
    "node_modules/damerau-levenshtein": {
      "version": "1.0.8",
      "resolved": "https://registry.npmmirror.com/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz",
@@ -6466,6 +6847,15 @@
        "npm": "1.2.8000 || >= 1.4.16"
      }
    },
+    "node_modules/detect-gpu": {
+      "version": "5.0.70",
+      "resolved": "https://registry.npmmirror.com/detect-gpu/-/detect-gpu-5.0.70.tgz",
+      "integrity": "sha512-bqerEP1Ese6nt3rFkwPnGbsUF9a4q+gMmpTVVOEzoCyeCc+y7/RvJnQZJx1JwhgQI5Ntg0Kgat8Uu7XpBqnz1w==",
+      "license": "MIT",
+      "dependencies": {
+        "webgl-constants": "^1.1.1"
+      }
+    },
    "node_modules/detect-newline": {
      "version": "3.1.0",
      "resolved": "https://registry.npmmirror.com/detect-newline/-/detect-newline-3.1.0.tgz",
@@ -6681,6 +7071,12 @@
      "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==",
      "license": "BSD-2-Clause"
    },
+    "node_modules/draco3d": {
+      "version": "1.5.7",
+      "resolved": "https://registry.npmmirror.com/draco3d/-/draco3d-1.5.7.tgz",
+      "integrity": "sha512-m6WCKt/erDXcw+70IJXnG7M3awwQPAsZvJGX5zY7beBqpELw6RDGkYVU0W43AFxye4pDZ5i2Lbyc/NNGqwjUVQ==",
+      "license": "Apache-2.0"
+    },
    "node_modules/dunder-proto": {
      "version": "1.0.1",
      "resolved": "https://registry.npmmirror.com/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -7872,6 +8268,13 @@
        "bser": "2.1.1"
      }
    },
+    "node_modules/fflate": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmmirror.com/fflate/-/fflate-0.8.2.tgz",
+      "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==",
+      "license": "MIT",
+      "peer": true
+    },
    "node_modules/file-entry-cache": {
      "version": "6.0.1",
      "resolved": "https://registry.npmmirror.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz",
@@ -8592,6 +8995,12 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/glsl-noise": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmmirror.com/glsl-noise/-/glsl-noise-0.0.0.tgz",
+      "integrity": "sha512-b/ZCF6amfAUb7dJM/MxRs7AetQEahYzJ8PtgfrmEdtw6uyGOr+ZSGtgjFm6mfsBkxJ4d2W7kg+Nlqzqvn3Bc0w==",
+      "license": "MIT"
+    },
    "node_modules/gopd": {
      "version": "1.2.0",
      "resolved": "https://registry.npmmirror.com/gopd/-/gopd-1.2.0.tgz",
@@ -9046,6 +9455,26 @@
        "node": ">=4"
      }
    },
+    "node_modules/ieee754": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmmirror.com/ieee754/-/ieee754-1.2.1.tgz",
+      "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
    "node_modules/ignore": {
      "version": "5.3.2",
      "resolved": "https://registry.npmmirror.com/ignore/-/ignore-5.3.2.tgz",
@@ -9799,6 +10228,27 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/its-fine": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmmirror.com/its-fine/-/its-fine-1.2.5.tgz",
+      "integrity": "sha512-fXtDA0X0t0eBYAGLVM5YsgJGsJ5jEmqZEPrGbzdf5awjv0xE7nqv3TVnvtUF060Tkes15DbDAKW/I48vsb6SyA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/react-reconciler": "^0.28.0"
+      },
+      "peerDependencies": {
+        "react": ">=18.0"
+      }
+    },
+    "node_modules/its-fine/node_modules/@types/react-reconciler": {
+      "version": "0.28.9",
+      "resolved": "https://registry.npmmirror.com/@types/react-reconciler/-/react-reconciler-0.28.9.tgz",
+      "integrity": "sha512-HHM3nxyUZ3zAylX8ZEyrDNd2XZOnQ0D5XfunJF5FLQnZbHHYq4UWvW1QfelQNXv1ICNkwYhfxjwfnqivYB6bFg==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/react": "*"
+      }
+    },
    "node_modules/jackspeak": {
      "version": "3.4.3",
      "resolved": "https://registry.npmmirror.com/jackspeak/-/jackspeak-3.4.3.tgz",
@@ -11057,6 +11507,12 @@
      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
      "license": "MIT"
    },
+    "node_modules/lodash.clamp": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmmirror.com/lodash.clamp/-/lodash.clamp-4.0.3.tgz",
+      "integrity": "sha512-HvzRFWjtcguTW7yd8NJBshuNaCa8aqNFtnswdT7f/cMd/1YKy5Zzoq4W/Oxvnx9l7aeY258uSdDfM793+eLsVg==",
+      "license": "MIT"
+    },
    "node_modules/lodash.debounce": {
      "version": "4.0.8",
      "resolved": "https://registry.npmmirror.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@@ -11075,6 +11531,20 @@
      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
      "license": "MIT"
    },
+    "node_modules/lodash.omit": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmmirror.com/lodash.omit/-/lodash.omit-4.5.0.tgz",
+      "integrity": "sha512-XeqSp49hNGmlkj2EJlfrQFIzQ6lXdNro9sddtQzcJY8QaoC2GO0DT7xaIokHeyM+mIT0mPMlPvkYzg2xCuHdZg==",
+      "deprecated": "This package is deprecated. Use destructuring assignment syntax instead.",
+      "license": "MIT"
+    },
+    "node_modules/lodash.pick": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmmirror.com/lodash.pick/-/lodash.pick-4.4.0.tgz",
+      "integrity": "sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==",
+      "deprecated": "This package is deprecated. Use destructuring assignment syntax instead.",
+      "license": "MIT"
+    },
    "node_modules/lodash.sortby": {
      "version": "4.7.0",
      "resolved": "https://registry.npmmirror.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
@@ -11117,6 +11587,16 @@
        "yallist": "^3.0.2"
      }
    },
+    "node_modules/maath": {
+      "version": "0.9.0",
+      "resolved": "https://registry.npmmirror.com/maath/-/maath-0.9.0.tgz",
+      "integrity": "sha512-aAR8hoUqPxlsU8VOxkS9y37jhUzdUxM017NpCuxFU1Gk+nMaZASZxymZrV8LRSHzRk/watlbfyNKu6XPUhCFrQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/three": ">=0.144.0",
+        "three": ">=0.144.0"
+      }
+    },
    "node_modules/magic-string": {
      "version": "0.25.9",
      "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.25.9.tgz",
@@ -11219,6 +11699,22 @@
        "node": ">= 8"
      }
    },
+    "node_modules/meshline": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmmirror.com/meshline/-/meshline-3.3.1.tgz",
+      "integrity": "sha512-/TQj+JdZkeSUOl5Mk2J7eLcYTLiQm2IDzmlSvYm7ov15anEcDJ92GHqqazxTSreeNgfnYu24kiEvvv0WlbCdFQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "three": ">=0.137"
+      }
+    },
+    "node_modules/meshoptimizer": {
+      "version": "0.22.0",
+      "resolved": "https://registry.npmmirror.com/meshoptimizer/-/meshoptimizer-0.22.0.tgz",
+      "integrity": "sha512-IebiK79sqIy+E4EgOr+CAw+Ke8hAspXKzBd0JdgEmPHiAwmvEj2S4h1rfvo+o/BnfEYd/jAOg5IeeIjzlzSnDg==",
+      "license": "MIT",
+      "peer": true
+    },
    "node_modules/methods": {
      "version": "1.1.2",
      "resolved": "https://registry.npmmirror.com/methods/-/methods-1.1.2.tgz",
@@ -13384,6 +13880,12 @@
      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
      "license": "MIT"
    },
+    "node_modules/potpack": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmmirror.com/potpack/-/potpack-1.0.2.tgz",
+      "integrity": "sha512-choctRBIV9EMT9WGAZHn3V7t0Z2pMQyl0EZE6pFc/6ml3ssw7Dlf/oAOvFwjm1HVsqfQN8GfeFyJ+d8tRzqueQ==",
+      "license": "ISC"
+    },
    "node_modules/prelude-ls": {
      "version": "1.2.1",
      "resolved": "https://registry.npmmirror.com/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -13664,6 +14166,18 @@
        "node": ">=14"
      }
    },
+    "node_modules/react-composer": {
+      "version": "5.0.3",
+      "resolved": "https://registry.npmmirror.com/react-composer/-/react-composer-5.0.3.tgz",
+      "integrity": "sha512-1uWd07EME6XZvMfapwZmc7NgCZqDemcvicRi3wMJzXsQLvZ3L7fTHVyPy1bZdnWXM4iPjYuNE+uJ41MLKeTtnA==",
+      "license": "MIT",
+      "dependencies": {
+        "prop-types": "^15.6.0"
+      },
+      "peerDependencies": {
+        "react": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
    "node_modules/react-dev-utils": {
      "version": "12.0.1",
      "resolved": "https://registry.npmmirror.com/react-dev-utils/-/react-dev-utils-12.0.1.tgz",
@@ -13794,6 +14308,41 @@
      "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
      "license": "MIT"
    },
+    "node_modules/react-merge-refs": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmmirror.com/react-merge-refs/-/react-merge-refs-1.1.0.tgz",
+      "integrity": "sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/gregberge"
+      }
+    },
+    "node_modules/react-reconciler": {
+      "version": "0.27.0",
+      "resolved": "https://registry.npmmirror.com/react-reconciler/-/react-reconciler-0.27.0.tgz",
+      "integrity": "sha512-HmMDKciQjYmBRGuuhIaKA1ba/7a+UsM5FzOZsMO2JYHt9Jh8reCb7j1eDC95NOyUlKM9KRyvdx0flBuDvYSBoA==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.21.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "peerDependencies": {
+        "react": "^18.0.0"
+      }
+    },
+    "node_modules/react-reconciler/node_modules/scheduler": {
+      "version": "0.21.0",
+      "resolved": "https://registry.npmmirror.com/scheduler/-/scheduler-0.21.0.tgz",
+      "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
+    },
    "node_modules/react-refresh": {
      "version": "0.11.0",
      "resolved": "https://registry.npmmirror.com/react-refresh/-/react-refresh-0.11.0.tgz",
@@ -13876,6 +14425,21 @@
        }
      }
    },
+    "node_modules/react-use-measure": {
+      "version": "2.1.7",
+      "resolved": "https://registry.npmmirror.com/react-use-measure/-/react-use-measure-2.1.7.tgz",
+      "integrity": "sha512-KrvcAo13I/60HpwGO5jpW7E9DfusKyLPLvuHlUyP5zqnmAPhNc6qTRjUQrdTADl0lpPpDVU2/Gg51UlOGHXbdg==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": ">=16.13",
+        "react-dom": ">=16.13"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/read-cache": {
      "version": "1.0.0",
      "resolved": "https://registry.npmmirror.com/read-cache/-/read-cache-1.0.0.tgz",
@@ -15129,6 +15693,18 @@
        "node": ">= 0.8.0"
      }
    },
+    "node_modules/stats-gl": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmmirror.com/stats-gl/-/stats-gl-1.0.7.tgz",
+      "integrity": "sha512-vZI82CjefSxLC1bjw36z28v0+QE9rJKymGlXtfWu+ipW70ZEAwa4EbO4LxluAfLfpqiaAS04NzpYBRLDeAwYWQ==",
+      "license": "MIT"
+    },
+    "node_modules/stats.js": {
+      "version": "0.17.0",
+      "resolved": "https://registry.npmmirror.com/stats.js/-/stats.js-0.17.0.tgz",
+      "integrity": "sha512-hNKz8phvYLPEcRkeG1rsGmV5ChMjKDAWU7/OJJdDErPBNChQXxCo3WZurGpnWc6gZhAzEPFad1aVgyOANH1sMw==",
+      "license": "MIT"
+    },
    "node_modules/statuses": {
      "version": "2.0.1",
      "resolved": "https://registry.npmmirror.com/statuses/-/statuses-2.0.1.tgz",
@@ -15549,6 +16125,15 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/suspend-react": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmmirror.com/suspend-react/-/suspend-react-0.1.3.tgz",
+      "integrity": "sha512-aqldKgX9aZqpoDp3e8/BZ8Dm7x1pJl+qI3ZKxDN0i/IQTWUwBx/ManmlVJ3wowqbno6c2bmiIfs+Um6LbsjJyQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": ">=17.0"
+      }
+    },
    "node_modules/svg-parser": {
      "version": "2.0.4",
      "resolved": "https://registry.npmmirror.com/svg-parser/-/svg-parser-2.0.4.tgz",
@@ -15935,6 +16520,44 @@
        "node": ">=0.8"
      }
    },
+    "node_modules/three": {
+      "version": "0.158.0",
+      "resolved": "https://registry.npmmirror.com/three/-/three-0.158.0.tgz",
+      "integrity": "sha512-TALj4EOpdDPF1henk2Q+s17K61uEAAWQ7TJB68nr7FKxqwyDr3msOt5IWdbGm4TaWKjrtWS8DJJWe9JnvsWOhQ==",
+      "license": "MIT"
+    },
+    "node_modules/three-mesh-bvh": {
+      "version": "0.6.8",
+      "resolved": "https://registry.npmmirror.com/three-mesh-bvh/-/three-mesh-bvh-0.6.8.tgz",
+      "integrity": "sha512-EGebF9DZx1S8+7OZYNNTT80GXJZVf+UYXD/HyTg/e2kR/ApofIFfUS4ZzIHNnUVIadpnLSzM4n96wX+l7GMbnQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "three": ">= 0.151.0"
+      }
+    },
+    "node_modules/three-stdlib": {
+      "version": "2.36.0",
+      "resolved": "https://registry.npmmirror.com/three-stdlib/-/three-stdlib-2.36.0.tgz",
+      "integrity": "sha512-kv0Byb++AXztEGsULgMAs8U2jgUdz6HPpAB/wDJnLiLlaWQX2APHhiTJIN7rqW+Of0eRgcp7jn05U1BsCP3xBA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/draco3d": "^1.4.0",
+        "@types/offscreencanvas": "^2019.6.4",
+        "@types/webxr": "^0.5.2",
+        "draco3d": "^1.4.1",
+        "fflate": "^0.6.9",
+        "potpack": "^1.0.1"
+      },
+      "peerDependencies": {
+        "three": ">=0.128.0"
+      }
+    },
+    "node_modules/three-stdlib/node_modules/fflate": {
+      "version": "0.6.10",
+      "resolved": "https://registry.npmmirror.com/fflate/-/fflate-0.6.10.tgz",
+      "integrity": "sha512-IQrh3lEPM93wVCEczc9SaAOvkmcoQn/G8Bo1e8ZPlY3X3bnAxWaBdvTdvM1hP62iZp0BXWDy4vTAy4fF0+Dlpg==",
+      "license": "MIT"
+    },
    "node_modules/throat": {
      "version": "6.0.2",
      "resolved": "https://registry.npmmirror.com/throat/-/throat-6.0.2.tgz",
@@ -16010,6 +16633,36 @@
        "node": ">=8"
      }
    },
+    "node_modules/troika-three-text": {
+      "version": "0.47.2",
+      "resolved": "https://registry.npmmirror.com/troika-three-text/-/troika-three-text-0.47.2.tgz",
+      "integrity": "sha512-qylT0F+U7xGs+/PEf3ujBdJMYWbn0Qci0kLqI5BJG2kW1wdg4T1XSxneypnF05DxFqJhEzuaOR9S2SjiyknMng==",
+      "license": "MIT",
+      "dependencies": {
+        "bidi-js": "^1.0.2",
+        "troika-three-utils": "^0.47.2",
+        "troika-worker-utils": "^0.47.2",
+        "webgl-sdf-generator": "1.1.1"
+      },
+      "peerDependencies": {
+        "three": ">=0.125.0"
+      }
+    },
+    "node_modules/troika-three-utils": {
+      "version": "0.47.2",
+      "resolved": "https://registry.npmmirror.com/troika-three-utils/-/troika-three-utils-0.47.2.tgz",
+      "integrity": "sha512-/28plhCxfKtH7MSxEGx8e3b/OXU5A0xlwl+Sbdp0H8FXUHKZDoksduEKmjQayXYtxAyuUiCRunYIv/8Vi7aiyg==",
+      "license": "MIT",
+      "peerDependencies": {
+        "three": ">=0.125.0"
+      }
+    },
+    "node_modules/troika-worker-utils": {
+      "version": "0.47.2",
+      "resolved": "https://registry.npmmirror.com/troika-worker-utils/-/troika-worker-utils-0.47.2.tgz",
+      "integrity": "sha512-mzss4MeyzUkYBppn4x5cdAqrhBHFEuVmMMgLMTyFV23x6GvQMyo+/R5E5Lsbrt7WSt5RfvewjcwD1DChRTA9lA==",
+      "license": "MIT"
+    },
    "node_modules/tryer": {
      "version": "1.0.1",
      "resolved": "https://registry.npmmirror.com/tryer/-/tryer-1.0.1.tgz",
@@ -16212,9 +16865,9 @@
      }
    },
    "node_modules/typescript": {
-      "version": "5.9.2",
-      "resolved": "https://registry.npmmirror.com/typescript/-/typescript-5.9.2.tgz",
-      "integrity": "sha512-CWBzXQrc/qOkhidw1OzBTQuYRbfyxDXJMVJ1XNwUHGROVmuaeiEm3OslpZ1RV96d7SKKjZKrSJu3+t/xlw3R9A==",
+      "version": "4.9.5",
+      "resolved": "https://registry.npmmirror.com/typescript/-/typescript-4.9.5.tgz",
+      "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
      "license": "Apache-2.0",
      "peer": true,
      "bin": {
@@ -16222,7 +16875,7 @@
        "tsserver": "bin/tsserver"
      },
      "engines": {
-        "node": ">=14.17"
+        "node": ">=4.2.0"
      }
    },
    "node_modules/unbox-primitive": {
@@ -16417,6 +17070,15 @@
      "integrity": "sha512-Z0DbgELS9/L/75wZbro8xAnT50pBVFQZ+hUEueGDU5FN51YSCYM+jdxsfCiHjwNP/4LCDD0i/graKpeBnOXKRA==",
      "license": "MIT"
    },
+    "node_modules/utility-types": {
+      "version": "3.11.0",
+      "resolved": "https://registry.npmmirror.com/utility-types/-/utility-types-3.11.0.tgz",
+      "integrity": "sha512-6Z7Ma2aVEWisaL6TvBCy7P8rm2LQoPv6dJ7ecIaIixHcwfbJ0x7mWdbcwlIM5IGQxPZSFYeqRCqlOOeKoJYMkw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
    "node_modules/utils-merge": {
      "version": "1.0.1",
      "resolved": "https://registry.npmmirror.com/utils-merge/-/utils-merge-1.0.1.tgz",
@@ -16517,6 +17179,17 @@
        "minimalistic-assert": "^1.0.0"
      }
    },
+    "node_modules/webgl-constants": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmmirror.com/webgl-constants/-/webgl-constants-1.1.1.tgz",
+      "integrity": "sha512-LkBXKjU5r9vAW7Gcu3T5u+5cvSvh5WwINdr0C+9jpzVB41cjQAP5ePArDtk/WHYdVj0GefCgM73BA7FlIiNtdg=="
+    },
+    "node_modules/webgl-sdf-generator": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmmirror.com/webgl-sdf-generator/-/webgl-sdf-generator-1.1.1.tgz",
+      "integrity": "sha512-9Z0JcMTFxeE+b2x1LJTdnaT8rT8aEp7MVxkNwoycNmJWwPdzoXzMh0BjJSh/AEFP+KPYZUli814h8bJZFIZ2jA==",
+      "license": "MIT"
+    },
    "node_modules/webidl-conversions": {
      "version": "6.1.0",
      "resolved": "https://registry.npmmirror.com/webidl-conversions/-/webidl-conversions-6.1.0.tgz",
@@ -17397,6 +18070,23 @@
      "funding": {
        "url": "https://github.com/sponsors/sindresorhus"
      }
+    },
+    "node_modules/zustand": {
+      "version": "3.7.2",
+      "resolved": "https://registry.npmmirror.com/zustand/-/zustand-3.7.2.tgz",
+      "integrity": "sha512-PIJDIZKtokhof+9+60cpockVOq05sJzHCriyvaLBmEJixseQ1a5Kdov6fWZfWOu5SK9c+FhH1jU0tntLxRJYMA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.7.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        }
+      }
    }
  }
 }
--- a/package.json
+++ b/package.json
@@ -3,10 +3,13 @@
  "version": "0.1.0",
  "private": true,
  "dependencies": {
+    "@react-three/drei": "9.88",
+    "@react-three/fiber": "8.15",
+    "framer-motion": "^10.16.4",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
-    "framer-motion": "^10.16.4",
-    "react-scripts": "5.0.1"
+    "react-scripts": "5.0.1",
+    "three": "^0.158.0"
  },
  "scripts": {
    "start": "react-scripts start",
--- a/public/.DS_Store
+++ b/public/.DS_Store
--- a/public/3dV2/.DS_Store
+++ b/public/3dV2/.DS_Store
--- a/public/3dV2/xiaolaingV2.mtl
+++ b/public/3dV2/xiaolaingV2.mtl
@@ -0,0 +1,253 @@
+# Designed by EasyEDA Pro
+newmtl mtl1
+Ka 0.25 0.25 0.25
+Kd 0.25 0.25 0.25
+Ks 0.13 0.13 0.13
+d 1.00
+endmtl
+newmtl mtl2
+Ka 0.75 0.75 0.75
+Kd 0.75 0.75 0.75
+Ks 0.38 0.38 0.38
+d 1.00
+endmtl
+newmtl mtl3
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.50 0.50 0.50
+d 1.00
+endmtl
+newmtl mtl4
+Ka 0.54 0.35 0.34
+Kd 0.54 0.35 0.34
+Ks 0.38 0.24 0.24
+d 1.00
+endmtl
+newmtl mtl5
+Ka 0.43 0.35 0.37
+Kd 0.43 0.35 0.37
+Ks 0.30 0.25 0.26
+d 1.00
+endmtl
+newmtl mtl6
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.30 0.30 0.30
+d 1.00
+endmtl
+newmtl mtl7
+Ka 0.11 0.11 0.11
+Kd 0.11 0.11 0.11
+Ks 0.08 0.08 0.08
+d 1.00
+endmtl
+newmtl mtl8
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.88 0.88 0.88
+d 1.00
+endmtl
+newmtl mtl9
+Ka 0.78 0.76 0.74
+Kd 0.78 0.76 0.74
+Ks 0.39 0.38 0.37
+d 1.00
+endmtl
+newmtl mtl10
+Ka 0.59 0.46 0.00
+Kd 0.59 0.46 0.00
+Ks 0.29 0.23 0.00
+d 1.00
+endmtl
+newmtl mtl11
+Ka 0.85 0.85 0.85
+Kd 0.85 0.85 0.85
+Ks 0.43 0.43 0.43
+d 1.00
+endmtl
+newmtl mtl12
+Ka 0.75 0.75 0.00
+Kd 0.75 0.75 0.00
+Ks 0.38 0.38 0.00
+d 1.00
+endmtl
+newmtl mtl13
+Ka 0.00 0.00 0.00
+Kd 0.00 0.00 0.00
+Ks 0.00 0.00 0.00
+d 1.00
+endmtl
+newmtl mtl14
+Ka 0.50 0.50 0.50
+Kd 0.50 0.50 0.50
+Ks 0.25 0.25 0.25
+d 1.00
+endmtl
+newmtl mtl15
+Ka 0.50 0.25 0.00
+Kd 0.50 0.25 0.00
+Ks 0.44 0.22 0.00
+d 1.00
+endmtl
+newmtl mtl16
+Ka 1.00 1.00 0.50
+Kd 1.00 1.00 0.50
+Ks 0.50 0.50 0.25
+d 1.00
+endmtl
+newmtl mtl17
+Ka 1.00 0.89 0.81
+Kd 1.00 0.89 0.81
+Ks 0.50 0.44 0.40
+d 1.00
+endmtl
+newmtl mtl18
+Ka 0.25 0.25 0.25
+Kd 0.25 0.25 0.25
+Ks 0.07 0.07 0.07
+d 1.00
+endmtl
+newmtl mtl19
+Ka 0.64 0.62 0.60
+Kd 0.45 0.43 0.42
+Ks 0.03 0.03 0.03
+d 1.00
+endmtl
+newmtl mtl20
+Ka 0.77 0.77 0.77
+Kd 0.77 0.77 0.77
+Ks 0.62 0.62 0.62
+d 1.00
+endmtl
+newmtl mtl21
+Ka 0.50 0.25 0.25
+Kd 0.50 0.25 0.25
+Ks 0.44 0.22 0.22
+d 1.00
+endmtl
+newmtl mtl22
+Ka 0.00 0.50 0.00
+Kd 0.00 0.50 0.00
+Ks 0.00 0.25 0.00
+d 1.00
+endmtl
+newmtl mtl23
+Ka 0.65 0.62 0.59
+Kd 0.65 0.62 0.59
+Ks 0.45 0.44 0.41
+d 1.00
+endmtl
+newmtl mtl24
+Ka 0.50 0.50 0.00
+Kd 0.50 0.50 0.00
+Ks 0.25 0.25 0.00
+d 1.00
+endmtl
+newmtl mtl25
+Ka 1.00 0.92 0.81
+Kd 1.00 0.92 0.81
+Ks 0.50 0.46 0.40
+d 1.00
+endmtl
+newmtl mtl26
+Ka 0.07 0.75 0.00
+Kd 0.05 0.60 0.00
+Ks 0.07 0.75 0.00
+d 1.00
+endmtl
+newmtl mtl27
+Ka 0.84 0.82 0.75
+Kd 0.84 0.82 0.75
+Ks 0.42 0.41 0.38
+d 1.00
+endmtl
+newmtl mtl28
+Ka 0.75 0.75 0.75
+Kd 0.60 0.60 0.60
+Ks 0.75 0.75 0.75
+d 1.00
+endmtl
+newmtl mtl29
+Ka 0.97 0.88 0.60
+Kd 0.97 0.88 0.60
+Ks 0.68 0.62 0.42
+d 1.00
+endmtl
+newmtl mtl30
+Ka 0.54 0.54 0.54
+Kd 1.00 1.00 1.00
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl31
+Ka 0.27 0.26 0.26
+Kd 0.52 0.51 0.51
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl32
+Ka 0.46 0.33 0.07
+Kd 0.87 0.63 0.17
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl33
+Ka 0.46 0.31 0.17
+Kd 0.86 0.60 0.34
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl34
+Ka 0.26 0.28 0.28
+Kd 0.51 0.53 0.55
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl35
+Ka 0.12 0.12 0.12
+Kd 0.25 0.25 0.25
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl36
+Ka 0.09 0.09 0.09
+Kd 0.20 0.20 0.20
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl37
+Ka 0.01 0.01 0.01
+Kd 0.03 0.03 0.05
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl38
+Ka 0.33 0.33 0.33
+Kd 0.63 0.63 0.63
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl39
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 1.00 1.00 1.00
+d 1.00
+endmtl
+newmtl mtl40
+Ka 0.00 0.33 0.65
+Kd 0.00 0.33 0.65
+Ks 0.00 0.33 0.65
+d 1.00
+endmtl
+newmtl mtl41
+Ka 0.62 0.62 0.36
+Kd 0.62 0.62 0.36
+Ks 0.62 0.62 0.36
+d 1.00
+endmtl
+newmtl mtl42
+Ka 0.00 0.15 0.36
+Kd 0.00 0.15 0.36
+Ks 0.00 0.15 0.36
+d 1.00
+endmtl
--- a/public/3dV2/xiaoliangV2.obj
+++ b/public/3dV2/xiaoliangV2.obj
--- a/public/3dmimi/3D_PCB_V3-mini.mtl
+++ b/public/3dmimi/3D_PCB_V3-mini.mtl
@@ -0,0 +1,301 @@
+# Designed by EasyEDA Pro
+newmtl mtl1
+Ka 0.22 0.22 0.22
+Kd 0.22 0.22 0.22
+Ks 0.07 0.07 0.07
+d 1.00
+endmtl
+newmtl mtl2
+Ka 0.65 0.65 0.65
+Kd 0.45 0.45 0.45
+Ks 0.03 0.03 0.03
+d 1.00
+endmtl
+newmtl mtl3
+Ka 0.85 0.85 0.85
+Kd 0.85 0.85 0.85
+Ks 0.42 0.42 0.42
+d 1.00
+endmtl
+newmtl mtl4
+Ka 0.30 0.30 0.30
+Kd 0.21 0.21 0.21
+Ks 0.02 0.02 0.02
+d 1.00
+endmtl
+newmtl mtl5
+Ka 0.67 0.67 0.67
+Kd 0.67 0.67 0.67
+Ks 0.47 0.47 0.47
+d 1.00
+endmtl
+newmtl mtl6
+Ka 0.83 0.67 0.13
+Kd 0.83 0.67 0.13
+Ks 0.83 0.67 0.13
+d 1.00
+endmtl
+newmtl mtl7
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.88 0.88 0.88
+d 1.00
+endmtl
+newmtl mtl8
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.50 0.50 0.50
+d 1.00
+endmtl
+newmtl mtl9
+Ka 0.83 0.67 0.13
+Kd 0.83 0.67 0.13
+Ks 0.67 0.54 0.10
+d 1.00
+endmtl
+newmtl mtl10
+Ka 0.22 0.22 0.22
+Kd 0.22 0.22 0.22
+Ks 0.11 0.11 0.11
+d 1.00
+endmtl
+newmtl mtl11
+Ka 0.75 0.75 0.75
+Kd 0.75 0.75 0.75
+Ks 0.38 0.38 0.38
+d 1.00
+endmtl
+newmtl mtl12
+Ka 0.65 0.62 0.59
+Kd 0.65 0.62 0.59
+Ks 0.45 0.44 0.41
+d 1.00
+endmtl
+newmtl mtl13
+Ka 0.16 0.16 0.16
+Kd 0.11 0.11 0.11
+Ks 0.01 0.01 0.01
+d 1.00
+endmtl
+newmtl mtl14
+Ka 0.97 0.97 0.97
+Kd 0.68 0.68 0.68
+Ks 0.05 0.05 0.05
+d 1.00
+endmtl
+newmtl mtl15
+Ka 0.25 0.25 0.25
+Kd 0.25 0.25 0.25
+Ks 0.13 0.13 0.13
+d 1.00
+endmtl
+newmtl mtl16
+Ka 0.50 0.50 0.50
+Kd 0.35 0.35 0.35
+Ks 0.02 0.02 0.02
+d 1.00
+endmtl
+newmtl mtl17
+Ka 0.25 0.25 0.25
+Kd 0.25 0.25 0.25
+Ks 0.07 0.07 0.07
+d 1.00
+endmtl
+newmtl mtl18
+Ka 0.64 0.62 0.60
+Kd 0.45 0.43 0.42
+Ks 0.03 0.03 0.03
+d 1.00
+endmtl
+newmtl mtl19
+Ka 0.77 0.77 0.77
+Kd 0.77 0.77 0.77
+Ks 0.62 0.62 0.62
+d 1.00
+endmtl
+newmtl mtl20
+Ka 0.50 0.50 0.50
+Kd 0.50 0.50 0.50
+Ks 0.25 0.25 0.25
+d 1.00
+endmtl
+newmtl mtl21
+Ka 0.00 0.50 0.00
+Kd 0.00 0.50 0.00
+Ks 0.00 0.25 0.00
+d 1.00
+endmtl
+newmtl mtl22
+Ka 0.00 0.00 0.00
+Kd 0.00 0.00 0.00
+Ks 0.00 0.00 0.00
+d 1.00
+endmtl
+newmtl mtl23
+Ka 1.00 1.00 0.00
+Kd 1.00 1.00 0.00
+Ks 0.50 0.50 0.00
+d 1.00
+endmtl
+newmtl mtl24
+Ka 0.50 0.25 0.00
+Kd 0.50 0.25 0.00
+Ks 0.44 0.22 0.00
+d 1.00
+endmtl
+newmtl mtl25
+Ka 0.97 0.88 0.60
+Kd 0.97 0.88 0.60
+Ks 0.68 0.62 0.42
+d 1.00
+endmtl
+newmtl mtl26
+Ka 0.11 0.11 0.11
+Kd 0.11 0.11 0.11
+Ks 0.08 0.08 0.08
+d 1.00
+endmtl
+newmtl mtl27
+Ka 0.41 0.41 0.41
+Kd 0.41 0.41 0.41
+Ks 0.20 0.20 0.20
+d 1.00
+endmtl
+newmtl mtl28
+Ka 0.79 0.82 0.93
+Kd 0.79 0.82 0.93
+Ks 0.40 0.41 0.47
+d 1.00
+endmtl
+newmtl mtl29
+Ka 0.65 0.65 0.65
+Kd 0.65 0.65 0.65
+Ks 0.32 0.32 0.32
+d 1.00
+endmtl
+newmtl mtl30
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.30 0.30 0.30
+d 1.00
+endmtl
+newmtl mtl31
+Ka 0.51 0.42 0.25
+Kd 0.95 0.80 0.49
+Ks 0.48 0.48 0.48
+d 1.00
+endmtl
+newmtl mtl32
+Ka 1.00 0.93 0.62
+Kd 1.00 0.93 0.62
+Ks 0.50 0.47 0.31
+d 1.00
+endmtl
+newmtl mtl33
+Ka 0.85 0.85 0.85
+Kd 0.85 0.85 0.85
+Ks 0.43 0.43 0.43
+d 1.00
+endmtl
+newmtl mtl34
+Ka 0.59 0.46 0.00
+Kd 0.59 0.46 0.00
+Ks 0.29 0.23 0.00
+d 1.00
+endmtl
+newmtl mtl35
+Ka 0.11 0.11 0.11
+Kd 0.11 0.11 0.11
+Ks 0.06 0.06 0.06
+d 1.00
+endmtl
+newmtl mtl36
+Ka 0.82 0.82 0.82
+Kd 0.82 0.82 0.82
+Ks 0.41 0.41 0.41
+d 1.00
+endmtl
+newmtl mtl37
+Ka 1.00 1.00 1.00
+Kd 0.88 0.88 0.88
+Ks 0.75 0.75 0.75
+d 1.00
+endmtl
+newmtl mtl38
+Ka 1.00 1.00 1.00
+Kd 0.25 0.25 0.25
+Ks 0.75 0.75 0.75
+d 1.00
+endmtl
+newmtl mtl39
+Ka 1.00 1.00 1.00
+Kd 0.76 0.76 0.76
+Ks 0.75 0.75 0.75
+d 1.00
+endmtl
+newmtl mtl40
+Ka 1.00 0.50 0.00
+Kd 1.00 0.50 0.00
+Ks 0.88 0.44 0.00
+d 1.00
+endmtl
+newmtl mtl41
+Ka 0.00 1.00 0.00
+Kd 0.00 1.00 0.00
+Ks 0.00 0.50 0.00
+d 1.00
+endmtl
+newmtl mtl42
+Ka 0.67 0.70 0.77
+Kd 0.67 0.70 0.77
+Ks 0.33 0.35 0.38
+d 1.00
+endmtl
+newmtl mtl43
+Ka 0.30 0.30 0.30
+Kd 0.30 0.30 0.30
+Ks 0.09 0.09 0.09
+d 1.00
+endmtl
+newmtl mtl44
+Ka 0.84 0.82 0.75
+Kd 0.84 0.82 0.75
+Ks 0.42 0.41 0.38
+d 1.00
+endmtl
+newmtl mtl45
+Ka 0.10 0.10 0.10
+Kd 0.10 0.10 0.10
+Ks 0.04 0.04 0.04
+d 1.00
+endmtl
+newmtl mtl46
+Ka 0.86 0.86 0.86
+Kd 0.51 0.51 0.51
+Ks 0.35 0.35 0.35
+d 1.00
+endmtl
+newmtl mtl47
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 1.00 1.00 1.00
+d 1.00
+endmtl
+newmtl mtl48
+Ka 0.00 0.33 0.65
+Kd 0.00 0.33 0.65
+Ks 0.00 0.33 0.65
+d 1.00
+endmtl
+newmtl mtl49
+Ka 0.62 0.62 0.36
+Kd 0.62 0.62 0.36
+Ks 0.62 0.62 0.36
+d 1.00
+endmtl
+newmtl mtl50
+Ka 0.00 0.15 0.36
+Kd 0.00 0.15 0.36
+Ks 0.00 0.15 0.36
+d 1.00
+endmtl
--- a/public/3dmimi/3D_PCB_V3-mini.obj
+++ b/public/3dmimi/3D_PCB_V3-mini.obj
--- a/public/3dmodo/.DS_Store
+++ b/public/3dmodo/.DS_Store
--- a/public/3dmodo/xiaoliang1.mtl
+++ b/public/3dmodo/xiaoliang1.mtl
@@ -0,0 +1,265 @@
+# Designed by EasyEDA Pro
+newmtl mtl1
+Ka 0.59 0.46 0.00
+Kd 0.59 0.46 0.00
+Ks 0.29 0.23 0.00
+d 1.00
+endmtl
+newmtl mtl2
+Ka 0.85 0.85 0.85
+Kd 0.85 0.85 0.85
+Ks 0.43 0.43 0.43
+d 1.00
+endmtl
+newmtl mtl3
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.88 0.88 0.88
+d 1.00
+endmtl
+newmtl mtl4
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 0.50 0.50 0.50
+d 1.00
+endmtl
+newmtl mtl5
+Ka 1.00 0.89 0.81
+Kd 1.00 0.89 0.81
+Ks 0.50 0.44 0.40
+d 1.00
+endmtl
+newmtl mtl6
+Ka 0.00 0.00 0.00
+Kd 0.00 0.00 0.00
+Ks 0.00 0.00 0.00
+d 1.00
+endmtl
+newmtl mtl7
+Ka 0.22 0.22 0.22
+Kd 0.22 0.22 0.22
+Ks 0.11 0.11 0.11
+d 1.00
+endmtl
+newmtl mtl8
+Ka 0.85 0.85 0.85
+Kd 0.85 0.85 0.85
+Ks 0.42 0.42 0.42
+d 1.00
+endmtl
+newmtl mtl9
+Ka 0.75 0.75 0.75
+Kd 0.75 0.75 0.75
+Ks 0.38 0.38 0.38
+d 1.00
+endmtl
+newmtl mtl10
+Ka 0.25 0.25 0.25
+Kd 0.25 0.25 0.25
+Ks 0.13 0.13 0.13
+d 1.00
+endmtl
+newmtl mtl11
+Ka 0.50 0.50 0.50
+Kd 0.35 0.35 0.35
+Ks 0.02 0.02 0.02
+d 1.00
+endmtl
+newmtl mtl12
+Ka 0.30 0.30 0.30
+Kd 0.21 0.21 0.21
+Ks 0.02 0.02 0.02
+d 1.00
+endmtl
+newmtl mtl13
+Ka 0.67 0.67 0.67
+Kd 0.67 0.67 0.67
+Ks 0.47 0.47 0.47
+d 1.00
+endmtl
+newmtl mtl14
+Ka 0.65 0.65 0.65
+Kd 0.65 0.65 0.65
+Ks 0.32 0.32 0.32
+d 1.00
+endmtl
+newmtl mtl15
+Ka 0.85 0.85 0.85
+Kd 0.85 0.85 0.85
+Ks 0.68 0.68 0.68
+d 1.00
+endmtl
+newmtl mtl16
+Ka 0.84 0.82 0.75
+Kd 0.84 0.82 0.75
+Ks 0.25 0.24 0.23
+d 1.00
+endmtl
+newmtl mtl17
+Ka 0.25 0.25 0.25
+Kd 0.18 0.18 0.18
+Ks 0.01 0.01 0.01
+d 1.00
+endmtl
+newmtl mtl18
+Ka 0.77 0.77 0.77
+Kd 0.77 0.77 0.77
+Ks 0.62 0.62 0.62
+d 1.00
+endmtl
+newmtl mtl19
+Ka 1.00 1.00 1.00
+Kd 0.80 0.80 0.80
+Ks 1.00 1.00 1.00
+d 1.00
+endmtl
+newmtl mtl20
+Ka 0.25 0.25 0.25
+Kd 0.20 0.20 0.20
+Ks 0.25 0.25 0.25
+d 1.00
+endmtl
+newmtl mtl21
+Ka 0.75 0.75 0.75
+Kd 0.60 0.60 0.60
+Ks 0.75 0.75 0.75
+d 1.00
+endmtl
+newmtl mtl22
+Ka 0.50 0.50 0.50
+Kd 0.40 0.40 0.40
+Ks 0.50 0.50 0.50
+d 1.00
+endmtl
+newmtl mtl23
+Ka 0.25 0.25 0.25
+Kd 0.25 0.25 0.25
+Ks 0.07 0.07 0.07
+d 1.00
+endmtl
+newmtl mtl24
+Ka 0.64 0.62 0.60
+Kd 0.45 0.43 0.42
+Ks 0.03 0.03 0.03
+d 1.00
+endmtl
+newmtl mtl25
+Ka 0.54 0.35 0.34
+Kd 0.54 0.35 0.34
+Ks 0.38 0.24 0.24
+d 1.00
+endmtl
+newmtl mtl26
+Ka 0.89 0.89 0.89
+Kd 0.63 0.63 0.63
+Ks 0.04 0.04 0.04
+d 1.00
+endmtl
+newmtl mtl27
+Ka 0.83 0.67 0.13
+Kd 0.83 0.67 0.13
+Ks 0.83 0.67 0.13
+d 1.00
+endmtl
+newmtl mtl28
+Ka 1.00 1.00 0.00
+Kd 1.00 1.00 0.00
+Ks 0.50 0.50 0.00
+d 1.00
+endmtl
+newmtl mtl29
+Ka 1.00 0.65 0.00
+Kd 1.00 0.65 0.00
+Ks 0.50 0.33 0.00
+d 1.00
+endmtl
+newmtl mtl30
+Ka 0.50 0.50 0.50
+Kd 0.50 0.50 0.50
+Ks 0.25 0.25 0.25
+d 1.00
+endmtl
+newmtl mtl31
+Ka 0.79 0.82 0.93
+Kd 0.79 0.82 0.93
+Ks 0.40 0.41 0.47
+d 1.00
+endmtl
+newmtl mtl32
+Ka 0.41 0.41 0.41
+Kd 0.41 0.41 0.41
+Ks 0.20 0.20 0.20
+d 1.00
+endmtl
+newmtl mtl33
+Ka 0.00 0.50 0.00
+Kd 0.00 0.50 0.00
+Ks 0.00 0.25 0.00
+d 1.00
+endmtl
+newmtl mtl34
+Ka 0.65 0.62 0.59
+Kd 0.65 0.62 0.59
+Ks 0.45 0.44 0.41
+d 1.00
+endmtl
+newmtl mtl35
+Ka 1.00 1.00 0.50
+Kd 1.00 1.00 0.50
+Ks 0.50 0.50 0.25
+d 1.00
+endmtl
+newmtl mtl36
+Ka 0.50 0.50 0.00
+Kd 0.50 0.50 0.00
+Ks 0.25 0.25 0.00
+d 1.00
+endmtl
+newmtl mtl37
+Ka 1.00 0.94 0.85
+Kd 1.00 0.94 0.85
+Ks 0.30 0.28 0.25
+d 1.00
+endmtl
+newmtl mtl38
+Ka 0.44 0.44 0.44
+Kd 0.44 0.44 0.44
+Ks 0.22 0.22 0.22
+d 1.00
+endmtl
+newmtl mtl39
+Ka 0.83 0.83 0.82
+Kd 0.83 0.83 0.82
+Ks 0.67 0.67 0.65
+d 1.00
+endmtl
+newmtl mtl40
+Ka 0.50 0.25 0.00
+Kd 0.50 0.25 0.00
+Ks 0.44 0.22 0.00
+d 1.00
+endmtl
+newmtl mtl41
+Ka 1.00 1.00 1.00
+Kd 1.00 1.00 1.00
+Ks 1.00 1.00 1.00
+d 1.00
+endmtl
+newmtl mtl42
+Ka 0.00 0.33 0.65
+Kd 0.00 0.33 0.65
+Ks 0.00 0.33 0.65
+d 1.00
+endmtl
+newmtl mtl43
+Ka 0.62 0.62 0.36
+Kd 0.62 0.62 0.36
+Ks 0.62 0.62 0.36
+d 1.00
+endmtl
+newmtl mtl44
+Ka 0.00 0.15 0.36
+Kd 0.00 0.15 0.36
+Ks 0.00 0.15 0.36
+d 1.00
+endmtl
--- a/public/3dmodo/xiaoliang1.obj
+++ b/public/3dmodo/xiaoliang1.obj
--- a/public/AItime.svg
+++ b/public/AItime.svg
--- a/public/change.mp4
+++ b/public/change.mp4
--- a/public/stay.mp4
+++ b/public/stay.mp4
--- a/public/team_image/agan.png
+++ b/public/team_image/agan.png
--- a/public/team_image/laoxv.png
+++ b/public/team_image/laoxv.png
--- a/public/team_image/liwei.png
+++ b/public/team_image/liwei.png
--- a/public/team_image/shiwang.png
+++ b/public/team_image/shiwang.png
--- a/public/team_image/shuangji.png
+++ b/public/team_image/shuangji.png
--- a/public/team_image/shuangji2.png
+++ b/public/team_image/shuangji2.png
--- a/src/App.css
+++ b/src/App.css
--- a/src/App.js
+++ b/src/App.js
@@ -22,7 +22,7 @@ const App = () => {

  const sections = [
    { id: 'hero', component: HeroSection, title: '发现新视界', subtitle: 'Discover New Horizons' },
-    { id: 'product', component: ProductSection, title: 'AI产品', subtitle: 'Innovative Solutions' },
+    { id: 'product', component: ProductSection, title: 'AI产品', subtitle: 'AI hardware, AI solution' },
    { id: 'team', component: TeamSection, title: '专业团队', subtitle: 'Expert Team' },
    { id: 'cases', component: CaseSection, title: '成功案例', subtitle: 'Success Stories' },
    { id: 'contact', component: ContactSection, title: '联系我们', subtitle: 'Get In Touch' }
@@ -36,6 +36,8 @@ const App = () => {

  useEffect(() => {
    let timeout;
+    let touchStartY = 0;
+    let touchEndY = 0;
    
    const handleWheel = (e) => {
      e.preventDefault();
@@ -74,14 +76,66 @@ const App = () => {
      }, 1200); // 增加到1.2秒，与动画时间匹配
    };

+    // 触摸事件处理
+    const handleTouchStart = (e) => {
+      touchStartY = e.touches[0].clientY;
+    };
+
+    const handleTouchMove = (e) => {
+      e.preventDefault();
+    };
+
+    const handleTouchEnd = (e) => {
+      if (isScrollingRef.current) {
+        return;
+      }
+
+      touchEndY = e.changedTouches[0].clientY;
+      const deltaY = touchStartY - touchEndY;
+      const minSwipeDistance = 50; // 最小滑动距离
+
+      if (Math.abs(deltaY) > minSwipeDistance) {
+        isScrollingRef.current = true;
+        setIsScrolling(true);
+
+        let newSection = currentSectionRef.current;
+        if (deltaY > 0 && currentSectionRef.current < sections.length - 1) {
+          // 向上滑动，下一页
+          newSection = currentSectionRef.current + 1;
+        } else if (deltaY < 0 && currentSectionRef.current > 0) {
+          // 向下滑动，上一页
+          newSection = currentSectionRef.current - 1;
+        }
+
+        if (newSection !== currentSectionRef.current) {
+          setCurrentSection(newSection);
+        }
+
+        if (timeout) {
+          clearTimeout(timeout);
+        }
+
+        timeout = setTimeout(() => {
+          isScrollingRef.current = false;
+          setIsScrolling(false);
+        }, 1200);
+      }
+    };
+
    const container = containerRef.current;
    if (container) {
      container.addEventListener('wheel', handleWheel, { passive: false });
+      container.addEventListener('touchstart', handleTouchStart, { passive: true });
+      container.addEventListener('touchmove', handleTouchMove, { passive: false });
+      container.addEventListener('touchend', handleTouchEnd, { passive: true });
    }

    return () => {
      if (container) {
        container.removeEventListener('wheel', handleWheel);
+        container.removeEventListener('touchstart', handleTouchStart);
+        container.removeEventListener('touchmove', handleTouchMove);
+        container.removeEventListener('touchend', handleTouchEnd);
      }
      if (timeout) {
        clearTimeout(timeout);
--- a/src/asset/font/ZiHunXingHei(ShangYongXuShouQuan)-2.ttf
+++ b/src/asset/font/ZiHunXingHei(ShangYongXuShouQuan)-2.ttf
--- a/src/asset/font/方正字迹-佩安硬笔简体.TTF
+++ b/src/asset/font/方正字迹-佩安硬笔简体.TTF
--- a/src/asset/font/田英章毛笔楷书.TTF
+++ b/src/asset/font/田英章毛笔楷书.TTF
--- a/src/asset/font/腾祥魅黑简.TTF
+++ b/src/asset/font/腾祥魅黑简.TTF
--- a/src/asset/font/造字工房力黑.OTF
+++ b/src/asset/font/造字工房力黑.OTF
--- a/src/asset/logo-bai.png
+++ b/src/asset/logo-bai.png
--- a/src/asset/logo-bai1.png
+++ b/src/asset/logo-bai1.png
--- a/src/asset/stay.mp4
+++ b/src/asset/stay.mp4
--- a/src/components/HeroSection.js
+++ b/src/components/HeroSection.js
@@ -17,7 +17,7 @@ const HeroSection = ({ isActive }) => {
          animate={isActive ? { opacity: 1, y: 0 } : {}}
          transition={{ duration: 0.8, delay: 0.6 }}
        >
-          推动变革
+          推动线下AI变革
        </motion.h1>
        
        <motion.h2 
@@ -26,9 +26,9 @@ const HeroSection = ({ isActive }) => {
          animate={isActive ? { opacity: 1, y: 0 } : {}}
          transition={{ duration: 0.8, delay: 0.8 }}
        >
-          <span className="highlight-text">通过</span> 创新的
+          <span className="highlight-text">通过</span> 线下硬件
          <br />
-          人工智能技术
+          普及人工智能技术
        </motion.h2>
        
        <motion.div
@@ -39,13 +39,30 @@ const HeroSection = ({ isActive }) => {
        >
          <div className="quote-line"></div>
          <p>
-            通过利用战略洞察和行业网络，
+            通过软硬件一体的整体解决方案，
            <br />
-            Radiant 作为增长催化剂，为我们的
+            量迹AI用普惠的解决方案，
            <br />
-            投资组合公司和投资者创造卓越价值。
+            让人类进入AI时代
          </p>
        </motion.div>
+        
+        <motion.button
+          className="learn-more-btn"
+          initial={{ opacity: 0, y: 30 }}
+          animate={isActive ? { opacity: 1, y: 0 } : {}}
+          transition={{ duration: 0.8, delay: 1.6 }}
+          whileHover={{ 
+            scale: 1.05,
+            y: -3,
+            boxShadow: "0 10px 30px rgba(0, 245, 212, 0.3)"
+          }}
+          whileTap={{ scale: 0.95 }}
+        >
+          <span className="btn-text">了解更多</span>
+          <div className="btn-glow"></div>
+          <div className="btn-arrow">→</div>
+        </motion.button>
      </motion.div>

      {/* 右侧几何形状 */}
@@ -55,45 +72,91 @@ const HeroSection = ({ isActive }) => {
        animate={isActive ? { opacity: 1, scale: 1 } : {}}
        transition={{ duration: 1.5, delay: 0.5 }}
      >
+        {/* 背景视频 */}
+        <video
+          className="hero-background-video"
+          autoPlay
+          muted
+          loop
+          playsInline
+          controls={false}
+          preload="auto"
+          src="/stay.mp4"
+          onError={(e) => console.error('Video error:', e)}
+          onLoadStart={() => console.log('Video loading started')}
+          onCanPlay={() => console.log('Video can play')}
+        />
+        
        <div className="geometric-container">
+          {/* 小立方体 */}
          <motion.div 
-            className="cube-main"
+            className="cube-small"
            initial={{ rotateY: 0, rotateX: 0 }}
            animate={isActive ? { 
-              rotateY: [0, 15, 0], 
-              rotateX: [0, -10, 0] 
+              rotateY: 360,
+              rotateX: [0, 30, 0]
            } : {}}
            transition={{ 
-              duration: 8, 
+              duration: 15, 
              repeat: Infinity,
-              ease: "easeInOut"
+              ease: "linear"
            }}
          >
            <div className="cube-face front"></div>
-            <div className="cube-face back"></div>
+            {/* <div className="cube-face back"></div> */}
            <div className="cube-face right"></div>
            <div className="cube-face left"></div>
            <div className="cube-face top"></div>
            <div className="cube-face bottom"></div>
          </motion.div>
          
-          <motion.div 
-            className="cube-small"
-            initial={{ rotateY: 0 }}
-            animate={isActive ? { rotateY: 360 } : {}}
-            transition={{ 
-              duration: 12, 
+          {/* 浮动圆环 */}
+          <motion.div
+            className="floating-ring"
+            initial={{ rotateZ: 0, y: 0 }}
+            animate={isActive ? {
+              rotateZ: 360,
+              y: [0, -20, 0]
+            } : {}}
+            transition={{
+              duration: 20,
              repeat: Infinity,
              ease: "linear"
            }}
-          >
-            <div className="cube-face front"></div>
-            <div className="cube-face back"></div>
-            <div className="cube-face right"></div>
-            <div className="cube-face left"></div>
-            <div className="cube-face top"></div>
-            <div className="cube-face bottom"></div>
-          </motion.div>
+          />
+          
+          {/* 浮动粒子 */}
+          <motion.div
+            className="floating-particle particle-1"
+            initial={{ x: 0, y: 0, opacity: 0 }}
+            animate={isActive ? {
+              x: [0, 40, -20, 0],
+              y: [0, -30, 20, 0],
+              opacity: [0, 0.6, 0.3, 0]
+            } : {}}
+            transition={{
+              duration: 8,
+              repeat: Infinity,
+              ease: "easeInOut",
+              delay: 1
+            }}
+          />
+          
+          <motion.div
+            className="floating-particle particle-2"
+            initial={{ x: 0, y: 0, opacity: 0 }}
+            animate={isActive ? {
+              x: [0, -60, 30, 0],
+              y: [0, 40, -25, 0],
+              opacity: [0, 0.4, 0.6, 0]
+            } : {}}
+            transition={{
+              duration: 12,
+              repeat: Infinity,
+              ease: "easeInOut",
+              delay: 3
+            }}
+          />
        </div>
      </motion.div>

--- a/src/components/Navigation.js
+++ b/src/components/Navigation.js
@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
+import logoBai from '../asset/logo-bai.png';

 const Navigation = ({ currentSection, sections, onSectionChange }) => {
  const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
@@ -47,12 +48,16 @@ const Navigation = ({ currentSection, sections, onSectionChange }) => {
            }}
            transition={{ duration: 0.5 }}
          >
-            Q
+            <img 
+              src={logoBai} 
+              alt="Quant Speed Logo" 
+              className="logo-image"
+            />
          </motion.div>
          <motion.span 
            className="logo-text"
          >
-            Quant Speed
+            Quant Speed 量迹AI科技
          </motion.span>
        </motion.div>
        
--- a/src/components/ProductSection.js
+++ b/src/components/ProductSection.js
@@ -1,7 +1,202 @@
-import React from 'react';
+import React, { Suspense, useEffect, useMemo, useRef, useState } from 'react';
 import { motion } from 'framer-motion';
+import { Canvas, useFrame, useLoader } from '@react-three/fiber';
+import { OrbitControls, Bounds, ContactShadows, Html } from '@react-three/drei';
+import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader';
+import { MTLLoader } from 'three/examples/jsm/loaders/MTLLoader';
+import * as THREE from 'three';
+
+const BoardScene = ({ onProject, onToggleConnections, objPath, mtlPath, modelName, isMobile }) => {
+  const groupRef = useRef();
+
+  const materials = useLoader(MTLLoader, mtlPath);
+  materials.preload();
+  const obj = useLoader(OBJLoader, objPath, (loader) => {
+    loader.setMaterials(materials);
+  });
+
+  const { size } = useMemo(() => {
+    const box = new THREE.Box3().setFromObject(obj);
+    const size = new THREE.Vector3();
+    const center = new THREE.Vector3();
+    box.getSize(size);
+    box.getCenter(center);
+    // 将模型平移到原点，旋转更自然
+    obj.position.sub(center);
+    return { size };
+  }, [obj]);
+
+  useFrame((_state, delta) => {
+    if (groupRef.current) {
+      groupRef.current.rotation.y += delta * 0.2; // 轻微自转
+    }
+  });
+
+  const annotations = useMemo(() => {
+    const hx = size.x * 0.5;
+    const hz = size.z * 0.5;
+    const radius = Math.max(hx, hz) * 1.9 + 0.4; // 外扩半径，避免重叠
+
+    const fromEsp32 = new THREE.Vector3(0, 0.05 * size.y, 0);
+    const toEsp32 = fromEsp32.clone().add(new THREE.Vector3(-radius, 0.22 * size.y, radius)); // 左前
+
+    const fromAntenna = new THREE.Vector3(hx * 0.6, 0.1 * size.y, -hz * 0.4);
+    const toAntenna = fromAntenna.clone().add(new THREE.Vector3(radius, 0.18 * size.y, -radius)); // 右后
+
+    const fromPower = new THREE.Vector3(-hx * 0.55, -0.05 * size.y, 0.15 * hz);
+    const toPower = fromPower.clone().add(new THREE.Vector3(-radius, 0.16 * size.y, -radius)); // 左后
+
+    const fromGpio = new THREE.Vector3(0.0, -0.1 * size.y, hz * 0.6);
+    const toGpio = fromGpio.clone().add(new THREE.Vector3(radius, -0.02 * size.y, radius)); // 右前
+
+    return [
+      {
+        from: fromEsp32,
+        to: toEsp32,
+        title: '小量 V3 · ESP32 主控',
+        lines: ['双核 Xtensa 240MHz', 'Wi‑Fi 802.11 b/g/n', 'Bluetooth LE 5.0']
+      },
+      {
+        from: fromAntenna,
+        to: toAntenna,
+        title: '2.4GHz 天线区',
+        lines: ['射频匹配网络', '无线性能优化']
+      },
+      {
+        from: fromPower,
+        to: toPower,
+        title: '电源稳压',
+        lines: ['LDO/BUCK 稳压', '3.3V 供电，纹波低']
+      },
+      {
+        from: fromGpio,
+        to: toGpio,
+        title: 'GPIO 接口',
+        lines: ['多路 ADC/DAC', 'I2C/SPI/UART']
+      }
+    ];
+  }, [size]);
+
+  // 将 3D 锚点实时投影为屏幕坐标，交给外部 2D Overlay
+  useFrame((state) => {
+    if (!onProject || !groupRef.current) return;
+    const { camera, size: viewportSize } = state;
+    const results = annotations.map((a) => {
+      const world = a.from.clone().applyMatrix4(groupRef.current.matrixWorld);
+      const ndc = world.clone().project(camera);
+      const x = (ndc.x * 0.5 + 0.5) * viewportSize.width;
+      const y = (-ndc.y * 0.5 + 0.5) * viewportSize.height;
+      return { x, y, title: a.title, lines: a.lines };
+    });
+    onProject(results);
+  });
+
+  const titlePosition = useMemo(() => {
+    if (!size) return [0, 0, 0];
+    return isMobile
+      ? [-size.x * 0.9, size.y * 0.2, 0]
+      : [0, size.y * 0.7, 0];
+  }, [size, isMobile]);
+
+  return (
+    <group ref={groupRef}>
+      <primitive object={obj} />
+      {/* 模型标题（点击名称显示详情） */}
+      <Html position={titlePosition} center style={{ pointerEvents: 'auto' }}>
+        <div
+          onClick={onToggleConnections}
+          title="点击名称显示详情"
+          style={{
+            background: 'rgba(0,0,0,0.4)',
+            border: '1px solid rgba(0,245,212,0.35)',
+            borderRadius: 12,
+            padding: '6px 10px',
+            color: 'white',
+            fontSize: 14,
+            whiteSpace: 'nowrap',
+            backdropFilter: 'blur(8px)',
+            cursor: 'pointer'
+          }}
+        >
+          <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
+            <span style={{ fontWeight: 700 }}>{modelName}</span>
+            <span style={{
+              background: '#00f5d4',
+              color: '#0a0f1c',
+              borderRadius: 10,
+              padding: '2px 6px',
+              fontSize: 12,
+              fontWeight: 600
+            }}>详情</span>
+          </div>
+          <div style={{ opacity: 0.9, fontSize: 12, marginTop: 2 }}>点击名称显示详情</div>
+        </div>
+      </Html>
+      <ContactShadows opacity={0.5} scale={10} blur={2.5} far={4} resolution={1024} color="#1a2336" />
+    </group>
+  );
+};

 const ProductSection = ({ isActive }) => {
+  const visualRef = useRef();
+  const [canvasSize, setCanvasSize] = useState({ width: 800, height: 800 });
+  const [screenAnchors, setScreenAnchors] = useState([]);
+  const [showConnections, setShowConnections] = useState(false);
+  const [modelKey, setModelKey] = useState('v3'); // v3 | mini | v2
+  const [isMobile, setIsMobile] = useState(false);
+
+  const modelConfigs = {
+    v3: {
+      obj: '/3dmodo/xiaoliang1.obj',
+      mtl: '/3dmodo/xiaoliang1.mtl',
+      name: '小量 V3'
+    },
+    mini: {
+      obj: '/3dmimi/3D_PCB_V3-mini.obj',
+      mtl: '/3dmimi/3D_PCB_V3-mini.mtl',
+      name: '小量 mini'
+    },
+    v2: {
+      obj: '/3dV2/xiaoliangV2.obj',
+      mtl: '/3dV2/xiaolaingV2.mtl',
+      name: '小量 V2'
+    }
+  };
+
+  useEffect(() => {
+    const node = visualRef.current;
+    if (!node) return;
+    const resizeDirect = () => {
+      if (!node) return;
+      setCanvasSize({ width: node.clientWidth, height: node.clientHeight });
+    };
+    resizeDirect();
+    const ro = new ResizeObserver((entries) => {
+      const entry = entries && entries[0];
+      if (entry) {
+        const cr = entry.contentRect;
+        setCanvasSize({ width: Math.round(cr.width), height: Math.round(cr.height) });
+      } else {
+        resizeDirect();
+      }
+    });
+    ro.observe(node);
+    window.addEventListener('resize', resizeDirect);
+    return () => {
+      window.removeEventListener('resize', resizeDirect);
+      ro.disconnect();
+    };
+  }, []);
+
+  useEffect(() => {
+    const check = () => setIsMobile(window.innerWidth <= 768);
+    check();
+    window.addEventListener('resize', check);
+    return () => window.removeEventListener('resize', check);
+  }, []);
+
+  const panelWidth = isMobile ? 0 : 260; // 移动端不占右侧面板
+
  return (
    <div className="product-section-minimal">
      <motion.div 
@@ -10,18 +205,18 @@ const ProductSection = ({ isActive }) => {
        animate={isActive ? { opacity: 1, y: 0 } : {}}
        transition={{ duration: 1.2, delay: 0.3 }}
      >
-        <motion.h1 
+        <motion.div 
          className="product-main-title"
          initial={{ opacity: 0, y: 40 }}
          animate={isActive ? { opacity: 1, y: 0 } : {}}
          transition={{ duration: 0.8, delay: 0.6 }}
        >
-          我们的战略
-          <br />
-          <span className="highlight-text">针对</span>
-          <br />
-          远见项目
-        </motion.h1>
+          <img 
+            src="/AItime.svg" 
+            alt="AI时代标题"
+            className="title-svg"
+          />
+        </motion.div>
        
        <motion.div
          className="product-quote"
@@ -31,13 +226,30 @@ const ProductSection = ({ isActive }) => {
        >
          <div className="quote-line"></div>
          <p>
-            Radiant的战略投资框架旨在
+            量迹科技的战略在于
            <br />
-            赋能创业者。我们专注于与创始人
+            将低价AI硬件嵌入更多线下场景。
            <br />
-            建立持久关系，推动有意义的变革。
+            让人工智能技术普惠更多人。
          </p>
        </motion.div>
+        
+        <motion.button
+          className="learn-more-btn"
+          initial={{ opacity: 0, y: 30 }}
+          animate={isActive ? { opacity: 1, y: 0 } : {}}
+          transition={{ duration: 0.8, delay: 1.4 }}
+          whileHover={{ 
+            scale: 1.05,
+            y: -3,
+            boxShadow: "0 10px 30px rgba(0, 245, 212, 0.3)"
+          }}
+          whileTap={{ scale: 0.95 }}
+        >
+          <span className="btn-text">了解更多</span>
+          <div className="btn-glow"></div>
+          <div className="btn-arrow">→</div>
+        </motion.button>
      </motion.div>

      <motion.div 
@@ -46,32 +258,156 @@ const ProductSection = ({ isActive }) => {
        animate={isActive ? { opacity: 1, scale: 1 } : {}}
        transition={{ duration: 1.5, delay: 0.5 }}
      >
-        <div className="visual-container">
-          <motion.div 
-            className="visual-element-1"
-            animate={isActive ? { 
-              rotateY: [0, 360],
-              scale: [1, 1.1, 1]
-            } : {}}
-            transition={{ 
-              duration: 20, 
-              repeat: Infinity,
-              ease: "linear"
+        <div className="visual-container" ref={visualRef} style={{ position: 'relative' }}>
+          <Canvas
+            dpr={[1, 2]}
+            camera={{ position: [2.8, 1.8, 3.6], fov: 45 }}
+            shadows
+          >
+            <Suspense fallback={null}>
+              <ambientLight intensity={0.6} />
+              <directionalLight position={[5, 7, 5]} intensity={1.0} castShadow shadow-mapSize-width={2048} shadow-mapSize-height={2048} />
+               <Bounds fit clip observe>
+                 <BoardScene
+                   onProject={setScreenAnchors}
+                   onToggleConnections={() => setShowConnections((v) => !v)}
+                   objPath={modelConfigs[modelKey].obj}
+                   mtlPath={modelConfigs[modelKey].mtl}
+                  modelName={modelConfigs[modelKey].name}
+                  isMobile={isMobile}
+                 />
+              </Bounds>
+            </Suspense>
+            <OrbitControls makeDefault enableDamping enablePan={false} maxPolarAngle={Math.PI * 0.8} minPolarAngle={Math.PI * 0.2} />
+          </Canvas>
+          {/* 2D Overlay（桌面端：右侧标签+连线；移动端：不在容器内渲染） */}
+          {showConnections && !isMobile && (
+            <>
+              <svg
+                width={canvasSize.width + panelWidth}
+                height={canvasSize.height}
+                style={{ position: 'absolute', left: 0, top: 0, overflow: 'visible', pointerEvents: 'none', zIndex: 1 }}
+              >
+                {screenAnchors.map((a, idx) => {
+                  const count = Math.max(1, screenAnchors.length);
+                  const padTop = Math.round(canvasSize.height * 0.15);
+                  const padBottom = Math.round(canvasSize.height * 0.15);
+                  const avail = Math.max(0, canvasSize.height - padTop - padBottom);
+                  const step = count > 1 ? avail / (count - 1) : 0;
+                  const labelY = Math.round(padTop + idx * step);
+                  const startX = Math.min(Math.max(a.x, 0), canvasSize.width);
+                  const startY = Math.min(Math.max(a.y, 0), canvasSize.height);
+                  const endX = canvasSize.width + 16;
+                  const endY = labelY + 16;
+                  const ctrlX = (startX + endX) / 2 + 40;
+                  const ctrlY = (startY + endY) / 2 - 20;
+                  const d = `M ${startX},${startY} Q ${ctrlX},${ctrlY} ${endX},${endY}`;
+                  return (
+                    <path key={`p-${idx}`} d={d} stroke="#00f5d4" strokeWidth="1.5" fill="none" />
+                  );
+                })}
+              </svg>
+              {screenAnchors.map((a, idx) => {
+                const count = Math.max(1, screenAnchors.length);
+                const padTop = Math.round(canvasSize.height * 0.15);
+                const padBottom = Math.round(canvasSize.height * 0.15);
+                const avail = Math.max(0, canvasSize.height - padTop - padBottom);
+                const step = count > 1 ? avail / (count - 1) : 0;
+                const labelY = Math.round(padTop + idx * step);
+                const left = canvasSize.width + 24;
+                return (
+                  <div
+                    key={`l-${idx}`}
+                    style={{
+                      position: 'absolute',
+                      left,
+                      top: labelY,
+                      width: panelWidth - 40,
+                      background: 'rgba(10,15,28,0.85)',
+                      border: '1px solid rgba(0,245,212,0.35)',
+                      borderRadius: 12,
+                      padding: '10px 12px',
+                      color: 'white',
+                      fontSize: 13,
+                      boxShadow: '0 8px 25px rgba(0, 245, 212, 0.15)',
+                      pointerEvents: 'auto',
+                      zIndex: 2
+                    }}
+                  >
+                    <div style={{ fontWeight: 700, color: '#00f5d4', marginBottom: 4 }}>{a.title}</div>
+                    {a.lines?.map((t, i2) => (
+                      <div key={i2} style={{ opacity: 0.9 }}>{t}</div>
+                    ))}
+                  </div>
+                );
+              })}
+            </>
+          )}
+          {/* 模型切换滑动按钮 */}
+          <div
+            style={{
+              position: 'absolute',
+              left: '50%',
+              bottom: 16,
+              transform: 'translateX(-50%)',
+              display: 'flex',
+              gap: 8,
+              background: 'rgba(10,15,28,0.6)',
+              border: '1px solid rgba(255,255,255,0.15)',
+              borderRadius: 20,
+              padding: '6px 8px',
+              backdropFilter: 'blur(8px)',
+              zIndex: 10,
+              pointerEvents: 'auto'
            }}
-          />
-          <motion.div 
-            className="visual-element-2"
-            animate={isActive ? { 
-              rotateX: [0, 360],
-              y: [0, -20, 0]
-            } : {}}
-            transition={{ 
-              duration: 15, 
-              repeat: Infinity,
-              ease: "easeInOut"
-            }}
-          />
+          >
+            {[
+              { key: 'v3', label: 'V3' },
+              { key: 'mini', label: 'mini' },
+              { key: 'v2', label: 'V2' }
+            ].map((btn) => (
+              <button
+                key={btn.key}
+                onClick={() => setModelKey(btn.key)}
+                style={{
+                  border: 'none',
+                  outline: 'none',
+                  padding: '6px 10px',
+                  borderRadius: 14,
+                  cursor: 'pointer',
+                  color: btn.key === modelKey ? '#0a0f1c' : '#ffffff',
+                  background: btn.key === modelKey ? '#00f5d4' : 'transparent'
+                }}
+              >
+                {btn.label}
+              </button>
+            ))}
+          </div>
        </div>
+        {/* 移动端：画布下方展示标签列表（不画连线） */}
+        {showConnections && isMobile && (
+          <div style={{ width: '100%', marginTop: 12, display: 'flex', flexDirection: 'column', gap: 8 }}>
+            {screenAnchors.map((a, idx) => (
+              <div
+                key={`ml-${idx}`}
+                style={{
+                  background: 'rgba(10,15,28,0.85)',
+                  border: '1px solid rgba(0,245,212,0.35)',
+                  borderRadius: 12,
+                  padding: '10px 12px',
+                  color: 'white',
+                  fontSize: 13,
+                  boxShadow: '0 8px 25px rgba(0, 245, 212, 0.15)'
+                }}
+              >
+                <div style={{ fontWeight: 700, color: '#00f5d4', marginBottom: 4 }}>{a.title}</div>
+                {a.lines?.map((t, i2) => (
+                  <div key={i2} style={{ opacity: 0.9 }}>{t}</div>
+                ))}
+              </div>
+            ))}
+          </div>
+        )}
      </motion.div>

      {/* 进度指示器 */}