diff --git a/AGENTS.md b/AGENTS.md
index f67ddb71b..e8fdb84dd 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -44,7 +44,8 @@ yarn exec cypress run
 # or
 yarn exec cypress open
 ```
-- `CHANGELOG.md` must be updated for PRs.
+- Do not update `CHANGELOG.md`; use GitHub Releases as the source of truth for
+  release notes.
 - Stylelint exists (`yarn stylelint`) but is not enabled in CI.
 
 ## Code Style & Conventions
@@ -55,6 +56,11 @@ yarn exec cypress open
   `src/assets/stylesheets/InternalStyles.scss` (and external libs in
   `ExternalStyles.scss`); avoid `rem`, prefer `em` and `--scale-factor`.
 
+## Git & Commit Guidance
+- Write descriptive commit messages that explain why a change was made.
+- When applicable, include alternatives considered and why they were not
+  chosen.
+
 ## Security & Safety Guardrails
 - Never commit secrets or real credentials; `.env`, `.env.webcomponent`, and their `*.local` variants are gitignored.
 - Never commit generated output: `build/`, `coverage/`,
@@ -66,14 +72,14 @@ yarn exec cypress open
 
 ## Common Tasks (add feature, add test, refactor, release/deploy if applicable)
 - **Add feature:** update `src/` components/hooks/redux and any affected assets;
-  ensure `CHANGELOG.md` reflects user-visible changes.
+  do not update `CHANGELOG.md`.
 - **Add test:** unit tests live under `src/` as `*.test.js`;
   e2e tests live in `cypress/e2e`; run `yarn test` or `yarn exec cypress run`.
 - **Refactor:** keep Shadow DOM styling constraints in mind; re-run `yarn lint`
   and `yarn test` after moving files or changing imports.
-- **Release/deploy:** follow the release steps in `README.md` (update
-  `CHANGELOG.md`, bump `package.json` version, PR, tag release); deploys are
-  driven by `.github/workflows/deploy.yml`.
+- **Release/deploy:** follow the release steps in `README.md` (bump
+  `package.json` version, PR, tag release); do not update `CHANGELOG.md`.
+  Deploys are driven by `.github/workflows/deploy.yml`.
 
 ## Further Reading (relative links)
 - `README.md`
diff --git a/package.json b/package.json
index 9dbc89a68..ad5d1ca04 100644
--- a/package.json
+++ b/package.json
@@ -52,7 +52,7 @@
     "node-html-parser": "^6.1.5",
     "oidc-client": "^1.11.5",
     "parse-link-header": "^2.0.0",
-    "plotly.js": "^3.0.2",
+    "plotly.js": "^3.3.1",
     "prismjs": "^1.29.0",
     "prompts": "2.4.0",
     "prop-types": "^15.8.1",
@@ -175,7 +175,7 @@
     "resolve": "1.18.1",
     "resolve-url-loader": "^3.1.2",
     "sass": "^1.51.0",
-    "sass-loader": "^10.0.0",
+    "sass-loader": "^13.3.3",
     "semver": "7.3.2",
     "style-it": "^2.1.4",
     "style-loader": "1.3.0",
diff --git a/src/assets/stylesheets/ExternalStyles.scss b/src/assets/stylesheets/ExternalStyles.scss
index 9b4f218a8..1785f03a1 100644
--- a/src/assets/stylesheets/ExternalStyles.scss
+++ b/src/assets/stylesheets/ExternalStyles.scss
@@ -1,7 +1,8 @@
-@forward "@raspberrypifoundation/design-system-react/scss/design-system-core";
+@forward "../../../node_modules/@raspberrypifoundation/design-system-react/dist/scss/design-system-core.scss";
 @use "../../../node_modules/react-tabs/style/react-tabs.css";
 @use "../../../node_modules/react-toggle/style.css";
 @use "../../../node_modules/prismjs/plugins/line-numbers/prism-line-numbers.css";
 @use "../../../node_modules/prismjs/plugins/line-highlight/prism-line-highlight.css";
-@use "../../../node_modules/material-symbols/sharp.scss";
-@use "../../../node_modules/plotly.js/src/css/style.scss" as plotlyStyle;
+@use "../../../node_modules/react-toastify/dist/ReactToastify.css";
+@use "../../../node_modules/material-symbols/sharp.css";
+@use "../../../node_modules/plotly.js/dist/plotly.css" as plotlyStyle;
diff --git a/src/assets/stylesheets/InternalStyles.scss b/src/assets/stylesheets/InternalStyles.scss
index abcecdba4..923d89be9 100644
--- a/src/assets/stylesheets/InternalStyles.scss
+++ b/src/assets/stylesheets/InternalStyles.scss
@@ -1,5 +1,3 @@
-@use "../../../node_modules/react-toastify/scss/main.scss" as *;
-
 @use "./rpf_design_system/colours" as *;
 @use "./rpf_design_system/font-size" as *;
 @use "./rpf_design_system/font-weight" as *;
diff --git a/src/projects/python-plotly.json b/src/projects/python-plotly.json
new file mode 100644
index 000000000..00421f467
--- /dev/null
+++ b/src/projects/python-plotly.json
@@ -0,0 +1,19 @@
+{
+  "identifier": "python-plotly",
+  "project_type": "python",
+  "locale": "en",
+  "name": "Python Plotly",
+  "user_id": null,
+  "instructions": null,
+  "components": [
+    {
+      "id": "42b4cdc9-d935-4a3d-b39a-32eb44c3ebfe",
+      "name": "main",
+      "extension": "py",
+      "content": "import plotly.express as px\ndf = px.data.gapminder().query(\"country=='Canada'\")\nfig = px.line(df, x=\"year\", y=\"lifeExp\", title='Life expectancy in Canada')\nfig.show()"
+    }
+  ],
+  "image_list": [],
+  "videos": [],
+  "audio": []
+}
\ No newline at end of file
diff --git a/src/web-component.html b/src/web-component.html
index 35ed202e5..5ae1fde18 100644
--- a/src/web-component.html
+++ b/src/web-component.html
@@ -63,6 +63,7 @@
       <a href="#" data-project="cool-html">cool-html</a>
       <a href="#" data-project="blank-python-starter">blank-python-starter</a>
       <a href="#" data-project="cool-python">cool-python</a>
+      <a href="#" data-project="python-plotly">python-plotly</a>
       <a href="#" data-project="blank-scratch">blank-scratch</a>
     </div>
     <div id="editor-component"></div>
diff --git a/webpack.config.js b/webpack.config.js
index 9cad844ae..c9631433b 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -49,6 +49,10 @@ module.exports = {
           {
             loader: "sass-loader",
             options: {
+              api: "modern",
+              sassOptions: {
+                loadPaths: [path.resolve(__dirname, "node_modules")],
+              },
               sourceMap: true,
             },
           },
diff --git a/yarn.lock b/yarn.lock
index 960e028d6..8377e15e2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3949,7 +3949,7 @@ __metadata:
     optimize-css-assets-webpack-plugin: "npm:5.0.4"
     parse-link-header: "npm:^2.0.0"
     path-browserify: "npm:^1.0.1"
-    plotly.js: "npm:^3.0.2"
+    plotly.js: "npm:^3.3.1"
     pnp-webpack-plugin: "npm:1.6.4"
     postcss-flexbugs-fixes: "npm:4.2.1"
     postcss-loader: "npm:3.0.0"
@@ -3987,7 +3987,7 @@ __metadata:
     resolve: "npm:1.18.1"
     resolve-url-loader: "npm:^3.1.2"
     sass: "npm:^1.51.0"
-    sass-loader: "npm:^10.0.0"
+    sass-loader: "npm:^13.3.3"
     semver: "npm:7.3.2"
     skulpt: "npm:^1.2.0"
     stream-browserify: "npm:^3.0.0"
@@ -8001,14 +8001,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"caniuse-lite@npm:^1.0.0, caniuse-lite@npm:^1.0.30000981, caniuse-lite@npm:^1.0.30001109, caniuse-lite@npm:^1.0.30001125, caniuse-lite@npm:^1.0.30001663":
-  version: 1.0.30001669
-  resolution: "caniuse-lite@npm:1.0.30001669"
-  checksum: 10/cd0b481bb997703cb7651e55666b4aa4e7b4ecf9784796e2393179a15e55c71a6abc6ff865c922bbd3bbfa4a4bf0530d8da13989b97ff8c7850c8a5bd4e00491
-  languageName: node
-  linkType: hard
-
-"caniuse-lite@npm:^1.0.30001759":
+"caniuse-lite@npm:^1.0.0, caniuse-lite@npm:^1.0.30000981, caniuse-lite@npm:^1.0.30001109, caniuse-lite@npm:^1.0.30001125, caniuse-lite@npm:^1.0.30001663, caniuse-lite@npm:^1.0.30001759":
   version: 1.0.30001769
   resolution: "caniuse-lite@npm:1.0.30001769"
   checksum: 10/4b7d087832d4330a8b1fa02cd9455bdb068ea67f1735f2aa6324d5b64b24f5079cf6349b13d209f268ffa59644b9f4f784266b780bafd877ceb83c9797ca80ba
@@ -18674,9 +18667,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"plotly.js@npm:^3.0.2":
-  version: 3.0.2
-  resolution: "plotly.js@npm:3.0.2"
+"plotly.js@npm:^3.3.1":
+  version: 3.3.1
+  resolution: "plotly.js@npm:3.3.1"
   dependencies:
     "@plotly/d3": "npm:3.8.2"
     "@plotly/d3-sankey": "npm:0.7.2"
@@ -18728,7 +18721,7 @@ __metadata:
     topojson-client: "npm:^3.1.0"
     webgl-context: "npm:^2.2.0"
     world-calendars: "npm:^1.0.4"
-  checksum: 10/60a1eb628e6d8729da875e6125b0f247ad1903fec85e10046e50cd72ba83ad732a786a4681784ee9a3dae85cb747979555cef2da4a4929b943cd5c99c2fdcb94
+  checksum: 10/0863e4eb1539402f4add29e9d0139881d2be64585c76c61ed35f15e002bc9f5e4e97a878f7ce019cf4991fa38da728afb19993bebb78a5b74f4ec1ba194d86a6
   languageName: node
   linkType: hard
 
@@ -21820,20 +21813,17 @@ __metadata:
   languageName: node
   linkType: hard
 
-"sass-loader@npm:^10.0.0":
-  version: 10.5.2
-  resolution: "sass-loader@npm:10.5.2"
+"sass-loader@npm:^13.3.3":
+  version: 13.3.3
+  resolution: "sass-loader@npm:13.3.3"
   dependencies:
-    klona: "npm:^2.0.4"
-    loader-utils: "npm:^2.0.0"
     neo-async: "npm:^2.6.2"
-    schema-utils: "npm:^3.0.0"
-    semver: "npm:^7.3.2"
   peerDependencies:
     fibers: ">= 3.1.0"
     node-sass: ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0
     sass: ^1.3.0
-    webpack: ^4.36.0 || ^5.0.0
+    sass-embedded: "*"
+    webpack: ^5.0.0
   peerDependenciesMeta:
     fibers:
       optional: true
@@ -21841,7 +21831,9 @@ __metadata:
       optional: true
     sass:
       optional: true
-  checksum: 10/27b85f852d270a5c84b95f8ba3fbc84e7cbb77a3481f3ff2b74d4ea87f2ad4cefcba70ba41412b80e62ba433c75994d4d12d323d39a24de5087b60b571a1a3c9
+    sass-embedded:
+      optional: true
+  checksum: 10/a8a8519add9f0bb2d3d1b834dbf30b1b67e22833425755a56640cc20845107850adfc6f243cdab07a5cb26ec964513b950a02dca7b1d5b3cf3659c89bf1988eb
   languageName: node
   linkType: hard