diff --git a/.changeset/twenty-toes-attack.md b/.changeset/twenty-toes-attack.md
new file mode 100644
index 0000000000..7e445839a7
--- /dev/null
+++ b/.changeset/twenty-toes-attack.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure StyleDirective and ClassDirective are marked as dynamic
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ClassDirective.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ClassDirective.js
index f4aaf77589..6cea541ea6 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ClassDirective.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ClassDirective.js
@@ -1,10 +1,13 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
 
+import { mark_subtree_dynamic } from './shared/fragment.js';
+
 /**
  * @param {AST.ClassDirective} node
  * @param {Context} context
  */
 export function ClassDirective(node, context) {
+	mark_subtree_dynamic(context.path);
 	context.next({ ...context.state, expression: node.metadata.expression });
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/StyleDirective.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/StyleDirective.js
index 8910d9eae0..7d6eb5be99 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/StyleDirective.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/StyleDirective.js
@@ -13,6 +13,8 @@ export function StyleDirective(node, context) {
 		e.style_directive_invalid_modifier(node);
 	}
 
+	mark_subtree_dynamic(context.path);
+
 	if (node.value === true) {
 		// get the binding for node.name and change the binding to state
 		let binding = context.state.scope.get(node.name);
@@ -22,8 +24,6 @@ export function StyleDirective(node, context) {
 				node.metadata.expression.has_state = true;
 			}
 		}
-
-		mark_subtree_dynamic(context.path);
 	} else {
 		context.next();
 
diff --git a/packages/svelte/tests/runtime-runes/samples/directives/_config.js b/packages/svelte/tests/runtime-runes/samples/directives/_config.js
new file mode 100644
index 0000000000..afe87e184d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/directives/_config.js
@@ -0,0 +1,12 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<div><p class="foo" style="color: red;">This text should be red with a class of foo</p></div>`,
+
+	async test({ assert, target }) {
+		const p = target.querySelector('p');
+
+		assert.equal(p?.className, `foo`);
+		assert.equal(p?.style.color, `red`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/directives/main.svelte b/packages/svelte/tests/runtime-runes/samples/directives/main.svelte
new file mode 100644
index 0000000000..96c7fed74f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/directives/main.svelte
@@ -0,0 +1,3 @@
+<div>
+	<p style:color="red" class:foo={true}>This text should be red with a class of foo</p>
+</div>