diff --git a/packages/plugin-rsc/e2e/nested-rsc-css-hmr.test.ts b/packages/plugin-rsc/e2e/nested-rsc-css-hmr.test.ts
new file mode 100644
index 000000000..87b4d6b77
--- /dev/null
+++ b/packages/plugin-rsc/e2e/nested-rsc-css-hmr.test.ts
@@ -0,0 +1,169 @@
+import { expect, test } from '@playwright/test'
+import { useFixture } from './fixture'
+import { expectNoReload, waitForHydration } from './helper'
+
+// Covers CSS HMR for server-only components rendered via nested Flight stream
+// (renderToReadableStream + createFromReadableStream — TanStack Start's
+// createServerFn / renderServerComponent shape)
+// Fixture uses cssLinkPrecedence: false so React 19 Float dedup/swap is off
+// and raw HMR path is exercised
+test.describe('nested-rsc-css-hmr', () => {
+  const f = useFixture({
+    root: 'examples/nested-rsc-css-hmr',
+    mode: 'dev',
+  })
+
+  test('css hmr through nested RSC Flight stream', async ({ page }) => {
+    await page.goto(f.url())
+    await waitForHydration(page)
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(255, 165, 0)',
+    )
+
+    await using _ = await expectNoReload(page)
+    const editor = f.createEditor('src/nested-rsc/inner.css')
+    editor.edit((s) => s.replaceAll('rgb(255, 165, 0)', 'rgb(0, 165, 255)'))
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(0, 165, 255)',
+    )
+    // Revert is load-bearing: naive fix lands edit 1 but wedges Vite's
+    // Promise.all racing React's <link> reconcile, blocking later rsc:update
+    editor.reset()
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(255, 165, 0)',
+    )
+  })
+
+  // Rule removal (not just value change) checks the unmount path: old <link>
+  // must drop, else the cascade keeps the stale rule
+  test('round-trip with property removal does not leave stale link', async ({
+    page,
+  }) => {
+    await page.goto(f.url())
+    await waitForHydration(page)
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(255, 165, 0)',
+    )
+
+    // [data-rsc-css-href] scopes to RSC-emitted links, ignores Vite/React
+    // injections
+    // Two on load: outer Root collectCss + nested Flight collectCss
+    // Bug shape is "grows per edit", so assert equal-to-initial, not equal-to-1
+    const innerLinks = page.locator(
+      'link[rel="stylesheet"][data-rsc-css-href*="inner.css"]',
+    )
+    const initialLinkCount = await innerLinks.count()
+    expect(initialLinkCount).toBeGreaterThan(0)
+
+    await using _ = await expectNoReload(page)
+    const editor = f.createEditor('src/nested-rsc/inner.css')
+
+    // Edit 1: change value
+    editor.edit((s) => s.replaceAll('rgb(255, 165, 0)', 'rgb(0, 165, 255)'))
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(0, 165, 255)',
+    )
+    await expect(innerLinks).toHaveCount(initialLinkCount)
+
+    // Edit 2: remove rule — falls back to :root color from index.css
+    // (rgb(33, 53, 71)) — stale <link> would keep the blue
+    editor.edit((s) =>
+      s.replaceAll(
+        'color: rgb(0, 165, 255);',
+        '/* color: rgb(0, 165, 255); */',
+      ),
+    )
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(33, 53, 71)',
+    )
+    await expect(innerLinks).toHaveCount(initialLinkCount)
+
+    // Edit 3: revert — back to original orange
+    editor.reset()
+    await expect(page.locator('.test-nested-rsc-inner')).toHaveCSS(
+      'color',
+      'rgb(255, 165, 0)',
+    )
+    await expect(innerLinks).toHaveCount(initialLinkCount)
+  })
+
+  // card.module.css reached from RSC graph (card.tsx server component) and
+  // client graph (client-tracker.tsx 'use client' side-effect import) — shape
+  // TanStack Start hits when a route re-declares an RSC-owned stylesheet on
+  // the client
+  // Exercises the hasClientJsImporter branch of hotUpdate: fix filters the
+  // CSS-typed module out of the HMR payload (so Vite's default client HMR
+  // doesn't cloneNode+mutate the RSC <link>) while keeping the JS-typed
+  // wrapper so updateStyle() keeps refreshing <style data-vite-dev-id>
+  // .module.css on purpose — plain .css has no JS wrapper to keep
+  // Tests guard the config shape; they don't repro the (timing-sensitive)
+  // hydration race
+  test('css module reached by both RSC and client graphs hot-updates across edits', async ({
+    page,
+  }) => {
+    await page.goto(f.url())
+    await waitForHydration(page)
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'color',
+      'rgb(128, 0, 128)',
+    )
+
+    await using _ = await expectNoReload(page)
+    const editor = f.createEditor('src/shared-graph/card.module.css')
+
+    editor.edit((s) => s.replaceAll('rgb(128, 0, 128)', 'rgb(255, 0, 0)'))
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'color',
+      'rgb(255, 0, 0)',
+    )
+
+    editor.edit((s) => s.replaceAll('rgb(255, 0, 0)', 'rgb(0, 0, 255)'))
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'color',
+      'rgb(0, 0, 255)',
+    )
+
+    editor.reset()
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'color',
+      'rgb(128, 0, 128)',
+    )
+  })
+
+  // Covers the "keep JS wrapper in the HMR payload" half: without wrapper
+  // self-accept, removed rules stay live on <style data-vite-dev-id>
+  test('removing a rule from the shared css module falls through the cascade', async ({
+    page,
+  }) => {
+    await page.goto(f.url())
+    await waitForHydration(page)
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'text-transform',
+      'uppercase',
+    )
+
+    await using _ = await expectNoReload(page)
+    const editor = f.createEditor('src/shared-graph/card.module.css')
+    editor.edit((s) =>
+      s.replaceAll(
+        'text-transform: uppercase;',
+        '/* text-transform: removed */',
+      ),
+    )
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'text-transform',
+      'none',
+    )
+    editor.reset()
+    await expect(page.locator('[data-testid="shared-graph-card"]')).toHaveCSS(
+      'text-transform',
+      'uppercase',
+    )
+  })
+})
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/.gitignore b/packages/plugin-rsc/examples/nested-rsc-css-hmr/.gitignore
new file mode 100644
index 000000000..f06235c46
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+dist
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/README.md b/packages/plugin-rsc/examples/nested-rsc-css-hmr/README.md
new file mode 100644
index 000000000..cd1117106
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/README.md
@@ -0,0 +1,40 @@
+# Vite + RSC
+
+This example shows how to set up a React application with [Server Component](https://react.dev/reference/rsc/server-components) features on Vite using [`@vitejs/plugin-rsc`](https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-rsc).
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/vitejs/vite-plugin-react/tree/main/packages/plugin-rsc/examples/starter)
+
+```sh
+# run dev server
+npm run dev
+
+# build for production and preview
+npm run build
+npm run preview
+```
+
+## API usage
+
+See [`@vitejs/plugin-rsc`](https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-rsc) for the documentation.
+
+- [`vite.config.ts`](./vite.config.ts)
+  - `@vitejs/plugin-rsc/plugin`
+- [`./src/framework/entry.rsc.tsx`](./src/framework/entry.rsc.tsx)
+  - `@vitejs/plugin-rsc/rsc`
+  - `import.meta.viteRsc.loadModule`
+- [`./src/framework/entry.ssr.tsx`](./src/framework/entry.ssr.tsx)
+  - `@vitejs/plugin-rsc/ssr`
+  - `import.meta.viteRsc.loadBootstrapScriptContent`
+  - `rsc-html-stream/server`
+- [`./src/framework/entry.browser.tsx`](./src/framework/entry.browser.tsx)
+  - `@vitejs/plugin-rsc/browser`
+  - `rsc-html-stream/client`
+
+## Notes
+
+- [`./src/framework/entry.{browser,rsc,ssr}.tsx`](./src/framework) (with inline comments) provides an overview of how low level RSC (React flight) API can be used to build RSC framework.
+- You can use [`vite-plugin-inspect`](https://github.com/antfu-collective/vite-plugin-inspect) to understand how `"use client"` and `"use server"` directives are transformed internally.
+
+## Deployment
+
+See [vite-plugin-rsc-deploy-example](https://github.com/hi-ogawa/vite-plugin-rsc-deploy-example)
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/package.json b/packages/plugin-rsc/examples/nested-rsc-css-hmr/package.json
new file mode 100644
index 000000000..762b9f681
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/package.json
@@ -0,0 +1,24 @@
+{
+  "name": "@vitejs/plugin-rsc-examples-nested-rsc-css-hmr",
+  "version": "0.0.0",
+  "private": true,
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "latest",
+    "@vitejs/plugin-rsc": "latest",
+    "rsc-html-stream": "^0.0.7",
+    "vite": "^8.0.8"
+  }
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/public/vite.svg b/packages/plugin-rsc/examples/nested-rsc-css-hmr/public/vite.svg
new file mode 100644
index 000000000..e7b8dfb1b
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/public/vite.svg
@@ -0,0 +1 @@
+<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="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
\ No newline at end of file
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/action.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/action.tsx
new file mode 100644
index 000000000..4fc55d65b
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/action.tsx
@@ -0,0 +1,11 @@
+'use server'
+
+let serverCounter = 0
+
+export async function getServerCounter() {
+  return serverCounter
+}
+
+export async function updateServerCounter(change: number) {
+  serverCounter += change
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/assets/react.svg b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/assets/react.svg
new file mode 100644
index 000000000..6c87de9bb
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/assets/react.svg
@@ -0,0 +1 @@
+<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>
\ No newline at end of file
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/client.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/client.tsx
new file mode 100644
index 000000000..29bb5d367
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/client.tsx
@@ -0,0 +1,13 @@
+'use client'
+
+import React from 'react'
+
+export function ClientCounter() {
+  const [count, setCount] = React.useState(0)
+
+  return (
+    <button onClick={() => setCount((count) => count + 1)}>
+      Client Counter: {count}
+    </button>
+  )
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.browser.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.browser.tsx
new file mode 100644
index 000000000..5b48ebdfa
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.browser.tsx
@@ -0,0 +1,138 @@
+import {
+  createFromReadableStream,
+  createFromFetch,
+  setServerCallback,
+  createTemporaryReferenceSet,
+  encodeReply,
+} from '@vitejs/plugin-rsc/browser'
+import React from 'react'
+import { createRoot, hydrateRoot } from 'react-dom/client'
+import { rscStream } from 'rsc-html-stream/client'
+import type { RscPayload } from './entry.rsc'
+import { GlobalErrorBoundary } from './error-boundary'
+import { createRscRenderRequest } from './request'
+
+async function main() {
+  // stash `setPayload` function to trigger re-rendering
+  // from outside of `BrowserRoot` component (e.g. server function call, navigation, hmr)
+  let setPayload: (v: RscPayload) => void
+
+  // deserialize RSC stream back to React VDOM for CSR
+  const initialPayload = await createFromReadableStream<RscPayload>(
+    // initial RSC stream is injected in SSR stream as <script>...FLIGHT_DATA...</script>
+    rscStream,
+  )
+
+  // browser root component to (re-)render RSC payload as state
+  function BrowserRoot() {
+    const [payload, setPayload_] = React.useState(initialPayload)
+
+    React.useEffect(() => {
+      setPayload = (v) => React.startTransition(() => setPayload_(v))
+    }, [setPayload_])
+
+    // re-fetch/render on client side navigation
+    React.useEffect(() => {
+      return listenNavigation(() => fetchRscPayload())
+    }, [])
+
+    return payload.root
+  }
+
+  // re-fetch RSC and trigger re-rendering
+  async function fetchRscPayload() {
+    const renderRequest = createRscRenderRequest(window.location.href)
+    const payload = await createFromFetch<RscPayload>(fetch(renderRequest))
+    setPayload(payload)
+  }
+
+  // register a handler which will be internally called by React
+  // on server function request after hydration.
+  setServerCallback(async (id, args) => {
+    const temporaryReferences = createTemporaryReferenceSet()
+    const renderRequest = createRscRenderRequest(window.location.href, {
+      id,
+      body: await encodeReply(args, { temporaryReferences }),
+    })
+    const payload = await createFromFetch<RscPayload>(fetch(renderRequest), {
+      temporaryReferences,
+    })
+    setPayload(payload)
+    const { ok, data } = payload.returnValue!
+    if (!ok) throw data
+    return data
+  })
+
+  // hydration
+  const browserRoot = (
+    <React.StrictMode>
+      <GlobalErrorBoundary>
+        <BrowserRoot />
+      </GlobalErrorBoundary>
+    </React.StrictMode>
+  )
+  if ('__NO_HYDRATE' in globalThis) {
+    createRoot(document).render(browserRoot)
+  } else {
+    hydrateRoot(document, browserRoot, {
+      formState: initialPayload.formState,
+    })
+  }
+
+  // implement server HMR by triggering re-fetch/render of RSC upon server code change
+  if (import.meta.hot) {
+    import.meta.hot.on('rsc:update', () => {
+      fetchRscPayload()
+    })
+  }
+}
+
+// a little helper to setup events interception for client side navigation
+function listenNavigation(onNavigation: () => void) {
+  window.addEventListener('popstate', onNavigation)
+
+  const oldPushState = window.history.pushState
+  window.history.pushState = function (...args) {
+    const res = oldPushState.apply(this, args)
+    onNavigation()
+    return res
+  }
+
+  const oldReplaceState = window.history.replaceState
+  window.history.replaceState = function (...args) {
+    const res = oldReplaceState.apply(this, args)
+    onNavigation()
+    return res
+  }
+
+  function onClick(e: MouseEvent) {
+    let link = (e.target as Element).closest('a')
+    if (
+      link &&
+      link instanceof HTMLAnchorElement &&
+      link.href &&
+      (!link.target || link.target === '_self') &&
+      link.origin === location.origin &&
+      !link.hasAttribute('download') &&
+      e.button === 0 && // left clicks only
+      !e.metaKey && // open in new tab (mac)
+      !e.ctrlKey && // open in new tab (windows)
+      !e.altKey && // download
+      !e.shiftKey &&
+      !e.defaultPrevented
+    ) {
+      e.preventDefault()
+      history.pushState(null, '', link.href)
+    }
+  }
+  document.addEventListener('click', onClick)
+
+  return () => {
+    document.removeEventListener('click', onClick)
+    window.removeEventListener('popstate', onNavigation)
+    window.history.pushState = oldPushState
+    window.history.replaceState = oldReplaceState
+  }
+}
+
+main()
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.rsc.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.rsc.tsx
new file mode 100644
index 000000000..c9cf5c4b3
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.rsc.tsx
@@ -0,0 +1,122 @@
+import {
+  renderToReadableStream,
+  createTemporaryReferenceSet,
+  decodeReply,
+  loadServerAction,
+  decodeAction,
+  decodeFormState,
+} from '@vitejs/plugin-rsc/rsc'
+import type { ReactFormState } from 'react-dom/client'
+import { Root } from '../root.tsx'
+import { parseRenderRequest } from './request.tsx'
+
+// The schema of payload which is serialized into RSC stream on rsc environment
+// and deserialized on ssr/client environments.
+export type RscPayload = {
+  // this demo renders/serializes/deserizlies entire root html element
+  // but this mechanism can be changed to render/fetch different parts of components
+  // based on your own route conventions.
+  root: React.ReactNode
+  // server action return value of non-progressive enhancement case
+  returnValue?: { ok: boolean; data: unknown }
+  // server action form state (e.g. useActionState) of progressive enhancement case
+  formState?: ReactFormState
+}
+
+// the plugin by default assumes `rsc` entry having default export of request handler.
+// however, how server entries are executed can be customized by registering own server handler.
+export default { fetch: handler }
+
+async function handler(request: Request): Promise<Response> {
+  // differentiate RSC, SSR, action, etc.
+  const renderRequest = parseRenderRequest(request)
+  request = renderRequest.request
+
+  // handle server function request
+  let returnValue: RscPayload['returnValue'] | undefined
+  let formState: ReactFormState | undefined
+  let temporaryReferences: unknown | undefined
+  let actionStatus: number | undefined
+  if (renderRequest.isAction === true) {
+    if (renderRequest.actionId) {
+      // action is called via `ReactClient.setServerCallback`.
+      const contentType = request.headers.get('content-type')
+      const body = contentType?.startsWith('multipart/form-data')
+        ? await request.formData()
+        : await request.text()
+      temporaryReferences = createTemporaryReferenceSet()
+      const args = await decodeReply(body, { temporaryReferences })
+      const action = await loadServerAction(renderRequest.actionId)
+      try {
+        const data = await action.apply(null, args)
+        returnValue = { ok: true, data }
+      } catch (e) {
+        returnValue = { ok: false, data: e }
+        actionStatus = 500
+      }
+    } else {
+      // otherwise server function is called via `<form action={...}>`
+      // before hydration (e.g. when javascript is disabled).
+      // aka progressive enhancement.
+      const formData = await request.formData()
+      const decodedAction = await decodeAction(formData)
+      try {
+        const result = await decodedAction()
+        formState = await decodeFormState(result, formData)
+      } catch (e) {
+        // there's no single general obvious way to surface this error,
+        // so explicitly return classic 500 response.
+        return new Response('Internal Server Error: server action failed', {
+          status: 500,
+        })
+      }
+    }
+  }
+
+  // serialization from React VDOM tree to RSC stream.
+  // we render RSC stream after handling server function request
+  // so that new render reflects updated state from server function call
+  // to achieve single round trip to mutate and fetch from server.
+  const rscPayload: RscPayload = {
+    root: <Root url={renderRequest.url} />,
+    formState,
+    returnValue,
+  }
+  const rscOptions = { temporaryReferences }
+  const rscStream = renderToReadableStream<RscPayload>(rscPayload, rscOptions)
+
+  // Respond RSC stream without HTML rendering as decided by `RenderRequest`
+  if (renderRequest.isRsc) {
+    return new Response(rscStream, {
+      status: actionStatus,
+      headers: {
+        'content-type': 'text/x-component;charset=utf-8',
+      },
+    })
+  }
+
+  // Delegate to SSR environment for html rendering.
+  // The plugin provides `loadModule` helper to allow loading SSR environment entry module
+  // in RSC environment. however this can be customized by implementing own runtime communication
+  // e.g. `@cloudflare/vite-plugin`'s service binding.
+  const ssrEntryModule = await import.meta.viteRsc.loadModule<
+    typeof import('./entry.ssr.tsx')
+  >('ssr', 'index')
+  const ssrResult = await ssrEntryModule.renderHTML(rscStream, {
+    formState,
+    // allow quick simulation of javascript disabled browser
+    debugNojs: renderRequest.url.searchParams.has('__nojs'),
+  })
+
+  // respond html
+  return new Response(ssrResult.stream, {
+    status: ssrResult.status,
+    headers: {
+      'Content-type': 'text/html',
+    },
+  })
+}
+
+if (import.meta.hot) {
+  import.meta.hot.accept()
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.ssr.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.ssr.tsx
new file mode 100644
index 000000000..7fc5a9564
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/entry.ssr.tsx
@@ -0,0 +1,74 @@
+import { createFromReadableStream } from '@vitejs/plugin-rsc/ssr'
+import React from 'react'
+import type { ReactFormState } from 'react-dom/client'
+import { renderToReadableStream } from 'react-dom/server.edge'
+import { injectRSCPayload } from 'rsc-html-stream/server'
+import type { RscPayload } from './entry.rsc'
+
+export async function renderHTML(
+  rscStream: ReadableStream<Uint8Array>,
+  options: {
+    formState?: ReactFormState
+    nonce?: string
+    debugNojs?: boolean
+  },
+): Promise<{ stream: ReadableStream<Uint8Array>; status?: number }> {
+  // duplicate one RSC stream into two.
+  // - one for SSR (ReactClient.createFromReadableStream below)
+  // - another for browser hydration payload by injecting <script>...FLIGHT_DATA...</script>.
+  const [rscStream1, rscStream2] = rscStream.tee()
+
+  // deserialize RSC stream back to React VDOM
+  let payload: Promise<RscPayload> | undefined
+  function SsrRoot() {
+    // deserialization needs to be kicked off inside ReactDOMServer context
+    // for ReactDomServer preinit/preloading to work
+    payload ??= createFromReadableStream<RscPayload>(rscStream1)
+    return React.use(payload).root
+  }
+
+  // render html (traditional SSR)
+  const bootstrapScriptContent =
+    await import.meta.viteRsc.loadBootstrapScriptContent('index')
+  let htmlStream: ReadableStream<Uint8Array>
+  let status: number | undefined
+  try {
+    htmlStream = await renderToReadableStream(<SsrRoot />, {
+      bootstrapScriptContent: options?.debugNojs
+        ? undefined
+        : bootstrapScriptContent,
+      nonce: options?.nonce,
+      formState: options?.formState,
+    })
+  } catch (e) {
+    // fallback to render an empty shell and run pure CSR on browser,
+    // which can replay server component error and trigger error boundary.
+    status = 500
+    htmlStream = await renderToReadableStream(
+      <html>
+        <body>
+          <noscript>Internal Server Error: SSR failed</noscript>
+        </body>
+      </html>,
+      {
+        bootstrapScriptContent:
+          `self.__NO_HYDRATE=1;` +
+          (options?.debugNojs ? '' : bootstrapScriptContent),
+        nonce: options?.nonce,
+      },
+    )
+  }
+
+  let responseStream: ReadableStream<Uint8Array> = htmlStream
+  if (!options?.debugNojs) {
+    // initial RSC stream is injected in HTML stream as <script>...FLIGHT_DATA...</script>
+    // using utility made by devongovett https://github.com/devongovett/rsc-html-stream
+    responseStream = responseStream.pipeThrough(
+      injectRSCPayload(rscStream2, {
+        nonce: options?.nonce,
+      }),
+    )
+  }
+
+  return { stream: responseStream, status }
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/error-boundary.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/error-boundary.tsx
new file mode 100644
index 000000000..39d916510
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/error-boundary.tsx
@@ -0,0 +1,81 @@
+'use client'
+
+import React from 'react'
+
+// Minimal ErrorBoundary example to handle errors globally on browser
+export function GlobalErrorBoundary(props: { children?: React.ReactNode }) {
+  return (
+    <ErrorBoundary errorComponent={DefaultGlobalErrorPage}>
+      {props.children}
+    </ErrorBoundary>
+  )
+}
+
+// https://github.com/vercel/next.js/blob/33f8428f7066bf8b2ec61f025427ceb2a54c4bdf/packages/next/src/client/components/error-boundary.tsx
+// https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary
+class ErrorBoundary extends React.Component<{
+  children?: React.ReactNode
+  errorComponent: React.FC<{
+    error: Error
+    reset: () => void
+  }>
+}> {
+  state: { error?: Error } = {}
+
+  static getDerivedStateFromError(error: Error) {
+    return { error }
+  }
+
+  reset = () => {
+    this.setState({ error: null })
+  }
+
+  render() {
+    const error = this.state.error
+    if (error) {
+      return <this.props.errorComponent error={error} reset={this.reset} />
+    }
+    return this.props.children
+  }
+}
+
+// https://github.com/vercel/next.js/blob/677c9b372faef680d17e9ba224743f44e1107661/packages/next/src/build/webpack/loaders/next-app-loader.ts#L73
+// https://github.com/vercel/next.js/blob/677c9b372faef680d17e9ba224743f44e1107661/packages/next/src/client/components/error-boundary.tsx#L145
+function DefaultGlobalErrorPage(props: { error: Error; reset: () => void }) {
+  return (
+    <html>
+      <head>
+        <title>Unexpected Error</title>
+      </head>
+      <body
+        style={{
+          height: '100vh',
+          display: 'flex',
+          flexDirection: 'column',
+          placeContent: 'center',
+          placeItems: 'center',
+          fontSize: '16px',
+          fontWeight: 400,
+          lineHeight: '24px',
+        }}
+      >
+        <p>Caught an unexpected error</p>
+        <pre>
+          Error:{' '}
+          {import.meta.env.DEV && 'message' in props.error
+            ? props.error.message
+            : '(Unknown)'}
+        </pre>
+        <button
+          onClick={() => {
+            React.startTransition(() => {
+              props.reset()
+            })
+          }}
+        >
+          Reset
+        </button>
+      </body>
+    </html>
+  )
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/request.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/request.tsx
new file mode 100644
index 000000000..4c7c666e8
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/framework/request.tsx
@@ -0,0 +1,58 @@
+// Framework conventions (arbitrary choices for this demo):
+// - Use `_.rsc` URL suffix to differentiate RSC requests from SSR requests
+// - Use `x-rsc-action` header to pass server action ID
+const URL_POSTFIX = '_.rsc'
+const HEADER_ACTION_ID = 'x-rsc-action'
+
+// Parsed request information used to route between RSC/SSR rendering and action handling.
+// Created by parseRenderRequest() from incoming HTTP requests.
+type RenderRequest = {
+  isRsc: boolean // true if request should return RSC payload (via _.rsc suffix)
+  isAction: boolean // true if this is a server action call (POST request)
+  actionId?: string // server action ID from x-rsc-action header
+  request: Request // normalized Request with _.rsc suffix removed from URL
+  url: URL // normalized URL with _.rsc suffix removed
+}
+
+export function createRscRenderRequest(
+  urlString: string,
+  action?: { id: string; body: BodyInit },
+): Request {
+  const url = new URL(urlString)
+  url.pathname += URL_POSTFIX
+  const headers = new Headers()
+  if (action) {
+    headers.set(HEADER_ACTION_ID, action.id)
+  }
+  return new Request(url.toString(), {
+    method: action ? 'POST' : 'GET',
+    headers,
+    body: action?.body,
+  })
+}
+
+export function parseRenderRequest(request: Request): RenderRequest {
+  const url = new URL(request.url)
+  const isAction = request.method === 'POST'
+  if (url.pathname.endsWith(URL_POSTFIX)) {
+    url.pathname = url.pathname.slice(0, -URL_POSTFIX.length)
+    const actionId = request.headers.get(HEADER_ACTION_ID) || undefined
+    if (request.method === 'POST' && !actionId) {
+      throw new Error('Missing action id header for RSC action request')
+    }
+    return {
+      isRsc: true,
+      isAction,
+      actionId,
+      request: new Request(url, request),
+      url,
+    }
+  } else {
+    return {
+      isRsc: false,
+      isAction,
+      request,
+      url,
+    }
+  }
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/index.css b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/index.css
new file mode 100644
index 000000000..f4d2128c0
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/index.css
@@ -0,0 +1,112 @@
+:root {
+  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}
+
+#root {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+.logo {
+  height: 6em;
+  padding: 1.5em;
+  will-change: filter;
+  transition: filter 300ms;
+}
+.logo:hover {
+  filter: drop-shadow(0 0 2em #646cffaa);
+}
+.logo.react:hover {
+  filter: drop-shadow(0 0 2em #61dafbaa);
+}
+
+@keyframes logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  a:nth-of-type(2) .logo {
+    animation: logo-spin infinite 20s linear;
+  }
+}
+
+.card {
+  padding: 1rem;
+}
+
+.read-the-docs {
+  color: #888;
+  text-align: left;
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/inner.css b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/inner.css
new file mode 100644
index 000000000..724c910c6
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/inner.css
@@ -0,0 +1,3 @@
+.test-nested-rsc-inner {
+  color: rgb(255, 165, 0);
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/inner.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/inner.tsx
new file mode 100644
index 000000000..0e4c2e798
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/inner.tsx
@@ -0,0 +1,5 @@
+import './inner.css'
+
+export function TestNestedRscInner() {
+  return <div className="test-nested-rsc-inner">test-nested-rsc-inner</div>
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/server.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/server.tsx
new file mode 100644
index 000000000..3b60e2b01
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/nested-rsc/server.tsx
@@ -0,0 +1,16 @@
+import {
+  createFromReadableStream,
+  renderToReadableStream,
+} from '@vitejs/plugin-rsc/rsc'
+import { TestNestedRscInner } from './inner'
+
+// Reproduces the framework pattern (e.g. TanStack Start's
+// `createServerFn` + `renderServerComponent`) where a server component
+// whose module lives only in the `rsc` environment is rendered through
+// a nested Flight stream and embedded back into the outer tree.
+export function TestNestedRsc() {
+  const original = <TestNestedRscInner />
+  const stream = renderToReadableStream(original)
+  const deserialized = createFromReadableStream<typeof original>(stream)
+  return <div>test-nested-rsc:{deserialized}</div>
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/root.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/root.tsx
new file mode 100644
index 000000000..618bd566c
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/root.tsx
@@ -0,0 +1,81 @@
+import './index.css' // css import is automatically injected in exported server components
+import viteLogo from '/vite.svg'
+import { getServerCounter, updateServerCounter } from './action.tsx'
+import reactLogo from './assets/react.svg'
+import { ClientCounter } from './client.tsx'
+import { TestNestedRsc } from './nested-rsc/server.tsx'
+import { SharedGraphCard } from './shared-graph/card.tsx'
+import { SharedGraphClientTracker } from './shared-graph/client-tracker.tsx'
+
+export function Root(props: { url: URL }) {
+  return (
+    <html lang="en">
+      <head>
+        <meta charSet="UTF-8" />
+        <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Vite + RSC</title>
+      </head>
+      <body>
+        <App {...props} />
+      </body>
+    </html>
+  )
+}
+
+function App(props: { url: URL }) {
+  return (
+    <div id="root">
+      <div>
+        <a href="https://vite.dev" target="_blank">
+          <img src={viteLogo} className="logo" alt="Vite logo" />
+        </a>
+        <a
+          href="https://react.dev/reference/rsc/server-components"
+          target="_blank"
+        >
+          <img src={reactLogo} className="logo react" alt="React logo" />
+        </a>
+      </div>
+      <h1>Vite + RSC</h1>
+      <div className="card">
+        <ClientCounter />
+      </div>
+      <div className="card">
+        <form action={updateServerCounter.bind(null, 1)}>
+          <button>Server Counter: {getServerCounter()}</button>
+        </form>
+      </div>
+      <div className="card">Request URL: {props.url?.href}</div>
+      <div className="card">
+        <TestNestedRsc />
+      </div>
+      <div className="card">
+        <SharedGraphCard />
+        <SharedGraphClientTracker />
+      </div>
+      <ul className="read-the-docs">
+        <li>
+          Edit <code>src/client.tsx</code> to test client HMR.
+        </li>
+        <li>
+          Edit <code>src/root.tsx</code> to test server HMR.
+        </li>
+        <li>
+          Visit{' '}
+          <a href="./_.rsc" target="_blank">
+            <code>_.rsc</code>
+          </a>{' '}
+          to view RSC stream payload.
+        </li>
+        <li>
+          Visit{' '}
+          <a href="?__nojs" target="_blank">
+            <code>?__nojs</code>
+          </a>{' '}
+          to test server action without js enabled.
+        </li>
+      </ul>
+    </div>
+  )
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/card.module.css b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/card.module.css
new file mode 100644
index 000000000..95b3b35c2
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/card.module.css
@@ -0,0 +1,5 @@
+.card {
+  padding: 12px;
+  color: rgb(128, 0, 128);
+  text-transform: uppercase;
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/card.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/card.tsx
new file mode 100644
index 000000000..c7e78fc24
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/card.tsx
@@ -0,0 +1,9 @@
+import styles from './card.module.css'
+
+export function SharedGraphCard() {
+  return (
+    <div className={styles.card} data-testid="shared-graph-card">
+      shared-graph-card
+    </div>
+  )
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/client-tracker.tsx b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/client-tracker.tsx
new file mode 100644
index 000000000..7ba7ef33c
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/src/shared-graph/client-tracker.tsx
@@ -0,0 +1,15 @@
+'use client'
+
+// Side-effect import of a CSS module that's also consumed by an RSC
+// component (`./card.tsx`). The import has no runtime consumer on the
+// client — its only job is to put `card.module.css` into the client
+// environment's module graph so Vite's `hasClientJsImporter` flag
+// flips to true for that file. This mirrors the pattern a route file
+// uses in frameworks like TanStack Start, where an RSC-owned
+// stylesheet is re-declared on the client so Vite's HMR runtime
+// tracks it during dev.
+import './card.module.css'
+
+export function SharedGraphClientTracker() {
+  return null
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/tsconfig.json b/packages/plugin-rsc/examples/nested-rsc-css-hmr/tsconfig.json
new file mode 100644
index 000000000..b212cd7a7
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/tsconfig.json
@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "erasableSyntaxOnly": true,
+    "allowImportingTsExtensions": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "skipLibCheck": true,
+    "verbatimModuleSyntax": true,
+    "noEmit": true,
+    "moduleResolution": "Bundler",
+    "module": "ESNext",
+    "target": "ESNext",
+    "lib": ["ESNext", "DOM"],
+    "types": ["vite/client", "@vitejs/plugin-rsc/types"],
+    "jsx": "react-jsx"
+  }
+}
diff --git a/packages/plugin-rsc/examples/nested-rsc-css-hmr/vite.config.ts b/packages/plugin-rsc/examples/nested-rsc-css-hmr/vite.config.ts
new file mode 100644
index 000000000..41d6dd9e3
--- /dev/null
+++ b/packages/plugin-rsc/examples/nested-rsc-css-hmr/vite.config.ts
@@ -0,0 +1,70 @@
+import react from '@vitejs/plugin-react'
+import rsc from '@vitejs/plugin-rsc'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  plugins: [
+    rsc({
+      // Mirror TanStack Start's config so plugin-rsc's emitted <link> has no
+      // `precedence` attribute — this disables React 19's resource-dedupe path
+      // that would otherwise paper over the missing `?t=` cache-buster.
+      cssLinkPrecedence: false,
+    }),
+
+    // use any of react plugins https://github.com/vitejs/vite-plugin-react
+    // to enable client component HMR
+    react(),
+
+    // use https://github.com/antfu-collective/vite-plugin-inspect
+    // to understand internal transforms required for RSC.
+    // import("vite-plugin-inspect").then(m => m.default()),
+  ],
+
+  // specify entry point for each environment.
+  // (currently the plugin assumes `rollupOptions.input.index` for some features.)
+  environments: {
+    // `rsc` environment loads modules with `react-server` condition.
+    // this environment is responsible for:
+    // - RSC stream serialization (React VDOM -> RSC stream)
+    // - server functions handling
+    rsc: {
+      build: {
+        rollupOptions: {
+          input: {
+            index: './src/framework/entry.rsc.tsx',
+          },
+        },
+      },
+    },
+
+    // `ssr` environment loads modules without `react-server` condition.
+    // this environment is responsible for:
+    // - RSC stream deserialization (RSC stream -> React VDOM)
+    // - traditional SSR (React VDOM -> HTML string/stream)
+    ssr: {
+      build: {
+        rollupOptions: {
+          input: {
+            index: './src/framework/entry.ssr.tsx',
+          },
+        },
+      },
+    },
+
+    // client environment is used for hydration and client-side rendering
+    // this environment is responsible for:
+    // - RSC stream deserialization (RSC stream -> React VDOM)
+    // - traditional CSR (React VDOM -> Browser DOM tree mount/hydration)
+    // - refetch and re-render RSC
+    // - calling server functions
+    client: {
+      build: {
+        rollupOptions: {
+          input: {
+            index: './src/framework/entry.browser.tsx',
+          },
+        },
+      },
+    },
+  },
+})
diff --git a/packages/plugin-rsc/src/plugin.ts b/packages/plugin-rsc/src/plugin.ts
index 9141febba..5c6124e2a 100644
--- a/packages/plugin-rsc/src/plugin.ts
+++ b/packages/plugin-rsc/src/plugin.ts
@@ -60,6 +60,7 @@ import {
   cleanUrl,
   directRequestRE,
   evalValue,
+  injectQuery,
   normalizeViteImportAnalysisUrl,
   prepareError,
 } from './plugins/vite-utils'
@@ -722,7 +723,57 @@ export default function vitePluginRsc(
       async hotUpdate(ctx) {
         if (isCSSRequest(ctx.file)) {
           if (this.environment.name === 'client') {
-            return
+            // Default (cssLinkPrecedence: true) — Vite's client CSS HMR
+            // already handles the swap
+            if (rscPluginOptions.cssLinkPrecedence !== false) return
+
+            // Only relevant when CSS is reachable from the RSC graph —
+            // otherwise Vite's default client CSS HMR applies
+            const rscMod =
+              ctx.server.environments.rsc?.moduleGraph.getModuleById(ctx.file)
+            if (!rscMod) return
+
+            // Drop the CSS-typed module (e.g. `?direct`) — it drives Vite's
+            // default <link> swap (find matching <link> by path, cloneNode,
+            // rewrite href with `?t=<timestamp>`) which picks up the
+            // RSC-rendered <link data-rsc-css-href> as its target
+            // RSC does its own swap (rsc:update -> Flight refetch, reconciled
+            // in place by the `css:<href>` key), so letting both run against
+            // the same <link> causes mid-render attribute mutations and
+            // later HMR edits silently drop
+            //
+            // Keep the JS-typed wrapper (the .css file served as JS when
+            // imported from JS) so Vite still emits its js-update, which
+            // re-runs updateStyle(id, content) against <style data-vite-dev-id>
+            // Without it, removing a rule (e.g. text-transform: uppercase)
+            // leaves the stale rule live on <style> and the cascade still
+            // wins over the refreshed <link>
+            return ctx.modules.filter((mod) => mod.type !== 'css')
+          } else if (this.environment.name === 'rsc') {
+            // Walk importers of the changed CSS and invalidate every derived
+            // `\0virtual:vite-rsc/css?type=rsc&...` module — those emit
+            // <link rel="stylesheet"> into the Flight stream via collectCss +
+            // normalizeViteImportAnalysisUrl
+            // Without invalidation the next render reuses the cached transform
+            // with the pre-edit href
+            // JS importers (inner.tsx, server.tsx, ...) are left alone — only
+            // the derived CSS virtual needs recomputing
+            const visited = new Set<string>()
+            const walk = (mod: EnvironmentModuleNode) => {
+              if (!mod.id || visited.has(mod.id)) return
+              visited.add(mod.id)
+              if (mod.id.startsWith('\0virtual:vite-rsc/css?')) {
+                this.environment.moduleGraph.invalidateModule(mod)
+              }
+              for (const imp of mod.importers) {
+                walk(imp)
+              }
+            }
+            for (const mod of ctx.modules) {
+              for (const imp of mod.importers) {
+                walk(imp)
+              }
+            }
           }
         }
 
@@ -2217,10 +2268,24 @@ function vitePluginRscCss(
 
     recurse(entryId)
 
-    // this doesn't include ?t= query so that RSC <link /> won't keep adding styles.
-    const hrefs = [...cssIds].map((id) =>
-      normalizeViteImportAnalysisUrl(environment, id),
-    )
+    // cssLinkPrecedence: false — without `precedence` React leaves the
+    // <link> as a regular DOM element (no auto-dedupe / resource handling)
+    // and Vite's client CSS HMR can't swap it by href-pathname match either
+    // (see hotUpdate above), so bake the HMR timestamp into the href and
+    // let the RSC-side Flight refetch drive the swap
+    // Default (true) leaves the href bare so Vite's client CSS HMR can swap
+    // the <link> in place — matches pre-fix behavior
+    const usePrecedence = rscCssOptions?.cssLinkPrecedence !== false
+    const hrefs = [...cssIds].map((id) => {
+      let url = normalizeViteImportAnalysisUrl(environment, id)
+      if (!usePrecedence && environment.config.consumer !== 'client') {
+        const mod = environment.moduleGraph.getModuleById(id)
+        if (mod && mod.lastHMRTimestamp > 0) {
+          url = injectQuery(url, `t=${mod.lastHMRTimestamp}`)
+        }
+      }
+      return url
+    })
     return { ids: [...cssIds], hrefs, visitedFiles: [...visitedFiles] }
   }
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 4e8dd3198..3ef224bac 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -623,6 +623,34 @@ importers:
         specifier: ^3.0.2
         version: 3.0.2
 
+  packages/plugin-rsc/examples/nested-rsc-css-hmr:
+    dependencies:
+      react:
+        specifier: ^19.2.5
+        version: 19.2.5
+      react-dom:
+        specifier: ^19.2.5
+        version: 19.2.5(react@19.2.5)
+    devDependencies:
+      '@types/react':
+        specifier: ^19.2.14
+        version: 19.2.14
+      '@types/react-dom':
+        specifier: ^19.2.3
+        version: 19.2.3(@types/react@19.2.14)
+      '@vitejs/plugin-react':
+        specifier: latest
+        version: link:../../../plugin-react
+      '@vitejs/plugin-rsc':
+        specifier: latest
+        version: link:../..
+      rsc-html-stream:
+        specifier: ^0.0.7
+        version: 0.0.7
+      vite:
+        specifier: ^8.0.8
+        version: 8.0.8(@types/node@24.12.2)(esbuild@0.27.3)(jiti@2.6.1)(yaml@2.8.2)
+
   packages/plugin-rsc/examples/no-ssr:
     dependencies:
       react: